@charset "utf-8";

#mainVisualWrap{padding-right:175px;color:#fff;background:url(./img/bg.jpg);background-size:cover;font-family:'Pretendard'}
#mainVisual{overflow:hidden;display:flex;justify-content:space-between;padding-top:180px;height:850px}
#mainVisual *{word-break:keep-all}
#mainVisual .pl{white-space:pre-line}

/* mainVisual */
#mainVisual .mainSwiper{width:530px;height:520px}
#mainVisual .main_img li{width:100%;height:100%;background:center no-repeat;background-size:cover;border-radius:20px}
#mainVisual .main_img li img{display:none}
#mainVisual .main_img li.img01{background-image:url(./img/img01.jpg)}
#mainVisual .main_img li.img02{background-image:url(./img/img02.jpg)}
#mainVisual .main_img li.img03{background-image:url(./img/img03.jpg)}
#mainVisual .main_img li.img04{background-image:url(./img/img04.jpg)}

#mainVisual .slider{position:relative}
#mainVisual .swiper-pager{position:absolute;left:50%;display:flex;align-items:flex-end;justify-content:center;z-index:101;margin-top:25px;transform:translateX(-50%)}
#mainVisual .swiper-pager span{position:relative;opacity:.3;width:10px;height:10px;border-radius:50px;background:#fff;transition:all .3s}
#mainVisual .swiper-pager span+span{margin-left:10px}
#mainVisual .swiper-pager span.on{opacity:1}

#mainVisual .cont{margin-left:135px}
#mainVisual .txt span{position:relative;padding-left:65px;font-size:15px;font-weight:700;font-family:'Play'}
#mainVisual .txt span:after{position:absolute;content:'';top:8px;left:0;width:50px;height:1px;background:#fff}
#mainVisual .txt p{margin:40px 0 30px;font-size:30px;font-weight:300}
#mainVisual .txt p b{font-weight:700}
#mainVisual .txt div{font-size:16px;color:rgba(255,255,255,50%);line-height:1.5}

#mainVisual .link{margin-top:80px}
#mainVisual .link li+li{margin-top:45px}
#mainVisual .link a{position:relative;display:flex;align-items:center}
#mainVisual .link div{margin-left:40px;font-size:14px;color:rgba(255,255,255,50%)}
#mainVisual .link div p{margin-bottom:5px;font-size:17px;font-weight:700;color:#fff;text-transform:uppercase;font-family:'Play'}
#mainVisual .link .go_link{position:absolute;right:0;opacity:.3;transition:all .3s}

#mainVisual .contact{width:330px}

#mainVisual .tel{margin-top:50px;font-weight:700;text-align:center;font-family:'Play'}
#mainVisual .tel>span{font-size:20px}
#mainVisual .tel p{margin:20px 0;font-size:40px}
#mainVisual .tel ul{line-height:1.8}
#mainVisual .tel ul li{font-size:15px;color:rgba(255,255,255,50%)}
#mainVisual .tel ul span{margin-right:10px;color:#fff}
#mainVisual .tel a{display:flex;align-items:center;justify-content:center;width:330px;height:65px;margin-top:30px;border-radius:5px;font-size:17px;font-weight:700;color:var(--primary);background:#fff;transition:all .3s;font-family:'Pretendard'}
#mainVisual .tel a i{margin-left:15px;font-size:20px}

#mainVisual .lt_area{margin-top:50px}
#mainVisual .lt_area .s_tit{display:inline-block;margin-left:20px;padding:8px 15px;border-radius:50px;font-size:13px;font-weight:700;color:var(--primary);background:#fff}
#mainVisual .lt_slide{margin-top:-15px}
#mainVisual .lt_slide li{padding:50px 30px 30px;border-radius:10px;background:rgba(255,255,255,10%)}
#mainVisual .lt_slide a{display:block;color:#fff}
#mainVisual .lt_slide .sh_notice{margin-bottom:20px;font-size:16px;font-weight:600}
#mainVisual .lt_slide .sh_contents{font-size:14px;color:rgba(255,255,255,.5);line-height:1.5}
#mainVisual .lt_slide .data{display:flex;align-items:center;gap:5px;margin-top:25px}
#mainVisual .lt_slide .data span{opacity:.5}

