:root {
    --bg-dark: #0b0f1a;
    --panel-bg: #1a2236;
    --input-bg: #0f172a;
    --border-color: #334155;
    --text-main: #e2e8f0;
    --text-dim: #a0aec0;
    --point-blue: #4facfe;
    --point-orange: #ff9f43;

    --input-bg-light: #ffffff;
    --border-color-light: #cbd5e1;
    --text-main-light: #000000;
}
.MuiModal-backdrop {
    /* background-color: #0b0f1a; */
    color: var(--text-main);
    padding: 20px;
}
.pop_box .MuiPaper-root {
    background-color: var(--panel-bg);
    margin: 0 auto;
    border-radius: 12px;
    border: 1px solid var(--border-color);
    padding: 15px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6);
}
.modal-header {
    font-size: 1.25rem;
    font-weight: 700;
    color: #4facfe;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #34415e;
    padding-bottom: 15px;
}
.section-header {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--point-yellow);
    margin-bottom: 25px;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 10px;
}
.pop_box1 .pop_table .th {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--text-dim);
    padding: 12px 15px;
    border-bottom: 2px solid var(--border-color) !important;
}
.pop_table td {
    border-bottom: 2px solid var(--border-color) !important;
}
/* .pop_box .MuiOutlinedInput-notchedOutline {
    border: 1px solid #c1c1c1 !important;
} */
.pop_box .MuiOutlinedInput-notchedOutline {
    background-color: var(--input-bg) ;
    border: 1px solid var(--border-color) ;
    color: var(--text-main) ;
}
.pop p.MuiFormHelperText-root {
    background-color: var(--input-bg) !important ;
    color: var(--text-main) !important ;
}
#white .pop_box .MuiOutlinedInput-notchedOutline {
    background-color: var(--input-bg-light) ;
    border: 1px solid var(--border-color-light) ;
    color: var(--text-main-light) ;
}
#white .pop .MuiFormHelperText-root {
    background-color: var(--input-bg-light) !important ;
    color: var(--text-main-light) !important ;
}
#white .pop_box label{color: var(--text-main-light);}
.pop_box .MuiInputBase-input {
    z-index: 100;
    color: var(--text-main) !important;
}
.pop_table .MuiSvgIcon-root {
    fill: #fff;
    z-index: 100;
}
.MuiInput-underline::before, .MuiInput-underline:hover {
    border-bottom: none;
}
.MuiInput-underline:hover:not(.Mui-disabled, .Mui-error):before {
    border-bottom: none;
}
.btn_gray {
    background-color: #30363d;
}
.btn_gray:hover {
    background-color: #3f454c;
}

.pop_box .scroll_table{display: flex; justify-content: space-around;}
.pop_box .scroll_table thead{border-top: 2px solid #a2a2a2 !important;}
.pop_box .scroll_table .th{font-size: 14px;}
.pop_box .scroll_table .css-rorn0c-MuiTableContainer-root{width: 18%;}
.pop_box .scroll_table .table_full .css-rorn0c-MuiTableContainer-root{width: 100%;}
.pop_box .scroll_table td{word-break: break-all;}
.pop_box .scroll_table tbody{display:block; height:250px;overflow-y:scroll;}
.pop_box .scroll_table thead, .pop_box .scroll_table tbody tr, 
.pop_box .scroll_table tfoot{display:table; width:100%; table-layout:fixed;background-color:unset;}
.pop_box .scroll_table tfoot td{text-align: center;}
.pop_box .scroll_table tfoot .field div{text-align: center;}
.pop_box .scroll_table thead, .pop_box .scroll_table tfoot{width: calc( 100% - 0.1em )}
.pop_box .scroll_table button{min-width: 25px !important; padding: 3px 8px !important;}

.pop_box .scroll_table1 > div:first-child{display:flex; justify-content: space-between; width: 44%;}
.pop_box .scroll_table1 .css-rorn0c-MuiTableContainer-root{margin:5px; width: 99%;}
.pop_box .scroll_table1 .css-kge0eu{margin:5px; width: 99%;}
.pop_box .scroll_table1 > div:last-child{width: 70%;}
.pop_box .scroll_table1 .b_table{width: 30%;}

.pop_box .scroll_table1 .flex_unset div{display: unset !important;}
.pop_box .scroll_table1 .flex_unset .MuiChip-root{display:inline-block !important;}
.pop_box .scroll_table1 .flex_unset .MuiChip-root span{display:inline-block; padding-top: 4px;}

.pop_box .scroll_table_report thead, .pop_box .scroll_table_report2 thead{border-top: unset !important;}
.pop_box .scroll_table_report tbody{display:block; height:520px; overflow-y:scroll !important;}
.pop_box .scroll_table_report td{padding:7px 0 !important;}

.pop_box .scroll_table_report2 tbody {
  display: block;
}
.pop_box .scroll_table_report2 tbody 
{
   overflow: auto;
   height: 520px;
}
.pop_box .scroll_table tbody, .pop_box .scroll_table table {
  -ms-overflow-style: none !important; /* IE, Edge */
  scrollbar-width: none; /* Firefox */
}

.pop_box .scroll_table tbody::-webkit-scrollbar, .pop_box .scroll_table table::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera */
}

.modal_imagelayer{vertical-align: middle;}
.modal_imagelayer .tit{margin-top: 20px; color: #000; font-size: 20px; font-weight: bold; text-align: center;}
.modal_imagelayer .MuiInputBase-input{padding: 5px; background-color: #fff; left: 10px; border-radius: 5px;}
.modal_imagelayer .pop_image_tit .MuiInputBase-input{background-color: unset !important; border-color: gray !important;}
.modal_imagelayer_search{text-align: right;}
.modal_imagelayer_select_box{
  border: 3px solid #00a851
}
.modal_imagelayer_select{
  display: flex;
  justify-content: space-between;
  align-items: center;
  vertical-align: middle;
  padding: 10px;
  min-width: 800px;
  max-width: 800px;
  background-color: #353535;
  color: #fff; 
  font-size: 15px;
  font-weight: bold;
}
.modal_imagelayer_img1 {
  border: 1px solid #505150;
  color: #000;
  color: #fff;
}
.modal_imagelayer_img1 > div {
  display: flex;
  align-items: center;
  width: 50%;
}
.modal_imagelayer_img1 > div span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100px;
  height: 100%;
  text-align: center;
  background-color: #353535;
}
.modal_imagelayer_input {
  justify-content: flex-start;
  padding-top: 0;
  padding-bottom: 0;
}
.modal_imagelayer_img {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 800px;
}
.modal_imagelayer_img img, .modal_imagelayer_img video {
  object-fit: contain;
  margin: 4px;
  width: 152px;
  min-height: 105px;
  max-height: 105px;
  border: 1px solid #505150;
}