@charset "utf-8";
#pc_wrap{
	position:relative;
	left:0;
	top:0;
	width:100%;
}
body {
	background:#000000;
	width:100%;
	height:100%;
}

#container{
	position:relative;
	width:100%;
	min-width:1000px;
	overflow:hidden;
	padding-bottom:280px;
}

#main{
	position:relative;
	width:1000px;
	height:750px;
	margin:60px auto 0;
}


#banner_area{
	position:absolute;
	width:530px;
	height:60px;
	bottom:165px;
}

#movieticket{
	
	margin-left:-13px;
	margin-top:-4px;

	float:left;
}


#trick{
	margin-left:10px;
	float:left;


}

#banner_area2{
	position:absolute;
	width:560px;
	height:50px;
	bottom:20px;
	right:0;
	left:0;
	margin:0 auto;
}

#banner_area2 img{
	
	float:left;
}


/* フッター要素 */

#t_footer{
	position:fixed;	
	width:100%;
	height:79px;
	bottom:0px;
	background:#000;
	border-top:1px solid #869399;
	z-index:1;
}

#t_copyright{
	width:182px;
	position:absolute;
	margin:20px 0;
	right:20px;

}


#banner{
	position:absolute;
	width:560px;
	height: 50px;
	margin:0px auto;
	top:-75px;
	left:0px;
	right:0;

}

#banner img{
	float:left;
}

.majar{
	margin-left:10px;
	
}

/*クレジット*/

#cre{
	width:121px;
	position:absolute;
	left:0;
	right:0;
	cursor:pointer;
	margin:35px auto;
}

#credit{
	position:absolute;
	width:100%;
	height:140px;
	background:url(../img/top/credit.gif) no-repeat center center #000000;
	border-top:1px solid #869399;
	bottom:-140px;
	left:0;
}




/* コピーライト */

#copyright{
	position:absolute;
	height: 40px;
	margin: 0px;
	bottom:20px;
	right:20px;	

}

/* シェア周り */
#sns_btns{
	width:500px;
	height:20px;
	overflow:hidden;
	position:absolute;
	top:28px;
	left:20px;
}

#sns_btns li{
	list-style:none;
	float:left;
	margin:0 5px;
}
#s_tw{
	overflow:hidden;
}
#s_fb{
	width:70px;
	overflow:hidden;
}
#gplus{
	width:33px;
	overflow:hidden;
}

.fix_wrap{
    width: 100%;
    min-width: 1000px;
    position: relative;
    left: 0;
    top: 0;
    height: 79px;
}




#v_wrap{
	position:absolute;
	width:100%;
	height:100%;
	overflow:hidden;
	left:0;
	top:0;
}
.one_wrap{
	margin-top:60px;
	position:relative;

}

.inner_w{
	position:relative;
	margin:60px 20px 0;
}
h1{
	position:absolute;
	bottom:32px;
	left:0;
}
#banner00{
	position:absolute;
	right:0;
	bottom:325px;
}
#banner0{
	position:absolute;
	right:0;
	bottom:255px;
}
#banner1{
	position:absolute;
	right:0;
	bottom:165px;
}
#banner2{
	position:absolute;
	right:0;
	bottom:95px;
}
#banner3{
	position:absolute;
	right:150px;
	bottom:40px;
}
#banner4{
	position:absolute;
	right:300px;
	bottom:40px;
}
#banner5{
	position:absolute;
	right:0px;
	bottom:40px;
}
#banner6{
	position:absolute;
	right:150px;
	bottom:40px;
}



#mouse{
	position:absolute;
	left:50%;
	bottom:20px;
	margin-left:-79px;
}

