/* stylelint-disable selector-max-class, selector-max-combinators, selector-max-compound-selectors, declaration-no-important, selector-no-qualifying-type, property-no-vendor-prefix */
body {
    font-size: 14px;
    font-family: "Open sans", "Noto sans KR", sans-serif;
    min-width: 1280px !important;
    min-height: inherit;  !important;
    background: #1F2F46 !important;
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-moz-font-feature-settings: "liga", "kern";
	text-rendering: optimizelegibility;
}

.navbar-fixed-top,
.navbar-fixed-bottom {
    min-width: 1280px;
}
h1, h2, h3, h4, h5, h6 {
    font-family: "Open sans", "Noto sans KR", sans-serif;
    font-weight: 400;
}
ul, ol {
    list-style: none;
    margin: 0;
    padding: 0;
}
a,
a:hover,
a:focus,
a:active,
a.active,
.btn-link {
    color: #ABB5C3;
    outline: none;
    text-decoration: none;
    transition: all 0.3s;
}

a:focus,
button:focus,
button:focus-visible,
button:focus-within {
  outline:  3px solid transparent;
}

.btn-link, .btn-link:active, .btn-link:focus, .btn-link:hover {
    text-decoration: none;
}
.btn-primary {
    color: #fff;
    background-color: #85CD14;
    border-color: #7bbe12;
}
.btn-primary.active,
.btn-primary.focus,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:hover,
.open > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #85CD14;
    border-color: #7bbe12;
}
.btn-primary.active.focus,
.btn-primary.active:focus,
.btn-primary.active:hover,
.btn-primary:active.focus,
.btn-primary:active:focus,
.btn-primary:active:hover,
.open > .btn-primary.dropdown-toggle.focus,
.open > .btn-primary.dropdown-toggle:focus,
.open > .btn-primary.dropdown-toggle:hover {
    color: #fff;
    background-color: #85CD14;
    border-color: #7bbe12;
}
.btn-primary.disabled
.btn-primary.disabled:hover,
.btn-primary.disabled.active
.btn-primary.disabled.focus {
    background-color: #79ae27;
    border-color: #7bbe12;
}
.btn-secondary {
    color: #fff;
    background-color: #118FCE;
    border-color: #1085c0;
}
.btn-secondary.active,
.btn-secondary.focus,
.btn-secondary:active,
.btn-secondary:focus,
.btn-secondary:hover,
.open > .btn-secondary.dropdown-toggle {
    color: #fff;
    background-color: #1080b9;
    border-color: #0e6f9f;
}
.btn-gray {
    color: #fff;
    background-color: #B8BEC8;
    border-color: #ABB5C3;
}
.btn-gray.active,
.btn-gray.focus,
.btn-gray:active,
.btn-gray:focus,
.btn-gray:hover,
.open > .btn-gray.dropdown-toggle {
    color: #fff;
    background-color: #949daa;
    border-color: #868e99;
}
.btn-danger {
    background-color: #f36a5a;
    border-color: #f36a5a;
}
.no-gutters {
    margin-right: 0 !important;
    margin-left: 0 !important;
}
.no-gutters> .col,
.no-gutters> [class*="col-"] {
    padding-right: 0;
    padding-left: 0;
}

