@charset "utf-8";

#mainVisualWrap{padding:0 5%;margin-top:100px}
#mainVisual{overflow:hidden;position:relative;height:775px}

/* mainVisual */
#mainVisual .mainSwiper{height:775px}
#mainVisual .main_img:after{position:absolute;left:0;bottom:244px;width:50%;height:1px;content:'';background-color:rgba(255,255,255,.3)}
#mainVisual .main_img li{width:100%;height:100%;background:center no-repeat;background-size:cover;border-radius:30px}
#mainVisual .main_img li.img01{background-image:url(/sh_img/index/main_banner/img01.jpg)}
#mainVisual .main_img li.img02{background-image:url(/sh_img/index/main_banner/img02.jpg)}
#mainVisual .main_img li.img03{background-image:url(/sh_img/index/main_banner/img03.jpg)}

#mainVisual .txt{position:absolute;left:50%;transform:translateX(-50%);max-width:1140px;width:100%;height:100%;color:#fff;margin:0 auto;z-index:99}
#mainVisual .txt .txt1{opacity:0;position:absolute;left:0;top:308px;margin-top:30px;font-size:50px;line-height:1.3;color:#fff;letter-spacing:-.3px;word-break:keep-all;font-family:'LotteMartDreamLight'}
#mainVisual .txt .txt1 span{font-family:'LotteMartDreamBold'}
#mainVisual .txt .txt2{opacity:0;position:absolute;left:0;bottom:150px;line-height:24px;font-size:16px;word-break:keep-all;font-family:'notokr-regular'}

#mainVisual .swiper-pager{position:absolute;left:0;bottom:224px;z-index:1002;margin-top:-55px}
#mainVisual .swiper-pager span{display:inline-block;position:relative;width:50px;height:38px;margin:20px 0;border-radius:0;opacity:.5;background:none;transition:all .5s}
#mainVisual .swiper-pager span:after{letter-spacing:-.2px;color:#fff;font-size:15px;font-weight:600;font-family:'LotteMartDreamBold'}
#mainVisual .swiper-pager span:nth-child(1):after{content:'01'}
#mainVisual .swiper-pager span:nth-child(2):after{content:'02'}
#mainVisual .swiper-pager span:nth-child(3):after{content:'03'}
#mainVisual .swiper-pager span.on{width:180px;border-bottom:solid 1px var(--primary);opacity:1}

#mainVisual .inq_btn{display:block;position:absolute;right:0;bottom:0;z-index:1001;width:268px;height:90px;z-index:100;border-radius:20px 0 20px;font-size:15px;color:#fff;text-align:center;line-height:90px;background:linear-gradient( to right, var(--second) 2%, var(--primary) 80% );font-family:'LotteMartDreamBold'}

@media(hover:hover){
#mainVisual .inq_btn:hover{background:linear-gradient( to right, var(--second) 10%, var(--primary) 90%)}
}
@media(max-width:1320px){
#mainVisualWrap{padding:0 20px}
#mainVisual{height:700px}
#mainVisual .mainSwiper{height:700px}
#mainVisual .txt .txt1{top:240px;left:30px}
#mainVisual .txt .txt2{left:30px}
#mainVisual .swiper-pager{left:30px}
}
@media(max-width:1100px){
#mainVisualWrap{margin-top:83px}
}
@media(max-width:1024px){
#mainVisualWrap{margin-top:0}
#mainVisual{height:600px}
#mainVisual .mainSwiper{height:600px}
#mainVisual .txt .txt1{top:170px;font-size:42px}
}
@media(max-width:768px){
#mainVisual{height:500px}
#mainVisual .mainSwiper{height:500px}
#mainVisual .txt .txt1{top:auto;bottom:240px;font-size:32px}
#mainVisual .txt .txt2{bottom:100px;font-size:15px}
#mainVisual .main_img:after{bottom:180px}
#mainVisual .swiper-pager{bottom:160px}
#mainVisual .swiper-pager span{width:35px;height:30px}
#mainVisual .swiper-pager span:after{font-size:13px}
#mainVisual .swiper-pager span.on{width:120px}
#mainVisual .inq_btn{width:200px;height:70px;line-height:70px}
}
@media(max-width:665px){
#mainVisual .txt .txt1{font-size:29px}
#mainVisual .txt .txt2{bottom:80px;padding-right:100px}
#mainVisual .txt .txt2 br{display:none}
}
@media(max-width:495px){
#mainVisual{height:450px}
#mainVisual .mainSwiper{height:450px}
#mainVisualWrap{padding:0}	
#mainVisual .main_img li{border-radius:0}
#mainVisual .txt .txt1{left:20px;bottom:261px;width:80%;font-size:26px}
#mainVisual .txt .txt2{width:80%;left:20px;bottom:118px;padding-right:0;font-size:14px}
#mainVisual .txt .txt2 br{display:none}
#mainVisual .main_img:after{bottom:211px;width:100%}
#mainVisual .swiper-pager{left:20px;bottom:191px}
#mainVisual .inq_btn{height:60px;border-radius:20px 0 0;line-height:60px}

}
@media(max-width:390px){
#mainVisual .txt .txt1 br{display:none}
#mainVisual .txt .txt2{bottom:88px}
    
}