.sv {height: 400px; padding: 0 calc(190/1820*100%); box-sizing: border-box; display: flex; align-items: center; position: relative; background-repeat: no-repeat; background-size: cover; background-position: center center; border-radius: 20px; overflow: hidden;}
.sv .title {position: relative; z-index: 1;}
.sv .title > * {transform: translateX(-60px);}
.sv .title .korTit {font-size: 20px; letter-spacing: -0.045em; color: #fff; opacity: 0;}
.sv .title .engTit {font-size: 80px; letter-spacing: -0.02em; color: #fff; font-family: 'CreatoDisplay'; padding-top: calc(20/80*1em); opacity: 0;}

.yellowTag {font-size: 18px; letter-spacing: -0.02em; color: #ffce00; font-style: italic; font-family: 'CreatoDisplay'; font-weight: 500;}
.word .title { letter-spacing: -0.02em; color: #000; font-weight: bold; line-height: 1.6; word-break: keep-all;}
.word .title._50px {font-size: 50px;}
.word .yellowTag + .title { padding-top: calc(30/50*1em);}
.word .title span {color: hsl(240, 2%, 44%);}

.defaltBtn {cursor: pointer; overflow: hidden; border: 1px solid #000; outline: none; box-sizing: border-box; font-size: 18px; font-weight: 600; color: #000; letter-spacing: -0.02em; width: calc(147/18*1em); height: calc(50/18*1em); display: flex; align-items: center; justify-content: center; border-radius: 25px; background: #fff; position: relative; transition: .4s;}
.defaltBtn span {position: relative; z-index: 1;}
.defaltBtn::before {content: ''; display: block; width: 0; height: 100%; position: absolute; left: 0; top: 0; transition: .7s; background: var(--logo-color1);}
.defaltBtn:hover {color: #fff; border-color: #ffce00;}
.defaltBtn:hover::before {width: 100%;}

.page {display: flex; align-items: center; margin-top: 50px;}
.page > div {display: flex; align-items: center;}
.page > div a {font-size: 18px; letter-spacing: -0.02em; color: #000; border-radius: 50%; width: calc(29/18*1em); height: calc(29/18*1em); display: flex; align-items: center; justify-content: center; transition: .4s;}
.page > div:not(.max) a:hover,
.page > div:not(.max) a.act {background: #ffce00; color: #fff;}
.page > div a+a {margin-left: calc(10/18*1em);}
.page > .num {margin: 0 10px;}
.page > div:not(.num) a+a {margin-left: calc(5/18*1em);}
.page > div:not(.num).max a {color: #9293a3}

.selectBox {cursor: pointer; display: flex; align-items: center; background: #fff; font-size: 16px;}
.selectBox input {cursor: pointer; color: inherit; z-index: 1; width: 100%; border: none; outline: none; background: transparent; font-size: inherit;}
.selectBox .optWrap {display: none; z-index: 11; position: absolute; top: 100%; left: 0; width: 100%; padding-top: 5px;}
.selectBox ul { border-radius: 12px; overflow: hidden; border: 1px solid #d3d2d2;}
.selectBox ul li {background: #ffffff; cursor: pointer; transition: .6s;}
.selectBox ul li:hover {background: #ddd; color: #444;}
.selectBox ul li span {display: block; padding: 5px calc(20/18*1em);}
.selectBox ul li+li span { border-top: 1px solid #d3d2d2;}

 
 
@media screen and (max-width: 1280px) {
    .sv {padding: 0 calc(100/1820*100%); height: 280px;}
    .sv .title .engTit {font-size: 70px;}
    .word .title._50px {font-size: 42px;}
}
@media screen and (max-width: 1024px) {
    .sv {height: 250px;}
    .sv .title .korTit {font-size: 18px;}
    .sv .title .engTit {font-size: 60px;}

    .defaltBtn {font-size: 16px;}
    .word .title._50px {font-size: 36px;}

 
}
@media screen and (max-width: 820px) {
    .sv {height: 230px; padding: 0 calc(100/1820*100%);}
    .sv .title .korTit {font-size: 16px;}
    .sv .title .engTit {font-size: 46px;}

    .yellowTag {font-size: 16px;}
    .word .title._50px {font-size: 32px;}
    .word .yellowTag + .title { padding-top: 10px;}

    .page {margin-top: 30px;}
    .page > div a {font-size: 16px;}
 
}
@media screen and (max-width: 500px) {
    .sv {height: 100px; padding: 0 calc(100/1820*100%);}
    .sv .title .korTit {font-size: 14px;}
    .sv .title .engTit {font-size: 27px;}

    .yellowTag {font-size: 14px;}
    .word .title._50px {font-size: 22px;}

    .defaltBtn {font-size: 14px;}

    .page > div a {font-size: 14px;}

    .bannerSec {height: 300px;}
    .bannerSec .bottomBanner {padding: 30px;}
    .bannerSec .bottomBanner .txt > p {font-size: 16px;}
    .bannerSec .bottomBanner .btnWrap {flex-direction: column;}
    .bannerSec .bottomBanner .btnWrap > *+* {margin-left: 0; margin-top: 10px;}
}








/** **/
.contact_cont section {padding-top: 95px;}

.contact_cont .s1 .form {padding-top: 140px;}
.contact_cont .s1 .form .line {width: 100%;}
.contact_cont .s1 .form .line+.line {margin-top: 25px;}
.contact_cont .s1 .form .line.flx {display: flex; align-items: center; justify-content: space-between;}
.contact_cont .s1 .form .line .field {display: flex; flex-direction: column; width: 100%;}
.contact_cont .s1 .form .line.flx .field {width: calc(100% / 2 - 55px / 2);}
.contact_cont .s1 .form .line .field .label {display: inline-block; padding: calc(20/18*1em); font-size: 18px; letter-spacing: -0.02em; color: #000000; font-weight: 600; box-sizing: border-box;}
.contact_cont .s1 .form .line .field .label small {display: inline-block; font-size: 14px; letter-spacing: -0.02em; font-weight: 300; color: #ff0000; padding: 5px; box-sizing: border-box;}

.contact_cont .s1 .form .line .field .inputBox {display: flex; align-items: center; position: relative;  font-size: 18px; font-weight: 500; color: #848484; box-sizing: border-box; background: #ecedf1; border-radius: 12px; --labelHeight: 60px; width: 100%; height: var(--labelHeight);}
.contact_cont .s1 .form .line .field .inputBox.textarea {height: 300px; padding: calc(20/18*1em) 0;}
.contact_cont .s1 .form .line .field .inputBox input,
.contact_cont .s1 .form .line .field .inputBox textarea {resize: none; border: none; outline: none; display: block; width: 100%; height: 100%; background: transparent; font: inherit; color: inherit; letter-spacing: inherit; padding: 0 calc(20/18*1em);}
.contact_cont .s1 .form .line .field .inputBox > i {padding: 0 30px;}

.contact_cont .s1 .btnWrap {padding-top: 10px; display: flex; justify-content: flex-end;}

.contact_cont .s2 {padding-top: 150px; padding-bottom: 200px;}
.contact_cont .s2 .word p {padding-top: 0; padding-bottom: 40px;}
.contact_cont .s2 .flx {display: flex; align-items: center; justify-content: space-between;}
.contact_cont .s2 .flx .info {padding-right: 45px;}
.contact_cont .s2 .flx .info .topblank {padding-top: 30px;}
.contact_cont .s2 .flx .info dl {display: flex; line-height: 1.9; font-size: 18px; letter-spacing: -0.02em;}
.contact_cont .s2 .flx .info dl dt {width: 160px; color: #9f9f9f;}
.contact_cont .s2 .flx .info dl dd {color: #000;}
.contact_cont .s2 .flx .info dl dd .br820 {display: none;}

.contact_cont .s2 .flx .mapWrap {max-width: calc(780/1440*100%); width: 100%; height: 460px; border-radius: 48px; overflow: hidden;}
.contact_cont .s2 .flx .mapWrap > div {width: 100%; height: 100%;;}
.contact_cont .s2 .flx .mapWrap .root_daum_roughmap .wrap_map {height: 100%;}
.contact_cont .s2 .flx .mapWrap .root_daum_roughmap .wrap_controllers {display: none;}

@media screen and (max-width: 1280px) {
    .contact_cont .s1 .form {padding-top: 100px;}

    .contact_cont .s2 {padding-top: 120px; padding-bottom: 140px;}
    .contact_cont .s2 .flx .info dl dt {width: 130px;}
}
@media screen and (max-width: 1024px) {
    .contact_cont section {padding-top: 55px;}

    .contact_cont .s1 .form {padding-top: 40px;}
    .contact_cont .s1 .form .line .field .label {padding: 10px;}
    .contact_cont .s1 .form .line .field .inputBox {--labelHeight: 50px}
    .contact_cont .s1 .form .line .field .inputBox.textarea {height: 230px;}

    .contact_cont .s2 {padding-top: 80px; padding-bottom: 100px;}
    .contact_cont .s2 .flx {flex-direction: column-reverse;}
    .contact_cont .s2 .flx .mapWrap {max-width: none; width: 80%;}
    .contact_cont .s2 .flx .info {padding-right: 0; padding-top: 20px;}
    .contact_cont .s2 .flx .info dl { flex-direction: column; align-items: center; text-align: center;}
    .contact_cont .s2 .flx .info .topblank {width: 100%; display: flex; flex-wrap: wrap;}
    .contact_cont .s2 .flx .info .topblank dl {width: 50%;}
}
@media screen and (max-width: 820px) {
    .contact_cont .s1 .form .line+.line {margin-top: 15px;}
    .contact_cont .s1 .form .line.flx {flex-direction: column;}
    .contact_cont .s1 .form .line.flx .field {width: 100%;}
    .contact_cont .s1 .form .line.flx .field+.field {margin-top: 15px;}
    .contact_cont .s1 .form .line .field .label {font-size: 16px;}
    .contact_cont .s1 .form .line .field .inputBox {font-size: 16px; --labelHeight: 40px}
    .contact_cont .s1 .form .line .field .inputBox > i {padding: 0 15px;}
    
    .contact_cont .s2 .flx .info dl {font-size: 16px;}
    .contact_cont .s2 .flx .info dl dd .br820 {display: block;}
    .contact_cont .s2 .flx .mapWrap {height: 400px; width: 100%;}
}
@media screen and (max-width: 500px) {
    .contact_cont section {padding-top: 35px;}

    .contact_cont .s1 .form {padding-top: 20px;}
    .contact_cont .s1 .form .line+.line {margin-top: 10px;}
    .contact_cont .s1 .form .line.flx .field+.field {margin-top: 10px;}
    .contact_cont .s1 .form .line .field .label {font-size: 14px; padding: 5px 0;}
    .contact_cont .s1 .form .line .field .inputBox {font-size: 14px;}
    .contact_cont .s1 .form .line .field .inputBox.textarea {height: 120px;}
    .contact_cont .s1 .btnWrap {text-align: center; margin-top: 20px;}

    .contact_cont .s2 {padding-top: 50px;}
    .contact_cont .s2 .flx .mapWrap {height: 280px;}
    .contact_cont .s2 .flx .info dl {font-size: 14px;}
    .contact_cont .s2 .flx .info .topblank {flex-direction: column;}
    .contact_cont .s2 .flx .info .topblank dl {width: 100%;}
}

.chkbx {position: relative;}
.chkbx input {display: none;}
.chkbx label { display: flex; align-items: center; font-size: 16px; letter-spacing: -0.02em; color: #000;}
.chkbx label span {padding-left: calc(10/16*1em); display: inline-block;}
.chkbx label .checkIcon {cursor: pointer; width: 20px; height: 20px; border: 1px solid #000; display: flex; align-items: center; justify-content: center;}
.chkbx label .checkIcon i {opacity: 0;}
.chkbx input:checked + label .checkIcon i {opacity: 1;}
.chkbx label small {cursor: pointer;}

@media screen and (max-width: 820px) {
    .chkbx label .checkIcon {width: 15px; height: 15px;}
    .chkbx label {font-size: 14px;}
}
@media screen and (max-width: 500px) {
    .chkbx label .checkIcon {width: 10px; height: 10px;}
    .chkbx label {font-size: 12px;}
}


._contact._complete {padding-top: 0 !important;}
._contact._complete .cont .wrap {height: 90vh; display: flex; align-items: center; justify-content: center;}
._contact._complete .cont .box {display: flex; flex-direction: column; align-items: center;}
._contact._complete .cont .box .icon {width: 47.5px; height: 47.5px; display: flex; align-items: center; justify-content: center; background: #ffc000; color: #fff; font-size: 24px; border-radius: 50%;}
._contact._complete .cont .box .bold {font-size: 38px; letter-spacing: -0.019em; color: #101011; font-weight: bold; padding: calc(25/38*1em);}
._contact._complete .cont .box .small {font-size: 20px; letter-spacing: -0.019em; color: #8c8e91; word-break: keep-all; text-align: center; line-height: 1.3;}
._contact._complete .cont .box .defaltBtn {margin-top: 50px;}

@media screen and (max-width: 1024px) {
    ._contact._complete .cont .box .icon {width: 40px; height: 40px;;}
    ._contact._complete .cont .box .bold {font-size: 32px;}
    ._contact._complete .cont .box .small {font-size: 18px;}
    ._contact._complete .cont .box .defaltBtn {margin-top: 40px;}
}
@media screen and (max-width: 500px) {
    ._contact._complete .cont .box .bold {font-size: 22px;}
    ._contact._complete .cont .box .small {font-size: 16px;}
    ._contact._complete .cont .box .defaltBtn {margin-top: 30px;}
}