@charset "utf-8";

#mainVisual{position:relative;font-size:15px}
#mainVisual *{word-break:keep-all}
#mainVisual .main_view{overflow:hidden;width:100%}
#mainVisual .main_view ul{position:relative;z-index:0}
#mainVisual .main_view li{position:relative;background-color:black;}
#mainVisual .main_view li video{width:100%}
#mainVisual .main_view li img{position:relative;width:100%;opacity:50%;}
#mainVisual .main_view li:before{position:absolute;content:'';top:0;width:100%;height:100%;background:rgba(0,0,0,.5);transition:all .3s}
#mainVisual.on .main_view li:before{background:rgba(0,0,0,.7)}
#mainVisual .abs_txt{position:absolute;top:0;left:50%;max-width:var(--mainsize);margin:0 auto;transform:translateX(-50%)}
#mainVisual .main_tit{display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);align-items:center;justify-content:center;flex-direction:column;height:auto;font-size:18px;font-weight:600;color:#fff;text-align:center;z-index:10}
#mainVisual .main_tit h1{margin-bottom:30px;font-size:70px;font-weight:700;white-space:pre-line;font-family:var(--e-font)}
#mainVisual .sec_page{display:flex;flex-direction:column;justify-content:center;margin-top:150px;padding-bottom:150px}
#mainVisual .sec_page h2{margin-bottom:50px;font-size:50px;font-weight:700;color:#fff;text-align:center}
#mainVisual .link_box{display:grid;grid-template-columns:repeat(2,1fr);gap:50px;margin-top:80px}
#mainVisual .link_box > div{max-width:500px;padding:25px;border-radius:13px;color:#fff;background:rgba(255,255,255,.1)}
#mainVisual .quick p{margin-bottom:20px;font-size:20px;font-weight:500;font-family:var(--e-font)}
#mainVisual .quick ul{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
#mainVisual .quick ul a{display:flex;justify-content:space-between;align-items:center;padding:5px 15px;border-radius:50px;border:1px solid rgba(255,255,255,.5);color:#aaa;transition:all .3s}
#mainVisual .collge ul{display:grid;grid-template-columns:repeat(3,1fr);align-items:center;justify-items:center;height:100%}
#mainVisual .collge a{display:block;height:100%;color:#fff;text-align:center}
#mainVisual .collge p{margin-top:15px;transition:all .3s}
#mainVisual .count{display:grid;grid-template-columns:repeat(3,1fr);color:#fff;text-align:center}
#mainVisual .count dt{margin-bottom:10px;font-weight:600;color:rgba(255,255,255,.5)}
#mainVisual .count dd{color:rgba(255,255,255,.5)}
#mainVisual .count dd span{margin-right:5px;font-size:50px;font-weight:600;color:#fff;font-family:var(--e-font)}
#mainVisual .arrow svg{position:absolute;bottom:-100%;left:50%;width:60px;height:60px;stroke-width:1px;transform:translateX(-50%);}
@keyframes scroll{0%{bottom:70px}100%{bottom:50px}}
#mainVisual.on .arrow{opacity:0}

@media(hover:hover){
#mainVisual .collge a:hover p{margin-top:20px}
#mainVisual .quick ul a:hover{border:1px solid #fff;color:#fff}
}
/* 반응형 [s] */
@media (max-width:1024px){
  #mainVisual .main_view li video,
  #mainVisual .main_view li img {
    width: 100%;
    height: 107px;
    margin-top: 0px;
    position: relative;
    display: block;
    object-fit: contain;
    object-position: center;
  }
#mainVisual .main_tit{font-size:16px}
#mainVisual .main_tit h1{font-size:45px}
#mainVisual .sec_page h2{font-size:35px}
#mainVisual .sec_page{margin-top:0;padding-bottom:0;padding:0 15px}
#mainVisual .count dd span{font-size:35px}
#mainVisual .link_box{gap:30px}
#mainVisual .abs_txt{width:100%}
#mainVisual .quick ul{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:768px){
#mainVisual .main_view li video,
#mainVisual .main_view li img {
width: 100%;
height: 107px;
margin-top: 0px;
position: relative;
display: block;
object-fit: contain;
object-position: center;
}
#mainVisual .main_tit h1{font-size:40px}
#mainVisual .sec_page h2{font-size:30px}
#mainVisual .arrow svg{width:50px;height:50px}
#mainVisual .count dd span{font-size:30px}
#mainVisual .link_box{display:block}
#mainVisual .link_box > div{max-width:100%}
#mainVisual .link_box .collge{margin-top:10px}
#mainVisual .quick ul{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:480px){
#mainVisual .main_view li video,
#mainVisual .main_view li img {
width: 100%;
height: auto;
margin-top: 0px;
position: relative;
display: block;
object-fit: contain;
object-position: center;
}
#mainVisual .main_tit{padding:0 15px}
#mainVisual .main_tit h1{font-size:30px}
#mainVisual .count{grid-template-columns:repeat(2,1fr);gap:20px}
#mainVisual .sec_page h2{font-size:25px}
#mainVisual .quick ul{grid-template-columns:repeat(2,1fr)}
#mainVisual .quick ul a{font-size:14px}
#mainVisual .collge a img{width:50px}
#mainVisual .collge p{font-size:14px}
}
@media (max-width:390px){
  #mainVisual .main_view li video,
#mainVisual .main_view li img {
width: 100%;
height: auto;
margin-top: 0px;
position: relative;
display: block;
object-fit: contain;
object-position: center;
}
#mainVisual .main_tit{padding:0 15px}
#mainVisual .main_tit h1{font-size:30px}
#mainVisual .count{grid-template-columns:repeat(2,1fr);gap:20px}
#mainVisual .sec_page h2{font-size:25px}
#mainVisual .quick ul{grid-template-columns:repeat(2,1fr)}
#mainVisual .quick ul a{font-size:14px}
#mainVisual .collge a img{width:50px}
#mainVisual .collge p{font-size:14px}
}
/* 반응형 [e] */