@charset "utf-8";

#inc01{--x:0%;position:relative;padding:150px 0 95px}
#inc01::before{position:absolute;content:'';top:320px;left:0;width:var(--x);height:1px;background-color:#e1e1e1;transform: translateZ(0);will-change: transform;}
#inc01::after{position:absolute;content:'';bottom:0;left:0;width:100%;height:1px;background-color:#e1e1e1;transform:translateZ(0);will-change:transform}
#inc01 .group-tit{padding-bottom:50px}
#inc01 .swiper-container{--swiper-height:650px;width:100%;height:var(--swiper-height);margin-bottom:40px}
#inc01 .swiper-wrapper{align-items:flex-end}
#inc01 .swiper-slide{display:flex;align-items:flex-end;justify-content:center;width:100%;height:var(--swiper-height)}
#inc01 .swiper-slide a{width:68%;aspect-ratio:385 / 490;transition:all 0.4s}
/* #inc01 .swiper-slide a{width:68%;height:390px;transition:all 0.4s} */
#inc01 .swiper-slide-active a{width:100% !important;height: var(--swiper-height);}
#inc01 .swiper-slide a .thumb-box{width:100%;height:100%}
#inc01 .swiper-slide a .thumb-box img{width:100%;height:100%;object-fit:cover}
#inc01 .swiper-slide-active{height:var(--swiper-height)}

#inc01 .swiper-navigation{display:flex;justify-content:center;align-items:center;gap:25px;padding-bottom:50px}
#inc01 .swiper-navigation button{all:unset;display:flex;align-items:center;gap:20px;font-family:var(--main-font);font-size:16px;color:#111;cursor:pointer;transition:color 0.2s}
#inc01 .swiper-navigation button img{width:33px;transition:transform 0.2s}
#inc01 .swiper-navigation .dot{display:inline-block;width:4px;aspect-ratio:1;border-radius:50px;background-color:#aaa}
#inc01 .swiper-navigation button.btn--prev img{transform:scaleX(-1)}
#inc01 .group-cont p.desc{font-family:var(--main-font);font-size:16px;line-height:1.75;text-align:center;white-space:pre-line;color:#111}

#inc01 #cursor{z-index:99;position:fixed;display:flex;align-items:center;justify-content:center;top:0;left:0;width:70px;height:70px;border-radius:100px;font-family:var(--main-font);font-size:16px;color:#fff;background-color:#4b1314;pointer-events:none}
#inc01 .swiper-slide a:hover{cursor:none}

@media (hover:hover){
#inc01 .swiper-navigation button.btn:hover{color:#4b1314}
#inc01 .swiper-navigation button.btn--prev:hover img{transform:translateX(-6px) scaleX(-1)}
#inc01 .swiper-navigation button.btn--next:hover img{transform:translateX(6px)}
}

/* 반응형 [s] */
@media (max-width:1700px){
    #inc01{padding: 110px 0 95px;}
    #inc01 .swiper-container{--swiper-height:620px}
    #inc01 .swiper-navigation{padding-bottom: 40px;}
}
@media (max-width:1600px){
    #inc01 .swiper-container{--swiper-height:576px}
    #inc01 .swiper-navigation{padding-bottom: 30px;}
}
@media (max-width:1500px){
    #inc01 .swiper-container{--swiper-height:540px}
}
@media (max-width:1400px){
    #inc01{padding: 80px 0;}
    #inc01::before{top: 250px;}
    /* #inc01 .swiper-container{--swiper-height:510px} */
    #inc01 .group-tit{padding-bottom: 44px;}
    #inc01 .swiper-slide a{width: 70%;}
}
@media (max-width:1200px){
    #inc01 .group-tit{padding-bottom: 30px;}
    #inc01 .swiper-container{--swiper-height:600px}
        /* #inc01 .swiper-slide a{width: 65%;} */

}
@media (max-width:1024px){
    #inc01::before{top: 210px;}
    #inc01 .swiper-container{margin-bottom: 30px;}
    #inc01 .swiper-navigation{padding-bottom: 24px;}
    /* #inc01 .swiper-slide a{width: 70%;} */
    /* #inc01 .swiper-container{--swiper-height:500px} */
}
@media (max-width:768px){
    #inc01{padding: 60px 0;}
    #inc01::before{top: 170px;}
    #inc01 .swiper-container{--swiper-height:560px}
        #inc01 .swiper-slide a{width: 75%;}
        #inc01 .swiper-navigation{gap: 20px;padding-bottom: 18px;}
        #inc01 .swiper-navigation button{gap: 16px;font-size: 15px;}
        #inc01 .group-cont p.desc{font-size: 15px;}
}
@media (max-width:650px){
#inc01 .swiper-container{--swiper-height:520px}
#inc01 .swiper-slide a{width: 80%;}
#inc01 #cursor{width: 60px;height: 60px;font-size: 14px;}
}
@media (max-width:520px){
    #inc01{padding: 60px 20px;}
    #inc01::before{display: none;}
    #inc01 .swiper-container{--swiper-height:100%;}
#inc01 .swiper-slide a{width: 100%;}

}
@media (max-width:480px){
    #inc01{padding: 45px 20px;}
    #inc01 .group-tit{padding-bottom: 24px;}
    #inc01 .swiper-container{margin-bottom: 24px;}
    #inc01 .group-cont p.desc{font-size: 14px;}
    #inc01 .swiper-navigation{gap: 16px;padding-bottom: 14px;}
    #inc01 .swiper-navigation button{gap: 14px;font-size: 14px;}

}
/* 반응형 [e] */