@charset "utf-8";


/************************************************************************
* COMMON *
************************************************************************/
#container{width:100%;}
.contents{width:100%;position:relative;}
.contents div[class*='sec-']{padding:100px 0;}
.contents .detail{padding:30px 0 100px 0;min-height:800px;}

@media all and (max-width:1500px) {
.contents div[class*='sec-']{padding:80px 0;}
.contents .detail{padding:30px 0 80px 0;min-height:650px;}
}
@media all and (max-width:1199px) {
.contents .detail{min-height:auto;}
}
@media all and (max-width:960px) {
.contents div[class*='sec-']{padding:60px 0;}
.contents .detail{padding:20px 0 60px 0;}
}
@media all and (max-width:767px) {
.contents div[class*='sec-']{padding:50px 0;}
.contents .detail{padding:20px 0 50px 0;}
}
@media all and (max-width:640px) {
.contents div[class*='sec-']{padding:40px 0;}
.contents .detail{padding:10px 0 40px 0;}
}







/************************************************************************
* MAIN *
************************************************************************/
/** sec-1 **/
.bestPtm{padding:18px 30px;border:solid 1px #e2e2e2;background:#f5f5f5;border-radius:50px;display:table;margin:0 auto;}
.bestPtm a{padding:0 40px;position:relative;transition:all 0.2s ease;}
.bestPtm a:after{width:1px;height:10px;background:#c0c0c0;position:absolute;top:50%;left:0;transform:translateY(-50%);display:block;content:"";}
.bestPtm a:before{width:16px;height:16px;line-height:8px;text-align:center;color:#fff;font-size:10px;background:#0a3d7f;border-radius:50%;position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:block;content:"⌄";z-index:9;opacity:0;transition:all 0.2s ease;}
.bestPtm a:first-child:after{display:none !important;}
.bestPtm li:hover a,
.bestPtm li.active a{color:#0a3d7f;transition:all 0.2s ease;}
.bestPtm li:hover a:before,
.bestPtm li.active a:before{bottom:-26px;opacity:1;transition:all 0.2s ease;}

.sec-1 .tabMain-cont{width:100%;}
.sec-1 .tabMain-cont a.button{margin:0 auto;border-radius:50px;}

@media all and (max-width:1280px){
.bestPtm{padding:16px 25px;}
.bestPtm a{padding:0 35px;}
.bestPtm li:hover a:before,
.bestPtm li.active a:before{bottom:-24px;}
}
@media all and (max-width:960px){
.bestPtm{padding:14px 20px;}
.bestPtm a{padding:0 30px;}
.bestPtm a:after{height:8px;}
}
@media all and (max-width:767px){
.bestPtm{padding:12px 15px;}
.bestPtm a{padding:0 25px;}
.bestPtm li:hover a:before,
.bestPtm li.active a:before{bottom:-22px;}
}
@media all and (max-width:560px){
.bestPtm{padding:10px 10px;}
.bestPtm a{padding:0 20px;}
.bestPtm li:hover a:before,
.bestPtm li.active a:before{bottom:-18px;}
}
@media all and (max-width:360px){
.bestPtm{padding:10px 5px;}
.bestPtm a{padding:0 15px;font-size:13px !important;}
.bestPtm li:hover a:before,
.bestPtm li.active a:before{bottom:-16px;}
}



/** sec-2 **/
.sec-2{position:relative;background:#f0f4f9;}
.sec-2:after{width:30%;height:40%;background:url(/img/ci.png) no-repeat left top;background-size:100% auto;position:absolute;top:-40%;left:-8%;display:block;content:"";opacity:0;}
.sec-2.in-view:after{animation-name:moveUpBounce;animation-duration:1s;animation-fill-mode:forwards;}
.sec-2 .tit img{width:42px;margin-right:10px;}

@media screen and (max-width:2200px) {
.sec-2:after{height:35%;top:-35%;}
}
@media screen and (max-width:1900px) {
.sec-2:after{height:30%;top:-30%;}
}
@media screen and (max-width:1520px) {
.sec-2 .WRAP{padding:0 2%;}
}
@media screen and (max-width:1280px) {
.sec-2:after{height:25%;top:-25%;}
}
@media screen and (max-width:1100px) {
.sec-2:after{width:40%;height:32%;top:-32%;}
}
@media screen and (max-width:767px) {
.sec-2:after{width:50%;height:30%;top:-30%;}
}
@media screen and (max-width:640px) {
.sec-2:after{height:25%;top:-25%;}
}
@media screen and (max-width:560px) {
.sec-2:after{width:60%;height:25%;top:-25%;}
}



.sec-2 .tit img{width:42px;margin-right:10px;}

@media screen and (max-width:1500px) {
.sec-2 .tit img{width:38px;margin-right:5px;}
}
@media screen and (max-width:1100px) {
.sec-2 .tit img{width:35px;}
}
@media screen and (max-width:860px) {
.sec-2 .tit img{width:30px;}
}
@media screen and (max-width:640px) {
.sec-2 .tit img{width:28px;}
}



/* 슬라이드 영역 */
.portfolio_slide{padding-left:20.5%;position:relative;}

@media screen and (max-width:2500px) {
.portfolio_slide{padding-left:19.5%;}
}
@media screen and (max-width:2400px) {
.portfolio_slide{padding-left:17.5%;}
}
@media screen and (max-width:2300px) {
.portfolio_slide{padding-left:16.5%;}
}
@media screen and (max-width:2200px) {
.portfolio_slide{padding-left:14.5%;}
}
@media screen and (max-width:2100px) {
.portfolio_slide{padding-left:12.5%;}
}
@media screen and (max-width:2000px) {
.portfolio_slide{padding-left:10.5%;}
}
@media screen and (max-width:1900px) {
.portfolio_slide{padding-left:8.5%;}
}
@media screen and (max-width:1800px) {
.portfolio_slide{padding-left:6.5%;}
}
@media screen and (max-width:1700px) {
.portfolio_slide{padding-left:4.5%;}
}
@media screen and (max-width:1600px) {
.portfolio_slide{padding-left:2.5%;}
}
@media screen and (max-width:640px) {
.portfolio_slide{padding-top:30px;}
}


.portfolio_slide .item_cont{width:100%;display:flex;justify-content:space-between;flex-direction:column;overflow:hidden;transition:all 0.2s ease;position:relative;aspect-ratio:16 / 9;border-radius:30px;overflow:hidden;}
.portfolio_slide .item_cont img.thumb{width:auto;min-width:100%;min-height:100%;display:block;transition:all 0.2s ease;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);object-fit:cover;}
.portfolio_slide .item_cont img.play{width:20%;max-width:80px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);z-index:9;}

@media screen and (max-width:1500px) {
.portfolio_slide .item_cont{border-radius:20px;}
}
@media screen and (max-width:1100px) {
.portfolio_slide .item_cont{border-radius:10px;}
}



/* Navigator */
.portfolio_slide .controlBx{position:absolute;top:-108px;right:20%;}
.portfolio_slide .controlBx .bt{width:46px;line-height:42px;margin-left:10px;aspect-ratio:1 / 1;cursor:pointer;background:#134ba9;color:#fff;border-radius:50%;text-align:center;}

.portfolio_slide .swiper-scrollbar{width:250px;height:3px;margin-right:10px;border-radius:30px !important;background:#dedede;overflow:hidden;position:static !important;}
.portfolio_slide .swiper-scrollbar .swiper-scrollbar-drag{height:3px;background:#134ba9;border-radius:30px;position:relative;top:0;opacity:1;}

.portfolio_slide .swiper-button-prev,
.portfolio_slide .swiper-button-next{width:46px !important;height:46px !important;margin-top:0 !important;margin-left:10px;cursor:pointer;border:solid 1px #312d2e;border-radius:50%;background-image:none !important;position:relative !important;top:auto !important;right:auto !important;bottom:auto !important;left:auto !important;display:block;z-index:10;}


.portfolio_slide .swiper-button-prev:after,
.portfolio_slide .swiper-button-next:after{width:8px;height:8px;border:solid #312d2e;position:absolute;top:calc(50% - 4px);display:block;content:"";transform:rotate(45deg);}
.portfolio_slide .swiper-button-prev:after{border-width:0 0 2px 2px;left:calc(50% - 4px);}
.portfolio_slide .swiper-button-next:after{border-width:2px 2px 0 0;right:calc(50% - 4px);}

.portfolio_slide .swiper-button-prev:hover,
.portfolio_slide .swiper-button-next:hover{background:#134ba9;border-color:#134ba9;}
.portfolio_slide .swiper-button-prev:hover:after,
.portfolio_slide .swiper-button-next:hover:after{border-color:#fff;}

@media screen and (max-width:2500px) {
.portfolio_slide .controlBx{right:19% !important;}
}
@media screen and (max-width:2400px) {
.portfolio_slide .controlBx{right:17% !important;}
}
@media screen and (max-width:2300px) {
.portfolio_slide .controlBx{right:16% !important;}
}
@media screen and (max-width:2200px) {
.portfolio_slide .controlBx{right:14% !important;}
}
@media screen and (max-width:2100px) {
.portfolio_slide .controlBx{right:12% !important;}
}
@media screen and (max-width:2000px) {
.portfolio_slide .controlBx{right:10% !important;}
}
@media screen and (max-width:1900px) {
.portfolio_slide .controlBx{right:8% !important;}
}
@media screen and (max-width:1800px) {
.portfolio_slide .controlBx{right:6% !important;}
}
@media screen and (max-width:1700px) {
.portfolio_slide .controlBx{right:4% !important;}
}
@media screen and (max-width:1600px) {
.portfolio_slide .controlBx{right:2% !important;}
}
@media screen and (max-width:1100px) {
.portfolio_slide .controlBx{top:-88px;}
.portfolio_slide .controlBx .bt{width:40px;line-height:40px;margin-left:5px;}

.portfolio_slide .swiper-scrollbar{width:250px;margin-right:5px;}

.portfolio_slide .swiper-button-prev,
.portfolio_slide .swiper-button-next{margin-left:5px;}

.portfolio_slide .swiper-button-prev{width:40px !important;height:40px !important;}
.portfolio_slide .swiper-button-prev:after{width:10px;height:10px;top:calc(50% - 5px);}

.portfolio_slide .swiper-button-next{width:40px !important;height:40px !important;}
.portfolio_slide .swiper-button-next:after{width:10px;height:10px;top:calc(50% - 5px);}
}
@media screen and (max-width:960px) {
.portfolio_slide .swiper-scrollbar{width:200px;height:4px;}
.portfolio_slide .swiper-scrollbar .swiper-scrollbar-drag{height:4px;}
}
@media screen and (max-width:767px) {
.portfolio_slide .controlBx .bt{width:38px;line-height:38px;}

.portfolio_slide .swiper-button-prev,
.portfolio_slide .swiper-button-next{width:38px !important;height:38px !important;}

.portfolio_slide .swiper-button-prev:after,
.portfolio_slide .swiper-button-next:after{width:8px;height:8px;top:calc(50% - 4px);}

.portfolio_slide .swiper-button-prev:after{left:calc(50% - 3px);}
.portfolio_slide .swiper-button-next:after{right:calc(50% - 3px);}
}
@media screen and (max-width:640px) {
.portfolio_slide .controlBx{top:-30px;}
.portfolio_slide .controlBx .bt{width:35px;line-height:35px;}

.portfolio_slide .swiper-scrollbar{width:150px;}

.portfolio_slide .swiper-button-prev,
.portfolio_slide .swiper-button-next{width:35px !important;height:35px !important;}

.portfolio_slide .swiper-button-prev:after,
.portfolio_slide .swiper-button-next:after{width:6px;height:6px;top:calc(50% - 3px);}
}
@media screen and (max-width:360px) {
.portfolio_slide .swiper-scrollbar{width:110px;}
}






/** sec-3 **/
.cardSlide{width:calc(100%/2 - 25px);position:relative;overflow:hidden;border-radius:20px;}
.cardSlide .cardTrack{display:flex;transition:transform .5s ease;}
.cardSlide .cardItem{min-width:100%;aspect-ratio:16 / 8;position:relative;overflow:hidden;background:#000;}
.cardSlide .cardItem img{width:100%;height:100%;object-fit:cover;display:block;}
.cardSlide .cardItem::after{width:100%;height:100%;content:"";position:absolute;left:0;top:0;background:rgba(0,0,0,0);z-index:1;transition:all 0.2s ease;}
.cardSlide .cardItem:hover::after{background:rgba(0,0,0,0.5);transition:all 0.2s ease;}

.cardSlide .cardItem .txtBx{position:absolute;left:50%;bottom:0;transform:translate(-50%,60px);width:80%;text-align:center;color:#fff;z-index:2;transition:all 0.2s ease;}
.cardSlide .cardItem .txtBx .tit{font-size:24px;transition:all 0.2s ease;}
.cardSlide .cardItem .txtBx .con{opacity:0;transition:all 0.2s ease;}
.cardSlide .cardItem .txtBx .more{opacity:0;display:block;color:#fff;transition:all 0.2s ease;}

.cardSlide .cardItem:hover .txtBx{left:50%;bottom:50%;transform:translate(-50%,50%);transition:all 0.2s ease;}
.cardSlide .cardItem:hover .txtBx .tit{font-size:30px;transition:all 0.2s ease;}
.cardSlide .cardItem:hover .txtBx .con{opacity:1;transition:all 0.2s ease;}
.cardSlide .cardItem:hover .txtBx .more{opacity:1;transition:all 0.2s ease;}

.cardSlide .cardBtn{width:34px;height:34px;position:absolute;top:50%;transform:translateY(-50%);border:0;border-radius:50%;background:#fff;font-size:0;cursor:pointer;z-index:5;}
.cardSlide .cardPrev{left:20px;}
.cardSlide .cardNext{right:20px;}
.cardSlide .cardPrev:after,
.cardSlide .cardNext:after{width:4px;height:4px;border:solid #010101;position:absolute;top:50%;left:50%;display:block;content:"";transform:translate(-50%, -50%) rotate(45deg);}
.cardSlide .cardPrev:after{border-width:0 0 2px 2px;}
.cardSlide .cardNext:after{border-width:2px 2px 0 0;}

@media screen and (max-width:1520px) {
.sec-3 .WRAP{padding:0 2%;}
}
@media all and (max-width:1500px){
.cardSlide{border-radius:10px;}
.cardSlide .cardItem .txtBx .tit{font-size:22px;}
.cardSlide .cardItem:hover .txtBx .tit{font-size:28px;}

.cardSlide .cardBtn{width:30px;height:30px;}
.cardSlide .cardPrev{left:15px;}
.cardSlide .cardNext{right:15px;}
}
@media all and (max-width:1280px){
.cardSlide{width:calc(100%/2 - 15px);}

.cardSlide .cardItem .txtBx .tit{font-size:20px;}
.cardSlide .cardItem:hover .txtBx .tit{font-size:26px;}
}
@media all and (max-width:1100px){
.cardSlide .cardItem .txtBx .tit{font-size:18px;}
.cardSlide .cardItem:hover .txtBx .tit{font-size:24px;}

.cardSlide .cardBtn{width:27px;height:27px;}
.cardSlide .cardPrev{left:10px;}
.cardSlide .cardNext{right:10px;}
.cardSlide .cardPrev:after{border-width:0 0 1px 1px;}
.cardSlide .cardNext:after{border-width:1px 1px 0 0;}
}
@media all and (max-width:960px){
.cardSlide .cardItem .txtBx .tit{font-size:16px;}
.cardSlide .cardItem:hover .txtBx .tit{font-size:22px;}
}
@media all and (max-width:860px){
.cardSlide{width:100%;margin:10px 0;}

.cardSlide .cardItem::after{background:rgba(0,0,0,0.4);}

.cardSlide .cardItem .txtBx{left:50%;bottom:50%;transform:translate(-50%,50%);}
.cardSlide .cardItem .txtBx .tit,
.cardSlide .cardItem:hover .txtBx .tit{font-size:18px;}
.cardSlide .cardItem .txtBx .con{opacity:1;}
.cardSlide .cardItem .txtBx .more{opacity:1;}
}
@media all and (max-width:460px){
.cardSlide{margin:5px 0;}

.cardSlide .cardItem .txtBx .tit,
.cardSlide .cardItem:hover .txtBx .tit{font-size:16px;}
.cardSlide .cardItem .txtBx .con{font-size:12px !important;}


.cardSlide .cardBtn{width:25px;height:25px;}
.cardSlide .cardPrev{left:5px;}
.cardSlide .cardNext{right:5px;}
}





/************************************************************************
* SUB *
************************************************************************/

/** 회사소개 **/
.grBox img{width:100%;}
.grBox span{width:50%;}
.grBox font{word-wrap:break-word;display:block;word-break:keep-all;}
.grBox .sign *{display:inline-block;}
.grBox .sign h4{margin-top:-24px;margin-left:10px;font-weight:lighter !important;font-style:italic;}

@media all and (max-width:1500px) {
.grBox .sign h4{margin-top:-20px;}
}
@media all and (max-width:1280px) {
.grBox .sign h4{margin-top:-14px;}
}
@media all and (max-width:1100px) {
.grBox .sign h4{margin-top:-10px;}
}
@media all and (max-width:900px) {
.grBox img{width:100%;margin-bottom:40px;}
.grBox span{width:100%;}
}
@media all and (max-width:767px) {
.grBox .sign h4{margin-top:-6px;margin-left:8px;}
}





/** 오시는길 *
.mappage{display:flex;flex-wrap:wrap;}
.mappage li{margin-right:80px;text-align:left;}
.mappage li>div{font-size:16px;color:#59534a;font-weight:300;line-height:34px;}
.mappage li>div>h1{padding-left:40px;font-size:20px;color:#000;font-weight:bold;}
.mappage .location{background:url(/sub/img/icon1.png) no-repeat 0 0;}
.mappage .tel{background:url(/sub/img/icon2.png) no-repeat 0 0;}
.mappage .fax{background:url(/sub/img/icon4.png) no-repeat 0 0;}
.mappage .email{background:url(/sub/img/icon3.png) no-repeat 0 0;}
@media all and (max-width:1100px) {
.mappage li{margin-right:50px;}
.mappage li>div{font-size:15px;font-weight:normal;line-height:30px;}
.mappage li>div>h1{padding-left:40px;font-size:19px;}
}
@media all and (max-width:786px) {
.mappage li{width:100%;margin-bottom:20px;margin-right:0;}
.mappage li>div{font-size:14px;line-height:24px;font-weight:400;background-position:0 0 !important;}
.mappage li>div>h1{padding-left:35px;font-size:18px;}
}

#daumRoughmapContainer1755068341039 .cont{display:none;}
*/







/************************************************************************
* 신청폼 *
************************************************************************/
/** 신청폼레이아웃 **/
.appWrap *{box-sizing:border-box;}

.appWrap i.star{width:5px;height:5px;margin:7px;border-radius:50%;background:#e12d34;display:inline-block;}

.appWrap .ttBx{margin-top:60px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;}
.appWrap .ttBx .tit{padding-left:10px;font-size:22px;line-height:120%;font-weight:bold;}

.appWrap .appBx{border:solid 1px rgba(0,0,0,0.2);margin-top:14px;border-radius:20px;padding:50px;}

.appWrap .appBx .dbx{border-bottom:solid 1px #f3f3f3;display:flex;align-items:center;flex-wrap:wrap;}
.appWrap .appBx .dbx .ttit,
.appWrap .appBx .dbx .ccon{padding:15px 25px;font-size:16px;line-height:140%;font-weight:normal;}
.appWrap .appBx .dbx .ttit{width:220px;text-align:left;}
.appWrap .appBx .dbx .ccon{width:calc(100% - 220px);padding-left:0 !important;display:flex;flex-wrap:wrap;}
.appWrap .appBx .dbx .ccon.disB{display:block;}
.appWrap .appBx .dbx .ccon.disB font{display:block;}

.appWrap .appBx .dbx .ccon.three{align-items:center;}
.appWrap .appBx .dbx .ccon.three font{margin-right:10px;}

.appWrap .appBx .agrBox{width:100%;padding:20px 25px;border-bottom:solid 1px #f3f3f3;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;}
.appWrap .appBx .agrBox span{padding:10px 0;}
.appWrap .appBx .agrBox span u{color:#808080;cursor:pointer;}



.appWrap.login{max-width:960px;margin:0 auto;}
.appWrap.login .appBx .dbx .ccon.three input,
.appWrap.login .appBx .dbx .ccon.three select{width:29% !important;}


@media screen and (max-width:1500px) {
.appWrap .ttBx{margin-top:50px;}

.appWrap .appBx{padding:40px;}
.appWrap .appBx .dbx .ttit,
.appWrap .appBx .dbx .ccon{padding:15px 20px;}
.appWrap .appBx .dbx .ttit{width:200px;}
.appWrap .appBx .dbx .ccon{width:calc(100% - 200px);}
}
@media screen and (max-width:1280px) {
.appWrap .ttBx{margin-top:40px;}
.appWrap .ttBx .tit{padding-left:5px;font-size:20px;}

.appWrap .appBx .dbx .ttit,
.appWrap .appBx .dbx .ccon{padding:10px 15px;font-size:15px;}
.appWrap .appBx .dbx .ttit{width:180px;}
.appWrap .appBx .dbx .ccon{width:calc(100% - 180px);}

.appWrap .appBx .dbx .ccon.three font{margin-right:5px;}
}
@media screen and (max-width:1100px) {
.appWrap .appBx{margin-top:10px;border-radius:10px;padding:30px;}

.appWrap .appBx .dbx .ttit,
.appWrap .appBx .dbx .ccon{padding:10px;}
.appWrap .appBx .dbx .ttit{width:160px;}
.appWrap .appBx .dbx .ccon{width:calc(100% - 160px);}
}
@media screen and (max-width:960px) {
.appWrap .ttBx{margin-top:30px;}

.appWrap .appBx .dbx .ttit{width:140px;}
.appWrap .appBx .dbx .ccon{width:calc(100% - 140px);}
}
@media screen and (max-width:860px) {
.appWrap .appBx{padding:20px;}

.appWrap .appBx .dbx .ttit,
.appWrap .appBx .dbx .ccon{padding:10px 5px;}
.appWrap .appBx .dbx .ttit{width:100%;padding-left:0;padding-bottom:5px;}
.appWrap .appBx .dbx .ccon{width:100%;padding-top:0;}
.appWrap .appBx .dbx:first-child .ttit{padding-top:0 !important;}
}
@media screen and (max-width:767px) {
.appWrap .ttBx .tit{font-size:18px;}

.appWrap .appBx .dbx .ttit,
.appWrap .appBx .dbx .ccon{font-size:14px;}

.appWrap .appBx .dbx .ccon.three input,
.appWrap .appBx .dbx .ccon.three select{width:29% !important;}
}
@media screen and (max-width:640px) {
.appWrap .ttBx .tit{font-size:17px;}

.appWrap .appBx .agrBox{padding:10px 15px;}
}
@media screen and (max-width:400px) {
.appWrap .appBx .dbx .ttit,
.appWrap .appBx .dbx .ccon{font-size:13px;}
}
@media screen and (max-width:360px) {
.appWrap .appBx .dbx .ccon.three input,
.appWrap .appBx .dbx .ccon.three select{width:28% !important;}

.appWrap .appBx .agrBox{padding:10px 5px;}
}





/** 버튼 **/
.appWrap .btnBox{margin:0 auto;margin-top:40px;display:flex;justify-content:center;}
.appWrap .btnBox a{width:250px;margin:0 5px;padding:20px 0;background:#6ec2f4;color:#fff;text-align:center;display:block;font-weight:bold;font-size:22px;line-height:120%;transition:all 0.2s ease;}
.appWrap .btnBox a:hover{background:#0a3d7f;transition:all 0.2s ease;}

.appWrap .btnBox a.gray{background:#999;}
.appWrap .btnBox a.gray:hover{background:#555;}

@media screen and (max-width:1100px) {
.appWrap .btnBox{margin-top:30px;}
.appWrap .btnBox a{padding:18px 0;font-size:20px;}
}
@media screen and (max-width:960px) {
.appWrap .btnBox a{width:240px;font-size:18px;}
}
@media screen and (max-width:767px) {
.appWrap .btnBox{width:100%;margin-top:20px;}
.appWrap .btnBox a{width:calc(100%/2 - 10px);padding:16px 0;}
}
@media screen and (max-width:640px) {
.appWrap .btnBox a{font-size:16px;}
}
@media screen and (max-width:380px) {
.appWrap .btnBox a{font-size:14px;padding:14px 0;}
}







/*********** 입력폼 ***********/
.appBx input[type=text],
.appBx input[type=password],
.appBx input[type=file],
.appBx textarea,
.appBx select{padding:14px 20px;color:#000;border:solid 1px #ccc;border-radius:10px;font-size:16px;line-height:120%;}

.appBx input[type=text]{margin-right:10px;}
.appBx input[type=text]:last-child{margin-right:0;}

.appBx input[type=text]::-webkit-input-placeholder{color:#000 !important;}
.appBx input[type=text]::-moz-input-placeholder{color:#000 !important;}
.appBx input[type=text]::-ms-input-placeholder{color:#000 !important;}
.appBx input[type=password]::-webkit-input-placeholder{color:#000 !important;}
.appBx input[type=password]::-moz-input-placeholder{color:#000 !important;}
.appBx input[type=password]::-ms-input-placeholder{color:#000 !important;}

.appBx select{padding-right:60px;margin-right:10px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 8l8 8 8-8' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' fill='none'/></svg>");background-repeat:no-repeat;background-position:right 20px center;background-size:10px 10px;}
.appBx select:last-child{margin-right:0;}
.appBx select::-ms-expand{display:none;}

.appBx textarea{width:100%;min-height:150px;}

@media screen and (max-width:1500px) {
.appBx input[type=text],
.appBx input[type=password],
.appBx textarea,
.appBx select{padding:12px 13px;font-size:15px;margin-right:8px;}
.appBx select{padding-right:55px;}
}
@media screen and (max-width:1280px) {
.appBx input[type=text],
.appBx input[type=password],
.appBx textarea,
.appBx select{padding:11px 11px;background-position:right 15px center;background-size:12px;margin-right:6px;}
.appBx select{padding-right:50px;}
}
@media screen and (max-width:767px) {
.appBx input[type=text],
.appBx input[type=password],
.appBx textarea,
.appBx select{font-size:14px;border-radius:5px;}
}
@media screen and (max-width:640px) {
.appBx input[type=text],
.appBx input[type=password],
.appBx textarea,
.appBx select{max-width:100% !important;}
}
@media screen and (max-width:400px) {
.appBx input[type=text],
.appBx input[type=password],
.appBx textarea,
.appBx select{padding:10px;font-size:13px;background-position:right 10px center;background-size:10px;margin-right:4px;}
.appBx select{padding-right:30px;}
}



/* 체크박스 or 라디오 */
.chk-input{width:1px;height:1px;padding:0;position:absolute;opacity:0;border:0;clip:rect(0 0 0 0);overflow:hidden;white-space:nowrap;display:inline-block;}
.chk-label{padding-left:26px;position:relative;display:flex;align-items:center;cursor:pointer;user-select:none;font-size:16px;color:#111;}
.chk-label::before{width:1.1rem;height:1.1rem;content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);border-radius:50%;box-sizing:border-box;border:solid 1px rgba(0,0,0,0.5);transition:all .18s ease;}
.chk-input:checked + .chk-label::before{background:#222;border-color:#222;transform:translateY(-50%) scale(1);}
.chk-label::after{width:1.6rem;height:1.6rem;content:"";position:absolute;left:-4px;top:50%;transform:translate(0, -50%) scale(0);display:block;pointer-events:none;background-repeat:no-repeat;background-position:center;background-size:60%;transition:transform .18s cubic-bezier(.2,.9,.3,1),opacity .12s linear;opacity:0;}
.chk-input:checked + .chk-label::after{opacity:1;transform:translate(0,-50%) scale(1);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6.5 12.5l3 3 7-7' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round' fill='none'/></svg>");}

.radio-input{width:1px;height:1px;padding:0;position:absolute;opacity:0;border:0;clip:rect(0 0 0 0);overflow:hidden;white-space:nowrap;display:inline-block;}
.radio-label{padding-left:26px;position:relative;display:inline-flex;align-items:center;cursor:pointer;user-select:none;font-size:16px;color:#111;}
.radio-label::before{width:1rem;height:1rem;content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);border-radius:50%;box-sizing:border-box;border:solid 1px rgba(0,0,0,0.5);transition:all .18s ease;}
.radio-input:checked + .radio-label::before{background:#222;border-color:#222;transform:translateY(-50%) scale(1);}
.radio-label::after{width:1.6rem;height:1.6rem;content:"";position:absolute;left:-4px;top:50%;transform:translate(0, -50%) scale(0);display:block;pointer-events:none;background-repeat:no-repeat;background-position:center;background-size:60%;transition:transform .18s cubic-bezier(.2,.9,.3,1),opacity .12s linear;opacity:0;}
.radio-input:checked + .radio-label::after{opacity:1;transform:translate(0,-50%) scale(1);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6.5 12.5l3 3 7-7' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round' fill='none'/></svg>");}

@media screen and (max-width:1500px) {
.chk-label,
.radio-label{font-size:15px;}
}
@media screen and (max-width:767px) {
.chk-label,
.radio-label{font-size:14px;}
}
@media screen and (max-width:640px) {
.chk-label{padding-left:24px;}
.chk-label::before{width:1rem;height:1rem;}
.chk-label::after{background-size:55%;}

.radio-label{padding-left:24px;}
.radio-label::before{width:1rem;height:1rem;}
.radio-label::after{background-size:55%;}
}
@media screen and (max-width:400px) {
.chk-label,
.radio-label{font-size:13px;}
}