@charset "utf-8";


body {
	background-color:#000;
	color:#000;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
a{
	color:#fff;
	text-decoration:underline;
}
#wrapper{
	width:320px;
}
#footer{
	height:30px;
	background:#666;
}
#main{
	position:relative;
	width:320px;
	height:363px;
}
#loading{
	display:none;
	position:absolute;
	width:320px;
	height:416px;
	background:#efefef url(../images/loading.gif) center center no-repeat;
	-webkit-background-size:40px 40px;
	-moz-background-size:40px 40px;
	-ms-background-size:40px 40px;
	background-size:40px 40px;
}

#intro{
	position:absolute;
	width:320px;
	background:#90b76e;
	font-size:12px;
	line-height:1.5;
	color:#000;
}
	#intro p.remain{
		background:#2C6C2C;
		clear:both;
		text-align:center;
		color:#FFF;
		font-size:16px;
		font-weight:bold;
		padding:5px 0px;
		white-space:nowrap;
		overflow:hidden;
		line-height:1!important;
	}
	#intro .campaign{
		position:absolute;
		top:1px;
		width:320px;
		text-align:center;
		font-weight:bold;
		font-size:12px;
	}
	#intro .campaign strong{
		color:#e80000;
	}
	#intro .bnr{
		position:absolute;
		left:0;
		top:0;
	}
	#intro h1{
		text-align:center;
		line-height:1;
		height:195px;
		overflow:hidden;
	}
	#intro .descript{
		height:65px;
		overflow:hidden;
		line-height:1;
	}
	#intro .descript .dis{
		display:none;
	}
	#intro .txt{
		font-size:11px;
		font-weight:bold;
		color:#333;
		display:inline-block;
		margin:0 0 13px 35px;
		height:32px;
		background:url(../images/intro/txt_bg.gif) no-repeat left top;
		-webkit-background-size:32px 32px;
		-moz-background-size:32px 32px;
		-ms-background-size:32px 32px;
		background-size:32px 32px;
		padding-left:41px;
	}
	#intro .tab{
		
	}
	#intro .tab ul{
		display:block;
		padding:0 0 0 10px;
		height:51px;
		overflow:hidden;
	}
	#intro .tab li{
		display:inline;
	}
	#intro .tab li a{
		display:block;
		float:left;
		margin-right:12px;
	}
	#intro .tab li.start{
		display:inline-block;
		background: url(../images/loading_count.gif) center center no-repeat;
		-webkit-background-size:40px 40px;
		-moz-background-size:40px 40px;
		-ms-background-size:40px 40px;
		background-size:40px 40px;
		
		width:144px;
		height:42px;
	}
	#intro .tab li a.startBtn{
		display:none;
	}
	#intro .startBtnDis{
		display:none;
	}
	#intro #howto{
		background:#dbcc9d;
		clear:both;
	}
	#intro #howto .img{
		padding:10px 0 3px 0;
	}
	#intro #howto .description{
		padding: 0 0 13px 15px;
		line-height:1.8;
		color:#2c6c2c;
	}
	#intro #howto .btnRanking{
		text-align:center;
		margin:0 0 24px 0;
	}
	#intro #howto .rankingPoint table{
		width:auto;
		margin:10px 0 10px 25px;
		color:#2c6c2c;
	}
	#intro #howto .rankingPoint th{
		font-weight:normal;
		padding:0 12px 7px 0;
	}
	#intro #howto .rankingPoint td{
		font-weight:bold;
		padding:0 0 7px 0;
	}
	#intro #howto .rankingPoint span{
		font-size:9px;
	}
	#intro #howto .rankingPoint .note{
		font-weight:bold;
		margin:0 0 20px 10px;
		color:#2c6c2c;
	}
	#intro .environment ul{
		text-align:left;
		margin:5px 0 0 20px;
		color:#2c6c2c;
	}
	#intro .environment ul li{
		background:url(../images/intro/list_dot.gif) no-repeat 0 6px;
		-webkit-background-size:7px 3px;
		-moz-background-size:7px 3px;
		-ms-background-size:7px 3px;
		background-size:7px 3px;
		padding-left:10px;
	}
	#intro .environment .note{
		font-size:10px;
		padding: 5px 0 0 20px;
		color:#2c6c2c;
	}
	
	#intro .copyright{
		font-size:7px;
		text-align: center;
		padding:35px 0 10px 0;
		line-height:1;
		color:#603813;
	}


