/**
 * Rule the words! KKuTu Online
 * Copyright (C) 2017 JJoriping(op@jjo.kr)
 * 
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 * 
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 * 
 * You should have received a copy of the GNU General Public License
 * along with this program. If not, see <http://www.gnu.org/licenses/>.
 */

equ{
	font-family: consolas;
	font-style: italic;
}
#Middle{
	margin-top: 35px;
}
#Intro{
	position: fixed;
	z-index: 3;
	width: 100%;
}
#Intro img{
	width: 100%;
}
	#version{
		position: absolute;
		top: 4px;
		left: 4px;
		font-size: 13px;
		text-shadow: 0px 0px 3px #000000;
	}
	#intro-text{
		position: absolute;
		top: 60%;
		left: 0px;
		width: 100%;
		font-size: 15px;
		text-align: center;
		text-shadow: 0px 0px 3px #000000;
	}
#Loading{
	position: fixed;
	padding-top: 200px;
	width: 100%;
	height: 100%;
	text-align: center;
	background-color: #232323;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 4;
}
#Top{
	background-color: #7CC4F8;
	background-image: none;
}
#Top .menu-btn{
	color: #111111;
	background-color: #7CC4F8;
	background-image: none;
}
#Top .menu-sub-btn{ color: #222222; }
#Bottom .bottom-text{ display: none; }

