.page-sidebar {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  /*
  width: 30rem;
  max-width: 30rem;
  */
  width: 30rem;
  max-width: 22.5rem;
  background-color: #ffffff;
  border-left: 1px solid rgba(34, 34, 48, 0.1);
  box-shadow: none;
  overflow: auto;
  z-index: 1029;
  transform: translate3d(100%, 0, 0);
  transition: transform 200ms ease-in-out;
}

/*
@media (min-width: 768px) {
.has-sidebar-fluid .page-sidebar {
width: calc(100vw - 30rem);
max-width: calc(100vw - 30rem);
}
}
*/

/*
@media (min-width: 1200px) {
.has-sidebar-fluid .page-sidebar {
width: calc(100vw - 37.5rem);
max-width: calc(100vw - 37.5rem);
}
}
*/

@media (min-width: 576px) {
  .has-sidebar-expand-sm .app-main > .app-footer,
  .has-sidebar-expand-sm .page-inner {
    margin-right: 30rem;
  }
  .has-sidebar-expand-sm .page-sidebar {
    transform: translate3d(0, 0, 0);
  }
  .has-sidebar-open .has-sidebar-expand-sm .page-sidebar {
    position: absolute;
    top: 0;
    transform: translate3d(100%, 0, 0);
  }
  .has-sidebar-expand-sm.has-sidebar-fluid .page-inner {
    margin-right: calc(100vw - 37.5rem);
  }
  .has-sidebar-expand-sm.has-sidebar-fluid .page-sidebar {
    width: calc(100vw - 37.5rem);
    max-width: calc(100vw - 37.5rem);
  }
}

@media (min-width: 768px) {
  .has-sidebar-expand-md .app-main > .app-footer,
  .has-sidebar-expand-md .page-inner {
    margin-right: 30rem;
  }
  .has-sidebar-expand-md .page-sidebar {
    transform: translate3d(0, 0, 0);
  }
  .has-sidebar-open .has-sidebar-expand-md .page-sidebar {
    position: absolute;
    top: 0;
    transform: translate3d(100%, 0, 0);
  }
  .has-sidebar-expand-md.has-sidebar-fluid .page-inner {
    margin-right: calc(100vw - 37.5rem);
  }
  .has-sidebar-expand-md.has-sidebar-fluid .page-sidebar {
    width: calc(100vw - 37.5rem);
    max-width: calc(100vw - 37.5rem);
  }
}

@media (min-width: 992px) {
  .has-sidebar-expand-lg .app-main > .app-footer,
  .has-sidebar-expand-lg .page-inner {
    margin-right: 30rem;
  }
  .has-sidebar-expand-lg .page-sidebar {
    transform: translate3d(0, 0, 0);
    max-width: 30rem;
  }
  .has-sidebar-open .has-sidebar-expand-lg .page-sidebar {
    position: absolute;
    top: 0;
    transform: translate3d(100%, 0, 0);
  }
  .has-sidebar-expand-lg.has-sidebar-fluid .page-inner {
    margin-right: calc(100vw - 37.5rem);
  }
  .has-sidebar-expand-lg.has-sidebar-fluid .page-sidebar {
    width: calc(100vw - 37.5rem);
    max-width: calc(100vw - 37.5rem);
  }
}

@media (min-width: 1200px) {
  .has-sidebar-expand-xl .app-main > .app-footer,
  .has-sidebar-expand-xl .page-inner {
    margin-right: 30rem;
  }
  .has-sidebar-expand-xl .page-sidebar {
    transform: translate3d(0, 0, 0);
  }
  .has-sidebar-open .has-sidebar-expand-xl .page-sidebar {
    position: absolute;
    top: 0;
    transform: translate3d(100%, 0, 0);
  }
  .has-sidebar-expand-xl.has-sidebar-fluid .page-inner {
    margin-right: calc(100vw - 37.5rem);
  }
  .has-sidebar-expand-xl.has-sidebar-fluid .page-sidebar {
    width: calc(100vw - 37.5rem);
    max-width: calc(100vw - 37.5rem);
  }
}

