@charset "utf-8";
/*
DPS 커스텀 css
 */

.wp5px  {width:5px !important;}
.wp10px {width:10px !important;}
.wp20px {width:20px !important;}
.wp30px {width:30px !important;}
.wp40px {width:40px !important;}
.wp50px {width:50px !important;}
.wp60px {width:60px !important;}
.wp70px {width:70px !important;}
.wp80px {width:80px !important;}
.wp90px {width:90px !important;}
.wp100px {width:100px !important;}
.wp110px {width:110px !important;}
.wp120px {width:120px !important;}
.wp130px {width:130px !important;}
.wp140px {width:140px !important;}
.wp150px {width:150px !important;}
.wp160px {width:160px !important;}
.wp170px {width:170px !important;}
.wp180px {width:180px !important;}
.wp190px {width:190px !important;}
.wp200px {width:200px !important;}
.wp250px {width:250px !important;}
.wp300px {width:300px !important;}

input.form.wpFull{width: calc(100% - 20px) !important;text-align: left;padding-left: 5px;padding-right: 5px;}
input.form.wpFull2{width: calc(100% - 30px) !important;text-align: left;padding-left: 5px;padding-right: 5px;}

.red {color: red !important;}

table caption {
    position: absolute;
    left: -9999px;
}

.error {
    color: #bb3737;
}

.filter70 {filter: grayscale(70%);}
.filter80 {filter: grayscale(80%);}
.filter90 {filter: grayscale(90%);}
.filter100 {filter: grayscale(100%);}

.no-event {
    cursor: default;
    pointer-events: none;
}

/* vrfcCommon 검증단계 */
#sub .tabStepBox > ul.tabStep > li.tab{width: 318px; height: 137px; color: #666666; padding: 20px 30px 20px 80px; box-sizing: border-box; position: absolute; display: inline-block; float: left; }

#sub .tabStepBox > ul.tabStep > li.tab01{z-index: 34; left:280px;}
#sub .tabStepBox > ul.tabStep > li.tab02{z-index: 33; left:546px;}
#sub .tabStepBox > ul.tabStep > li.tab03{z-index: 32; left:813px;}
#sub .tabStepBox > ul.tabStep > li.tab04{z-index: 31; left:1080px;}

#sub .tabStepBox > ul.tabStep > li.tabMiddle.bg01{background: url(../img/common/bg_tabmiddle_01.png) no-repeat;background-position: right;}
#sub .tabStepBox > ul.tabStep > li.tabMiddle.bg02{background: url(../img/common/bg_tabmiddle_02.png) no-repeat;background-position: right;}
#sub .tabStepBox > ul.tabStep > li.tabMiddle.bg03{background: url(../img/common/bg_tabmiddle_03.png) no-repeat;background-position: right;}
#sub .tabStepBox > ul.tabStep > li.tabMiddle.bg04{background: url(../img/common/bg_tabmiddle_04.png) no-repeat;background-position: right;}

#sub .tabStepBox > ul.tabStep > li.tabEnd.bg01{background: url(../img/common/bg_tabend_01.png) no-repeat;background-position: right;}
#sub .tabStepBox > ul.tabStep > li.tabEnd.bg02{background: url(../img/common/bg_tabend_02.png) no-repeat;background-position: right;}
#sub .tabStepBox > ul.tabStep > li.tabEnd.bg03{background: url(../img/common/bg_tabend_03.png) no-repeat;background-position: right;}
#sub .tabStepBox > ul.tabStep > li.tabEnd.bg04{background: url(../img/common/bg_tabend_04.png) no-repeat;background-position: right;}

#sub .tabStepBox > ul.tabStep > li span.tabTitle{font-size: 16px; font-weight: 400; display: block; padding: 0px 0px 10px 0px; margin: 0px 10px 10px 0px; box-sizing: border-box;  }
#sub .tabStepBox > ul.tabStep > li span.tabDate{font-size: 14px; font-weight: 400; display: block; line-height: 1.4;}

