.wrap-container{
    padding-top:20px;
    height:calc(100vh - 60px);
    padding-left: 90px;
    padding :20px 15px 15px 90px;
}

.wrap-container .wrap{
    width:100%;
    height:100%;
}


.wrap .page{
    position: fixed;
    top: 62px;
    left: 71px;
    width: calc(100% - 70px);
    height: calc(100% - 60px);
    background-color: #fff;
    z-index: 3;
    padding:20px;
    overflow-y: auto;
}

.wrap .devide-box{
    display:flex;
}

.wrap .devide-box .devide-item{
    flex:1;
}

.wrap .devide-box .devide-item.small{
    flex:0.4;
}


.wrap .devide-box .devide-item + .devide-item{
    margin-left:20px;
}

.wrap .component{
    /*max-width: 1200px;*/
    height: 100%;
}

.wrap .info-box{
    margin-bottom:15px;
}
.wrap .tit-box{
    margin-top:2px;
    margin-bottom: 2px;
}
.wrap .info-box + .info-box{
    margin-top:5px;
}
.wrap .info-box .tit-box{
    margin-top:30px;
    margin-bottom:10px;
}

.wrap .info-box .tit-box.flex{
    display:flex;
    justify-content: space-between;
}

/* 기존 메뉴 스타일 유지 (하위 호환성) */
.wrap .info-box .tit-box.flex .menu-list{
    display:flex;
}

/* 새로운 모던 메뉴 스타일 */
.wrap .info-box .modern-table-menu {
    margin: 0;
    border: none;
    box-shadow: none;
    background: transparent;
    padding: 0;
}

/* 통합된 스크롤 가능한 테이블 스타일 */
.table-box--scrollable {
    overflow-x: auto;
    overflow-y: auto;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}

.table-box--scrollable table {
    min-width: 1200px; /* 최소 테이블 너비 설정 */
    width: 100%;
    border-collapse: collapse;
}

.table-box--scrollable th,
.table-box--scrollable td {
    white-space: nowrap;
    padding: 8px 12px;
    border-bottom: 1px solid #e5e7eb;
    border-right: 1px solid #e5e7eb;
    text-align: left;
}

.table-box--scrollable td:last-child,
.table-box--scrollable th:last-child {
    border-right: none;
}

.table-box--scrollable th {
    background-color: #f9fafb;
    font-weight: 600;
    color: #374151;
    position: sticky;
    top: 0;
    z-index: 10;
    border-right: 1px solid #e5e7eb;
    border-bottom: 2px solid #d1d5db;
}

.table-box--scrollable th:last-child {
    border-right: none;
}

.table-box--scrollable tbody tr:hover {
    background-color: #f3f4f6;
}

/* 스크롤바 스타일링 */
.table-box--scrollable::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.table-box--scrollable::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 4px;
}

.table-box--scrollable::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

.table-box--scrollable::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* 반응형 스크롤 */
@media (max-width: 768px) {
    .table-box--scrollable {
        overflow-x: scroll;
    }
    
    .table-box--scrollable table {
        min-width: 800px;
    }
}
.wrap .info-box .tit-box.flex .menu-list ul{
    display:flex;
    align-items: center;
}
/*.wrap .info-box .tit-box.flex .menu-list button{
    height:30px;
    font-size:13px;
    padding: 7px 10px;
    margin-right:5px;
}*/

.wrap .info-box .tit-box.flex .menu-list{
    gap:5px;
}

.wrap .info-box .tit-box.flex .menu-list button:last-child{
    margin-right:0px;
}

/*.wrap .info-box .tit-box.flex .menu-list button + button{
    margin-left:5px;
}*/

