@charset "utf-8";
/* CSS Document */

a.link {
    color: #005ddc !important;
}

a:hover.link {
    text-decoration: underline;
}

.nice-select {
    float: none;
}

.red {
    color: #C00 !important;
}

.blue {
    color: #0470F2 !important;
}

.green {
    color: #390 !important;
}

.gray {
    color: #999 !important;
}

.orange {
    color: #ff9c00 !important;
}

.bgRed {
    background: #C00 !important;
    color: #fff !important;
    border-radius: 3px !important;
    padding: 4px 8px !important;
}

.bgBlue {
    background: #0470F2 !important;
    color: #fff !important;
    border-radius: 3px !important;
    padding: 4px 8px !important;
}

.bgGreen {
    background: #390 !important;
    color: #fff !important;
    border-radius: 3px !important;
    padding: 4px 8px !important;
}

.bgGray {
    background: #999 !important;
    color: #fff !important;
    border-radius: 3px !important;
    padding: 4px 8px !important;
}

.re_state {
    color: #fff !important;
    border-radius: 3px !important;
    padding: 4px 8px !important;
}

.bglightGray {
    background: #f7f7f7 !important;
}

.bglightBlue {
    background: #effcff !important;
}

.bglightYellow {
    background: #fffdef !important;
}

.button{
    width: 100%;
    height: 50px;
    line-height: 48px;
    border-radius: 10px;
}

.button-primary{
    background-color: #4A90E2;
    color: #fff !important;
}

.button-primary2{
    background-color: #F2F5F8;
    color: #4A90E2 !important;
}

.button-nochoice{
    background-color: #dddddd;
    color: #fff;
    pointer-events: none;
}

.dashboard-bg{
    background-color: #F2F5F8;
}

.point-color{
    color: #4A90E2;
}

.point-color2{
    color: #0045C9;
}

.t-rw {
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    word-break: break-all;
    word-wrap: break-word;
}

.rw-1 {
    -webkit-line-clamp: 1;
}

.rw-2 {
    -webkit-line-clamp: 2;
}

.rw-3 {
    -webkit-line-clamp: 3;
}

.scroll-y::-webkit-scrollbar {
    width: 3px;
    height: 3px;
}

.scroll-y::-webkit-scrollbar-track {
    background: #dadada;
    border-radius: 3px;
}

.scroll-y::-webkit-scrollbar-thumb {
    background: #5e72e4;
    border-radius: 3px;
}

.scroll-y {
    scrollbar-face-color: #8a8a8a;
    scrollbar-track-color: #fff;
    scrollbar-arrow-color: none;
    scrollbar-highlight-color: #8a8a8a;
    scrollbar-3dlight-color: none;
    scrollbar-shadow-color: #8a8a8a;
    scrollbar-darkshadow-color: none;
}

