@charset "utf-8";

/* 청소년 정책 패널 소개 */
.panel_teen {background-color:var(--secondary5);border-radius:var(--radius-xlg);padding:4rem 0;display:flex;flex-direction:column;gap:4rem;}
.panel_teen .tit_area {display:flex;width:100%;justify-content:space-between;position:relative;align-items:center;}
.panel_teen .tit_area::before,
.panel_teen .tit_area::after {content:'';width:50%;max-height:100%;}
.panel_teen .tit_area::before {max-width:420px;height:387px;background:url(/resource/images/paid/nep/thk/content/bg_panel_teen_left.png) no-repeat 0 bottom;background-size:contain;}
.panel_teen .tit_area::after {max-width:422px;height:376px;background:url(/resource/images/paid/nep/thk/content/bg_panel_teen_right.png) no-repeat 100% bottom;background-size:contain;}
.panel_teen .tit_area h3 {width:40%;max-width:317px;height:296px;background:url(/resource/images/paid/nep/thk/content/panel_teen_tit.png) no-repeat center 0;background-size:contain;z-index:3;flex-shrink:1;}

@media all and (max-width:1023px) {
    .panel_teen {gap:3.2rem;}
    .panel_teen .tit_area {justify-content:center;}
    .panel_teen .tit_area::before {position:absolute;left:0;width:30%;height:100%;}
    .panel_teen .tit_area::after {position:absolute;right:0;width:30%;height:100%;}
}
@media all and (max-width:767px) {
    .panel_teen {gap:2.4rem;padding:3.2rem 0;}
    .panel_teen .tit_area h3 {height:260px;}
}
@media all and (max-width:639px) {
    .panel_teen .tit_area::before {background-position:0 88%;width:32%;}
    .panel_teen .tit_area::after {background-position:100% 88%;width:32%;}
    .panel_teen .tit_area h3 {width:50%;height:220px;}
}
@media all and (max-width:479px) {
    .panel_teen .tit_area::before {background-position:0 90%;width:34%;}
    .panel_teen .tit_area::after {background-position:100% 90%;width:34%;}
    .panel_teen .tit_area h3 {height:160px;}
}

.panel_box {margin:0 4rem;border:3px solid var(--secondary70);border-radius:var(--radius-xlg);padding:4rem;background:var(--gray0);}
.panel_box .overview {display:flex;flex-direction:column;gap:1.6rem;}
.panel_box .overview dl {display:flex;gap:2rem;align-items:start;word-break:keep-all;}
.panel_box .overview dt {flex-shrink:1;width:15rem;display:flex;align-items:center;justify-content:center;background-color:var(--secondary70);border-radius:var(--radius-max);font-size:2rem;height:4rem;color:var(--gray0);font-weight:700;}
.panel_box .overview dd {min-height:4rem;font-size:2.1rem;padding-top:0.4rem;}
.panel_box .overview dd .sTxt {font-size:1.8rem;}

@media all and (max-width:1023px) {
    .panel_box {margin:0 3.2rem;padding:3.2rem;}
    .panel_box .overview dt {font-size:1.8rem;width:13rem;}
    .panel_box .overview dd {font-size:1.9rem;width:calc(100% - 15rem);}
    .panel_box .overview dd .sTxt {font-size:1.6rem;}
}
@media all and (max-width:767px) {
    .panel_box {margin:0 2.4rem;padding:2.4rem;}
    .panel_box .overview {gap:1.2rem;}
    .panel_box .overview dl {gap:1.2rem;}
    .panel_box .overview dt {font-size:1.6rem;width:10rem;height:3.2rem;}
    .panel_box .overview dd {font-size:1.7rem;width:calc(100% - 11.2rem);padding-top:0.2rem;}
    .panel_box .overview dd .sTxt {font-size:1.5rem;}
}
@media all and (max-width:639px) {
    .panel_box {margin:0 1.6rem;padding:1.6rem;}
    .panel_box .overview dt {font-size:1.5rem;width:10rem;height:2.8rem;font-weight:400;}
    .panel_box .overview dd {font-size:1.6rem;}
    .panel_box .overview dd .sTxt {font-size:1.4rem;}
}
@media all and (max-width:479px) {
    .panel_box .overview dd {width:100%;}
}

