@import url('sub.css'); 



/**** S:: Location ****/
.location_style{display: flex;}
.location_style article{box-sizing:border-box;}
.location_style .map_area{width: calc(100% - 465px);}
.location_style .map_area .wrap_map{width: 100%; height: 100% !important;}
.location_style .map_area .wrap_controllers{display: none !important;}
.location_style .map_area .map_border{display: none !important;}
.location_style .map_area .cont{display: none !important;}
.location_style .txt_area{width: 465px; background:var(--main); padding: 40px;}
.location_style .txt_area h3{color:var(--white); font-weight: 800;}
.location_style .txt_area h4{color:var(--white); padding: 10px 0 0; font-weight: 600;}
.location_style .txt_area .number{padding:30px 0 0;}
.location_style .txt_area .number ~ .number{padding: 15px 0 0;}
.location_style .txt_area .number dt{padding: 0 0 5px;}
.location_style .txt_area .number dt p{color:var(--white); font-weight: 700; line-height: 120%;}
.location_style .txt_area .number dd{display: flex; flex-wrap:wrap; gap:8px 15px;}
.location_style .txt_area .number dd p{color:var(--basicW); line-height: 140%;}
.location_style .txt_area .number dd b{font-weight: 700;}
.location_style .txt_area .btns{margin: 160px 0 0; padding: 30px 0 0; border-top: 1px solid rgba(255,255,255,.3); display: flex; gap:10px; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.location_style .txt_area .btns dt{}
.location_style .txt_area .btns dt p{color:var(--white);}
.location_style .txt_area .btns dd{display: flex; gap:1px;}
.location_style .txt_area .btns dd a{display: block; font-size:0; width:48px; background-color:var(--white); background-size:contain; background-position:center; background-repeat:no-repeat; transition:all .3s linear; aspect-ratio:1/1; box-sizing:border-box; border:2px solid var(--white);}
.location_style .txt_area .btns dd a:hover{background-color:rgba(255,255,255,.2);}
.location_style .txt_area .btns dd a.google_btn{background-image:url('/contact/img/google.png'); }
.location_style .txt_area .btns dd a.naver_btn{background-image:url('/contact/img/naver.png'); }
.location_style .txt_area .btns dd a.kakao_btn{background-image:url('/contact/img/kakao.png'); }

.contact_list{display: flex; flex-wrap:wrap; gap:20px;}
.contact_list li{width: calc((100% - 80px)/5); box-sizing:border-box; padding: 35px 140px 35px 40px; position: relative; border:1px solid var(--border);}
.contact_list li img{width: 70px; height: auto; position: absolute; right: 40px; top:50%; margin-top: -35px;}
.contact_list li h4{font-weight: 600; color:var(--black); line-height: 120%;}
.contact_list li p{padding-top: 10px; line-height: 120%;}

.overseas_cont{overflow: hidden;}
.overseas_style{}
.overseas_style .overseas_img{text-align:center; box-sizing:border-box;}
.overseas_style img{max-width:100%; height: auto;}
/**** E:: Location ****/









/**** S:: Contact ****/
.formTxt_in{max-width:775px;}

.contact_info{padding-top: 40px; margin-top: 40px; border-top:1px solid var(--border);}
.contact_info .in{background:url('/contact/img/contact_icon.png') no-repeat right center/ auto 100%;}
.contact_info h4{font-weight: 800;}
.contact_info address{font-weight: 600; color:var(--black); padding-top: 15px;}
.contact_info ul{padding-top: 8px; display: flex; gap:8px 15px; flex-wrap:wrap;}
.contact_info ul li{font-size:1rem; line-height: 140%;} 
.contact_info ul li b{font-weight: 700;}
.contact_info .btns{margin: 45px 0 0; padding: 15px 15px 15px 30px; box-sizing:border-box; background:var(--main); display: flex; gap:10px; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.contact_info .btns dt{}
.contact_info .btns dt p{color:var(--white); opacity: 0.8; padding: 0 !important;}
.contact_info .btns dd{display: flex; gap:1px;}
.contact_info .btns dd a{display: block; font-size:0; width:48px; background-color:var(--white); background-size:contain; background-position:center; background-repeat:no-repeat; transition:all .3s linear; aspect-ratio:1/1; box-sizing:border-box;}
.contact_info .btns dd a:hover{background-color:rgba(255,255,255,.3);}
.contact_info .btns dd a.google_btn{background-image:url('/contact/img/google.png'); }
.contact_info .btns dd a.naver_btn{background-image:url('/contact/img/naver.png'); }
.contact_info .btns dd a.kakao_btn{background-image:url('/contact/img/kakao.png'); }






.contact_cont{padding: 100px 0 160px;}
.contact_cont .subtitle{padding: 0 0 40px; text-align:center;}
.contact_cont .subtitle p{padding: 15px 0 0;}
.contact_cont .contact_box{padding: 40px; box-sizing:border-box; max-width:910px; margin: 0 auto; border-top: 1px solid var(--border);}
.contact_cont .contact_box img{width: 76px; height: auto; margin: 0 auto 22px; display: block;}
.contact_cont .contact_box a{display: inline-block; font-weight: 300; letter-spacing: 0; font-family:var(--eng); color:var(--black); line-height: 120%;}
.contact_cont .contact_box a b{font-weight: 800; display: inline; letter-spacing: inherit; line-height: inherit;}
/**** E:: Contact ****/





/*******************************************************************************
    @media 1800px
*******************************************************************************/
@media all and (max-width:1800px){

/**** S:: Location ****/

.contact_list li{padding: 35px 120px 35px 30px;}
.contact_list li img{right: 30px;}


.overseas_style .overseas_img{padding: 0 40px;}
/**** E:: Location ****/



}
/*******************************************************************************
    @media 1500px
*******************************************************************************/
@media all and (max-width:1500px){


/**** S:: Location ****/
.location_style{}
.location_style .map_area{width: 60%;}
.location_style .txt_area{width: 40%;}

.contact_list{gap:20px;}
.contact_list li{width: calc((100% - 40px)/3); padding: 35px 120px 35px 30px;}
/**** E:: Location ****/

}
/*******************************************************************************
    @media ~1300px
*******************************************************************************/
@media all and (max-width:1300px){



/**** S:: Contact ****/
.formTxt_in{max-width:100%;}
/**** E:: Contact ****/



}

/*******************************************************************************
    @media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){


/**** S:: Location ****/

.location_style{}
.location_style .txt_area{padding: 30px;}
.location_style .txt_area h4{padding: 6px 0 0;}
.location_style .txt_area .number{padding:20px 0 0;}
.location_style .txt_area .number ~ .number{padding: 10px 0 0;}
.location_style .txt_area .number dd{gap:5px 10px;}
.location_style .txt_area .btns{margin: 50px 0 0; padding: 20px 0 0; gap:5px;}
.location_style .txt_area .btns dd a{width:40px;}



.contact_list{gap:10px;}
.contact_list li{width: calc((100% - 20px)/3); padding: 25px 70px 25px 20px;}
.contact_list li img{width: 50px; right: 10px; margin-top: -25px;}
.contact_list li p{padding-top: 6px;}

.overseas_style .overseas_img{padding: 0 30px;}


/**** E:: Location ****/



/**** S:: Contact ****/
.contact_info{padding-top: 30px; margin-top: 30px;}
.contact_info address{padding-top: 10px;}
.contact_info ul{padding-top: 6px; gap:8px 10px;} 
.contact_info .btns{margin: 35px 0 0; padding: 10px 10px 10px 20px; gap:5px;}
.contact_info .btns dd a{width:40px;}


.contact_cont{padding: 80px 0 120px;}
.contact_cont .subtitle{padding: 0 0 30px;}
.contact_cont .subtitle p{padding: 10px 0 0;}
.contact_cont .contact_box{padding: 30px; width:80%;}
.contact_cont .contact_box img{width: 60px; height: auto;}
/**** E:: Contact ****/



}
/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){


/**** S:: Location ****/

.location_style{flex-wrap:wrap;}
.location_style .map_area{width: 100%;}
.location_style .map_area .wrap_map{height: 250px !important;}
.location_style .txt_area{width: 100%; padding: 20px;}
.location_style .txt_area .number{padding:10px 0 0;}
.location_style .txt_area .number ~ .number{padding: 5px 0 0;}
.location_style .txt_area .number dt{padding: 0 0 3px;}
.location_style .txt_area .btns{margin: 20px 0 0; padding: 10px 0 0;}


.contact_list{gap:5px;}
.contact_list li{width: 100%; padding: 15px 70px 15px 15px;}
.contact_list li img{width: 40px; margin-top: -20px;}


.overseas_style{position: relative; box-sizing:border-box; overflow-x: auto;}
.overseas_style .overseas_img{padding: 0 20px; width: 980px;}
.overseas_style .responsive-dim.show{display: block;}
/**** E:: Location ****/

/**** S:: Contact ****/
.contact_info .in{background-size:auto 80%;}
.contact_info{padding-top: 20px; margin-top: 20px;}
.contact_info address{padding-top: 6px;}
.contact_info .btns{margin:20px 0 0;}


.contact_cont{padding: 50px 0 80px;}
.contact_cont .subtitle{padding: 0 0 20px;}
.contact_cont .subtitle p{padding: 6px 0 0;}
.contact_cont .contact_box{padding: 20px; width:100%;}
.contact_cont .contact_box img{width: 50px; height: auto; margin: 0 auto 15px;}
/**** E:: Contact ****/

}