@charset "EUC-KR";

/****************/
/* ÄÁÅÙÃ÷ ½ÃÀÛ */
/****************/
/*** °øÅë ***/
body {background: var(--layout-bg-cont);}
.fs_wrap {padding:0 30px 40px 30px;}

/* ·¹À̾îÆ˾÷ */
.popupLayer {display:none;overflow:auto;position: fixed;left: 0;top:0;width: 100%;height: 100%;padding:50px;background: rgba(0,0,0,0.5);}
.popupLayer .popup_box {position: relative;width:500px;height:400px;background: #fff;border-radius: 10px;}
.popupLayer .popup_box .popup_cont {padding:20px;}
.popupLayer .popup_box .popup_cont h5 {padding:0 0 20px 10px;border-bottom:1px solid var(--layout-line-default);font-size: 1.8rem;color:var(--layout-text-black);}
.popupLayer .popup_box .popup_cont iframe {}
.popupLayer .popup_box .popup_btn {position: absolute;right:30px;top:30px;}
.popupLayer .popup_box .popup_btn button {background: none;font-size: 1.6rem;}

/* ¸ð´ÏÅ͸µ_·¹À̾îÆ˾÷ */
.modal_content {position: fixed;filter: drop-shadow(2px 2px 10px rgba(0,0,0,0.1)); width: 20%;}
.modal_content .modal_box {margin-bottom:15px;padding:25px 30px;background: var(--layout-col-white);border-radius: var(--layout-radius-10);}
.modal_content .modal_box:after {content:"";display:block;position:absolute;left:15px;bottom:-1px;border: 8px solid transparent;border-top-color: var(--layout-col-white);}
.modal_content .modal_box .modal_contents {font-size:2rem;font-weight:700;color:var(--layout-text-black);}
.modal_content .modal_box > div {margin-top:15px;justify-content: center;}
.modal_content .modal_box > div button {display:flex;padding:10px 15px;border-radius: 10px;background: var(--layout-col-black);color:var(--layout-col-white);}
.modal_content .modal_box > div button.modal_ok {background: var(--layout-col-green);}
.modal_content .modal_box > div button.modal_cancel {}
.modal_content.modal_content_last .modal_box:after {left:auto;right:15px;}

/* »ó´Ü ŸÀÌƲ */
.location {display:flex;flex-direction:column;justify-content:center;padding:0 30px;min-height: 98px;margin-bottom:30px;background: url("/images/fs/sub_bg.png") no-repeat right 30px center var(--layout-subbg);}
.location .pageDirect_title {display:flex;align-items:center;margin-bottom:5px;font-size:2.6rem;font-weight:600;color:var(--layout-text-black);}
.location .pageDirect_title img {filter: invert(80%);}
.location .pageDirect_title span {font-size:2.4rem;font-weight:400;color:var(--layout-col-green);}
.location .pageDirect_contents {font-size:1.5rem;color:var(--layout-text-default);}

/* »ó´Ü°Ë»ö(Á¶È¸, ÃʱâÈ­) */
.input-group {display: flex;gap:10px;margin-bottom: 10px;}
.input-group .input-group {margin-bottom: 0;}
.input-group select {flex-grow: 1;}
.input-group input {flex-grow: 1;}
.input-group button {display:flex;align-items:center;padding:0 15px;color:#fff;font-size:1.5rem;border-radius: var(--layout-radius-10);}
.input-group button img {filter: invert(100%);}
.input-group button:is(:hover,:active,:focus) {background: var(--layout-col-black);}
.input-group .btn-success {background: var(--layout-col-green);}
.input-group .btn-dark {background: var(--layout-text-black);}
.input-group .input-group-text {display: flex;align-items: center;}
.input-group .input-group-text span {display: inline-block;margin-right:10px;font-size:1.5rem;font-weight:700;color:var(--layout-text-black);}

/* ÄÁÅÙÃ÷ ¹è°æ */
.table_bg {padding:20px;background: var(--layout-col-white);border-radius: var(--layout-radius-15);border:1px solid var(--layout-line-default);}

/* °Ô½ÃÆÇ ÆäÀÌÁö³Ñ¹ö */
.page_number {display:flex;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:30px;}
.page_number li {margin:0 2px;}
.page_number li a {display:grid;place-items:center;width:34px;height:34px;line-height:1.2;text-align:center;font-size:1.5rem;color:var(--layout-col-black);}
.page_number li a.on,.page_number li a:is(:hover, :focus, :active) {}
.page_number .prev_first a {background:url("/images/fs/first_prev.png") no-repeat center center;font-size:0;}
.page_number .prev a {background:url("/images/fs/prev.png") no-repeat center center;font-size:0;}
.page_number .num {}
.page_number .num a.on,.page_number .num a:is(:hover, :focus, :active) {background:var(--layout-col-green);border-radius:var(--layout-radius-5);color:var(--layout-col-white);}
.page_number .next a {background:url("/images/fs/next.png") no-repeat center center;font-size:0;}
.page_number .next_last a {background:url("/images/fs/last_next.png") no-repeat center center;font-size:0;}

/* ¹öÆ° */
.btn-group .btn {padding:10px 15px;background: var(--layout-col-white);border-radius: var(--layout-radius-10);border:1px solid var(--layout-col-black);cursor: pointer;transition: var(--layout-transition);font-size:1.4rem;}
.btn-group .btn:is(:hover,:focus,:active) {background: var(--layout-col-black);border:1px solid var(--layout-col-black);color:var(--layout-col-white);}



/*** ´ë½Ãº¸µå ***/
.charts_box {}
.charts_box h4 {font-size:1.7rem;color:var(--layout-text-black);}
.charts_box h4 span {color:var(--layout-col-green);}
.charts_box > div {display: flex;gap:10px;}
.charts_box > div > div {flex-grow:1;}
.charts_box .box1 {margin-top:10px;}
.charts_box .box1 > div {position:relative;flex: 0 1 50%;padding:20px;background: var(--layout-col-white);border-radius: 15px;box-shadow: 2px 2px 10px rgba(0,0,0,0.08);}
.charts_box .box1 > .ipc_status {}
.charts_box .box1 > .ipc_uptime {}
.charts_box .box2 {display: flex;margin-top:10px;}
.charts_box .box2 > div {flex: 0 1 50%;}
.charts_box .box2 > .left {display: flex;gap:10px;}
.charts_box .box2 > .left > div {position:relative;padding:20px;background: var(--layout-col-white);border-radius: 15px;box-shadow: 2px 2px 10px rgba(0,0,0,0.08);}
.charts_box .box2 > .left .ipc_server {flex: 0 1 50%;}
.charts_box .box2 > .left .ipc_server .ResourceBtnBack {display: flex;align-items: center;gap: 20px;}
.charts_box .box2 > .left .ipc_server .ResourceBtnBack .sp_etc {font-size:1.4rem;}
.charts_box .box2 > .left .ipc_server .ResourceBtnBack .sp_etc strong {font-weight: 400;color:var(--layout-text-black);}
.charts_box .box2 > .left .ipc_server .ResourceBtnBack .sp_etc span {margin-left:5px;color:var(--layout-text-gray2);}
.charts_box .box2 > .left .ipc_server .ResourceBtnBack .sp_etc span em {font-weight: 700;color:var(--layout-col-green);}
.charts_box .box2 > .left .ipc_alarm1 {flex: 0 1 50%;}
.charts_box .box2 > .right {position:relative;padding:20px;background: var(--layout-col-white);border-radius: 15px;box-shadow: 2px 2px 10px rgba(0,0,0,0.08);}
.charts_box .box2 > .right .ipc_alarm2 {}


/*** ¸ð´ÏÅÍ ***/
.container-fluid {margin-top:30px;}
.container-fluid.list_view {position:relative;margin-top:0;}
.container-fluid.list_view button {display:flex;width: 40px;height: 40px;padding:0;border-radius: var(--layout-radius-10);background: var(--layout-text-gray2);}
.container-fluid.list_view button img {margin:auto;filter: invert(100%);}
.container-fluid.list_view .list_view_btn {display:none;position:absolute;right:0;top:50px;padding:10px 0;min-width:100px;background:var(--layout-col-white);border-radius: var(--layout-radius-10);filter: drop-shadow(3px 3px 10px rgba(0,0,0,0.07));}
.container-fluid.list_view .list_view_btn:after {content:"";display:block;position:absolute;right:10px;top:-16px;border: 8px solid transparent;border-bottom-color: var(--layout-col-white);}
.container-fluid.list_view .list_view_btn.active {display:block;}
.container-fluid.list_view .list_view_btn li {}
.container-fluid.list_view .list_view_btn li a {display:block;padding:5px 15px 5px 35px;font-size:1.4rem;color:var(--layout-text-black);background: url("/images/fs/icon/check_FILL1_wght400_GRAD0_opsz24.svg") no-repeat 15px center;background-size: auto 18px;filter: invert(60%);}
.container-fluid.list_view .list_view_btn li:is(.on,:hover,:focus,:active) a {filter: invert(0);}
.container-fluid.list_view .list_view_btn li a img {height: 18px;}
.container-fluid .fluid_box {display: flex;flex-wrap: wrap;gap:50px;row-gap:40px;}
.container-fluid .fluid_box .fluid {display:flex;justify-content:center;flex-direction:column;width: calc((100% - 150px) / 4);}
.container-fluid .fluid_box.li1 {}
.container-fluid .fluid_box.li1 .fluid {width: calc((100% - 100px) / 3);}
.container-fluid .fluid_box.li3 .fluid {width: calc((100% - 200px) / 5);}
.container-fluid .fluid_box .fluid h4 {font-size:1.6rem;font-weight:600;color:var(--layout-text-black);margin-bottom:10px;}
.container-fluid .fluid_box .fluid h4 img {filter: invert(40%);height: 20px;}
.container-fluid .fluid_box .fluid h4 span {color:var(--layout-text-default);}
.container-fluid .fluid_box .fluid h4 span.on {color:var(--layout-col-green);}
.container-fluid .fluid_box .fluid h4 span.on img {filter: invert(40%) sepia(63%) saturate(1946%) hue-rotate(130deg) brightness(95%) contrast(101%);}
.container-fluid .fluid_box .fluid .fluid_cont {overflow:hidden;padding:20px;background:var(--layout-col-white);border-radius: var(--layout-radius-15);border:1px solid var(--layout-line-default);}
.container-fluid .fluid_box .fluid .fluid_cont .fluid_cont_box {overflow:hidden;background:var(--layout-col-white);border-radius: var(--layout-radius-15);border:1px solid var(--layout-line-default);}
.container-fluid .fluid_box .fluid .fluid_cont .fluid_cont_box > img {width: 100%;}
.container-fluid .fluid_box .fluid .fluid_cont .btn-group {display: flex;border-top:1px solid var(--layout-line-default);}
.container-fluid .fluid_box .fluid .fluid_cont .btn-group button {display: flex;justify-content:center;align-items:center;gap:3px;flex-grow:1;height: 35px;padding:0 5px;background: none;border-left:1px solid var(--layout-line-default);border-right:1px solid var(--layout-line-default);border-top:0;border-bottom:0;margin-left:-1px;font-size:1.2rem;color:var(--layout-text-default);border-radius: 0;}
.container-fluid .fluid_box .fluid .fluid_cont .btn-group button:last-child {margin-left:0;}
.container-fluid .fluid_box .fluid .fluid_cont .btn-group button img {height: 20px;filter: invert(40%);}
.container-fluid .fluid_box .fluid .fluid_cont .btn-group button.btnPowerOn {color:var(--layout-col-green);}
.container-fluid .fluid_box .fluid .fluid_cont .btn-group button.btnPowerOn img {filter: invert(40%) sepia(63%) saturate(1946%) hue-rotate(130deg) brightness(95%) contrast(101%);}
.monitoring_table {width: 100%;}
@media only screen and (max-width:1549px){
  .container-fluid .fluid_box {gap:20px;row-gap:30px;}
  .container-fluid .fluid_box .fluid {width: calc((100% - 60px) / 4);}
  .container-fluid .fluid_box .fluid .fluid_cont {padding:15px;}
  .container-fluid .fluid_box .fluid .fluid_cont .btn-group button img {width:10px;height: auto;}
  .container-fluid .fluid_box.li1 .fluid {width: calc((100% - 40px) / 3);}
  .container-fluid .fluid_box.li1 .fluid .fluid_cont .btn-group button img {width:auto;}
  .container-fluid .fluid_box.li3 {gap:10px;row-gap:30px;}
  .container-fluid .fluid_box.li3 .fluid {width: calc((100% - 40px) / 5);}
  .container-fluid .fluid_box.li3 .fluid .fluid_cont {padding:10px;}
  .container-fluid .fluid_box.li3 .fluid .fluid_cont .btn-group button {flex-direction: column;}
  .container-fluid .fluid_box.li3 .fluid .fluid_cont .btn-group button img {width:10px;}
}


/*** Status Control > Status Control ***/
.nes-table {width:100%;border-top:1px solid var(--layout-text-black);border-right:1px solid var(--layout-table-td);border-bottom:1px solid var(--layout-table-td);font-size:1.5rem;color:var(--layout-text-black);text-align: center;}
.nes-table thead {}
.nes-table thead tr {}
.nes-table thead tr th {position: relative;padding:15px 10px;background: var(--layout-table-th);border-left:1px solid var(--layout-table-td);font-size:1.6rem;color:var(--layout-col-black);}
.nes-table thead tr th:after {content:"";display:block;position: absolute;left:-1px;top:0;width: 1px;height: 1px;background: var(--layout-col-white);}
.nes-table tbody {}
.nes-table tbody tr {}
.nes-table tbody tr th {background: var(--layout-table-th);border-left:1px solid var(--layout-table-td);border-top:1px solid var(--layout-table-td);}
.nes-table tbody tr td {position: relative;padding:15px 10px;background: var(--layout-col-white);border-left:1px solid var(--layout-table-td);border-top:1px solid var(--layout-table-td);}
.nes-table tbody tr td:after {content:"";display:block;position: absolute;left:-1px;top:0;width: 1px;height: 1px;background: var(--layout-col-white);}
.nes-table tbody tr td .ipc_top {display: block;text-align: left;}
.nes-table tbody tr td .ipc_top kbd {display:inline-block;padding:2px 6px;margin-top:2px;background: var(--layout-text-gray2);border-radius: 50px;color:var(--layout-col-white);font-size:1.2rem;}
.nes-table tbody tr td .ipc_bot {padding-top:7px;margin-top:7px;border-top:1px solid var(--layout-table-td);text-align: left;}
.nes-table tbody tr td .ipc_bot kbd {display:inline-block;padding:2px 6px;background: var(--layout-col-green);border-radius: 50px;color:var(--layout-col-white);font-size:1.2rem;}
.nes-table tbody tr td .ipc_bot span {color:var(--layout-text-default);}
.nes-table tbody tr td .ipc_bot2 {margin-top:4px;text-align: left;}
.nes-table tbody tr td .ipc_bot2 kbd {display:inline-block;padding:2px 6px;background: var(--layout-col-default);border-radius: 50px;color:var(--layout-col-white);font-size:1.2rem;}
.nes-table tbody tr td .agent {}
.nes-table tbody tr td .agentState {font-size:1.2rem;color:var(--layout-text-default);}
.nes-table tbody tr td.pcState {}
.nes-table tbody tr td.pcState .on {color:var(--layout-col-green);}
.nes-table tbody tr td.pcState .save {color:var(--layout-col-black);}
.nes-table tbody tr td.pcState .off {color:var(--layout-text-gray);}
.nes-table tbody tr td .amtState {font-size:1.2rem;color:var(--layout-text-red);}
.nes-table tbody tr td .cmdState {overflow:hidden;display:flex;justify-content:center;gap:1px;margin-top:2px;border-radius: 50px;}
.nes-table tbody tr td .cmdState > div:first-child {border-radius: 50px 0 0 50px;}
.nes-table tbody tr td .cmdState > div:last-child {border-radius: 0 50px 50px 0;}
.nes-table tbody tr td .cmdState .green_dot {width: 6px;height: 6px;background-color: var(--layout-col-green);}
.nes-table tbody tr td .cmdState .red_dot {width: 6px;height: 6px;background-color: var(--layout-text-red);}
.nes-table tbody tr td .btn-group-img {}
.nes-table tbody tr td .btn-group-img button {padding:4px;background: var(--layout-bg-gnb);border-radius: var(--layout-radius-5);}
.nes-table tbody tr td .btn-group-img button img {height:20px;filter: invert(40%);}
.nes-table tbody tr td .btn-group-img button.btnPowerOn img {filter: invert(40%) sepia(63%) saturate(1946%) hue-rotate(130deg) brightness(95%) contrast(101%);}
.nes-table tbody tr td .btnVnc {padding:4px;background: var(--layout-bg-gnb);border-radius: var(--layout-radius-5);}
.nes-table tbody tr td .btnVnc img {height:20px;filter: invert(40%);}
.nes-table tbody tr td .btnShell {padding:4px;background: var(--layout-bg-gnb);border-radius: var(--layout-radius-5);}
.nes-table tbody tr td .btnShell img {height:20px;filter: invert(40%);}
/*** Status Control > Device Info ***/
input.btn.resources {opacity:1;padding:10px 15px;background: var(--layout-col-white);border-radius: var(--layout-radius-10);border:1px solid var(--layout-col-black);cursor: pointer;transition: var(--layout-transition);}
input.btn.resources:disabled {opacity:0.3;background:none;border:1px solid var(--layout-col-green);color:var(--layout-col-green);}
/*** Status Control > File Transfer ***/
.file_transfer {}
.file_transfer .input-group {display: flex;}
.file_transfer .input-group input {flex-grow: 1;display: flex;align-items:center;padding:0 10px;height: 40px;line-height:40px;cursor:pointer;}
.file_transfer .input-group button {height:40px;background: var(--layout-col-green);}
.file_transfer .input-group button img {margin-right:5px;}
.nes-table .dropdown-toggle {height: 48px;background: var(--layout-col-black);color:var(--layout-col-white);}
.nes-table .dropdown-toggle::after {content: "";display: inline-block;margin-left: 0.255em;vertical-align: 0.255em;border-top: 0.3em solid;border-right: 0.3em solid transparent;border-bottom: 0;border-left: 0.3em solid transparent;}
.nes-table .dropdown-menu {display: none;}
.nes-table .dropdown-menu.show {display: block;z-index: 10;padding:20px;width:120px;text-align:left;background: var(--layout-col-white);border:1px solid var(--layout-line-default);border-radius: var(--layout-radius-5);box-shadow: 4px 4px 10px rgba(0,0,0,0.05);}
.nes-table .dropdown-menu.show li {margin-top:10px;font-size:1.4rem;font-weight: 400;}
.nes-table .dropdown-menu.show li:first-child {margin-top:0;}
.btn-group.filetransfer_btn .btn-primary {border:1px solid var(--layout-col-default);color:var(--layout-col-default);}
.btn-group.filetransfer_btn .btn-primary + .btn-primary {border:1px solid var(--layout-text-red);color:var(--layout-text-red);}
.btn-group.filetransfer_btn .btn-primary:is(:hover,:focus,:active) {border:1px solid var(--layout-col-black);color:var(--layout-col-white);}
.filetransfer_btn .btn-outline-secondary {}
.filetransfer_btn .btn-outline-primary {}
.swal2-popup {width:500px;font-size:1.5rem;}
.swal2-html-container {font-size:1.5rem;}
.swal2-styled {background: var(--layout-col-green);}

/*** Event Log > Resource Alarm ***/
.nav-tabs  {text-align: center;}
.nav-tabs > div {overflow:hidden;display: inline-flex;justify-content:center;border:1px solid var(--layout-table-td);margin-bottom: 30px;background: var(--layout-col-white);border-radius: var(--layout-radius-10);box-shadow: 4px 4px 10px rgba(0,0,0,0.05);}
.nav-tabs a {display: inline-block;padding:10px 25px;text-decoration: none;}
.nav-tabs a.nav-link {color:var(--layout-text-gray);font-size:1.8rem;}
.nav-tabs a.nav-link.active {border-bottom:2px solid var(--layout-col-green);color:var(--layout-col-green);}
.nes-table span.on {color:var(--layout-col-green);}
.nes-table span.off {color:var(--layout-text-red);}
.nes-table span.off img {height: 20px;filter: invert(40%) sepia(63%) saturate(1946%) hue-rotate(327deg) brightness(95%) contrast(101%);}
.nes-table span.warning {color:var(--layout-text-orange);}
.nes-table span.warning img {height: 18px;filter: invert(40%) sepia(63%) saturate(1946%) hue-rotate(14deg) brightness(95%) contrast(101%);}

/*** Registration > User Regist ***/
.btn-group .btn {}
.btn-group .btn-success {padding:10px 15px;background: var(--layout-col-white);border-radius: var(--layout-radius-10);border:1px solid var(--layout-col-black);cursor: pointer;transition: var(--layout-transition);}
.btn-group .btn_red {border:1px solid var(--layout-text-red);color:var(--layout-text-red);}
.btn-group .btn:is(:hover,:focus,:active) {}

/*** Setting > Alarm Level ***/
.about_settings {display: flex;justify-content:flex-start;flex-wrap: wrap;gap:10px;padding:0 16%;text-align: left;}
.about_settings span {flex:1 1 40%;font-weight: 700;color:var(--layout-col-green);font-size:1.7rem;}
.about_settings span strong {font-weight: 400;color:var(--layout-text-black);font-size:1.4rem;}

/*** Setting > Power Schedule ***/
.btn-group2 {margin-top:20px;}
.btn-group2 .btn {padding: 10px 25px;background: var(--layout-col-green);border-radius: var(--layout-radius-10);border: 1px solid var(--layout-col-green);cursor: pointer;transition: var(--layout-transition);font-size: 1.5rem;color:var(--layout-col-white);}
.nes-table .input-group .btn {display: flex;align-items: center;padding: 0 15px;color: #fff;height:40px;font-size: 1.5rem;border-radius: var(--layout-radius-10);background: var(--layout-text-black);}
.power_schedule {padding:10px 10px 10px 20px;}
.power_schedule .input-group {display: flex;width: 100%;}
.power_schedule .input-group span {margin-left:30px;}
.power_schedule .input-group span:first-child {margin-left:0;}
.power_schedule .input-group span strong {margin-right:10px;color: var(--layout-text-black);}
.power_schedule .input-group .input-group-text2 {display:flex;align-items:center;flex-grow: 1;}
.power_schedule .input-group .input-group-text2 input {flex-grow: 1;}
.power_schedule .input-group input {}
.power_schedule .input-group button {}
.power_schedule .input-group .btn {display: flex;align-items: center;padding: 0 15px;color: #fff;height:40px;font-size: 1.5rem;border-radius: var(--layout-radius-10);background: var(--layout-text-black);}
#groupType.input-group {margin-bottom: 0;}

/*** Setting > System ***/
.setting_system {display: flex;align-items:center;gap:10px;}
.setting_system #monitoringTime {width: 100px;}
.setting_system button {height: 40px;padding:10px 15px;background: var(--layout-text-black);border-radius: var(--layout-radius-10);font-size:1.5rem;color:var(--layout-col-white);}
.setting_system button.btn_red {background: var(--layout-text-red);}
.setting_system button.btn_green {background: var(--layout-col-green);}


/*
var(--layout-dark-bg1): #222; ¿À¹ö½Ã ¹è°æ
var(--layout-dark-bg2): #333; ¸Þ´º¹è°æ
var(--layout-dark-bg3): #444; ±âº»¹è°æ
var(--layout-dark-bg4): #666; gnb¹è°æ
var(--layout-dark-text): #ccc; ±âº»ÅؽºÆ®
var(--layout-dark-text2): #aaa; ¼­ºêÅؽºÆ®
var(--layout-dark-border): #555; ¼±
*/


/***************/
/*** ´ÙÅ©¸ðµå ***/
/***************/
body.dark-mode {background: var(--layout-dark-bg3);}

/* Àüü ½ºÅ©·Ñ¹Ù ½ºÅ¸ÀÏ º¯°æ */
body.dark-mode *::-webkit-scrollbar {width: 15px;border-radius: 50px;}/* ½ºÅ©·Ñ¹ÙÀÇ Å©±â¿Í »ö»óÀ» ¼³Á¤ÇÕ´Ï´Ù. */
body.dark-mode *::-webkit-scrollbar-track {background: var(--layout-dark-bg4);}/* ½ºÅ©·Ñ¹ÙÀÇ ¹è°æ»öÀ» ¼³Á¤ÇÕ´Ï´Ù. */
body.dark-mode *::-webkit-scrollbar-thumb {background: var(--layout-dark-bg2);border-radius: 50px;}/* ½ºÅ©·Ñ¹ÙÀÇ ¸¶¿ì½º Ŭ¸¯ ½Ã ³ªÅ¸³ª´Â ¼Õ°¡¶ô ¸ð¾çÀÇ »ö»óÀ» ¼³Á¤ÇÕ´Ï´Ù. */

/* »ó´Ü°Ë»ö(Á¶È¸, ÃʱâÈ­) */
body.dark-mode .input-group span {color:var(--layout-dark-text);}
body.dark-mode .input-group .input-group-text span {color:var(--layout-dark-text);}

/* ÄÁÅÙÃ÷ ¹è°æ */
body.dark-mode .table_bg {background: var(--layout-dark-bg3);border:1px solid var(--layout-dark-border);}

/* °Ô½ÃÆÇ ÆäÀÌÁö³Ñ¹ö */
body.dark-mode .page_number li a {color:var(--layout-dark-text);}

/* ¹öÆ° */
body.dark-mode .btn-group .btn {background: var(--layout-dark-bg3);border:1px solid var(--layout-dark-border);color:var(--layout-dark-text);}
body.dark-mode .btn-group .btn:is(:hover,:focus,:active) {background: var(--layout-dark-bg1);border:1px solid var(--layout-dark-border);color:var(--layout-dark-text);}

/* »ó´Ü ŸÀÌƲ */
body.dark-mode .location {background: url("/images/fs/sub_bg.png") no-repeat right 30px center var(--layout-dark-bg4);}
body.dark-mode .location .pageDirect_title {color:var(--layout-dark-text);}
body.dark-mode .location .pageDirect_title img {filter: invert(80%);}
body.dark-mode .location .pageDirect_title span {color:var(--layout-col-green);}
body.dark-mode .location .pageDirect_contents {color:var(--layout-dark-text2);}

/*** ´ë½Ãº¸µå ***/
body.dark-mode .charts_box {}
body.dark-mode .charts_box h4 {color:var(--layout-dark-text);}
body.dark-mode .charts_box h4 span {color:var(--layout-col-green);}
body.dark-mode .charts_box .box1 > div {background: var(--layout-dark-bg3);box-shadow: 2px 2px 10px rgba(0,0,0,0.08);border:1px solid var(--layout-dark-border);color:var(--layout-dark-text);}
body.dark-mode .charts_box .box1 > .ipc_status {}
body.dark-mode .charts_box .box1 > .ipc_uptime th {color:var(--layout-dark-text);}
body.dark-mode .charts_box .box1 > .ipc_uptime td {color:var(--layout-dark-text);}
body.dark-mode .charts_box .box2 > .left > div {background: var(--layout-dark-bg3);box-shadow: 2px 2px 10px rgba(0,0,0,0.08);border:1px solid var(--layout-dark-border);color:var(--layout-dark-text);}
body.dark-mode .charts_box .box2 > .left .ipc_server .ResourceBtnBack .sp_etc strong {color:var(--layout-dark-text2);}
body.dark-mode .charts_box .box2 > .left .ipc_server .ResourceBtnBack .sp_etc span {color:var(--layout-dark-text);}
body.dark-mode .charts_box .box2 > .left .ipc_server .ResourceBtnBack .sp_etc span em {color:var(--layout-col-green);}
body.dark-mode .charts_box .box2 > .right {background: var(--layout-dark-bg3);box-shadow: 2px 2px 10px rgba(0,0,0,0.08);border:1px solid var(--layout-dark-border);color:var(--layout-dark-text);}
body.dark-mode .charts_box .box2 > .left .ipc_alarm1 th {color:var(--layout-dark-text);}
body.dark-mode .charts_box .box2 > .left .ipc_alarm1 td {color:var(--layout-dark-text);}
body.dark-mode .charts_box .box2 > .right .ipc_alarm2 th {color:var(--layout-dark-text);}
body.dark-mode .charts_box .box2 > .right .ipc_alarm2 td {color:var(--layout-dark-text);}

/*** ¸ð´ÏÅÍ ***/
body.dark-mode .container-fluid .list_view button {background: var(--layout-text-gray2);}
body.dark-mode .container-fluid .list_view .list_view_btn {background:var(--layout-dark-bg3);border:1px solid var(--layout-dark-border);}
body.dark-mode .container-fluid .list_view .list_view_btn:after {border-right-color: var(--layout-dark-border);}
body.dark-mode .container-fluid .list_view .list_view_btn li {}
body.dark-mode .container-fluid .list_view .list_view_btn li a {color:var(--layout-dark-text);}
body.dark-mode .container-fluid .fluid_box .fluid h4 {color:var(--layout-dark-text);}
body.dark-mode .container-fluid .fluid_box .fluid h4 img {filter: invert(80%);}
body.dark-mode .container-fluid .fluid_box .fluid h4 span {color:var(--layout-dark-text);}
body.dark-mode .container-fluid .fluid_box .fluid h4 span.on {color:var(--layout-col-green);}
body.dark-mode .container-fluid .fluid_box .fluid h4 span.on img {filter: invert(40%) sepia(63%) saturate(1946%) hue-rotate(130deg) brightness(95%) contrast(101%);}
body.dark-mode .container-fluid .fluid_box .fluid .fluid_cont {background:var(--layout-dark-bg3);border:1px solid var(--layout-dark-border);}
body.dark-mode .container-fluid .fluid_box .fluid .fluid_cont .fluid_cont_box {background:var(--layout-dark-bg3);border:1px solid var(--layout-dark-border);}
body.dark-mode .container-fluid .fluid_box .fluid .fluid_cont .btn-group {border-top:1px solid var(--layout-dark-border);}
body.dark-mode .container-fluid .fluid_box .fluid .fluid_cont .btn-group button {border-left:1px solid var(--layout-dark-border);border-right:1px solid var(--layout-dark-border);color:var(--layout-dark-text);}
body.dark-mode .container-fluid .fluid_box .fluid .fluid_cont .btn-group button img {filter: invert(80%);}
body.dark-mode .container-fluid .fluid_box .fluid .fluid_cont .btn-group button.btnPowerOn {color:var(--layout-col-green);}

/*** Status Control > Status Control ***/
body.dark-mode .nes-table {border-top:1px solid var(--layout-text-black);border-right:1px solid var(--layout-dark-border);border-bottom:1px solid var(--layout-dark-border);color:var(--layout-dark-text);}
body.dark-mode .nes-table thead tr th {background: var(--layout-dark-bg2);border-left:1px solid var(--layout-dark-border);color:var(--layout-dark-text);}
body.dark-mode .nes-table thead tr th:after {background: var(--layout-dark-bg3);}
body.dark-mode .nes-table tbody tr th {background: var(--layout-dark-bg2);border-left:1px solid var(--layout-dark-border);border-top:1px solid var(--layout-dark-border);}
body.dark-mode .nes-table tbody tr td {background: var(--layout-dark-bg3);border-left:1px solid var(--layout-dark-border);border-top:1px solid var(--layout-dark-border);}
body.dark-mode .nes-table tbody tr td:after {background: var(--layout-dark-bg3);}
body.dark-mode .nes-table tbody tr td .ipc_top kbd {background: var(--layout-text-gray2);color:var(--layout-dark-bg3);}
body.dark-mode .nes-table tbody tr td .ipc_bot {border-top:1px solid var(--layout-dark-border);}
body.dark-mode .nes-table tbody tr td .ipc_bot kbd {background: var(--layout-col-green);color:var(--layout-dark-bg3);}
body.dark-mode .nes-table tbody tr td .ipc_bot span {color:var(--layout-dark-text);}
body.dark-mode .nes-table tbody tr td .ipc_bot2 kbd {background: var(--layout-col-default);color:var(--layout-dark-bg3);}
body.dark-mode .nes-table tbody tr td .agentState {color:var(--layout-dark-text);}
body.dark-mode .nes-table tbody tr td.pcState .on {color:var(--layout-col-green);}
body.dark-mode .nes-table tbody tr td.pcState .save {color:var(--layout-dark-text);}
body.dark-mode .nes-table tbody tr td.pcState .off {color:var(--layout-text-gray);}
body.dark-mode .nes-table tbody tr td .amtState {color:var(--layout-text-red);}
body.dark-mode .nes-table tbody tr td .cmdState .green_dot {background-color: var(--layout-col-green);}
body.dark-mode .nes-table tbody tr td .cmdState .red_dot {background-color: var(--layout-text-red);}
body.dark-mode .nes-table tbody tr td .btn-group-img {}
body.dark-mode .nes-table tbody tr td .btn-group-img button {background: var(--layout-dark-bg2);}
body.dark-mode .nes-table tbody tr td .btn-group-img button img {height:20px;filter: invert(80%);}
body.dark-mode .nes-table tbody tr td .btn-group-img button.btnPowerOn img {filter: invert(40%) sepia(63%) saturate(1946%) hue-rotate(130deg) brightness(95%) contrast(101%);}
body.dark-mode .nes-table tbody tr td .btnVnc {background: var(--layout-dark-bg2);}
body.dark-mode .nes-table tbody tr td .btnVnc img {filter: invert(80%);}
/*** Status Control > Device Info ***/
body.dark-mode input.btn.resources {background: var(--layout-dark-bg3);border-radius: var(--layout-radius-10);border:1px solid var(--layout-dark-border);}
body.dark-mode input.btn.resources:disabled {border:1px solid var(--layout-col-green);color:var(--layout-col-green);}
/*** Status Control > File Transfer ***/
body.dark-mode .file_transfer .input-group button {background: var(--layout-col-green);}
body.dark-mode .nes-table .dropdown-toggle {background: var(--layout-dark-text);color:var(--layout-dark-bg3);}
body.dark-mode .nes-table .dropdown-menu.show {background: var(--layout-dark-bg3);border:1px solid var(--layout-dark-border);box-shadow: 4px 4px 10px rgba(0,0,0,0.05);}
body.dark-mode .btn-group.filetransfer_btn .btn-primary {border:1px solid var(--layout-dark-border);color:var(--layout-col-default);}
body.dark-mode .btn-group.filetransfer_btn .btn-primary + .btn-primary {border:1px solid var(--layout-text-red);color:var(--layout-text-red);}
body.dark-mode .btn-group.filetransfer_btn .btn-primary:is(:hover,:focus,:active) {border:1px solid var(--layout-dark-text);color:var(--layout-dark-bg3);}
body.dark-mode .swal2-styled {background: var(--layout-col-green);}

/*** Event Log > Resource Alarm ***/
body.dark-mode .nav-tabs > div {border:1px solid var(--layout-dark-border);background: var(--layout-dark-bg3);box-shadow: 4px 4px 10px rgba(0,0,0,0.05);}
body.dark-mode .nav-tabs a.nav-link {color:var(--layout-text-gray);}
body.dark-mode .nav-tabs a.nav-link.active {border-bottom:2px solid var(--layout-col-green);color:var(--layout-col-green);}
body.dark-mode .nes-table span.on {color:var(--layout-col-green);}
body.dark-mode .nes-table span.off {color:var(--layout-text-red);}
body.dark-mode .nes-table span.off img {filter: invert(40%) sepia(63%) saturate(1946%) hue-rotate(327deg) brightness(95%) contrast(101%);}
body.dark-mode .nes-table span.warning {color:var(--layout-text-orange);}
body.dark-mode .nes-table span.warning img {filter: invert(40%) sepia(63%) saturate(1946%) hue-rotate(14deg) brightness(95%) contrast(101%);}

/*** Setting > Alarm Level ***/
body.dark-mode .about_settings span {color:var(--layout-col-green);}
body.dark-mode .about_settings span strong {color:var(--layout-dark-text);}

/*** Setting > Power Schedule ***/
body.dark-mode .btn-group2 .btn {background: var(--layout-col-green);border: 1px solid var(--layout-col-green);color:var(--layout-col-white);}
body.dark-mode .nes-table .input-group .btn {background: var(--layout-dark-bg2);}
body.dark-mode .power_schedule .input-group span strong {color: var(--layout-dark-text);}
body.dark-mode .power_schedule .input-group .btn {background: var(--layout-dark-bg2);}


/*** Monitoring ***/
.blue_container_box{
	display : grid;
	grid-template-columns: 8fr 1fr;
	
	border-bottom : 2px solid #EBEBEB;
	
	padding : 15px;
	margin-top : -25px;
	margin-bottom : 40px;
}

.blue_container_box .blue_fluid_box{
	gap : 30px;
	line-height : 40px;
}

.blue_container_box .blue_fluid_box:nth-of-type(1){
	display : grid;
	grid-template-columns: auto repeat(4, 1fr) 7fr;
	justify-content: flex-end;
}


.blue_container_box .blue_fluid_box:nth-of-type(2){
	display : flex;
	justify-content: flex-end;
}


.blue_container_box .blue_fluid_box button{
	width : 110px;
	
	border : 1px solid #EBEBEB;
	border-radius: 10px;
	background-color : white;
	color : #333;
	
	box-shadow: rgba(0, 0, 0, 0.24) 0px 1px 1px;
	font-weight : 600;
	
}

.blue_container_box .blue_fluid_box button:hover{
    transition: none 0.2s;
	padding : 10px; 
	transform: scale( 1.03 );
    
	
}

.blue_container_box .blue_fluid_box button:nth-of-type(1):hover{
	border : 1px solid #00AD67;
	color : #00AD67;

}

.blue_container_box .blue_fluid_box button:nth-of-type(2):hover{
	border : 1px solid #FD5050;
	color : #FD5050;
}

.blue_container_box .blue_fluid_box button:nth-of-type(3):hover{
	border : 1px solid #666666;
	color : #666666;
}

.blue_container_box .blue_fluid_box button:nth-of-type(4):hover{
	border : 1px solid #F9D592;
	color : #F9D592;
}

/*** ¹öÆ° È£¹ö »ö»ó °øÅë css ***/
/*** ¹öÆ° È£¹ö »ö»ó °øÅë css
.blue_container_box .blue_fluid_box button:hover{
	border : 1px solid #666666;
	color : #666666;
}

***/
.blue_container_box .blue_fluid_box span{	
	width : auto;
	text-align : center;
	font-weight : bold;	
}


body.dark-mode .blue_container_box{
	border-color: #555555; 
}

body.dark-mode .blue_container_box *{
	color : #CCC;
	border-color: #555555; 
	
}

body.dark-mode .blue_container_box button{
	background-color : #333;
	
}