.intro_warp{
	position:relative;
	background:#040726;
}
#intro_copy1{
	position:absolute;
	right:-10%;
	top:0;
}
#intro_copy2{
	position:absolute;
	left:-10%;
	top:0;
}
.intro_warp h2{
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
	-webkit-transform:translate3d(0,20%,0);
	transform:translate3d(0,20%,0);
	opacity:0;
}
.intro_warp h3{
	position:absolute;
	left:50%;
	bottom:30px;
	margin-left:-252px;
}
#intro_bg2{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	opacity:0;
}



.story_warp{
	position:relative;
}
.story_bg{
	position:relative;
}

.story_warp .story_bg:nth-child(1){
	-webkit-transform:translate3d(-100%,0,0);
	transform:translate3d(-100%,0,0);
}
.story_warp .story_bg:nth-child(2){
	-webkit-transform:translate3d(100%,0,0);
	transform:translate3d(100%,0,0);
}
.story_warp .story_bg:nth-child(3){
	-webkit-transform:translate3d(-100%,0,0);
	transform:translate3d(-100%,0,0);
}









.story_bg h2{
	position:absolute;
	left:50%;
	top:40px;
	margin-left:-76px;
}
.story_textwrap{
	position:absolute;
	left: 50%;
	top: 121px;
	margin-left: -479px;
}