/* ==================================================
    login
================================================== */
.remove-input{position: absolute; top: 50%; right: 15px; transform: translateY(-50%); width: 15px; height: 15px; border-radius: 500px; background-color: #ddd; background-image: url('/front/images/close_small_w.svg'); background-size: 5px 5px; background-position: center center; background-repeat: no-repeat; opacity: 0; z-index: -1; transition: opacity 0.3s ease;}
.remove-input.active {opacity: 1; z-index: 1;}
.ico-eye{position: absolute; top: 50%; right: 15px; transform: translateY(-50%); width: 20px; height: 20px; border-radius: 500px; background-image: url('/front/images/ico_eye.svg'); background-size: cover; background-position: center center; background-repeat: no-repeat; opacity: 0; z-index: -1; transition: opacity 0.3s ease;}
.ico-eye.on{background-image: url("/front/images/ico_eye_on.svg")}

.loginWrap{position:relative; width:100%; height:100vh; text-align:center; overflow:hidden; min-height: calc(100vh - 100px);}
.loginWrap .tb:before{content: ''; clear: both; display: block; width: 115px; height: 144px; background-image: url("/front/images/login_bg_after.svg"); background-repeat: no-repeat; background-size: contain; position: absolute; right: 13px; bottom: 18px; z-index: 0; opacity: 0.08;}
.loginWrap:after{content: ''; clear: both; display: block; width: 100%; height: 19px; background-color: #005DCB; opacity: 0.08; position: absolute; right: 0; bottom: 0; z-index: -1;}

.loginWrap .login_box{width:100%; margin:0 auto; box-sizing:border-box;}
.loginWrap .logo_box{font-size: 0; text-align: center;}
input:focus,
input:active { border-color: #4A90E2; outline: #4a90e2; background: transparent; }
.loginWrap .login_box .login_top .login_id input{padding: 0 35px 0 15px;}
.loginWrap .login_box .login_top .login_pw input{padding: 0 70px 0 15px;}
.loginWrap .login_box .login_btm .idpw_find ul li a {display: block; color: #666666; position: relative;}
.loginWrap .login_box .login_btm .idpw_find ul li + li a::before {content: ''; display: block; clear: both; width: 1px; height: 9px; position: absolute; left: -20px; top: 50%; margin-top: -5px; background-color: #DDD;}
.login_pw .remove-input{right: 50px !important;}
.login_pw .remove-input.small_r{right: 20px !important;}

/* ==================================================
    회원가입
================================================== */
#sub.mypage.register{padding: 40px 0;}
#sub.mypage.register .section-body{height: 100%;}
.checkbox-wrap li:nth-child(n+2){padding: 0 15px; box-sizing: border-box;}
.allcheck-wrap{border-radius: 10px;}
.allcheck-wrap .check-box.big > input[type="checkbox"] ~ label{padding: 20px 20px 20px 47px;}
.timebtn{position: absolute; top: 50%; right: 10px; transform: translateY(-50%);}
.timebtn .countdown{color: #4A90E2;}
.codecheck-btn{position: unset !important; transform: unset !important;}
.birthday-div > *{width: calc((100% - 20px) / 3);}
#sub.register .section4{height: calc(100vh - 120px);}
#sub.register .section4:before{content: ''; clear: both; display: block; width: 100%; height: 50px; position: absolute; bottom: -20px; background-color: #005DCB; opacity: 0.08;}
#sub.register .section4:after{content: ''; clear: both; display: block; width: 100%; height: 283px; background-image: url("/front/images/login_bg_after.svg"); background-repeat: no-repeat; background-position: bottom center; position: absolute; bottom: 30px; opacity: 0.08; background-size: contain}

/* ==================================================
    아이디 찾기
================================================== */
#sub .btnwrap{max-width: 768px; padding: 0 20px; margin: 0 auto; position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 9;}
#sub .id-result{padding: 15px 20px; border-radius: 10px;}

/* ==================================================
    공통
================================================== */
.thead{color: #EFF3F6;}
#sub img{max-width: 100%;}
.codebtn{width: 57px; height: 30px; background-color: #999999; color: #fff; border-radius: 8px; box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.03); position: absolute; top: 50%; right: 10px; transform: translateY(-50%); pointer-events: none; cursor: pointer !important; transition: 0.3s all ease;}
.codebtn.on{pointer-events: auto; background-color: #4A90E2;}
.find .remove-input{right: 82px;}
.button{ width: 100%; height: 50px; padding: 0 15px; border-radius: 10px; box-sizing: border-box;}
.essential{position: relative;}
.essential:after{content: '*'; clear: both; display: block; font-size: 13px; font-weight: 600; color: #4A90E2; position: absolute; top: 0; right: -10px;}

/* ==================================================
    메인
================================================== */
#main{margin-top: 60px;}
#main .section1 .section-body{background-color: #4A90E2; border-radius: 0 0 0 20px; padding: 20px 20px 40px; box-sizing: border-box;}
#main .section1 .totalwrap li{min-height: 120px; border-radius: 10px; background: rgba(255, 255, 255, 0.20); backdrop-filter: blur(2.5px); padding: 15px; box-sizing: border-box}
.label{padding: 4px 5px; border-radius: 500px; border: 0.5px solid #fff;}
.pm-list{border-radius: 10px; background: #FFF; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.08); margin-top: -30px;}
.pm-list li a{padding: 15px; box-sizing: border-box;}
.pm-list li + li:before{content: ''; clear: both; display: block; width: 1px; height: 50px; background-color: #EFF3F6; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
#main .section3{}
.filelist li {flex:1; border-radius: 10px; background-color: #F2F5F8; padding: 15px; box-sizing: border-box; white-space: nowrap;}
.filelist li:nth-child(n+5) {width: calc((100% - 10px) / 2);}
.denger-list{padding: 19px 15px; border-radius: 10px; box-sizing: border-box;}
.denger-list .ico{width: 40px; height: 40px; background-color: #fff; border-radius: 500px; overflow: hidden;}
.denger-list .ico img{margin-top: 2px}
.interview_condi{color: #005DCB; border: 0.5px solid #005DCB; border-radius: 500px; padding: 4px 5px; box-sizing: border-box;}
.interview_condi.end{color: #666666; border: 0.5px solid #666666;}

/* ==================================================
    가점현황, 감점현황
================================================== */
#sub{margin-top: 60px;}
#sub.plus,
#sub.minus,
#sub.notice,
#sub.mypage{max-height: calc(100dvh - 130px); overflow-y: auto}
#sub.plus .section .section-body,
#sub.minus .section .section-body{padding: 0;}
#sub.plus .day-wrap,
#sub.minus .day-wrap{padding: 20px; box-sizing: border-box}
.plus_list,
.minus_list{padding: 20px 20px 10px; box-sizing: border-box}
.plus_list li,
.minus_list li{padding: 20px; box-sizing: border-box; border-radius: 10px; border: 1px solid #EEE; background: #fff;}
.plus_list li + li,
.minus_list li + li{margin-top: 15px;}
.morebtn-wrap{margin-top: 15px; box-sizing: border-box;}
.morebtn{padding: 10px 20px; box-sizing: border-box;}

/* ==================================================
    공지사항
================================================== */
#sub.notice,
#sub.mypage{padding: 20px 0; box-sizing: border-box;}
.notice-list li + li{margin-top: 15px;}
.notice-list li a{padding: 19px 15px; border-radius: 10px; border: 1px solid #eee; background: #fff; box-sizing: border-box;}
.notice-list li a.pin{border: 1px solid #DBE9F9; background: #F6F9FD;}
.notice-list li a span{position: relative;}
.notice-list li a.pin span,
#sub.notice-view .tit-area span.pin{padding-left: 15px;}
.notice-list li a.pin span:before,
#sub.notice-view .tit-area span.pin:before{content: ''; clear: both; display: block; width: 10px; height: 10px; background-image: url("/front/images/ico_pin.svg"); background-repeat: no-repeat; background-size: cover; background-position: center; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.notice-list li a.new span{padding-right: 22px;}
.notice-list li a.new span:after{content: 'N'; clear: both; display: block; font-size: 8px; font-weight: 600; letter-spacing: -0.16px; line-height: 1; leading-trim: both; color: #fff; background-color: #4A90E2; border-radius: 3px; width: 12px; height: 12px; display: flex; align-items: center; justify-content: center; position: absolute; top: 0; right: 0;}
#sub.notice-view{max-height: calc(100vh - 60px); padding-bottom: 40px;}
#sub.notice-view .tit-area{margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px solid #EEE; box-sizing: border-box}
.addwrap li a{padding: 0 15px; height: 42px; border-radius: 10px; background: #F7F7F7;}
.addwrap li + li{margin-top: 15px;}

/* ==================================================
    마이페이지
================================================== */
.mypage-list .titbox{padding: 15px; border-radius: 10px; box-sizing: border-box;}
.mypage-list li a,
.change-pw a{padding: 15px 20px; box-sizing: border-box}
.mypage-list li:not(.logout-li) a > img,
.change-pw a img{transform: rotate(-90deg);}
.logout-li{margin-top: 15px; padding-top: 15px; border-top: 1px solid #eeeeee; box-sizing: border-box;}

/*회원탈퇴*/
#sub.withdraw textarea{width: 100%; height: 100px; overflow-y: auto; padding: 15px; border-radius: 10px; border: 1px solid #EEEEEE; box-sizing: border-box; resize: none;}
#sub.withdraw textarea:focus{outline: #4A90E2; border-color: #4A90E2;}
#sub.withdraw .remove-input{top: 20px;}
.textarea-box{width: calc(100% - 30px); position: absolute; top: 45px; left: 50%; transform: translateX(-50%); height: 0; overflow: hidden;}
.radio-box.custom-radio > input[type="radio"].textarea-input:checked ~ .textarea-box{height: auto;}
.dotlist{background-color: #F7F7F7; padding: 15px; border-radius: 10px; box-sizing: border-box;}
.dotlist li{padding-left: 9px; position: relative;}
.dotlist li:before{content: ''; clear: both; display: block; width: 4px; height: 4px; border-radius: 500px; background-color: #4A90E2; position: absolute; top: 8px; left: 0}
.dotlist.small li:before{top: 5.5px;}
.radio-box.checkradio > input[type="radio"]:checked ~ label:after{left: 0; margin-top: -9px; width: 18px; height: 18px; background: url('/front/images/ico_check_w.svg') no-repeat center;}

/*개인정보*/
#sub.myinfo{max-height: calc(100vh - 60px); padding: 20px 0 10px;}
#sub.myinfo .section-body{padding: 0;}
#sub.myinfo .cont-area{padding: 0 20px;}
.change-pw{padding: 10px 0; border-bottom: 1px solid #eeeeee; box-sizing: border-box;}
.change-pw a,
#sub.myinfo .mypage-list,
.withdraw-btn{padding: 15px 0; box-sizing: border-box;}
#sub.myinfo .mypage-list li + li{margin-top: 20px;}
.info-box{padding: 30px 0; box-sizing: border-box;}
.change-notice{padding: 15px; background: #f7f7f7; border-radius: 10px; box-sizing: border-box;}
.profile-container {text-align: center;}
.profile-image {width: 105px; height: 140px; aspect-ratio: 3/4; object-fit: cover; border-radius: 500px; overflow: hidden;}
.button-box {width: 65px; height: 30px; background: #fff; border: 1px solid #eeeeee; box-sizing: border-box; border-radius: 5000px; gap: 17px; margin: -15px auto 0; position: relative; z-index: 99;}
.button-box > *{position: relative;}
.button-box > * + *:before{content: ''; clear: both; display: block; width: 1px; height: 10px; background-color: #eeeeee; position: absolute; top: 50%; left: -8px; transform: translateY(-50%)}
input[type="file"] {display: none;}

/*경력정보*/
#sub.career,
#sub.mypage.file,
#sub.policy,
#sub.withdraw{padding: 40px 0;}
.career-list li{border-radius: 10px; border: 1px solid #eeeeee; overflow: hidden;}
.career-list li + li{margin-top: 15px;}
.career-list li b{padding: 10px 15px; box-sizing: border-box;}
.career-list li > div{padding: 10px 15px 15px; box-sizing: border-box;}
.career-list li > div p{}
.career-list li > div p + p{margin-top: 10px;}
.career-list li > div p span{width: 80px;}
.career-list + .career-list{margin-top: 40px;}
#sub.career-write{padding: 40px 0 30px;}
.calendar-wrap > span{width: 9px;}
.calendar-wrap input:disabled{background-color: #fff;}
.calendar, .upload-btn{width: 30px; height: 30px; border-radius: 6px; background-color: #111111; position: absolute; top: 50%; right: 10px; transform: translateY(-50%);}

/*필수 제출서류 */
#sub.mypage.file .career-list li b{padding-right: 38px;}
#sub.mypage.file .career-list li b:after{content: ''; clear: both; display: block; width: 10px; height: 10px; border-radius: 500px; background-color: #999999; position: absolute; right: 15px; top: 15px;}
#sub.mypage.file .career-list li b.less-one:after{background-color: #F1D33D;}
#sub.mypage.file .career-list li b.less-three:after{background-color: #00C853;}
#sub.mypage.file .career-list li b.renewal:after{background-color: #FF4646;}
#sub.mypage.file .career-list li b.submission:after{background-color: #4A90E2;}
.file-box {display: flex; justify-content: space-between; align-items: center; font-size: 1.4rem; color: #111111; padding: 0 15px; border: 1px solid #EEEEEE; box-sizing: border-box; letter-spacing: -0.28px; font-weight: 400; border-radius: 10px; height: 50px; line-height: 50px;}
.file-name{color: #ccc;}
.file-name.active {color: #111;}
.upload-btn.active{background-color: #999999;}

/*약관*/
.agree-txt .num-list {counter-reset: item;}
.agree-txt .num-list > li, .agree-txt .num-list > dt, .agree-txt .num-list > dd {position:relative; padding-left: 15px;}
.agree-txt .num-list > li:before, .agree-txt .num-list > dt:before{content: counter(item)'.'; counter-increment:item; position:absolute; top:1px; left:0;}
.agree-txt .subnum-list{counter-reset: item;}
.agree-txt .subnum-list > li, .agree-txt .subnum-list > dt, .agree-txt .subnum-list > dd{padding-left: 20px; position:relative;}
.agree-txt .subnum-list > li:before, .agree-txt .subnum-list > dt:before  {content: counter(item); counter-increment:item; position:absolute; top:5px; left:0; width:14px; height:14px;line-height: 14px; font-size:10px; vertical-align: middle; border:1px solid #707070; border-radius: 10px; text-align: center; display: inline-block; }
.agree-txt .dotline-list > li{position:relative; padding-left:10px;}
.agree-txt .dotline-list > li:before{content:''; width:4px; height:2px; background:#707070; left:0; top:11px; position:absolute;}
.agree-txt h3{display: block; font-size: 15px; font-weight: 700; line-height: 21px; letter-spacing: -0.3px;}
.agree-txt h4{display: block; font-size: 1.5rem; font-weight: 600; letter-spacing: -0.3px; line-height: 21px; margin-top: 30px;}
.agree-txt p, .agree-txt ul li{font-size: 1.4rem; font-weight: 400; line-height: 20px; letter-spacing: -0.28px; margin-top: 10px;}
.agree-txt ul li + li{margin-top: 5px}


.pe-auto{pointer-events: auto !important;}