#game{
	display:none;
	position:absolute;
	top:0px;
	width:320px;
	height:416px;
	background: url(../images/game/bg.gif) #90b76e no-repeat top left;
	-webkit-background-size:320px 70px;
	-moz-background-size:320px 70px;
	-ms-background-size:320px 70px;
	background-size:320px 70px;
	user-select:none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	font-size:10px;
	line-height:1.2;
	overflow:hidden;
}
	#gameCanvas,
	#gameCanvas div,
	#gameCanvas img{
		font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	    user-select:none;
	    -moz-user-select: none;
	    -khtml-user-select: none;
	    -webkit-user-select: none;
	    -moz-user-select: none;
	    -ms-user-select: none;
	    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	}

#end{
	display:none;
	position:absolute;
	width:320px;
	background: url(../images/end/bg.gif) #dbcc9d no-repeat top left;
	-webkit-background-size:320px 44px;
	-moz-background-size:320px 44px;
	-ms-background-size:320px 44px;
	background-size:320px 44px;
	font-size:14px;
	line-height:1;
	color:#333;
	overflow:hidden;
}
	#end table{
		border-spacing:0;
		border-collapse:collapse;
	}
	#end .wrap{
		padding:10px;
	}
	#end #endHead{
		height:38px;
	}
	#end #endHead p{
		font-size:9px;
		position:absolute;
		top:19px;
	}
	#end #endHead .playDate{
		left:120px;
		width:67px;
	}
	#end #endHead .userName{
		left:222px;
		width:87px;
	}
	#end #endResult p{
		font-weight:bold;
		font-size:10px;
		margin-bottom:5px;
	}
	#end h2{
		height:35px;
		overflow:hidden;
	}
	#end .scoreHead {
		width:100%;
		margin-top:-1px;
	}
	#end .scoreHead th,#end .scoreHead td{
	}
	#end .scoreHead .scoreTr{
		border:1px solid #2c6c2c;
		background:#fff;
	}
	#end .scoreHead .totalTr{
		border:1px solid #2c6c2c;
	}
	#end .scoreHead .totalTr td{
		background: url(../images/end/score_bg.gif) #2c6c2c no-repeat left top;
		-webkit-background-size:298px 32px;
		-moz-background-size:298px 32px;
		-ms-background-size:298px 32px;
		background-size:298px 32px;
		color:#fff;
		font-weight:bold;
		height:32px;
		font-size:13px;
		text-align:right;
	}
	#end .countTable{
		font-size:12px;
		color:#603813;
		font-weight:bold;
		margin:0 0 17px 0;
	}
	
	#end .countTable th{
		text-align:center;
		width:74px;
		background:#603813;
		border-right:1px solid #cdbdad;
		color:#dbcc9d;
	}
	#end .countTable th:first-child{
		background:#603813 url(../images/end/countTable_tl.gif) no-repeat left top;
		-webkit-background-size:6px 6px;
		-moz-background-size:6px 6px;
		-ms-background-size:6px 6px;
		background-size:6px 6px;
	}
	#end .countTable th:last-child{
		border-right: none;
		background:#603813 url(../images/end/countTable_tr.gif) no-repeat right top;
		-webkit-background-size:6px 6px;
		-moz-background-size:6px 6px;
		-ms-background-size:6px 6px;
		background-size:6px 6px;
	}
	#end .countTable .countData td,
	#end .countTable .passData td{
		text-align:center;
		background:#fff;
		border:1px solid #603813;
	}
	#end .countTable .countData span{
		background-image:url(../images/end/bg_maru.gif);
		background-repeat:no-repeat;
		background-position: center center;
		-webkit-background-size:35px 35px;
		-moz-background-size:35px 35px;
		-ms-background-size:35px 35px;
		background-size:35px 35px;
	}
	#end .countTable .countData span.batsu{
		background-image:url(../images/end/bg_batsu.gif);
	}
	#end .countTable .countData td span{
		font-size:24px;
		padding:8px 0;
		display:block;
	}
	#end .countTable .passData td span{
		font-size:16px;
		padding:8px 0;
		display:block;
	}
	#end .countTable s{
		color:#e80000;
		text-decoration: line-through;
	}
	#end .scoreHead .totalTr .score{
		font-size:18px;
	}
	#end .scoreHead .scoreTr th{
		font-size:12px;
		padding:8px;
		color:#2c6c2c;
	}
	#end .scoreHead .scoreTr td{
		font-weight:bold;
		font-size:16px;
		padding:6px 8px;
		text-align:right;
	}
	#end .scoreHead .scoreTr .levelType{
		font-size:20px;
	}
	#end .scoreHead .pointTr{
		border:1px solid #2c6c2c;
		color:#fff;
		height:46px;
		overflow:hidden;
	}
	#end .scoreHead .pointTr th img{
		margin:0 5px 0 0;
		position:relative;
		top:3px;
	}
	#end .scoreHead .pointTr td{
		background:#000 url(../images/end/bg_point.gif) no-repeat top left;
		-webkit-background-size:299px 45px;
		-moz-background-size:299px 45px;
		-ms-background-size:299px 45px;
		background-size:299px 45px;
		font-weight:bold;
		font-size:18px;
		padding:0 10px 0 0;
		text-align:right;
	}
	#end .scoreHead .pointTr td span{
		font-size:32px;
	}
	
	#end .scoreMain {
		width:100%;
		font-weight:bold;
	}
	#end .scoreMain th {
		border:1px solid #2c6c2c;
		background:#bfd3bf;
		color:#2c6c2c;
		text-align:center;
		font-size:10px;
		padding:10px 6px;
		font-weight:normal;
		white-space: nowrap;
		width:25%;
	}
	#end .scoreMain td {
		border:1px solid #2c6c2c;
		background:#fff;
		text-align:center;
		font-size:10px;
		padding:8px 6px;
	}
	#end .scoreMain span{
		font-size:13px;
	}
	#end .scoreDetail{
		font-size:10px;
		border-bottom:1px solid #215521;
		border-right:1px solid #215521;
		border-left:1px solid #215521;
		border-radius:0 0 5px 5px;
		background:#fff;
		white-space: nowrap;
	}
	#end .scoreDetail table{
		width:100%;
	}
	#end .scoreDetail th{
		padding:6px 10px;
		color:#215521;
	}
	#end .scoreDetail td{
		font-weight:bold;
		padding:6px 10px 6px 0;
		text-align:right;
	}
	
	
	#end .share{
		margin:0 0;
		height:60px;
		position:relative;
	}
	#end .share p{
		position:absolute;
		left:8px;
		top:18px;
		font-size:13px;
		font-weight:bold;
	}
	#end .share p img{
		position:relative;
		top:3px;
	}
	#end .share ul{
		position:absolute;
		left:150px;
		top:8px;
		display:inline;
	}
	#end .share li{
		float:left;
		display:inline;
		margin-left:25px;
	}
	#end .share form{
		display:inline;
	}
	#end .share button{
		border:none;
		background:none;
		margin:0;
		padding:0;
		display:inline;
	}
	#end .campaignInfo{
		text-align:center;
		color:#e40000;
		font-weight:bold;
		font-size:12px;
		margin:0 -15px 10px -15px;
		line-height:1.3;
	}
	#end .campaignInfo span{
		font-size:10px;
		color:#333;
		font-weight: normal;
	}
	#end .campaignInfo strong{
		color:#e40000;
	}
	#end #endRanking {
		margin-top:20px;
	}
	#end #endRanking h2{
		background: url(../images/end/ttl_ranking_bg.gif) #2c6c2c no-repeat left top;
		-webkit-background-size:300px 35px;
		-moz-background-size:300px 35px;
		-ms-background-size:300px 35px;
		background-size:300px 35px;
		color:#dbcc9d;
		font-size:17px;
		padding:8px 0 0 36px;
		height:27px;
	}
	#end #endRanking h2 img{
		position:relative;
		top: 3px;
		padding:0 0 0 2px;
	}
	#end #endRanking table{
		clear:both;
		width:100%;
	}
	#end #endRanking td {
		border:1px solid #2c6c2c;
		background:#fff;
		font-size:13px;
		font-weight:bold;
		padding:5px;
	}
	#end #endRanking .rankTd{
		background:#bfd3bf;
		text-align:center;
		width:25px;
	}
	#end #endRanking .scoreTd{
		text-align:right;
	}
	#end #endRanking .userName{
		display:block;
		width:160px;
		height:1.4em;
		overflow:hidden;
		white-space:nowrap;
		text-overflow: ellipsis;
	}
	#end .copyright{
		font-size:7px;
		text-align: center;
		padding:35px 0 10px 0;
		line-height:1;
		color:#2c6c2c;
	}