.wrap .info-box .tit-box.flex .menu-list li a{
    color: #001E5E;
        border: 1px solid #001E5E;
        max-height: 30px;
        width:auto;
        /*width: 82px;*/
        text-align: center;
        padding: 4px 6px;
        border-radius: 15px;
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        cursor: pointer;
        box-shadow: 0px 0px 2px 0px #001E5E;
}
.wrap .info-box .tit-box.flex .menu-list li + li{
    margin-left:8px;
}
.wrap .info-box .tit-box.flex .menu-list li a:active{
    background-color: #DCEAF7;
}
.wrap .info-box .tit-box.flex .menu-list li a i.icon{
    display: block;
    width: 20px;
    height: 20px;
}
.wrap .info-box .tit-box.flex .menu-list li a i.icon.write{
    background: url(/images/icon_write.png) no-repeat center;
    background-size: 100% 100%;
}
.wrap .info-box .tit-box.flex .menu-list li a i.icon.plus{
    background: url(/images/icon_plus.png) no-repeat center;
    background-size: 100% 100%;
}
.wrap .info-box .tit-box.flex .menu-list li a i.icon.minus{
    background: url(/images/minus-sign.png) no-repeat center;
    background-size: 100% 100%;
}
.wrap .info-box .tit-box.flex .menu-list li a i.icon.excel{
    background: url(/images/icon_excel.png) no-repeat center;
    background-size: 100% 100%;
}
.wrap .info-box .tit-box.flex .menu-list li a i.icon.reset{
    background: url(/images/icon_reset.png) no-repeat center;
    background-size: 100% 100%;
}
.wrap .info-box .tit-box.flex .menu-list li a i.icon.checkmark{
    background: url(/images/icon_checkmark.png) no-repeat center;
    background-size: 100% 100%;
}
.wrap .info-box .tit-box.flex .menu-list li a i.icon.setting{
    background: url(/images/icon_settings.png) no-repeat center;
    background-size: 100% 100%;
}
.wrap .info-box .tit-box.flex .menu-list li a i.icon.save{
    background: url(/images/icon_save.png) no-repeat center;
    background-size: 100% 100%;
}
.wrap .info-box .tit-box.flex .menu-list li a span{
    display: inline-block;
    width: 0;
    margin-right: -5px;
    margin-left: 5px;
    height: 14px;
    font-size: 13px;
    font-weight: 500;
    overflow: hidden;
    white-space: nowrap;
    opacity: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: width 0.1s cubic-bezier(0.4, 0, 0.2, 1), 
                opacity 0.3s ease-out, 
                transform 0.1s cubic-bezier(0.4, 0, 0.2, 1);
}
.wrap .info-box .tit-box.flex .menu-list li a:hover{
    padding: 4px 10px;
}
.wrap .info-box .tit-box.flex .menu-list li a:hover span{
    margin-right: 0px;
    margin-left:5px;
    /*padding:0 5px 0 0;
    width: auto;*/ 
    width:55px; /* 원하는 크기로 조정 */
    opacity: 1;
    transform: scaleX(1);
}
.wrap .info-box .tit-box.flex .menu-list li select{
    height: 35px;
    font-size: 13px;
    padding-top: 5px;
    margin-left: 5px;
    min-width: 140px;
}
.wrap .info-box .tit-box.flex .menu-list li.pos-rel{
    position: relative;
}
.wrap .info-box .tit-box.flex .menu-list ul li details summary{
    color: #001E5E;
    border: 1px solid #001E5E;
    height: 30px;
    width: 80px;
    padding: 7px 10px;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 13px;
    font-weight: bold;
    box-shadow: 0px 0px 2px 0px #001E5E;
    margin-bottom: 0px;
}
.wrap .info-box .tit-box.flex .menu-list ul li details summary i.icon{
    display: block;
    width: 15px;
    height: 15px;
    background: url(/images/icon_filter.png) no-repeat center;
    background-size: 100% 100%;
    margin-right: 10px;
}
.wrap .info-box .tit-box.flex .menu-list ul li details summary span{
    padding: 2px;
    padding-top: 7px;
    color: #001E5E;
    font-size: 13px;
    font-weight: 500;
}
.wrap .info-box .tit-box.flex .menu-list ul li details summary::after{
    display:none;
}
.wrap .info-box .tit-box.flex .menu-list ul li details[open] summary{
    background-color:#001E5E;
}
.wrap .info-box .tit-box.flex .menu-list ul li details[open] summary span{
    color: #fff;
}
.wrap .info-box .tit-box.flex .menu-list ul li details[open] summary i.icon{
    cursor:pointer;
    width:14px;
    height:14px;
    background: url(/images/icon_filter_w.png) no-repeat center;
    background-size: 100% 100%;
}
.wrap .info-box .tit-box.flex .menu-list ul li details ul.option-list{
    display: flex;
    flex-direction: column;
    box-shadow: 0px 2px 5px 2px gray;
    /*margin-left: 3px;*/
    right:0px;
    top: 30px;
    margin-top: 10px;
    position: absolute;
    /*padding: 0px 10px 5px 0px;*/
    padding:10px;
    background: #fff;
    z-index: 2;
    max-height: 250px;
    overflow-y: auto;
}
.wrap .info-box .tit-box.flex .menu-list ul li ul.option-list li{
    width: 100%;
    margin-left: 0px;
    margin-top: 2px;
    margin-bottom: 2px;
}
.wrap .info-box .tit-box.flex .menu-list ul li ul.option-list::-webkit-scrollbar {
    width: 8px;  /* 스크롤바의 너비 */
    height: 16px;
}
.wrap .info-box .tit-box.flex .menu-list ul li ul.option-list::-webkit-scrollbar-thumb {
    height: 30%; /* 스크롤바의 길이 */
    background: #6D87B9; /* 스크롤바의 색상 */
    border-radius: 10px;
}
.wrap .info-box .tit-box.flex .menu-list ul li ul.option-list::-webkit-scrollbar-track {
    background: rgba(109, 135, 185, .1);  /*스크롤바 뒷 배경 색상*/
}
.wrap .info-box .tit-box.flex .menu-list ul li ul.option-list li + li{
    margin-top:13px;
}
.wrap .info-box .tit-box.flex .menu-list ul li ul.option-list li label{
    display: flex;
    justify-content: start;
    /* font-weight: bold; */
    font-size: 12px;
    align-items: center;
}
.wrap .info-box .tit-box.flex .menu-list ul li ul.option-list li label input[type="checkbox"]{
    width: 18px;
    height:18px;
}
.wrap .info-box .tit-box.flex .menu-list ul li ul.option-list li label span{
    font-size:12px;
    font-weight: 500;
    width: calc(100% - 40px);
    padding-top: 0;
}
.wrap .info-box .tit-box h2{
    font-size:17px;
}
.wrap .tit-box span{
    font-size:16px;
    font-weight: bold;
}
.wrap .info-box .row{
    width:100%;
    display:flex;
    height:40px;
    /*border-right: 1px solid #DCEAF7;*/
}
.wrap .info-box .row.big{
    height:85px;
}
.wrap .info-box .row:last-child:not(.sub-txt){
    /*border-bottom: 1px solid #DCEAF7;*/   
}
.wrap .info-box .row.borbtm{
    border-bottom: 1px solid #DCEAF7;
}
.wrap .info-box .row .item{
    flex: 1;
    /*border-bottom: 1px solid #DCEAF7;*/
    display: flex;
    /*border-top: 1px solid #DCEAF7;*/
}
.wrap .info-box .row .item.big{
    flex:2;
}
.wrap .info-box .row .item.short{
    flex: 0.9;
}
.wrap .info-box .row .item.onlytit{
    width: auto;
    flex: 0;
}
/* 오류 필드 스타일 */
.wrap .info-box .row .item.error{
    border: 2px solid #dc3545 !important;
    border-radius: 4px;
    /*animation: errorPulse 0.5s ease-in-out;*/
    z-index: 2;
}
.wrap .info-box .row .item.error .input-box input:not(input[type='date'],input[type='radio'],input[type='checkbox']){
    margin-bottom: 0px;
}

.wrap .info-box .row .item.sub-txt span{
    text-align: right;
    width: 100%;
    padding-top: 6px;
    font-size: 15px;
    color: red;
}
.wrap .info-box .row .item .tit{
    width: 110px;
    font-size: 13px;
    /*padding: 9px 7px 5px 5px;*/
    padding: 0px 7px 0px 5px;
    background-color: #001E5E;
    text-align: center;
    height: 38px;
}
.wrap .info-box .row .item .tit:not(:last-child){
    border-bottom:1px solid #fff;
}
.wrap .info-box .row.big .item .tit{
    height:70px;
    /*height:100%;*/
}
.wrap .info-box .row .item .tit.full{
    flex:1;
}
.wrap .info-box .row .item .tit.top-bor-rond{
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-size:14px;
}
.wrap .info-box .row .item .tit.full + .tit.full{
    margin-left:10px;
}
.wrap .info-box .row .item .tit.flex{
    display: flex;
    justify-content: space-around;
}
.wrap .info-box .row .item .tit.full{
    width:100%;
}
.wrap .info-box .row .item .tit.bgnon{
    background-color: transparent;   
}
.wrap .info-box .row .item .tit.bgsky{
    background-color: #DCEAF7;
}
.wrap .info-box .row .item .tit.bgsal{
    background-color: #fbe5d6;
}
.wrap .info-box .row .item .tit.gray{
    background-color: #EAEAEA;
}
.wrap .info-box .row .item .tit span{
    color:#fff;
    /*font-weight: bold;*/
    display: block;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    
}
.wrap .info-box .row .item .tit span.small{
    font-size:11px;
}
.wrap .info-box .row .item .tit.bgsal span,
.wrap .info-box .row .item .tit.bgsky span,
.wrap .info-box .row .item .tit.gray span{
    color:#000;
}
.wrap .info-box .row .item .tit.bgnon span{
    color:#000;
}
.wrap .info-box .row .item .tit .bor-line{
    width:2px;
    height:60%;
    padding-top:20%;
    background-color: #000;
}
.wrap .info-box .row .item .input-box{
    /*width: 78%;*/
    flex: 1;
    display: flex;
    align-items: center;
    gap: 3px;
    background-color: #fff;
    border-bottom: 1px solid #e2e8f0;
    height: 35px;
    min-height: 35px;
}
.wrap .info-box .row.big .item .input-box{
    height:70px;
}
.wrap .info-box .row .item .input-box .del-btn{
    display: block;
    cursor: pointer;
    width: 23px;
    height: 18px;
    background: url(/images/ic_del.png) no-repeat center;
    background-size: 100% 100%;
    margin-left: 5px;
}
.wrap .info-box .row .item .input-box.borbtm{
    border-bottom:1px solid #DCEAF7;
}
.wrap .info-box .row .item .input-box.checkbox{
    flex: 0;
    justify-content: center;
    align-items: center;
}
.wrap .info-box .row .item .input-box input:not(input[type='checkbox'],input[type='radio']){
    height: 100%;
    border:none;
    background-color: #fff;
    font-size:13px;
    margin-bottom: 0px;
}
.wrap .info-box .row .item .input-box.checkbox input[type="checkbox"]{
    width:25px;
    height:25px;
    margin-right: 0px;
}
.wrap .info-box .row .item .input-box label{
    padding: 5px;
    font-size:13px;
    padding-top:8px;
}

