@charset "UTF-8";
html{height: 98%;margin: 0%;padding: 0px;}
body{height: 98%;margin: 1%;}
h1{margin: 0px;padding: 0px;color: #fff;font-size: 5em;}
h2{margin: 0px;padding: 0px;color: #fff;font-size: 3em;}
img.key_visual{width: 50%;height: auto;}
@keyframes rotateY {
    0% {
        -webkit-transform:rotateY(0deg);
        transform:rotateY(0deg);
    }
    25% {
        -webkit-transform:rotateY(90deg);
        transform:rotateY(90deg);
    }
    50% {
        -webkit-transform:rotateY(180deg);
        transform:rotateY(180deg);
    }
    75% {
        -webkit-transform:rotateY(270deg);
        transform:rotateY(270deg);
    }
    100% {
        -webkit-transform:rotateY(360deg);
        transform:rotateY(360deg);
    }
}
div.sample {
    animation:rotateY 7s linear 0s infinite;
    margin: auto 0px;
}

#stage {
position: relative;
max-width:98vw;
height: 98vh;
margin: 0 auto;
background:#ddd;
}
.pic {
position: absolute;
}
.pic img {
width: 98vw;
height: 98vh;
opacity:0;
-moz-animation: imgTrans 40s infinite;
-webkit-animation: imgTrans 40s ease-in infinite;
animation: imgTrans 40s infinite;
}
#photo1 img {
-moz-animation-delay: 0s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
}
#photo2 img {
-moz-animation-delay: 8s;
-webkit-animation-delay: 8s;
animation-delay: 8s;
}
#photo3 img {
-moz-animation-delay: 16s;
-webkit-animation-delay: 16s;
animation-delay: 16s;
}
#photo4 img{
-moz-animation-delay: 24s;
-webkit-animation-delay: 24s;
animation-delay: 24s;
}
#photo5 img {
-moz-animation-delay: 32s;
-webkit-animation-delay: 32s;
animation-delay: 32s;
}
@-webkit-keyframes imgTrans {
0% { opacity:0; }
7% { opacity:1; }
18% { opacity:1; }
25% { opacity:0; }
100% { opacity:0; }
}
@-moz-keyframes imgTrans {
0% { opacity:0; }
7% { opacity:1; }
18% { opacity:1; }
25% { opacity:0; }
100% { opacity:0; }
}
@keyframes imgTrans {
0% { opacity:0; }
7% { opacity:1; }
18% { opacity:1; }
25% { opacity:0; }
100% { opacity:0; }
}
/******************************************
	レスポンシブ
******************************************/
@media screen and (max-width: 767px) {

}