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

#mv { position: relative; }
/*#mv .swiper-slide-hyblid { position: relative; }*/
#mv .mainCopy { position: absolute; top: 35%; left: 50%; transform: translate(-50%); -webkit-transform: translate(-50%); -ms-transform: translate(-50%); z-index: 100; background: #08252c; padding: 2% 4%; }
#mv .mainCopy h2 { text-align: center; color: #fff; }
#mv .mainCopy h3 { text-align: center; color: #fff; font-family:'Roboto Condensed', sans-serif; font-weight:bold; font-size: 1.2rem; opacity: 0.1; margin-bottom: 10px; }
#mv .mainCopy .border-solid { border-bottom: 1px solid #fff; margin-bottom: 10px; }
#mv .mainCopy p { text-align: center; color: #fff; margin-bottom: 0px; font-size: 0.9rem; }
@media screen and (max-width: 599px) {
	#mv { max-height: 400px; height: 400px; margin-bottom: 40px; }
	#mv .hlL,#mv .hlR,.swiper-hyblid-L,.swiper-hyblid-R,.swiper-wrapper-hyblid-L,.swiper-wrapper-hyblid-R,.swiper-slide-hyblid-L,.swiper-slide-hyblid-R {
		max-height: 200px; height: 200px;
	}
	#mv .hlL { overflow: hidden; position: relative; }
	#mv .hlR { overflow: hidden; position: relative; }
	
	#mv li img { width: 100%; height: 200px; object-fit: cover; }

	#mv .hlL .slide-img ,#mv .hlR .slide-img { display: none; }
	#mv .hlL .swiper-slide-active .slide-img ,#mv .hlR .swiper-slide-active .slide-img { display: block; position: relative; z-index: 1;}
	
	#mv .hlL .copy,#mv .hlR .copy { display: none; }
	#mv .hlL .swiper-slide-active .copy { display: block; position: absolute; bottom: 2%; left: 4%; z-index: 10; color: #fff; /*text-shadow: 0px 0px 10px rgba(0, 0, 0, 1);*/}
	#mv .hlR .swiper-slide-active .copy { display: block; position: absolute; bottom: 2%; right: 4%; z-index: 10; color: #fff; /*text-shadow: 0px 0px 10px rgba(0, 0, 0, 1);*/}
	
	#mv .copy h2 { font-size: 1.2rem; line-height: 1.0; margin-bottom: 5px; line-height: 1.5; }
	#mv .copy h6 { font-size: 0.8rem; font-family:'Roboto Condensed', sans-serif; font-weight:bold; line-height: 1.0; margin-bottom: 5px; }
	#mv .copy p { font-size: 0.7rem; }
	#mv .hlR .copy h2,#mv .hlR .copy h6,#mv .hlR .copy p { text-align: right; }
	
	#mv .mainCopy { position: absolute; top: 40%; padding: 4% 6%; }
	#mv .mainCopy h2 { width: 80px; margin: 0 auto; }
	#mv .mainCopy h3 { font-size: 0.7rem; margin-bottom: 5px; }
	#mv .mainCopy p { font-size: 0.5em; }
}
@media screen and (min-width: 600px) and (max-width: 899px)  {
	#mv { max-height: 800px; height: 800px; margin-bottom: 40px; }
	#mv .hlL,#mv .hlR,.swiper-hyblid-L,.swiper-hyblid-R,.swiper-wrapper-hyblid-L,.swiper-wrapper-hyblid-R,.swiper-slide-hyblid-L,.swiper-slide-hyblid-R {
		max-height: 400px; height: 400px;
	}
	#mv .hlL { overflow: hidden; position: relative; }
	#mv .hlR { overflow: hidden; position: relative; }
	
	#mv li img { width: 100%; height: 400px; object-fit: cover; }

	#mv .hlL .slide-img ,#mv .hlR .slide-img { display: none; }
	#mv .hlL .swiper-slide-active .slide-img ,#mv .hlR .swiper-slide-active .slide-img { display: block; position: relative; z-index: 1;}
	
	#mv .hlL .copy,#mv .hlR .copy { display: none; }
	#mv .hlL .swiper-slide-active .copy { display: block; position: absolute; bottom: 2%; left: 4%; z-index: 10; color: #fff; /*text-shadow: 0px 0px 10px rgba(0, 0, 0, 1);*/}
	#mv .hlR .swiper-slide-active .copy { display: block; position: absolute; bottom: 2%; right: 4%; z-index: 10; color: #fff; /*text-shadow: 0px 0px 10px rgba(0, 0, 0, 1);*/}
	
	#mv .copy h2 { font-size: 1.6rem; }
	#mv .copy h6 { font-size: 1.2rem; }
	#mv .copy p { font-size: 0.7rem; }
	
	#mv .mainCopy { position: absolute; top: 40%; padding: 2% 4%; }
	#mv .mainCopy h2 { width: 100px; margin: 0 auto; }
	#mv .mainCopy h3 { font-size: 0.8rem; margin-bottom: 5px; }
	#mv .mainCopy p { font-size: 0.7rem; }
}
@media screen and (min-width: 900px) {
	#mv { display: flex; justify-content: center; }
	#mv .hlL { width: 50%; overflow: hidden; position: relative; }
	#mv .hlR { width: 50%; overflow: hidden; position: relative; }
	#mv li img { width: 100%; height: auto; }
	
	#mv .copy h2 { font-size: 2.0rem; line-height: 1.0; margin-bottom: 10px; }
	#mv .copy h6 { font-size: 1.6rem; font-family:'Roboto Condensed', sans-serif; font-weight:bold; line-height: 1.0; margin-bottom: 10px; }
	#mv .copy p { font-size: 0.9rem; }
	#mv .hlR .copy h2,#mv .hlR .copy h6,#mv .hlR .copy p { text-align: right; }
}
@media screen and (min-width: 900px) and (max-width: 1079px)  {
	#mv { max-height: 400px; height: 400px !important; }
	#mv .hlL,#mv .hlR,.swiper-hyblid-L,.swiper-hyblid-R,.swiper-wrapper-hyblid-L,.swiper-wrapper-hyblid-R,.swiper-slide-hyblid-L,.swiper-slide-hyblid-R {
		max-height: 400px; height: 400px !important;
	}
	#mv li img { width: 100%; height: auto; }
	
	#mv .hlL .copy { position: absolute; top: 50%; left: 4%; z-index: 10; color: #fff; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);}
	#mv .hlR .copy { position: absolute; top: 50%; right: 4%; z-index: 10; color: #fff; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);}
	
	#mv .copy h2 { font-size: 1.7rem; }
	#mv .copy h6 { font-size: 1.3rem; }
	#mv .copy p { font-size: 0.8rem; }
	
	#mv .mainCopy { position: absolute; top: 30%; padding: 2% 2%; }
	#mv .mainCopy h2 { width: 120px; margin: 0 auto; }
	#mv .mainCopy h3 { font-size: 0.9rem; margin-bottom: 5px; }
	#mv .mainCopy p { font-size: 0.8rem; }
}
@media screen and (min-width: 1080px) and (max-width: 1199px)  {
	#mv { max-height: 400px; height: 400px !important; }
	#mv .hlL,#mv .hlR,.swiper-hyblid-L,.swiper-hyblid-R,.swiper-wrapper-hyblid-L,.swiper-wrapper-hyblid-R,.swiper-slide-hyblid-L,.swiper-slide-hyblid-R {
		max-height: 400px; height: 400px !important;
	}
	#mv li img { width: 100%; height: auto; }
	
	#mv .copy h2 { font-size: 1.8rem; }
	#mv .copy h6 { font-size: 1.4rem; }
	#mv .copy p { font-size: 0.8rem; }
	#mv .hlL .copy { position: absolute; top: 50%; left: 4%; z-index: 10; color: #fff; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);}
	#mv .hlR .copy { position: absolute; top: 50%; right: 4%; z-index: 10; color: #fff; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);}
	
	#mv .mainCopy { position: absolute; top: 30%; padding: 2% 2%; }
	#mv .mainCopy h2 { width: 200px; margin: 0 auto; }
	#mv .mainCopy h3 { font-size: 1.0rem; margin-bottom: 5px; }
	#mv .mainCopy p { font-size: 0.9rem; }
}
@media screen and (min-width: 1200px) and (max-width: 1479px)  {
	#mv .copy h2 { font-size: 1.9rem; }
	#mv .copy h6 { font-size: 1.5rem; }
	#mv .copy p { font-size: 0.9rem; }
	#mv .hlL .copy { position: absolute; bottom: 2%; left: 4%; z-index: 10; color: #fff; /*text-shadow: 0px 0px 10px rgba(0, 0, 0, 1);*/}
	#mv .hlR .copy { position: absolute; bottom: 2%; right: 4%; z-index: 10; color: #fff; /*text-shadow: 0px 0px 10px rgba(0, 0, 0, 1);*/}
	
	#mv .mainCopy { position: absolute; top: 30%; padding: 2% 2%; }
	#mv .mainCopy h2 { width: 200px; margin: 0 auto; }
	#mv .mainCopy h3 { font-size: 1.0rem; margin-bottom: 5px; }
	#mv .mainCopy p { font-size: 0.9rem; }
}
@media screen and (min-width: 1480px) {
	#mv .hlL .copy { position: absolute; bottom: 2%; left: 4%; z-index: 10; color: #fff; /*text-shadow: 0px 0px 10px rgba(0, 0, 0, 1);*/}
	#mv .hlR .copy { position: absolute; bottom: 2%; right: 4%; z-index: 10; color: #fff; /*text-shadow: 0px 0px 10px rgba(0, 0, 0, 1);*/}
}


.swiper-slide-active .slide-img,
.swiper-slide-duplicate-active .slide-img,
.swiper-slide-prev .slide-img{
  animation: zoomUp 10s linear 0s 1 normal both;  
}
.slide-img img{
  display: block;
}
@keyframes zoomUp {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.15);
  }
}