/* CSS Document */
#bgBlock{
	width: 100%;
	height: 100%;
	position:fixed;
	top:0px;
	left: 0px;
	z-index: 0;
}

#bgBlock .cover{
	position: absolute;
	top:0px;
	left: 0px;
}

#bgBlock .ph01 img,
#bgBlock .ph02 img,
#bgBlock .ph03 img,
#bgBlock .ph04 img,
#bgBlock .ph05 img,
#bgBlock .ph06 img{
	opacity: 0;
}
#bgBlock .ph01 img{
	margin-left: -50px;
}
#bgBlock .ph02 img,
#bgBlock .ph03 img,
#bgBlock .ph04 img,
#bgBlock .ph05 img,
#bgBlock .ph06 img{
	opacity: 0;
	margin-left: 50px;
}

#bgBlock .ph01{
	position: absolute;
	top:0px;
	left: 0px;
}


#bgBlock .ph02{
	position: absolute;
	top:0px;
	left: 574px;
}

#bgBlock .ph03{
	position: absolute;
	top:412px;
	left: 611px;
}

#bgBlock .ph04{
	position: absolute;
	top:0px;
	left: 812px;
}

#bgBlock .ph05{
	position: absolute;
	top:0px;
	left: 1406px;
}

#bgBlock .ph06{
	position: absolute;
	top:422px;
	left: 1407px;
}

#story #container {	
	font-size: 16px;
	line-height: 220%;
	z-index: 2;
}
#story #container .inner .scrollBlock{
	position:absolute;
	width:100%;
	top:100%;
	left:0px;
}
#sceneFirst{
	width:100%;
	margin-top: 200px;
	display: block;
	opacity: 0;
}
#sceneFirst h1{
	padding:15px 0 20px 0;

}
#sceneFirst .scene1Bg{
	background:url(../img/scene1_bg_.png);
	padding:30px 30px 0px;
	width:960px;
	margin: 100px auto 0;
	color: #ccc;
}

.fw{
	color: #fff;
}

.it{
font-style: italic;
font-family: 'Noto Sans Japanese', serif;
}

#btnFist{
	/*background-image: url(../img/btn1_white.png);*/
	display: block;
	margin:0 auto;
	width:398px;
	height:89px;
}
#btnFist img:hover{
	opacity:0.7;
}
.btn img:hover{
	opacity:0.7;
}

#sceneFirst p{
	padding-left: 20px;

}

#sceneFirst .btnBox{
	text-align:center;
	padding:40px 0 0 0;
	margin-top:20px;
}
.jspContainer{}
.jspVerticalBar{width:10px;}
.jspTrack{background:#454545;}
.jspDrag{background:#fff;}

.sceneInner{
	width:960px;
	margin: auto;
	margin-top: 100px;
	color: #000;
	margin-bottom: 100px;
}


#scene1{
	padding-top: 10px;
}
#scene2{
	padding-top: 10px;
}
#scene3{
	padding-top: 10px;
}
#scene4{
	padding-top: 10px;
}

.sceneInner p{
	padding: 0 20px 20px;
	color:#535353;
}

#scene1 .sceneInner .animationBox{
	position:relative;
	width:875px;
	height:340px;
	margin:0 auto;
}
#scene1 .sceneInner .animationBox .img1{position:absolute;left:1px; bottom:2px;opacity:0;}
#scene1 .sceneInner .animationBox .img2{position:absolute;left:322px; bottom:2px;opacity:0;}
#scene1 .sceneInner .animationBox .img3{position:absolute;left:642px; bottom:2px;opacity:0;}
#scene1 .sceneInner .animationBox .fukidashi1{position:absolute;left:270px; bottom:80px;}
#scene1 .sceneInner .animationBox .fukidashi2{position:absolute;left:585px; bottom:80px;}
#scene1 .sceneInner .animationBox .arrow1{position:absolute;left:230px; top:235px;opacity:0;width:0px; overflow:hidden;}
#scene1 .sceneInner .animationBox .arrow2{position:absolute;left:550px; top:235px;opacity:0;width:0px; overflow:hidden;}




#scene2 .sceneInner .animationBox{
	position:relative;
	width:930px;
	height:320px;
	margin:0 auto;
	color: #999;
}
#scene2 .sceneInner .animationBox .img1{position:absolute;top:20px; left:0px;opacity:0;}
#scene2 .sceneInner .animationBox .img2{position:absolute;top:20px; right:0px;height:0px; overflow:hidden;}
#scene2 .sceneInner .animationBox .btn{position:absolute;bottom:0px; right:0px; width:396px;opacity:0;}

#scene3 .sceneInner .animationBox{
	position:relative;
	width:840px;
	height:340px;
	margin:0 auto;
	color: #999;
}

#scene3 .sceneInner .animationBox .img1{position:absolute;top:30px; left:0px;opacity:0;}
#scene3 .sceneInner .animationBox .img2{position:absolute;top:80px; left:267px;opacity:0;}
#scene3 .sceneInner .animationBox .img3{position:absolute;top:30px; right:0px;opacity:0;}
#scene3 .sceneInner .animationBox .btn{position:absolute;bottom:30px;left:50%;margin-left:-200px; width:400px;opacity:0;}

#scene4 .sceneInner .animationBox{
	position:relative;
	width:960px;
	height:340px;
	margin:0 auto;
	color: #000;
}
#scene4 .sceneInner .animationBox h3{
	text-align:center;
	padding:10px 0 40px 0;
}
#scene4 .sceneInner .animationBox h3 img{
	opacity:0;
}
#scene4 .sceneInner .animationBox p.txt2{
	opacity:0;
}
#scene4 .sceneInner .animationBox .btn{position:absolute;left:50%;margin-left:-200px; width:400px;opacity:0;margin-top: 20px}

#searchImg{
	margin:25px 0 20px 25px;
	position:absolute;
	opacity:0;
}
#sectionFirst{
	margin: 25px 0 20px 25px;
  position: relative;
}
#section1, #section3{
	background-color: rgba(255,255,255,0.94);
	height:794px;
}
#section2, #section4{
	background-color: rgba(233,233,233,0.94);
	height:794px;
}
#section4{
	padding-bottom:60px;
}
.ttl{
	margin-bottom:40px;
}
#story #contentDetail{
	padding-bottom:0;
}
#typeWrapper{
	margin-top:33px;
	margin-bottom:30px;
}
#type{
	position: relative;
  display: inline-block;
  z-index: 100;
  color: black;
  margin-left: 45px;

}
.typed-cursor{
    opacity: 1;
    color:black;
    -webkit-animation: blink 1.2s infinite;
    -moz-animation: blink 1.2s infinite;
    animation: blink 1.2s infinite;
}

#snsBtn {opacity: 0}


@keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-webkit-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-moz-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}