#facebook-menu{
	margin-top: 10px;
}
iframe{
	border: none;
}
#Yell{
	position: fixed;
	padding: 10px 0px;
	margin-top: 200px;
	width: 100%;
	font-size: 32px;
	font-weight: bold;
	text-align: center;
	text-shadow: 0px 1px 1px #141414;
	pointer-events: none;
	background-color: rgba(0, 0, 0, 0.7);
}
#ReadyBtn{
	animation: ReadyBlink 1s linear infinite;
}
#ReadyBtn:hover, #ReadyBtn.toggled{
	animation: none;
}
.product-body{ font-size: 12px; }
.deltaScore{
	width: calc(100% - 230px);
	color: #2255FF;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	text-shadow: 0px 1px 1px #000033;
	animation: ScoreGoing 2s linear 1;
}
	.bonus{ color: #6666FF; }
	.lost{ color: #F59E9E; }
.kkutu-menu{
	float: left;
	width: 100%;
	height: 30px;
}
.kkutu-menu button{
	float: left;
	border: none;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
	width: 25px;
	height: 20px;
}
	.kkutu-menu button:hover{
		margin-top: -5px;
		height: 25px;
	}
	.kkutu-menu .toggled{
		margin-top: 5px !important;
		color: #EEEEEE;
		background-color: #444444 !important;
	}
.dialog{
	display: none;
	position: fixed;
	padding: 5px;
	border-radius: 10px;
	color: #111111;
	box-shadow: 0px 1px 1px #141414;
	background-color: #EEEEEE;
	z-index: 1;
}
	.dialog-bar{ float: left; margin: 3px 0px; width: 100%; }
	.dialog-bar h4{ float: left; padding-top: 6px; width: 100px; text-align: center; }
	.dialog-bar-value{ width: calc(100% - 100px) !important; text-align: left !important; }
	.dialog-bar input, .dialog-bar select{ float: left; width: 188px; height: 14px; box-sizing: inherit; outline: none; }
	.dialog-bar label{ font-size: 13px; }
	.dialog-bar button{ float: left; }
		.dialog-opt{ float: left; width: 100px; }
	.tail-button{ margin-top: 7px; }
	.tail-button button{ float: right; margin-right: 5px; width: 80px; height: 20px; }
	.dialog .closeBtn{
		float: right;
		border-radius: 6px;
		margin-top: 1px;
		width: 12px;
		height: 12px;
		background-color: #EE5555;
	}
	.dialog .closeBtn:hover{ background-color: #EE7777; }
	.dialog-head{
		padding: 3px;
		border-bottom: 1px solid #CCCCCC;
		border-radius: 5px;
		margin-bottom: 5px;
		height: 12px;
		color: #222222;
		font-size: 11px;
		background-color: #DDDDDD;
	}
		.dialog-head .dialog-title{ float: left; cursor: move; }
#replay-players{ height: 160px; }
	.replay-player-bar{ float: left; width: 100%; }
		.replay-player-bar img{ float: left; margin-right: 3px; width: 20px; height: 20px; }
		.replay-player-bar label{ float: left; }
#ranking{
	font-size: 13px;
}
	.ranking-me{ font-weight: bold; background-color: #DDDDDD; }
	.ranking-image{ margin-right: 2px; width: 18px; height: 18px; }
.moremi{
	position: relative;
}
.moremi img{
	position: absolute;
}
.Product{
	border-radius: 0px;
	color: #111111;
	box-shadow: 0px 2px 1px #DDDDDD;
	background-color: #EEEEEE;
}
.product-title{
	border-bottom-color: #CCCCCC;
	border-radius: 5px;
	color: #222222;
	background-color: #DDDDDD;
}
.product-title i{ color: #111111; }
.dialog-front{ z-index: 2; }
#ProfileDiag .dialog-body div{ float: left; }
	.profile-moremi{ margin-right: 3px; width: 80px; height: 80px; }
	.profile-head-item{ margin: 3px 2px; width: 213px; }
		.profile-image{ margin-right: 3px; width: 20px; height: 20px; }
		.profile-level{ margin-right: 3px; width: 20px; height: 20px; }
		.profile-title{ padding-top: 1px; font-size: 15px; font-weight: bold; }
		.profile-level-text{ padding-top: 2px; font-size: 13px; }
		.profile-score-text{ float: right !important; padding-top: 3px; font-size: 11px; color: #444444; }
	.profile-record-field{ margin: 2px 0px; width: 100%; }
		.profile-field-name{ width: 35%; text-align: center; }
		.profile-field-record{ width: 32%; text-align: center; }
		.profile-field-score{ width: 32%; text-align: center; }
#RoomInfoDiag .dialog-body div{ float: left; }
	.ri-player{ margin: 2px 0px; width: 100%; }
		.rip-moremi{ margin-right: 3px; width: 40px; height: 40px; }
		.rip-master{ font-weight: bold; color: #E14E2D; }
		.rip-title{ width: calc(100% - 43px); }
		.rip-team{ margin: 3px 3px 0px 0px; width: 44px; text-align: center; }
		.rip-form{ margin-top: 3px; width: calc(100% - 90px); }
.UserListBox{
	width: calc(100% - 10px);
	height: 100px;
}
	.UserListBox div{ float: left; }
	.UserListBox .product-body{ width: calc(100% - 10px); height: 70px; overflow-x: hidden; overflow-y: scroll; }
	.users-item{ width: 100%; }
		.users-image{ margin: 1px; width: 18px; height: 18px; }
		.users-level{ margin: 1px; width: 18px; height: 18px; }
		.users-name{ padding: 2px 0px 0px 3px; width: 147px; font-size: 13px; }
		.users-item:hover{ cursor: pointer; background-color: #F4F4F4; }
	.invite-item{ margin: 2px 0px; width: 100%; height: 20px; }
		.invite-item .users-name{ width: 270px; }
.RoomListBox{
	width: calc(100% - 10px);
	height: 255px;
}
	.RoomListBox div{ float: left; }
	.RoomListBox .product-body{ width: calc(100% - 10px); height: 330px; overflow-x: hidden; overflow-y: scroll; }
	.rooms-item{
		padding: 2px;
		border-radius: 10px;
		margin: 1px;
		width: calc(100% - 8px);
		height: 64px;
		box-shadow: 0px 1px 1px #777777;
		cursor: pointer;
		background-color: #E4E4E4;
		transition: all 300ms ease;
	}
		.rooms-create{ background-color: #8EC0F3; }
		.rooms-create>div{ float: none; padding: 20px 0px; text-align: center; font-size: 15px; font-weight: bold; }
		.rooms-channel{ position: relative; width: 10px; height: 10px; border-radius: 5px; margin-right: -10px; }
			.channel-1{ background-color: #F99; }
			.channel-2{ background-color: #FF7; }
			.channel-3{ background-color: #7C7; }
			.channel-4{ background-color: #99F; }
		.rooms-gaming{ background-color: #FFBBBB; }
			.rooms-gaming .rooms-number{ border-color: #CC9999; }
		.rooms-item:hover{ background-color: #F4F4F4; }
			.rooms-gaming:hover{ background-color: #FFCCCC; }
			.rooms-create:hover{ background-color: #AADDFF; }
		.rooms-number{ padding-top: 16px; border-right: 1px solid #CCCCCC; margin-right: 4px; width: 49px; height: 46px; font-size: 24px; text-align: center; }
		.rooms-title{ padding-top: 4px; width: calc(100% - 95px); height: 20px; font-size: 16px; font-weight: bold; }
		.rooms-limit{ padding-top: 7px; width: 40px; height: 17px; text-align: center; }
		.rooms-mode{ padding-top: 5px; width: 239px; }
		.rooms-info{ width: calc(100% - 95px); }
			.rooms-round{ padding-top: 3px; margin-right: 10px; }
			.rooms-time{ padding-top: 3px; }
		.rooms-lock{ display: none; padding-top: 8px; width: 40px; text-align: center; font-size: 24px; }
.ShopBox{
	width: 790px;
	height: 360px;
}
	.ShopBox div{ float: left; }
	.ShopBox .product-body{ height: 330px; }
.RoomBox{
	width: calc(100% - 10px);
	height: 225px;
}
	.RoomBox .product-title{ height: 12px; }
	.RoomBox .product-title h5{ float: left; }
		.room-head-modified{ animation: ModifiedBlink 1s ease 3; }
		.room-head-number{ width: 35px; text-align: center; }
		.room-head-title{ display: none; }
		.room-head-mode{ margin-right: 5px; width: calc(100% - 170px); text-align: center; }
		.room-head-limit{ width: 35px; text-align: center; }
		.room-head-round{ width: 60px; text-align: center; }
		.room-head-time{ width: 35px; text-align: center; }
	.team-selector{
		float: left;
		padding-bottom: 2px;
		border-bottom: 1px solid #CCCCCC;
		margin: -3px 0px 1px 0px;
		width: 100%;
	}
		.team-button{
			float: left;
			padding: 2px 0px;
			border-radius: 10px;
			margin: 0px 2px;
			width: calc(20% - 4px);
			height: 20px;
			text-align: center;
			font-size: 13px;
		}
		.team-button:hover{ border-bottom: 4px solid rgba(0, 0, 0, 0.5); margin-top: -2px; height: 18px; }
		.team-unable div{ background-color: #BBBBBB; cursor: not-allowed; }
		.team-chosen{ font-weight: bold; }
		.team-0{ background-color: #D0D0D0; }
		.team-1{ background-color: #FF5555; }
		.team-2{ background-color: #FFBF30; }
		.team-3{ background-color: #88C525; }
		.team-4{ background-color: #4A90D6; }
	.room-user{
		float: left;
		padding: 3px;
		border-radius: 10px;
		margin: 3px;
		width: calc(100% - 10px);
		height: 24px;
		box-shadow: 0px 1px 1px #777777;
		background-color: #E4E4E4;
	}
		.room-user div{ float: left; }
		.room-user-image{ display: none; }
		.room-user-stat{ padding: 3px; width: 70px; font-size: 15px; }
			.room-user-ready{ text-align: right; font-weight: bold; }
			.room-user-readied{ color: #3A8BDF; }
			.room-user-spectate{ color: #8160FF; }
			.room-user-practice{ color: #E1BA2D; }
			.room-user-master{ color: #E14E2D; }
		.room-user-title{ padding-top: 3px; width: calc(100% - 80px); font-size: 15px; }
		.room-user-level{ width: 20px; height: 20px; }
		.room-user-name{ font-weight: bold; }
.GameBox{
	width: calc(100% - 10px);
	height: 410px;
	background-image: url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/gamebg.png');
}
	.GameBox .product-title{ height: 12px; }
	.GameBox .product-title h5{ float: left; }
	.GameBox div{ float: left; }
	.GameBox .product-body{ width: calc(100% - 10px); padding-top: 0px; }
	.game-replay-controller{ float: right !important; width: 100px; }
	.game-replay-controller button{
		float: right;
		margin-top: -2px;
		padding: 1px;
		width: 20px;
		font-size: 11px;
	}
	.game-head{ width: 100%; height: 155px; }
	.hints{
		position: relative;
		top: -150px;
		width: 100%;
		height: 30px;
	}
	.tools {
		margin: 20px 5em 0px 5em;
		width: 225px;
		display: none;
		background-color: #eeeeee;
		border: 1px solid #000;
		border-radius: 10px;
		padding: 5px;
		box-shadow: 0px 1px 1px #141414;
	}
	#drawing {
		font-size: 14px;
		width: 40%;
		margin-bottom: 10px;
		display: block;
	}
	#drawing-title {
		font-size: 14px;
		width: 60%;
		margin-bottom: 10px;
		display: block;
		overflow-x: scroll;
		height: 34px;
		white-space: nowrap;
	}
	#themeis {
		font-size: 14px;
		width: 40%;
		margin-bottom: 10px;
		display: block;
	}
	#themeis-title {
		font-size: 14px;
		width: 60%;
		margin-bottom: 10px;
		display: block;
	}
	.button-color {
		border: none;
		width: 50px;
		height: 30px;
		background-repeat: no-repeat;
		background-position: center;
	}
	.palette {
		width: 100%;
		background-color: #DEB887;
		border: 1px solid #000;
		border-radius: 10px;
		box-shadow: 0px 1px 1px #141414;
		padding: 5px 5px 5px 5px;
		margin-top: 0x;
		margin-bottom: 10px;
	}
	.button-color#color-red {
		background: #DEB887 url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/paint_red.png') no-repeat center;
	}
	.button-color#color-orange {
		background: #DEB887 url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/paint_orange.png') no-repeat center;
	}
	.button-color#color-yellow {
		background: #DEB887 url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/paint_yellow.png') no-repeat center;
	}
	.button-color#color-green {
		background: #DEB887 url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/paint_green.png') no-repeat center;
	}
	.button-color#color-blue {
		background: #DEB887 url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/paint_blue.png') no-repeat center;
	}
	.button-color#color-indigo {
		background: #DEB887 url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/paint_indigo.png') no-repeat center;
	}
	.button-color#color-violet {
		background: #DEB887 url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/paint_violet.png') no-repeat center;
	}
	.button-color#color-black {
		background: #DEB887 url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/paint_black.png') no-repeat center;
	}
	.button-color#color-white {
		background: #DEB887 url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/paint_white.png') no-repeat center;
	}
		.hint-item{
			width: calc(50% - 4px);
			padding: 2px;
			border-radius: 5px;
			margin: 1px 0px;
			color: #EEEEEE;
			font-size: 11px;
			max-height: 50px;
			overflow: hidden;
			background-color: #111111;
		}
	.b-left{
		position: absolute;
		padding: 5px;
		width: 324px;
		pointer-events: none;
		background-color: rgba(0, 0, 0, 0.7);
		z-index: 3;
	}
		.bb{
			margin-top: -25px;
			height: 60px;
			overflow-y: scroll;
		}
		.bb-word{
			margin-right: 5px;
			color: #AAAAAA;
		}
		.bb-char{
			padding: 2px;
			border-radius: 5px;
			margin: 1px;
			width: 10px;
			text-align: center;
			background-color: #111111;
		}
		.cw-q-head{
			margin: 3px 0px;
			width: 100%;
			font-size: 13px;
			color: #EEEEEE;
			text-align: center;
			text-shadow: 0px 1px 1px #000000;
		}
		.cw-q-body{
			padding: 5px;
			border-radius: 10px;
			margin-top: 5px;
			color: #CCCCCC;
			background-color: #111111;
		}
	.jjoriping{ width: 100%; }
	.cw.jjoriping{ margin-top: -10px; }
	.dg.jjoriping{
		margin-left: 1.5em;
		width: 325px;
	 }
		.jjoObj{ position: relative; }
		.jjoEyeL{ top: 11px; left: 0px; }
		.jjoNose{ top: 9px; left: calc(50% - 70px); }
		.jjoEyeR{ top: 11px; left: calc(100% - 140px); }
		.jjoDisplayBar{
			padding: 20px 5px 5px 5px;
			border: 2px solid #000000;
			border-bottom-left-radius: 10px;
			border-bottom-right-radius: 10px;
			margin-top: -10px;
			width: calc(100% - 15px);
			height: 80px;
			background-color: #DEAF56;
		}
		.cw .jjoDisplayBar{ width: calc(100% - 15px); height: 330px; transition: all 0.5s ease; }
			.jjo-display{
				padding: 8px 5px;
				border-radius: 10px;
				border-bottom-left-radius: 0px;
				border-bottom-right-radius: 0px;
				width: calc(100% - 10px);
				height: 23px;
				font-size: 20px;
				text-align: center;
				color: #EEEEEE;
				background-color: rgba(0, 0, 0, 0.7);
			}
			.cw .jjo-display{ position: relative; padding: 5px; width: calc(100% - 10px); height: 298px; }
				.display-text{ width: 20px; text-align: center; z-index: 1; }
				.game-fail-text{ animation: FailBlink 2s linear; color: #FF7777; }
				.cw-bar{
					position: absolute;
					border-radius: 10px;
					cursor: pointer;
					background-color: #C7C7C7;
				}
				.cw-bar:hover{ background-color: #F2F2F2; z-index: 1; }
				.cw-bar.cw-open{ background-color: #777777; pointer-events: none; z-index: 2; }
				.cw-bar.cw-my-open{ background-color: #00A55A; }
					.cw-cell{ padding-top: 4px; border-radius: 5px; margin: 3px; width: 32.5px; height: 28.5px; box-shadow: 0px 1px 1px #000000; }
			.jjoDisplayBar .graph{
				border-left: 1px solid rgba(0, 0, 0, 0.7);
				border-right: 1px solid rgba(0, 0, 0, 0.7);
				width: calc(100% - 2px);
				height: 20px;
				color: #FFFFFF;
				box-shadow: none;
				text-align: right;
				text-shadow: 0px 1px 3px #141414;
				overflow: hidden;
			}
			.jjoDisplayBar .graph-bar{
				padding-top: 4px;
				height: 16px;
				font-size: 11px;
				white-space: nowrap;
				overflow: hidden;
			}
			.jjo-turn-time{ background-color: #70712D; }
			.jjo-round-time{
				border-bottom: 1px solid rgba(0, 0, 0, 0.7);
				border-bottom-left-radius: 10px;
				border-bottom-right-radius: 10px;
				background-color: #223C6C;
			}
			.jjo-turn-time .graph-bar{ background-color: #E6E846; }
			.jjo-round-time .graph-bar{ background-color: #3573E4; }
				.round-extreme{ background-color: #FF6D6D !important; }
			.cw .jjo-turn-time{ display: none; }
		.sock-char{ text-align: center; }
			.sock-picked{ color: #FFFF44; font-weight: bold; font-size: 24px; }
	.items{
		position: relative;
		top: -80px;
		left: 0px;
		width: 60px;
		height: 30px;
		font-size: 20px;
		color: #00FF16;
		font-weight: bold;
		text-align: center;
		text-shadow: 0px 1px 5px #141414;
	}
	.chain{
		position: relative;
		float: right !important;
		top: -80px;
		left: 0px;
		width: 60px;
		height: 30px;
		font-size: 20px;
		color: #2DBAFF;
		font-weight: bold;
		text-align: center;
		text-shadow: 0px 1px 5px #141414;
	}
	.rounds{
		margin-top: -165px;
		width: 100%;
		color: #FFFFFF;
		text-align: center;
		text-shadow: 0px 1px 1px #141414;
	}
	.cw.rounds{ margin-top: -415px; }
	.dg.rounds{ margin-left: 0em !important; }
	.painter.rounds{
		margin-left: 0em !important;
		margin-top: -55em !important;
	}
		.rounds label{ margin: 0px 3px; }
		.rounds-current{ color: #FFFF3B; font-size: 16px; }
	.history-holder{
		display: none;
	}
		.history{
			width: 100%;
			height: 42px;
		}
			.history-item{
				height: 28px;
				padding: 4px 0px;
				border-radius: 10px;
				margin: 3px;
				color: #EEEEEE;
				text-align: center;
				background-color: #232323;
			}
			.history-theme{
				float: none !important;
				margin: 3px;
				font-size: 11px;
				color: #8ACFFF;
			}
			.history-class{
				padding: 1px;
				border-radius: 5px;
				margin-left: 4px;
				font-size: 11px;
				color: #111111;
				background-color: #77AAFF;
			}
			.history-mean-c{ color: #AAAAAA; }
			.history-mean{
				float: none !important;
				padding: 3px 2px 0px 1px;
				font-size: 11px;
				color: #AAAAAA;
			}
			.word-head{ margin-right: 3px; }
				.word-m1-head{
					padding: 0px 1px;
					margin: 0px 1px;
					color: #111111;
					font-weight: bold;
					background-color: #BBBBBB;
				}
				.word-m2-head{ color: #44FF44; }
				.word-m3-head{ color: #EEEEEE; }
					.word-m3-head::before{ content: "("; }
					.word-m3-head::after{ content: ")"; }
			.word-theme{ color: #8ACFFF; }
				.word-theme::before{ content: "<"; }
				.word-theme::after{ content: ">"; }
	.game-input{
		position: relative;
		top: -190px;
		padding: 5px;
		border-radius: 10px;
		width: calc(100% - 10px);
		background-color: rgba(0, 0, 0, 0.7);
	}
		.game-input input{
			width: calc(100% - 12px);
			height: 40px;
			font-size: 20px;
		}
	.game-body{
		margin: 0px -1px;
		width: 100%;
		height: 180px;
	}
	.cw.game-body{ position: relative; top: -378px; left: 660px; width: 334px; }
		.game-user{
			border: 2px solid #DDDDDD;
			border-radius: 10px;
			margin: 1px;
			width: 100%;
			height: 22px;
			box-shadow: 0px 1px 1px #141414;
			background-color: #DDDDDD;
			transition: all 300ms ease;
		}
		.game-user-current{
			animation: CurrentBlink 2s linear infinite;
			background-color: #DDFFDD;
		}
		.game-user-drawing{
			animation: CurrentBlink 2s linear infinite;
			background-color: #9fd1f1;
		}
		.game-user-bomb{ border-color: #FF6666; }
			.game-user-image{ margin: 3px 5px; width: 100px; height: 100px; }
			.game-user-level{ margin: 1px; width: 18px; height: 18px; }
			.game-user-name{ padding: 3px 0px 0px 3px; width: 90px; height: 17px; font-size: 13px; }
				.game-user-my-name{ font-weight: bold; }
			.game-user-score{ padding: 0px 5px; width: 100px; font-size: 15px; font-weight: bold; }
				.game-user-score-char{ width: 20px; text-align: center; }
	#ResultDiag .dialog-body div{ float: left; }
		.result-board{
			width: 100%;
			height: 260px;
		}
			.result-board-item{
				padding: 5px;
				border-radius: 5px;
				margin: 1px;
				width: calc(100% - 12px);
				height: 20px;
				font-size: 13px;
				box-shadow: 0px 1px 1px #CCCCCC;
				background-color: #F4F4F4;
			}
			.result-board-me{
				padding: 4px;
				border: 1px solid #CCCCCC;
				background-color: #FAFAFA;
			}
				.result-board-rank{ padding-top: 3px; border-radius: 10px; width: 45px; height: 17px; text-align: center; }
				.result-board-level{ width: 20px; height: 20px; }
				.result-board-name{ margin-left: 5px; width: calc(100% - 200px); }
				.result-board-score{ display: none; }
				.result-board-reward{ width: 65px; text-align: center; }
				.result-board-lvup{
					width: 65px;
					height: 20px;
					color: #2626FF;
					font-size: 13px;
					text-align: center;
					text-shadow: 0px 0px 3px #6DA1FF;
				}
					.result-board-lvup i{ float: left; margin-right: 1px; animation: LvUpBlink 1s infinite; }
					.result-board-lvup div{ padding-top: 3px; }
		.result-me{
			padding: 3px;
			border: 1px solid #CCCCCC;
			border-radius: 5px;
			margin: 1px;
			width: calc(100% - 10px);
			height: 80px;
			font-size: 13px;
		}
			.result-me-score{ width: 50%; color: #3C5FC2; text-align: center; }
				.result-me-bonus{ color: #4BBBFF; font-weight: bold; text-shadow: 0px 0px 2px #C8C8F7; }
			.result-me-money{ width: 50%; color: #555555; text-align: center; }
			.result-me-level{ margin-top: 5px; width: 65px; }
				.result-me-level-head{ width: 100%; text-align: center; }
				.result-me-level-body{
					width: 100%;
					text-align: center;
					font-size: 30px;
					font-weight: bold;
				}
			.result-me-gauge{
				border-radius: 10px;
				margin-top: 10px;
				width: calc(100% - 70px);
				height: 49px;
				overflow: hidden;
				box-shadow: 0px 1px 1px #CCCCCC;
				background-color: #333333;
			}
				.result-me-before-bar{ background-image: url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/scorebar.png'); }
				.result-me-current-bar{ background-image: url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/currentbar.png'); }
				.result-me-bonus-bar{ background-image: url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/bonusbar.png'); }
				.result-me-score-text{
					margin-top: -33px;
					margin-left: 65px;
					width: calc(100% - 70px);
					color: #EEEEEE;
					text-align: center;
					text-shadow: 0px 1px 1px #141414;
				}
			.result-me-expl h4{ color: #FFFF44; }
			.result-me-expl div{ margin-bottom: 4px; width: 140px; }
			.result-me-blog-head{ float: left; width: 80px; color: #EEEEEE; }
			.result-me-blog-body{ float: left; width: 60px; color: #C7C7C7; }
	#KickVoteDiag{}
		.kick-vote-time{ border-radius: 10px; width: 100%; height: 40px; overflow: hidden; background-color: #BA3F3F; }
		.kick-vote-time .graph-bar{ background-color: #FF6D6D; }
	.purchase-not-enough{ color: #EE2222; }
.MeBox{
	width: 200px;
	height: 190px;
	cursor: pointer;
}
	.MeBox div{ float: left; }
	.my-image{ width: 80px; height: 80px; }
	.my-stat{ padding: 5px 0px 5px 5px; width: 100px; }
		.my-stat-level{ margin: 1px; width: 18px; height: 18px; }
		.my-stat-name{ padding-top: 3px; padding-left: 4px; width: 76px; height: 17px; font-weight: bold; }
		.my-stat-record{ margin-top: 5px; width: 100px; }
		.my-stat-ping{ margin-top: 5px; width: 100px; }
	.my-level{ margin: 13px 0px; width: 190px; font-size: 15px; text-align: center; }
	.my-gauge{ border-radius: 10px; margin: 3px 0px; width: 190px; height: 30px; overflow: hidden; background-color: #20568E; }
		.my-gauge .graph-bar{ background-image: url('https://cdn.jsdelivr.net/npm/bfkkutudelivr@latest/img/kkutu/scorebar.png'); }
	.my-gauge-text{ margin-top: -25px; width: 190px; color: #EEEEEE; text-align: center; text-shadow: 0px 1px 1px #141414; }
	#dress-goods{
		margin-top: 5px;
		height: 125px;
		overflow-y: scroll;
	}
		.dress-type{
			float: left;
			padding: 1px 0px;
			border: 1px solid #AAAAAA;
			border-radius: 5px;
			margin: 1px;
			width: 40px;
			font-size: 11px;
			text-align: center;
			cursor: pointer;
			background-color: #DDDDDD;
			transition: all 300ms ease;
		}
		.dress-type.selected{ color: #EEEEEE; background-color: #111111; }
		.dress-type:hover{ background-color: #EEEEEE; }
		.dress-type.selected:hover{ background-color: #222222; }
		.dress-item{
			float: left;
			padding: 1px;
			border: 1px solid #CCCCCC;
			margin: 1px;
			width: 40px;
			height: 40px;
		}
		.dress-equipped{ padding: 0px; border: 2px solid #FFB861; }
		.dress-expl{ width: 240px; font-size: 11px; }
			.dress-item-title{ float: left; width: 160px; font-size: 13px; }
			.dress-item-group{ float: left; padding-top: 1px; width: 80px; color: #BBBBBB; text-align: right; }
			.dress-expl label{ display: inline; padding: none; font-size: inherit; }
			.dress-item-image{ width: 40px; height: 40px; font-size: 11px; text-align: right; text-shadow: 0px 0px 3px #111111; }
			.dress-item-expl{ float: left; margin: 2px 0px; width: 100%; }
			.dress-item-opts{ float: left; padding-top: 4px; border-top: 1px dashed #777777; margin-top: 2px; width: 100%; }
				.item-opts-head{ color: #EEEE44; }
					.item-opts-head::after{ content: ": " }
.ChatBox{
	width: calc(100% - 10px) !important;
}
#Chat{
	width: 100%;
	overflow-y: scroll;
}
#Talk{
	float: left;
	border-right: none;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
	margin-top: 5px;
	width: calc(100% - 82px);
	height: 20px;
}
#ChatBtn{
	float: left;
	border-left: none;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
	margin-top: 5px;
	width: 60px;
	height: 20px;
}
	#Chat hr, #chat-log-board hr{
		padding-top: 0px;
		border: 0px;
		border-bottom: 1px dashed #999999;
		margin: 2px 0px;
	}
	.chat-item{
		float: left;
		padding: 1px 0px;
		margin: 1px 0px;
		width: 100%;
	}
	.chat-notice{
		background-color: #CCCCCC;
	}
		.chat-notice .chat-head{ color: #1767CA; }
		.chat-stamp{
			float: left;
			padding-top: 2px;
			width: 70px;
			font-size: 11px;
			text-align: right;
			color: #999999;
		}
		.chat-head{
			float: left;
			padding-right: 4px;
			margin-right: 5px;
			width: 100px;
			font-weight: bold;
			text-align: center;
		}
		.chat-body{ float: left; width: calc(100% - 190px); min-height: 14px; }
.ADBox{
	width: 1000px;
	box-shadow: 0px 1px 1px #141414;
	background-color: #232323;
}
.ADBox .product-title{
	border-bottom-color: #333333;
	color: #CCCCCC;
	background-color: inherit;
}
.ADBox .product-body{
	padding-left: 131px;
}


@keyframes ReadyBlink{
	0%		{ margin-top: 0px; height: 20px; }
	50%		{ margin-top: -5px; height: 25px; }
	100%	{ margin-top: 0px; height: 20px; }
}
@keyframes CurrentBlink{
	0%		{ border-color: #3EFF3E; }
	50%		{ border-color: #009000; }
	100%	{ border-color: #3EFF3E; }
}
@keyframes FailBlink{
	0%		{ text-decoration: line-through; }
	25%		{ text-decoration: inherit; }
	50%		{ text-decoration: line-through; }
	75%		{ text-decoration: inherit; }
}
@keyframes ModifiedBlink{
	0%		{ background-color: #FFFF44; }
	100%	{ background-color: #DDDDDD; }
}
@keyframes LvUpBlink{
	0%		{ margin-top: 6px; }
	100%	{ margin-top: 1px; }
}
@keyframes ScoreGoing{
	0%		{ opacity: 1; }
	100%	{ opacity: 0; }
}