#ranking{
	display:none;
	position:absolute;
	width:320px;
	background: url(../images/end/bg.gif) #dbcc9d no-repeat top left;
	-webkit-background-size:320px 44px;
	-moz-background-size:320px 44px;
	-ms-background-size:320px 44px;
	background-size:320px 44px;
	font-size:14px;
	line-height:1;
	color:#333;
}
	#ranking table{
		border-spacing:0;
		border-collapse:collapse;
	}
	#ranking .wrap{
		padding:10px;
	}
	#ranking #rankingHead{
		height:38px;
	}
	#ranking #rankingHead p{
		font-size:9px;
		position:absolute;
		top:19px;
	}
	#ranking #rankingHead .playDate{
		left:120px;
		width:67px;
	}
	#ranking #rankingHead .userName{
		left:222px;
		width:87px;
	}
	#ranking #rankingResult h2{
		height:35px;
		overflow:hidden;
	}
	#ranking .scoreMain {
		width:100%;
		font-weight:bold;
	}
	#ranking .scoreMain th {
		border:1px solid #2c6c2c;
		background:#bfd3bf;
		color:#2c6c2c;
		text-align:center;
		font-size:10px;
		padding:10px 4px;
		font-weight:normal;
		white-space: nowrap;
		width:25%;
	}
	#ranking .scoreMain td {
		border:1px solid #2c6c2c;
		background:#fff;
		text-align:center;
		font-size:10px;
		padding:8px 6px;
	}
	#ranking .scoreMain span{
		font-size:13px;
	}
	#ranking #rankingResult p.foot{
		background:url(../images/end/type_bg.gif) no-repeat left top;
		-webkit-background-size:300px 31px;
		-moz-background-size:300px 31px;
		-ms-background-size:300px 31px;
		background-size:300px 31px;
		height:24px;
		text-align:center;
		color:#e80000;
		font-size:17px;
		font-weight:bold;
		padding:7px 0 0 80px;
	}
	#ranking .btnReflesh{
		text-align:center;
		margin:17px 0;
	}
	
	#ranking #rankingRanking h2{
		background: url(../images/end/ttl_ranking_bg.gif) #2c6c2c no-repeat left top;
		-webkit-background-size:300px 35px;
		-moz-background-size:300px 35px;
		-ms-background-size:300px 35px;
		background-size:300px 35px;
		color:#dbcc9d;
		font-size:17px;
		padding:8px 0 0 36px;
		height:27px;
	}
	#ranking #rankingRanking h2 img{
		position:relative;
		top: 3px;
		padding:0 0 0 2px;
	}
	#ranking #rankingRanking table{
		clear:both;
		width:100%;
	}
	#ranking #rankingRanking td {
		border:1px solid #2c6c2c;
		background:#fff;
		font-size:13px;
		font-weight:bold;
		padding:5px;
	}
	#ranking #rankingRanking .rankTd{
		background:#bfd3bf;
		text-align:center;
		width:25px;
	}
	#ranking #rankingRanking .scoreTd{
		text-align:right;
	}
	#ranking #rankingRanking .userName{
		display:block;
		width:160px;
		height:1.4em;
		overflow:hidden;
		white-space:nowrap;
		text-overflow: ellipsis;
	}
	#ranking .copyright{
		font-size:7px;
		text-align: center;
		padding:35px 0 10px 0;
		line-height:1;
		color:#2c6c2c;
	}
	
	

