@charset "utf-8";

#MainVisual{position:relative;width:100%}
#MainVisual .pl{white-space:pre-line}
#MainVisual .tit{font-family: "Noto Serif KR", serif;display:flex;flex-direction:column;position:absolute;z-index:2;top:50%;left:50%;transform:translate(-50%, -50%);width:80%}
#MainVisual .tit h2{font-size:25px;font-weight:400;font-family:var(--e-font);color:var(--primary)}
#MainVisual .tit h1{margin:0 0 30px 0;font-size:65px;line-height: 75px; font-weight:600;color:var(--primary);  font-family: "Noto Serif KR", serif;letter-spacing: -4px;}
#MainVisual .tit h1 span{font-weight:100;color:var(--primary); }
#MainVisual .tit .bar{width: 32%; height: 2px; background-color: var(--primary); margin-bottom: 30px;}
#MainVisual .tit .s_txt{font-size: 18px; color:var(--primary); font-weight: 300;margin-bottom: 40px;}
#MainVisual .tit .btn{cursor: pointer; width: 140px;margin-bottom: 50px; padding: 0 20px; display: flex;align-items: center;    justify-content: flex-end; background-color: var(--primary);font-family: var(--e-font); border-radius: 100px; font-size: 13px;color: #fff;}
#MainVisual .controller{position:relative;padding:6px 8px;border-radius:17px;width:max-content;background-color:rgb(0, 0, 0, 0.15)}
#MainVisual .pager{position:absolute;top:44%;bottom:unset;left:50%;transform:translate(-50%, -50%);width:auto;color:#fff}
#MainVisual .nav_container{display:flex;gap:40px}
#MainVisual .nav_container div{cursor:pointer}
#MainVisual .nav_container svg{width:16px;height:16px;color:#fff;transition:all .3s}
#MainVisual .main_slide{position:relative;width:100%;height:900px}
#MainVisual .main_slide li{width:100%;height:100%;background-repeat:no-repeat;background-size:cover;background-position:center}
#MainVisual .main_slide li.bg01{background-image:url(./main_banner01.jpg)}
#MainVisual .main_slide li.bg02{background-image:url(./main_banner02.jpg)}
#MainVisual .main_slide li.bg03{background-image:url(./main_banner03.jpg)}

/* 반응형 [s] */
@media (hover:hover){
#MainVisual .nav_container svg:hover{color:var(--primary)}
}
@media (max-width:1980px){
#MainVisual .main_slide{height:720px}
#MainVisual .tit h2{font-size:22px}
#MainVisual .tit h1{font-size:59px}
}
@media (max-width:1380px){
#MainVisual .tit{width:90%}
#MainVisual .tit h2{font-size:20px}
#MainVisual .tit h1{font-size:55px}
}
@media (max-width:1024px){
#MainVisual .main_slide{height:620px}
#MainVisual .tit{width:95%}
#MainVisual .tit h1{}
#MainVisual .tit h2{font-size:18px}
#MainVisual .tit h1{font-size:45px;}
#MainVisual .nav_container{gap:35px}
}
@media (max-width:768px){
    body{letter-spacing: .5px;}
#MainVisual .main_slide{height:540px}
#MainVisual .main_slide li{filter:brightness(0.6)}
#MainVisual .main_slide li.bg01{background-position:75%}
#MainVisual .main_slide li.bg02{background-position:75%}
#MainVisual .main_slide li.bg03{background-position:70%}
#MainVisual .tit{text-align:center;align-items:center}
#MainVisual .tit h1{font-size:23px;color:#fff;line-height: 30px; margin-bottom: 10px;letter-spacing: -1px;}
#MainVisual .tit .bar{width: 12%;margin-bottom: 10px;}
#MainVisual .tit .btn{font-size: 10px;width: auto;margin-bottom: 20px;}
#MainVisual .tit .s_txt{color: #fff; font-size: 11px;}
#MainVisual .tit h1 span{font-weight: 500;color: #fff;}
#MainVisual .pager{font-size: 11px;}
}
@media (max-width:480px){
#MainVisual .main_slide{height:500px}
#MainVisual .tit h2{font-size:16px}
}
@media (max-width:390px){
#MainVisual .tit h2{font-size:15px}
}
/* 반응형 [e] */