.wrap .info-box .row .item .input-box select{
    font-size:13px;
    padding-top: 5px;
    padding-left: 10px;
}
.wrap .info-box .row .item .input-box input:not(input[type='date'],input[type='radio'],input[type='checkbox']){
    padding:0 10px;
    margin-bottom:5px;
}
.wrap .info-box .row .item .input-box button + input,
.wrap .info-box .row .item .input-box input + button{
    margin-left:5px;
}
/* 기존 radio 스타일 (하위 호환성 유지) */
.wrap .info-box .row .item .input-box input[type="radio"]{
    width:20px;
    height:20px;
    padding:0;
    border: 1px solid #001E5E;
    cursor: pointer;
}
.wrap .info-box .row .item .input-box input[type="radio"]:checked{
    border: 5px solid #001E5E;
}
.wrap .info-box .row .item .input-box.center{
    justify-content: center;
}
.wrap .info-box .row .item .input-box.center input{
    text-align: center;
}
.wrap .info-box .row .item .input-box span{
    padding:5px;
    font-weight: bold;
}
.wrap .info-box .row .item .input-box textarea{
    resize: none;
    padding:10px;
}
.wrap .info-box .row .item .input-box .data-box-list{
    display: flex;
    width: auto;
    margin-right: 5px;
}
.wrap .info-box .row .item .input-box .data-box-list ul{
    display: flex;
    width: auto;
    max-width: 700px;
    overflow-x: auto;
}
.wrap .info-box .row .item .input-box .data-box-list ul.responsive{
    display: flex;
    width: auto;
    max-width: 1200px;
    overflow-x: auto;
}
.wrap .info-box .row .item .input-box .data-box-list ul.full{
    display: flex;
    width: auto;
    max-width: 100%;
    overflow-x: auto;
}
.wrap .info-box .row .item .input-box .data-box-list ul::-webkit-scrollbar {
    width: 8px;  /* 스크롤바의 너비 */
    height: 5px;
}
.wrap .info-box .row .item .input-box .data-box-list ul::-webkit-scrollbar-thumb {
    height: 30%; /* 스크롤바의 길이 */
    background: #6D87B9; /* 스크롤바의 색상 */
    border-radius: 10px;
}
.wrap .info-box .row .item .input-box .data-box-list ul::-webkit-scrollbar-track {
    background: rgba(109, 135, 185, .1);  /*스크롤바 뒷 배경 색상*/
}
.wrap .info-box .row .item .input-box .data-box-list ul li{
    position: relative;
    width: auto;
    background-color: #EAEAEA;
    display: flex;
    align-items: center;
    border-radius: 5px;
    /*padding:10px 8px;*/
    padding:2px 8px;
}
.wrap .info-box .row .item .input-box .data-box-list ul li + li{
    margin-left:10px;
}
.wrap .info-box .row .item .input-box .data-box-list ul li span{
    font-size:12px;
    font-weight: 500;
    width: auto;
    display: block;
    min-width: 35px;
    white-space: nowrap;  /* 줄바꿈 방지 설정 */
    cursor:pointer;
}
.wrap .info-box .row .item .input-box .data-box-list ul li a.del-btn{
    width:15px;
    height:15px;
    background: url(/images/ic_del.png) no-repeat center;
    background-size: 100% 100%;
    cursor: pointer;
}
.wrap .info-box .row .item .input-box .search-input-box{
    flex:1;
}
.wrap .info-box .row .item .input-box.row-flex{
    flex-direction: column;
}
.wrap .head li.tit{
    font-size:22px;
    
    color:#000;
    padding-top: 22px;
}
.wrap .head li{
    font-size: 15px;
    color:gray;
}
.wrap .head li a.btn-back{
    width:22px;
    height:22px;
    background: url(/images/left-arrow-b.png) no-repeat center;
    background-size: 100% 100%;
    cursor: pointer;
}
/*.wrap .info-box .row .item .input-box button{
    font-size: 13px;
    padding: 5px;
    width:100px;
    border-radius:20px;
    margin-left: 5px;
}*/
.wrap .info-box .row .item  .input-box .search{
    height:100%;
    min-width:80px;
    width:80px;
    font-size: 14px;
    padding: 2px 10px;
    padding-top: 5px;
    border-radius: 5px;
}

/*.wrap .info-box .row .item  .input-box .search:hover{
    background-color: #fff;
    color:#082b7e;
}
.wrap .info-box .row .item .input-box .search:active{
    color: #fff;
    background-color: #001E5E;
}*/
.wrap .info-box .row.sub-txt{
    border-right:0px;
}
.wrap .info-box .row.sub-txt span{
    text-align: right;
    width: 100%;
    padding-top: 6px;
    font-size: 15px;
    color: red;
}
.wrap .btn-box{
    text-align: end;
}
.wrap .right-box .info-box + .info-box{
    margin-top:10px;
}
.wrap .info-box .row .add-btn{
    background-color: #A2A6B0;
    margin-top: 5px;
    display: flex;
    justify-content: center;
    cursor: pointer;
    height: 25px;
    border: 0px;
    width: 100%;
    text-align: center;
}
.wrap .info-box .row .add-btn span{
    width: 100%;
    padding-top: 0px;
    font-weight: bold;
    font-size: 20px;
    color: #fff;
}
/*.wrap .info-box .row span.ess::after{
    content: "";
    display: inline-block;
    vertical-align: super;
    margin-left: 8px;
    margin-bottom:4px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background-color: #fe4040;
}*/
.wrap .info-box .row span.ess::before{
    content: '*';
    color: #ef4444;
    margin-right: 3px;
}

.table-container-box{
    height:100%;
}

.table-container-box.error{
    border: 2px solid #dc3545;
    border-radius: 4px;
    animation: errorPulse 0.5s ease-in-out;
}

.table-container-box .info-box{
    height:100%;
}

.table-container{
    height:calc(100% - 70px);
}