.half-gutters {
    margin-right: -7px;
    margin-left: -7px;
}
.half-gutters> .col,
.half-gutters> [class*="col-"] {
    padding-right: 7px;
    padding-left: 7px;
}
.ellipsis {
    width: 100px;
    display: block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

/* margin & padding */
.pt-5 {padding-top: 5px !important;}
.pt-10 {padding-top: 10px !important;}
.pa-0 {padding: 0 !important;}
.pa-5 {padding: 5px !important;}
.pa-10 {padding: 10px !important;}
.pa-20 {padding: 20px !important;}
.pa-30 {padding: 30px !important;}
.px-0 {padding-left: 0 !important;padding-right: 0 !important;}
.ma-0 {margin: 0 !important;}
.ma-10 {margin: 10px !important;}
.mb-0 { margin-bottom: 0 !important;}
.mb-5 { margin-bottom: 5px !important;}
.mb-10 {margin-bottom: 10px !important;}
.mb-15 {margin-bottom: 15px !important;}
.mb-20 {margin-bottom: 20px !important;}
.mb-30 {margin-bottom: 30px !important;}
.mr-0 {margin-right: 0 !important;}
.mr-5 {margin-right: 5px !important;}
.mr-10 {margin-right: 10px !important;}
.mr-15 {margin-right: 15px !important;}
.mt-10 {margin-top: 10px !important;}
.my-5 {margin-top: 5px !important; margin-bottom: 5px !important;}
.my-10 {margin-top: 10px !important; margin-bottom: 10px !important;}
.my-30 {margin-top: 30px !important; margin-bottom: 30px !important;}

.bg-white {background-color: #fff !important;}
.bg-gray {background-color: #F6F6FA !important;}

.text-primary { color: #118FCE !important;}
.text-secondary {color: #85CD14; !important;}
.text-info {color: #25AFF5 !important;}
.text-safety {color: #85CD14 !important;} /* for dashboard & fire page */
.text-caution {color: #FFC000 !important;} /* for dashboard & fire page */
.text-danger {color: #F95428 !important;} /* for dashboard & fire page */
.text-muted {color: #8F97A3 !important;}
.text-error {color: #FF6155 !important;}
.normal {font-weight: 400 !important;}
.bold {font-weight: 600 !important;}
.border-0 {border: none !important;}
.rounded-0 {border-radius: 0 !important;}
.img-responsive {max-width: 1200px;width: 100%;}
.d-block {display: block !important;}
.panel-body.px-0 {
    padding: 15px 0;
}
.w50 {width:50px !important;}
.w100 {width:100px !important;}
.w120 {width:120px !important;}
.w150 {width:150px !important;}

/* Reset the container */
.container {
    width: 970px;
    max-width: none !important;
}

.container .navbar-header,
.container .navbar-collapse {
    margin-right: 0;
    margin-left: 0;
}

/* Undo inline form compaction on small screens */

.input-group-btn {
   font-size: inherit; 
    width: auto;
    border-radius: 0;
    border: none;
    height: 32px;
}
.form-inline {
    display: inline-block;
}
.form-inline .input-group > .form-control {
    width: 100%;
}
.form-inline .input-group.input-md {
    width: 150px;
}
.form-inline .input-group .input-group-addon {
    padding: 0;
}
.form-inline .input-group .input-group-btn {
    width: 32px;
    height: 32px;
    border: none;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    font-size: 16px;
    background-color: #D3DCE5;
    color: #8E99AD;
}
.form-inline .control-label,
.form-group .control-label {
    margin-bottom: 0;
    vertical-align: middle;
    font-weight: 500;
    color:#8F97A3;
}
.form-group .control-label.eng{
    font-weight: 600 !important;
}
.form-inline .radio,
.form-inline .checkbox {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    vertical-align: middle;
    margin-right: 15px;
}

.form-inline .radio label,
.form-inline .checkbox label {
    padding-left: 0;
}

.form-inline .radio input[type="radio"],
.form-inline .checkbox input[type="checkbox"] {
    position: relative;
    margin-left: 0;
}

.form-inline .has-feedback .form-control-feedback {
    top: 0;
}
.form-inline .input-inline {
    margin-bottom: 3px;
}
.form-inline .input-inline.col-3 {
    width: 32%;
    margin-right: 0.5%;
}
.form-inline .input-inline.col-3:last-child {
    margin-right: 0;
}
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
    background-color: #eee;
    opacity: 1;
}

.form-horizontal.left .control-label {
    text-align: left;
    position: relative;
    padding-left: 20px;
    padding-top: 5px;
		font-weight: 500;
}
.form-horizontal.left .control-label:before {
    content:"";
    position:absolute;
    top: 13px;
    left: 10px;
    display:block;
    width:4px;
    height:4px;
    border-radius:20px;
    background-color:#8F97A3;
}
.form-group .input-group .input-group-addon {
    padding: 0;
}




.pagination > li > a,
.pagination > li > span,
.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover {
    color: #ABB5C3;
}
.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
    background-color: #ABB5C3;
    border-color: #ABB5C3;
}



/* table */
.table>thead>tr>th {
    vertical-align: middle;
    background-color: #B8BEC8;
    color: #fff;
    font-weight: 500;
}

.table-bordered,
.table-bordered > tbody > tr > td,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > td,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > thead > tr > th {
    border-color: #D3DCE5;
    vertical-align: middle;
    border-width: 1px;
}
.table-bordered > tbody > tr > td {
    background-color: #fff;
}
.table-bordered > thead > tr > th {
    background-color: #B8BEC8;
		vertical-align: middle !important;
}
.table-bordered > tbody > tr > td > .btn {
	margin-right: 3px;
}
.table-bordered > tbody > tr > td > .btn:last-child {
	margin-right: 0;
}
.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: #fff;
}
.table-striped>tbody>tr:nth-of-type(even) {
    background-color: #F5F7FB;
}
.table-scrollable.scrollable-xs .table {
    font-size: 14px;
    letter-spacing: -1px;
    margin-bottom: 10px;
}
.table-scrollable.scrollable-xs .table:last-child {
    margin-bottom: 0;
}
.table-scrollable .bootstrap-table {
    margin-bottom: 20px;
}
.table-horizontal > tbody > tr > th {
    background-color: #B8BEC8;
    color: #fff;
    font-weight: 500;
    text-align: center;
}

.table-horizontal > tbody > tr > td.header {
    background-color: #F5F7FB;
}
.fixed-table-container {
    border: none!important;
}
.fixed-table-container thead th:first-child {
    border-top-left-radius: 0;
    -webkit-border-top-left-radius: 0;
    -moz-border-radius-topleft: 0;
}


.ico[class^="icon-"].off, .ico[class*="icon-"].off {
    color: #8f97a3;
}
.ico[class^="icon-"].on, .ico[class*="icon-"].on {
    color: #118FCE;
}
.ico[class^="icon-"].error, .ico[class*="icon-"].error {
    color: #FF6155;
}
.ico[class^="icon-"].md, .ico[class*="icon-"].md {
    font-size: 2rem;
}
.ico[class^="icon-"].lg, .ico[class*="icon-"].lg {
    font-size: 4rem;
}
.ico[class^="icon-"].xl, .ico[class*="icon-"].xl {
    font-size: 7rem;
}
.ico.speed1 {
		-webkit-animation: fa-spin 0.5s infinite linear;
    animation: fa-spin 0.5s infinite linear;
}
.ico.speed2 {
		-webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear;
}

/*
 * Login
 */
.login.bg-login {
    background-color: #e9ecf3 !important;
}
.login .form-control, .login .btn-lg {
    font-size: 15px;
    padding: 13px 12px 12px;
}
.login .login-wrapper {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  min-height: 100%;
  padding: 140px 0;
}

.login .form-content {
  background-color: #fff;
  padding: 30px;
  width: 100%;
  max-width: 860px;
  position: relative;
  padding: 0px;
  -webkit-box-shadow: 0 20px 50px 0 rgba(0,0,0,0.2);
  box-shadow: 0 20px 50px 0 rgba(0,0,0,0.2);
  border-radius: 4px;
  overflow: hidden;
}
.login .form-content .portlet {
    border: 0;
    margin-bottom: 0;
    padding: 25px 30px 15px;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}
.login .form-content .portlet.color-blue {border-top: 4px solid #128fce;}
.login .form-content .portlet.color-green {border-top: 4px solid #039535;}
.login .form-content .form-body {
    padding: 0 !important;;
}
.login .form-content .bg-image {
    width: 100%;
    height: 590px;
    background: url(/assets/img/bg-login-1ecfbb4aa1d954ac7f054fd32924d455.png) center no-repeat;
    background-size: cover;
}
.login .form-content .floating-text {
    position: absolute;
    left: 20px;
    bottom: 15px;
}

.login .form-content .floating-text h3,
.login .form-content .floating-text p {
    font-weight: 300;
    letter-spacing: -1px;
    color: #fff;
    text-shadow: 1px 5px 12px rgba(0,0,0,0.9);
}
.login .form-content .floating-text h3 {
    font-size: 36px;
    margin-bottom: 10px;
}
.login .form-content .floating-text p {
    font-size: 24px;
    margin-top: 0;
    margin-bottom: 40px;
}
.login .form-content .floating-text .copyright {
    font-size: 12px;
    color: rgba(255,255,255,.8);
}
.login .form-content .form-body h3 {
    font-size: 36px;
    margin-bottom: 10px;
    font-weight: 300;
    letter-spacing: -1px;
}
.login .form-content .form-body p {
    font-size: 20px;
    margin-top: 0;
    margin-bottom: 30px;
    font-weight: 400;
    letter-spacing: -1px;
}


/* Simple CSS3 Fade-in-down Animation */
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}




/*
 * Header
 */

.page-header.navbar {
    width: 100%;
    padding: 0 20px 0 20px;
    margin: 0;
    border: 0px;
    padding: 0px;
    box-shadow: none;
    height: 58px;
    min-height: 58px;
    filter: none;
    background-color: #fff;;
    border-bottom: 1px solid #d4e2f9 !important;
}

.page-header.navbar.navbar-fixed-top {
    z-index: 9995;
}

.page-header.navbar.navbar-static-top {
    z-index: 9995;
}
.page-header.navbar .page-logo {
    float: left;
    display: block;
    width: 240px;
    height: 58px;
    padding-left: 10px;
    padding-right: 10px;
    overflow: hidden;
}
.page-header.navbar .page-logo > .logo-image {
    display: inline-block;
    float: left;
    width: 190px;
}
.page-header.navbar .page-logo .logo-default {
    width: 100%;
    margin: 2px 0;
}
.page-sidebar .menu-toggler {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 8px 15px;
    background-color: #354458;
    z-index: 99;
    width: auto;
    height: auto;
    border-radius: 0;
    opacity: 1;
}
.page-sidebar .menu-toggler .fa {
    opacity: 0.7;
    filter: alpha(opacity=70);
    left: 7px;
    position: relative;
}
.page-sidebar .menu-toggler:hover .fa {
    opacity: 1;
    filter: alpha(opacity=100);
}
.page-sidebar-closed .page-sidebar .menu-toggler {
    top: 0;
    right: -40px;
    background-color: #1F2F46;
    padding: 10px 15px;
}
.page-sidebar-closed .page-sidebar .menu-toggler .fa:before {
    content: "\f054";
}
.page-sidebar .menu-toggler .icon-bar {
    display: block;
    width: 23px;
    height: 2px;
    background-color: #fff;
    margin: 4px 0 5px;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
    opacity: 1;
    filter: alpha(opacity=1);
}

.page-header.navbar .top-menu {
    margin-top: 5px;
    padding: 0;
    float: right;
    margin-right:8px;
}
.page-header.navbar .top-menu .navbar-nav > li.dropdown {
    margin: 0;
    padding: 0;
    display: inline-block;
}
.page-header.navbar .top-menu .navbar-nav > li.dropdown.dropdown-user{
    margin: 4px 10px 4px 0;
}
.page-header.navbar .top-menu .navbar-nav > li.dropdown > button {
    cursor: pointer;
    padding: 12px 7px;
    background: transparent;
    border: 0;
    color: #c0cddc;
    font-size: 18px;
    min-width: 40px;
}

/*
 * Page sidebar
 */
.page-sidebar-wrapper {
    position: relative;
}
.page-sidebar.collapse {
    position:fixed;
    top:108px;
    z-index:99;
    max-height: 0 !important;
}

.page-sidebar .page-sidebar-menu li.heading {
    color: #fff;
    background-color: #354458;
    display: block;
    padding: 8px 14px;
    font-weight: 600;
}

.page-sidebar > .page-sidebar-menu > li:hover > a {
    background: rgba(255,255,255,0.2);
}
.page-sidebar > .page-sidebar-menu > li.open:hover > a {
    background-color: transparent;
}
.page-sidebar .page-sidebar-menu .sub-menu,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu {
    margin: 0;
}
.page-sidebar .page-sidebar-menu > li > a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li > a {
    padding: 10px 2px 10px 10px;
    letter-spacing: -.25px;
    font-weight: 400;
    color: rgba(255,255,255,0.7);
}
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a,
.page-sidebar .page-sidebar-menu > li.active > a {
    padding-left: 10px;
    color: rgba(255,255,255,1);
}
.page-sidebar .page-sidebar-menu .sub-menu li > a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > a {
    padding: 8px 15px 8px 22px;
    color: rgba(255,255,255,0.7);
}

.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu > li:hover > a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu > li.open > a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu > li.active > a,
.page-sidebar .page-sidebar-menu .sub-menu > li:hover > a,
.page-sidebar .page-sidebar-menu .sub-menu > li.open > a,
.page-sidebar .page-sidebar-menu .sub-menu > li.active > a {
    color: #fff;
    background: rgba(255,255,255,0.2);
}
.page-sidebar .page-sidebar-menu .sub-menu li > .sub-menu > li > a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > .sub-menu > li > a {
    padding-left: 35px;
}
.page-sidebar .page-sidebar-menu .sub-menu li > .sub-menu > li > .nav-link.selected,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > .sub-menu > li > .nav-link.selected {
   background:#118FCE;
}
.page-sidebar .page-sidebar-menu .sub-menu li a:hover {
	background: none;
}
.page-sidebar .page-sidebar-menu .sub-menu li > .sub-menu > li > .sub-menu > li > a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > .sub-menu > li > .sub-menu > li > a {
    padding-left: 50px;
}
.page-container-bg-solid .page-sidebar .page-sidebar-menu > li.active > a > .selected,
.page-container-bg-solid .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a > .selected {
    border: 2px solid #fff;
    height: 44px;
    top: 0;
    float: left;
    left: 0;
}
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active.open > a {
    background-color:rgba(255, 255, 255, 0.08)!important;
    color: #fff;
}
.page-sidebar .page-sidebar-menu > li.active > a,
.page-sidebar .page-sidebar-menu > li.active.open > a {
    background-color:rgba(255, 255, 255, 0.08);
}
.page-sidebar-menu.page-sidebar-menu-closed > li:hover {
    background-color:#29a3d7 !important;
    box-shadow:none !important;
}
.page-sidebar-closed .page-content-wrapper .page-content {
    margin-left: 15px !important;
}
.page-sidebar-closed .page-sidebar {
    width: 5px !important;
}
.page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed {
    visibility: hidden;
}
.page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed > li > a:hover {
    box-shadow:none !important;
}

.page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed > li:hover,
.page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed > li:hover .sub-menu {
    box-shadow:none !important;
}
.page-sidebar .page-sidebar-menu > li.active > a > .selected {
    top:12px;
}

.page-sidebar .page-sidebar-menu > li.active > a .title,
.page-sidebar .page-sidebar-menu > li.active.open > a .title {
	  width: 178px;
	  height: 16px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active.open > a, .page-sidebar .page-sidebar-menu > li.active > a, .page-sidebar .page-sidebar-menu > li.active.open > a {
    color: #fff;
    background-color:rgba(255, 255, 255, 0.08);
}
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu li > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu li > a > .arrow.open:before, .page-sidebar .page-sidebar-menu li > a > .arrow:before, .page-sidebar .page-sidebar-menu li > a > .arrow.open:before {
    color: rgba(255,255,255,0.4);
}
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu li:hover > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu li:hover > a > .arrow.open:before, .page-sidebar .page-sidebar-menu li:hover > a > .arrow:before, .page-sidebar .page-sidebar-menu li:hover > a > .arrow.open:before {
    color: rgba(255,255,255,1);
}
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li > a > i[class^="icon-"],
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li > a > i[class*="icon-"],
.page-sidebar .page-sidebar-menu > li > a > i[class^="icon-"],
.page-sidebar .page-sidebar-menu > li > a > i[class*="icon-"] {
    color: rgba(255,255,255,0.7);
}
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a > i[class^="icon-"],
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a > i[class*="icon-"],
.page-sidebar .page-sidebar-menu > li.active > a > i[class^="icon-"],
.page-sidebar .page-sidebar-menu > li.active > a > i[class*="icon-"] {
    color: rgba(255,255,255,1);
}
.page-sidebar .page-sidebar-menu .sub-menu li > .sub-menu > li,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > .sub-menu > li {
    position: relative;
}
.page-sidebar .page-sidebar-menu .sub-menu li>.floating,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li> .floating  {
    position: absolute;
    left: 0;
    top: 6px;
}
.page-sidebar .page-sidebar-menu .sub-menu li>.floating .label,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li> .floating .label  {
    font-size: 11px;
    letter-spacing: -1px;
}
.page-sidebar .page-sidebar-menu li>.sub-menu li>.sub-menu li>.sub-menu {
    max-height: 570px;
    overflow-y: auto;
    background-color: rgba(0,0,0,.2);
}
.page-sidebar .page-sidebar-menu li>.sub-menu li>.sub-menu li>.sub-menu::-webkit-scrollbar {
  width: 5px;
}

.page-sidebar .page-sidebar-menu li>.sub-menu li>.sub-menu li>.sub-menu::-webkit-scrollbar-track {
  background-color: rgba(255,255,255,.1);
}

.page-sidebar .page-sidebar-menu li>.sub-menu li>.sub-menu li>.sub-menu::-webkit-scrollbar-thumb {
  background-color: rgba(255,255,255,.3);
}
/*
 * Page breadcrumb
 */
.breadcrumb {
    background-color: transparent;
    padding: 8px 0;
    margin-bottom: 10px;
    border-radius: 0;
}
.breadcrumb>li>a {
    color: #858d9b;
}
.breadcrumb>li+li:before {
    display: inline-block;
    content: "\f105";
    font-family: "fontAwesome";
    padding: 0 2px;
    color: #adb3bc;
    font-size: 16px;
}
.breadcrumb>.active {
    color: #1F2F46;
}



/*
 * Navbar
 */

.navbar-brand {
    width: 175px;
    font-size: 1rem;
    margin-left: 5px;
}
.navbar-brand > img {
    width: 100%;
}

.navbar .form-control {
    padding: .75rem 1rem;
    border-width: 0;
    border-radius: 0;
}

.form-control-dark {
    color: #fff;
    background-color: rgba(255, 255, 255, .1);
    border-color: rgba(255, 255, 255, .1);
}

.form-control-dark:focus {
    border-color: transparent;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);
}


.navbar.navbar-default {
    height: 50px;
    border-radius: 0;
    border: none;
    background-color: #118FCE;
    margin-bottom: 0;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.navbar.navbar-default .nav>li>a {
    color: #fff;
    opacity: 0.5;
    font-size: 16px;
    min-width: 100px;
}
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>.open>a:hover {
    background-color: rgba(0,0,0,.1);
    color: #fff;
    opacity: 1;
}
.navbar-nav {
    margin: 0 !important;
}
.navbar-nav>li {
    float: left !important;
}
.navbar-nav>li>a {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}
.navbar-nav>li>.dropdown-menu {
    font-family: "Noto sans KR", sans-serif;
    border-radius: 0;
    background-color: #0F80B9;
    margin: -1px 0 0 0;
    padding: 0;
}
.navbar-nav>li>.dropdown-menu > li > a {
    position: relative;
    padding: 12px 16px;
    color: rgba(255,255,255,.5);
    border-bottom: 1px solid rgba(255,255,255,.2);
    font-weight: 400;
    cursor: pointer;
}
.navbar-nav>li>.dropdown-menu>li>a.active
.navbar-nav>li>.dropdown-menu>li>a:focus,
.navbar-nav>li>.dropdown-menu>li>a:hover {
    color: rgba(255,255,255,1);
    background-color: rgba(0,0,0,.1);
}
.navbar-nav>li>.dropdown-menu>li>a.active:before,
.navbar-nav>li>.dropdown-menu>li>a:focus:before,
.navbar-nav>li>.dropdown-menu>li>a:hover:before {
    content: "";
    position: absolute;
    left:0;
    top:0;
    display: block;
    width: 4px;
    height:43px;
    background-color: #fff;
}
.navbar-nav>li>.dropdown-menu > li:first-child:hover > a,
.navbar-nav>li>.dropdown-menu > li:last-child:hover > a {
    border-radius: 0;
}
.navbar-nav>li>.dropdown-menu > li:last-child > a {
    border-bottom: none;
}
.navbar-nav>.dropdown > .dropdown-menu:before,
.navbar-nav>.dropdown > .dropdown-menu:after {
    display: none !important;
}
.navbar.navbar-default .date {
    float: right;
    display: inline-block;
    margin: 15px 20px 0 0;
    color: #fff;
}

/*GNB Hover style */
.dropdown:hover .dropdown-menu, .btn-group:hover .dropdown-menu {
    display: block;
}
.dropdown-menu{
    margin-top: 0;
}
.dropdown-toggle{
    margin-bottom: 2px;
}
.navbar .dropdown-toggle, .nav-tabs .dropdown-toggle{
    margin-bottom: 0;
}



/*
 * Page content
 */

.page-header-fixed .page-container {
    margin-top: 108px;
}
.page-content-wrapper .page-content {
    margin-left: 235px;
    padding: 10px 20px 30px;
}
.page-footer {
    position: relative;
    z-index: 9;
    padding: 0;
    font-size: 13px;
    height: auto;
    background-color: transparent;

}
.page-footer-inner {
    letter-spacing: -.2px;
    padding: 6px 20px;
    font-size: 11px;
    color: #8E99AD;
    z-index: 11;
    position: fixed;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 28px;
    text-align: right;
    background-color: #fafafa;
    box-shadow: 0 -1px 1px rgba(0,0,0,.1);
}

/* Scroll Top Top */
.scroll-to-top {
    display: none;
    display: inline-block;
    padding: 1px;
    text-align: center;
    position: fixed;
    bottom: 10px;
    z-index: 10001;
    display: none;
    right: 10px;
}

.scroll-to-top > i {
    display: inline-block;
    color: #687991;
    font-size: 30px;
    opacity: 0.6;
    filter: alpha(opacity=60);
}

.scroll-to-top:hover {
    cursor: pointer;
}

.scroll-to-top:hover > i {
    opacity: 1;
    filter: alpha(opacity=100);
}


.page-inner {
    padding: 20px 20px 38px 230px;
}
.page-title {
    padding: 0px;
    font-size: 28px;
    letter-spacing: -1px;
    display: block;
    color: #666;
    margin: 0px 0px 15px 0px;
    font-weight: 300;
    color: #666;
    margin-bottom: 7px;
    margin-top: 10px;
}
.page-head .page-title {
   margin: 0;
}
.page-head .page-title > h1 {
    display: inline-block;
    color: #34495e;
    font-size: 24px;
    font-weight: 500;
    margin: 0;
    padding: 0;
}
.page-sidebar-closed .page-head .page-title > h1 {
    padding-left: 15px;
}
.bg-filed {
    background: url(/assets/img/bg-filed-9b25e48f9ef7c36c5bd5090c9fe0baaf.png) center no-repeat;
    background-size: cover;
}
.bg-filed.portlet-body {
    height: 620px;
}


/* multiple item carousel */

.col-centered {
    padding: 40px;
}

.carousel-col {
    position: relative;
    left: -5px;
    min-height: 1px;
    float: left;
    width: 33.33%;
    text-align: center;
    display: flex !important;
    flex-direction: row;
    justify-content: center;
}
.carousel-control {
    width: 50px;
    height: 50px;
    border-radius: 50px;
    background-color: rgba(255,255,255,.5);
    box-shadow: 1px 1px 3px rgba(0,0,0,.5);
}
.carousel-control.left,
.carousel-control.right {
    margin-right: 20px;
    margin-left: 20px;
    background-image: none;
    opacity: 1;
    transform: translateY(-50%);
    top: 55%;
}
.carousel-control.left {
    left: -40px;
}
.carousel-control.right {
    right: -40px;
}
.carousel-control > a > i {
    color: #fff;
    font-size: 40px;
    position: absolute;
    top: 3px;
}
.carousel-control.left > a > i {
    left: 15px;
}

.carousel-control.right > a > i {
    left: 20px;
}

.carousel-inner .active > div {
    display: none;
}

.carousel-inner .active > div:first-child {
    display: block;
}
.carousel-inner .active > div:first-child + div,
.carousel-inner .active > div:first-child + div + div,
.carousel-inner .active > div:first-child + div + div + div {
    display: block;
}


.multi-item-carousel .carousel-inner > .item {
  -webkit-transition: 500ms ease-in-out left;
  transition: 500ms ease-in-out left;
}
.multi-item-carousel .carousel-inner .active.left {
  left: -33%;
}
.multi-item-carousel .carousel-inner .active.right {
  left: 33%;
}
.multi-item-carousel .carousel-inner .next {
  left: 33%;
}
.multi-item-carousel .carousel-inner .prev {
  left: -33%;
}
@media all and (transform-3d), (-webkit-transform-3d) {
  .multi-item-carousel .carousel-inner > .item {
    -webkit-transition: 500ms ease-in-out all;
    transition: 500ms ease-in-out all;
    -webkit-backface-visibility: visible;
            backface-visibility: visible;
    -webkit-transform: none!important;
            transform: none!important;
  }
}

.carousel-col .block {
    display: block;
    position: relative;
    min-width: 396px;
    max-width: 520px;
    width: 100%;
    height: 500px;
    background-image: url(/assets/img/bg-house-4630ecd9fdae35849a8fc2b619e3f8e0.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    text-align: center;
}
.carousel-col .block .inner {
    padding: 7rem 6.5rem 7rem 8rem;
    display: block;
    position: absolute;
    left: 50%;
    width: 100%;
    transform: translateX(-50%);
}
@media (max-width: 1600px) {
     .carousel-col .block .inner {
        padding: 7rem 5rem 7rem 6.5rem;
    }
}
@media (max-width: 1440px) {
    .carousel-col .block .inner {
        padding: 7rem 5rem 7rem 6rem;
    }
}
.carousel-single .carousel-col {
	float: none;
	width: 100%;
	left: 0;
}
.carousel-single .carousel-col .block {
	min-width: auto;
	background: none;
}
.carousel-single .carousel-col .block .inner {
	padding: 2rem !important;
}

.block-condition {
    margin-right: 10px;
}
.block-condition .weather {
    font-size: 28px;
    margin: 8px 0;
    overflow: hidden;
}
.list-inline.symmetrical {
    margin-left: 0;
}
.list-inline.symmetrical dl {
    overflow: hidden;
    margin-bottom: 10px;
}

.list-inline.symmetrical dt {
    float: left;
    font-weight: normal;
    color: #8F97A3;
}

.list-inline.symmetrical dd {
    float: right;
}
.rounded-title {
    border-radius: 50px;
    font-size: 20px;
    font-weight: 600;
    padding: 10px 15px;
    background: #fff;
    color: #1F2F46;
    display: inline-block;
    min-width: 150px;
    box-shadow: 1px 1px 3px rgba(0,0,0,.2);

}
.collapse-toggle {
    width: 100%;
    height: 2px;
    position: relative;
    text-align: center;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    background: #fff;
    margin-bottom: 30px;
}
.collapse-toggle .btn {
    padding: 1px 12px;
    border: none;
    border-radius: 0;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,.2) !important;
}
.collapse-toggle .btn::before {
    content: "\f106";
    font-family: 'FontAwesome';
    float: right;
    width: 20px;
    height: auto;
    text-align: center;
    margin-top: -1px;
    margin-right: 0px;
    margin-left: 0px;
    display: inline;
    font-size: 16px;
    font-weight: 300;
    text-shadow: none;
}
.collapse-toggle .btn.collapsed {
    background: #fff;
}
.collapse-toggle .btn.collapsed::before  {
    content: "\f107";
}


.floating-top-group {
    position: absolute;
    top:0;
    left:0;
    right: 0;
    z-index: 2;
}
.controller-list {
  max-width: 88%;
  display : flex ;
  flex-direction : row ;
  flex-wrap : wrap ;
}
.controller-list .panel {
    text-align: center;
    margin-right: 4px;
    border: 1px solid #e4e5e9;
    border-radius: 0;
}
.controller-list .panel:last-child {
    margin-right: 0;
}
.controller-list .panel.panel-xs {

    width: 85px;
    height: auto;
    margin-bottom: 10px;
}
.controller-list .panel.panel-md {
    float: left;
    max-width: 140px;
    height: 154px;
    margin-bottom: 0;
}
.controller-list .panel-body {
    position: relative;
    padding: 5px;
    min-height: 85px;
}

.controller-list .panel-body .item-name {
    display: block;
    color: #8F97A3;
    letter-spacing: -1px;
	  overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.controller-list .panel-footer {
	  padding: 5px;
    border-radius: 0;
    color: #fff;
	  background-color: #F6F6FA;
	  border-top-color: #e4e5e9;
}
.controller-list .panel-footer.label-error {
    background-color: rgb(255, 97, 85, .75);
}
.controller-list .panel-footer.label-off {
    background-color: #F6F6FA;
	  color: #8F97A3;
}
.controller-list .panel-footer.label-on {
    background-color: rgba(17, 143, 206, .5);
}


.controller-list.feed {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.controller-list.feed>img {
    width: 60%;
    margin: 0;
    padding: 0;
}


.floating-top-group .warning-stat {
    position: absolute;
    top: 0;
    right: 36px;
}
.floating-top-group .warning-stat .dropdown-menu {
    left: -142px;
    min-width: 275px;
    padding: 10px;
}

.btn-group .dropdown-menu:before,
.btn-group .dropdown-menu:after {
     display: none!important;
}
.dropdown-menu > li > a {
    font-weight: 400;
}
.floating-top-group .zoom {
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 58px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #fff;
}
.floating-top-group .zoom .btn {
    width: 28px;
    height: 28px;
    background-color: transparent;
    color: #B3B3B3;
    padding: 0px;
    border-radius: 0;
}
.floating-top-group .zoom .btn:first-child {
    border-bottom:1px solid #ddd;
}
.floating-top-group .zoom .btn:hover {
    color: #118FCE;
    background-color: #F6F6FA;
}
.floating-top-group .align-right {
    position: absolute;
	  top:0;
    right:0;
}
.floating-top-group .align-right .compass {
    width: 50px;
}
.floating-bottom-group {
    position: absolute;
    bottom:0;
    left:0;
    right: 0;
    z-index: 2;
}
.floating-bottom-group .legend {
    position: absolute;
    bottom:0;
    right: 0;
}
.floating-bottom-group .legend .dropdown-menu {
    left: -3px !important;
    min-width: 100px;
    color: #8F97A3;
    padding: 10px;
}

@media (max-width: 1550px) {
      .floating-bottom-group {
        bottom: 30px;
        width: 97%;
    }
}



.vertical-range {
    position: relative;
    left: -8px;
    float: right;
}
.vertical-range .icon-feed {
    position: absolute;
    right: -7px;
    bottom: 7px;
}
.vertical-range .progress-bar-vertical {
    width: 14px;
    min-height: 100px;
    display: flex;
    align-items: flex-end;
    background-color: #fff;
    border: 2px solid #DC9E15;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

.vertical-range .progress-bar-vertical .progress-bar {
    width: 100%;
    height: 0;
    background-color: #DC9E15;
    -webkit-transition: height 0.6s ease;
    -o-transition: height 0.6s ease;
    transition: height 0.6s ease;
}
.vertical-range .progress-bar-vertical .progress-bar .value, .value-weight {
    position: absolute;
    left: -68px;
    top: 23px;
    color: #1F2F46;
    font-size: 18px;
    font-weight: 700;
    display: block;
    width: 60px;
}

.value-weight {
    left: 62px;
    top: 40px;
}
.vertical-range .progress-bar-vertical .progress-bar .value>small, .value-weight>small {
    font-weight: normal;
}
.controller-list.feed .vertical-range {
    position: relative;
    top: -40px;
    left: -14px;
    z-index: 1;
}

.controller-list.feed .vertical-range .progress-bar-vertical {
    width: 20px;
    min-height: 140px;
}
.controller-list.feed .vertical-range:before {
    content: url(../img/icon/ball-feed-96a8a59acbdedca81e11f2c78a8ba1f9.svg);
    left: 5px;
    bottom: 30px;
    position: absolute;
    z-index: 2;  
}
.controller-list.feed .vertical-range:after {
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-color: #DC9E15;
    border-radius: 50px;
    position: relative;
    left: -10px;
    top: -25px;
}

.controller-list.feed .value {
    position: absolute;
    top: 35%;
    left: 45%;
    transform: translate(-50%, -50%);
    font-size: 4rem;
    font-weight: 600;
}

.controller-list.feed .vertical-range .icon-seed {
    display: block;
    width: 16px;
}
.thumbnail .caption .title {
    font-size: 17px;
    font-weight: 600;
    text-align: center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}



/* circle chart in donsa */

.flex-wrapper {
    display: flex;
    flex-flow: row nowrap;
    width: 450px;
    padding: 9px;
}
.switch,
.single-chart {
    position: relative;
    width: 25%;
    justify-content: space-around ;
    background-color: #F5F7FB;
    margin-right: 5px;
    border-radius: 4px;
}
.switch > .title,
.single-chart > .title {
    display: inline-block;
    margin-top: 10px;
    margin-left: 10px;
    color: #8F97A3;
}
.single-chart > small {
    position: absolute;
    right: 10px;
    bottom: 7px;
    font-size: 14px;
}

.switch {
    margin-right: 0;
}
.circular-chart {
  display: block;
  margin: 10px 10px 20px;
  max-width: 100%;
  max-height: 250px;
}
.circle-bg {
  fill: none;
  stroke: #eee;
  stroke-width: 3.8;
}
.circle {
  fill: none;
  stroke-width: 2.8;
  stroke-linecap: round;
  animation: progress 1s ease-out forwards;
}

@keyframes progress {
  0% {
    stroke-dasharray: 0 100;
  }
}
.circular-chart.orange .circle {
  stroke: #ff9f00;
}
.circular-chart.green .circle {
  stroke: #4CC790;
}
.circular-chart.blue .circle {
  stroke: #3c9ee5;
}
.percentage {
  fill: #666;
  font-family: "Open sans", "Noto sans KR", sans-serif;
  font-size: 0.5em;
  text-anchor: middle;
  font-weight: 700;
  letter-spacing: 0;
}



/* on&off switch style */
.toggle-switch {
    display: table;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
}

.toggle-switch input {
    display: none;
}

.toggle-switch input:focus + div {
    text-decoration: underline;
}

.toggle-switch > div {
    cursor: pointer;
    border-radius: 2rem;
    width: 6rem;
    height: 3rem;
    color: #8f97a3;
    border: 1px solid #8f97a3;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: relative;
    -webkit-transition: 200ms ease-out;
    transition: 200ms ease-out;
    font-size: 0;
    text-align: left;
}

.toggle-switch > div:hover {
    box-shadow: 0 1 5px #85CD14;
}

.toggle-switch > div:before {
    will-change: translate;
    display: block;
    position: absolute;
    top: calc(50% - 1rem);
    left: .4rem;
    content: '';
    width: 2rem;
    height: 2rem;
    background: #8f97a3;
    border-radius: 50%;
    -webkit-transition: 200ms;
    transition: 200ms;
}

.toggle-switch > div:after {
    width: 6rem;
    font-size: 13px;
    font-weight: 600;
    position: absolute;
    left: 27px;
    top: 48%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    content: attr(data-off);
    pointer-events: none;
}

.toggle-switch input:checked + div {
    background: #85CD14;
    border-color: #7bbe12;
}

.toggle-switch input:checked + div:before {
    left: 1.25rem;
    color: #85CD14;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transform: translateX(calc(0.8*100% + 4px));
    transform: translateX(calc(0.8*100% + 4px));
    background: white;
}

.toggle-switch input:checked + div:after {
    content: attr(data-on);
    left: 9px;
    color: #fff;
}

.toggle-switch input:focus + div:after {
    text-decoration: underline;
}


/* popover styles */
.popover {
    display: block;
    font-family: "Open sans", "Noto sans KR", sans-serif;
}

.popover.disable .popover-title {background-color: #D3DCE5;} 
.popover.normal .popover-title {background-color: #118FCE;}
.popover.error .popover-title {background-color: #FF6155;}

.popover .popover-title,
.popover .popover-content {
    float:left;
    padding: 9px;
    min-width: 32px;
	  font-size: 13px;
}
.popover .popover-title {
    border-bottom: none;
    border-top-right-radius: 0;
    border-bottom-left-radius: 4px;
    background-color: #D3DCE5;
}
.popover-title>i {
    font-size: 1.5rem;
    color: #fff !important;
}
.popover.disable .popover-title > i {color: #8E99AD !important;}

.popover .popover-content > span {
    color: #8F97A3;
    font-weight: 600;
    letter-spacing: -1px;
    
}
.popover.disable .popover-content > span {
    color: #8E99AD;
}
.popover.normal .popover-content > span {
    color: #118FCE;
}
.popover.error .popover-content > span {
    color: #FF6155;
}
.popover .popover-content > .title {
	font-weight: 600;
	margin-bottom: 3px;
}
.popover .popover-content > ul > li {
	position: relative;
	padding-left: 8px;
}
.popover .popover-content > ul > li:before {
	content: "";
	width: 4px;
	height: 4px;
	border-radius: 50px;
	background-color: #8E99AD;
	display: block;
	position: relative;
	left: -8px;
	top: 11px;
}
.popover.top {
	margin-top: 0 !important;
}
.actions.left {
    float: left;
}
.title-collapse-group {
    overflow: hidden;
    margin-bottom: 10px;
}
.title-collapse-group .title {
    position: relative;
    background-color: #fff;
    padding: 0 15px 0 0;
    z-index: 2;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.title-collapse-group .title>i,
.title-collapse-group .title>span {
    margin-right: 5px;
}
.title-collapse-group .btn-group {
    margin-right:10px;
}
.title-collapse-group .btn-group:last-child {
    margin-right: 0;
}

.title-collapse-group .btn-link {
    position: relative;
    z-index: 1;
}
.title-collapse-group .btn-link:before,
.title-collapse-group .btn-link:after {
    content: "";
    display: block;
    position: absolute;
    top: 15px;
    width: 100vh;
    height: 1px;
    background-color: #D3DCE5;
}
.title-collapse-group .btn-link:before {
    right: 40px;
}
.title-collapse-group .btn-link:after {
    right: 760px;
}
.title-collapse-group .btn-link.collapsed>i:before {
    content: "\f077";
}

.tab-content  {
    padding: 20px;
}
.tab-content > .tab-pane {
    padding-bottom: 4px;
}

.tabbable-line > .tab-content {
    padding: 15px 0;
}
.chart-wrapper {
    width: 100%;
    min-height: 300px;
    background-color: #fff;
    padding: 15px 0;
    text-align: center;
}

.label {
    font-weight: normal;
    font-size: 13px;
}
.label-box {
    padding: 20px;
    font-size: 13px;
}

.label-box div.checker span,
.label-box div.checker.hover span {
    border-radius: 100%;
    background-color: #fff;
    margin-right: 10px;
    background-position: 200px 260px;
}

.label-box .div.checker.focus span,
.label-box div.checker span.checked {
    background-position: -209px -260px;
}

.label-box .label-txt {
    border-radius: 24px;
    padding: 8px 16px 8px 12px;
}

.label-box div.checker {
    margin-right: 8px;
    width: 18px;
    height: 18px;
}

.label-box-title {
    margin-bottom: 10px;
    position: relative;
    top: -5px;
    background-color: #aaa;
}
.label:empty {
    display: inline-block;
}
.label-dotted {
    position: relative;
    top: 2px;
    width: 9px;
    height: 14px;
    border-radius: 50%;
    background-color: transparent;
}

.label-danger {
    background-color: #F95428;
}
.label-warning {
    background-color: #ff5c00;
}
.label-attention {
    background-color: #ffc000;
}
.label-normal {
    background-color: #85CD14;
}
.label-default {
    background-color: #118FCE;
}
.label-muted {
    background-color: #B8BEC8;
}
.label-error {
    background-color: #FF6155;
}
.label-secondary {
    background-color: #85CD14;
}
.label-primary {
    background-color: #118FCE;
}
.label-primary.section {
	font-size: 14px;
	border-radius: 0;
}
.label-lgblue {
    background-color: #C0EEFD;
}

/* legend radio button style */
.legend-group {
    text-align: left;
}
.legend-group .radio input, .legend-group .checkbox input{
    display: none;
}

.legend-group .radio input + span,
.legend-group .checkbox input + span {
    line-height: 1.2;
    height: 22px;
    padding-left: 20px;
    display: block;
    position: relative;
    font-weight: 400;
    font-size: 13px;
    color: #8F97A3;
    cursor: pointer;
}
.legend-group .radio input + span:not(:empty),
.legend-group .checkbox input + span:not(:empty) {
    padding-left: 20px;
}
.legend-group .radio input + span:before, .radio input + span:after,
.legend-group .checkbox input + span:before, .checkbox input + span:after {
    content: '';
    width: 16px;
    height: 16px;
    display: block;
    border-radius: 50%;
    left: 0;
    top: 0;
    position: absolute;
}
.legend-group .radio input + span:before,
.legend-group .checkbox input + span:before {
  background: #D1D7E3;
  -webkit-transition: background 0.2s ease, -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2);
  transition: background 0.2s ease, -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2);
  transition: background 0.2s ease, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2);
  transition: background 0.2s ease, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2);
}
.legend-group .radio input + span:after,
.legend-group .checkbox input + span:after { 
  background: transparent;
  -webkit-transform: scale(0.78);
          transform: scale(0.78);
  -webkit-transition: -webkit-transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4);
  transition: -webkit-transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4);
  transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4);
  transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4), -webkit-transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4);
}
.legend-group .radio input:checked + span,
.legend-group .checkbox input:checked + span {
   color: #1F2F46;
}
.legend-group .radio input:checked + span:before,
.legend-group .checkbox input:checked + span:before {
background: #5D9BFB;
  -webkit-transform: scale(1.04);
          transform: scale(1.04);
  
}
.legend-group .radio input:checked + span:after,
.legend-group .checkbox input:checked + span:after {
  -webkit-transform: scale(0.4);
          transform: scale(0.4);
  -webkit-transition: -webkit-transform .3s ease;
  transition: -webkit-transform .3s ease;
  transition: transform .3s ease;
  transition: transform .3s ease, -webkit-transform .3s ease;
}
.legend-group .radio:hover input + span:before,
.legend-group .checkbox:hover input + span:before {
  -webkit-transform: scale(0.92);
          transform: scale(0.92);
}
.legend-group .radio:hover input + span:after,
.legend-group .checkbox:hover input + span:after {
  -webkit-transform: scale(0.74);
          transform: scale(0.74);
}
.legend-group .radio:hover input:checked + span:after,
.legend-group .checkbox:hover input:chec ked + span:after {
  -webkit-transform: scale(0.4);
          transform: scale(0.4);
}
.legend-group.bar {
	display: inline-flex;
	align-items: center;
}
.legend-group.bar .label {
	position: relative;
	top: -2px;
	margin-right: 3px;
} 
.checkbox.color-00 input:checked + span:before {background-color: #D3DCE5;}
.checkbox.color-01 input:checked + span:before {background-color: #f54b70;}
.checkbox.color-02 input:checked + span:before {background-color: #53C1F5;}
.checkbox.color-03 input:checked + span:before {background-color: #FE7D40;}
.checkbox.color-04 input:checked + span:before {background-color: #CA952D;}
.checkbox.color-05 input:checked + span:before {background-color: #CD1499;}
.checkbox.color-06 input:checked + span:before {background-color: #8e44ad;}
.checkbox.color-07 input:checked + span:before {background-color: #FFBC00;}
.checkbox.color-08 input:checked + span:before {background-color: #A50021;}
.checkbox.color-09 input:checked + span:before {background-color: #f2784b;}
.checkbox.color-10 input:checked + span:before {background-color: #3598dc;}
.checkbox.color-11 input:checked + span:before {background-color: #44b6ae;}
.checkbox.color-12 input:checked + span:before {background-color: #c8d046;}
.checkbox.color-13 input:checked + span:before {background-color: #e08283;}
.checkbox.color-14 input:checked + span:before {background-color: #e87e04;}
.checkbox.color-15 input:checked + span:before {background-color: #1ba39c;}
.checkbox.color-16 input:checked + span:before {background-color: #aaaaaa;}
.checkbox.color-17 input:checked + span:before {background-color: #22313f;}

.color-00 {color: #D3DCE5 !important;}
.color-01 {color: #f54b70 !important;}
.color-02 {color: #53C1F5 !important;}
.color-03 {color: #FE7D40 !important;}
.color-04 {color: #CA952D !important;}
.color-05 {color: #CD1499 !important;}
.color-06 {color: #8e44ad !important;}
.color-07 {color: #FFBC00 !important;}
.color-08 {color: #A50021 !important;}
.color-09 {color: #f2784b !important;}
.color-10 {color: #3598dc !important;}
.color-11 {color: #44b6ae !important;}
.color-12 {color: #c8d046 !important;}
.color-13 {color: #e08283 !important;}
.color-14 {color: #e87e04 !important;}
.color-15 {color: #1ba39c !important;}
.color-16 {color: #aaaaaa !important;}
.color-17 {color: #22313f !important;}



/* portlet style */
.scroll-x {
    overflow-x: scroll !important;
}

.scroll-y {
    overflow-y: scroll !important;
}

.portlet.box.default {
    margin-bottom: 14px;
    border: 1px solid #e7ecf1;
    box-shadow: 1px 1px 5px rgba(0,0,0,.1);
}
.portlet.box.default > .portlet-title {
    position: relative;
    background-color: #F6F6FA;
    border-bottom: 1px solid #EAEBEF;
    border-left: 4px solid #118FCE;
    color: #1F2F46;
}
.portlet.box.default > .portlet-title > .caption {
    float: left;
    height:46px;
    line-height: 1.4;
    padding: 12px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -0.1rem;
    color: #1F2F46;
    margin-right: 10px; 
}
.portlet.box.default > .portlet-title > .caption >span {
    float:left;
    margin-right: 10px;
}
.portlet.box.default > .portlet-title > .caption .btn-group.floating {
    float: left;
    top: -6px;
}
.portlet.box.default > .portlet-body {
    background-color: #fff;
}
.portlet > .portlet-title > .actions {
    float: right;
    display: inline-block;
    padding: 13px;
}
.portlet > .portlet-title > .actions.btns {
    padding: 9px;
}
.portlet > .portlet-title > .actions.floating {
    float: right;
    padding: 6px;
}
.portlet.box > .portlet-body .list-unstyled {
    margin-left: 14px;
}
.portlet.box > .portlet-body .list-unstyled .list-title {
    position:relative;
    display: inline-block;
    width: auto;
    font-weight: 500;
    color: #8F97A3;
    margin: 0 10px 0 0;
}
.portlet.box > .portlet-body .list-unstyled .list-title:before {
    content:"";
    position:absolute;
    top:7px;
    left: -8px;
    display:block;
    width:4px;
    height:4px;
    border-radius:20px;
    background-color:#8F97A3;
}
.portlet.box > .portlet-body .list-unstyled.list-inline>li {
    margin-right: 5%;
}
.portlet.box > .portlet-body .list-unstyled.list-inline>li:last-child {
    margin-right: 0;
}
.portlet.box > .portlet-body .list-unstyled.list-bordered>li {
		border-bottom: 1px solid #EAEBEF;
    padding-bottom: 5px;
}

.portlet.box > .portlet-body .list-unstyled.list-bordered>li .btn {
		margin-top: -5px;
    margin-bottom: 5px;
}

.portlet.box > .portlet-title:before,
.portlet.box > .portlet-title:after,
.portlet.box > .portlet-title > .caption:before,
.portlet.box > .portlet-title > .caption:after {
    clear: both;
    content: " ";
    display: table;
}
.portlet.box.bordered {
    margin-bottom: 14px;
    border: 1px solid #e7ecf1;
    box-shadow: 1px 1px 5px rgba(0,0,0,.1);
}
.portlet.box.bordered .portlet-title {
    position: relative;
    background-color: #F6F6FA;
    border-bottom: 1px solid #EAEBEF;
    color: #1F2F46;
}
.portlet.box.bordered > .portlet-title > .caption {
    float: left;
    height:46px;
    line-height: 1.4;
    padding: 12px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -0.1rem;
    color: #1F2F46;
    margin-right: 10px; 
}
.portlet.box.bordered > .portlet-title > .caption >span {
    float:left;
    margin-right: 10px;
}
.portlet.box.bordered > .portlet-title > .caption .btn-group.floating {
    float: left;
    top: -6px;
}
.portlet.box.bordered > .portlet-body {
    background-color: #F6F6FA;
    padding: 14px;
}
.portlet.box.bordered > .portlet-body .box-wh {
    background-color: #fff;
    padding: 14px;
    height: 300px;
    overflow-y: auto;
    box-shadow: 1px 1px 5px rgba(0,0,0,.1);
    
}
.portlet:not(.light) .tabbable-line {
    padding-top: 0;
    position: absolute;
    top: 0;
    right: 0; 
}
.tabbable-line > .nav-tabs {
    border: none;
    margin: 0px;
}
.tabbable-line > .nav-tabs > li {
    margin: 0;
}
.tabbable-line > .nav-tabs > li.open,
.tabbable-line > .nav-tabs > li:hover {
    background: none;
    border-bottom: 4px solid #88c7e7;
}
.tabbable-line > .nav-tabs > li.active {
    background: none;
    border-bottom: 4px solid #118FCE;
    position: relative;
    
}
.tabbable-line > .nav-tabs > li > a {
    background: none;
    border-radius: 0;
    border: 0;
    margin: 0;
    padding: 12px 15px;
    color: #B8BEC8;
}
.tabbable-line > .nav-tabs > li.open > a,
.tabbable-line > .nav-tabs > li:hover > a {
    border: 0;
    background: none;
    color: #333;
}
.tabbable-line >.nav-tabs>li.active>a,
.tabbable-line >.nav-tabs>li.active>a:focus,
.tabbable-line >.nav-tabs>li.active>a:hover {
    background: rgba(0,0,0,.05);
    border: 0;
    color: #118FCE;
}
.row.panel-row {
    margin-left: -7px;
    margin-right: -7px;
}
.row.panel-row .col-20,
.row.panel-row .col-30,
.row.panel-row .col-50 {
    position: relative;
    float: left;
    padding-left: 7px;
    padding-right: 7px;
    
}
.row.panel-row .col-20 {width: 20%;}
.row.panel-row .col-30 {width: 30%;}
.row.panel-row .col-50 {width: 50%;}

.row.panel-row .portlet.box.default > .portlet-body {
    background-color: #fff;
    padding: 12px;
    height: 164px;
    overflow: hidden;
}
.row.panel-row .portlet.box.default > .portlet-body.height-md {
   height: 230px;
	 max-height: 230px; 
}
.portlet-body.height-md2 {
   max-height: 320px; 
}
.portlet-body.height-lg {
	 height: 600px;
   max-height: 600px; 
}
.portlet-body.height-sm {
	 height: 160px;
   max-height: 160px; 
}
.portlet-body.y-scroll {
   overflow-y: auto;
}
.row.panel-row .note {
    background-color: #F5F7FB;
    margin-bottom: 7px;
    padding: 3px 30px 3px 10px;
    letter-spacing:-.5px;
    box-shadow: 0 1px 2px rgba(0,0,0,.1);
    border-radius: 0; 
    border-left: 5px solid #eee;
}
.row.panel-row .note h4 {
    font-size:14px;
    font-weight:700;
    margin-bottom:5px;
    padding:0;
}
.row.panel-row .note small {
    margin-left: 5px;
    opacity:.75;
    font-size:13px;
}
.row.panel-row .note.note-danger{border-color: #F95428;}
.row.panel-row .note.note-warning {border-color: #E8A615;}
.row.panel-row .note.note-normal {border-color: #85CD14;}
.row.panel-row .note.note-danger h4{color: #F95428;}
.row.panel-row .note.note-warning h4 {color: #E8A615;}
.row.panel-row .note.note-normal h4 {color: #85CD14;}


.form-horizontal .ck-box .radio {
    padding-top: 1px;
}

.ck-box .radio-inline {
    padding-top: 0;
    padding-left: 0;
    font-weight: 800;
}

.panel.equipment .title {
    float: left;
    color: #ABB5C3;
}

.panel.equipment .value {
    float: right;
    font-weight: 600;
}
.panel.equipment sel ect.form-control {
    width: 100%;
}
.panel.equipment .panel-body .ico {
    color: #D3DCE5;
    font-size: 5rem;
}
.panel.equipment .panel-footer {
    padding: 10px;
}
.panel.equipment .form-group {
    position: relative;
    margin-bottom: 0;
}
.panel.equipment .form-group .input-xs {
    width: 80%;
    height: 30px;
    line-height: 1.5;
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 3px;
}
.panel.equipment .form-group .unit {
    position: absolute;
    right: 0;
    top: 6px;
}



/* floating button */
.dropdown, .dropup, .dropdown-menu {
    font-family: "Open sans", "Noto sans KR", sans-serif;
}
.canvas-wrapper {
    position: relative;
    z-index: 1;
}
@media (max-width: 1600px) {
    .canvas-wrapper {
        overflow-x: auto;
    }
    .canvas-wrapper .img-responsive {
        max-width: 1200px;
        width: 1200px;
    }
}
.floating-btn {
    position: absolute;
    left: 50%;
    top: 50%;
    font-size: 20px;
}

.floating-btn > .btn.badge:hover {
    transform: scale(1.125);
    transition: all 0.5s;
    opacity: 1;
}

.floating-btn .dropdown-menu {
    min-width: 240px;
    border-radius: 5px;
    left: -30%;
    z-index: 101;
}

.floating-btn .dropdown-menu .caption {
    padding: 8px 0 0 10px;
}

.floating-btn .dropdown-menu .content {
    padding: 2px 10px 10px;
}
.badge.badge-xs {
		padding: 2px 5px 3px;
    font-size: 11px;
		font-weight: 600;
}
.badge.badge-xl {
    display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 1.75;
    border-radius: 50px;
    font-size: 24px;
    font-weight: 600;
    color: #fff;
    opacity: .9;
    z-index: 99;
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
}

.floating-btn > .btn.badge {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 1.75;
    border-radius: 50px;
    font-size: 24px;
    font-weight: 600;
    color: #fff;
    opacity: .9;
    z-index: 99;
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
}

/* custom tooltip styles */
.tooltip {
    min-width: 40px;
}
.floating-btn .tooltip {
    position: relative;
    display: inline-block;
}

.floating-btn .tooltip .tooltip-text {
    visibility: hidden;
    width: auto;
    min-width: 100px;
    background-color: #e0ebf9;
    color: #327ad5;
    letter-spacing: -1px;
    text-align: left;
    font-size: 11px;
    font-weight: 600;
    border-radius: 5px;
    padding: 10px 12px 3px 30px;
    position: absolute;
    z-index: 100;
    bottom: 60px;
    left: -17px;
    opacity: 0;
    transition: 0.3s;
    pointer-events: none;
    line-height: 1.4;
    box-shadow: 5px 5px rgba(102, 102, 102, 0.1);
}

.floating-btn .tooltip .tooltip-text:before {
    content: "\f05a";
    display: block;
    font-size: 14px;
    font-family: "fontAwesome";
    position: absolute;
    left: 12px;
    top: 10px;
}

.floating-btn .tooltip .tooltip-text:after {
    content: "";
    display: block;
    height: 0;
    width: 0;
    z-index: 100;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #e0ebf9;
    position: relative;
    top: 12px;
    left: 0;
}

.floating-btn .tooltip:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

.floating-img {
    position: absolute;
    top: 0;
    right: 0;
}


/* modal style */
.modal-dialog.modal-xl {
    width: 1200px;
}
.modal-dialog.modal-sm {
    width: 400px;
}
.modal-header {
    background: #eef1f5;
}
.modal.bootstrap-dialog.type-primary .modal-header,
.modal-header.bg-primary {
    background: #1F2F46;
    color: #fff; 
}
.modal-header.bg-danger {
    background: #f36a5a;
}
.modal-header .close {
    margin-top: 0;
   font-size: 2.5rem;
    text-shadow: none;
    color: #fff; 
}
.modal-header .modal-title {
    color: #fff;
    font-weight: 400;
}
.contents-footer,
.modal-footer {
    padding: 15px;
    text-align: center;
    border-top: 1px solid #e5e5e5;
}
.contents-footer>.btn,
.modal-footer>.btn {
    min-width: 80px;
    padding: 9px 12px;
    border-radius: 50px;
}

.floating-arc {
    position: absolute;
    right: 8px;
    top: 0;
    text-align: right;
    font-size: 13px;
}
.dashboard-stat-group {
    display: block; 
}
.dashboard-stat-group .inline {
  margin-bottom: 5px;
}
.dashboard-stat-group .inline .details > div {
  display: inline-block;
}
.dashboard-stat-group .inline .details .number {
  font-weight: 600;
}
.dashboard-stat {
    position: relative;
    float: left;
    width: 49%;
    min-width: 120px;
    height: auto;
    padding: 10px;
    margin-bottom: 5px;
    border-radius: 0;
	  background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0,0,0,.1);
}
.dashboard-stat.condensed {	
	width: 48%;
	height: 160px;
}

.dashboard-stat:nth-child(odd) {
    margin-right: 2%;
}
.dashboard-stat:nth-child(3),
.dashboard-stat:nth-child(4){
    margin-bottom: 4px;
}
.dashboard-stat .visual {
    position: absolute;
    left: 12px;
    padding-top: 0;
		width: 40px;
    height: 40px
}
.dashboard-stat.condensed .visual {
	position: relative;
	left: 0;
	width: 60px;
	height: 60px;
}
.dashboard-stat .visual>img {
	width: 100%;
}
.dashboard-stat.condensed .details {
	left: 15px;
	top: 10px;
}
.dashboard-stat.condensed .details .number>span {
	  font-weight: 400;
    font-size: 3rem;
}
.dashboard-stat .visual > i {
    margin-left: 12px;
    font-size: 60px;
    line-height: 80px;
}
.dashboard-stat .details {
    position: relative;
    left: 45px;
    padding-right: 0;
}
.dashboard-stat .details .number {
    font-weight: 300;
    text-align: left;
    font-size: 18px;
}

.dashboard-stat .details .number>span{
    font-weight: 700;
}
.dashboard-stat .details .desc {
    text-align: left;
    font-weight: 400;
    font-size: 14px;
    color: #8F97A3;
}
.dashboard-stat-controller {
    display: inline-block;
    width: 100%;
    min-width: 268px;
    height: auto;
    padding: 10px;
    text-align: center;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0,0,0,.1);  
}
.dashboard-stat-controller .controller-block {
    padding: 0;
}
.dashboard-stat.big-height .details {
  left: 0;
  margin-bottom: 5px;
}
.dashboard-stat.big-height .fire-monitoring>li {
  background-color: #F5F7FB;
  padding: 15px 0 15px 6px;
  text-align: left;
  margin-bottom: 5px;
}
.dashboard-stat.big-height .fire-monitoring i {
	padding-left: 10px;
}
@media (max-width: 1480px) {
.dashboard-stat.condensed {
	  float: none;
	  width: 100%;
	  height: auto;
	}
	.dashboard-stat.condensed .visual {
		position: absolute;
		left: 6px;
		width: 50px;
		height: 50px;
	}
	.dashboard-stat.condensed .details {
		left: 30%;
    top: 0;
	}
	.dashboard-stat.big-height .fire-monitoring i {
		padding-left: 0;
	}
}

.controller-block .stress-info {
  text-align: left;
}
.controller-block .img-thumbnail {
  position: relative;
  display: block;
  width: 100%;
  height: 92px;
  overflow: hidden;
  padding: 0;
  border: 0;
  border-radius: 0;
  margin: 0;
}
.controller-block .img-thumbnail:hover>img {
	  transform: scale(1.15);
	  transition: all 0.5s;
}
.controller-block .img-thumbnail:hover:before {
	  display: block;
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
    content: "\f002";
    font-family: "fontAwesome";
    color: #fff;
    font-size: 24px;
	    z-index: 2;
	  opacity: 1;  
}
.controller-block .img-thumbnail:hover:after{
	  display: block;
	  content: "";
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  background-color: rgba(0,0,0,.35);
	    z-index: 1;
}

.controller-block .img-thumbnail>img {
	  width: 100%;
	height: 100%;
	object-fit: cover;
}
.controller-block .activity-info {
  background-color: #1F2F46;
  color: #fff;
  font-size: 12px;
}
.controller-block .activity-info .amount {
  text-align: center;
  background-color: #118FCE;
  font-weight: 600;
} 
.gauge-image>img{
    width: auto;
}
.stress-info .text-good {color: #118FCE;}
.stress-info .text-bad {color: #e73d4a;}

.direction>img {
  width: 16px;
  height: 16px;
}
.weather-box {
    position: relative;
}

.weather-box .compass {
	  position: absolute;
    top: 0;
	  left: 0;
    padding: 5px; 
}
.weather-box.align-right .compass {
	  left: auto;
	  right: 0;
}
.weather-box img {
    display: block;
    margin: 0 auto;
}
.weather-box .drawing {
    max-width: 100%;  
    width: auto;
    height: 100px;
}
.weather-box.align-right .drawing {
    max-width: 100%;
    width: 100%;
    height: 144px;
}
.weather-box.align-right .marker {
    position: absolute;
}
.eq-house .drawing {
    width: 100%;
    max-width: 100%;
    height: auto;
}
.eq-house .compass,
.eq-house .marker {
    position: absolute;
    cursor: pointer;
}



/* slider custom style */
.irs--flat .irs-bar {
    background-color: #85cd14 !important;
}
.irs--flat .irs-handle>i:first-child {
    background-color: #7bbe12 !important;
}
.irs--flat .irs-from, .irs--flat .irs-to, .irs--flat .irs-single {
    background-color: #85cd14 !important;
}
.irs--flat .irs-from:before, .irs--flat .irs-to:before, .irs--flat .irs-single:before {
    border-top-color: #85cd14 !important;
}

@media (max-width: 1280px) {

    .group-item-wrapper .portlet > .portlet-title > .caption {
        padding-bottom: 0;
    }

    /* .group-item-wrapper .portlet > .portlet-title > .actions {
        float: left;
        width: 100%;
        padding-top: 0 !important;
    }  */
}
.group-equipment-list {
    padding: 8px;
}
.group-equipment-list.list-view,
.group-equipment-list.grid-view {
  max-height:950px;
  overflow-y:auto;
	z-index: 3;
}
.group-equipment-list .group-category,
.group-equipment-list .group-item {
    position: relative;
    margin-bottom: 5px;
    cursor: pointer;
}
.group-equipment-list .group-item {
    padding-left: 0;
}
.group-equipment-list .group-category>input {
    padding: 6px 28px;
    font-weight: 600;
    color: #1F2F46;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.group-equipment-list .group-item>input {
    padding: 6px 28px;
}
.group-equipment-list .group-category>input:focus,
.group-equipment-list .group-item>input:focus {
    color: #1F2F46;
    border-color: #52c5ff;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 5px rgba(136,199,230,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 5px rgba(136,199,230,.6);
}
.group-equipment-list .group-category>i,
.group-equipment-list .group-category>button,
.group-equipment-list .group-item>i,
.group-equipment-list .group-item>button {
    position:absolute;
}
.group-equipment-list .group-category>i {
    top: 11px;
    left: 8px;
}
.group-equipment-list .group-item>i {
    top: 11px;
    left: 8px;
}
.group-equipment-list .group-category>button,
.group-equipment-list .group-item>button {
    top: 5px;
    right: 0;
}
.group-equipment-list .group-category.disabled>input,
.group-equipment-list .group-item.disabled>input {
    cursor:default;
    border: none;
    border-radius:0;
    box-shadow:none;
    background-color:transparent;
    color: #858d9b;
}
.group-equipment-list .group-category.disabled>i,
.group-equipment-list .group-item.disabled>i{
    color: #ABB5C3;
}

.group-equipment-list .group-item.disabled>button {
    visibility: hidden;  
	  z-index:10;
}

.group-equipment-list .group-item.disabled:hover>button {
    visibility: visible;
    cursor: pointer;
}
.group-equipment-list.list-view .group-category>button,
.group-equipment-list.grid-view .group-category>button {
    visibility: hidden;
    z-index:100;
}
.group-equipment-list.list-view .group-category>button:last-child {
    right: 25px;
}
.group-equipment-list.list-view .group-category {
    margin-bottom: 0;
}
.group-equipment-list.list-view .group-category:hover,
.group-equipment-list.grid-view .group-category:hover {
    background-color: rgba(0,0,0,.05);
}
.group-equipment-list.list-view .group-category:hover>button:first-child,
.group-equipment-list.grid-view .group-category:hover>button:first-child {
    color: #118FCE !important;
}
.group-equipment-list.list-view .group-category:hover>button,
.group-equipment-list.grid-view .group-category:hover>button {
    visibility: visible;
}
.group-equipment-list.list-view .group-category>button .tooltip{
	position: fixed;
}
.btn-link.btn-view {
    padding:4px 7.5px;
    border-radius:4px;
    margin-right: 3px;
}
.btn-link.btn-view:hover,
.btn-link.btn-view:focus,
.btn-link.btn-view.active {
    background-color: rgba(0,0,0,.05);
    color:#118FCE;
}
.group-equipment-list.grid-view .group-category {
    position:relative;
    display: inline-block;
    float: left;
    width: 48.5%;
    height: 120px;
    border: 1px solid #B8BEC8;
    margin-right: 3%;
    margin-bottom: 5px;
    cursor: pointer;
    text-align:center;
    transition: all 0.3s;
}
.group-equipment-list.grid-view .group-category:hover {
    border-color: #118FCE;
}
.group-equipment-list.grid-view .group-category:hover:after {
    content:"";
    display:block;
    position:absolute;
    top: 0;
    bottom:34px;
    width: 100%;
    height: 82px;
    background: -moz-linear-gradient(top,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.01) 99%, rgba(0,0,0,0) 100%);
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.01) 99%,rgba(0,0,0,0) 100%);
    background: linear-gradient(to bottom,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.01) 99%,rgba(0,0,0,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 );
    z-index:1;
}
.group-equipment-list.grid-view .group-category:nth-child(even) {
    margin-right: 0; 
}
.group-equipment-list.grid-view .group-category .form-control {
    position:absolute;
    bottom: 0;
    background-color: #B8BEC8;
    color: #fff;
    text-align: center;
    padding: 0 5px;
}
.group-equipment-list.grid-view .group-category:hover .form-control {
    background-color: #118FCE;
} 
.group-equipment-list.grid-view .group-category>i {
    font-size: 4rem;
    position:absolute;
    top: 20%;
    left: 50%;
    transform: translateX(-50%);
}
.group-equipment-list.grid-view .group-category>button {
    top: 25%;
    left: 60%;
    transform: translateX(-50%);
    font-size: 2rem;
    color: #fff !important;

}
.group-equipment-list.grid-view .group-category>button:last-child {
    left: 35%;
}
.group-equipment-list.grid-view .group-category>button>i{
    text-shadow: 0 0 3px rgba(0,0,0,.5);
}






/* calendar custom styles */
.fc-daygrid-event-dot {
    position: relative;
}
.fc-license-message {
    display: none !important;
}
.fc-col-header .fc-scrollgrid-sync-inner {
    padding: 7px;
    background-color: #B8BEC8;
}
.fc-scroller-harness .fc-datagrid-header tr,
.fc-timeline-header tr.fc-timeline-header-row {
    background-color: #B8BEC8;
}
.fc-scroller-harness th.fc-datagrid-cell,
.fc-timeline-slot-frame a.fc-timeline-slot-cushion,
.fc-col-header .fc-scrollgrid-sync-inner a.fc-col-header-cell-cushion {
    color: #fff;
    font-weight: 600;
}
.fc .fc-timeline-event-harness {
    top: 6px !important;
}
.fc .fc-daygrid-event {
    border-radius: 0;
    font-size: 13px;
}
.fc .fc-highlight {
    border: 1px solid #53C6F9;
}
.fc-button-group .fc-button {
    padding: 3px 6px 6px !important;
}
.fc-col-header .fc-day-sun .fc-scrollgrid-sync-inner a.fc-col-header-cell-cushion {color:#d32d34;}
.fc-col-header .fc-day-sat .fc-scrollgrid-sync-inner a.fc-col-header-cell-cushion {color:#1A82B6;}

.total-control {
    display: flex;
    margin-top: 5px;
}
.total-control .form-group {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 0 0 auto;
    width: 50%;
}
.total-control .form-group .toggle-switch {
    margin-bottom: 0;
}
.form-condition .formset {
    position: relative;
}
.form-condition .formset .unit {
    position: absolute;
    right:25px;
    top: 7px;
}

.aligner {
  display: flex;
  align-items: center;
  justify-content: center;
    text-align: center;
}
.box-gauge .comment {
    margin-top: 30px;
    font-size: 16px;
}

.multi-item-carousel.col-25 .carousel-col {
	    width: 25%;
}

.tab-in-tab-contents .nav-tabs {
    display: block;
    margin-bottom: 14px;
    margin-right: -7px;
    margin-left: -7px;
    border-bottom: 0;
    overflow: hidden;
}
.tab-in-tab-contents .nav-tabs>li {
    display: inline-block;
    float: left;
    width: 25%;
    min-width: 244px;
    padding-right: 7px;
    padding-left: 7px;
    margin-bottom: 10px;
}
.tab-in-tab-contents .nav-tabs>li:last-child {
    margin-right: 0;
}
.tab-in-tab-contents .nav-tabs>li>a {
    display: inline-block;
    min-width: 100px;
    background-color: #EAEBEF;
    border-radius: 0;
    text-align: center;
    font-weight: 500;
    color: #8F97A3;
    transition: all 0.3s;
}
.tab-in-tab-contents .nav-tabs>li:hover>a,
.tab-in-tab-contents .nav-tabs>li:focus>a,
.tab-in-tab-contents .nav-tabs>li.active>a {
    color: #fff;
    background-color: #337ab7;
    border: 1px solid #337ab7;
    border-bottom-color: #337ab7;
    cursor: pointer;
}
.tab-in-tab-contents .nav-tabs>li:hover .tab-in-tab-body,
.tab-in-tab-contents .nav-tabs>li:focus .tab-in-tab-body,
.tab-in-tab-contents .nav-tabs>li.active .tab-in-tab-body {
    border-color: #337ab7;
    transition: all 0.3s;
}
.tab-in-tab-contents .nav-tabs>li:hover .tab-in-tab-footer,
.tab-in-tab-contents .nav-tabs>li:focus .tab-in-tab-footer,
.tab-in-tab-contents .nav-tabs>li.active .tab-in-tab-footer {
    border-color: #337ab7;
    background-color: #337ab7;
    transition: all 0.3s;
}
.tab-in-tab-contents .nav-tabs>li:hover .tab-in-tab-footer a,
.tab-in-tab-contents .nav-tabs>li:focus .tab-in-tab-footer a,
.tab-in-tab-contents .nav-tabs>li.active .tab-in-tab-footer a {
    color: #fff;
    cursor: pointer;
}
.tab-in-tab-contents .nav-tabs .tab-in-tab-body {
    border: 2px solid #EAEBEF;
    border-bottom-width: 1px;
    padding: 9px;
}
.tab-in-tab-contents .nav-tabs .tab-in-tab-footer {
    border: 2px solid #EAEBEF;
    border-top: none;
    padding: 10px;
    text-align: center;
}

.hr-line {
    margin: 20px 0;
    border-color: #eee;
}

.border-line {
  border-bottom: 1px solid #eee;
  margin: 15px -7px;
}

.progress-list .border-line:last-child {
  border: none;
  margin: 0 -7px;
}
.progress-list .progress {
    height: 20px;
    border-radius: 0;
    margin-bottom: 10px;
}
.progress-list .progress .progress-bar {
    line-height: 20px;
}

.progress-list .progress .progress-bar-normal {
    background-color: #85CD14;
}
.progress-list .progress .progress-bar-attention {
    background-color: #ffc000;
}
.progress-list .progress .progress-bar-warning {
    background-color: #ff5c00;
}
.progress-list .progress .progress-bar-danger {
    background-color: #a50021;
}
.progress-list .title {
    color: #8F97A3;
    margin-bottom: 5px;
}
.progress-list .badge {
    background-color: #B8BEC8;
} 



/* timeline styles */
.table-timeline {
	position:relative;
	margin:auto;
	overflow:hidden;
	border:1px solid #D3DCE5;
}
.table-wrap {
	width:100%;
	overflow-x:auto;
}
.table-timeline table {
	width:100%;
	margin:auto;
	border-collapse:collapse;
	border-spacing:0;
    border-color: #D3DCE5;
    font-size: 13px;
}
.table-timeline th, .table-timeline td {
    min-width: 48px;
	padding:8px 10px;
	border:1px solid #D3DCE5;
	background:#fff;
	white-space:nowrap;
	vertical-align:top;
}
.table-timeline thead>tr>th{
    width: 54px;
    background-color: #B8BEC8;
    color: #fff;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
}
.table-timeline tbody>tr>th {
    background-color: #fff !important;
    color: #34495e;
    font-weight: 400;
    text-align: center;
    font-size: 14px;
}
.table-timeline tbody>tr>th .ellipsis {
    width: 100px;
    display: block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.clone {
	position:absolute;
	top:0;
	left:0;
	pointer-events:none;
}
.clone th, .clone td {
    border-color:transparent;
	visibility:hidden;
}

.clone tbody th {
	visibility:visible;
	color: #fff;
}
.clone .fixed-side {
	border:1px solid #D3DCE5;
	background:#B8BEC8;
	visibility:visible;
}

.week-event-wrapper {
    position: relative;
    left: -11px;
    top: -10px;
}
.week-event {
    position: absolute;
    top: 17px;
    left: 0;
    display: grid;
    grid-template-columns: repeat(52, 48px);
}

.week-event-title {
    display: inline-grid;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    padding: 4px 10px; 
    font-size: 12px;
    height: 10px;
    color: #fff;
    background-color: #85CD14;
    cursor: pointer;
}


/*  for algorithm page */
.label.label-title {
	  padding: 6px 10px;
	  position: relative;
    top: -2px;
    font-size: 14px;
}
.label.label-apply {
		border: 1px solid #4d93ed;
		background-color: #bedbff;
		color: #4d93ed;
		font-size: 12px;
}
.group-checkbox {
	 padding-left: 30px !important;
   background-color: #fff !important;
	 min-height: 200px;
	 height: 200px;
}

.group-contorl-algorithm > li .controls {
	 position: absolute;
	 top: 0;
	 right: 5px;
}
.group-contorl-algorithm > li {
	position: relative;
	margin-bottom: 10px;
}
.group-contorl-algorithm > li:hover::before {
	cursor: pointer;
	background-color: #F6F6FA;
	padding: 5px;
	position: absolute;
	left: 0;
	top: -6px;
	width: 100%;
	height:34px;
}
.table-fixed {
  width: 100%;
}
.table-fixed tbody {
  display: block;
  max-height: 200px;
  overflow-y: scroll;
}

.table-fixed thead, .table-fixed tbody tr {
  display: table;
  width: 100%;
  table-layout: fixed;
  margin-top:-1px;
}

.table-fixed thead {
  position:relative;
  width: calc( 100% - 17px );
}
.table-fixed thead:after {
  content:"";
  display: block;
  width: 18px;
  height: 38px;
  position:absolute;
  top: 0;
  right:-18px;
  background-color: #B8BEC8;
  border-bottom: 2px solid #D3DCE5;
}

.panel-group.algorithm .panel-heading {
	background-color: #F5F7FB;
}
.panel-group.algorithm .panel-heading .panel-title>.pull-left {
	margin-top: 7px;
}
.panel-group.algorithm .panel-heading .panel-title a>i{
	position: relative;
	top: 2px;
	margin-left: 10px;
}
.panel-group.algorithm .panel-heading .panel-title a[aria-expanded="false"]>i {
	transform: rotate(-180deg);
}

/* Blinking point with SVG */
.flashing{
    width: 42px;
    height: 42px;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    z-index: 1;
    border: none;
    border-radius: 50%;
    background: none;
    animation: flashing 3s linear infinite;
    cursor: pointer;
}

@keyframes flashing{
    0%{-webkit-transform:scale(1,1);opacity:.5}
    50%{opacity:1}
    100%{-webkit-transform:scale(1.2,1.2);opacity:.5}
}
.flashing .ico {
    position: absolute;
    left: 13px;
    top: 5px;
    color: white;
    font-size: 3rem;
    z-index: 3;
}
.flashing .ico.icon-nh3 {
    left: 6px;
    font-size: 2.25rem;
    top: 9px;
}
.flashing .ico.icon-fan {
    left: 6px;
    top: 6px;
}
.flashing.green, .legend-overlay .badge.green {
    background-color: #42FFA4;
}
.flashing.blue, .legend-overlay .badge.blue {
    background-color: #00aaff;
}
.flashing.pink, .legend-overlay .badge.pink {
    background-color: #FF007A;
}

.img-aligner {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.img-aligner>img{
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: cover;
}

.legend-overlay {
    position: absolute;
    left: 20px;
    top: 15px;
    display: inline-block;
    text-align: left;
    font-weight: 500;
    z-index: 1;
}
.legend-overlay .badge.circle {
    width:30px;
    height: 30px;
    padding: 7px;
    border-radius: 50px;
}
.legend-overlay .badge.circle > i {   
    position: relative;
    top: -2px;
    font-size: 2rem;
}
.point-overlay {
    position: absolute;
    display: inline-block;
}
.point-overlay .badge {
    position: relative;
    top: 30px;
    padding: 5px 9px;
    background-color: rgba(31,39,75,.5);
    border-radius: 5px;
    box-shadow: 1px 3px 5px rgba(0,0,0,.3);
}

.point-overlay .popover {
    min-width: 220px;
    background-color: #1F274B;
    color: #fff;
}
.point-overlay .popover .popover-content {
    font-size: 1.35rem;
}
.point-overlay .popover.top>.arrow:after {
    border-top-color: #1F274B;
}

.tab-in-tab .nav-tabs {
    border-bottom: none;
}

.tab-in-tab .nav-tabs li a {
    position: relative;
    display: inline-block;
    width: auto;
    padding: 12px 40px 14px 16px;
    margin: 0 5px 5px 0;
    font-size: 15px;
    color: #118FCE;
    background-color: #fff;
    border: 1px solid #118FCE;
    border-radius: 4px;
    z-index: 1;
}

.tab-in-tab .nav-tabs li a:after {
    content: '';
    display: block;
    width: 7px;
    height: 14px;
    border: solid #ABB5C3;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    position: absolute;
    right: 18px;
    top: 14px;
}

.tab-in-tab .nav-tabs li a:hover,
.tab-in-tab .nav-tabs li a:focus {
    background-color: #E3E6EC;
}

.tab-in-tab .nav-tabs li.active a {
    border-color: #118FCE;
    background-color: #118FCE;
    color: #fff;
}

.tab-in-tab .nav-tabs li.active a:after {
    border-color: #fff;
}
.tab-in-tab .nav-tabs li a {
    text-decoration: none;
    color: #ABB5C3;
}
.info-recirculation img {
    max-width: 100%;
    widows: 100%;
    height: 425px;
    overflow: hidden;
}
.info-paragraph-lg {
    font-size: 17px;
    line-height: 1.45;
    margin-top: 10px;
}