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

/************************
 console
************************/

.console {
	position: absolute;
	right:30px;
	top:100px;
	z-index:10;
	}
	
.console a{
	width:112px;
	height:26px;
	}


/************************
 scroll_btn
************************/
.s_btn{
	position:absolute;
	display:block;
	bottom:10px;
	width:110px;
	left:50%;
	margin-left:-55px;
	height:102px;
	z-index:15;
	}

.s_btn a{
	display:block;
	width:110px;
	margin:0 auto;
	height:102px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background:url(../images/top_icon_scl.png) 0 0 no-repeat;
	}



/************************
 topblock
************************/
#top_block{
	position:relative;
	top:0;
	width:100%;
	z-index:0;
	overflow:hidden;
}

#top_block .mainImg{
	background:url(../images/index/mainImg.jpg) center top no-repeat;
	width:100%;
	min-height:100%;
	position:fixed;
	background-size:cover;
}

/*
.top_box{
	position:relative;
	width:90%;
	margin:0 auto;
	height:95%;
	top:5%;
	z-index:10;
}
*/

.top_box{
	position:relative;
	margin:0 auto;
	z-index:10;
}

#top_logo{
	position:absolute;
	top:70px;
	left:0;
}

.top_catch{
	position:absolute;
	top:10%;
	left:0.5%;
	width: 8%;
}

.top_hard{
	position:absolute;
	top:40px;
	left:16px;
}

/*
.top_20th{
	position:absolute;
	right:160px;
	top:50px;
}
*/

.movie{
	width:250px;
	padding:10px;
	text-align:center;
	position:absolute;
	right:30px;
	top:120px;
}

.top_text{
	position:absolute;
	right:20px;
	bottom:20px;
}

.top_text img{
	max-width:100%;
}


.date{
	position:absolute;
	width:270px;
	height:120px;
	top:160px;
	left:20px;
}

.ecaplink{
	position:absolute;
	top:430px;
	left:30px;
}


.pre_order{
	position:absolute;
	top:260px;
	left:30px;
	width:250px;
	box-sizing:border-box;
	border:1px solid #fe0101;
	background:rgba(200,26,41,0.6);
	text-align:center;
	}

.pre_order div{
	margin:auto auto;
	text-align:center;
	padding:5px 0;
	}

.pre_order ul{
	margin:auto auto;
	text-align:center;
	letter-spacing:-.40em;
	padding:5px 0 10px;
	}

.pre_order ul li{
	display:inline-block;
	letter-spacing:normal;
	}

.pre_order ul li+li{
	margin-left:10px;
	}

.pre_order p{
	display:block;
	text-align:center;
	background:rgba(251,1,1,0.5);
	padding:4px 0;
	}

.pre_order .blank{
	opacity:0.3;
	}


/************************
 menu
************************/
#menu{
	position: absolute;
	top:200px;	
	}

#menu li{
	position:relative;
	}


#menu li a.new:before{
	content:"";
	position:absolute;
	display:block;
	width:33px;
	height:14px;
	z-index:10;
	top:12px;
	background:url(../images/menu/new.png) 0 0 no-repeat;
	}

#menu li:hover a.new:before{
	display:none;
	}


#menu li:nth-child(1) a.new:before{
	left:70px;
	}

#menu li:nth-child(2) a.new:before{
	left:50px;
	}

#menu li:nth-child(3) a.new:before{
	left:30px;
	}

#menu li:nth-child(4) a.new:before{
	left:70px;
	}

#menu li:nth-child(5) a.new:before{
	left:50px;
	}



#menu li a img{
	position:relative;
	top:0;
	left:0;
	padding:2px 0;
	}


#menu.fixed {
    position: fixed;
	width:100%;
    top: 50px;
    z-index: 500;
}



/************************
 topic
************************/
.topic{
	position: absolute;
	bottom:0;
	left:30px;
	z-index:50;
	width:250px;
	margin-bottom:30px;
	padding:5px 10px 0;
	font-size:90%;
}

.topic li{
	display:block;
	margin:0 auto;
	text-align:left;
	font-size:0.9em;
	padding:5px;
}



.topic li.topic_date{
	color:#da3110;
	font-weight:bold;
}


.topic li.topic_txt{
	position:relative;
	box-sizing:border-box;
	border-top:1px solid #383838;
}

.topic li a{
	box-sizing:border-box;
	line-height:1.4em;
	vertical-align:middle;
	overflow:hidden;
	display:block;
	width:100%;
	padding:5px 20px 5px 0;
	background: url(../sp/images/menu/menu_arrow.png) center right no-repeat;
	background-size:16px auto;
}



/************************
 info
************************/
section#info{
	position:relative;
	overflow:hidden;
	}

section#info .slideBox{
	width:1024px;
	margin:auto auto;
	box-sizing:border-box;
	}