.table-container table{
    table-layout: fixed;
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.table-container .table-box{
    height:100%;
    overflow-y: auto;
    overflow-x: auto;
    width: auto;
}
/*
.table-container .table-box{
    height: calc(100vh - 220px);
    overflow-y: auto;
    overflow-x: auto;
    width: auto;
}
*/
.table-container .table-box::-webkit-scrollbar {
    width: 8px;  /* 스크롤바의 너비 */
    height: 16px;
}
.table-container .table-box::-webkit-scrollbar-thumb {
    height: 30%; /* 스크롤바의 길이 */
    /*background: #6D87B9; /* 스크롤바의 색상 */
    background: #BFBFBF;    
    border-radius: 10px;
}
.table-container .table-box::-webkit-scrollbar-track {
    background: rgba(109, 135, 185, .1);  /*스크롤바 뒷 배경 색상*/
}
.table-container table thead tr th{
    /*background-color:#DCEAF7;*/
    background-color:#0A1456;
    border-width:1px;
    border-top:1px solid #6D87B9;
    border-bottom:1px solid #6D87B9;
    height: 36px; /*40px*/
    /*padding: 2px;*/
    padding: 0px;
    font-size : 14px; /*14px*/
    font-weight:500;
    text-align: center;
    position: sticky;
    top: 0;
    z-index: 1;
    /*padding-top: 10px;*/
    cursor: pointer;
    vertical-align : middle;
    /*font-weight: bold;*/
    color: #fff;
}
.table-container table thead tr th.hide,
.table-container table tbody tr td.hide{
    /*visibility: hidden; 자리는 잡아주면서 없어지는 것*/ 
    display: none;
}
.table-container table thead tr th.over{
    font-size:10px;padding-top:0px;padding-top: 0px;position: relative;
}
.table-container table thead tr th.over span{
    position: absolute; margin-left: -19px;margin-top: 6px;
}
.table-container table tbody tr td{
    font-size : 13px;
    /*padding: 1px 0px; /*1px 0px*/
    padding: 0px 2px 1px 2px;
    height: 35px;
    width: 80px;
    text-align: center;
    /*border-bottom: 1px solid #EAEAEA;*/
    border-bottom: 1px solid #d1cece;
    vertical-align: middle;
    /*position: relative;*/    
}
.table-container table tbody tr td:first-child{
    padding-top:3px;
}
.table-container table tbody tr td.td-hidden{
    display:none;
}
.table-container table tbody tr td.link{
    /*background-color:#DCEAF7;*/
    background-color:#EFF6FF;
    /*background-color:#002060*/
    /*
    background-color:#e97132
    background-color: rgba(55, 82, 134, 0.2);*/
}
.table-container table tbody tr td input.cs{
    font-size: 13px;
    font-weight: bold;
    padding:4px;
    color:#001E5E;
}
.table-container table tbody tr td.outsource_on{
    /*background-color:#e97132*/
    background-color:#FFEDD5;   
}
.table-container table tbody tr td.outsource_on .cs{
    font-size: 13px;
    font-weight: bold;
    padding:4px;
    color:#EE6F2F;
}
.table-container table tbody tr.on td.on{
    background-color: rgba(55, 82, 134, 0.2);    
}
.table-container table tbody tr td .devide{
    display: flex;
    align-items: center;
}
.table-container table tbody tr td .devide.left .left{
    flex:0.3;
}
.table-container table tbody tr td .devide.left .right{
    flex:0.7;
}
.table-container table tbody tr td.w30{
    width:30px;
}
.table-container table tbody tr td.rowspan{
    padding-top:10px;
}
/*.table-container table tbody tr.n-bor td:nth-child(n+3){
    border-bottom:0px;
}*/
.table-container table tbody tr.n-bor td{
    border-bottom:0px;
}
.table-container table tbody tr td span.box{
    padding: 10px;
    border: 0px;
    border-radius: 5px;
    font-weight: bold;
    font-size:13px;
}
.table-container table tbody tr td span.box.green{
    background-color: rgba(53, 206, 160, 0.2);
    color: #35CEA0;
}
.table-container table tbody tr td span.box.blue{
    background-color: rgba(202, 238, 251, 0.5);
    color: #375286;
}
.table-container table tbody tr td .sub-info-box{
    height:20px;
    display: flex;
    align-items: center;
    gap: 5px;
}
.table-container table tbody tr td input:not([type="radio"],[type="checkbox"]){
    margin-bottom: 0px;
    font-size: 13px; /*13px*/
    height:30px;
    text-align: center;
    border: none;
    background-color: transparent;
    padding:2px 0px 0px 2px;
    /*padding: 5px;*/
}
.table-container table tbody tr td select{
    height:30px;
    margin-bottom:0px;
    display: flex;
    width:100%;
    padding: 5px 0px 5px 10px;
    font-size: 13px;
    background-position: center right .2rem;
    background-size: 12px;
}
.table-container table tbody tr td select.green{
    background-color: rgba(53, 206, 160, 0.2);
    color: #35CEA0;
    border:0px;
}
.table-container table tbody tr td select.blue{
    background-color: rgba(202, 238, 251, 0.5);
    color: #375286;
    border:0px;
}
.table-container table tbody tr td select.red{
    background-color: rgba(255, 65, 65, 0.2);
    color: #FF4141;
    border:0px;
}
.table-container table tbody tr td select option{
    font-size:13px;
}
.table-container table tbody tr td select option.red{
    color:red;
}
.table-container table tbody tr td select option.black{
    color:black;
}
.table-container table tbody tr td.sel-input:has(.sub-info-box){
     vertical-align: middle;
}
/*
.table-container table tbody tr td.sel-input:has(.sub-info-box) select{
    height:25px;
}
*/
.table-container table tbody tr td .sub-info-box{
    margin-top:2px;
}
.table-container table tbody tr td .sub-info-box input{
    /*height:25px;
    font-size : 12px;*/
    background-color: #fff;
    flex: 1;
}
.table-container table tbody tr td span{
    display: block;
    font-size:13px;
    white-space: nowrap;
}
.table-container table tbody tr td span.blue{
    background-color: rgba(202, 238, 251, 0.5);
    color: #375286;
    border:0px;
    /*padding:8px 11px 5px 11px;*/
    padding:5px 11px 5px 11px;
    border-radius:5px;
    font-weight: bold;
}
.table-container table tbody tr td span.green{
    background-color: rgba(53, 206, 160, 0.2);
    color: #35CEA0;
    border:0px;
    /*padding:8px 11px 5px 11px;*/
    padding:5px 11px 5px 11px;
    border-radius:5px;
    font-weight: bold;
}
.table-container table tbody tr td span.red{
    background-color: rgba(255, 65, 65, 0.2);
    color: #FF4141;
    border:0px;
    /*padding:8px 11px 5px 11px;*/
    padding:5px 11px 5px 11px;
    border-radius:5px;
    font-weight: bold;
}
.table-container table tbody tr td span.gray{
    background-color: rgba(234, 234, 234, 0.2);
    color: #8C8C8C;
    border:0px;
    /*padding:8px 11px 5px 11px;*/
    padding:5px 11px 5px 11px;
    border-radius:5px;
}
.table-container table tbody tr td span.dark_gray{
    background-color: rgba(109, 107, 107, 0.2);
    color: #000000;
    border:0px;
    /*padding:8px 11px 5px 11px;*/
    padding:5px 11px 5px 11px;
    border-radius:5px;
}
.table-container table tbody tr td .opt-box{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0px 5px;
    width: 100%;
}
.table-container table tbody tr td .opt-box.w-wide{
    width: 190px;
}
.table-container table tbody tr td .opt-box input.w70per{
    width: 70%;
}
.table-container table tbody tr td .opt-box input{
    /*flex:0.8;*/
}

.table-container table tbody tr td .opt-box button{
    height:30px;
    min-width:42px;
    margin-left:5px;
    font-size:12px;
    padding:6px 5px;
}

.table-container table tbody tr td a.btn{
    width: auto;
    border: 1px solid #001E5E;
    padding: 3px 10px 3px 10px;
    font-size: 12px;
    font-weight: bold;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    cursor: pointer;
    color: #001E5E;
}
.table-container table tbody tr td a.btn:active{
    background-color: #001E5E;
    color: #fff;
}
.table-container table tbody tr.on{
    background-color:rgba(187, 219, 249, 0.5);
}
/*
.table-container table tbody tr.on td{
    background-color:rgba(187, 219, 249, 0.5);
}*/
.table-container table tbody tr.on td:not(:first-child){
    background-color:rgba(187, 219, 249, 0.5);
}
.table-container table tbody tr.parent_on td{
    background-color:rgba(56, 95, 132, 0.5);
}
.table-container table tbody tr td .opt-box details{
    margin-bottom:0px;
    padding-bottom: 0px;
    border-bottom: 0px;
    border: none;
    width: 100%;
}
.table-container table tbody tr td .opt-box.w-wide details{
    margin-left: 10px;
}
.table-container table tbody tr td .opt-box details summary{
    margin-bottom:0px;
    height:35px;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    /*width: 70px;*/
    width: 100%;
}
.table-container table tbody tr td .opt-box details summary span{
    width: 80%;
}
.table-container table tbody tr td .opt-box details summary::after{
    background-size:12px;
    background-position: center right .2rem;
}
.table-container table tbody tr td .opt-box details[open] summary{
    margin-bottom:0px;
}
.table-container table tbody tr td .opt-box details summary.green{
    background-color: rgba(53, 206, 160, 0.2);
    color: #35CEA0;
}
.table-container table tbody tr td .opt-box details summary.green span{
    color: #35CEA0;
}
.table-container table tbody tr td .opt-box details summary.blue{
    background-color: rgba(202, 238, 251, 0.5);
    color: #375286;
}
.table-container table tbody tr td .opt-box details summary.blue span{
    color: #375286;
}
.table-container table tbody tr td .opt-box details summary.red{
    background-color: rgba(255, 65, 65, 0.2);
    color: #FF4141;
}
.table-container table tbody tr td .opt-box details summary.red span{
    color: #FF4141;
}
.table-container table tbody tr td .opt-box details ul{
    /*position: absolute;*/
    padding-left: 0px;
    margin-top: 0px;
    box-shadow: 0px 2px 10px 2px gray;
    background-color: #fff;
    z-index: 2;
    padding-bottom : 15px;
}
.table-container table tbody tr td .opt-box details ul li{
    height : 20px;
    padding:5px;
    margin-bottom: 5px;
    margin-top:0px;
}
.table-container table tbody tr td .opt-box details ul li + li{
    margin-top: 10px;
}
.table-container table tbody tr td .opt-box details ul li:hover{
    cursor:pointer;
}
.table-container table tbody tr td .opt-box details ul li a{
    margin: 0;
}
.table-container table tbody tr td .opt-box details ul li.green a{
    background-color: rgba(53, 206, 160, 0.2);
    color: #35CEA0;
    border:0px;
    border-radius: 5px;
}
.table-container table tbody tr td .opt-box details ul li.blue a{
    background-color: rgba(202, 238, 251, 0.5);
    color: #375286;
    border:0px;
    border-radius: 5px;
}
.table-container table tbody tr td .opt-box details ul li.red a{
    background-color: rgba(255, 65, 65, 0.2);
    color: #FF4141;
    border:0px;
    border-radius: 5px;
}
.table-container table tbody tr td .opt-box details ul li a img{
    width:20px;
}

.table-container .bord-bottom-box{
    display: flex;
    justify-content: space-between;
    margin-bottom: 5px;
}

.table-container .bord-bottom-box .sub-list{
    display:flex;
}
.table-container .bord-bottom-box .sum-box{
    flex:0.5;
    margin-top:15px;
}
.table-container .bord-bottom-box .sum-box + .sum-box{
    margin-right: 10px;
    margin-left: 10px;
}
.table-container .bord-bottom-box .sum-box .table-box{
    height: auto;
}
.table-container .bord-bottom-box .sum-box .table-box table{
    border: 1px solid #B5B5B5;
}
.table-container .bord-bottom-box .sum-box .table-box table th,
.table-container .bord-bottom-box .sum-box .table-box table td{
    height:30px;
    font-size:13px;
}
.table-container .bord-bottom-box .sum-box .table-box table td{
    border-right: 1px solid #B5B5B5;
    border-bottom: 1px solid #B5B5B5;
}
.table-container .bord-bottom-box .sum-box .table-box table td:last-child{
    border-right: none;
}
.table-container .bord-btn-list{
    display: flex;
    justify-content: end;
    padding : 20px 10px;
    align-items: self-start;
}
.table-container .bord-btn-list ul li{
    padding: 2px;
    font-size: 14px;
    font-weight:bold;
    height:30px;
    width:30px;
    display:flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #BBDBF9;
    color: #001E5E;
    border-radius: 10px;
}
.table-container .bord-btn-list ul li:hover{
    cursor: pointer;
    background-color: rgba(187, 219, 249, 0.8); 
}
.table-container .bord-btn-list ul li.on{
    background-color: rgba(187, 219, 249, 0.8); 
}
.table-container .bord-btn-list ul li.prev{
    border-color: #EFEFEF;
    background: url(/images/left-arrow-b.png) no-repeat center;
    background-color: #EFEFEF;
    background-size: 15px 15px;
}
.table-container .bord-btn-list ul li.prev:hover{
    background-color: rgba(187, 219, 249, 1); 
}
.table-container .bord-btn-list ul li.next{
    border-color: #EFEFEF;
    background: url(/images/right-arrow-b.png) no-repeat center;
    background-color: #EFEFEF;
    background-size: 15px 15px;
}
.table-container .bord-btn-list ul li.next:hover{
    background-color: rgba(187, 219, 249, 1); 
    border-color: rgba(187, 219, 249, 1); 
}
.table-container .bord-btn-list ul li + li{
    margin-left: 10px;
}
.table-container .bord-btn-list ul li span{
    font-size:15px;
    margin-top: 4px;
}
.table-container .bord-btn-list ul li.prev_double{
    border-color: #EFEFEF;
    background: url(/images/left-arrow-b-double.png) no-repeat center;
    background-color: #EFEFEF;
    background-size: 15px 15px;
}
.table-container .bord-btn-list ul li.prev_double:hover{
    background-color: rgba(187, 219, 249, 1); 
}
.table-container .bord-btn-list ul li.next_double{
    border-color: #EFEFEF;
    background: url(/images/right-arrow-b-double.png) no-repeat center;
    background-color: #EFEFEF;
    background-size: 15px 15px;
}
.table-container .bord-btn-list ul li.next_double:hover{
    background-color: rgba(187, 219, 249, 1); 
    border-color: rgba(187, 219, 249, 1); 
}
.table-container .bord-btn-list ul li:active{
    background-color: #001E5E;
}
.table-container .bord-btn-list ul li:active span{
    color:#fff;
}
.table-container .bord-btn-list ul li.prev:active{
    background: url(/images/right-arrow-w.png) no-repeat center;
    transform: rotate(180deg);
    background-size: 15px 15px;
    background-color: #001E5E;
}
.table-container .bord-btn-list ul li.next:active{
    background: url(/images/right-arrow-w.png) no-repeat center;
    background-size: 15px 15px;
    background-color: #001E5E;
}
.table-container .bord-btn-list ul li.next_double:active{
    background: url(/images/right-arrow-w-double.png) no-repeat center;
    background-size: 15px 15px;
    background-color: #001E5E;
}
.table-container .bord-btn-list ul li.prev_double:active{
    background: url(/images/left-arrow-w-double.png) no-repeat center;
    background-size: 15px 15px;
    background-color: #001E5E;
}

/*
    2025-11-06 김경식
    추가된 css 시작
*/
.table-container table tbody tr td span.ellipsis{
    display: inline-block;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: left;
    padding: 0px 10px;
    padding-top:7px;
}
.table-container table tbody tr td span.ellipsis.center{
    text-align: center;
}
/*
    추가된 css 끝끝
*/

@media (max-width: 1900px) {
    .wrap .info-box .row .item .input-box .data-box-list ul.responsive{
        max-width: 1050px;
    }
}
@media (max-width: 1800px) {
    .wrap .info-box .row .item .input-box .data-box-list ul.responsive{
        max-width: 1000px;
    }
}
@media (max-width: 1900px) {
    .wrap .info-box .row .item .input-box .data-box-list ul.responsive{
        max-width: 1100px;
    }
}
@media (max-width: 1700px) {
    .wrap .info-box .row .item .input-box .data-box-list ul.responsive{
        max-width: 900px;
    }
}
@media (max-width: 1500px) {
    .wrap .info-box .row .item .input-box .data-box-list ul.responsive{
        max-width: 800px;
    }
}
@media (max-width: 1300px) {
    .wrap .info-box .row .item .input-box .data-box-list ul.responsive{
        max-width: 700px;
    }
}
@media (max-width: 1100px) {
    .wrap .info-box .row .item .input-box .data-box-list ul.responsive{
        max-width: 650px;
    }
}


/*
    2025-11-20 김경식
    추가된 공통 css 시작  
*/
/*
    item 영역 중 flex:none 인 경우 처리
    뒤에 input-box 크기 지정해서 사용하기위해
*/
.wrap .info-box .row .item.flex-none{
    flex:none;
}
/*
    flex-none 인 경우 처리
    날짜 입력 영역 처리 크기 지정정
*/
.wrap .info-box .row .item.flex-none .input-box.date{
    width: 150px;
}
/*
    flex-none 인 경우 처리
    라디오 두개중 선택인 것 영역 지정정
*/
.wrap .info-box .row .item.flex-none .input-box.radio-two-select{
    width: 150px;
    border-bottom: 1px solid #DCEAF7;
}
/*
    코드 입력 영역 처리 크기 지정
*/
.wrap .info-box .row .item .input-box input.input-code{
    width: 50px;
}

/*
    공통 input-box 스타일 (2025-11-20 리팩토링)
    radio, checkbox, label 등 공통 스타일
*/
.wrap .info-box .row .item .input-box.radio-two-select{
    background: transparent;
    border: none;
    padding: 0;
    gap: 20px;
    height: auto;
    min-height: auto;
}

.wrap .info-box .row .item .input-box.radio-two-select label{
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    color: #374151;
    cursor: pointer;
    padding: 0;
    margin: 0;
}

.wrap .info-box .row .item .input-box.radio-two-select input[type='radio']{
    width: 18px;
    height: 18px;
    margin: 0;
    cursor: pointer;
    accent-color: #001E5E;
}

/* 공통 label 스타일 */
.wrap .info-box .row .item .input-box label{
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    color: #374151;
    cursor: pointer;
    padding: 0;
    margin: 0;
    white-space: nowrap;
}

/* 모던 radio 스타일 (accent-color 사용, 18px) - 필요시 사용 */
.wrap .info-box .row .item .input-box input[type='radio'].modern{
    width: 18px;
    height: 18px;
    margin: 0;
    cursor: pointer;
    accent-color: #001E5E;
    border: none;
}

/* 공통 checkbox 스타일 */
.wrap .info-box .row .item .input-box input[type='checkbox']{
    width: 18px;
    height: 18px;
    margin: 0;
    cursor: pointer;
    accent-color: #001E5E;
}

/* 체크박스/라디오가 여러 개인 경우 공통 스타일 */
.wrap .info-box .row .item .input-box:has(input[type='checkbox']),
.wrap .info-box .row .item .input-box:has(input[type='radio']){
    flex-wrap: wrap;
    height: auto;
    min-height: 35px;
    gap: 12px;
    align-items: center;
}

/* readonly 스타일 공통 */
.wrap .info-box .row .item .input-box input[type='text']:readonly,
.wrap .info-box .row .item .input-box input[type='date']:readonly{
    background-color: #f9fafb;
    color: #6b7280;
}

/* placeholder 스타일 공통 */
.wrap .info-box .row .item .input-box input[type='text']::placeholder,
.wrap .info-box .row .item .input-box input[type='date']::placeholder{
    color: #9ca3af;
}

/* date input-box 공통 스타일 */
.wrap .info-box .row .item .input-box.date{
    padding: 0 8px;
}

/*
    2025-11-20 김경식
    .info-box .row 기준 공통 스타일 추가
    다른 페이지에서도 사용 가능하도록 공통화
*/
/* 공통 row 스타일 */
.info-box .row{
    display: flex;
    gap: 15px;
    margin-bottom: 1px;
    align-items: flex-start;
}

.info-box .row:last-child{
    margin-bottom: 0;
}

/* 공통 item-box, item 스타일 */
.info-box .row .item-box,
.info-box .row .item{
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    border-top: 0px;
}

/* 공통 item.flex-none 스타일 */
.info-box .row .item.flex-none{
    flex: 0 0 auto;
    min-width: 200px;
}

/* 공통 item.big 스타일 */
.info-box .row .item.big{
    flex: 2;
}

/* 공통 tit 스타일 */
.info-box .row .item .tit{
    min-width: 120px;
    flex-shrink: 0;
    font-size: 13px;
    font-weight: 500;
    padding: 8px 12px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 35px;
}

/* 공통 tit.bgsky 스타일 */
.info-box .row .item .tit.bgsky{
    background-color: #DCEAF7;
    color: #000;
}

/* 공통 tit span 스타일 */
.info-box .row .item .tit span{
    color: #000;
    font-size: 13px;
    line-height: 1.4;
    text-align: center;
}

/* 공통 tit span.small 스타일 */
.info-box .row .item .tit span.small{
    font-size: 11px;
}

/*
    2025-11-20 김경식
    추가된 공통 css 끝
*/


/*
2025-12-18 김경식
추가된 css 시작
*/

.table-container table thead tr th.ess::before{
    content: '*';
    color: #ef4444;
    margin-right: 3px;
}

/*
2025-12-18 김경식
추가된 css 끝
*/


/*
2025-12-22 css 추가 시작
*/

   /* 조회 버튼 스타일 */
.table-container table tbody tr td .btn-nav {
    min-width: 50px;
    height: 28px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 500;
    color: #001E5E;
    background-color: #fff;
    border: 1px solid #001E5E;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.table-container table tbody tr td .btn-nav:hover {
    background-color: #001E5E;
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 30, 94, 0.2);
}