#sub .tabStepBox > ul.tabStep > li.bg01 span.tabTitle{border-bottom: 1px solid #ffffff; color: #000000 !important;}
#sub .tabStepBox > ul.tabStep > li.bg02 span.tabTitle{border-bottom: 1px solid #ffffff; color: #000000 !important;}
#sub .tabStepBox > ul.tabStep > li.bg03 span.tabTitle{border-bottom: 1px solid #ffffff; color: #000000 !important;}
#sub .tabStepBox > ul.tabStep > li.bg04 span.tabTitle{border-bottom: 1px solid #ffffff; color: #ffffff !important;}

#sub .tabStepBox > ul.tabStep > li.bg01 span.tabDate{color: #000000 !important;}
#sub .tabStepBox > ul.tabStep > li.bg02 span.tabDate{color: #000000 !important;}
#sub .tabStepBox > ul.tabStep > li.bg03 span.tabDate{color: #000000 !important;}
#sub .tabStepBox > ul.tabStep > li.bg04 span.tabDate{color: #ffffff !important;}

#sub .tabStepBox > ul.tabStep > li.tab01:hover .tooltip{display: block;}
#sub .tabStepBox > ul.tabStep > li.tab02:hover .tooltip{display: block;}
#sub .tabStepBox > ul.tabStep > li.tab03:hover .tooltip{display: block;}
#sub .tabStepBox > ul.tabStep > li.tab04:hover .tooltip{display: block;}

/* 툴팁 */
#sub .tooltip{position:absolute; width: 274px; top:137px; left:18px; padding: 15px 10px 15px 30px; z-index: 50; border-radius:5px; color: #575757; text-align: center; display: none; border: 1px solid #c3d4f3; box-sizing: border-box; -webkit-box-shadow: 5px 5px 12px 0px rgba(0, 0, 0, 0.075); -moz-box-shadow: 5px 5px 12px 0px rgba(0, 0, 0, 0.075); box-shadow: 5px 5px 12px 0px rgba(0, 0, 0, 0.075); border-radius: 5px; background: #ffffff; }
/*#sub .tooltip1:after{display: block; content: '';position: absolute; width: 198px; top:135px; left:92px; z-index: 40; padding: 15px 10px 15px 30px; border-radius:5px; color: #575757; text-align: center; display: none; border: 1px solid #c3d4f3; box-sizing: border-box; -webkit-box-shadow: 5px 5px 12px 0px rgba(0, 0, 0, 0.075); -moz-box-shadow: 5px 5px 12px 0px rgba(0, 0, 0, 0.075); box-shadow: 5px 5px 12px 0px rgba(0, 0, 0, 0.075); border-radius: 5px; }*/

#sub .tooltip ul{padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; height: auto !important;}
#sub .tooltip ul li{ padding: 3px 0px 3px 10px; margin: 5px 0px 0px 0px; height: auto !important; box-sizing: border-box; }
#sub .tooltip ul li span.num{ padding: 2px 6px 2px 6px; margin: 0px 10px 0px 0px !important; box-sizing: border-box; border: 1px solid #eaeaea; font-size: 11px; background-color: #f4f4f4; border-radius: 5px;}


/* tabStepBox2 */
#sub .tabStepBox2 ul.tabStep2 li{z-index:0 !important;}
#sub .tabStepBox2 ul.tabStep2 li.on{color: #003d7a; background-color: #ecf3f9;border: 1px solid #003d7a;border-bottom: 3px solid #003d7a;}


/* 읽기전용 disabled 효과*/
.contTbl input.readonly-bg {
    background-color: #F7F7F7;
}
.contTbl input.readonly-bg:read-only {
    background-color: #F7F7F7;
}

/* 숫자타입 우측 정렬*/
.contTbl input.form.number {
    text-align: right;
}

/* 단위표시 위치 조정 */
.contTbl span.unit{
    float: right;
    padding-top: 5px;
}

