.checksheet{
    width:100%;
    /*height: 100%;*/
    position: relative;
}

.checksheet .devide-box{
    display: flex;
    margin-top:5px;
    height: 315px;
}

.checksheet .devide-box.abs{
    position: absolute;
    margin-top: -30px;
    width: 50%;
    height:auto;
}

.checksheet .devide-box .left-box{
    flex:1;
}

.checksheet .devide-box .right-box{
    flex:1;
    margin-left: 10px;
}

.checksheet .devide-box.abs .left-box{
    flex:none;
    width:100%;
}


.checksheet .info-box{
    width:100%;
}

.checksheet .info-box +  .info-box{
    margin-top:10px;
}

.checksheet .info-box .row{
    width:100%;
    display:flex;
    height:32px;
}

.checksheet .info-box .row.list{
    flex-direction: column;
}

.checksheet .info-box .row.hauto{
    height:auto;
}

.checksheet .info-box .row + .row{
    margin-top:2px;
}

.checksheet .info-box .row .item{
    flex: 1;
    /*border-bottom: 1px solid #DCEAF7;*/
    border-bottom: 1px solid #f1f1f1;
    display: flex;
}

.checksheet .info-box .row .item.nobor{
    flex: none;
    border-bottom:none;
}

.checksheet .info-box .row .item.nobor + .item.nobor{
    /*margin-left: 10px;*/
    margin-left: 1px;
}

.checksheet .info-box .row .item.col{
    flex-direction: column;
    width:100%;
}

.checksheet .info-box .row .item.onlytit{
    width:auto;
    flex: 0;
}

.checksheet .info-box .row .item.marginl{
    margin-left: 10px;
}


.checksheet .info-box .row .item a.btn-dropdown{
    height:20px;
    cursor:pointer;
    width:100%;
    background-color:#EAEAEA;
    display:flex;
    justify-content: center;
}
.checksheet .info-box .row .item a.btn-dropdown:active{
    background-color:#DCEAF7;
}


.checksheet .info-box .row .item a.btn-dropdown i.icon{
    display:block;
    height:15px;
    width:150px;
    /*background: url(/images/icon_down_arrow.png) no-repeat center;*/
    background-size: 100% 100%;
}


.checksheet .info-box .row .item a.btn-dropdown i.icon.rev{
    /*transform: rotate(180deg);*/
}

.checksheet .info-box .row .item .tit{
    width: 100px;
    font-size: 14px;
    /*padding: 9px 7px 5px 5px;*/
    padding: 4px 7px 0px 5px;
    background-color: #001E5E;
    /*background-color:#f5f5f5;*/
    
    text-align: center;
    height: 30px;
}

.checksheet .info-box .row .item.nobor .tit{
    width:auto;
    /*background-color:#efefef;*/
    background-color:#fff;
    
}

.checksheet .info-box .row .item.nobor .tit.w85{
    width:85px;
}


.checksheet .info-box .row .item.col .tit{
    width:100%;
}

.checksheet .info-box .row .item .tit.rowspan2{
    height:67px;
    z-index: 2;
    /*display: flex;
    align-items: center;
    justify-content: center;*/
}

.checksheet .info-box .row .item .tit.rowspan4{
    height:134px;
    z-index: 2;
}


.checksheet .info-box .row .item .tit.bggreen{
    background-color: #38CFA2;
}

.checksheet .info-box .row .item .tit.bgorange{
    background-color: #FBE3D6;   
}

.checksheet .info-box .row .item .tit.bgorange span{
    /*color:#000;*/
}

.checksheet .info-box .row .item .tit.bgsky{
    background-color: #DCEAF7;
}

.checksheet .info-box .row .item .tit.gray{
        /*background-color: #EAEAEA;*/
    background-color: #f5f5f5;    
}
.checksheet .info-box .row .item .tit span{
    color:#fff;
    /*font-weight: bold;*/
    display: block;
    height: 100%;
    /*font-family: "Pretendard", system-ui, arial, sans-serif;*/
}

