@charset "utf-8";
/* CSS Document */

#wrap {
	width: 950px;
	margin:0 auto;
	padding:0;
	background:#fff;
	border-left:1px solid #333;
	border-right:1px solid #333;
	}
	
/* Header */
#header{margin:0 20px;}
.head_title{}
.head_title h1{ font-size:110%; color:#888;}
.login_aria{width: 300px; margin:12px 0 3px;}
.user_name{font-weight:bold; }
.head_nav{border-top:3px solid #222; padding:5px 0; clear:both; height:30px;}

#content{margin:15px 20px 10px;}

/* TopPage */
#new_line{width: 910px;}
.top_news{
	background:url(../images/info_title.gif) center left no-repeat;
	padding: 5px 0 3px 110px;
	width: 580px;
	margin:0;
	text-align: left;
	font-size:110%;
	line-height:1.0;
	border-bottom:3px solid #222;
}
.top_guide{ background:#222; padding:10px; color:#ddd;}
.top_guide h2{margin:12px 0 8px 0.5em;}
.top_guide p{margin-bottom:0.75em; margin-left:1em; font-size:110%; line-height:1.4;}
.top_guide a{text-decoration:none;}
.tube{margin:25px 10px 10px;}
#top_attention{font-size:160%; line-height:1.5; background:url(../images/top_about.gif) 250px 0 no-repeat; margin:0 30px 20px 70px;}
#top_attention ul{list-style-position: inside; list-style-type: disc; margin:0 10px; padding-top:40px; color:#523;}
#top_attention ul li{border-bottom:2px dotted #999; padding-top:10px;}
.top_ranking{}
#monthly_rank{background:#eda url(../images/ranking_box_monthly.gif) top no-repeat; padding-top:70px;}
#monthly_top{background:#fff url(../images/ranking_box_top.gif) top no-repeat; padding-top:38px;}
#master_rank{background:#ddd url(../images/ranking_box_master.gif) top left no-repeat;}
#infection_rank{background:#DDD6E6 url(../images/ranking_box_infection.gif) top left no-repeat;}
#damage_rank{background:#D6DDE7 url(../images/ranking_box_ww.gif) top left no-repeat;}
#earthquake{background:#E7DDD6 url(../images/ranking_box_earthquake.gif) top left no-repeat;}
.ranking_box{width:405px; padding:12px 20px 10px;}
.ranking_box .average{ text-align:right; height:50px; margin-bottom:10px; font-size:250%; color:#724; font-weight:bold;}
.ranking_box ol { list-style:decimal; }
.ranking_box ul{list-style:none;}
.ranking_box ol li{ margin-left:35px; width:370px; display:list-item; font-size:160%; color:#444; line-height:1.6;}
.ranking_box ul li{ margin:6px 0 0 0; width:405px; display:list-item; font-size:135%; color:#444; line-height:1.5; border-bottom:1px dotted #666;}
.ranking_box ol li .un, .ranking_box ul li .un{ width:95px;}
.ranking_box ul li .mon{ padding:2px 5px; background:#666; color:#eee; font-size:85%; margin-right:10px; display:inline-block;}
.link_banner{}
.link_banner img{float:left;}
.sns_post{height:30px; width:220px; padding:2px 0; margin:0; }
.sns_link{height:40px;}
.twitter-share-button {width: 108px!important;}

/* Mail Entry */
#mail-entry, #mail-complete, #profile-entry{lin:1.5; text-align:center;}
#mail-entry{font-size:150%; padding:40px 0 20px; background:#f2f2f2; margin:10px 10px 40px;}
#mail-entry table, #profile-entry table{ margin:0 auto;}
#mail-entry table tr td{padding:10px;}
#mail-entry input{font-size:85%; padding:4px 5px;}
#mail-entry h3{margin:10px 14px 0; font-size:90%; background:#ccc; padding:3px 0; color:#555;}
#mail-entry .entry_rule{ text-align:left; overflow: auto; height: 120px; margin:0 15px 20px; padding:10px 15px; border:1px solid #999; font-size:12px; line-height:1.5; background:#fff;}
#mail-complete{font-size:135%; padding:120px 0 160px; margin:10px;}
#mail-complete h2{font-size:120%; font-weight:bold; color:#840; margin-bottom:1em;}
#mail-complete p{ margin-bottom:1em;}
.error_massage{color:#c00; font-weight:bold;}
.check_box{border-bottom:1px dotted #bbb; padding:10px 0 5px; margin:0 15px; font-weight:bold; color:#345;}
.entry_attention{}
.entry_attention h2{font-size:120%; color:#b00; margin-bottom:7px; border-left:10px solid #b00; padding-left:5px; line-height:1;}
.entry_attention p{margin-left:1em;}

/* Profole */
#profile{border:1px solid #ccc;}
#profile table{ margin:0 auto;}
#profile table tr td{border-bottom:1px dotted #ccc; padding:15px 15px;}
#profile input{font-size:105%; padding:2px 3px;}
.profile-entry{font-size:130%; background:url(../images/profile-entry_title.gif) top center no-repeat; padding:80px 0 10px; margin:10px 15px 25px;}
.profile-complete{font-size:125%; background:url(../images/profile_title.gif) top center no-repeat; padding:80px 0 10px; margin:50px 15px 25px;}
.profile-cahnge{font-size:130%; background:url(../images/profile-change_title.gif) top center no-repeat; padding:80px 0 10px; margin:50px 15px 25px;}
.your_profile{ font-weight:bold; font-size:115%; color:#468; }

/* MyPage */
#mypage{background:#ddd url(../images/white.gif) repeat-x top; padding-bottom:10px;}
.user_name_back{
	background:#222;
	padding:13px 10px 5px;
	-moz-border-radius: 12px 12px 0 0;
	border-radius: 12px 12px 0 0;
	}
.user_name_back .medal{float:left; width:90px;}
.user_name_back .top_space{margin-top:10px;}
.user_name_back .nickname{float:left; width:400px; background:#fff; font-size:30px; padding:19px 20px 15px; line-height:1.2; margin-left:10px; font-weight:bold;}
.user_name_back .mail-add{line-height:1.2; color:#fff; font-size:16px; font-weight:normal; word-wrap:break-word;}
.user_name_back .clear_medal{text-align:center; color:#ff6; font-weight:bold; width:300px; padding-right:10px;}
.width_320{width:320px;}
.mypage_news{
	background:#fff url(../images/mypage_info_title.gif) center left no-repeat;
	padding: 7px 0 5px 100px;
	width: 770px;
	margin:20px 20px;
	text-align: left;
	line-height:1.0;
	border:1px solid #222;
}
.score_board{margin:0 20px 15px;}
#master_score{background:#222 url(../images/score_master.gif) top left no-repeat; color:#222; }
#infection_score{background:#546 url(../images/score_infection.gif) top left no-repeat; color:#546;}
#damage_score{background:#357 url(../images/score_damage.gif) top left no-repeat; color:#357;}
#earthquake_score{background:#654 url(../images/score_earthquake.gif) top left no-repeat; color:#654;}
.score_box{width:400px; padding:10px 15px; line-height:1; color:#333; height:240px;}
.score_box dt{padding:0 0 10px 300px;}
.score_box dd.my-score{float:left; width:190px; height:75px; font-size:50px; text-align:center; background:#ddd; padding:15px 5px 0; line-height:1;}
.score_box dd.my-time{float:left; width:200px; height:28px; font-size:15px; text-align:center;  background:#ddd; padding-top:12px; line-height:1; letter-spacing:0;}
.score_box dd.my-date{float:right; width:180px;height:28px; font-size:20px; font-weight:bold; text-align:center; background:#ddd; padding-top:12px; margin-bottom:5px;}
.score_box dd.my-rank{float:right; width:180px;height:28px; font-size:14px; font-weight:bold; text-align:center; background:#ddd; padding-top:12px;}
.score_box dd.my-comment{float:right; width:180px; height:40px; font-size:16px; text-align:center; color:#fff; margin-bottom:5px; line-height:40px;}
.score_box dd.before-test{margin:0; padding:0;}
.inactive{opacity:0.5;}
.best_score{font-size:84px;}
.best_time{ font-size:20px;font-weight:bold; letter-spacing:1px;}
.best_rank{font-size:20px;}

/* Quiz */
#master_quiz, #infection_quiz, #damage_quiz,#earthquake_quiz{ padding-top:50px; margin:50px 0 20px;}
#master_quiz{background:#fff url(../images/quiz_master_title.gif) top left no-repeat; border-bottom:10px solid #222;}
#infection_quiz{background:#fff url(../images/quiz_infection_title.gif) top left no-repeat; border-bottom:10px solid #546;}
#damage_quiz{background:#fff url(../images/quiz_damage_title.gif) top left no-repeat; border-bottom:10px solid #357;}
#earthquake_quiz{background:#fff url(../images/quiz_earthquake_title.gif) top left no-repeat; border-bottom:10px solid #654;}
.quiz{ border-left:1px solid #bbb; border-right:1px solid #bbb; font-size:125%; margin:0; padding:15px 10px;}
.guidance{background: url(../images/guidance_title.gif) top center no-repeat; text-align:center; margin:60px 0 30px; padding:75px 10px 10px 10px;}
.guidance h2{font-size:110%; margin:2em 0 0.7em; color:#246;}
.guidance p{margin-bottom:0.8em;}
.breaktime{background: url(../images/break_title.gif) top center no-repeat; text-align:center; margin:40px 0 20px; padding:75px 10px 10px 10px;}
.breaktime h2{font-size:110%; margin:2em 0 0.7em; color:#246;}
.breaktime p{margin-bottom:0.8em;}
.breaktime #passagearea{font-size:200%; color:#597; height:120px}
.breaktime #passagearea .sec_text{font-size:150%; line-height:2.8;}
.breaktime #passagearea .sec{font-size:300%; margin-right:10px; line-height:1;}
.question{ margin:40px 0 20px; padding:10px 0 10px 20px;}
.quest_num{line-height:1;margin-left:15px;}
.quest_num li {float:left; border:1px solid #999; padding:7px 0; margin-right:7px; width:20px; text-align:center; letter-spacing:0; border-radius:3px; -webkit-border-radius:3px;}
.quest_num .quest_past{background:#bbb;}
.quest_num .quest_now{background:#555; color:#fff;}
.quiz-time{float:right; text-align:center; padding:10px; height:100px; width:230px; background:#dee; margin:20px 10px 0; border:1px solid #abb; border-radius:5px; -webkit-border-radius:5px; font-weight:bold;}
.question #elapsedtime{ margin-bottom:18px; line-height:1; font-weight:normal;}
.question #elapsedtime .sec{font-size:125%; color:#68a; font-weight:bold;}
.question #passagearea{font-size:125%; color:#579;}
.question #passagearea .sec_text{font-size:150%; line-height:2; color:#b36;}
.question #passagearea .sec{font-size:300%; margin-right:10px; line-height:1;}
.q_num{font-weight:bold; background:#888; color:#fff; padding:4px 0; width:160px; text-align:center; line-height:1; margin-bottom:15px; border-radius:4px; -webkit-border-radius:4px;}
.q_text{ font-size:120%; font-weight:bold; margin-left:10px; padding-left:15px; border-left:10px solid #bbb; line-height:1.5;}
.answer{ font-size:120%; font-weight:bold; margin:0 220px 20px 0;}
.namazu{ width:200px;}
.namazu-jadge{text-align:center; margin:100px 0 40px;}
.answer ul{list-style-type:upper-alpha; margin:10px 0 20px 50px; cursor: pointer;}
.answer ul li{
	border: 1px solid #999;
	padding: 5px 20px ;
	list-style-position: inside;
	margin-bottom: 10px;
	background:#eee;
	display:list-item;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.result{padding:50px 10px 20px; border:1px solid #999;}
.result dt{ float:left; margin-right:10px;}
.result dd.my-score{
	float:left;
	width:300px; height:145px;
	color:#822; font-size:120px; text-align:center; line-height:1;
	border:1px solid #aaa; -moz-box-shadow: 2px 2px #ddd; box-shadow: 2px 2px #ddd;
	padding:55px 10px 0 30px;
	background:#fff url(../images/result_title.gif) top center no-repeat;
	}
.result dd.my-time{float:right; width:240px; height:60px; font-size:48px; text-align:center; border-bottom:1px solid #999; padding:30px 10px 0 50px; line-height:1; letter-spacing:0; margin-bottom:15px; background:url(../images/time_title.gif) left top no-repeat;}
.result dd.my-rank{float:right; width:240px;height:60px; font-size:48px; font-weight:bold; text-align:center; border-bottom:1px solid #999; padding:30px 10px 0 50px; background:url(../images/rank_title.gif) left top no-repeat;}
.strong_point{border-bottom:1px solid #999; padding:42px 10px 10px 30px; background:#fff url(../images/strong_title.gif) top left no-repeat;}
.weak_point{border-bottom:1px solid #999; padding:42px 10px 10px 30px; background:#fff url(../images/weak_title.gif) top left no-repeat;}
.namazu_comment{background: url(../images/namazu_comment_roop.gif) repeat-y; padding:0; color:#543; font-size:110%; font-weight:bold;}
.namazu_comment .cat_inf{background: url(../images/cat_inf_title.gif) left top no-repeat; color:#757;}
.namazu_comment .cat_dmg{background: url(../images/cat_dmg_title.gif) left top no-repeat; color:#468;}
.namazu_comment .cat_eq{background: url(../images/cat_eq_title.gif) left top no-repeat; color:#576;}
.namazu_comment .cat_foot{background:#fff;}
.namazu_comment .cat_all, .cat_inf, .namazu_comment .cat_dmg, .namazu_comment .cat_eq{ padding:45px 40px 20px 70px;}

/* Sub Page */
#stage-guide{background:url(../images/stage-guide_title.gif) left top no-repeat; }
#privacy{background:url(../images/privacy_title.gif) top left no-repeat;}
#terms-conditions{background:url(../images/terms_title.gif) left top no-repeat;}
#corprate{background:url(../images/corprate_title.gif) left top no-repeat;}
#corprate .shop_info{background:#ffffff; width:850px; border-collapse:collapse; margin:10px auto;}
#corprate .shop_info tr td{padding:6px 10px; border: 1px solid #999; line-height:1.2;}
#corprate .shop_info tr td p{margin:0; line-height:1.25;}
#corprate .shop_history{margin:10px 25px; line-height:2;}
#corprate .shop_history dt{float:left; width:120px; clear:left; border-bottom:1px dotted #999; text-align:center;}
#corprate .shop_history dd{float:left; width:630px; border-bottom:1px dotted #999; margin-left:18px; padding-left:10px;}
#contact{background:url(../images/contact_title.gif) left top no-repeat;}
#present{background:url(../images/present_title.gif) left top no-repeat;}
.info_page, .guide_page{line-height:1.5; margin:40px 0; padding:50px 20px 20px 20px;}
.info_page h2{font-size:135%; margin:1.5em 0 0.4em 0; color:#597; background:url(../images/h2_box.gif) left no-repeat; padding-left:32px;}
.info_page h3{font-size:110%; margin:1em 0 0.3em 1.2em; color:#48a;}
.info_page p{margin-left:1.5em; margin-bottom:0.5em;}
.info_page ul{list-style-type:disc; margin: 0.25em 0 0.25em 3em; list-style-position: outside;}
.info_page ol{list-style-type: decimal; margin: 0.25em 0 0.25em 3em; list-style-position: outside;}
.info_page li{margin-bottom:5px;}
.guide_page{font-size:120%;}
.guide_page h2{font-size:135%; margin:0 0 0.3em 0; color:#644;}
.guide_page p{margin-bottom:0.5em;}
#first_stage{ background:#eed;}
#second_stage{ background:#ede;}
.stage-guide_box{
	padding: 10px 15px;
	border-top: 1px solid #666;
	border-bottom: 1px solid #666;
	border-right: 1px solid #666;
	border-left: 10px solid #666;
}

/* Thanks */
#thanks{ text-align:center; font-size:120%; width:560px; margin:100px auto;}
#thanks h3{ font-size:135%; margin-bottom:2em;}
#thanks p{ margin-bottom:1em;}

/* Footer */
#footer{background:#222 url(../images/footer.gif) center right no-repeat; padding:4px 5px;}
#footer ul li{float:left; margin-left:5px;}
#footer ul li::after{content:"|"; color:#eee; margin-left:5px;}
#footer a{color:#ddd;}
#footer a:hover{color:#F80;}

/* NewsTicker */
#news{}
.newsticker {list-style-type: none;}
.newsticker li{list-style-type: none; list-style-position: inside;}


ol#guidetext{
	text-align:left;
	width:480px;
	margin:0 auto;
	list-style-type: decimal;
}
ol#guidetext li{
	list-style-type: decimal;
}
div.entry_rule p{
	margin-top:10px;
}

ul#masterCaution{
	text-align:left;
	width:480px;
	margin:0 auto;
	border:1px solid red;
	padding:10px;
	margin-bottom:10px;
}
ul#masterCaution li{
	color:red;
	font-size:16px;
}
span.red{
	color:red;
	font-weight:bold;
}