@charset "UTF-8";

#animation_container {
	position:absolute;
	margin:auto;
	left:-100%;right:-100%;
	top:-100%;bottom:-100%;
}

.mv-container{
	width:100%;
	position: relative;
	overflow: hidden;
}
.mv-inner{
	width: 100%;
	padding-bottom: calc(740 / 1380 * 100%);
	background-color: #000;
}
.mv-loading{
	position: absolute;
	top:0; left: 0;
	width:100%; height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.mv-loading.fadeOut{
	animation: mvLoadingFadeOutMotion 0.5s linear 0s forwards; 
}
.mv-loading ul{
	display:flex;
	justify-content: center;
	position: relative;
}
.mv-loading ul li{
	width:4px; height: 4px;
	margin: 0 2px;
	background-color: rgba(166,203,248,1.00);
	opacity: 0.2;
	animation: mvLoadingMotion 1s ease 0s infinite;
}
.mv-loading ul li:nth-child(1){ animation-delay: 0s; }
.mv-loading ul li:nth-child(2){ animation-delay: 0.1s; }
.mv-loading ul li:nth-child(3){ animation-delay: 0.2s; }
.mv-loading ul li:nth-child(4){ animation-delay: 0.3s; }
.mv-loading ul li:nth-child(5){ animation-delay: 0.4s; }
@keyframes mvLoadingMotion{
	  0% {opacity: 0.2;}
	 20% {opacity: 1;}
	 90% {opacity: 0.2;}
	100% {opacity: 0.2;}
}
@keyframes mvLoadingFadeOutMotion{
	  0% {opacity: 1;}
	100% {opacity: 0;}
}

@media screen and (max-width:768px){
	.mv-inner{
		padding-bottom: calc(740 / 690 * 100%);
	}
}



.main_copy { text-align: center; margin-top: 4rem; padding: 0 1.6rem; line-height: 1.28; }
.main_copy .sub_copy { font-size: 2.4rem; line-height: 1.36; letter-spacing: 0.2em; }
.main_copy .copy { font-size: 1.6rem; line-height: 1.28; margin-top: 0.8rem; margin-bottom: 0.6rem; letter-spacing: 0.2em; }
@media screen and (max-width: 800px) { .main_copy .copy { margin-bottom: 1rem; } }
@media screen and (max-width: 639px) { .main_copy .sub_copy { font-size: 1.8rem; }
  .main_copy .copy { font-size: 1.3rem; } }