.checksheet .info-box .row .item.nobor .tit span{
    color:#000;
    font-weight: bold;
}

.checksheet .info-box .row .item .tit.rowspan2 span,
.checksheet .info-box .row .item .tit.rowspan4 span{
    display: flex;
    align-items: center;
    justify-content: center;
}



.checksheet .info-box .row .item .tit.bgsky span{
    color:#000;
}

.checksheet .info-box .row .item .tit.gray span{
    color:#000;
}

.checksheet .info-box .row .item .input-box{
    /*width: 78%;*/
    flex:1;
    height: 100%;
    display: flex;
    padding: 2px 5px;
    border-top:1px solid #DCEAF7;
}

.checksheet .info-box .row .item.nobor .input-box{
    border-top:none;
}

.checksheet .info-box .row .item.nobor .input-box.sel{
    flex: none;
    width: 80px;
    font-size: 13px;
    text-align: center;
    margin-top: -4px;
}


.checksheet .info-box .row .item .input-box.bordr{
    border-right:1px solid #DCEAF7;
}

.checksheet .info-box .row .item .input-box input{
    height: 100%;
    border:none;
    background-color: #fff;
    font-size:13px;
    margin-bottom:0px;
    padding-right:0px;
}

.checksheet .info-box.top .row .item .tit{
    /*padding: 7px 5px 0px 0px;*/
    background-color: rgb(245 245 245)
}

.checksheet .info-box.top .row .item .input-box input{
    width: 105px;
    /*padding: 8px 12px 5px 2px;*/
    --pico-icon-position: 0rem;
}

.checksheet .info-box.top .row .item .input-box input[type='datetime-local']{
    width:185px;
}

.checksheet .info-box .row .item .input-box .txt{
    width: 100%;
    margin-top: 2px;
}

.checksheet .info-box .row .item .input-box .txt span{
    font-size: 13px;
    padding: 3px;
    border-radius: 5px;
    display: block;
    width: 100%;
    height: 23px;
    text-align: center;
    font-weight: bold;
}

.checksheet .info-box .row .item .input-box .txt span.green{
    color: #38CFA2;
    background-color: rgba(56,207,162,0.2);
}

.checksheet .info-box .row .item .input-box .txt span.red{
    background-color: rgba(255, 65, 65, 0.2);
    color: #FF4141; 
}

.checksheet .info-box .row .item .input-box .txt span.blue{
    background-color: rgba(202, 238, 251, 1);
    color: #375286;
}

.checksheet .info-box .row .item .input-box button{
    font-size: 13px;
    padding: 4px;
    width:100px;
    background-color: #fff;
    color:#001E5E;
    border-radius:20px;
    margin-left: 5px;
}

.checksheet .info-box .row .item .input-box button.green{
    color: #38CFA2;
    border-color: #38CFA2;
}

.checksheet .info-box .row .item .input-box button.green:active{
    background-color: #38CFA2;
    color:#fff;
}

.checksheet .info-box .row .item .input-box button:hover{
    background-color: rgba(202, 238, 251, 1);
}

.checksheet .info-box .row .item .input-box button:active{
    background-color: #001E5E;
    color:#fff;
}