.table-container table tbody tr td .btn-nav:active {
    transform: translateY(0);
    box-shadow: 0 1px 2px rgba(0, 30, 94, 0.2);
}

/* 버튼이 있는 셀은 기본 cursor 유지 */
.table-container table tbody tr td:has(.btn-nav) {
    cursor: default;
}

/*
2025-12-22 css 추가 종료
*/
/* 오류통보 상태 스타일 */
.table-container table tbody tr td.error-state {
    background-color: #fee2e2 !important;
    color: #dc2626;
    font-weight: 600;
    position: relative;
    padding-left: 24px !important;
}

.table-container table tbody tr td.error-state::before {
    content: '⚠';
    position: absolute;
    left: 6px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    line-height: 1;
}

.table-container table tbody tr td.error-state.clickable {
    cursor: pointer;
    transition: all 0.2s ease;
}

.table-container table tbody tr td.error-state.clickable:hover {
    background-color: #fecaca !important;
    box-shadow: inset 0 0 0 2px #ef4444;
}

.table-container table tbody tr:hover td.error-state {
    background-color: #fecaca !important;
}

.table-container table tbody tr.selected td.error-state {
    background: rgba(254, 226, 226, 0.9) !important;
    border: 2px solid #ef4444;
}

/* 접수 상태 스타일 */
.table-container table tbody tr td.submission-state {
    background-color: #dbeafe !important;
    color: #2563eb;
    font-weight: 600;
    position: relative;
    padding-left: 24px !important;
}

