@charset "utf-8";

.swiper-slide.first{min-width:1400px;width:100vw;background-color:#fff}
#mainVisual{position:relative;width:100%;font-size:14px;letter-spacing:-.3px;line-height:1.8;color:#777;font-family:'Cormorant Garamond','notokr-regular'}
#mainVisual .img_box{position:relative;width:70%}

#intro{position:fixed;left:0;top:0;z-index:13;min-width:1400px;width:100vw;height:100%;backdrop-filter:blur(15px)}
#intro.hide{opacity:0;-webkit-transition:all 1s .3s;transition:all 1s .3s}
#intro > div{position:absolute;height:100%;background-color:rgba(0,0,0,.4)}
#intro .left{left:0;width:70%}
#intro .right{right:0;width:30%}
#intro .left.hide{opacity:0;left:-100%;transition:all 1.4s cubic-bezier(0.55, 0.085, 0.68, 0.53)}
#intro .right.hide{opacity:0;right:-100%;transition:all 1.4s cubic-bezier(0.55, 0.085, 0.68, 0.53)}

/* 이미지 */
#mainVisual .swiper_img{z-index:10;height:100vh}
#mainVisual .swiper_img li{overflow:hidden}
#mainVisual .swiper_img .inner_img{width:100%;height:100%;background:url(/sh_img/index/main_banner/main_img01.jpg) center no-repeat;background-size:cover}
#mainVisual .swiper_img .img02{background-image:url(/sh_img/index/main_banner/main_img02.jpg)}
#mainVisual .swiper_img .img03{background-image:url(/sh_img/index/main_banner/main_img03.jpg)}
#mainVisual .swiper_img .inner_txt{position:absolute;right:-50px;top:0}

/* 텍스트 */
#mainVisual .btxt{opacity:0;overflow:hidden;position:absolute;right:190px;top:20%;z-index:11;padding-top:30px;margin-top:50px;font-size:76px;font-weight:700;line-height:1.1;color:#222;text-align:right}
#mainVisual .btxt .swiper-wrapper{height:200px}
#mainVisual .stxt{position:absolute;top:50%;left:calc(70% + 100px);border-top:1px solid #222}
#mainVisual .stxt p{padding:50px 0 30px;font-size:18px;font-weight:700;color:#222}

/* 컨트롤러 */
#mainVisual .controls{position:absolute;right:-100px;bottom:80px;z-index:11;width:200px;height:200px}
#mainVisual .controls span{display:block;position:absolute;width:0;height:100px;background-color:#222;cursor:pointer;text-align:center;line-height:100px;-webkit-transition:padding .2s, width .65s;transition:padding .2s, width .65s}
#mainVisual .controls span.on{width:100px}
#mainVisual .controls span img{position:relative; z-index:2}
#mainVisual .controls span:before{display:block;content:"";position:absolute;bottom:0;left:0;z-index:0;width:0;height:100%;background-color:#fff}
#mainVisual .controls span:hover:before{width:100%;-webkit-transition:width .2s cubic-bezier(0.55, 0.085, 0.68, 0.53);transition:width .2s cubic-bezier(0.55, 0.085, 0.68, 0.53)}
#mainVisual .controls span:after{display:block;content:"";position:absolute;bottom:0;left:0;z-index:1;width:0;height:100%;background-color:#212121}
#mainVisual .controls span:hover:after{width:100%;-webkit-transition:width .23s .12s cubic-bezier(0.55, 0.085, 0.68, 0.53);transition:width .23s .12s cubic-bezier(0.55, 0.085, 0.68, 0.53)}
#mainVisual .controls .prev{right:100px;top:0}
#mainVisual .controls .next{left:100px;bottom:0}

/* 페이저 */
#mainVisual .pager_dot{position:absolute;left:100px;bottom:80px;z-index:11}
#mainVisual .pager_dot span{vertical-align:middle;opacity:1;width:4px;height:4px;background-color:#222;-webkit-transition:all .2s;transition:all .2s}
#mainVisual .pager_dot span+span{margin-left:12px}
#mainVisual .pager_dot span.swiper-pagination-bullet-active{width:12px;height:12px}

#mainVisual .pager_num{position:absolute;bottom:60px;left:200px;z-index:12;font-size:80px;font-weight:700;line-height:1;color:#222;font-family:'Cormorant Garamond'}
#mainVisual .pager_num .swiper-wrapper{height:90px}
#mainVisual .pager_num .total{position:absolute;right:-35px;top:50px;font-size:20px}

/* 스크롤 */
#mainVisual .scroll{position:absolute;bottom:80px;right:100px}
#mainVisual .scroll:before{position:absolute;content:'SCROLL';left:-60px;top:-10px;width:50px;font-style:normal;font-size:13px;font-weight:700;color:#222;font-family:'Cormorant Garamond'}
#mainVisual .scr_bar_wrap{overflow:hidden;position:relative;width:105px;height:1px;background-color:#ccc}
#mainVisual .scr_bar{position:absolute;left:0;top:0;-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);width:30px;height:1px;background-color:#222}