@charset "utf-8";
/* CSS Document */

@media all and (max-width:1300px){
#pop_12{left: 50% !important; transform: translateX(-44%) !important;}
#pop_11{left: 50% !important; transform: translateX(60%) !important;}
}
@media all and (max-width:1180px){
.imgW {top: -25%; left: -31%;}
.imgW .Pimg {width: 40%;}
}
@media all and (max-width:1140px){
#pop_12{left: 50% !important; transform: translateX(-70%) !important;}
#pop_11{left: 50% !important; transform: translateX(30%) !important; }

.car_info_area {width: 96%;}
}
@media all and (max-width:970px){
.main_stats_wrap2 {height: 75vh;}

.main_stats_wrap2 .list {width: auto;background-color: transparent;position: absolute;top: 57%;right: 0;display: flex;    transform: translate(60%, -49%); flex-wrap: wrap;}
.main_stats_wrap2 .list > li{width: 100%;}
.main_stats_wrap2 .list > li .in {border-radius: 100%;text-align: center;margin: 10px 20px;font-size: 1.1em;position: relative;}
.main_stats_wrap2 .list > li .in::before {width: 0;}
.main_stats_wrap2 .list > li .in .tbox {background: #666;color: #fff;border-radius: 50%;width: 10em;height: 10em;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.imgW {top: -45%; left: -27%;}
.imgW .Pimg {width: 72%;}
.txtW {top: -14%; right: -22%; text-align: center !important;}
}
@media all and (max-width:920px){
#pop_12{left: 50% !important; transform: translateX(-90%) !important;}
#pop_11{left: 50% !important; transform: translateX(10%) !important; }
.car_view_wrap .car_title {font-size: 3.5em;}

.form_st .inp_list > li .in .inp_wrap .inp.w1 {
    width: 160px;
}
}
@media all and (max-width:820px){
.box1{width: 96%;}
.l-nav-open .l-wrapper{position: relative;}
.l-nav-open .l-wrapper::before {content: ""; position: absolute; width: 100%; height: 100vh;background-color: black; opacity: .65; z-index: 5;}
.l-nav-open .l-wrapper::after {content: ""; position: absolute; width: 100%; height: 100%;background-image:url(../images/main/car_bg.jpg); background-repeat: no-repeat;    opacity: .3; background-position: 50% 50%;background-size: cover;}
html.l-nav-open .l-main { transform: unset; z-index: 3; position: relative;}

html.l-nav-open .l-nav {z-index: 111;}
.main_inquiry_wrap{display: flex; flex-direction: column;}
.main_inquiry_wrap > li.sec_w1,
.main_inquiry_wrap > li.sec_w2,
.main_inquiry_wrap > li.sec_w3 {width: 100%;}

.main_con.mainSection.st1{margin-bottom: 3em;}

.main_benefit_wrap2{flex-wrap: wrap; gap: 1em;}
.main_benefit_wrap2 > li {width: 45%; margin: 1em;}

#pop_12{left: 50% !important; transform: translateX(-50%) !important;}
#pop_11{left: 50% !important; transform: translateX(-50%) !important; top: 550px !important;}

.main_stats_wrap2 {height: 65vh;}
.main_stats_wrap2 .list {top: 52%;}
.main_stats_wrap2 .list > li .in {border-radius: 100%;text-align: center;margin: 10px 20px;font-size: 1em;position: relative;}
.main_stats_wrap2 .list > li .in .tbox {background: #666;color: #fff;border-radius: 50%;width: 9em;height: 9em;}

.txtW > .tit { font-size: 2em;}
.txtW > .tit2 {font-size: 1.25em;}

.main_stats_wrap2 .list > li .in .no {font-size: 1.55em;}
/*inc*/
.page_tit {font-size: 2.2em;}


/*상세페이지*/
.car_info_area .btn_area {margin-top: 20px;overflow: hidden;display: flex;flex-wrap: wrap;justify-content: center; align-items: center;}
.car_info_area .btn_area button {width: 49%;padding: 8px 15px; margin-right: 0; border-right: .5px solid #aaa;  border-bottom: .5px solid #aaa;}
}
@media all and (max-width:768px){
.st2.main_visual .main_slogan {top:1px;}
.imgW .Pimg {width: 80%;}
.main_stats_wrap2 .list > li .in .tbox {width: 8em;height: 8em;}
.main_stats_wrap2 .list > li .in .no {font-size: 1.35em;}
.main_con {padding: 40px 0 0 0;}
.main_stats_wrap2 .list {top: 57%;}
.txtW {top: -2%;}

.form_st .inp_list > li.sec2 { width: 100%;}
}

@media all and (max-width:720px){
.imgW .Pimg {width: 80%;}
}

@media all and (max-width:700px){

.car_l_list ul li {width: 24.66%;}
.Car_ul {margin: -40px -5px 0 0;}
.car_view_wrap .car_title {font-size: 2.5em;}

.main_benefit_wrap2 > li {width: 44%; margin: 1em;}
/*inc*/
.st2.main_visual .main_slogan .t4 {font-size: 2.3em;}
.main_con { padding: 40px 0 0 0;}
}
@media all and (max-width:650px){
    

.main_stats_wrap2 .list > li .in .no {font-size: 1.25em;}
.main_stats_wrap2 .list > li .in .tbox {width: 8em;height: 8em;}
.imgW {top: -25%;left: -26%;}
.main_stats_wrap2 .list {top: 58%;}
.main_stats_wrap2 .list > li .in {margin: 5px 20px;}
}
@media all and (max-width:600px){
.imgW .Pimg {width: 85%;}
.main_stats_wrap2 .list {right: 23px;}
.main_stats_wrap2 .list > li .in .tbox {width: 7.5em;height: 7.5em;}
.main_stats_wrap2 .list > li .in .no {font-size: 1.05em;}
.txtW {top: 1%;}
.txtW > .tit {font-size: 3.5vmin;}
.txtW > .tit2 {font-size: 2.5vmin;}

}
@media all and (max-width:550px){
body{font-size: 14px;}
.car_list2{display: flex; flex-wrap: wrap;} 
.car_list2 > li {width: 100%;}
.board_gallery.st1{display: flex; flex-wrap: wrap;}
.board_gallery.st1 > li {width: 100% !important;}

.page_goods_info .m_goods > li{width: 25% !important;}

#contents .sub_gnb .gnb .dp2 > li {font-size: 12px;}
.car_view_wrap .img_area img{margin-left: -145px !important;} 

.main_benefit_wrap2 > li {width: 42%; margin: 1em;}
.main_benefit_wrap2 > li .tt {font-size: 1.48em;}
.main_stats_wrap2 .list > li .in .tbox {width: 7em;height: 7em;}
.txtW {gap:1em; top: 7%;}
.imgW .Pimg {width: 90%;}


.icon_imgS { width: 6.6em; height: 6em; background-size: contain;}
.icon_imgL {width: 13em;height: 6em;}
.form_st {padding: 30px 22px;}

.main_stats_wrap2 .list > li .in .tit {font-size: 2.3vmin;}
/* more*/
.main_tit .tbox .more {position: absolute;right: 8px;top: 14px;width: 20px;height: 20px;line-height: 35px;text-align: center;background: #fff;color: #aaa;border: 1px solid #ddd;transform: rotate(45deg);transition: .3s;display: flex; align-items: center;justify-content: center;}
/*inc*/
.st2.main_visual .main_slogan .t4 {font-size: 2em;}

iframe{width: 380px !important;}
}
@media all and (max-width:500px){
.main_benefit_wrap2 > li .in {min-height: 14.5em;max-height: 10em;}
.main_benefit_wrap2 > li .tt {font-size: 4.5vmin;}
.icon_imgS {width: 6.3em;}
.icon_imgM {width: 7.5em;height: 6em;}
.icon_imgL {width: 12em;}

.main_stats_wrap2 {height: 55vh;}
.form_st .inp_list > li * {font-size: .95em;}
}
@media all and (max-width:450px){
.st2.main_visual .main_slogan .t3 {font-size: 1.3em;}
.st2.main_visual .main_slogan .t4 {font-size: 1.8em;}

.main_stats_wrap2 {height: 50vh;}
.main_stats_wrap2 .list > li .in .tbox {width: 6em;height: 6em;}
.main_tit .tbox .more {position: absolute;right: 8px;top: 16px;width: 15px;height: 15px;line-height: 35px;text-align: center;background: #fff;color: #aaa;border: 1px solid #ddd;transform: rotate(45deg);transition: .3s;display: flex; align-items: center;justify-content: center;}
.main_tit .tbox .more .xi {font-size: .985em;}
/*inc*/
.page_tit {font-size: 2em;}
.tit_b {font-size: 1.675em;}
.car_info_area .btn_area button {font-size: .75em;}

 iframe{width: 350px !important;}

 .form_st .inp_list > li .in .tit_wrap {width: 110px;}
 .form_st .inp_list > li .in .inp_wrap {margin-left: 114px;}
 .form_st .inp_list > li .in .inp_wrap .inp.w3 {width: 135px;}

}
@media all and (max-width:420px){    
.main_benefit_wrap2 > li {width: 46%;margin: .5em;}
.main_stats_wrap2 .list > li .in .tbox {width: 5em;height: 5em;}
.main_stats_wrap2 .list > li .in .no {font-size: 2.5vmin;}

.main_stats_wrap2 {height: 40vh;}
.imgW {top: -39%;left: -25%;}
.txtW {top: -2%;}
.main_stats_wrap2 .list {top: 53%; right:14px;}
.form_st {padding: 30px 15px;}
.form_st .inp_list > li .in .inp_wrap .inp.w1 { width: 140px;}
}
@media all and (max-width:400px){
.main_benefit_wrap2 > li {width: 44%;margin: .5em;}
.main_benefit_wrap2 > li .in {min-height: 11.5em;max-height: 10em; padding: 1em .5em;}
.icon_imgS {width: 5.3em;}
.icon_imgM {width: 6.5em;height: 5.5em;}
.icon_imgL {width: 10em;}

.main_stats_wrap2 {height: 35vh;}
.main_stats_wrap2 .list > li .in .tbox {width: 4.5em;height: 4.5em;}

@media screen and  (max-height:790px){
.imgW {top: -47%; left: -25%;}
.txtW {top: -4%;}
.main_stats_wrap2 .list { top: 55%;right: 14px;}
}
}    