body{
	margin: 0px;
	padding: 0px;
	background-color: #006600;
}

@font-face {
    font-family: 'VLGothicRegular';
    src: local('VL Gothic Regular'),
         url('./lib/VL-Gothic-Regular.ttf') format('truetype');
}


div{
    font-family: 'VLGothicRegular';
}

input{
    font-family: 'VLGothicRegular';
}
select{
    font-family: 'VLGothicRegular';
}
textarea{
    font-family: 'VLGothicRegular';
}

div.shadow_layer{
	position: absolute;
	background-color: #888888;
	height: 100%;
	width: 100%;
	left: 0;
	top: 0;
	opacity: 0.5;
}
div.window_layer{
	position: absolute;
	left: 0;
	top: 0;
}
div.dialog{
	position: absolute;
	width: 360px;
	height: 720px;
	border-color: #303030;
	border-width: 5px;
	border-style: solid;
	border-top-width: 15px;
	background-color: #006600;
	border-radius: 10px;         /* CSS3 */
	-webkit-border-radius: 10px; /* Webkit */
	-moz-border-radius: 10px;    /* Mozilla */
}
div.dialog_main{
	position: static;
	padding: 18px;
	padding-left: 36px;
	padding-right: 36px;
	width: 100%;
	height: 100%;
	font-size: 14px;
	color: white;
}
div.dialog_text{
	margin: auto;
	margin-bottom: 4px;
	font-size: 16px;
	color: #ffe047;
	text-shadow:
       -1px -1px 0 #000,
		1px -1px 0 #000,
       -1px  1px 0 #000,
		1px  1px 0 #000;
	/* for IE */
	letter-spacing: 0.05em;
	behavior: url(ie-css3.htc);
}

div.dialog_error{
	margin: auto;
	margin-bottom: 4px;
	font-size: 16px;
	color: red;
	text-shadow:
       -1px -1px 0 #000,
		1px -1px 0 #000,
       -1px  1px 0 #000,
		1px  1px 0 #000;
	/* for IE */
	letter-spacing: 0.05em;
	behavior: url(ie-css3.htc);
}

