
._contact .s1{padding: 110px 0;box-sizing: border-box;}

@media screen and (max-width:1024px) {._contact .s1{padding: 80px 0;}}
@media screen and (max-width:820px) {._contact .s1{padding: 60px 0;}}
@media screen and (max-width:500px) {._contact .s1{padding: 40px 0;}}


._contact ._cont {width: 100%;display: flex;justify-content: space-between;}

._contact ._cont .left{display: flex;flex-direction: column; justify-content: space-between;gap: 140px;}
._contact ._cont .left .tit{}
._contact ._cont .left .tit h3{font-size: 30px;font-weight: 700;color: #fff;line-height: 1.2;}
._contact ._cont .left .tit small{font-size: 20px;font-weight: 300;color: #aaaaaa;display: block;padding-top: 20px;line-height: 1.5;font-weight: 400;}
._contact ._cont .left .info{display: flex;flex-direction: column;gap: 35px;}
._contact ._cont .left .info .row{}
._contact ._cont .left .info .row > div{color: #fff;display: flex;align-items: flex-start;gap: 20px;}
._contact ._cont .left .info .row > div i{font-size: 26px;}
._contact ._cont .left .info .row > div p{display: flex;flex-direction: column;gap: 15px;}
._contact ._cont .left .info .row > div b{font-size: 18px;font-weight: 700;}
._contact ._cont .left .info .row > div span{font-size: 16px;color: #aaaaaa;line-height: 1.3;}

._contact ._cont .right{max-width: 800px;width: 100%;}
._contact ._cont .right .formBx{display: flex;flex-direction: column;gap: 40px;}
._contact ._cont .right .formBx .row > div{width: 100%;}
._contact ._cont .right .formBx .row._flx{display: flex;align-items: center;gap: 30px;}
._contact ._cont .right .formBx .row label{}
._contact ._cont .right .formBx .row label textarea{width: 100%;padding: 15px;box-sizing: border-box;background-color: #000;border: 1px solid #333333; border-radius: 10px;color: #cccccc;font-size: 16px;font-weight: 500;min-height: 170px;resize: none;}
._contact ._cont .right .formBx .row label input{width: 100%;padding: 0 5px 10px 5px;box-sizing: border-box;background-color: #000;border: none;border-bottom: 1px solid #333333;color: #cccccc;font-size: 16px;font-weight: 500;}
._contact ._cont .right .formBx .row h4{font-size: 18px;font-weight: 700;color: #fff;margin-bottom: 15px;}
._contact ._cont .right .formBx .row h4:after{content: '*';color: var(--red);font-size: inherit;font-weight: 600;display: inline-block;margin-left: .3em;}
._contact ._cont .right .formBx .row label .flxBx{}

._contact ._cont .right .checkBx .row .uploadType .radio_pill {display: flex;gap: 4px;align-items: center;}
._contact ._cont .right .checkBx .row .uploadType i {font-size: 20px;color: #fff;line-height: 1.3;}
._contact ._cont .right .checkBx .row .uploadType span {font-size: 16px;font-weight: 400;color: rgba(255, 255, 255, 0.3);line-height: 1.3;}
#personal:checked + .radio_pill i::before {content: "\e9c7";color: #fff;}

._contact ._cont .right .submitBx{display: flex;justify-content: flex-end;padding-top: 40px;}
._contact ._cont .right .submitBx a{display: flex;align-items: center;justify-content: center;width: 100%;border-radius: 10px;background-color: #333333;color: #fff;font-size: 18px;font-weight: 700;cursor: pointer;padding: 20px 0;box-sizing: border-box;transition: background-color .3s;}
._contact ._cont .right .submitBx a:hover{background-color: var(--red);}


@media screen and (max-width:1440px) {
    ._contact ._cont .left .tit h3{font-size: clamp(26px, 26 / 1280 * 100vw, 30px);}
    ._contact ._cont .left .tit small{font-size: clamp(18px, 18 / 1280 * 100vw, 20px);}
    ._contact ._cont .left .info .row > div i{font-size: clamp(24px, 24 / 1280 * 100vw, 26px);}

    ._contact ._cont .right{max-width: clamp(700px, 700 / 1280 * 100vw, 800px);}
    /* ._contact ._cont .right .formBx .row h4,._contact ._cont .right .formBx .row h4:after{font-size: clamp(22px, 22 / 1280 * 100vw, 24px);} */
}
@media screen and (max-width:1280px) {
    ._contact ._cont .left .tit h3{font-size: clamp(24px, 24 / 1024 * 100vw, 26px);}
    ._contact ._cont .left .info .row > div b{font-size: clamp(16px, 16 / 1024 * 100vw, 18px);}
    ._contact ._cont .left .info .row > div i{font-size: clamp(22px, 22 / 1024 * 100vw, 24px);}
    
    ._contact ._cont .right{max-width: clamp(550px, 550 / 1024 * 100vw, 700px);}
}
@media screen and (max-width:1024px) {
    ._contact ._cont .left .tit h3 {font-size: clamp(20px, 20 / 820 * 100vw, 24px);}
    ._contact ._cont .left .tit small {font-size: clamp(16px, 16 / 820 * 100vw, 18px);}
    ._contact ._cont .left .info .row > div b {font-size: clamp(14px, 14 / 820 * 100vw, 16px);}
    ._contact ._cont .left .info .row > div i {font-size: clamp(20px, 20 / 820 * 100vw, 22px);}

    ._contact ._cont .right {max-width: clamp(400px, 400 / 820 * 100vw, 550px);}
    ._contact ._cont .right .formBx .row h4, ._contact ._cont .right .formBx .row h4:after {font-size: clamp(16px, 16 / 820 * 100vw, 18px);}

    ._contact ._cont .right .submitBx a {padding: 15px 0;}
}
@media screen and (max-width:820px) {
    ._contact ._cont .left .tit h3 br{display: none;}
    ._contact ._cont{flex-direction: column;gap: 80px;}
    ._contact ._cont .left{gap: 40px;}
    ._contact ._cont .left .info .row > div{gap: 10px;}
    
    ._contact ._cont .right {max-width: unset;}

    ._contact ._cont .right .submitBx a {font-size: clamp(16px, 16 / 500 * 100vw, 18px);}
}
@media screen and (max-width:500px) {
    ._contact ._cont .left .tit h3 {font-size : clamp(16px, 16 / 360 * 100vw, 18px);}
    ._contact ._cont .left .tit h3 br{display: none;}
    ._contact ._cont .left .info .row > div p{gap: 8px;}
    ._contact ._cont .left .info .row > div b {font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
    ._contact ._cont .left .info .row > div i {font-size: clamp(18px, 18 / 360 * 100vw, 20px);}
    ._contact ._cont .left .info .row > div span{font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
    ._contact ._cont .right .formBx .row._flx{flex-direction: column;}
    ._contact ._cont .right .formBx .row label input{font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
    ._contact ._cont .right .formBx .row label textarea{font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
    ._contact ._cont .right .formBx .row h4, ._contact ._cont .right .formBx .row h4:after {font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
    ._contact ._cont .right .checkBx .row .uploadType span{font-size: clamp(13px, 13 / 360 * 100vw, 16px);}
    ._contact ._cont .right .checkBx .row .uploadType i{font-size: clamp(18px, 18 / 360 * 100vw, 20px);}
    ._contact ._cont .right .submitBx a {font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
    
}
@media screen and (max-width:360px) {
    /* ._contact ._cont .left .tit h3 {font-size: clamp(14px, 14 / 280 * 100vw, 16px);} */
    ._contact ._cont .left .tit small {font-size: 14px;padding-top: 10px;}
}


/* 추가 */

._contact ._cont .right .formBx .row > div .selectBox{position: relative;cursor: pointer;}
._contact ._cont .right .formBx .row > div .selectBox input{
    width: 100%;
    padding: 0 5px 10px 5px;
    box-sizing: border-box;
    background-color: #000;
    border: none;
    border-bottom: 1px solid #333333;
    color: #cccccc;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
}
._contact ._cont .right .formBx .row > div .selectBox i {display: flex; align-items: center; justify-content: center; font-size: 20px; transition: .4s;position: absolute;top: 13%;right: 2%;color: #ffffff;}

/* border i 추가 */
._contact ._cont .right .formBx .row > div .selectBox._border i {right: 4%;}

._contact ._cont .right .formBx .row > div .selectBox.active i {transform: scaleY(-1);}
._contact ._cont .right .formBx .row > div .selectBox .optWrap {position: absolute; left: 0; top: 100%; padding-bottom: 10px; width: 100%; text-align: center; cursor: pointer; padding-top: 2px; display: none;}
._contact ._cont .right .formBx .row > div .selectBox .optWrap ul {
    /* max-height: 150px;  */
    overflow-y: auto;  width: 100%; background: #333;border-radius: calc(7/16*1em);position: relative;z-index: 2;}
._contact ._cont .right .formBx .row > div .selectBox .optWrap ul::-webkit-scrollbar {width: 2px;}
._contact ._cont .right .formBx .row > div .selectBox .optWrap ul::-webkit-scrollbar-thumb {background: #333; border-radius: 10px;}
._contact ._cont .right .formBx .row > div .selectBox .optWrap ul li span {font-size: calc(14/16*1em); padding: calc(11/14*1em) 0; width: 100%; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: .4s;color: #fff;}
._contact ._cont .right .formBx .row > div .selectBox .optWrap ul li:hover span {background: #000;}

@media screen and (max-width:500px) {
    ._contact ._cont .right .formBx .row > div .selectBox input{font-size: clamp(14px, 14 / 500 * 100vw, 16px);}
    
}