.story_bg h3{
	position:relative;
}
.story_card{
	position:absolute;
	width: 132px;
	left:50%;
	margin-left:-66px;
	bottom:40px;
	text-align:center;
}
.prono_card{
	position:absolute;
	width: 215px;
	left:50%;
	margin-left:-107px;
	top:630px;
	text-align:center;
}
.card{
	float:left;
	margin:5px;
	position:relative;
	cursor:pointer;
	width:33px;
	height:44px;
}
.nowload_card{
	position:absolute;
	left:50%;
	top:50%;
	margin-left:-90px;
	margin-top:-50px;
	width:180px;
	opacity:0;
}
.stage{
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -210px;
    width: 400px;
    height: 80px;
    background: rgb(30,87,153);
    background: -moz-radial-gradient(center, ellipse cover, rgba(30,87,153,1) 0%, rgba(0,0,0,1) 50%, rgba(0,0,0,1) 100%);
    background: -webkit-radial-gradient(center, ellipse cover, rgba(30,87,153,1) 0%,rgba(0,0,0,1) 50%,rgba(0,0,0,1) 100%);
    background: radial-gradient(ellipse at center, rgba(30,87,153,1) 0%,rgba(0,0,0,1) 50%,rgba(0,0,0,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#000000',GradientType=1 );
    border-radius: 100%;
    margin-top: -40px;
	opacity:0.4;
}
#load_text{
    position: absolute;
    left: 50%;
    top: 50%;
    color: #CCC;
    text-align: center;
    font-weight: bold;
    font-size: 12px;
    width: 100px;
    margin-left: -60px;
    margin-top: 25px;
}

.ins{
	position: absolute;
	top: 0;
	left: 0;
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	-webkit-transform:perspective(1000) rotateY(0deg);
	-moz-transform:perspective(1000px) rotateY(0deg);
	transform:perspective(1000px) rotateY(0deg);
}
.outs{
	position: absolute;
	top: 0;
	left: 0;
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	-webkit-transform:perspective(1000) rotateY(90deg);
	-moz-transform:perspective(1000px) rotateY(90deg);
	transform:perspective(1000px) rotateY(90deg);
}
.ha,.ha2{
	position:absolute;
	left:0;
	top:0;
	width:33px;
	height:44px;
}

.character_warp{
	position:relative;
}
.chara_select{
	position:absolute;
	left:0;
	top:0;
	width:100%;	
}
.chara_base{
	width:11.1%;
	float:left;
	opacity:0;
	cursor:pointer;
}
.chara_base2{
	position:absolute;
	right:0;
	top:0;
	width:11.19% !important;
	opacity:0;
	cursor:pointer;
}
.character_warp h2{
	opacity:0;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -50%;
    margin-top: 0%;
    width: 100%;
}
.character_detail{
	position:fixed;
	width:100%;
	-webkit-transform:translate3d(100%,0,0);
	transform:translate3d(100%,0,0);
	z-index:1;
}

.ch_base{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	min-width:1000px;
	min-height:600px;
	background:#000;
}
.ch_bg{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	min-width:1000px;
	min-height:600px;
	visibility:hidden;
}
.ch_base .ch_bg:nth-child(1){
	background:url(../img/character/c_bg1.jpg) no-repeat center top #000;
	background-size:cover;
}
.ch_base .ch_bg:nth-child(2){
	background:url(../img/character/c_bg2.jpg) no-repeat center top #000;
	background-size:cover;
}
.ch_base .ch_bg:nth-child(3){
	background:url(../img/character/c_bg3.jpg) no-repeat center top #000;
	background-size:cover;
}
.ch_base .ch_bg:nth-child(4){
	background:url(../img/character/c_bg4.jpg) no-repeat center top #000;
	background-size:cover;
}
.ch_base .ch_bg:nth-child(5){
	background:url(../img/character/c_bg5.jpg) no-repeat center top #000;
	background-size:cover;
}
.ch_base .ch_bg:nth-child(6){
	background:url(../img/character/c_bg6.jpg) no-repeat center top #000;
	background-size:cover;
}
.ch_base .ch_bg:nth-child(7){
	background:url(../img/character/c_bg7.jpg) no-repeat center top #000;
	background-size:cover;
}
.ch_base .ch_bg:nth-child(8){
	background:url(../img/character/c_bg8.jpg) no-repeat center top #000;
	background-size:cover;
}
.ch_base .ch_bg:nth-child(9){
	background:url(../img/character/c_bg9.jpg) no-repeat center top #000;
	background-size:cover;
}

.ch_name {
    position: absolute;
    left: 50%;
    margin-left: -449px;
    top: 80px;
}

.ch_icon{
    position: absolute;
    width: 486px;
    left: 50%;
    margin-left: 7px;
    bottom: 30px;
}
.c_icon{
	float:left;
	margin:0 2px;
	cursor:pointer;
}
.ch_back{
	position:absolute;
	left:15px;
	top:50%;
	margin-top:-20px;
	cursor:pointer;
	
}

.staff_warp{
	position:relative;
	width:100%;
	padding-bottom:60px;
}
.staff_warp h2{
	position:absolute;
	left:50%;
	margin-left:-76px;
	top:60px;
}
.staff_co{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	opacity:0;
	-webkit-transform:translate3d(0,50px,0);
	transform:translate3d(0,50px,0);
}
.prono_co{
	position:absolute;
	left:0;
	top:60px;
	width:100%;
	opacity:0;
	-webkit-transform:translate3d(0,50px,0);
	transform:translate3d(0,50px,0);
}



.page_top{
    position: fixed;
    right: 20px;
    bottom: 92px;
    visibility: hidden;
    opacity: 0;
    width: 92px;
    height: 123px;
	cursor: pointer;
}
.page_top_text{
    position: absolute;
    bottom: 0px;
    right: -10px;
}


.prono_warp{
	position:relative;
	width:100%;
}

.prono_warp h2 {
    position: absolute;
    left: 50%;
    top: 5%;
    margin-left: -218px;
    margin-top: 0%;
    width: 100%;
}

#prono_img{
	position:absolute;
	left:50%;
	top: 130px;
	margin-left:-340px;
}

.prono1_title{
	position:absolute;
	left:50%;
	top: 385px;
	margin-left:-340px;
}

.prono_page{
	position:relative;
	display:none;
	opacity:0;
}
.text_cast{
	position:relative;
	visibility:hidden;
	opacity:0;
}
.staff_bg{
	width:1280px;
	margin:0 auto;
}
.sound_controll{
	position:fixed;
	top:66px;
	right:2px;
	cursor:pointer;
	width:44px;
	height:36px;
	z-index:900;
}
.sound_off{
	display:none;
}