@charset "utf-8";

#mainVisual{position:relative;line-height:1}
#mainVisual .inner{position:relative;width:100%;height:826px}
#mainVisual .main_slider_wrap{width:100%;height:100%}
#mainVisual .MainSwiper{width:100%;height:100%}
#mainVisual .swiper-slide{height:100%;background-repeat:no-repeat;background-position:center;background-size:cover}
#mainVisual .list1{background-image:url("./main_img_bg01.jpg")}
#mainVisual .list1 .list1_center{position:relative;margin:0 auto;width:1400px;height:100%}
#mainVisual .list2{background-image:url("./main_img_bg02.jpg")}
#mainVisual .list3{background-image:url("./main_img_bg03.jpg")}

#mainVisual .txt_wrap{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}
#mainVisual .txt_wrap .txt_inner{position:relative;margin:0 auto;width:1400px;height:100%}
#mainVisual .txt_wrap .l_txt_box{position:absolute;top:50%;left:0;transform:translateY(-50%)}
#mainVisual .txt_wrap .tit{margin-bottom:50px;line-height:1.2;color:#fff;font-weight:700;font-size:50px}
#mainVisual .txt_wrap .tit .font_color{color:#3bbfd4}
#mainVisual .txt_wrap .txt{margin-bottom:45px;color:rgba(255,255,255,0.5);font-size:22px}

#mainVisual .r_img{position:absolute;bottom:0;right:45px}
#mainVisual .r_img .name_box{position:absolute;top:260px;right:50px;color:#fff;font-weight:400}
#mainVisual .r_img .name_box > span{display:block;margin-bottom:10px;font-size:15px}
#mainVisual .r_img .name_box .name{font-weight:700;font-size:22px}

#mainVisual .bot_link{display:flex;align-items:center}
#mainVisual .bot_link .btn{display:flex;align-items:center;justify-content:center;margin-right:15px;width:166px;height:50px;line-height:50px;border-radius:25px;color:#fff;border:1px solid #fff;font-size:16px;transition:all .5s}
#mainVisual .arrow_wrap{display:flex;align-items:center}
#mainVisual .main_arrow{display:flex;align-items:center;justify-content:center;width:50px;height:50px;border:1px solid #fff;border-radius:50%;background-repeat:no-repeat;background-position:center;cursor:pointer;transition:all .5s}
#mainVisual .main_arrow .arrow{width:18px;height:18px;color:#fff}
#mainVisual .main_prev{margin-right:5px}

#mainVisual .bot_bar{background:var(--primary)}
#mainVisual .bot_bar_inner{display:flex;width:1400px;margin:0 auto}
#mainVisual .bot_bar_inner > div{width:50%;height:87px}
#mainVisual .bot_bar .left{display:flex;align-items:center;color:#fff}
#mainVisual .bot_bar .left .phon{display:flex;align-items:center;margin-right:25px}
#mainVisual .bot_bar .left .phon > span{display:inline-block;font-size:20px;margin-right:30px}
#mainVisual .bot_bar .left .phon > .number{font-size:30px}
#mainVisual .bot_bar .left .time{color:rgba(255,255,255,0.3);font-size:16px}
#mainVisual .bot_bar .right{display:flex;align-items:center}
#mainVisual .bot_bar .right .bar_btn{display:flex;align-items:center;justify-content:center;width:50%;height:100%;background:rgba(8,45,89,1);color:#fff;font-weight:700;font-size:18px;transition:all .5s}

