/* swiper_customized.css
   swiper-bundle.min.css overwrite*/
/* Swiper Pagination Fraction (1/n) (carousel) */
.swiper-pagination-fraction{
   display: flex;
   flex-direction: row;
   position: absolute;
   left: unset;
   top: 12px;
   right: 12px;
   padding: var(--layout-spacing-4) var(--layout-spacing-8);
   background: var(--color-primary-50);
   color: var(--color-primary-600);
   border-radius: var(--border-radius-full);
   width: fit-content;
   height: fit-content;
   line-height: var(--line-height-none-100);
   align-items: center;
   gap: 2px;
   z-index: 3;
}
.swiper-pagination-current, .swiper-pagination-total{
   font-size:   var(--font-size-14);
   font-weight: var(--font-weight-bold-700);
   line-height: var(--line-height-none-100);
}
.swiper-pagination-current{
   color: var(--color-primary-950);
}
.swiper-pagination-total{
   color: var(--color-primary-600);
}
@media (min-width: 417px) {
   .swiper-pagination-fraction{
      right: calc(8.68% + 12.69px);    /* slidesPerView: 1.21 */
   }
}
@media (min-width: 500px) {
   .swiper-pagination-fraction{
      right: calc(17.74% + 13.42px);   /* slidesPerView: 1.55 */
   }
}
@media (min-width: 640px) {
   .swiper-pagination-fraction{
      right: calc(23.26% + 13.86px);   /* slidesPerView: 1.87 */
   }
}
@media (min-width: 768px) {
   .swiper-pagination-fraction{
      right: calc(26.30% + 14.10px);   /* slidesPerView: 2.11 */
   }
}
@media (min-width: 860px) {
   .swiper-pagination-fraction{
      right: calc(29.25% + 14.34px);   /* slidesPerView: 2.41 */
   }
}
@media (min-width: 989px) {
   .swiper-pagination-fraction{
      right: calc(29.34% + 14.35px);   /* slidesPerView: 2.42 */
   }
}

/* Swiper Navigation Button*/
.swiper-button-prev-round::after,
.swiper-button-next-round::after {
   display: none;
}

.swiper-button-prev-round,
.swiper-button-next-round {
   display: none;
}
@media (min-width: 768px) {
   .swiper-button-prev-round,
   .swiper-button-next-round {
      display: flex;
      box-shadow: var(--box-shadow-lv3-strong);
      width: var(--layout-spacing-32);
      height: var(--layout-spacing-32);
   }
   .swiper-button-next-round{
      right: -8px;
   }
   .swiper-button-prev-round{
      left:-8px;
   }

   .swiper-button-prev-round.swiper-button-disabled,
   .swiper-button-next-round.swiper-button-disabled {
      display: none;
   }
}