/* 로그인/아이디/비밀번호 */
:root { --loginColor:#009049; --logoinHover:#006534; } 
body.no-scroll { overflow:hidden; } 
.popup { display:none; position:fixed; top:0; left:0; width:100%; height:100dvh; overflow:hidden; z-index:999999999999; flex-direction:column; justify-content:center; align-items:center; } 
.popup form {width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center;}
.popup.on { display:flex; } 
.popup .bg { width:100%; height:100vh; overflow:hidden; background-color:rgba(0,0,0,0.5); position:absolute; top:0; left:0; z-index:-1; } 
.popup .bg02 { width:100%; height:100vh; overflow:hidden; background-color:rgba(0,0,0,0.5); position:absolute; top:0; left:0; z-index:-1; } 
.popup .flexWrap { display:flex; flex-direction:row; align-items:center; } 
.popup .flexBetween { display:flex; flex-direction:row; justify-content:space-between; align-items: flex-start; } 
.popup .flexBetween::after { display:none; } 
.popup .popupBtnWrap { width:calc(100% - 10px); background-color:#fff; padding:0 5px 5px 5px; } 
.popup .popupBtn { width:100%; height:70px; line-height:70px; background-color:#01a6c7; font-size:20px; font-weight:700; color:#ffffff; line-height:1; border-bottom-left-radius:16px; border-bottom-right-radius:16px; } 
.popup .popupBtn02 { background-color:#333; } 
.popup .popupBtn:hover { background-color:#01a6c7; } 
.popup .popupBtnWrap02 { display:flex; flex-direction:row; align-items:center; overflow:hidden; } 
.popup .popupBtnWrap02 .popupBtn { border-radius:0px !important; } 
.popup .popupBtnWrap02 .popupBtn01 { border-bottom-left-radius:16px !important; background-color:#333; } 
.popup .popupBtnWrap02 .popupBtn02 { border-bottom-right-radius:16px !important; background-color:var(--color02); } 
.popup .popupBtnWrap02 .popupBtn01:hover { background-color:#000; } 
.popup .popupBtnWrap02 .popupBtn02:hover { background-color:#000; } 

.popup .center { text-align:center; } 
.popup .inner { width:500px; border-radius:16px; overflow:hidden; } 
.popup .topBox { background-color:#fff; position:relative; padding:0 50px; } 
.popup .black { color:#000000; } 
.popup .grey { color:#666666; } 
.popup .title { padding:55px 0 28px 0; } 
.popup .title h2 { display:block; font-size:32px; font-weight:500; color:#000000; padding-bottom:5px; letter-spacing:5px; } 
.popup .title h2 span { font-weight:400; } 
.popup .title img { width:80px; margin-bottom:15px; } 
.popup .title p { font-size:24px; font-weight:300; color:#777777; width:100%; line-height:1.3; } 
.popup .title .info { font-size:21px; font-weight:400; color:#111; } 
.popup .title .info .color { display:inline-block; font-weight:500; color:#ff6600; } 
.popup .title .desc { font-size:15px; font-weight:300; color:#666; padding-top:20px; } 
.popup .closeBtn { position:absolute; top:0; right:0; width:60px; height:60px; background-color:#07383f; } 
.popup .closeBtn:hover { background-color:#01a6c7; } 
.popup .closeBtn i { color:#fff; font-size:26px; } 
.popup .textWrap .border { width:20px; height:3px; background-color:#000; opacity:0.1; margin:0 auto 20px auto; display:block; } 
.popup .textWrap { padding-bottom:30px; } 
.popup .textWrap dt, .popup .textWrap p { font-size:30px; font-weight:500; color:#000; } 
.popup .textWrap dt span, .popup .textWrap p span { display:inline-block; color:#ff6600; } 
.popup .textWrap dd a { font-weight:18px; font-weight:500; color:#666; display:flex; flex-direction:row; justify-content:center; align-items:center; margin-top:8px; } 
.popup .textWrap dd a:hover { color:#ff6600; } 
.popup .textWrap dd img { width:14px; margin-left:5px; display:block; } 
.popup .textWrap .btn { width:180px; height:40px; border-radius:20px; background-color:#2d2d2d; font-size:16px; font-weight:300; color:#aaaaaa; margin:0 auto; } 
.popup .textWrap .btn .on { display:none; } 
.popup .textWrap .btn:hover .off { display:none; } 
.popup .textWrap .btn:hover .on { display:block; } 
.popup .textWrap .btn:hover { background-color:#ff6600; color:#fff; } 
.popup .location01 >div { position:relative; padding:35px 0; } 
.popup .location01 >div:nth-child(1)::after { content:''; width:1px; height:100%; background-color:#d4d4d4; position:absolute; right:0; top:50%; transform:translateY(-50%); } 
.popup .location { width:100%; background-color:#fff; text-align:center; border-top:1px solid #d4d4d4; box-sizing:border-box; } 
.popup .location dt { font-size:16px; font-weight:500; color:#999999; } 
.popup .location dd { font-size:22px; font-weight:300; color:#000000; } 

.popup .inputWrap input { border:1px solid #eaeaea; box-sizing:border-box; width:100%; height:52px; padding:0 20px; } 
.popup .inputWrap input:focus { color:#000; font-weight:600; border:1px solid #000; } 
.popup .inputWrap input,
.popup .inputWrap input::placeholder { font-size:14px; font-weight:300; color:#aaa; } 

.popup .moveBtn a { font-size:14px; font-weight:400; color:#666666; } 
.popup .moveBtn a img { width:16px; } 
.popup .moveBtn a:hover { color:#07383f; } 
.popup .moveBtn a span { display:inline-block; padding-bottom:5px; border-bottom:1px solid #eaeaea; box-sizing:border-box; } 
.popup .moveBtn a:hover span { border-bottom:1px solid #07383f; } 
.popup .moveBtn ul li:nth-child(2) { margin-left:35px; position:relative; } 
.popup .moveBtn ul li:nth-child(2)::before { content:''; width:1px; height:14px; background-color:#eaeaea; position:absolute; top:50%; transform:translateY(-50%); left:-17.5px; } 

.popup .resultWrap { background-color:#eaf4f0; width:100%; padding:50px 20px; text-align:center; } 
.popup .resultWrap p { font-weight:16px; font-weight:400; line-height:1.4; } 
.popup .resultWrap p span { font-weight:900; color:#008f49; } 
.matchingWrap dt {font-size:16px; font-weight:400; color:#333;}
.matchingWrap dd {font-size:15px; font-weight:400; color:#333; opacity:0.8;}
.matchingWrap .tit {text-align:left; font-size:15px; font-weight:500 !important; color:#000 !important; margin-bottom:5px;}
.matchingWrap .textareaBox textarea {height:70px; font-size:14px; border:1px solid #ddd;} 
.matchingWrap .textareaBox .num {text-align:right; font-size:15px; font-weight:400; color:#333; margin-top:3px;}
.matchingWrap .textareaBox .num span {display:inline-block; color:var(--color02);}
.matchingWrap .matchingBox p {font-size:14px;}
.matchingWrap .matchingBox ul li .titArea  {width:100px;}
.matchingWrap .matchingBox ul li p:nth-child(1) {width:100px;}
.matchingWrap input {width:100% !important;}

.modal-fixed-pop-wrapper{display:none; overflow-y:scroll; overflow-x:hidden;  position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:9999999999999999999999; background:#000; background:rgba(0,0,0,0.8);}
.modal-fixed-pop-wrapper.on {display:block;}
.modal-fixed-pop-inner{position:absolute; display:table; width:100%; height:100%; text-align:center;}
.modal-inner-box{ position:relative; display:table-cell; vertical-align:middle;}
.modal-loading{position:absolute; top:50%; left:50%; margin:-25px 0 0 -25px; z-index:10000;}
.modal-inner-content{text-align:left;}
.modal-close-btn{position:absolute; top:1.1rem; right:1rem; color:#fff;}
.modal-close-btn i{font-size:3.8rem;}
.modal-close-btn i:hover {color:#fff;}

#mainPop_layer {overflow:hidden; overflow-y:hidden !important;}

.modal-fixed-pop-wrapper .swiper {box-sizing:border-box; background-color:#f6f6f6;}
.modal-fixed-pop-wrapper .img-modal-content {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:500px; z-index:100000;}
.modal-fixed-pop-wrapper .img-modal-inner {width:100%;}
.modal-fixed-pop-wrapper .swiper-slide {height:auto;}
.modal-fixed-pop-wrapper .img-modal-inner a {display:block;  width: 100%; }
.modal-fixed-pop-wrapper .img-modal-inner a img {width:100%;}
.modal-fixed-pop-wrapper .img-modal-inner .img-btn-box {height:50px; display:flex; background-color: #f7f7f7; }
.modal-fixed-pop-wrapper .img-modal-inner .img-btn-box .img-modal-close-btn {position:relative; width:50%; font-size:18px; font-weight:400; color: #111; height:100%;}
.modal-fixed-pop-wrapper .img-modal-inner .img-btn-box .img-modal-close-btn:before {position:absolute; content:""; right: 0; top:0; width:1px; height:100%; background-color:#d6d6d6;}
.modal-fixed-pop-wrapper .img-modal-inner .img-btn-box .img-modal-close-btn:last-of-type:before {display:none;}
.modal-fixed-pop-wrapper .img-modal-inner .img-btn-box .img-modal-close-btn:hover {background-color:var(--color02); color:#fff;}
.modal-fixed-pop-wrapper .swiper-pagination {width:auto !important; left:auto !important; right:30px !important; bottom:15px !important;}
.modal-fixed-pop-wrapper .swiper-pagination-bullet {width:10px !important; height:10px !important;}
.modal-fixed-pop-wrapper .swiper-pagination-bullet {background-color:#171717;}
.modal-fixed-pop-wrapper .swiper-pagination-bullet-active {background-color:var(--color02); width:25px !important; border-radius:10px !important;}

@media screen and (max-width:680px) {
    .modal-fixed-pop-wrapper .img-modal-content {width:calc(100% - 40px);}
    .modal-fixed-pop-wrapper .img-modal-inner .img-btn-box .img-modal-close-btn {font-size:16px;}
    .popup .inner {width:calc(100% - 40px); margin:0 auto;}
    .popup .title {padding:40px 0 25px 0;}
    .popup .title .info {font-size:19px;}
    .popup .topBox {padding:0 20px;}    
    .popup .popupBtn {height:55px; font-size:16px;}
}
@media screen and (max-height:620px) {
    .popup .matchingBox {height:calc(100vh - 300px); overflow-y:scroll; background-color:#f6f6f6; padding:15px 20px;}
}

.popUp {display:none; position:fixed; top:0; left:0; width:100%; height:100vh; z-index:999999999999; }
.popUp.on {display:block;}
.popUp .bg { position:fixed; top:0; left:0; width:100%; height:100vh; background-color:rgba(0,0,0,0.7); z-index:-1;}
.popUp .closeBtn {background-color:transparent;}
.popUp .popupBox {width:600px; background-color:#fff; z-index:2; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border-radius:15px; overflow:hidden; }
.popUp .popupBox .textBox { padding:25px 20px; position:relative;}
.popUp .popupBox .textBox p {font-size:21px; font-weight:500; color:#151515;}
.popUp .popupBox .textBox button {cursor:pointer; position:absolute; top:22px; right:27px;}
.popUp .popupBox .textBox button i {font-size:30px; color:#000;}
.popUp .popupBox .textBox button:hover i {font-weight:600; }
.popUp .popupBox .border {width:100%; height:1px; background-color:rgba(0, 0, 0, 0.12); display:block;}
.popUp .popupResult { width:calc(100% - 20px); padding:20px 10px; text-align:left; height:auto;}
.popUp .popupResult .resultText {font-size:16px; font-weight:300; color:#666666; line-height:1.5;}
.poupResultWrap {overflow-y:scroll; width:calc(100% - 20px); height:calc(100% - 20px); padding:10px 10px;}
.poupResultWrap::-webkit-scrollbar {width:5px;  /* 스크롤바의 너비 */ margin-right:10px;}
.poupResultWrap::-webkit-scrollbar-thumb {height:100px; /* 스크롤바의 길이 */background:var(--color01); /* 스크롤바의 색상 */border-radius: 10px;}
.poupResultWrap::-webkit-scrollbar-track {background:transparent;  /*스크롤바 뒷 배경 색상*/}

#terms_layer .poupResultWrap {height:250px;}

@media screen and (max-height:680px) {
    .popUp .popupBox {width:calc(100% - 40px);}
	.popUp .popupBox .textBox {padding:22px 20px;}
	.popUp .popupBox .textBox p {font-size:18px;}
	.popUp .popupBox .textBox button {top:20px; right:20px;}
	.popUp .popupBox .textBox button i {font-size:26px;}
}
