/**
 * Swiper 8 (custom build — 사용하는 기능만)
 * Base / Fade / Pagination / Zoom
 */

/* Base */
.swiper { margin: 0 auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; }
.swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; box-sizing: content-box; }
.swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform; }
.swiper-slide-invisible-blank { visibility: hidden; }

/* Fade */
.swiper-fade .swiper-slide { pointer-events: none; transition-property: opacity; }
.swiper-fade .swiper-slide-active { pointer-events: auto; }

/* Zoom */
.swiper-zoom-container { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; text-align: center; }
.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas { max-width: 100%; max-height: 100%; object-fit: contain; }
.swiper-slide-zoomed { cursor: move; }

/* Pagination */
.swiper-pagination { position: absolute; text-align: center; transition: 300ms opacity; transform: translate3d(0, 0, 0); z-index: 10; }
.swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer; }
.swiper-pagination-lock { display: none; }


/* ************************************************ */
/* 커스텀 — 화살표 */
.arrow_controller { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 4rem; display: flex; justify-content: space-between; z-index: 10; pointer-events: none; }
.arrow_controller * { cursor: pointer; z-index: 10; pointer-events: all; }
.s1Swiper .arrow_controller * { font-weight: 200 !important; color: #fff; text-shadow: 0px 0px 7px rgba(0,0,0,0.4); }


/* ************************************************ */
/* 커스텀 — bullet 공통 */
.swiper-pagination { display: flex; gap: .5rem; }
.swiper-pagination-bullet { width: 1.2rem; height: 1.2rem; transition: all .3s ease-in-out; }
.swiper-pagination-bullet-active { opacity: 1; transition: all .3s ease-in-out; }

.index_main .swiper-pagination-bullet { border-radius: 50%; transition: all .3s ease-in-out; border: 1px solid var(--main1); }
.index_main .swiper-pagination-bullet-active { background: var(--main1); width: 3rem; border-radius: 1rem; }

#section1 .pagination1 { top: 2rem; right: 2rem; position: absolute; }


/* ************************************************ */
/* Pagination — Progressbar */
.swiper-pagination-progressbar { background: rgba(0,0,0,.25); position: absolute; }
.swiper-horizontal > .swiper-pagination-progressbar { width: 100%; height: 4px; left: 0; top: 0; }
.swiper-vertical > .swiper-pagination-progressbar { width: 4px; height: 100%; left: 0; top: 0; }
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--main1); position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(0); transform-origin: left top; }