.table-container table tbody tr td.submission-state::before {
    content: '✓';
    position: absolute;
    left: 6px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    line-height: 1;
}

.table-container table tbody tr td.submission-state.clickable {
    cursor: pointer;
    transition: all 0.2s ease;
}

.table-container table tbody tr td.submission-state.clickable:hover {
    background-color: #bfdbfe !important;
    box-shadow: inset 0 0 0 2px #3b82f6;
}

.table-container table tbody tr:hover td.submission-state {
    background-color: #bfdbfe !important;
}

.table-container table tbody tr.selected td.submission-state {
    background: rgba(219, 234, 254, 0.9) !important;
    border: 2px solid #3b82f6;
}


/*응닫대기 상태 스타일*/
.table-container table tbody tr td.waiting-state {
    background-color: #fde68a !important;
    color: #d97706;
    font-weight: 600;
    position: relative;
    padding-left: 24px !important;
}

.table-container table tbody tr td.waiting-state::before {
    content: '⏳';
    position: absolute;
    left: 6px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    line-height: 1;
}

.table-container table tbody tr td.waiting-state.clickable {
    cursor: pointer;
    transition: all 0.2s ease;
}

.table-container table tbody tr td.waiting-state.clickable:hover {
    background-color: #fef9c3 !important;
    box-shadow: inset 0 0 0 2px #f59e0b;
}