#mainVisual .lt_control{position:absolute;right:30px;bottom:25px;z-index:10}
#mainVisual .lt_control .prev{position:relative}
#mainVisual .lt_control .prev:after{position:absolute;content:'';top:5px;right:-2px;width:1px;height:10px;background:rgba(255,255,255,.3)}
#mainVisual .lt_control span{display:inline-block;height:20px;cursor:pointer}
#mainVisual .lt_control svg{width:30px;height:20px}

@media(hover:hover){
#mainVisual .link a:hover .go_link{opacity:1;transform:rotate(-45deg)}
#mainVisual .tel a:hover{background:#111}
}

/* 반응형 [s] */
@media (max-width:1750px){
#mainVisualWrap{padding-right:0}
#mainVisual .pl{white-space:normal}
#mainVisual{padding:180px 100px 100px;flex-wrap:wrap;height:auto}
#mainVisual .cont{width:100%;margin-left:0;padding-bottom:80px}
#mainVisual .link{display:grid;grid-template-columns:repeat(3,1fr);gap:80px;margin-top:40px}
#mainVisual .link li+li{margin-top:0}
#mainVisual .link .go_link{opacity:1}

#mainVisual .slider{width:60%}
#mainVisual .mainSwiper{max-width:810px;width:100%;height:470px}
#mainVisual .main_img li{overflow:hidden;background:none !important}
#mainVisual .main_img li img{display:block;width:100%}

#mainVisual .tel{margin-top:0}
#mainVisual .contact{width:35%}
#mainVisual .lt_area{margin-top:30px}
#mainVisual .tel a{width:100%}
}
@media (max-width:1400px){
#mainVisual .txt p{margin:40px 0 15px;font-size:35px}
#mainVisual .link{margin-top:60px}
#mainVisual .tel p{font-size:35px}
#mainVisual .lt_slide .sh_contents{overflow:hidden;display:inline-block;height:37px}
}
@media (max-width:1200px){
#mainVisual{display:block;padding:180px 70px 100px}
#mainVisual .slider{width:100%}
#mainVisual .mainSwiper{max-width:100%;height:250px}
#mainVisual .link{gap:40px}
#mainVisual .contact{display:flex;justify-content:space-between;gap:40px;width:100%;margin-top:80px}
#mainVisual .contact>div{width:50%}
#mainVisual .lt_area{padding-bottom:16px}
}
@media (max-width:1024px){
#mainVisual{padding:150px 50px 100px}
#mainVisual .txt{text-align:center}
#mainVisual .txt p{font-size:30px}
#mainVisual .link div{margin-left:20px}
#mainVisual .cont{padding-bottom:55px}
#mainVisual .lt_area{margin-top:0}
#mainVisual .tel p{font-size:30px}
}
@media (max-width:768px){
#mainVisual{padding:150px 50px 50px}
#mainVisual .link{display:block}
#mainVisual .link a{padding:20px 25px;border:1px solid rgba(255,255,255,.2);border-radius:10px}
#mainVisual .link a>img:not(.go_link){width:25px}
#mainVisual .link .go_link{right:25px}
#mainVisual .link div p{margin-bottom:0;font-size:16px}
#mainVisual .link li+li{margin-top:10px}
#mainVisual .link div{display:flex;align-items:center;gap:25px}
#mainVisual .contact{display:block}
#mainVisual .contact>div{width:100%}
#mainVisual .lt_area{margin-top:30px}
#mainVisual .lt_control{bottom:45px}
}
@media (max-width:480px){
#mainVisual{padding:120px 30px 30px}
#mainVisual .link{margin-top:35px}
}
@media (max-width:390px){
#mainVisual{padding:120px 15px 30px}
}
/* 반응형 [e] */