@import url('sub.css'); 

.inquiry {position:relative; display:flex; flex-wrap:wrap; gap:0 40px; justify-content:space-between; width:100%;}
.inquiry_tit {position:relative; width:490px;}
.inquiry_tit_wrap {position:sticky; top: 20px;}
.inquiry_tit h3 {margin-bottom:30px; color:var(--black);}
.inquiry_tit h3 span {display:block; letter-spacing:inherit; line-height:inherit;}
.inquiry_tit .fs20 {margin-bottom:20px; font-weight:600; color:var(--black);}
.inquiry_tit .contact_info li {display:flex; flex-direction:column; flex-wrap:wrap;  gap:3px 0;}
.inquiry_tit .contact_info li + li {margin-top:10px;}
.inquiry_tit .contact_info li strong {position:relative; display:flex; color:var(--black); letter-spacing:inherit; line-height:inherit;}
.inquiry_tit .contact_info li p {width:100%;}
.inquiry_tit .contact_info li strong::before {font-family:var(--icon); font-size:24px; color:var(--main); margin-right:5px; line-height:1; font-weight:400;}
.inquiry_tit .contact_info li.phone strong::before {content:"phone_in_talk";}
.inquiry_tit .contact_info li.email strong::before {content:"\e158";}

.inquiry .inquiry_form {width:calc(100% - 490px - 40px); max-width:1030px;}


/*******************************************************************************
    @media ~ 1350px
*******************************************************************************/
@media all and (max-width:1350px) {

.inquiry {gap:35px 0;}
.inquiry_tit {width:100%; text-align:center;}
.inquiry_tit h3 {margin-bottom:20px;}
.inquiry_tit h3 span {display:inline-block;}
.inquiry_tit h3 br {display:none;}
.inquiry_tit .fs20 {margin-bottom:20px;}
.inquiry_tit .contact_info {padding:25px 20px; box-sizing:border-box; background:var(--grayBg); display:flex; align-items:center; justify-content:center; gap:0 30px;}
.inquiry_tit .contact_info li {flex-direction:row; gap:0 10px; align-items:center;}
.inquiry_tit .contact_info li + li {margin-top:0;}
.inquiry_tit .contact_info li strong { align-items:center;}
.inquiry_tit .contact_info li strong::before {font-size: 23px;}
.inquiry_tit .contact_info li p {width:auto;}
.inquiry .inquiry_form {width:100%; max-width:100%;}

}


/*******************************************************************************
    @media ~ 1350px
*******************************************************************************/
@media all and (max-width:1030px) {

.inquiry_tit .contact_info {flex-direction:column; gap:5px 0;}

}


/*******************************************************************************
    @media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){

.inquiry {gap:30px 0;}
.inquiry_tit h3 {margin-bottom:15px;}
.inquiry_tit .contact_info {padding:20px 15px; gap:0 25px;}
.inquiry_tit .contact_info li {gap: 0 10px;}
.inquiry_tit .contact_info li strong::before {font-size: 20px;}

}


/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){

.inquiry_tit h3 {margin-bottom:10px;}
.inquiry_tit .fs20 {margin-bottom:15px;}
.inquiry_tit .contact_info {gap:5px 0; flex-direction:column;}
.inquiry_tit .contact_info li strong::before {font-size: 20px;}

}


/*******************************************************************************
    @media ~480px             
*******************************************************************************/
@media all and (max-width:480px){

.inquiry_tit .contact_info {gap:10px 0;}
.inquiry_tit .contact_info li {flex-direction:column; gap:3px 0; align-items: center;}
.inquiry_tit .contact_info li strong::before {font-size: 18px;}


}