@charset "utf-8";

#mainVisual{position:relative;margin:auto;width:95%}
#mainVisual  h1{font-size:62px;font-weight:700;white-space:pre-line}
#mainVisual  h2{font-size:18px;font-weight:600;color:#fff}
#mainVisual  h3{margin-top:10px;font-size:25px;font-weight:700;color:#fff}
#mainVisual .txt{display:flex;flex-direction:column;align-items:center;text-align:center;margin:150px auto 0}
#mainVisual .txt a{position:relative;display:block;padding-bottom:15px;margin-top:100px;font-size:18px;font-weight:700;transition:all .3s}
#mainVisual .txt a:after{content:"";position:absolute;bottom:0px;left:50%;transform:translateX(-50%);width:120%;height:3px;background:linear-gradient(to right, var(--primary), var(--primary)) no-repeat;background-size:0%;background-color:#000;transition:all.3s}
#mainVisual .txt a:hover{color:var(--primary)}
#mainVisual .txt a:hover:after{background-size:100%}

#mainVisual .main_slide{padding-top:80px}
#mainVisual .main_slide a{position:relative;display:block;width:100%;height:100%;transition:all .3s}
#mainVisual .main_slide a:hover{transform:translateY(-50px)}
#mainVisual .main_slide a:hover .arrow{opacity:1;margin-top:30px}
#mainVisual .cont{overflow:hidden;position:relative;border-radius:30px}
#mainVisual .cont:after{content:"";position:absolute;bottom:0px;left:0px;width:100%;height:100%;background-image:linear-gradient(to bottom, transparent 50%, #11111199)}
#mainVisual .cont img{width:100%;height:440px;object-fit:cover}
#mainVisual .cont .txt_cont{position:absolute;z-index:2;bottom:10%;left:8%}
#mainVisual .arrow{opacity:0;display:flex;justify-content:center;align-items:center;margin:45px auto 0;width:60px;height:60px;border-radius:50%;background-color:var(--primary);transition:all .3s}
#mainVisual .arrow svg{width:22px;height:22px;color:#fff;transition:all .2s}
#mainVisual .arrow:hover svg{transform:rotate(45deg)}