/* 
---------------------------------------------
Contact
--------------------------------------------- 
*/
.header-area .main-nav .nav li a { color: #787878; }
.main-banner-box { height: 281.75px; background: rgba(154, 154, 154, 0.2); }
.section { padding-bottom: 323.44px; background: rgba(154, 154, 154, 0.2); }
.section .container { display: flex; flex-direction: row; }
.section .container .box-area { flex: 1 1 0; }
.section .container .box-area .title-box { margin-bottom: 141.75px; }
.section .container .box-area .title-box > p.title { font-family: GT Walsheim Trial; font-size: 56px; font-weight: 500; line-height: 64.12px; margin-bottom: 14px; }
.section .container .box-area .title-box > p.description { font-family: IBM Plex Sans KR; font-size: 17.5px; font-weight: 400; line-height: 26.25px; }
.section .container .box-area .info-box > div.bar { height: 22px; margin-bottom: 18px; }
.section .container .box-area .info-box > div.bar > span.column { font-family: GT Walsheim Trial; font-size: 20px; font-weight: 700; line-height: 22.9px; color: #898989; display: inline-block; width: 82px; margin-right: 22px; }
.section .container .box-area .info-box > div.bar > span.val { font-family: IBM Plex Sans KR; font-size: 16px; line-height: 24px; font-weight: 500; color: #000000; }
.section .container .box-area .ask-box { margin-top: 72.625px; }
.section .container .box-area .ask-box .input-box { margin-bottom: 30.625px; }
.section .container .box-area .ask-box .input-box > p.column { font-family: IBM Plex Sans KR; font-size: 17.5px; line-height: 26.25px; margin-bottom: 8px; font-weight: 500; color: #545454; }
.section .container .box-area .ask-box .input-box .underline { height: 40px; width: 100%; font-family: IBM Plex Sans KR; border: none; border-bottom: 2px solid #000000; background: rgba(0, 0, 0, 0); padding-left: 10px; }
.section .container .box-area .ask-box .input-box > input.text::placeholder { font-size: 16px; font-weight: 300; line-height: 24px; }
.section .container .box-area .ask-box .input-box > textarea.ask { resize: none; }
.section .container .box-area .ask-box .check-box { margin-bottom: 70.525px; }
.section .container .box-area .ask-box .check-box #check { width: 22px; height: 22px; border-radius: 2px; border: 2px solid #A7A7A7; appearance: none; }
.section .container .box-area .ask-box .check-box #check:not(:checked) { background-color: rgba(0, 0, 0, 0); }
.section .container .box-area .ask-box .check-box #check:checked { appearance: revert; accent-color: #0442BC; }
.section .container .box-area .ask-box .check-box > label { font-family: IBM Plex Sans KR; font-size: 16px; line-height: 24px; font-weight: 500; color: #9D9D9D; vertical-align: 6px; margin-left: 9px; }
.section .container .box-area .ask-box .check-box #check:hover { cursor: pointer; }
.section .container .box-area .ask-box .check-box > label:hover { cursor: pointer; }
.section .container .box-area .ask-box .submit-box { text-align: center; }

.submit-btn { width: 187.25px; font-family: IBM Plex Sans KR; color: #fff; border-radius: 50px; font-weight: 500; background: #2D7DF1; cursor: pointer; transition: all 0.3s ease; position: relative; display: inline-block; outline: none; }
.submit-btn:focus { outline: none; }
.submit-btn span { font-size: 20px; line-height: 31.5px; padding: 14px 0px; }
.btn-anim { width: 187.25px; line-height: 42px; padding: 0; border: none; }
.btn-anim span { position: relative; display: block; width: 100%; height: 100%; }
.btn-anim:before,
.btn-anim:after { background: #2D7DF1; position: absolute; content: ""; right: 0; top: 0; transition: all 0.3s ease; }
.btn-anim:before { height: 0%; width: 2px; }
.btn-anim:after { width: 0%; height: 2px; }
.btn-anim:hover { background: transparent; box-shadow: none; }
.btn-anim:hover:before { height: 100%; }
.btn-anim:hover:after { width: 100%; }
.btn-anim span:hover { color: #2D7DF1; }
.btn-anim span:before,
.btn-anim span:after { background: #2D7DF1; border-radius: 50px; position: absolute; content: ""; left: 0; bottom: 0; transition: all 0.3s ease; }
.btn-anim span:before { width: 2px; height: 0%; }
.btn-anim span:after { width: 0%; height: 2px; }
.btn-anim span:hover:before { height: 100%; }
.btn-anim span:hover:after { width: 100%; }

/* 
---------------------------------------------
responsive
--------------------------------------------- 
*/
@media (max-width: 1299px) {
}

@media (max-width: 1199px) {
    .main-banner-box { height: 250px; }
    .section .container .box-area .title-box { margin-bottom: 125px; }
    .section .container .box-area .title-box > p.title { font-size: 50px; }
    .section .container .box-area .title-box > p.description { font-size: 15.6px; }
    .section .container .box-area .ask-box .input-box > p.column { font-size: 15.6px; }
    .section .container .box-area .info-box > div.bar { margin-bottom: 14.5px; }
    .section .container .box-area .info-box > div.bar > span.val { font-size: 14.3px; }
    .section .container .box-area .info-box > div.bar > span.column { font-size: 17.86px }
    .section .container .box-area .ask-box .input-box { margin-bottom: 25px; }
    .section .container .box-area .ask-box .input-box > p.column { font-size: 14px; margin-bottom: 4px; }
    .submit-btn { width: 125px; }
    .submit-btn span { font-size: 17px; line-height: 18px; padding: 15px 0px; }    
}

@media (max-width: 991px) {
    .section .container .box-area { flex: none; }
    .section .container .box-area.ask { flex-grow: 1; margin-left: 30px; }
    .section .container .box-area .title-box > p.title { font-size: 40px; }
    .section .container .box-area .title-box > p.description{ font-size: 14px; line-height: 22.25px }
    .section .container .box-area .info-box > div.bar > span.column { font-size: 16px; margin-right: 0px; }
    .section .container .box-area .info-box > div.bar > span.val { font-size: 13px; }
    .section .container .box-area .ask-box .check-box #check { width: 18px; height: 18px; }
    .section .container .box-area .ask-box .check-box > label { font-size: 13px; vertical-align: 4px; margin-left: 6px; }
    .section .container .box-area .ask-box .check-box { margin-bottom: 63px; }
    .submit-btn span { font-size: 15.5px; }
}

@media (max-width: 767px) {
    .main-banner-box { height: 32vw; }
    .section { padding-bottom: 30vw }
    .section .container { flex-direction: column; }
    .section .container .box-area .title-box { margin-bottom: 15vw; }
    .section .container .box-area .title-box > p.title { font-size: 5.7vw; margin-bottom: 3.5vw; line-height: 6.5265vw; }
    .section .container .box-area .title-box > p.description { font-size: 2.3vw; line-height: 3.6vw; }
    .section .container .box-area .info-box > div.bar > span.column { font-size: 2.5vw; margin-right: 1.8vw; }
    .section .container .box-area .info-box > div.bar > span.val { font-size: 2.1vw; }
    .section .container .box-area.ask { margin-left: 0; }
    .section .container .box-area .ask-box { margin-top: 15vw; }    
}

@media (max-width: 575px) {
    .container { padding-left: 30px; padding-right: 30px; }
    .main-banner-box { height: 50vw; }
    .section .container .box-area .title-box > p.title { font-size: 7vw; margin-bottom: 5.5vw; }
    .section .container .box-area .title-box > p.description { font-size: 3.2vw; line-height: 5.6vw; }
    .section .container .box-area .info-box > div.bar { margin-bottom: 7.5px; }
    .section .container .box-area .info-box > div.bar > span.column { font-size: 3.5vw; width: 64px; }
    .section .container .box-area .info-box > div.bar > span.val { font-size: 2.9vw; }
}