/* 이용약관 */
.join_member_1 {height: 200px;overflow-y: scroll;border: 1px solid #d9d9d9;box-sizing: border-box;padding: 20px 30px;background: #f8f8f8;}
.join_member_1 + .form-check {text-align: right;margin: 0.5rem 0 2rem 0;}
.join_member_1 + .form-check > span {margin:0 5px;}
.join_member_1 > h5.tle:nth-child(1) {margin-top:5px;}

@media (max-width: 1398px) {
    .headerT {
        display: none;
    }
}

/* 메인화면 */
.mainCtnarea1 .mContBox1, .mainCtnarea1 .mContBox2{ height: 350px;}
.mainCtnarea1 .mContBox3, .mainCtnarea1 .mContBox4{ height: 250px;}

/* 바로가기 버튼 사이즈 수정*/
article.page-foot-menu-layout1 .foot-menu-wrap .foot-menu-btn{
    width: 320px;
    height: 60px;
}

/* 달력 */
input.form.datePicker {
    background: #fff url("../img/ic_input_calendar.svg") no-repeat right 12px center/24px 24px;
    height: 35px;
    text-align: center;
}

/* radio 간격조절*/
.radio-container {
    display:flex;
    flex-wrap: wrap;
    gap:5px;
}

.radio-container label{
    width: 48%;
}

/* 검증업무 도움말*/
.contTbl .tboxpop {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 16px;
    color: #111;
    position: relative;
    cursor: pointer;
    box-sizing: border-box;

    vertical-align: middle;
    padding-left: 10px;
}
.contTbl .subject-box {
    display: inline-flex;
    align-items: center;
    position: relative;
}
.contTbl .subject-box img {
    width: 18px;
    height: 18px;
    vertical-align: middle;
}
.contTbl .tooltip-text {
    display: none;
    position: absolute;
    top: 50%;
    left: calc(100% + 8px);
    /* 아이콘 오른쪽 간격 */
    transform: translateY(-50%);
    background: #e3f2fd;
    color: #0d47a1;
    font-size: 13px;
    line-height: 1.4;
    padding: 8px 10px;
    border-radius: 6px;
    /*white-space: nowrap;*/
    z-index: 9999;
    min-width: 200px;
    box-sizing: border-box;

    border: 1px solid #2196f3;
    text-align: left;
    width: 440px;
    /*text-indent: -10px;*/
}
.contTbl .tooltip-text .indented{
    /*content: '';*/
    display: block;
    text-indent: -15px;
    padding-left: 20px;
}

.contTbl .tooltip-text span.indented::before{
    content: '\25B8 ';
    /*content: '\2022 ';*/
    /*content: '\2713 ';*/
    /*content: '\2192 ';*/
    /*content: '\25c6 ';*/
}


.contTbl .tooltip-text::after {
    /*content: "";*/
    position: absolute;
    top: 50%;
    left: -6px;
    transform: translateY(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: transparent rgba(0, 0, 0, 0.85) transparent transparent;

}
.contTbl .tboxpop:hover .tooltip-text {
    display: block;
    animation: fadeIn 0.2s ease-in-out;
}

/* 팝업 도움말 */
.pAlert .pop-text {
    display: grid;
    width: 98%;
    text-align: left;
    margin-top: 10px;
}

.pAlert .pop-text span{
    text-indent: -15px;
    padding-left: 15px;
}

/* 버튼 다운로드*/
.btn.btn10 {
    color: #3f8bbc;
    background-color: #ffffff;
    border-color: #64b7ec;
    cursor: pointer;
    padding: 5px;
}
.btn.btn10:hover {
    color: #ffffff;
    background-color: #64b7ec;
}

.btn.btn10 i.fas{
    color: #3f8bbc;
}

/* pre 관련 스타일 수정 */
article.table-scroll-list-layout1 .scroll-table-head-box .head-txt-box pre {
    white-space: pre-wrap;
    word-wrap: break-word;
    word-break: break-word;
    max-width: 100%;
    box-sizing: border-box;
}

article.table-scroll-list-layout1 .scroll-table-body-box .scroll-table-box .cell-100 pre {
    white-space: pre-wrap;
    word-wrap: break-word;
    word-break: break-word;
    max-width: 100%;
    box-sizing: border-box;
}

article.form-input-layout1 .form-box > .row .item-box .con-box pre {
    white-space: pre-wrap;
    word-wrap: break-word;
    word-break: break-word;
    max-width: 100%;
    box-sizing: border-box;
}

#main .m_news .m_newsHead {
    float: left;
    display: block;
    max-width: 69%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
    padding-right: 25px;
    color: #111;
}

/* 증액비율 계산기*/
article.contents-table-layout .table-note-box .note-txt-box .ic-box .ic-info2 {
    background: url("../img/ic_info_.svg") no-repeat center/cover;
    width: 18px;
    height: 18px;
}
.link {
    color: blue;
    font-weight: bold;
    text-decoration: underline;
}