/* CSS Document */
/*****************************************
							S w i p e r
*****************************************/
.swiper-container {
	max-width: 1120px!important;
}
.swiper-slide img { width: 100%; height: auto; }

.swiper-slide { height: auto; }

.swiper-button-prev, .swiper-button-next { display: none; }
@media (min-width: 768px) { .swiper-button-prev, .swiper-button-next { display: block; } }

.swiper-button-prev, .swiper-button-next { background-image: none; width: 40px; height: 40px; background-size: 40px 40px; margin-top: -24px; }

.swiper-button-prev::after, .swiper-button-next::after { content: ""; }

.swiper-button-prev { background-image: url("../images/sld/prev.svg"); left: 7.5px; }

.swiper-button-next { background-image: url("../images/sld/next.svg"); right: 7.5px; }

.swiper-container .swiper-wrapper .swiper-slide img { opacity: 0; }
.swiper-container.swiper-container-initialized .swiper-wrapper .swiper-slide img { animation: fadeIn 1s ease 0.1s forwards; }
.swiper-container .swiper-pagination-bullet { background: #777777; opacity: 0.5; }
.swiper-container .swiper-pagination-bullet-active { background: #de1618; opacity: 0.5; }
@media (min-width: 768px) { .swiper-container .swiper-pagination-bullet { width: 22px; height: 22px; }
  .swiper-container .swiper-pagination-bullet-active { width: 22px; height: 22px; } }

.has-pagination .swiper-container { padding-bottom: 15px !important; }
@media (min-width: 768px) { .has-pagination .swiper-container { padding-bottom: 55px !important; } }

.official-youtube .swiper-container .swiper-pagination-bullet-active { background: #FFFFFF; }

.notice .swiper-container .swiper-slide { display: flex; justify-content: center; align-items: center; position: relative; }
.notice .swiper-container .swiper-slide:after { width: 2px; height: 50%; background-color: #777777; position: absolute; top: 50%; right: -2px; transform: translateY(-50%); content: ""; display: block; border-radius: 1px; }

.swiper-navigation { border-top: solid 1px #202020; border-bottom: solid 1px #202020; margin-bottom: 15px; padding: 7.5px; }
.swiper-navigation .swiper-slide { width: auto; font-size: 1.8rem; padding: 3.75px 7.5px; display: flex; align-items: center; justify-content: center; position: relative; transition: .4s; border-radius: 5px; }
.swiper-navigation .swiper-slide:hover { cursor: pointer; }
@media (min-width: 768px) { .swiper-navigation .swiper-slide { font-size: 1.6rem; } }
.swiper-navigation .swiper-scrollbar { bottom: 0; left: 7.5px; width: calc(100% - 15px); background-color: transparent; }
.swiper-navigation .swiper-scrollbar-drag { background-color: #EEEEEE; }
@media (min-width: 1200px) { .swiper-navigation .swiper-wrapper { justify-content: center; } }

.nav-outside { position: relative; }
.nav-outside .swiper-button-prev, .nav-outside .swiper-container-rtl .swiper-button-next { left: -50px; }
.nav-outside .swiper-button-next, .nav-outside .swiper-container-rtl .swiper-button-prev { right: -50px; }

@media (min-width: 768px) { .is-cutoff .swiper-container { overflow: visible; } }

.product-images-slider .swiper-slide { width: 100%; /*aspect-ratio: 1 / 1;*/ background-color: #EEEEEE; position: relative; }
.product-images-slider .swiper-slide::before { content: ""; display: block; padding-top: 100%; }
.product-images-slider .swiper-slide img { width: 100%; height: 100%; object-fit: contain; position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
@media (min-width: 992px) { .product-images-slider .swiper-slide.swiper-slide-active { position: relative; }
  .product-images-slider .swiper-slide.swiper-slide-active::after { position: absolute; bottom: 7.5px; right: 7.5px; display: block; width: 60px; height: 60px; content: ""; background: url("../images/icon/zoom-in.svg") center/contain no-repeat; z-index: +1; } }
.product-images-slider .swiper-button-prev, .product-images-slider .swiper-button-next { display: block !important; }

.product-images-slider-thumb .swiper-slide { width: 100%; /*aspect-ratio: 1 / 1;*/ background-color: #EEEEEE; margin-bottom: 2px; cursor: pointer; position: relative; }
.product-images-slider-thumb .swiper-slide::before { content: ""; display: block; padding-top: 100%; }
.product-images-slider-thumb .swiper-slide img { width: 100%; height: 100%; object-fit: contain; position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
