@charset "utf-8";

#mainVisual{position:relative;z-index:1;letter-spacing:-.2px;width:100%;height:90vh;min-height:650px;background:#222}
#mainVisual .main_slide{overflow:hidden;height:100%}
#mainVisual ul li{background:url(./main01.jpg) center no-repeat;background-size:cover}
#mainVisual ul li.bg02{background-image:url(./main02.jpg)}
#mainVisual ul li.bg03{background-image:url(./main03.jpg)}

/* 텍스트 */ 
#mainVisual .main_txt{position:absolute;top:50%;left:50%;z-index:101;transform:translate(-50%,-50%);max-width:1480px;width:100%;font-size:18px;line-height:1.5;color:rgba(255,255,255,.6);font-family:'Poppins','Pretendard'}
#mainVisual .main_txt .stit{display:block;font-size:19px;font-weight:500;color:#fff;font-family:'jost'}
#mainVisual .main_txt .btit{margin:40px 0 35px;font-size:54px;font-weight:100;color:#fff;line-height:1.25;white-space:pre-line}
#mainVisual .main_txt .btit b{font-weight:600}

/* 컨트롤 */
#mainVisual .pager{margin-top:60px;margin-left:-5px}
#mainVisual .pager span{opacity:.3;position:relative;width:29px;height:29px;margin:0 5px;background-color:transparent;transition:all .3s}
#mainVisual .pager span.on{opacity:1}
#mainVisual .pager span:before{opacity:0;display:block;content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:45px;height:45px;border:1px solid rgba(255,255,255,.3);border-radius:50%;transition:all .3s}
#mainVisual .pager span.on:before{opacity:1;width:100%;height:100%}
#mainVisual .pager span:after{display:block;content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:6px;height:6px;border-radius:50%;background:#fff}

#mainVisual .box{display:flex;justify-content:flex-end;position:absolute;left:50%;bottom:-70px;z-index:101;transform:translateX(-50%);max-width:1480px;width:100%}
#mainVisual .box a{display:flex;flex-flow:column;align-items:flex-start;width:285px;height:285px;padding:45px;font-size:16px;font-weight:500;line-height:1.65;color:rgba(255,255,255,.6);background:var(--primary);transition:all 1s, border-radius .3s}
#mainVisual .box a:nth-child(2){color:rgba(0,0,0,.6);background:#f2f3f4}
#mainVisual .box a:nth-child(2) p{color:#111}
#mainVisual .box a:nth-child(3){transform:translateY(-235px);background:#101a28}
#mainVisual .box a img{margin-left:auto;transition:all .3s}
#mainVisual .box a p{margin:auto 0 15px;font-size:24px;font-weight:600;color:#fff}
#mainVisual .box a:nth-child(3).aos-animate{transform:translateY(-285px)}

@media(hover:hover){
#mainVisual .box a:hover{border-radius:40px 0}
}

@media(max-width:1540px){
#mainVisual .main_txt{padding:0 30px}
#mainVisual .box{left:auto;right:0;transform:none}
}
@media(max-width:1024px){
#mainVisual{height:650px;min-height:auto}  
#mainVisual .main_txt{font-size:16px}
#mainVisual .main_txt .stit{font-size:16px}
#mainVisual .main_txt .btit{margin:25px 0;font-size:42px}    
#mainVisual .pager{margin-top:30px}
#mainVisual .box a{width:240px;height:240px;padding:30px;font-size:15px;word-break:keep-all}
#mainVisual .box a:nth-child(3).aos-animate{transform:translateY(-240px)}
#mainVisual .box a p{font-size:20px}
}
@media(max-width:768px){
#mainVisual{height:auto;min-height:auto;background-color:transparent}
#mainVisual .main_slide{height:450px}
#mainVisual .main_txt{top:15%;left:auto;transform:none;padding:0 20px;font-size:15px;word-break: keep-all}
#mainVisual .main_txt .btit{font-size:38px}
#mainVisual .box{position:relative;left:auto;bottom:auto;transform:none;width:100%}
#mainVisual .box a{width:calc(100% / 3);padding:20px;font-size:14px}
#mainVisual .box a:nth-child(3){transform:translateY(-50px)}
#mainVisual .box a:nth-child(3).aos-animate{transform:none}
#mainVisual .box a p{margin-bottom:10px}
}
@media(max-width:480px){
#mainVisual .main_txt .btit{white-space:normal;word-break:keep-all}
#mainVisual .main_txt .btit{font-size:32px}    
#mainVisual .box a img{width:24px}
#mainVisual .box a p{font-size:18px}
}
@media(max-width:380px){
#mainVisual .box{display:block}
#mainVisual .box a{width:100%;height:auto}
#mainVisual .box a p{margin-bottom:5px}
}