.has-sidebar-expand .app-main > .app-footer,
.has-sidebar-expand .page-inner {
  margin-right: 30rem;
}

.th_necessary {
  color: #6593ff;
}

.input_max_width {
  max-width:500px;
}

/* DataTable 정렬 화살표 없애기 ------------------------ */
.dataTable > thead > tr > th[class*="sort"]:after{
  content: "" !important;
}
.dataTable > thead > tr > th[class*="sort"]:before{
  content: "" !important;
}

table.dataTable thead > tr > th.sorting_asc,
table.dataTable thead > tr > th.sorting_desc,
table.dataTable thead > tr > th.sorting,
table.dataTable thead > tr > td.sorting_asc,
table.dataTable thead > tr > td.sorting_desc,
table.dataTable thead > tr > td.sorting {
  padding-right: 5px;
  vertical-align: middle;
}
/* ------------------------ DataTable 정렬 화살표 없애기*/

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.popover{
  max-width: 100%; /* Max Width of the popover (depending on the container!) */
}


#my-spinner {
  width: 100%; height: 100%;
  top: 0; left: 0;
  display: none;
  opacity: .6;
  background: silver;
  position: fixed;
  z-index: 9999;

}

#my-spinner div {
  width: 100%; height: 100%;
  display: table;
}

#my-spinner span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}

#my-spinner img {
  background: white;
  padding: 1em;
  border-radius: .7em;
}

@media print {
  body {
    -webkit-print-color-adjust: exact !important;
  }
  .workOrderTable_1 > th {
    background-color: #cecece;
  }
}

.endline{
  page-break-before:always
}

/* gap */
.gap-0-25 { gap: 0.25rem; }
.gap-0-5  { gap: 0.5rem; }
.gap-0-75 { gap: 0.75rem; }
.gap-1 { gap: 1rem; }
.gap-2 { gap: 2rem; }
.gap-3 { gap: 3rem; }
.gap-4 { gap: 4rem; }
.gap-5 { gap: 5rem; }
.gap-6 { gap: 6rem; }
.gap-7 { gap: 7rem; }
.gap-8 { gap: 8rem; }
.gap-9 { gap: 9rem; }
.gap-10 { gap: 10rem; }
.gap-11 { gap: 11rem; }
.gap-12 { gap: 12rem; }

/* gap-x (column-gap) */
.gap-x-0-25 { column-gap: 0.25rem; }
.gap-x-0-5  { column-gap: 0.5rem; }
.gap-x-0-75 { column-gap: 0.75rem; }
.gap-x-1 { column-gap: 1rem; }
.gap-x-2 { column-gap: 2rem; }
.gap-x-3 { column-gap: 3rem; }
.gap-x-4 { column-gap: 4rem; }
.gap-x-5 { column-gap: 5rem; }
.gap-x-6 { column-gap: 6rem; }
.gap-x-7 { column-gap: 7rem; }
.gap-x-8 { column-gap: 8rem; }
.gap-x-9 { column-gap: 9rem; }
.gap-x-10 { column-gap: 10rem; }
.gap-x-11 { column-gap: 11rem; }
.gap-x-12 { column-gap: 12rem; }

/* gap-y (row-gap) */
.gap-y-0-25 { row-gap: 0.25rem; }
.gap-y-0-5  { row-gap: 0.5rem; }
.gap-y-0-75 { row-gap: 0.75rem; }
.gap-y-1 { row-gap: 1rem; }
.gap-y-2 { row-gap: 2rem; }
.gap-y-3 { row-gap: 3rem; }
.gap-y-4 { row-gap: 4rem; }
.gap-y-5 { row-gap: 5rem; }
.gap-y-6 { row-gap: 6rem; }
.gap-y-7 { row-gap: 7rem; }
.gap-y-8 { row-gap: 8rem; }
.gap-y-9 { row-gap: 9rem; }
.gap-y-10 { row-gap: 10rem; }
.gap-y-11 { row-gap: 11rem; }
.gap-y-12 { row-gap: 12rem; }