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

.main_movie1{width: 100%;
	height: 100%;
	position: relative;}

.movie_logo_box{width: 50%;
	position: absolute; top: 5%; left: 25%;}

.movie_logo1{width: 100%;}
	
.movie_text1{width: 65%;
	margin: 0 auto;}

.movie_img_box{width: 90%;
	aspect-ratio:21/9;
	position: absolute; top: 45%; left: 5%;
	display: flex;
	flex-direction: row; /* 左から */
	flex-wrap: wrap; /* 複数行に配置、左から右へ、上から下へ、の順番に。 */
	align-items: center; /*アイテムを中央にまとめて配置。*/
	justify-content: center; /* 中央寄せ */}

.movie_img1,.movie_img2,.movie_img3,.movie_img4,.movie_img5,.movie_img6,.movie_img7,.movie_img8{width: 18%;
	padding: 0 3.5%;
	opacity: 0;}
	
.movie_img1 img,.movie_img2 img,.movie_img3 img,.movie_img4 img,.movie_img5 img,.movie_img6 img,.movie_img7 img,.movie_img8 img{width: 100%;}

.movie_img1{-webkit-animation:m_blink 5s linear infinite;
	-moz-animation:m_blink 5s linear infinite;
	-o-animation:m_blink 5s linear infinite;
	animation:m_blink 10s ease-out infinite;}
	
.movie_img2{-webkit-animation:m_blink 5s linear infinite;
	-moz-animation:m_blink 5s linear infinite;
	-o-animation:m_blink 5s linear infinite;
	animation:m_blink 10s ease-out infinite;
	animation-delay:0.1s;}
	
.movie_img3{-webkit-animation:m_blink 5s linear infinite;
	-moz-animation:m_blink 5s linear infinite;
	-o-animation:m_blink 5s linear infinite;
	animation:m_blink 10s ease-out infinite;
	animation-delay:0.2s;}
	
.movie_img4{-webkit-animation:m_blink 5s linear infinite;
	-moz-animation:m_blink 5s linear infinite;
	-o-animation:m_blink 5s linear infinite;
	animation:m_blink 10s ease-out infinite;
	animation-delay:0.3s;}
	
.movie_img5{-webkit-animation:m_blink 5s linear infinite;
	-moz-animation:m_blink 5s linear infinite;
	-o-animation:m_blink 5s linear infinite;
	animation:m_blink 10s ease-out infinite;
	animation-delay:5.0s;}
	
.movie_img6{-webkit-animation:m_blink 5s linear infinite;
	-moz-animation:m_blink 5s linear infinite;
	-o-animation:m_blink 5s linear infinite;
	animation:m_blink 10s ease-out infinite;
	animation-delay:5.1s;}
	
.movie_img7{-webkit-animation:m_blink 5s linear infinite;
	-moz-animation:m_blink 5s linear infinite;
	-o-animation:m_blink 5s linear infinite;
	animation:m_blink 10s ease-out infinite;
	animation-delay:5.2s;}
	
.movie_img8{-webkit-animation:m_blink 5s linear infinite;
	-moz-animation:m_blink 5s linear infinite;
	-o-animation:m_blink 5s linear infinite;
	animation:m_blink 10s ease-out infinite;
	animation-delay:5.3s;}

@-webkit-keyframes m_blink {
	0% {opacity:0;}
	40% {opacity:1.0;}
	60% {opacity:1.0;}
	100% {opacity:0;}
}
@-moz-keyframes m_blink {
	0% {opacity:0;}
	40% {opacity:1.0;}
	60% {opacity:1.0;}
	100% {opacity:0;}
}
@-o-keyframes m_blink {
	0% {opacity:0;}
	40% {opacity:1.0;}
	60% {opacity:1.0;}
	100% {opacity:0;}
}
@keyframes m_blink {
	0% {opacity:0;
		transform: translateY(15%);}
	5% {opacity:1.0;
		transform: translateY(0);}
	49% {opacity:1.0;}
	50% {opacity:0;}
	100% {opacity:0;}
}

.movie2{height: 100%;
	opacity: 0;
	-webkit-animation:m_blink2 36s linear infinite;
	-moz-animation:m_blink2 36s linear infinite;
	-o-animation:m_blink2 36s linear infinite;
	animation:m_blink2 36s ease-out infinite;}

.movie_img2_1{}
	
.movie_img2_3{animation-delay:4s;}
	
.movie_img2_4{padding: 0 4%;
	animation-delay:4.1s;}
	
.movie_img2_5{animation-delay:8s;}
	
