@charset "utf-8";

.popup { display: none; position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); z-index: 9999; justify-content: center; align-items: center; }

.popup.show { display: flex; }

.popup-content { position: relative; width: 93.75rem; height: 46.875rem; border-radius: 0.625rem; overflow: hidden; }

.popup-close { position: absolute; bottom: 0rem; right: 50%; transform: translateX(50%); width: 4.0625rem; height: 4.0625rem; cursor: pointer; z-index: 99; }

.popup-close img { width: 100%; height: 100%; }

.popup-swiper { width: 100%; height: 100%; position: relative; }

.popup-swiper .swiper-slide { display: flex; justify-content: center; align-items: center; font-size: 1.125rem; transition: transform 0.3s; }

.popup-swiper .swiper-slide img { width: 100%; height: 100%; object-fit: cover; cursor: pointer; }

.popup-swiper .swiper-slide { transform: scale(0.5); opacity: 0.6; }

.popup-swiper .swiper-slide-active { transform: scale(1.6); opacity: 1; z-index: 10; }

.popup-swiper .swiper-slide-next, .popup-swiper .swiper-slide-prev { transform: scale(0.9); opacity: 0.8; }

.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 6.25rem; }

.popup-swiper .swiper-pagination-bullet { width: 0.75rem !important; height: 0.25rem !important; background: rgb(110, 110, 110) !important; opacity: 1 !important; border-radius: 0.125rem !important; }

.popup-swiper .swiper-pagination-bullet-active { opacity: 1; width: 1.625rem !important; background: rgb(255, 255, 255) !important; }

.container .swiper-button-next, .container .swiper-button-prev { width: 4.0625rem; height: 4.0625rem; margin: 0px; background-size: 100% 100%; z-index: 1; position: absolute; top: 50%; transform: translateY(-50%); }

.container .swiper-button-prev.swiper-button-black { background-image: url("https://assets.costway.com/media/wysiwyg/FDS-product/Home/labor-day/lbl.png"); left: 15.625rem; }

.container .swiper-button-next.swiper-button-black { background-image: url("https://assets.costway.com/media/wysiwyg/FDS-product/Home/labor-day/lbr.png"); right: 15.625rem; }

.container .swiper-button-next.swiper-button-disabled, .container .swiper-button-prev.swiper-button-disabled { opacity: 1; }

.container .swiper-button-prev.swiper-button-disabled { background-image: url("https://assets.costway.com/media/wysiwyg/FDS-product/Home/specials_folder/2023activity/saleEvent/left_unable.png"); }

.container .swiper-button-next.swiper-button-disabled { background-image: url("https://assets.costway.com/media/wysiwyg/FDS-product/Home/specials_folder/2023activity/saleEvent/right_unable.png"); }

.container .swiper-button-next::after, .swiper-rtl .swiper-button-prev::after { content: none; }

.container .swiper-button-prev::after, .swiper-rtl .swiper-button-next::after { content: none; }

@media (max-width: 767px) {
  .popup-content { width: 90%; height: 45%; }
  .popup-close { width: 35px; height: 35px; bottom: 0px; }
  .swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 50px; }
  .popup-swiper .swiper-slide-active { transform: scale(1); }
  .container .swiper-button-prev.swiper-button-black { display: none; }
  .container .swiper-button-next.swiper-button-black { display: none; }
  .popup-swiper .swiper-pagination-bullet { width: 8px !important; height: 2px !important; background: rgb(51, 51, 51) !important; opacity: 1 !important; border-radius: 1px !important; }
  .popup-swiper .swiper-pagination-bullet-active { opacity: 1; width: 14px !important; background: rgb(255, 255, 255) !important; }
}