@charset "utf-8";

#MainVisual{position:relative;margin:auto;height:100vh;font-size:15px;line-height:1.5;background:#111}

#MainVisual .main_wrap{position:absolute;top:80px;width:100%;}
#MainVisual .main_wrap ul{height:40vh;}
#MainVisual .main_wrap li{width:100%;height:100%;background-size:cover;background-position:center}
#MainVisual .main_wrap .bg01{background-image:url(./img/main_banner01.jpg)}
#MainVisual .main_wrap .bg02{background-image:url(./img/main_banner02.jpg)}
#MainVisual .main_wrap .bg03{background-image:url(./img/main_banner03.jpg)}

#MainVisual .main_txt{position:absolute;align-items:flex-end;bottom:150px;left:50%;display:flex;justify-content:space-between;max-width:var(--main-size);width:100%;color:#fff;transform:translateX(-50%)}
#MainVisual .l_txt h1{font-size:80px;white-space:pre-line;line-height:1;font-family:var(--e-font)}
#MainVisual .l_txt>div{margin-top:50px}
#MainVisual .l_txt .ntc{font-size:13px;font-weight:500;color:var(--primary)}
#MainVisual .l_txt dl{display:flex;gap:10px;align-items:center}
#MainVisual .l_txt dl dt{width:55px;font-weight:500;opacity:.5}
#MainVisual .l_txt dl dd{font-size:20px;font-weight:700;font-family:var(--e-font)}

#MainVisual .r_txt{width:45%}
#MainVisual .r_txt>p{margin-bottom:50px;font-size:30px;font-weight:500;font-family:var(--e-font)}
#MainVisual .r_txt>p span{color:var(--primary)}
#MainVisual .r_txt .course{display:grid;grid-template-columns:repeat(2,1fr);}
#MainVisual .r_txt .b_tit{display:flex;align-items:center;gap:10px}
#MainVisual .r_txt .b_tit span{font-size:18px;font-weight:700;color:var(--primary);font-family:var(--e-font)}
#MainVisual .r_txt .b_tit p{font-size:20px}
#MainVisual .r_txt .b_tit em{font-style:normal;opacity:.5}
#MainVisual .r_txt .txt{height:45px;margin:10px 0 30px;opacity:.5}
#MainVisual .r_txt a{display:inline-block;padding:10px 20px;border-radius:50px;color:rgba(255,255,255,.5);background:rgba(255,255,255,.1);transition:all .3s}

#MainVisual .golink{position:absolute;bottom:0;left:0;display:flex;align-items:center;justify-content:center;gap:5px;width:100%;padding:10px 0;font-size:18px;font-weight:700;text-align:center;color:#111;background:var(--primary);transition:all .3s}

@media(hover:hover){
#MainVisual .r_txt a:hover{color:#fff}
#MainVisual .golink:hover{gap:10px}
}

/* 반응형 [s] */
@media (max-width:1024px){
#MainVisual{height:auto}
#MainVisual .main_wrap{position:unset}
#MainVisual .main_txt{position:unset;display:block;padding-bottom:100px;text-align:center;transform:none}
#MainVisual .l_txt h1{margin-top:-30px;font-size:70px;white-space:normal}
#MainVisual .l_txt>div{margin-top:30px}
#MainVisual .l_txt dl{justify-content:center}
#MainVisual .r_txt{width:100%;margin-top:30px}
#MainVisual .r_txt>p{margin-bottom:20px}
#MainVisual .r_txt .b_tit{justify-content:center}
#MainVisual .r_txt .course{display:flex;justify-content:center;gap:50px}
}
@media (max-width:768px){
#MainVisual .l_txt h1{font-size:60px}
#MainVisual .l_txt>div{margin-top:20px}
#MainVisual .r_txt .b_tit p{font-size:17px}
}
@media (max-width:580px){
#MainVisual{font-size:14px}
#MainVisual .l_txt h1{font-size:50px}
#MainVisual .r_txt>p{font-size:25px}
#MainVisual .golink{font-size:16px}
}
@media (max-width:480px){
#MainVisual .l_txt h1{margin-top:-15px}
#MainVisual .main_wrap ul{height:35vh}
#MainVisual .l_txt h1{font-size:35px}
#MainVisual .r_txt .course{flex-direction:column;gap:30px}
#MainVisual .r_txt .txt{height:auto;margin:10px 0}
}
@media (max-width:390px){
#MainVisual .l_txt h1{margin-top:-14px;font-size:30px}
}
/* 반응형 [e] */