*{
    margin: 0;
    padding: 0;
}

html{
    width: 100%;
    height: 100%;
}

body{
    padding: 10px;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    min-width: 1800px;
}
body::-webkit-scrollbar,
.selected-div-box::-webkit-scrollbar {
    width: 8px;  /* 스크롤바의 너비 */
}
body::-webkit-scrollbar-thumb,
.selected-div-box::-webkit-scrollbar-thumb {
    height: 30px; /* 스크롤바의 길이 */
    background-color: rgba(112,112,133,.7);
    -webkit-box-shadow: 0 0 0 1px transparent;
    box-shadow: 0 0 0 1px transparent;
    border-radius: 10px;
}
.phase-title{
    display: flex;
    align-items: center;
    padding-left: 5px;
    width: 100%;
    height: 25px;
}
.phase-title > img{
    margin-right: 5px;
}
.table-box{
    flex-direction: column;
}
.table-container{
    height: calc(100% - 4px);
    padding: 2px;
    width: calc(100% - 4px);
}
.table-container > div:nth-child(1){
    width: calc(100% - 2px);
    height: calc(100% - 2px);
}
.deselect-div-box,
.selected-div-box{
    width: 100%;
    height: 100%;
    padding: 2px;
    flex-direction: column;
    overflow: auto;
}
.flex{
    display: flex;
    width: 100%;
    padding: 2px;
}

.module-box{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.padding-ctrl{
    padding-left: 5px !important;
    padding-right: 5px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}
.btn-box > :nth-child(2){
    margin-left: auto;
    margin-right: 10px;
}

.phase{
    margin-left: auto;
    margin-right: 10px;
}

.state-box{
    display: flex;
    width: 100%;
    height: 25px;

}
.phase-title:hover{
    cursor: pointer;
}
.state-box > div:nth-child(1),
.state-box > div:nth-child(2),
.state-box > div:nth-child(3),
.state-box > div:nth-child(4),
.state-box > div:nth-child(5),
.state-box > div:nth-child(6),
.state-box > div:nth-child(7){
    margin-left: 5px;
    width: calc(100% / 7 - 10px);
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.state-box > div:nth-child(7) {
    margin-left:auto;
    margin-right: 5px;
}
.date-text{
    padding-left: 5px;
    width: 100%;
    height: 25px;
    display: flex;
    align-items: center;
    color: red;
}

.image-box{
    display     : flex; 
    align-items : center; 
    justify-content : center;
}

.phase-box{
    width: calc(100% / 5);
}
.image{
    width: calc(100% - 20px);
}
.img-box{
    width: 100%;
    height: 100%;
}

.edit-box{
    width: calc(100% / 5);
    height: 100%;
    padding: 2px;
    display: none;
    flex-direction: column;
}
.serve-title{
    width: 100%;
}

.vms-info{
    width: 100%;
    height: 75px;
    display: flex;
    flex-direction: column;
}
.vms-info > div:nth-child(1),
.vms-info > div:nth-child(2),
.vms-info > div:nth-child(3){
    display: flex;
    width: 100%;
    height: 25px;
    align-items: center;
}

.label{
    width: 60px;
    justify-content: right;
    display: flex;
}
.module-info{
    width: 100%;
    height: 50px;
}
.door-info > div,
.module-info > div{
    height: 25px;
    display: flex;
    align-items: center;
}
.module-info > div:nth-child(2){
    display: flex;
}
.door-info{
    width: 100%;
    height: 75px;
}
.door-info > div:nth-child(2) {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 50px;
}

.door-info > div:nth-child(2) > div:nth-child(1),
.door-info > div:nth-child(2) > div:nth-child(2){
    display: flex;
    align-items: center;
    width: 100%;
    height: 25px;
}

.schedule-list{
    width: 100%;
    height: calc(100% - 349px);
}
.btn-box{
    height: 35px;
}
.dx-checkbox-text{
    font-size: 10px;
}

.btn-box > div:nth-child(4){
    margin-left: auto;

}

.ml-5 {
    margin-left: 5px;
}

.no-padding{
    padding: 5px !important;
}

.ml-10{
    margin-left: 10px;
}
/* .selected-box{
    border: 1px solid #03a9f4;
} */
.btn-box > div:nth-child(1){
    margin-left:auto;
}

.dspl_dt{
    display: flex;
    height: 30px;
    align-items: center;
    padding-left: 20px;
}

.tc input{
    text-align: center;
}

.ft-text{
    width: 110px;
}