@charset "UTF-8";

/*=============================================
setting
==============================================*/
*{
	
}
html{
	background-color:#000;
}
body{
	font-family: Verdana, Arial, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	width:100%;
	background:url(../img/bg.jpg) repeat-x center 36px;
	background-size:250px 360px;
	position:relative;
	font-size:10px;
	color:#fff;
}
p{
	line-height:140%;
}

h1{ display:none; }

#wrap{
	position:relative;
}
/*=============================================
共通Class
==============================================*/
.wrap_inr{
	
}
#wrapper{
	width:100%;
	background:url(../img/bgMain.jpg) repeat-y center top;
	background-size:370px 5px;
	position:relative;
	margin-top:-4px;
}



#keyVisual{
	width:100%;
/*	height:287px;*/
	height:320px;
	background:url(../img/keyVisual.jpg) no-repeat center top;
	background-size:370px 287px;
	position:relative;
}

#keyVisual a#capLogo{
	display:block;
	width:74px;
	height:15px;
	background:url(../img/capLogo.png) no-repeat center top;
	background-size:74px 15px;
	position:absolute;
	top:3px;
	left:3px;
}

#report{
	width:100%;
	height:193px; /*height:240px;*/
	background:url(../img/reportBG.png) no-repeat center top;
	background-size:325px 193px;
	margin:12px auto 0 auto;
	position:relative;
}
	#reportBox{
		width:320px;
		height:190px;
		overflow:hidden;
		margin:0 auto;
	}
	#reportBox iframe{
		width:320px; height:180px; border:none; padding-top:12px; margin:0 auto;
	}
	.reportBoxBoxInner{margin:0 auto;}
#trailer{
	width:100%;
	height:260px; /*height:240px;*/
	background:url(../img/trailerBG.png) no-repeat center top;
	background-size:325px 193px;
	margin:12px auto 0 auto;
	position:relative;
}
	#trailerBox{
		width:320px;
		height:190px;
		overflow:hidden;
		margin:0 auto;
	}
	#trailerBox iframe{
		width:320px; height:180px; border:none; padding-top:12px; margin:0 auto;
	}
	.trailerBoxInner{margin:0 auto;}
	#trailer ul{
		width:320px;
		height:58px; /*height:24px;*/
		margin:10px auto;
		overflow:hidden;
	}
	
		#trailer ul li{
			width:88px;
			height:24px;
			margin:0 5px 0 0;
			float:left;
		}
		
			#trailer ul li span{
				display:block;
				width:88px;
				height:24px;
				background:url(../img/trailers_menu.jpg) no-repeat;
				background-size:176px 48px;
			}
		
		#trailer ul li.btn_trailer1 span{
			background-position:0px -24px;
		}
			#trailer ul li.btn_trailer1 span.active{
				background-position:0px 0px;
			}
			
		#trailer ul li.btn_trailer2 span{
			background-position:-88px -24px;
		}
			#trailer ul li.btn_trailer2 span.active{
				background-position:-88px 0px;
			}
		
		#trailer ul li.btn_trailer3{width:94.5px; margin-right:10px;}
		#trailer ul li.btn_trailer3 span{
				width:94.5px;
				height:24px;
				background:url(../img/trailers_menu03.jpg) no-repeat;
				background-size:94.5px 48px;
				background-position:0px -24px;
		}
			#trailer ul li.btn_trailer3 span.active{
				background-position:0px 0px;
			}
		
		#trailer ul li.btn_trailer4{width:110px; margin-bottom:10px; position:relative;}
		#trailer ul li.btn_trailer4 span{
				width:86px;
				height:24px;
				background:url(../img/trailers_menu04.jpg) no-repeat left top;
				background-size:86px 48px;
				background-position:0px -24px;
		}
			#trailer ul li.btn_trailer4 span.active{
				background-position:0px 0px;
			}
		
		#trailer ul li.btn_trailer5{width:99px; margin-bottom:10px; position:relative;}
		#trailer ul li.btn_trailer5 span{
				width:90px;
				height:24px;
				background:url(../img/trailers_menu05.jpg) no-repeat left top;
				background-size:90px 48px;
				background-position:0px -24px;
		}
			#trailer ul li.btn_trailer5 span.active{
				background-position:0px 0px;
			}
		#trailer ul li.btn_trailer6{width:90px; margin-bottom:10px; position:relative;}
		#trailer ul li.btn_trailer6 span{
			width:90px;
			height:24px;
			background:url(../img/trailers_menu06.jpg) no-repeat left top;
			background-size:90px 48px;
			background-position:0px -24px;
		}
			#trailer ul li.btn_trailer6 span.active{
				background-position:0px 0px;
			}
		#trailer ul li.btn_trailer6 div.lblNew{width:24px; height:13px; background:url(../img/lblNew.png) no-repeat center top; position:absolute; top:5px; right:0px; background-size:24px 13px;}

#trailer .lblUpdate{
	width:36px;
	height:13px;
	background:url(../img/lblUpdate.png) no-repeat center top;
	background-size:36px 13px;
	position:absolute;
	left:50%;
	margin-left:-110px;
	top:1px;
}