span.dialog_text{
	margin: auto;
	margin-bottom: 12px;
	font-size: 16px;
	color: #ffe047;
	text-shadow:
       -1px -1px 0 #000,
		1px -1px 0 #000,
       -1px  1px 0 #000,
		1px  1px 0 #000;
	/* for IE */
	filter: dropshadow(color=#222222,offx=0.75,offy=0.75,positive=1),
			dropshadow(color=#222222,offx=0,offy=0,positive=1),
			dropshadow(color=#222222,offx=0.75,offy=-0.75,positive=1),
			dropshadow(color=#222222,offx=-0.75,offy=-0.75,positive=1),
			dropshadow(color=#222222,offx=-0.75,offy=0.75,positive=1);
	letter-spacing: 0.05em;
	behavior: url(ie-css3.htc);
}

div.dialog_ok{
	float: left;
	margin: auto;
	width: 128px;
	height: 32px;
	background-image: url(./images/button_ok.png);
	cursor:pointer;
}

div.dialog_cancel{
	margin: auto;
	float: right;
	width: 128px;
	height: 32px;
	background-image: url(./images/button_cancel.png);
	cursor:pointer;
}

div.dialog_table_div{
	color: #333333;
	overflow-y:auto;
	width: 200px;
}

p.dialog_error{
	color: red;
}

div.dialog_error{
	color: red;
}

input.dialog_textbox{
	margin: auto;
	margin-bottom: 12px;
	font-size: 16px;
	height: 26px;
	width: 256px;
}

select.dialog_select{
	margin: auto;
	margin-bottom: 12px;
	font-size: 12px;
	height: 26px;
	width: 320px;
}

div.custom_option_div{
	cursor: pointer;
}
select.replay_mode{
	margin: auto;
	margin-bottom: 12px;
	font-size: 12px;
	height: 26px;
	width: 320px;
}

textarea.replay_user{
	margin: auto;
	margin-bottom: 12px;
	font-size: 10px;
	height: 26px;
	width: 320px;
	resize: none;
}

div.replay_option{
	margin: auto;
	margin-bottom: 12px;
	color: white;
	font-size: 14px;
	left: 422px;
	top: 24px;
	position: absolute;
	cursor:pointer;
}

select.stage_select{
	margin: auto;
	margin-bottom: 12px;
	font-size: 12px;
	height: 26px;
	width: 320px;
}

div.main{
	background-color: #006600;
	height: 841px;
}

div.help{
	position:absolute;
	top: 48px;
	width: 1590px;
	height: 841px;
	background-image: url(./images/help.png);
}

div.header{
	top: 0px;
	width: 100%;
	height: 48px;
	background-color: #8e7fb0;
	background-color: #006600;
}

div.side_bar{
	width: 656px;
	height: 868px;
	background-color: #ef9c99;
	background-color: #006600;
	float: right;
}

div.side_bar_top{
	height: 160px;
	background-color: #fff09e;
	background-color: #006600;
	margin: 16px;
}

div.compare_field{
	width: 288px;
	height: 160px;
	background-color: #ffffff;
	background-color: #006600;
	margin: 0px;
	float: left;
}

div.compare_field1{
	width: 256px;
	height: 128px;
	background-color: #ffffff;
	background-color: #006600;
	margin: 16px;
	float: left;
}

div.compare_field_l{
	height: 128px;
	float: left;
}

div.compare_field_r{
	height: 128px;
	float: right;
}

div.compare_card{
	width: 80px;
	height: 128px;
	background-color: #006600;
	background-image: url(./images/compare_card.png);
}
div.compare_icon{
	width: 32px;
	height: 32px;
}
div.compare_button{
	width: 64px;
	height: 32px;
	top: 8px;
	left: 360px;
	background-image: url(./images/button_compare.png);
	position: absolute;
	cursor:pointer;
}

form.compare_form{
	position: absolute;
	top: 108px;
	left: 16px;
	margin: 0px;
}

div.compare_option_div{
	color: white;
	font-size: 14px;
	top: 16px;
	left: 432px;
	position: absolute;
	cursor:pointer;
}

div.advice{
	position: absolute;
	background-color: #f0ea50;
	font-size: 13px;
    -webkit-box-shadow: 4px 4px 0px #000000;
    -moz-box-shadow: 4px 4px 0px #000000;
    box-shadow: 4px 4px 0px #000000;
}

div.help_field{
	width: 624px;
	height: 160px;
	background-color: #ffffff;
	margin: 0px;
	float: right;
}

div.side_bar_bottom{
	height: 664px;
	background-color: #ffffff;
	margin: 16px;
}

select.textbox_count{
	font-size: 18px;
	height: 26px;
	width: 64px;
}

input.textbox_compare_count{
	font-size: 18px;
	height: 26px;
	width: 64px;
	position: absolute;
	left: 8px;
	top: 8px;
}


div.button_back{
	position: absolute;
	width: 64px;
	height: 32px;
	top: 8px;
	left: 80px;
	background-image: url(./images/button_back.png);
	cursor:pointer;
}

div.button_mode0{
	position: absolute;
	width: 128px;
	height: 32px;
	top: 8px;
	left: 8px;
	background-image: url(./images/button_mode0.png);
	cursor:pointer;
}
div.button_mode1{
	position: absolute;
	width: 128px;
	height: 32px;
	top: 8px;
	left: 144px;
	background-image: url(./images/button_mode1.png);
	cursor:pointer;
}

div.button_mode2{
	position: absolute;
	width: 128px;
	height: 32px;
	top: 8px;
	left: 280px;
	background-image: url(./images/button_mode2.png);
	cursor:pointer;
}

div.button_custom{
	position: absolute;
	width: 128px;
	height: 32px;
	top: 8px;
	left: 38px;
	background-image: url(./images/button_start.png);
	cursor:pointer;
}
div.button_problem{
	position: absolute;
	width: 128px;
	height: 32px;
	top: 8px;
	left: 174px;
	background-image: url(./images/button_problem.png);
	cursor:pointer;
}

div.button_sample{
	position: absolute;
	width: 128px;
	height: 32px;
	top: 8px;
	left: 326px;
	background-image: url(./images/button_sample.png);
	cursor:pointer;
}
div.button_replay{
	position: absolute;
	width: 128px;
	height: 32px;
	top: 8px;
	left: 460px;
	background-image: url(./images/button_replay.png);
	cursor:pointer;
}


div.button_ok0{
	position: absolute;
	width: 128px;
	height: 32px;
	top: 8px;
	left: 80px;
	background-image: url(./images/button_normal.png);
	cursor:pointer;
}

div.button_ok1{
	position: absolute;
	width: 128px;
	height: 32px;
	top: 8px;
	left: 224px;
	background-image: url(./images/button_advance.png);
	cursor:pointer;
}

div.button_ranking{
	position: absolute;
	width: 128px;
	height: 32px;
	top: 8px;
	left: 752px;
	background-image: url(./images/button_ranking.png);
	cursor:pointer;
}

div.panel_user{
	position: absolute;
	width: 200px;
	height: 32px;
	top: 0px;
	left: 888px;
	background-image: url(./images/panel_user.png);
}

div.panel_user_textarea{
	position: absolute;
	top: 8px;
	left: 13px;
	font-size: 16px;
	color: white;
}

span.panel_user_text{
	color: white;
}

span.panel_user_text:hover{
	color: #ffea80;
	cursor:pointer;
}



div.button_replay_s{
	width: 84px;
	height: 21px;
	background-image: url(./images/button_replay_s.png);
	cursor:pointer;
}

div.button_play_s{
	width: 84px;
	height: 21px;
	background-image: url(./images/button_play_s.png);
	cursor:pointer;
}

div.author_icon{
	height: 16px;
	width: 272px;
	background-image: url(./images/author_icon.png);
	margin-left: auto;
	margin-right: auto;
}

div.button_about{
	height: 16px;
	width: 128px;
	position: absolute;
	left: 1446px;
	top: 24px;
	background-image: url(./images/button_about.png);
	cursor:pointer;
}

div.button_fa{
	position: absolute;
	width: 128px;
	height: 32px;
	top: 8px;
	left: 152px;
	background-image: url(./images/button_fa.png);
	cursor:pointer;
}

div.button_more{
	position: absolute;
	width: 192px;
	height: 32px;
	top: 8px;
	left: 352px;
	background-image: url(./images/button_more.png);
	visibility: hiddden;
	cursor:pointer;
}

div.button_more2{
	position: absolute;
	width: 192px;
	height: 32px;
	top: 8px;
	left: 152px;
	background-image: url(./images/button_more2.png);
	visibility: hiddden;
	cursor:pointer;
}

div.button_giveup{
	position: absolute;
	width: 64px;
	height: 32px;
	top: 8px;
	left: 288px;
	background-image: url(./images/button_giveup.png);
	cursor:pointer;
}


div.card_drag{
	width: 80px;
	height: 128px;
	position: absolute;
	background-size:100% 100%;
	visibility: hidden;
}

div.card {
	width: 80px;
	height: 128px;
	position: absolute;
	background-size:100% 100%;
}

div.card.ui-selecting{
	width: 76px;
	height: 124px;
	position: absolute;
	background-size:100% 100%;
	border-color: red;
	border-width: 2px;
	border-style: dashed;
}

div.card.ui-selected{
	width: 76px;
	height: 124px;
	position: absolute;
	background-size:100% 100%;
	border-color: red;
	border-width: 2px;
	border-style: solid;
}

div.card_re{
	width: 80px;
	height: 128px;
	left: 0px;
	top: 0px;
	position: absolute;
	visibility: hidden;
	background-size:100% 100%;
}
div.card_res{
	width: 40px;
	height: 64px;
	left: 0px;
	top: 64px;
	background-size: contain;
	position: absolute;
}

div.card_coin{
	width: 47px;
	height: 45px;
	left: 33px;
	top: 83px;
	background-size: contain;
	position: absolute;
}

div.card_ls{
	width: 80px;
	height: 21px;
	left: 0px;
	top: 8px;
	background-size: contain;
	position: absolute;
}

div.group{
	width: 94px;
	height: 142px;
	left: 0px;
	top: 0px;
	position: absolute;
	visibility: hidden;
	background: #ff0000; 
	-webkit-border-radius: 10px; /* Safari,Chrome */
	-moz-border-radius: 10px;/* Firefox */
	border-radius: 10px; /* Opera 10.5+, Internet Explorer 6+ using IE-CSS3 */
	behavior: url(ie-css3.htc);
}

div.field{
	width: 992px;
	height: 164px;
	background-color: #006600;
	position: absolute;
	left: 0;
	top: 0;
}

div.card_field{
	width: 992px;
	height: 164px;
	position: absolute;
	left: 0;
	top: 0;
}

div.pointer{
	visibility: visible;
	background-image: url(./images/pointer.png);
	width: 32px;
	height: 32px;
	position: absolute;
}

div.interval{
	visibility: hidden;
	width: 64px;
	height: 160px;
	position: absolute;
	background-color: white;
}

div.result_field0{
	width: 768px;
	height: 624px;
	background-color: #006600;
	left: 224px;
	top: 164px;
	position: inherit;
}

div.result_field{
	width: 624px;
	height: 664px;
	background-color: white;
	position: absolute;
	overflow: auto;
}

div.result_block0.new{
	width: 112px;
	height: 64px;
	left: 0px;
	top: 0px;
	position: absolute;
}
div.result_block0{
	width: 112px;
	height: 64px;
	left: 3px;
	top: 3px;
	position: absolute;
}
div.result_block{
	width: 118px;
	height: 70px;
	background-color: white;
	position: absolute;
}

div.result_block.new{
	width: 112px;
	height: 64px;
	background-color: white;
	position: absolute;
	border-color: red;
	border-width: 3px;
	border-style: solid;
}

div.result_block_card0{
	width: 40px;
	height: 64px;
	left: 0px;
	top: 0px;
	background-size: contain;
	position: absolute;
}

div.result_block_card1{
	width: 40px;
	height: 64px;
	left: 72px;
	top: 0px;
	background-size: contain;
	position: absolute;
}
div.result_block_icon{
	width: 32px;
	height: 32px;
	left: 40px;
	top: 16px;
	position: absolute;
}

div.big_icon{
	visibility: hidden;
	width: 650px;
	height: 650px;
	left: 170px;
	top: 72px;
	position: absolute;
}

div.log_field{
	width: 224px;
	height: 432px;
	background-color: #006600;
	left: 0px;
	top: 356px;
	position: absolute;
}

textarea.log_txt{
	width: 624px;
	height: 160px;
	background-color: white;
	resize:none;
	font-size: 9px;
}

textarea.log_txt_sample{
	visibility: visible;
	top: 48px;
	height: 100px;
	resize:none;
}

div.log_button{
	position: absolute;
	width: 64px;
	height: 32px;
	top: 16px;
	left: 16px;
	background-image: url(./images/button_log.png);
	cursor:pointer;
}


div.button_auto{
	position: absolute;
	width: 128px;
	height: 32px;
	top: 8px;
	left: 152px;
	background-image: url(./images/button_auto.png);
	cursor:pointer;
}

div.button_step{
	position: absolute;
	width: 64px;
	height: 32px;
	top: 8px;
	left: 288px;
	background-image: url(./images/button_step.png);
	cursor:pointer;
}

select.replay_speed{
	font-size: 16px;
	top: 16px;
	left: 360px;
	position: absolute;
}