.table-container table tbody tr:hover td.waiting-state {
    background-color: #fef9c3 !important;
}

.table-container table tbody tr.selected td.waiting-state {
    background: rgba(254, 249, 195, 0.9) !important;
    border: 2px solid #f59e0b;
}   

/* 완료 상태 스타일 */
.table-container table tbody tr td.complete-state {
    background-color: #dcfce7 !important;
    color: #166534;
    font-weight: 600;
    position: relative;
    padding-left: 24px !important;
}

.table-container table tbody tr td.complete-state::before {
    content: '✓';
    position: absolute;
    left: 6px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    line-height: 1;
}

.table-container table tbody tr td.complete-state.clickable {
    cursor: pointer;
    transition: all 0.2s ease;
}

.table-container table tbody tr td.complete-state.clickable:hover {
    background-color: #bbf7d0 !important;
    box-shadow: inset 0 0 0 2px #22c55e;
}

.table-container table tbody tr:hover td.complete-state {
    background-color: #bbf7d0 !important;
}

.table-container table tbody tr.selected td.complete-state {
    background: rgba(220, 252, 231, 0.9) !important;
    border: 2px solid #22c55e;
}
















.page .right-panel {
    width: 420px;
    background: #f8f9fa;
    /*border-left: 1px solid #e9ecef;*/
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

/* 탭 헤더 스타일 */
.page .right-panel .tab-header{
    display: flex;
    background: #fff;
    border-bottom: 2px solid #e9ecef;
    flex-shrink: 0;
}

.page .right-panel .tab-header .tab-btn{
    flex: 1;
    padding: 12px 10px;
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: #6c757d;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s ease;
    position: relative;
}

.page .right-panel .tab-header .tab-btn.error span{
    color: #dc3545;
}

.page .right-panel .tab-header .tab-btn:hover{
    /*background: #f8f9fa;*/
    color: #001E5E;
}

.page .right-panel .tab-header .tab-btn.active{
    color: #001E5E;
    border-bottom-color: #001E5E;
    font-weight: 600;
    background: #fff;
    border-radius: 0px;
}

.page .right-panel .tab-header .tab-btn.error.active{
    color: #dc3545;
    border-bottom-color: #dc3545;
    font-weight: 600;
    background: #fff;
    border-radius: 0px;
}

.page .right-panel .tab-header .tab-btn.error:hover{
    color: #dc3545;
    border-bottom-color: #dc3545;
    font-weight: 600;
    background: #fff;
    border-radius: 0px;
}

.page .right-panel .tab-header .tab-btn.complete span{
    color: #28a745;
}

.page .right-panel .tab-header .tab-btn.complete:hover{
    color: #28a745;
    border-bottom-color: #28a745;
    font-weight: 600;
    background: #fff;
    border-radius: 0px;
}

.page .right-panel .tab-header .tab-btn.complete.active{
    color: #28a745;
    border-bottom-color: #28a745;
    font-weight: 600;
    background: #fff;
    border-radius: 0px;
}

.page .right-panel .tab-header .tab-btn.submission span{
    color: #2563eb;
}

.page .right-panel .tab-header .tab-btn.submission:hover{
    color: #2563eb;
    border-bottom-color: #2563eb;
    font-weight: 600;
    background: #fff;
    border-radius: 0px;
}

.page .right-panel .tab-header .tab-btn.submission.active{
    color: #2563eb;
    border-bottom-color: #2563eb;
    font-weight: 600;
}

.page .right-panel .tab-header .tab-btn.waiting span{
    color: #d97706;
}

.page .right-panel .tab-header .tab-btn.waiting:hover{
    color: #d97706;
    border-bottom-color: #d97706;
    font-weight: 600;
    background: #fff;
    border-radius: 0px;
}

.page .right-panel .tab-header .tab-btn.waiting.active{
    color: #d97706;
    border-bottom-color: #d97706;
    font-weight: 600;
}

.page .right-panel .tab-header .tab-btn.complete.active .tab-badge{
    background: #28a745;
}

.page .right-panel .tab-header .tab-btn span.tab-badge{
    background: #dc3545;
    color: #fff;
    border-radius: 12px;
    padding: 2px 8px;
    font-size: 11px;
    font-weight: 600;
    min-width: 20px;
    text-align: center;
    line-height: 1.4;
}

.page .right-panel .tab-header .tab-btn.active .tab-badge{
    background: #dc3545;
}

/* 탭 컨텐츠 스타일 */
.page .right-panel .tab-content{
    flex: 1;
    overflow-y: auto;
    background: #fff;
}

/* 채팅 섹션 */
.page .right-panel .chat-section {
    background: white;
    border-bottom: 1px solid #e9ecef;
    height: 300px;
    display: flex;
    flex-direction: column;
}

.page .right-panel .chat-header {
    padding: 15px;
    border-bottom: 1px solid #e9ecef;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #001E5E;
    color: white;
}

.page .right-panel .chat-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.page .right-panel .chat-status {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
}

.page .right-panel .status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #28a745;
}