.checksheet .info-box .row .item .input-box .hold{
    width: 70px;
    height: 23px;
    /*background: #2ecc71;*/
    background: linear-gradient(to bottom, #ff7f50, #ff6347);
    /*background: linear-gradient(to bottom, #f8a587, #fa684f);*/
    color: white;
    border: none;
    border-radius: 15px;
    font-size: 13px;
    cursor: pointer;
    
    /*box-shadow: 0px 4px 0px #27ae60;*/
    box-shadow: 0px 4px 0px #d84315, 0px 6px 10px rgba(0, 0, 0, 0.2);
    transition: all 0.1s ease-in-out;
    /*
    box-shadow: 0px 2px 0px #27ae60;
    transform: translateY(3px);
    */
   
}
.checksheet .info-box .row .item .input-box .hold:active{
    box-shadow: 0px 2px 0px #c0392b; /* 눌릴 때 그림자 축소 */
    transform: translateY(2px); /* 버튼이 살짝 내려감 */
}
.checksheet .info-box .row .item .input-box .hold_push{
    width: 70px;
    height: 23px;
    /*background-color: #e74c3c;*/
    background: linear-gradient(to bottom, #ff7f50, #ff6347);
    color: white;
    border: none;
    border-radius: 15px;
    font-size: 13px;
    cursor: pointer;
    
    box-shadow: inset 2px 12px 2px rgba(0, 0, 0, 0.2);
    transform: translateY(2px); 
    /*
    box-shadow: inset 2px 12px 2px rgba(0, 0, 0, 0.2);
    transform: translateY(2px);
    */
    /*
    box-shadow: 0px 2px 0px #c0392b;
    transform: translateY(2px); 
    */
}


.checksheet .info-box .row .item .input-box button.black:hover{
    background-color: #8a8a8a;
    color:#fff;
}


.checksheet .info-box .row .item .input-box button.black:active{
    background-color: #38CFA2;
    color:#fff;
}



.checksheet .info-box .row .item .input-box select{
    height: 100%;
    border:none;
    background-color: #fff;
    font-size:13px;
}

.checksheet .info-box .row .item.nobor .input-box select{
    padding:2px;
    min-width: 50px;
}

.checksheet .info-box .row .item .input-box textarea{
    padding: 10px;
    font-size: 13px;
    resize: none;
}

.checksheet .info-box .row .item .input-box textarea::-webkit-scrollbar {
    width: 8px;  /* 스크롤바의 너비 */
    height: 8px;
}

.checksheet .info-box .row .item .input-box textarea::-webkit-scrollbar-thumb {
    height: 30%; /* 스크롤바의 길이 */
    background: #6D87B9; /* 스크롤바의 색상 */
    border-radius: 10px;
}

.checksheet .info-box .row .item .input-box textarea::-webkit-scrollbar-track {
    background: rgba(109, 135, 185, .1);  /*스크롤바 뒷 배경 색상*/
}

.checksheet .info-box .row .item .input-box select.green{
    color:green;
}

.checksheet .info-box .row .item .input-box select.red{
    color:red;
}

.checksheet .info-box .row .table-container.cntr{
    width: 100%;
}

.checksheet .info-box .row .table-container.size{
    width: 100%;
}

.checksheet .info-box .row .table-container + .table-container{
    margin-left: 10px;
}

.checksheet .info-box .row .table-box{
    max-height: 156px;
    height: auto;
    overflow-y: auto;
}

.checksheet .info-box .row .table-box::-webkit-scrollbar {
    width: 8px;  /* 스크롤바의 너비 */
    height: 8px;
}

.checksheet .info-box .row .table-box::-webkit-scrollbar-thumb {
    height: 30%; /* 스크롤바의 길이 */
    background: #6D87B9; /* 스크롤바의 색상 */
    
    border-radius: 10px;
}

.checksheet .info-box .row .table-box::-webkit-scrollbar-track {
    background: rgba(109, 135, 185, .1);  /*스크롤바 뒷 배경 색상*/
}



.checksheet .info-box .row .table-box thead th{
   width:23%;
   border-top:none;
   border-bottom: none;
   background-color: #001E5E;
   color:#fff;
   height: 32px;
   font-size: 13px;
   font-weight: 500;
   padding: 5px 7px 0px 8px;
   border-right: 1px solid #fff;
   position: sticky;
   top: 0;
}

.checksheet .info-box .row .table-container.size .table-box thead th:last-child,
.checksheet .info-box .row .table-container.cntr .table-box thead th:last-child{
    width:8%;
    border-right: none;
}

.checksheet .info-box .row .table-container.size .table-box thead th{
    text-align: center;
}



.checksheet .info-box .row .table-box tbody tr{
    border-bottom: 1px solid #DCEAF7;
}

.checksheet .info-box .row .table-box tbody td{
    text-align: center;
}

.checksheet .info-box .row .table-container.cntr tbody td,
.checksheet .info-box .row .table-container.size tbody td{
    height:24px;
    padding: 1px 2px;
    border-right: 1px solid #DCEAF7;
}


.checksheet .info-box .row .table-container.cntr tbody td:last-child,
.checksheet .info-box .row .table-container.size tbody td:last-child{
    border-right: none;
}

.checksheet .info-box .row .table-box tbody td input{
    height: 100%;
    border:none;
    background-color: #fff;
    font-size:13px;
    text-align: center;
}


.checksheet .info-box .row .table-box tbody td strong{
    font-size:13px;
}

.checksheet .info-box .row .table-container.cntr tbody td input:not([type="radio"]),
.checksheet .info-box .row .table-container.size tbody td input:not([type="radio"]){
    height:23px;
}

.checksheet .info-box .row .table-box tbody td select{
    height: 100%;
    border:none;
    background-color: #fff;
    font-size:12px;
}

.checksheet .info-box .row .table-box tbody td button.del{
    font-size: 12px;
    padding: 2px 10px;
    padding-top: 5px;
    background-color: #FF4141;
    color: lemonchiffon;
    border-color: #FF4141;
    border-radius: 5px;
}

.checksheet .info-box .row .table-box tbody td button.del:hover{
    background-color: #fff;
    color:#FF4141;
}

.checksheet .info-box .row .table-box tbody td button.del:active{
    color: #fff;
    background-color: #001E5E;
}

.checksheet .info-box .row .table-container .add-btn{
   /* border: 1px solid #6D87B9;*/
    background-color: #EAEAEA;
    margin-top:5px;
    display: flex;
    justify-content: center;
    cursor: pointer;
    height:25px;
}

.checksheet .info-box .row .table-container .add-btn:hover{
    background-color:#11115e;
}
.checksheet .info-box .row .table-container .add-btn:active{
    background-color:#99115e;
}

.checksheet .info-box .row .table-container .add-btn:active span{
    color:#fff;
}

.checksheet .info-box .row .table-container .add-btn span{
    font-size: 14px;
    display:flex;
    height: 25px;
    align-items: center;
    /*color:#6D87B9;*/
    color: #000;
    /*padding-top: 5px;*/
}

.checksheet .info-box .row .table-container .add-btn span.big{
    font-size:25px;
}

.checksheet .info-box .row .table-container .add-btn span + span{
    margin-left: 5px;
}


/* 2024-06-07 추가 컨테이너 생성 버튼 만들고 색깔은 파란색*/
.checksheet .info-box .row .table-box tbody td button.create{
    font-size: 12px;
    padding: 2px 10px;
    padding-top: 5px;
    background-color: #082b7e;
    color: lemonchiffon;
    border-color: #082b7e;
    border-radius: 5px;
}
.checksheet .info-box .row .table-box tbody td button.create:hover{
    background-color: #fff;
    color:#082b7e;
}
.checksheet .info-box .row .table-box tbody td button.create:active{
    color: #fff;
    background-color: #001E5E;
}

.checksheet .info-box .row .table-box tbody td button.readonly{
    font-size: 12px;
    padding: 2px 10px;
    padding-top: 5px;
    background-color: #858585;
    color: lemonchiffon;
    border-color: #858585;
    border-radius: 5px;
}


.checksheet .info-box .row .table-box tbody td input[type="radio"]{

    width:20px;
    height:20px;
    border: 1px solid #DCEAF7;

}

.checksheet .info-box .row .table-box tbody td input[type="radio"]:checked{
    background-color: #001E5E;
    border: 4px solid #DCEAF7;
}