@charset "utf-8";

#mainVisual{overflow:hidden;position:relative;width:95%;margin:30px auto 0;border-radius:13px;background:#222}

/* 텍스트 */
#mainVisual .main_txt{position:absolute;z-index:101;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;max-width:var(--mainsize);text-align:center;color:#fff}
#mainVisual .main_txt h1{margin-bottom:20px;font-size:55px;font-weight:700;white-space:pre-line;line-height:1.2}
#mainVisual .main_txt span{font-size:20px;line-height:26px;font-weight:400}
#mainVisual .main_txt a{display:flex;align-items:center;gap:20px;width:max-content;margin:50px auto 0;padding:20px 40px;border-radius:50px;font-size:16px;color:#fff;font-weight:600;background:rgba(255,255,255,.2);transition:all .3s}
#mainVisual .main_txt a:hover{color:#111;background:#fff}

/* Pager */
#mainVisual .pager{display:flex;gap:13px;position:absolute;left:50%;bottom:8%;transform:translateX(-50%);z-index:30;width:max-content;height:max-content}
#mainVisual .pager span{display:block;opacity:1;width:9px;height:9px;margin:0;border-radius:100%;color:#fff;cursor:pointer;background:rgba(255, 255, 255, .2);transition:.2s}
#mainVisual .pager span.on{background-color:#fff}

/* bg */
#mainVisual ul:after{display:block;content:"";position:absolute;left:0;top:0;width:100%;height:100%}
#mainVisual ul li{height:825px;overflow:hidden}
#mainVisual ul li .bg{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100%;height:100%;background-size:cover}
#mainVisual ul li .bg01{background-image:url(./main_img01.jpg)}
#mainVisual ul li .bg02{background-image:url(./main_img02.jpg)}
#mainVisual ul li .bg03{background-image:url(./main_img03.jpg)}

@media (max-width:1440px){
#mainVisual .main_txt h1{font-size:46px}
#mainVisual .main_txt span{font-size:18px}
}
@media (max-width:1024px){
#mainVisual{width:100%;margin-top:0;border-radius:0px}
#mainVisual ul li{height:700px}
#mainVisual .main_txt h1{font-size:38px}
#mainVisual .main_txt span{font-size:17px}
#mainVisual .main_txt a{padding:16px 34px;font-size:15px}
}
@media (max-width:768px){
#mainVisual .main_txt{padding:0 15px;word-break:keep-all}
#mainVisual .main_txt h1{margin-bottom:16px;font-size:34px}
#mainVisual .main_txt a{margin:30px auto 0}
#mainVisual .main_txt span{font-size:16px}
}
@media (max-width:480px){
#mainVisual ul li{height:100%;min-height:435px}
#mainVisual .pager{gap:10px}
#mainVisual .pager span{width:6px;height:6px}
#mainVisual .main_txt h1{margin-bottom:14px;font-size:clamp(22px,5.8vw,28px)}
#mainVisual .main_txt span{font-size:15px}
#mainVisual .main_txt a{margin:22px auto 0;padding:14px 28px;font-size:14px}
}
@media (max-width:390px){
#mainVisual .main_txt a{margin:20px auto 0;padding:12px 24px;font-size:13px}
}