@charset "utf-8";

/********************************************************

// * 본 스킨은 Ninny Design에서 제작되었습니다.
// * 이 파일은 저작권법의 보호를 받습니다.
// * 무단 복제, 배포, 수정, 재판매를 금지합니다.
// * 위반 시 민·형사상 법적 책임을 질 수 있습니다.

// * Developed by Ninny Design.
// * This file is protected by copyright law.
// * Unauthorized copying, distribution, modification, or resale is strictly prohibited.
// * Violators may be subject to civil and criminal penalties.

// * © 2026 Ninny Design. All rights reserved.

********************************************************/

/********************************************************
■ Section swiper card text
********************************************************/
#sec-sw-card-text { }

#sec-sw-card-text .swiper-wrap { position: relative; }
#sec-sw-card-text .swiper-wrap:before { content:""; position:absolute; left:var(--default-padding); top:0; bottom:0; background:var(--bg-color); width:calc(33.33% + var(--swiper-gap)); margin-left:calc(-1 * var(--swiper-gap)); --swiper-gap:40px; z-index:2; }

#sec-sw-card-text .swiper-img { overflow:visible; }
#sec-sw-card-text .image { padding-bottom:133.33%; border-radius: 20px; overflow:hidden; }

#sec-sw-card-text .swiper-txt { position: absolute; left:0; top:0; width:33%; padding:clamp(20px, 5.5vw, 50px) var(--default-padding) 0; z-index:9; }

#sec-sw-card-text .swiper-txt .swiper-slide { background:var(--bg-color); }
#sec-sw-card-text .swiper-txt .swiper-slide > div { overflow:hidden; }
#sec-sw-card-text .swiper-txt .swiper-slide span { display:block; transform: translateY(100%); transition-duration: .5s; }
#sec-sw-card-text .swiper-txt .swiper-slide-active span { transform: translateY(0); }

#sec-sw-card-text .swiper-txt .title { color:var(--main-color1); font-size:clamp(20px, 4vw, 48px); line-height:1.2; font-weight:600; }
#sec-sw-card-text .swiper-txt .desc { color:#727272; font-size:clamp(14px, 2vw, 24px); margin-top:clamp(5px, 1.4vw, 20px); line-height:1.4; }

#sec-sw-card-text .swiper-txt .swiper-ctrl { margin-top:clamp(10px, 2.3vw, 30px); display:flex; }
#sec-sw-card-text .swiper-txt .swiper-nav.circle { --circle-size:clamp(30px, 4vw, 50px); font-size:clamp(1rem, 2vw, 1.375rem); margin-right:10px; }



@media (max-width: 1024px) {
    #sec-sw-card-text .swiper-wrap:before { display:none; }

    #sec-sw-card-text .swiper-txt { position:relative; width:100%; text-align: center; --default-padding:0; }
    #sec-sw-card-text .swiper-txt br { display:none; }

    #sec-sw-card-text .swiper-txt .swiper-ctrl { justify-content: center; }
    #sec-sw-card-text .swiper-txt .swiper-nav.circle { margin:0 5px; }
}