@charset "utf-8";

#mainVisual{overflow:hidden;position:relative;font-family:'Josefin Sans',sans-serif}

#mainVisual .main{position:relative;z-index:1;width:100%;height:865px}
#mainVisual .main li{width:100%;height:100%;background-position:center;background-repeat:no-repeat}
#mainVisual .main li.bg01{background-image:url(./main_banner_01.jpg)}
#mainVisual .main li.bg02{background-image:url(./main_banner_02.jpg)}
#mainVisual .pager{display:flex;gap:15px;position:absolute;z-index:3;bottom:17%;left:50%;transform:translateX(-50%);max-width:1200px;width:100%}
#mainVisual .pager div{width:auto;height:auto;background:none;border-radius:0%;font-size:14px;color:#fff}

/* 텍스트 */
#mainVisual .txt_area{position:relative;max-width:1200px;margin:0 auto}
#mainVisual .txt_area .txt{position:absolute;width:100%;height:865px;z-index:3}
#mainVisual .btxt{position:relative;top:250px;left:0;margin-left:-20px;opacity:0;font-size:60px;font-weight:700;font-family:'Josefin Sans',sans-serif;line-height:1.1;color:#fff}
#mainVisual .more_btn{display:inline-block;position:relative;top:280px;margin-left:-20px;opacity:0;font-size:16px;font-weight:500;color:#fff}
#mainVisual .more_btn:before{display:inline-block;content:"";vertical-align:bottom;width:12px;height:30px;margin-right:10px;background-color:#ea332a;-webkit-transition:all .2s;transition:all .2s}
#mainVisual .stxt{position:absolute;left:50%;top:305px;margin-left:-20px;opacity:0;color:#fff}
#mainVisual .stxt span{display:block;margin-bottom:20px;font-size:16px;font-weight:500}
#mainVisual .stxt a {position:relative;padding-right:32px;font-size:30px;font-weight:700;color:#fff;background:url(./arr.png) right center no-repeat;-webkit-transition:padding .3s;transition:padding .3s}
#mainVisual .stxt a:after{display:block;content:"";position:absolute;right:-37px;top:50%;width:49px;height:49px;margin-top:-25px;border-radius:59px;border:1px solid rgba(255,255,255,.5);-webkit-transition:right .3s;transition:right .3s}
#mainVisual .sstxt{overflow:hidden;position:absolute;left:50%;bottom:160px;width:50%}
#mainVisual .sstxt li{float:left;width:50%;font-size:15px;font-weight:400;line-height:1.6;color:rgba(255,255,255,.8);font-family:var(--k-font)}

/* 그리드 */
#mainVisual .grid{position:absolute;top:0;bottom:0;left:0;right:0;z-index:2;width:100%;max-width:1200px;margin:0 auto}
#mainVisual .grid span{display:block;position:absolute;bottom:0;z-index:1;width:1px;height:0;background:rgba(255,255,255,.15)}
#mainVisual .grid span.line01{left:25%}
#mainVisual .grid span.line02{left:50%}
#mainVisual .grid span.line03{left:75%}

/* 반응형 [s] */
@media (hover:hover){
#mainVisual .more_btn:hover:before{background-color:#fff}
#mainVisual .stxt a:hover{padding-right:50px}
#mainVisual .stxt a:hover:after{right:10px}
}
@media (max-width:1280px){
#mainVisual .txt_area{margin:auto;max-width:unset;width:95%}
#mainVisual .pager{margin:auto;max-width:unset;width:95%}
#mainVisual .grid{max-width:unset;width:95%}
}
@media (max-width:1024px){
#mainVisual .main{height:550px}
#mainVisual .txt_area .txt{height:auto}
#mainVisual .btxt{top:180px;font-size:45px}
#mainVisual .stxt{top:430px;left:unset;right:3%}
#mainVisual .stxt a{font-size:28px}
#mainVisual .stxt a:after{right:-32px;width:44px;height:44px}
#mainVisual .stxt a:hover:after{right:11px}
#mainVisual .more_btn{top:203px}
#mainVisual .sstxt{display:none}
#mainVisual .grid{display:none}
#mainVisual .pager{gap:20px;bottom:23%}
#mainVisual .pager div{font-size:16px}
}
@media (max-width:768px){
#mainVisual .main{height:440px}
#mainVisual .main li.bg01{background-image:linear-gradient(rgb(0, 0, 0, 0.3), rgb(0, 0, 0, 0.3)), url(./main_banner_01.jpg)}
#mainVisual .main li.bg02{background-image:linear-gradient(rgb(0, 0, 0, 0.3), rgb(0, 0, 0, 0.3)), url(./main_banner_02.jpg)}
#mainVisual .btxt{top:135px;text-align:center;font-size:40px}
#mainVisual .more_btn{position:relative;top:155px;left:50%;transform:translateX(-50%);margin-left:0px !important;padding:0 8px 8px}
#mainVisual .more_btn:before{position:absolute;bottom:0px;left:50%;transform:translateX(-50%);margin:0px;width:100%;height:3px}
#mainVisual .pager{justify-content:center}
#mainVisual .stxt{display:none}
#mainVisual .pager{bottom:19%}
#mainVisual .pager div{opacity:.5}
#mainVisual .pager .swiper-pagination-bullet-active{opacity:1}
}
@media (max-width:480px){
#mainVisual .main{height:350px}
#mainVisual .btxt{top:105px;font-size:30px}
#mainVisual .more_btn{top:125px;font-size:15px}
#mainVisual .pager div{font-size:15px}
}
@media (max-width:380px){
#mainVisual .main{height:320px}
#mainVisual .btxt{top:95px;font-size:28px}
#mainVisual .more_btn{top:110px;padding:0 6px 6px;font-size:14px}
#mainVisual .pager{gap:18px}
#mainVisual .pager div{font-size:14px}
}
/* 반응형 [e] */