.panel_box h4 {text-align:center;font-size:3rem;}
.panel_box h4 .point_color {color:#088ec5;}
.panel_box .activity_list {display:flex;justify-content:center;gap:3.2rem;margin-top:2rem;}
.panel_box .activity_list li {flex:1;border:1px solid var(--secondary20);border-radius:var(--radius-xlg);padding:4rem 0;}
.panel_box .activity_list li dl {display:flex;flex-direction:column;text-align:center;gap:2rem;position:relative;word-break:keep-all;}
.panel_box .activity_list li dl::before {content:'';display:inline-flex;width:100%;height:7rem;}
.panel_box .activity_list li dl.activity_1::before {background:url(/resource/images/paid/nep/thk/content/panel_teen_active1.png) no-repeat center center;background-size:auto 7rem;}
.panel_box .activity_list li dl.activity_2::before {background:url(/resource/images/paid/nep/thk/content/panel_teen_active2.png) no-repeat center center;background-size:auto 7rem;}
.panel_box .activity_list li dl.activity_3::before {background:url(/resource/images/paid/nep/thk/content/panel_teen_active3.png) no-repeat center center;background-size:auto 7rem;}
.panel_box .activity_list li dt {font-size:2.1rem;font-weight:700;}
.panel_box .activity_finish {margin-top:2.4rem;display:flex;flex-direction:column;width:100%;gap:2rem;}
.panel_box .activity_finish li {background-color:var(--success5);padding:1.6rem 2.4rem 1.6rem 5.2rem;border-radius:var(--radius-lg);position:relative;display:flex;flex-direction:column;gap:0.4rem;}
.panel_box .activity_finish li .ico_chk {font-weight:700;color:var(--success60);font-size:1.8rem;display:flex;align-items:flex-start;gap:0.8rem;}
.panel_box .activity_finish li .ico_chk::before {content:'';display:flex;width:2rem;height:2rem;background:url(/resource/images/paid/nep/layout/component/ico_success_fill.svg) no-repeat center center/contain;position:absolute;top:1.9rem;left:2.4rem;}
.panel_box .activity_finish li .btn_down_file {text-decoration:underline;display:flex; gap:1.2rem;align-items:center;}
.panel_box .activity_finish li .btn_down_file::after {content:'';display:inline-flex;width:2rem;height:2rem;background:url(/resource/images/paid/nep/layout/component/ico_download.svg) no-repeat center center/contain;flex-shrink:0;}

@media all and (max-width:1023px) {
    .panel_box .activity_list {flex-direction:column;gap:2.4rem;}
    .panel_box .activity_list li {padding:3.2rem 3.2rem 3.2rem 2.4rem;}
    .panel_box .activity_list li dl {align-items:flex-start;text-align:left;padding-left:15rem;width:100%;gap:1.2rem;}
    .panel_box .activity_list li dl::before {position:absolute;top:0;left:0;width:13rem;height:100%;}
    .panel_box .activity_list li dl.activity_1::before,
    .panel_box .activity_list li dl.activity_2::before,
    .panel_box .activity_list li dl.activity_3::before {background-size:auto 6rem;}
    .panel_box .activity_list li dl br {display:none;}
    .panel_box .activity_list li dt {font-size:1.9rem;}
    .panel_box .activity_list li dd {font-size:1.7rem;}
}
@media all and (max-width:767px) {
    .panel_box h4 {font-size:2.4rem;}
    .panel_box .activity_list {gap:1.6rem;}
    .panel_box .activity_list li {padding:2.4rem 2.4rem 2.4rem 1.6rem;}
    .panel_box .activity_finish {gap:1.6rem;}
    .panel_box .activity_finish li {padding:1.2rem 1.6rem 1.2rem 4.4rem;}
    .panel_box .activity_finish li .ico_chk {font-size:1.6rem;}
    .panel_box .activity_finish li .ico_chk::before {top:1.3rem;left:1.6rem;}
    .panel_box .activity_finish li .btn_down_file {font-size:1.5rem;}
}
@media all and (max-width:639px) {
    .panel_box h4 {font-size:2rem;}
    .panel_box .activity_list li {padding-left:0;}
    .panel_box .activity_list li dl {padding-left:10rem;}
    .panel_box .activity_list li dl::before {width:10rem;}
    .panel_box .activity_list li dl.activity_1::before,
    .panel_box .activity_list li dl.activity_2::before,
    .panel_box .activity_list li dl.activity_3::before {background-size:auto 4rem;}
    .panel_box .activity_list li dt {font-size:1.7rem;}
    .panel_box .activity_list li dd {font-size:1.6rem;}
}
@media all and (max-width:479px) {
    .panel_box .activity_list li {padding:2.4rem 1rem;}
    .panel_box .activity_list li dl {padding:0;text-align:center;align-items:center;}
    .panel_box .activity_list li dl::before {position:relative;width:100%;height:4rem;}
    .panel_box .activity_list li dl br {display:block;}
}

.panel_teen .btm_txt {margin:0 4rem;text-align:center;font-size:1.9rem;word-break:keep-all;}
.panel_teen .btm_txt .sTxt {font-size:1.6rem;}

@media all and (max-width:1023px) {
    .panel_teen .btm_txt {margin:0 3.2rem;font-size:1.8rem;}
    .panel_teen .btm_txt .sTxt {font-size:1.5rem;}
}
@media all and (max-width:767px) {
    .panel_teen .btm_txt {margin:0 2.4rem;font-size:1.7rem;}
}


/* 개인정보 동의 */
.agreeArea .blue {color:var(--primary60) !important;}

.agreeArea .agreeTxt {height:32rem; border:0; padding:0; border-radius:var(--radius-xlg);overflow-y:auto;}
.agreeArea .agreeTxt::-webkit-scrollbar { width:1rem; }
.agreeArea .agreeTxt::-webkit-scrollbar-thumb { background-color:var(--secondary10); border-radius:1rem; }
.agreeArea .agreeTxt::-webkit-scrollbar-track { background-color:var(--primary5); border-radius:1rem; }
.agreeArea .agreeTxt h6{font-weight:700;font-size:2rem;margin:4rem 0 1.2rem;}
.agreeArea .agreeTxt h6:first-child{margin-top:0}
.agreeArea .agreeTxt .s_tit{display:block;font-weight:700;font-size:1.8rem;margin:3rem 0 1.2rem;color:var(--primary70);}
.agreeArea .agreeTxt p{margin-top:1.2rem;}
.agreeArea .agreeTxt a{text-decoration:underline}
.agreeArea .agreeTxt ul {margin-top:1.2rem;display:flex;flex-direction:column;gap:0.4rem;}
.agreeArea .agreeTxt ul li{padding-left:2rem;position:relative;}
.agreeArea .agreeTxt ul li:before {content:'';display:block;width:5px;height:1px;background-color:var(--gray80);position:absolute;top:12px;left:4px;}

.box_area {margin-top:1.2rem;padding:4rem;border:1px solid var(--secondary20);background:#fff;border-radius:var(--radius-xlg);}
.box_area > *:first-child {margin-top:0 !important;}

@media all and (max-width:767px) {
    .box_area {padding:2.4rem;}
}

.agreeChk { display:flex; align-items:center; padding:3.2rem; margin-top:2rem; border-radius:var(--radius-xlg); background-color:var(--gray5); word-break:break-all; justify-content:space-between;}
.agreeChk + .terms-wrap { margin-top:2rem; }
.agreeChk > p { width:calc(100% - 200px); }
.agreeChk .form-check { margin-left:auto; }

/* 라디오버튼 스타일 공통 2024.06 */
.form-check {
    --radio-size: 2rem;
    --radio-checked-size: 1rem;
    --radio-margin-top: 0.3rem;
}
.form-check input[type=radio] { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.form-check input[type=radio] ~ label { position:relative; display:inline-flex; gap:0.8rem; }
.form-check input[type=radio] ~ label::before { display:flex;content:'';transition:0.4s cubic-bezier(0.4, 0, 0.23, 1);border:0.1rem solid var(--gray50); border-radius:50%;width:var(--radio-size);height:var(--radio-size);flex-shrink:0;z-index:3;margin-top:var(--radio-margin-top);background-color:#fff;}
.form-check input[type=radio] ~ label::after { position:absolute; top:calc((var(--radio-size) - var(--radio-checked-size)) / 2 + var(--radio-margin-top)); left:calc((var(--radio-size) - var(--radio-checked-size)) / 2); width:var(--radio-checked-size); height:var(--radio-checked-size); border-radius:50%; background:#fff;z-index:4;}
.form-check input[type=radio] ~ label::before,
.form-check input[type=radio] ~ label::after { content:''; display:block; transition:0.4s; }
.form-check input[type=radio]:checked ~ label::before { border-color:var(--primary50); }
.form-check input[type=radio]:checked ~ label::after { background-color:var(--primary50); }
.form-check input[type=radio]:focus ~ label,
.form-check input[type=radio]:focus-visible ~ label { outline:2px dashed var(--primary50);}

@media all and (max-width:767px){
    .agreeTxt {padding:2.4rem;}
    .agreeTxt.type_1 { padding:0 }
    .agreeTxt.type_1 .numList>li>ul, .agreeTxt.type_1 .numList>li>ol { margin:5px 0 0 10px }
    .agreeTxt h6 {font-size:1.8rem;}
    .agreeTxt .s_tit {font-size:1.7rem;}
    .agreeArea, .agreeAll { margin-top:30px; }
    .terms-wrap { padding:2.4rem; }
    .agreeArea table th, .agreeArea table td { padding:5px; font-size:1.4rem; }
    .agreeArea table .f18 { font-size:1.7rem !important; }
    .agreeArea .scrollTbl { overflow-x:auto; }
    .agreeArea .scrollTbl table { min-width:640px; margin-top:0}
    .agreeArea > p { font-size:1.4rem; }
    .agreeChk { text-align:center; display:block; padding:2.4rem;}
    .agreeChk p { width:100%; word-break:keep-all; margin-bottom:1rem; }
    .agreeChk .form-check { display:inline-block; margin-right:2.4rem; }
    .terms-agree-all { padding:2.4rem; }
    .agreeChk_box.allchk{padding:2.4rem;font-size:1.8rem;margin-bottom:4rem;}
}

/* 회원정보 입력 */
.inputArea {margin-top:4rem;}
.inputArea .tit {display:flex;justify-content:space-between;align-items:center;margin-bottom:1.2rem;}
.inputArea .tit h4 {flex-shrink:0;margin:0;font-size:2.4rem;}
.inputArea .inputTbl {display:flex;gap:2.4rem;flex-wrap:wrap;border:1px solid var(--gray30);border-radius:var(--radius-xlg);padding:4rem;}
.inputArea .inputTbl .btn_certi {display:flex;align-items:center;height:4.8rem;padding:0 1.6rem;border:1px solid var(--primary50);border-radius:var(--radius-sm);background-color:var(--primary5);color:var(--primary60);flex-shrink:0;}
.inputArea .inputTbl .btn_certi:hover {background-color:var(--primary10);}
.inputArea .inputTbl .inforTxt {position:relative;padding-left:2rem;}
.inputArea .inputTbl .inforTxt:before {position:absolute;top:4px;left:0;content:'';width:1.6rem;height:1.6rem;background:url(/resource/images/paid/nep/layout/component/ico_information.svg) no-repeat center center/contain;}
.inputArea .inputTbl dl {width:100%;}
.inputArea .inputTbl dl.divide {width:calc(25% - 1.8rem);}
.inputArea .inputTbl dl dt{margin-bottom:1.2rem;font-weight:700;}
.inputArea .inputTbl dl dd {display:flex;gap:1.2rem;align-items:center;}
.inputArea .inputTbl dl dd select {width:100%;}
.inputArea .inputTbl dl dd input[type=text]{width:100%;}

@media all and (max-width:1023px){
    .inputArea .inputTbl dl.divide {width:calc(50% - 1.2rem);}
}
@media all and (max-width:767px) {
    .inputArea .inputTbl {padding:2.4rem;}
}
@media all and (max-width:639px) {
    .inputArea .inputTbl dl.divide {width:100%;}
    .inputArea .inputTbl dl dd {flex-wrap:wrap;}
    .inputArea .inputTbl dl dd.email_form > input[type=text]:first-child {width:calc(100% - 4rem);}
}
@media all and (max-width:479px) {
    .inputArea .tit {flex-direction:column;justify-content:start;align-items:start;}
}

/* 기존 */
.h_100 {height:100%!important;}
.p_15 {padding:15px!important;}
.lineh_i{line-height: inherit;}

.linkTit{position:relative;margin-bottom:20px}
.linkTit>ul{overflow:hidden;padding-top: 1px;border-width:0 0 0 1px;border-style:solid;border-color:#d5d5db}
.linkTit>ul>li { display: table;float: left;margin-top:-1px;vertical-align: middle;border-width:1px 1px 1px 0;border-style:solid;border-color:#d5d5db}
.linkTit.tab-col-13>ul>li { width: 7.7%}
.linkTit.tab-col-6>ul>li { width: 16.666%}
.linkTit.tab-col-5>ul>li { width: 20%}
.linkTit.tab-col-4>ul>li { width: 25%}
.linkTit.tab-col-3>ul>li { width: 33.33%}
.linkTit.tab-col-2>ul>li { width: 50%}
.linkTit ul li a {position:relative;height:53px;line-height: 100%;font-size: 16px;display: table-cell; text-align: center; transition:all .3s;vertical-align:middle;border-bottom: 2px solid #488bf8;}
.linkTit ul li a:hover{color:#488bf8}
.linkTit ul li a h2:hover{color:#488bf8}
.linkTit ul li a span{display: inline-block;position: relative; text-align: center;vertical-align: middle}
.linkTit ul li a.on{background: #488bf8; color:#fff;}
.linkTit ul li a.on h2{background: #488bf8; color:#fff;}

/* 패널소개 */
.titMain{max-width:1200px;margin:0 auto;padding:20px;background:#f5f8fc;}
.titMainSub{padding:20px;background:#fff;}
.titMainSub .panel_wrap .panel_img_m {display:none; margin: 0 auto;}
.titMainSub .panel_wrap .panel_img_w {display:block; margin: 0 auto;}

.titMain{max-width:1200px;margin:0 auto;padding:20px;background:#f5f8fc;}
.titMainSub{padding:20px;background:#fff;}

/* 제목박스 */
.titBox{margin-top:10px;padding:15px;background:#f4f5f9;border-top:1px solid #c4c9ce}
.titBox.slideTit{padding:17px 50px 17px 15px}
.titBox h4{padding:0;margin:0;font-size:17px}
.titBox h4:before{display:none}
.titBox h5{padding:0;margin:0;font-size:19px;color:#111;font-weight:500;line-height:inherit}
.titBox strong{font-size:19px;color:#111;font-weight:500}

.titBox.type_1{background:#e0edf6;border-left:1px solid #c4c9ce;border-right:1px solid #c4c9ce}
.titBox.icon h4{position:relative;padding-left:40px}
.titBox.icon h4:before{content:"";display:block;width:32px;height:32px;position:absolute;left:0;top:50%;margin-top:-16px}
.titBox.icon_1 h4:before{background:url(/resource/images/paid/nep/pot/content/icon_titB_1.png) no-repeat}
.titBox.icon_2 h4:before{background:url(/resource/images/paid/nep/pot/content/icon_titB_2.png) no-repeat}

/* 제목박스_좌우로 내용이 들어가는 경우 */
.title_lr{margin-top:60px;padding:16px 15px 15px;background:#f4f5f9;border-top:1px solid #c4c9ce}
.title_lr:after{content:'';display:block;clear:both}
.title_lr .titleL{float:left}
.title_lr .titleL h4{padding:0;margin:0;font-size:17px}
.title_lr .titleL h4:before{display:none}
.title_lr .titleR{float:right}

.title_lr .titleL{position:relative;float:left}
.title_lr .titleR{float:right}

.agree_sel{margin:15px 0;text-align:center;border-top: 1px solid #4e5154;padding:10px}
.agree_sel label{margin-left:15px}
.agree_sel label:first-child{margin-left:0}
.agree_sel .agree_check{}
.agree_sel .agree_check input[type="checkbox"]{width:18px;height:18px;vertical-align:-3px;margin-right:5px}
.agree_sel .agree_check input[type="checkbox"]:focus{outline:1px dotted #000}

.agr_box .agr_pt{padding:0;overflow-y:auto;line-height:22px;}
.agr_box .agr_pt dl{margin-top:30px}
.agr_box .agr_pt dl:first-child{margin-top:0}
.agr_box .agr_pt dl dt{font-weight:500}
.agr_box .agr_pt dl dt,
.agr_box .agr_pt dl dd{margin-bottom:15px;word-break:keep-all;}
.agr_box .agr_pt dl dd{margin-left:10px;line-height:22px;}
.agr_box .agr_pt ul{margin-top:20px}
.agr_box .agr_pt ul li{margin-bottom:8px;line-height:22px;word-break:keep-all}
.agr_box .agr_pt p{margin-bottom:15px;word-break:keep-all}

.mw_Input.write{padding:10px}
.mw_Input.write dt,.mw_Input.write dd{border:0;background:#fff;text-align:left;display:table-cell;padding:8px 0;font-weight:normal}
.mw_Input.write dt{position:relative;color:#111;font-weight:500;line-height:24px}
.mw_Input.write dt i{display:block;color:#555;font-size:14px}
.mw_Input.write dt .enter{display:block}
.mw_Input.write dl{margin-top:5px;display:table;width:100%}
.mw_Input.write dl .btn_certi {margin-bottom: 5px;}
.mw_Input.write dl .btn_certi span {font-weight: normal;font-size: 17px;padding: 15px 30px;}
.mw_Input.write input[type="text"],.mw_Input.write select{height:40px; width: 220px;}

@media all and (max-width:767px){
    .titMainSub{padding: 15px;}
    .mw_Input.write input[type="text"], .mw_Input.write select {width:100%!important;}
    .mw_Input.write select {margin-top:5px;}
    .mw_Input.write dl .btn_certi {margin-bottom: 5px;}
    .mw_Input.write dl .btn_certi span {font-weight: normal;font-size: 15px;padding: 13px 17px;}
}

@media all and (max-width:640px){
    .titMainSub{padding: 20px 15px;}
    .agr_box .agr_pt{padding:0;}
    .panel_img_m {display:block!important;}
    .panel_img_w {display:none!important;}
}

@media all and (max-width:540px){
    .titMainSub {padding: 15px;}
}