section#info .slideBox > div.corner{
	position:relative;
	}

section#info .slideBox > .corner.up:before{
	content:url(../images/menu/up.png);
	position:absolute;
	left:2px;
	top:2px;
	z-index:100;
	}

section#info ul{
	letter-spacing:-.40em;
	margin:auto auto;
	text-align:center;
	}

section#info ul li{
	letter-spacing:normal;
	position:relative;
	display:inline-block;
	}

section#info ul li.new:before{
	content:url(../images/menu/new.png);
	position:absolute;
	left:2px;
	top:2px;
	z-index:100;
	}

section#info ul li.up:before{
	content:url(../images/menu/up.png);
	position:absolute;
	left:2px;
	top:2px;
	z-index:100;
	}

section#info ul li a{
	position:relative;
	display:block;
	padding:10px;
	}

section#info ul#slider li a img{
	display:inline;
	height:200px;
	}

section#info ul li a span{
	position: absolute;
	box-sizing:border-box;
	margin:0 2px 2px;
	left:-1px;
	bottom:0;
	display:block;
	width:99%;
	overflow:hidden;
	padding:10px;
	text-align:left;
	font-size:90%;
	background:rgba(0,0,0,0.75);
	}


section#info ul.m_box li+li{
	margin-left:20px;
	}

section#info ul.m_box li a img{
	display:inline;
	height:200px;
	}

/************************
 wrapper
************************/

#wrapper{
	background:rgba(0,0,0,0.8);
	}
	
#wrapper section{
	position:relative;
	}
	
/************************
 section copy
************************/

div#copy{
	margin:auto auto;
	text-align:center;
	padding:50px 0 0;
	}

div#copy .text{
	width:740px;
	margin:auto auto;
	text-align:left;
	}

/************************
 section stage_Block
************************/
section#stg{
	position:relative;
	height:500px;
	margin-top:80px;
	}


section#stg .bgImg{
	position:absolute;
	width:1280px;
	height:500px;
	left:50%;
	margin-left:-640px;
	}


section #stage_Block{
	position:relative;
	width:1024px;
	margin:0 auto;
	}


section #stage_Block .inner{
	width:520px;
	display:block;
	margin:auto 0 auto auto;
	padding-top:80px;
	}


section#stg h2{
	position:relative;
	}

section#stg h2.new:before{
	position:absolute;
	top:-30px;
	content:url(../images/index/newStg_ja.png);
	margin-left:15px;
	}

section#stg h2.up:before{
	position:absolute;
	top:-30px;
	content:url(../images/index/upStg_ja.png);
	margin-left:15px;
	}

section #stage_Block .text{
	margin-top:20px;
	margin-left:20px;
	}

section #stage_Block .links{
	margin-top:20px;
	margin-left:20px;
	}




/************************
 section battle_Block
************************/
section#btl{
	position:relative;
	height:500px;
	margin-top:100px;
	margin-bottom:100px;
	}

section#btl .bgImg{
	position:absolute;
	width:1280px;
	height:500px;
	left:50%;
	margin-left:-640px;
	}

section#btl .bgImg img{
	padding-left:520px;
	}



section #battle_Block .inner{
	width:360px;
	display:block;
	position:absolute;
	left:300px;
	top:70px;
	}

section#btl h2.new:before{
	position:absolute;
	top:-30px;
	content:url(../images/index/newAct_ja.png);
	margin-left:20px;
	}

section#btl h2.up:before{
	position:absolute;
	top:-30px;
	content:url(../images/index/upAct_ja.png);
	margin-left:20px;
	}



section #battle_Block .text{
	margin-top:20px;
	margin-left:20px;
	}

section #battle_Block .links{
	margin-top:20px;
	margin-left:20px;
	}

/************************
 inBox
************************/

.inBox{
	width:100%;
	height:563px;
	overflow:hidden !important;
	}



/*************************************************
スペック
**************************************************/
#spec01,#spec02{
	position:relative;
	width:998px;
	margin:40px auto;
}

#spec01 div,#spec02 div{
	margin:15px;
}

#spec01 .logos{
	position:absolute;
	top: 0;
	right: 0;
}

#spec01 .logos div{
	position:relative;
	display:inline-block;
	margin:0;
}

#spec01 .logos div+div{
	margin-left:10px;
}

/*
#spec01 .cero{
	position:absolute;
	width:58px;
	height:71px;
	top: 0;
	right: 0;
}

.spec_rating{
	height:100px;
	position:absolute;
	top:15px;
	right:15px;
}
*/

.faq ul li{
	display:inline-block;
	margin:auto 10px;
	}

.faq ul li a{
	display:block;
	padding:0.5em 0;
	text-align:center;
	width:200px;
	border:1px solid #FFF;
	}

.faq ul li a:before{
	content:">";
	padding-right:0.5em;
	}

.faq ul li a:hover{
	background:#333;
	}