#socialBonus{
	display:none;
	top:0;
	left:0;
	position:absolute;
	width:320px;
	background: rgba(0,0,0,0.6);
	font-size:12px;
	line-height:1.5;
	color:#333;
	z-index:100;
	text-align:center;
	height:416px;
}
	#socialBonus .wrap{
		width:250px;
		margin:48px auto 0 auto;
		text-align:left;
	}
	#socialBonus .head{
		
		width:246px;
		height:37px;
		border-top:2px solid #21b7ee;
		border-right:2px solid #21b7ee;
		border-left:2px solid #21b7ee;
		border-radius:4px 4px 0 0;
		background:url(../images/socialbonus/head_bg.gif) repeat-x;
		-webkit-background-size:1px 37px;
		-moz-background-size:1px 37px;
		-ms-background-size:1px 37px;
		background-size:1px 37px;
	}
	#socialBonus h2{
		float:left;
		margin:5px 0 0 8px;
	}
	#socialBonus .close{
		float:right;
		margin:5px 7px 0 0;
	}
	#socialBonus .main{
		width:246px;
		border-right:2px solid #21b7ee;
		border-left:2px solid #21b7ee;
		background:#222;
	}
	#socialBonus .mainImg{
		background-repeat:no-repeat;
		-webkit-background-size:246px 75px;
		-moz-background-size:246px 75px;
		-ms-background-size:246px 75px;
		background-size:246px 75px;
		text-align:center;
		font-weight:bold;
		padding-top:9px;
		height:66px;
		overflow:hidden;
		font-size:12px;
		color:#563107;
	}
	#socialBonus .mainImg strong{
		color:#e00000;
	}
	
	#socialBonus .best{
		background-image:url(../images/socialbonus/mainimg_best.jpg);
	}
	#socialBonus .working{
		background-image:url(../images/socialbonus/mainimg_working.jpg);
	}
	#socialBonus .point{
		height:30px;
		overflow:hidden;
		border-bottom:2px solid #3c3c3c;
	}
	#socialBonus .shareBody{
		margin:7px 11px 0 11px;
		background:#fff;
		border:1px solid #a8a8a8;
		border-radius:4px;
		padding:8px;
	}
	#socialBonus .img{
		width:66px;
		height:57px;
		overflow:hidden;
		float:left;
	}
	#socialBonus .txt{
		width:140px;
		float:left;
		font-size:8px;
	}
	#socialBonus .foot{
		width:246px;
		border-bottom:2px solid #21b7ee;
		border-right:2px solid #21b7ee;
		border-left:2px solid #21b7ee;
		border-radius:0 0 4px 4px;
		background:#222;
		padding-top:10px;
		padding-bottom:4px;
		text-align:center;
	}
	
	#socialBonus .shareBtn{
		width:218px;
		margin:0 auto;
	}
	#socialBonus .shareBtn li{
		display: inline;
	}
	#socialBonus .shareBtn li button{
		background:none;
		margin:0;
		padding:0;
		border:none;
		width:61px;
		display:block;
		margin-right:17px;
		margin-left: 25px;
		float:left;
	}
	#socialBonus .shareBtn li:last-child button{
		margin-right:0;
	}
	#socialBonus form{
		display:inline;
	}




#initData{
	display:none;
}