/* 둘러보기 */
#section-tour {

    /*////////////////////////////////////////////////// 
    // 스와이퍼 섹션 
    //////////////////////////////////////////////////*/
    & .tour-swiper-container {
        margin-bottom: var(--content-vertical-gap-big);

        @media screen and (max-width: 800px) {
            margin-bottom: var(--mobile-content-vertical-gap-sm);
        }

        & .tour-swiper-inner {
            max-width: 1080px;
            margin: 0 auto;

            & .tourSwiper {
                --pagination-color: #d8cac0;
                --pagination-active-color: #e67531;

                overflow: visible;
    
                /* 슬라이드 */
                & .swiper-wrapper {
    
                    & .swiper-slide {
    
                        &:where(.swiper-slide-prev, .swiper-slide-next) {opacity: 0.6;}
    
                        & img {
                            width: 100%;
                            aspect-ratio: 1/0.563;
                        }
                    }
                }

                /* next, prev 버튼 */
                & :where(.tour-btn-next, .tour-btn-prev) {
                    --btn-w: 31px;
                    --btn-h: 53px;

                    width: var(--btn-w);
                    height: var(--btn-h);

                    &::after {font-size: 0;}

                    &.tour-btn-prev {background: url('/img/sub/about/tour/icon-arrow-prev-w.webp') no-repeat center/contain;}
                    &.tour-btn-next {background: url('/img/sub/about/tour/icon-arrow-next-w.webp') no-repeat center/contain;}
                }

                /* 페이지네이션 */
                & .tour-swiper-pagination {
                    bottom: 20px;

                    & .swiper-pagination-bullet {
                        --swiper-pagination-bullet-w: 11px;

                        opacity: 1;
                        width: var(--swiper-pagination-bullet-w);
                        height: var(--swiper-pagination-bullet-w);
                        background-color: var(--pagination-color);

                        &.swiper-pagination-bullet-active {background-color: var(--pagination-active-color);}
                    }
                }
            }
        }
    }
}