.movie_img2_6{animation-delay:12s;}
	
.movie_img2_8{animation-delay:16s;}
	
.movie_img2_9{padding: 0 4%;
	animation-delay:20s;}
	
.movie_img2_11{padding: 0 4%;
	animation-delay:24s;}
	
.movie_img2_12{padding: 0 4%;
	animation-delay:24.1s;}
	
.movie_img2_14{padding: 0 4%;
	animation-delay:28s;}
	
.movie_img2_15{padding: 0 4%;
	animation-delay:28.1s;}

.movie_img2_16{animation-delay:32s;}

.movie_img2_1 img,.movie_img2_2 img,.movie_img2_3 img,.movie_img2_4 img,.movie_img2_5 img,.movie_img2_6 img,.movie_img2_7 img,.movie_img2_8 img,.movie_img2_9 img,.movie_img2_10 img,.movie_img2_11 img,.movie_img2_12 img,.movie_img2_13 img,.movie_img2_14 img,.movie_img2_15 img,.movie_img2_16 img{height: 70%;}

@-webkit-keyframes m_blink2 {
0% {opacity:0;
		transform: translateY(15%);}
	2% {opacity:1.0;
		transform: translateY(0);}
	10% {opacity:1.0;}
	11% {opacity:0;}
	100% {opacity:0;}
}
@-moz-keyframes m_blink2 {
	0% {opacity:0;
		transform: translateY(15%);}
	2% {opacity:1.0;
		transform: translateY(0);}
	10% {opacity:1.0;}
	11% {opacity:0;}
	100% {opacity:0;}
}
@-o-keyframes m_blink2 {
0% {opacity:0;
		transform: translateY(15%);}
	2% {opacity:1.0;
		transform: translateY(0);}
	10% {opacity:1.0;}
	11% {opacity:0;}
	100% {opacity:0;}
}
@keyframes m_blink2 {
	0% {opacity:0;
		transform: translateY(15%);}
	2% {opacity:1.0;
		transform: translateY(0);}
	10% {opacity:1.0;}
	11% {opacity:0;}
	100% {opacity:0;}
}

@-webkit-keyframes m_blink3 {
	0% {opacity:0;
		transform: translateY(15%);}
	2% {opacity:1.0;
		transform: translateY(0);}
	9.65% {opacity:1.0;}
	9.75% {opacity:0;}
	100% {opacity:0;}
}
@-moz-keyframes m_blink3 {
	0% {opacity:0;
		transform: translateY(15%);}
	2% {opacity:1.0;
		transform: translateY(0);}
	9.65% {opacity:1.0;}
	9.75% {opacity:0;}
	100% {opacity:0;}
}
@-o-keyframes m_blink3 {
	0% {opacity:0;
		transform: translateY(15%);}
	2% {opacity:1.0;
		transform: translateY(0);}
	9.65% {opacity:1.0;}
	9.75% {opacity:0;}
	100% {opacity:0;}
}
@keyframes m_blink3 {
	0% {opacity:0;
		transform: translateY(15%);}
	2% {opacity:1.0;
		transform: translateY(0);}
	9.65% {opacity:1.0;}
	9.75% {opacity:0;}
	100% {opacity:0;}
}

@media screen and ( max-width:821px )
{
.movie_logo_box{width: 75%;
	position: absolute; top: 5%; left: 12.5%;}
	
.movie_text1{width: 85%;
	margin: 0 auto;}

.movie_img_box,.movie_img_box2{width: 100%;
	aspect-ratio:18/7.5;
	position: absolute; top: 50%; left: 0;
	display: flex;
	flex-direction: row; /* 左から */
	flex-wrap: wrap; /* 複数行に配置、左から右へ、上から下へ、の順番に。 */
	align-items: center; /*アイテムを中央にまとめて配置。*/
	justify-content: center; /* 中央寄せ */}

.movie_img1,.movie_img2,.movie_img3,.movie_img4,.movie_img5,.movie_img6,.movie_img7,.movie_img8{width: 45%;
	padding: 0 2.5% 15px;
	opacity: 0;}

.movie_img2_1 img,.movie_img2_2 img,.movie_img2_3 img,.movie_img2_4 img,.movie_img2_5 img,.movie_img2_6 img,.movie_img2_7 img,.movie_img2_8 img,.movie_img2_9 img,.movie_img2_10 img,.movie_img2_11 img,.movie_img2_12 img,.movie_img2_13 img,.movie_img2_14 img,.movie_img2_15 img,.movie_img2_16 img{height: 100%;}

}