/* 반응형 [s] */
@media (hover:hover){
#mainVisual .bot_link .btn:hover{background:rgba(255,255,255,0.2)}
#mainVisual .main_arrow:hover{background-color:rgba(255,255,255,0.2)}
#mainVisual .bot_bar .right .bar_btn:hover{background:rgba(8,45,89,0.6)}
}
@media (max-width:1500px){
#mainVisual .txt_wrap .txt_inner,#mainVisual .list1 .list1_center{width:95%}   
#mainVisual .bot_bar_inner{width:100%}
#mainVisual .bot_bar .left{justify-content:center}
#mainVisual .bot_bar_inner > div{width:100%}
#mainVisual .r_img{right:0}
#mainVisual .r_img > .img > img{width:500px}
#mainVisual .r_img .name_box{top:30%;right:10%}
}
@media (max-width:1300px){
#mainVisual .inner{height:750px}
#mainVisual .r_img > .img > img{width:450px}
#mainVisual .txt_wrap .tit{font-size:45px}
#mainVisual .bot_bar_inner{flex-direction:column}
}
@media (max-width:1200px){
#mainVisual .inner{height:680px}
#mainVisual .r_img .name_box{right:0}
#mainVisual .r_img > .img > img{width:400px}
#mainVisual .txt_wrap .tit{font-size:40px}
}
@media (max-width:1024px){
#mainVisual .inner{height:600px}
#mainVisual .r_img{display:none}
#mainVisual .txt_wrap .l_txt_box{top:55%;display:flex;flex-direction:column;align-items:center;width:100%}
#mainVisual .txt_wrap .tit{margin-bottom:30px;text-align:center}
#mainVisual .txt_wrap .txt{margin-bottom:30px;text-align:center;word-break:keep-all}
#mainVisual .bot_link{flex-direction:column}
#mainVisual .bot_link .btn{margin-bottom:20px;margin-right:0}
#mainVisual .main_prev{margin-right:10px}
}
@media (max-width:768px){
#mainVisual .inner{height:500px}
#mainVisual .txt_wrap .txt_inner,#mainVisual .list1 .list1_center{width:100%;padding:0 15px}
#mainVisual .txt_wrap .tit{font-size:35px}
#mainVisual .txt_wrap .txt{font-size:19px}
#mainVisual .bot_link .btn{width:145px;height:45px;line-height:45px;font-size:15px}
#mainVisual .bot_bar_inner > div{height:75px}
#mainVisual .bot_bar .left .phon{margin-right:15px}
#mainVisual .bot_bar .left .phon > .number{font-size:23px}
#mainVisual .bot_bar .left .phon > span{margin-right:20px;font-size:18px}
#mainVisual .bot_bar .right .bar_btn{font-size:17px}
}
@media (max-width:580px){
#mainVisual .inner{height:400px}
#mainVisual .txt_wrap .tit{margin-bottom:20px;font-size:23px}
#mainVisual .txt_wrap .txt{margin-bottom:20px;font-size:16px}
#mainVisual .bot_link .btn{width:125px;height:40px;line-height:40px;font-size:14px}
#mainVisual .main_arrow{width:45px;height:45px}
#mainVisual .bot_bar_inner > div{height:auto}
#mainVisual .bot_bar .left{flex-direction:column;padding:15px 0}
#mainVisual .bot_bar .left .phon{margin-bottom:10px;margin-right:0}
#mainVisual .bot_bar .left .phon > .number{font-size:18px}
#mainVisual .bot_bar .left .phon > span{font-size:16px}
#mainVisual .bot_bar .left .time{font-size:15px}
#mainVisual .bot_bar .right .bar_btn{padding:23px 0;font-size:15px}
}
@media (max-width:480px){
#mainVisual .inner{height:330px}
#mainVisual .txt_wrap .l_txt_box{top:60%;padding:0 15px}
#mainVisual .txt_wrap .tit{margin-bottom:15px;font-size:20px}
#mainVisual .txt_wrap .txt{line-height:1.3;margin-bottom:15px;font-size:15px}
#mainVisual .bot_link .btn{width:120px;margin-bottom:15px;font-size:13px}
#mainVisual .main_arrow{display:none}
#mainVisual .bot_bar .left .phon > .number{font-size:17px}
#mainVisual .bot_bar .left .phon > span{margin-right:10px}
#mainVisual .bot_bar .left .time{font-size:14px}
}
/* 반응형 [e] */