.page .right-panel .chat-messages {
    flex: 1;
    padding: 15px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.page .right-panel .message {
    display: flex;
    flex-direction: column;
}

.page .right-panel .message.system .message-content {
    background: #e9ecef;
    padding: 8px 12px;
    border-radius: 8px;
    max-width: 80%;
    align-self: center;
}

.page .right-panel .message.user .message-content {
    background: #007bff;
    color: white;
    padding: 8px 12px;
    border-radius: 8px;
    max-width: 80%;
    align-self: flex-end;
}

.page .right-panel .message.assistant .message-content {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    padding: 8px 12px;
    border-radius: 8px;
    max-width: 80%;
    align-self: flex-start;
}

.page .right-panel .message-time {
    font-size: 10px;
    color: #6c757d;
    margin-bottom: 4px;
    display: block;
}

.page .right-panel .message-text {
    font-size: 13px;
    line-height: 1.4;
}

.page .right-panel .chat-input {
    padding: 15px;
    border-top: 1px solid #e9ecef;
    display: flex;
    gap: 10px;
}

.page .right-panel .chat-input input {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    font-size: 13px;
}

.page .right-panel .send-btn {
    padding: 8px 16px;
    background: #001E5E;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
}

.page .right-panel .send-btn:hover {
    background: #001a4d;
}

/* 정보 섹션 */
.page .right-panel .info-section {
    background: white;
    border-bottom: 1px solid #e9ecef;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.page .right-panel .info-header {
    padding: 15px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.page .right-panel .info-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #001E5E;
}

.page .right-panel .info-content {
    padding: 15px;
    flex: 1;
    overflow-y: auto;
}

.page .right-panel .info-item {
    margin-bottom: 20px;
}

.page .right-panel .info-item h4 {
    margin: 0 0 10px 0;
    font-size: 14px;
    font-weight: 600;
    color: #001E5E;
    border-bottom: 2px solid #001E5E;
    padding-bottom: 5px;
}

.page .right-panel .info-item ul {
    margin: 0;
    padding-left: 20px;
}

.page .right-panel .info-item li {
    font-size: 12px;
    line-height: 1.5;
    margin-bottom: 5px;
    color: #495057;
}

/* 진행상황 섹션 */
.page .right-panel .progress-section {
    background: white;
    border-top: 1px solid #e9ecef;
}

.page .right-panel .progress-header {
    padding: 15px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.page .right-panel .progress-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #001E5E;
}

.page .right-panel .progress-content {
    padding: 15px;
}

.page .right-panel .progress-item {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    padding: 8px;
    border-radius: 4px;
}

.page .right-panel .progress-item.completed {
    background: #d4edda;
    color: #155724;
}

.page .right-panel .progress-item.current {
    background: #cce5ff;
    color: #004085;
    font-weight: 600;
}

.page .right-panel .progress-item:not(.completed):not(.current) {
    background: #f8f9fa;
    color: #6c757d;
}

.page .right-panel .progress-icon {
    font-size: 16px;
    font-weight: bold;
}

.page .right-panel .progress-text {
    font-size: 13px;
}

.page .table-container table {
    width:0px;
}

.page .table-box--scrollable table tbody tr.selected td{
    background-color: #f3f4f6;
}

/* 오류 섹션 스타일 */
.page .right-panel .error-section{
    background: white;
    border: none;
    border-bottom: none;
    margin-bottom: 0;
    padding: 0;
}

.page .right-panel .error-section .error-header{
    background: #dc3545;
    color: #fff;
    padding: 12px 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0;
}

.page .right-panel .error-section .error-header h3{
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
}

.page .right-panel .error-section .error-header .error-badge{
    background: #fff;
    color: #dc3545;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    flex-shrink: 0;
}

.page .right-panel .error-section .error-content{
    padding: 15px;
    max-height: 465px;
    overflow-y: auto;
    background: #fff;
}

.page .right-panel .error-section .error-item{
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #fee;
}

.page .right-panel .error-section .error-item:last-child{
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.page .right-panel .error-section .error-field{
    color: #dc3545;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 5px;
    cursor: pointer;
}

.page .right-panel .error-section .error-message{
    color: #374151;
    font-size: 13px;
    line-height: 1.5;
}

.page .right-panel .error-empty{
    padding: 40px 20px;
    text-align: center;
    color: #6b7280;
    font-size: 14px;
    color: #718096;
    background: #fff;
    /*border: 1px solid #e9ecef;*/
}
.page .right-panel .error-empty .empty-message{
    color: #718096;
    font-size: 14px;
}


/* 결과 정보 섹션 스타일 */
.result-section {
    padding: 20px;
    padding-top:0px;
    overflow-y: auto;
    height: 100%;
}

.result-section .rtn-progress-content {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.result-section .info-section {
    margin-bottom: 0;
}

.result-section .info-row {
    display: flex;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
}

.result-section .info-row:last-child {
    border-bottom: none;
}

.result-section .info-label {
    width: 120px;
    font-weight: 600;
    color: #4a5568;
    font-size: 14px;
    flex-shrink: 0;
}

.result-section .info-value {
    flex: 1;
    color: #2d3748;
    font-size: 14px;
    word-break: break-all;
}

.result-section .error-section {
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 20px;
    margin-top: 0;
}

.result-section .error-header {
    display: flex;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #fecaca;
}

.result-section .error-icon {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}

.result-section .error-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #dc2626;
}

.result-section .error-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.result-section .error-row {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.result-section .error-label {
    font-weight: 600;
    color: #991b1b;
    font-size: 13px;
}

.result-section .error-description {
    color: #7f1d1d;
    font-size: 14px;
    line-height: 1.6;
    padding: 12px;
    background: #fff;
    border-radius: 4px;
    border: 1px solid #fecaca;
    word-break: keep-all;
}

.result-section .empty-message {
    text-align: center;
    padding: 40px 20px;
    color: #718096;
    font-size: 14px;
}

/* 결과 통보(통과) 섹션 - 오류 정보와 대칭되는 시각적 강조 */
.result-section .success-section {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 8px;
    overflow: hidden;
    margin-top: 0;
}

/* 결과 통보(통과) 섹션 - 오류 정보와 대칭되는 시각적 강조 */
.result-section .success-section {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 8px;
    overflow: hidden;
    margin-top: 4px;
}

/* 접수통보 submission-section 스타일 (파란 계열) */
.result-section .success-section.submission-section {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    margin-top:4px;
}

.result-section .success-section.submission-section .success-header {
    background: #2563eb;
}

.result-section .success-section.submission-section .success-content .info-row {
    border-bottom-color: #dbeafe;
}

.result-section .success-section.submission-section .success-content .info-label {
    color: #1d4ed8;
}

.result-section .success-section.submission-section .success-content .info-value {
    color: #2563eb;
}

.result-section .success-header {
    background: #28a745;
    color: #fff;
    padding: 12px 15px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.result-section .success-icon {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.result-section .success-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
}

.result-section .success-content {
    padding: 15px;
    background: #fff;
}

.result-section .success-content .info-row {
    border-bottom-color: #dcfce7;
}

.result-section .success-content .info-label {
    color: #166534;
}

.result-section .success-content .info-value {
    color: #15803d;
}