@charset "utf-8";

/* 메인배너 */
#mainVisual{height:585px;border-radius:10px;background:#222}
#mainVisual .pager_dot{display:inline-block;position:absolute;z-index:101;left:60px;bottom:100px;width:auto}
#mainVisual .pager_dot span{opacity:.2;margin:0;width:8px;height:8px;border-radius:15px;transition:all .2s;background-color:rgba(0,0,0, 0.8)}
#mainVisual .pager_dot span+span{margin-left:8px}
#mainVisual .pager_dot span.on{width:25px;background-color:#222;opacity:1}

#mainVisual ul .tit{opacity:0;position:absolute;left:60px;top:90px;}
#mainVisual ul li.on .tit{opacity:1;transition:1.5s}
#mainVisual ul .tit b{font-family:'LotteMartDreamBold'}
#mainVisual ul .txt{font-size:56px;font-weight:700;line-height:1.2;color:#222;transition:all .25s ease-out;font-family:'LotteMartDreamLight'}
#mainVisual ul .s_text{padding-top:45px;font-size:16px;color:rgba(0,0,0,0.5);white-space:pre-line;line-height:1.5;font-family:'LotteMartDreamMedium'}
#mainVisual ul .s_text b{font-size:17px;color:#222}

/* 반응형 [s] */
@media (max-width:1300px){
    #mainVisual{height:400px}
    #mainVisual img{display:none}
    #mainVisual ul .bnr01{background:url(/sh_img/index/main_banner/main_banner_m1.jpg) right}
    #mainVisual ul .bnr02{background:url(/sh_img/index/main_banner/main_banner_m2.jpg) right}
    #mainVisual ul .tit{top:75px;font-size:50px}
    #mainVisual ul .s_text{padding-top:20px}
    #mainVisual .pager_dot{bottom:31px}
    #mainVisual ul .txt{color:#fff}
    #mainVisual ul .s_text{color:rgba(255, 255, 255, 0.5)}
    #mainVisual ul .s_text b{color:#fff}
    #mainVisual .pager_dot span{background-color:rgba(255, 255, 255, 0.8)}
    #mainVisual .pager_dot span.on{background-color:#fff}
    
    }
    @media (max-width:810px){
    #mainVisual ul .txt{font-size:35px}
    #mainVisual ul .s_text{font-size:15px}
    }
    @media (max-width:768px){
    #mainVisual{height:330px}
    #mainVisual ul .tit{top:50%;left:50%;transform:translate(-50%,-50%)!important;width:100%;padding:0 30px}
    #mainVisual .pager_dot{bottom:14px;left:50%;transform:translateX(-50%)}
    #mainVisual ul .txt{font-size:30px;text-align:center;word-break:keep-all}
    #mainVisual ul .s_text{text-align:center;white-space:normal;word-break:keep-all}
    }
    
    @media (max-width:480px){
    #mainVisual{height:280px}
    #mainVisual ul .bnr01{background:url(/sh_img/index/main_banner/main_banner_m1.jpg) 85%}
    #mainVisual ul .bnr02{background:url(/sh_img/index/main_banner/main_banner_m2.jpg) 85%}
    #mainVisual ul .txt{font-size:21px}
    #mainVisual ul .s_text{padding-top:7px;font-size:13px}
    #mainVisual .pager_dot{bottom:0}
    }
    /* 반응형 [e] */