.lblOpen0909{
	width:73px;
	height:12px;
	background:url(../img/lblOpen0909.png) no-repeat center top;
	background-size:73px 12px;
	position:absolute;
	left:50%;
	margin-left:-118px;
	top:1px;
}


#trailer #playArea{
	display:block;
	margin:0 auto;
	padding-top:12px;
}



#screenshots{
	width:320px;
	background:url(../img/screenshots_title.jpg) no-repeat left top;
	background-size:85px 11px;
	margin:12px auto 0;
	padding:11px 0 0;
	position:relative;
	overflow:hidden;
}

	#screenshots li{
		width:78px;
		height:43px;
		float:left;
		padding:0 2px 0 0;
	}
	#screenshots li img{
		display:block;
		width:78px;
		height:43px;
	}


#screenshots .lblNew{
	width:24px;
	height:13px;
	background:url(../img/lblNew.png) no-repeat center top;
	background-size:24px 13px;
	position:absolute;
	left:50%;
	margin-left:-73px;
	top:-1px;
}

#screenshotBox{
	width:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:100;
	display:none;
}

	.screenshotImage{
		width:100%;
		position:absolute;
		top:0;
		left:0;
		z-index:10;
		text-align:center;
		overflow:hidden;
	}
		.screenMsk{
			overflow:hidden;
			width:90%;
			margin:0 auto;
			position:relative;
		}
		.screenshotImage ul{
			
		}
		.screenshotImage li{
			float:left;
		}
		.screenshotImage img{
			margin:0 auto 0;
		}
		
		#screen_scroller{
			position:relative;
			left:0;
			-webkit-transition: -webkit-transform 500ms;
			-webkit-transition-timing-function:ease;
		}

	.screenshotBg{
		width:100%;
		position:absolute;
		background:#000;
		opacity:0.8;
		top:0;
		left:0;
		z-index:1;
	}

.sns_catch{
	width:320px;
	margin:0 auto;
}

#btnLinkTw, #btnLinkFb{
	width:280px;
	margin:5px auto;
	position:relative;
}

#btnLinkTw a, #btnLinkFb a{
	display:block;
	width:280px;
	height:40px;
}

#btnLinkTw a{	background:url(../img/btnLinkTw.png) no-repeat 0 0; background-size:280px 80px;	}
#btnLinkFb a{	background:url(../img/btnLinkFb.png) no-repeat 0 0; background-size:280px 80px;	}

#btnLinkTw a:hover, #btnLinkFb a:hover{
	background-position:0 -40px;
}

#titleSpec{
	width:100%;
	height:145px;
	background:url(../img/titleSpec.jpg) no-repeat center top;
	background-size:370px 145px;
	position:relative;
}


#copy{
	width:100%;
	height:50px;
	background:url(../img/copy.png) no-repeat center center;
	background-size:305px 46px;
}

#copy p{ display:none; }

.bold{	font-weight:bold;	}
.red{	color:#a40000;	}
.hide{ display:none;}
.clear{ clear:both;	}
.spc5{	height:5px;font-size:5px;line-height:5px;	}
.spc10{	height:10px;font-size:5px;line-height:5px;	}
.spc15{	height:15px;font-size:5px;line-height:5px;	}
.spc20{	height:20px;font-size:5px;line-height:5px;	}
.spc25{	height:25px;font-size:5px;line-height:5px;	}
.spc30{	height:30px;font-size:5px;line-height:5px;	}
.spc35{	height:35px;font-size:5px;line-height:5px;	}
.spc36{	height:36px;font-size:5px;line-height:5px;	}
.spc40{	height:40px;font-size:5px;line-height:5px;	}
.spc50{	height:50px;font-size:5px;line-height:5px;	}
.spc60{	height:60px;font-size:5px;line-height:5px;	}

a.shareTW,
a.shareFB,
a.shareLN{
	display:block; width:40px; height:40px;
	background:url(../img/shareicons40x2.png) no-repeat;
	background-size:120px 80px;
	margin-left:5px; float:left
}

a.shareTW{background-position:0px 0px;}
a.shareTW:hover{background-position:0px -40px;}
a.shareFB{background-position:-40px 0px;}
a.shareFB:hover{background-position:-40px -40px;}
a.shareLN{background-position:-80px 0px}
a.shareLN:hover{background-position:-80px -40px}

.snsLink{
	padding-top:272px;
	/*padding-top:250px;*/
	width:135px;
	margin:0 auto;
	position:relative;
}

#keyVisual a#capLogo{background-image:url(static/img/capLogo.png)}
#footer{position:relative; height:84px; width:100%}
#copy {
position:absolute; top:0; left:0;
width:100%;
height:74px;
background: url(../img/copy.png) no-repeat center center;
background-size:290px 56px;
}
#footer a#footercopy{
	margin:0 auto;
	position:relative; top:40px; left:-98px;
	display:block; width:94px; height:26px;
}