@charset "utf-8";

#mainVisual{position:relative;min-width:1400px;padding-top:100px;height:890px}

/* 메인배너 텍스트 */
#mainVisual .txt{position:relative;width:100%;padding-top:80px;text-align:center;color:#000;z-index:9999;transition:all .4s;transform:skew(-0.1deg);font-family:'NEXEN_TIRE_Bold'}
#mainVisual.on .txt{color:#fff;transition:all .4s .4s;}
#mainVisual .txt .txt1{display:inline-block;position:relative;margin-bottom:28px;font-size:15px}
#mainVisual .txt .txt1:before{position:absolute;right:-15px;top:-6px;content:'';width:8px;height:8px;border-radius:100px;background:var(--primary)}
#mainVisual .txt .txt2{font-size:55px;line-height:75px}
#mainVisual .txt .txt2 span{display:block;overflow:hidden;height:75px;padding-top:71px;transition:padding 1.2s}
#mainVisual .txt .txt2 b{font-weight:normal;color:var(--primary)}
#mainVisual .txt .txt2 .move3{height:auto;font-size:25px;line-height:1.5}
#mainVisual .txt .txt3{transition:all .4s;margin-top:20px;line-height:1.5;font-size:22px;color:#fff}
#mainVisual .txt .txt3 b{font-weight:normal;color:var(--primary)}
#mainVisual .txt a{display:block;overflow:hidden;width:530px;height:75px;margin:10px auto 0;border-radius:50px;font-size:25px;line-height:75px;color:#fff;transition:all .4s;font-family:'NEXEN_TIRE_Regular'}
#mainVisual .txt a span{display:block;width:100%;height:100%;color:#fff;background:var(--primary);transition:all .3s}
/* #mainVisual.on .txt3{visibility:visible;opacity:1;transition:all .4s .4s} */
#mainVisual.on .txt b{color:#fff000}
#mainVisual.on .txt .txt1:before{background:#fff000}
#mainVisual.on .txt .txt3 b{color:#fff000}
#mainVisual.on .txt a span{color:#222;background:#fff000}
#mainVisual.on .txt a{visibility:visible;opacity:1;transition:all .4s .4s}
#mainVisual.on .txt a:hover span{color:#fff;background:#000}

/* 이미지 슬라이드 */
#mainVisual .mainSwiper{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:calc(100% - 120px);height:430px;border-radius:30px;transition:width .4s .4s, height .4s, border-radius .2s;}
#mainVisual .mainSwiper:before{position:absolute;left:0;top:0;content:'';z-index:5;width:100%;height:100%;opacity:0;transition:all .4s;background:url('./black_filter.png');background-position:center bottom}
#mainVisual.on .mainSwiper{width:100%;height:100%;border-radius:0;transition:width .4s, height .4s .4s, border-radius .2s .4s;transition-timing-function:ease-in-out}
#mainVisual.on .mainSwiper:before{opacity:1;transition:all .4s}
#mainVisual.stop .mainSwiper{transition:all 0s;transition-timing-function:ease-in-out}
#mainVisual .main_img{position:relative;width:100%}
#mainVisual .main_img li{position:absolute;left:0;width:100%!important;height:100%;background-position:center bottom;opacity:0 !important}
#mainVisual .main_img li.swiper-slide-active{opacity:1 !important}
#mainVisual .main_img li.img01{background-image:url(./img01.jpg)}
#mainVisual .main_img li.img02{background-image:url(./img02.jpg)}

/* 스크롤다운 */
#mainVisual .scroll{position:absolute;left:50%;bottom:44px;z-index:10;transform:translateX(-50%) skew(-0.1deg);font-size:13px;color:#fff;font-family:'NEXEN_TIRE_Regular'}
#mainVisual .scroll span{display:block;position:relative;width:1px;height:75px;margin:0 auto 15px;background:rgba(255,255,255,.3)}
#mainVisual .scroll span:before{position:absolute;left:50%;transform:translateX(-50%);content:'';width:5px;height:5px;border-radius:100px;background:#fff;animation:scr_down 2s infinite}
@keyframes scr_down {0%{top:10px;opacity:1} 100%{top:90%;opacity:0}}