/**
 * WEBUI 5.0
 * author : penta-wx
 * description : webui 5.0 base CSS;
 */
html, body {
    margin     : 0;
    padding    : 0;
    background : #d9e0e7;
}

/**
 * Font 적용
 */
html, body, div, span, label, p, table, tr, th, td, i, input, code, textarea, select {
    font-family : 'Noto Sans KR', 'Meiryo', sans-serif;
    font-weight : 400;
}

.ui-tooltip-content {
    display : none;
}

.ui-tooltip {
    display : none;
}

.dx-overlay-wrapper input,
.dx-overlay-wrapper textarea {
    font-family : 'Noto Sans KR', 'Meiryo', sans-serif;
    font-weight : 400;
}

input[type="checkbox"] {
    /*position : absolute;*/
    /*opacity  : 0;*/
}

.wrapper .logo-mini img {
    width  : 29px;
    height : 19px;
}

.wrapper .logo-lg img {
    width  : 120px;
    height : 15px;
}

.license-expired-title {
    float   : left;
    margin  : 15px 0 0 5px;
    color   : #dc3545;
    display : none;
}

.disabled {
    z-index          : 100;
    background-color : lightgrey;
    opacity          : 0.6;
    pointer-events   : none;
}

.loading {
    border           : 1px solid #CCCCCC;
    padding          : 12px;
    border-radius    : 5px;
    background-color : #FFFFFF;
    position         : absolute;
    top              : 40%;
    left             : 50%;
    z-index          : 10000;
}

.bg-mask {
    position         : absolute;
    width            : 100%;
    height           : 100%;
    left             : 0;
    top              : 0;
    z-index          : 9999;
    background-color : #000000;
    opacity          : 0.4;
    display          : none;
}

.box-body {
    padding : 15px;
}

.resize-none {
    resize : none;
}

label {
    font-weight : inherit;
}

.wp-vertical-align {
    vertical-align : middle;
}

textarea {
    border-color : #d2d6de;
    resize       : none;
}

@media (min-width : 768px) {
    .form-horizontal .wx-control-label {
        padding-top : 0px;
    }
}

.main-header {
    z-index : 1030;
}

@media (max-width : 991px) {
    .content-header > .breadcrumb {
        margin-top : 0;
        background : #d9e0e7;
    }
}

.content-wrapper {
    background : #d9e0e7;
}

.panel-inverse > .panel-heading {
    background : #242a30;
}

.panel {
    border                : none;
    -webkit-box-shadow    : none;
    box-shadow            : none;
    -webkit-border-radius : 3px;
    -moz-border-radius    : 3px;
    border-radius         : 3px;
}

.panel-title {
    margin-top    : 0;
    margin-bottom : 0;
    font-size     : 16px;
    color         : inherit;
}

.panel-heading {
    padding : 10px 15px;
    border  : none;
}

.panel-heading {
    padding                 : 10px 15px;
    border-bottom           : 1px solid transparent;
    border-top-left-radius  : 3px;
    border-top-right-radius : 3px;
}

.panel-danger > .panel-heading, .panel-info > .panel-heading, .panel-inverse > .panel-heading, .panel-primary > .panel-heading, .panel-success > .panel-heading, .panel-warning > .panel-heading {
    color : #ffffff;
}

.wp-btn-box-tool {
    color : #ffffff;
}

.panel .btn.focus, .panel .btn:focus, .panel .btn:hover {
    color : #ffffff;
}

.open .btn-box-tool,
.btn-box-tool:hover {
    color : #606c84;
}

.nav-pills {
    margin-bottom : 10px;
}

.nav-pills > li {
    float : left;
}

.nav > li {
    position : relative;
    display  : block;
}

.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover {
    color            : #ffffff;
    background-color : #337ab7;
}

.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover {
    background : #242a30;
}

.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    border-top-color : #242a30;
}

.nav-pills > li > a {
    border-radius : 3px;
}

.treeview-menu-box li a i.fa {
    margin-right : -5px;
    right        : 20px;
}

.sidebar-menu .treeview-menu .treeview-menu {
    margin-left : -12px;
}

.tab-content {
    /*padding: 15px;*/
    /*margin-bottom: 20px;*/
    /*background: #fff;*/
    /*-webkit-border-radius: 3px;*/
    /*-moz-border-radius: 3px;*/
    /*border-radius: 3px;*/
}

.box.box-dark {
    border-top-color : #242a30;
}

.cursor-help {
    cursor : help;
}

.dx-datagrid .dx-link.dev-icon-color {
    color : #333333;
}

/**
 * skin-custom (Black)
 */
#control-sidebar-theme-demo-options-tab li.black div.skin-header span {
    display    : block;
    float      : left;
    height     : 7px;
    background : #fefefe;
}

#control-sidebar-theme-demo-options-tab li.black div.skin-header span.front {
    width : 20%;
}

#control-sidebar-theme-demo-options-tab li.black div.skin-header span.end {
    width : 80%;
}

#control-sidebar-theme-demo-options-tab li.black div.skin-content span.front {
    display    : block;
    width      : 20%;
    float      : left;
    height     : 20px;
    background : #222222;
}

/**
 * skin-custom (Blue)
 */
.skin-wp-blue .main-sidebar {
    -webkit-box-shadow : 1px 0 20px rgba(0, 0, 0, 0.08);
    box-shadow         : 1px 0 10px rgba(0, 0, 0, 0.6)
}

.skin-wp-blue .main-header {
    background-color : #1e88e5;
}

.skin-wp-blue .wrapper, .skin-wp-blue .main-sidebar, .skin-wp-blue .left-side {
    background-color : #ffffff;
}

.skin-wp-blue .treeview-menu > li.active > a, .skin-wp-blue .treeview-menu > li > a:hover {
    color : #263238;
}

.skin-wp-blue .sidebar-menu > li:hover > a, .skin-wp-blue .sidebar-menu > li.active > a {
    color              : #ffffff;
    background         : #26c6da !important;
    font-weight        : 700;
    -webkit-box-shadow : 0 0 10px rgba(0, 0, 0, 0.2);
    box-shadow         : 0 0 10px rgba(0, 0, 0, 0.2);
    border-left-color  : #26c6da;
}

.skin-wp-blue .sidebar a {
    color : #607d8b;
}

.skin-wp-blue .treeview-menu > li > a {
    color : #607d8b;
}

.skin-wp-blue .sidebar-menu > li > .treeview-menu {
    background : #ffffff;
}

.skin-wp-blue .main-header > .navbar {
    background-color : #1e88e5;
    box-shadow       : 5px 0 10px rgba(0, 0, 0, 0.5)
}

.skin-wp-blue .main-header > .navbar > .sidebar-toggle {
    color : #ffffff;
}

.skin-wp-blue .main-header > .navbar .nav > li > a {
    background-color : #1e88e5;
    color            : #ffffff;
    font-weight      : 600;
}

.skin-wp-blue .main-header > .navbar .nav > li > a:hover {
    background-color : #1e88e5;
    color            : #f4f4f4;
    font-weight      : 600;
}

.skin-wp-blue .main-header > .navbar .navbar-custom-menu .navbar-nav > li > a, .skin-wp-blue .main-header > .navbar .navbar-right > li > a {
    border-left : 0px;
}

.skin-wp-blue .main-header > .navbar > .sidebar-toggle {
    border-right : 0px;
}

.skin-wp-blue .main-header li.user-header {
    background-color : #1e88e5;
}

.skin-wp-blue .main-header > .logo {
    background   : rgba(0, 0, 0, 0.05);
    color        : #ffffff;
    border-right : 1px solid #eeeeee;
}

.skin-wp-blue .main-header > .logo:hover {
    background : rgba(0, 0, 0, 0.05);
    color      : #f4f4f4;
}

.nav-tabs.nav-tabs-inverse {
    background : #212121;
}

.nav-tabs.nav-tabs-inverse a {
    color : white;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height : 300px;
}

small.wp-help {
    font-size : 93%;
    color     : rgb(119, 119, 119);
}

/**
 * Dev CSS 커스텀
 */
.box {
    margin-bottom : 15px;
    border-top    : 3px solid #242a30;
}

.box.box-gray {
    border-top-color : #d2d6de;
}

.dx-popup-wrapper > .dx-overlay-content {
    border     : 0;
    background : rgb(243, 243, 244);
}

.dx-popup-wrapper .dx-state-focused.dx-overlay-content {
    border : 0;
}

.dx-toolbar-label > div {
    color : white;
}

.dx-popup-title .dx-closebutton .dx-icon,
.dx-popup-title .dx-closebutton .dx-button-content {
    color : white;
}

.dx-popup-content {
    background : rgb(243, 243, 244);
}

.dx-tooltip-wrapper .dx-popup-content {
    background : #ffffff;
    border     : 1px solid #dddddd;
}

.dx-popup-content.wp-tooltip {
    background    : #ffffff;
    border        : 1px solid #dddddd;
    border-radius : 6px;
    padding       : 15px;
}

.dx-header-filter-menu .dx-popup-content {
    /*background : #ffffff;*/
}

.dx-popup-content .box-footer {
    background : rgb(243, 243, 244);
    border-top : 1px solid #d2d6de;
}

.dx-popup-title .dx-closebutton.dx-state-hover {
    background-color : #242a30;
    border-color     : #d2d6de;
}

.btn-default.active, .btn-default:active,
.open > .dropdown-toggle.btn-default {
    background-color : #D9D9D9;
}

/**
 * Grid Tables 등록 버튼 색상
 */
.dx-datagrid-form-buttons-container .dx-button:first-of-type {
    color            : #ffffff;
    background-color : #3c8dbc;
    border-color     : #367fa9;
}

.dx-datagrid-form-buttons-container .dx-button.dx-state-hover:first-of-type {
    background-color : #286090;
    border-color     : #204d74;
}

.dx-datagrid-form-buttons-container .dx-button:active:focus:first-of-type {
    background-color : #204d74;
    border-color     : #122b40;
}

/**
 * Grid Tables Select
 */
.dx-datagrid-rowsview .dx-selection.dx-row > td,
.dx-datagrid-rowsview .dx-selection.dx-row:hover > td,
.dx-treelist-rowsview .dx-selection.dx-row > td,
.dx-treelist-rowsview .dx-selection.dx-row:hover > td {
    background-color : lightgray;
}

/**
 * Grid add, delete, 내보내기, export, import
 */
#gridAdd {
    position : absolute;
    z-index  : 1;
}

#gridDelete {
    position : absolute;
    z-index  : 1;
    left     : 55px;
}

#gridExport {
    position : absolute;
    z-index  : 1;
    left     : 105px;
}

#gridImport {
    position : absolute;
    z-index  : 1;
    left     : 145px;
}

#netfilterOverview #selectSection {
    position : absolute;
    z-index  : 1;
    left     : 105px;
    height   : 36px;
}

#netfilterOverview #gridRefresh {
    position : absolute;
    z-index  : 1;
    left     : 305px;
}

#popupGridAdd {
    position : absolute;
    z-index  : 1;
}

#popupGridDelete {
    position : absolute;
    z-index  : 1;
    left     : 55px;
}

#protectionWebsiteButton {
    position : absolute;
    z-index  : 1;
    left     : 55px;
}

/**
 * dxDataGrid checkbox
 */
.dx-checkbox.dx-state-readonly .dx-checkbox-icon {
    border : 1px solid #dddddd;
}

/**
 * skin 설정
 */
.list-unstyled li {
    float   : left;
    width   : 33.33333%;
    padding : 5px;
}

.list-unstyled li a {
    display    : block;
    box-shadow : 0 0 3px rgba(0, 0, 0, 0.4)
}

.list-unstyled li a:first-child div:first-child span {
    sdisplay   : block;
    width      : 20%;
    float      : left;
    height     : 7px;
    background : #367fa9;
}

.list-unstyled li a:first-child div:first-child span:last-child {
    display : block;
    width   : 80%;
    float   : left;
    height  : 7px;
}

.list-unstyled li a:first-child div:last-child span:first-child {
    display    : block;
    width      : 20%;
    float      : left;
    height     : 20px;
    background : #222d32;
}

.list-unstyled li a:first-child div:last-child span:last-child {
    display    : block;
    width      : 80%;
    float      : left;
    height     : 20px;
    background : #f4f5f7;
}

.skin-black .main-header li.user-header {
    background-color : white;
}

/**
 * breadcrumb 설명 제거
 */
.breadcrumb .active .configure-page-desc {
    margin-left : 5px;
}

@media (max-width : 767px) {
    .breadcrumb .active .configure-page-desc {
        display : none;
    }
}

/**
 * Logo 제거
 */
.skin-black .main-header > .logo {
    background    : #2d353c;
    color         : #ffffff;
    border-right  : 0;
    border-bottom : 1px solid #ffffff;
}

.skin-black .main-header > .logo:hover {
    background : #2d353c;
    color      : #ffffff;
}

@media (min-width : 768px) {
    .skin-black .sidebar-mini.sidebar-collapse .main-header .logo {
        border-bottom : 1px solid #2d353c;
    }
}

@media (max-width : 767px) {
    .main-header .logo {
        display : none;
    }
}

/**
 * validator icon
 */
.wp-glyphicon {
    right                  : 0px;
    /*position: relative;*/
    top                    : 1px;
    display                : inline-block;
    font-family            : 'Glyphicons Halflings';
    font-style             : normal;
    font-weight            : 400;
    line-height            : 5.4;
    -webkit-font-smoothing : antialiased;
}

/**
 * wp-disabled
 */
.wp-disabled {
    z-index        : 100;
    opacity        : 0.5;
    pointer-events : none;
}

.wp-display-none {
    display : none;
}

/**
 * dropdown-menu
 */
.wysihtml5-command-active {
    background-image   : none;
    -webkit-box-shadow : inset 0 2px 4px rgba(0, 0, 0, .15), 0 1px 2px rgba(0, 0, 0, .05);
    -moz-box-shadow    : inset 0 2px 4px rgba(0, 0, 0, .15), 0 1px 2px rgba(0, 0, 0, .05);
    box-shadow         : inset 0 2px 4px rgba(0, 0, 0, .15), 0 1px 2px rgba(0, 0, 0, .05);
    background-color   : #D9D9D9;
    outline            : 0;
}

/**
 * iCheck button margin
 */
.iradio_minimal-blue,
.icheckbox_minimal-blue {
    margin-right   : 5px;
    vertical-align : text-bottom;
}

/**
 * 상단 header bottom 색상
 */
.box-header.content-header {
    padding-bottom : 0px;
    border-bottom  : 0px solid #FFFFFF;
}

section.content {
    padding-top : 0;
}

/**
 * 상단 header tools Top
 */
.box-header > .box-tools {
    top : -10px;
}

.input[type=text] {
    -webkit-ime-mode : active;
    -moz-ime-mode    : active;
    -ms-ime-mode     : active;
    ime-mode         : active;
}

/**
 * wapples background-color
 */
.wp-bg-white {
    background-color : #FFFFFF;
}

.wp-bg-light-grayish-blue {
    background-color : #f4f5f7;
}

/**
 * 변경 사항에 대한 메모
 */
.wp-memo {
    display : none;
}

/**
 * bootstrap CSS 커스텀
 */

/**
 * col-sm-12 설정
 */
.col-sm-12 {
    width : 100%;
}

/**
 * Box 테두리
 */
.wp-default-box {
    border-bottom : 1px solid #d2d6de;
    border-left   : 1px solid #d2d6de;
    border-right  : 1px solid #d2d6de;
}

.box.wp-warning-box {
    border : 3px solid #f39c12;
}

/**
 * nav Box 테두리
 */
.wp-nav-tabs-custom > .nav-tabs > li.active > a {
    border-left  : 1px solid #d2d6de;
    border-right : 1px solid #d2d6de;
}

.wp-nav-tabs-custom > .nav-tabs > li:first-of-type.active > a {
    border-left-color : #d2d6de;
}

.wp-nav-default-box {
    border : 1px solid #d2d6de;
}

.wp-shadow-erase-box {
    box-shadow    : none;
    margin-bottom : 0;
}

.wp-margin-erase-box {
    margin-bottom : 0;
}

.wp-default-box-body {
    padding : 10px 0 0 0;
}

.wp-header-erase-box {
    border-top : 0;
}

/**
 * daterangepicker
 */
.daterangepicker {
    border : 1px solid #d2d6de;
}

/**
 * dropdown-menu
 */
.dropdown-menu {
    border  : 1px solid #2c3b41;
    top     : 90%;
    padding : 5px 5px 0 5px;
}

/**
 * btn outline 색상 제거
 */
.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    outline        : hidden;
    outline        : 0;
    outline-offset : 0;
}

/**
 * select2 멀티
 */
.select2-dropdown .select2-search__field:focus,
.select2-search--inline .select2-search__field:focus {
    border : 0;
}

/**
 * select2 ALL 선택
 */
.select2-container .select-all {
    position        : absolute;
    top             : -25px;
    height          : 20px;
    margin          : auto;
    display         : block;
    background-size : contain;
    cursor          : pointer;
    z-index         : 999999;
}

/**
 * 팝업 dx datagrid header panel
 */
.wp-popup .dx-datagrid-header-panel .dx-toolbar-after {
    width   : 100%;
    padding : 0;
    margin  : 0;
}

.wp-popup .dx-datagrid-header-panel .dx-toolbar-after .dx-searchbox {
    float : right;
}

.wp-popup .dx-datagrid-header-panel .dx-toolbar-after .dx-edit-button {
    margin-left : 0;
}

.wp-popup .dx-button {
    /*margin : 0 10px 10px 0;*/
}

/**
 * 팝업 Box 테두리 변경
 */
.wp-popup .box-title {
    font-size   : 15px;
    line-height : inherit;
}

.wp-popup .box-header {
    padding : 5px;
}

.wp-popup .form-group {
    margin-bottom : 7px;
}

.wp-popup .wp-popup-box {
    border-bottom : 1px solid #d2d6de;
    border-left   : 1px solid #d2d6de;
    border-right  : 1px solid #d2d6de;
}

.dx-popup-title {
    background : #242a30;
}

/**
 * 팝업 select2
 */
.popup-select2 {
    z-index : 1502;
}

.wp-select2 {
    width : 100%;
}

/**
 * 팝업 버튼
 */
.wp-popup .wp-popup-button {
    margin : 0px;
}

/**
 * 팝업 Footer
 */
.wp-popup-footer {
    padding-bottom : 55px;
}

.wp-popup .wp-box-footer {
    bottom   : 30px;
    height   : 0;
    position : fixed;
    right    : 0;
    left     : 0;
}

.dnat-status-box {
    max-height : 200px;
    min-height : 200px;
    display    : block;
    overflow-x : auto;
}

.nat-info-box {
    border             : 1px solid #3C4C66;
    border-top         : 3px solid;
    -webkit-box-shadow : 0 10px 6px -6px #777777;
    -moz-box-shadow    : 0 10px 6px -6px #777777;
    box-shadow         : 0 10px 6px -6px #777777;
}

.dnat-status-box .dnat-status-ip {
    font-size      : 16px;
    margin-left    : 10px;
    font-weight    : bold;
    vertical-align : super;
}

.dnat-status-box i.fa-check {
    color        : #12c2e9;
    margin-right : 10px;
}

.dnat-status-box i.fa-times {
    color        : #FF7A72;
    margin-right : 17px;
}

.dnat-status-box i.fa-circle,
.dnat-status-box i.fa-check.none {
    color : #959595;
}

.dnat-status-ip.none {
    color : #959595;
}

.blinking {
    color             : #FF7A72;
    -webkit-animation : blink 0.8s ease-in-out infinite alternate;
    -moz-animation    : blink 0.8s ease-in-out infinite alternate;
    animation         : blink 0.8s ease-in-out infinite alternate;
}

@-webkit-keyframes blink {
    0% {
        opacity : 0.3;
    }
    100% {
        opacity : 1;
    }
}

@-moz-keyframes blink {
    0% {
        opacity : 0.3;
    }
    100% {
        opacity : 1;
    }
}

@keyframes blink {
    0% {
        opacity : 0.3;
    }
    100% {
        opacity : 1;
    }
}

/**
 * 룰 Manual
 */
.manual-box .wp-manual i {
    width                   : 24px;
    height                  : 24px;
    background-position     : 3px 3px;
    -webkit-background-size : 15px 15px;
    -moz-background-size    : 15px 15px;
    background-size         : 15px 15px;
    padding                 : 4px;
    font-size               : 15px;
    text-align              : center;
    line-height             : 15px;
    color                   : white;
    margin-right            : -5px;
}

.manual-box .wp-manual i:hover {
    border        : 1px solid #d2d6de;
    border-radius : 4px;
}

/**
 * 감사 로그 팝업창 스크롤
 */
@media (max-height : 400px) {
    .dx-popup-content .dx-scrollable-container {
        overflow-y : scroll;
    }
}

/**
 * nowrap
 */
.wp-label-nowrap {
    white-space : nowrap
}

/**
 * label 위치
 */
@media (min-width : 768px) {
    .form-horizontal .wp-control-label-left {
        padding-top   : 7px;
        margin-bottom : 0;
        text-align    : left;
    }
}

/**
 * label 설정
 */
.wp-label {
    display       : inline-block;
    max-width     : 100%;
    margin-bottom : 0px;
    font-weight   : normal;
}

.wp-box-label {
    vertical-align : sub;
    margin-bottom  : 10px;
}

.wp-font-weight {
    font-weight : 700;
}

.wp-font-small {
    font-size : 11px;
}

/**
 * 마진 설정
 */
.margin-0 {
    margin : 0;
}

.margin-0-top {
    margin-top : 0;
}

.margin-0-bottom {
    margin-bottom : 0;
}

.margin-0-left {
    margin-left : 0;
}

.margin-0-right {
    margin-right : 0;
}

.margin-1-top {
    margin-top : 10px;
}

.margin-1-bottom {
    margin-bottom : 10px;
}

.margin-1-left {
    margin-left : 10px;
}

.margin-1-right {
    margin-right : 10px;
}

.margin-top {
    margin-top : 20px;
}

.margin-left {
    margin-left : 20px;
}

.margin-right {
    margin-right : 20px;
}

.wp-padding-top {
    padding-top : 20px;
}

.wp-padding-bottom {
    padding-bottom : 20px;
}

.wp-padding-left {
    padding-left : 20px;
}

.wp-padding-right {
    padding-right : 20px;
}

.wp-padding {
    padding : 20px;
}

.wp-1-padding {
    padding : 10px;
}

.wp-padding-0-top {
    padding-top : 0;
}

.wp-padding-0-bottom {
    padding-bottom : 0;
}

.wp-padding-0-left {
    padding-left : 0;
}

.wp-padding-0-right {
    padding-right : 0;
}

.form-horizontal .wp-margin-zero {
    margin : 0;
}

.wp-margin-zero {
    margin : 0;
}

.wp-left {
    float : left;
}

.wp-right {
    float : right;
}

@media (min-width : 1200px) {
    .col-lg-2.wp-media-padding-0-right,
    .col-lg-3.wp-media-padding-0-right,
    .col-lg-4.wp-media-padding-0-right,
    .col-lg-6.wp-media-padding-0-right,
    .col-lg-8.wp-media-padding-0-right {
        padding-right : 0;
    }
}

.sidebar-menu li.active > a:first-child {
    font-weight : bolder;
}

/**
 * 계정별 Side Menu 설정
 */
.sidebar-menu.website_administrators .configure-box ul li:not(.configure-operate-box),
.sidebar-menu.website_administrators .detection-box ul li:not(.detection-policy-box) {
    display : none;
}

.sidebar-menu.monitors .report-box,
.sidebar-menu.monitors .detection-box,
.sidebar-menu.monitors .configure-box ul li:not(.configure-operate-box) {
    display : none;
}

.sidebar-menu.monitors .log-box ul li.export-list-box {
    display : none;
}

.sidebar-menu.website_administrators .configure-box ul.treeview-menu li.account {
    display : block;
}

.sidebar-menu.monitors .configure-box ul.treeview-menu li.account,
.sidebar-menu.monitors .detection-box ul.treeview-menu li.user-pattern-box {
    display : block;
}

/**
 * 점검 상태
 */
.wrapper .notify {
    position   : relative;
    margin-top : 0;
}

.wrapper .notification-count {
    background : #00a65a;
}

.wrapper .notify .heart-bit {
    position                          : absolute;
    left                              : 19px;
    height                            : 30px;
    width                             : 30px;
    z-index                           : 10;
    border                            : 5px solid #f33155;
    border-radius                     : 70px;
    -moz-animation                    : heart-bit 1s ease-out;
    -moz-animation-iteration-count    : infinite;
    -o-animation                      : heart-bit 1s ease-out;
    -o-animation-iteration-count      : infinite;
    -webkit-animation                 : heart-bit 1s ease-out;
    -webkit-animation-iteration-count : infinite;
    animation-iteration-count         : infinite;
}

@-webkit-keyframes heart-bit {
    0% {
        -webkit-transform : scale(0);
        opacity           : 0.0;
    }
    25% {
        -webkit-transform : scale(0.1);
        opacity           : 0.1;
    }
    50% {
        -webkit-transform : scale(0.5);
        opacity           : 0.3;
    }
    75% {
        -webkit-transform : scale(0.8);
        opacity           : 0.5;
    }
    100% {
        -webkit-transform : scale(1);
        opacity           : 0.0;
    }
}

.diagnostics-popup-box {
    position : fixed;
    right    : 15px;
    bottom   : 0;
    z-index  : 99999;
}

.diagnostics-popup-box .diagnostics-content {
    -webkit-box-shadow : 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow         : 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    border             : 0;
    margin             : 0 0 10px 0;
    font-size          : 14px;
    border-radius      : 2px;
    overflow           : hidden;
    clear              : both;
    width              : 300px;
    cursor             : pointer;
}

.diagnostics-popup-box .diagnostics-content.new {
    animation         : shake 0.8s 5;
    -webkit-animation : shake 0.8s 5;
}

@keyframes shake {
    0% {
        transform : translate(1px, 1px) rotate(0deg);
    }
    10% {
        transform : translate(-1px, -2px) rotate(-1deg);
    }
    20% {
        transform : translate(-3px, 0px) rotate(1deg);
    }
    30% {
        transform : translate(3px, 2px) rotate(0deg);
    }
    40% {
        transform : translate(1px, -1px) rotate(1deg);
    }
    50% {
        transform : translate(-1px, 2px) rotate(-1deg);
    }
    60% {
        transform : translate(-3px, 1px) rotate(0deg);
    }
    70% {
        transform : translate(3px, 1px) rotate(-1deg);
    }
    80% {
        transform : translate(-1px, -1px) rotate(1deg);
    }
    90% {
        transform : translate(1px, 2px) rotate(0deg);
    }
    100% {
        transform : translate(1px, -2px) rotate(-1deg);
    }
}

.diagnostics-popup-box .modal-header.warning {
    background-color : #ffbb33;
}

.diagnostics-popup-box .modal-header.critical {
    background-color : #ff3547;
}

.diagnostics-popup-box .modal-header {
    -webkit-box-shadow      : 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);
    box-shadow              : 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);
    border                  : 0;
    display                 : -ms-flexbox;
    display                 : flex;
    -ms-flex-align          : start;
    align-items             : flex-start;
    -ms-flex-pack           : justify;
    justify-content         : space-between;
    padding                 : 1rem;
    border-bottom           : 1px solid #e9ecef;
    border-top-left-radius  : .3rem;
    border-top-right-radius : .3rem;
}

.diagnostics-popup-box .heading {
    margin    : 0;
    font-size : 18px;
    color     : #ffffff;
}

.diagnostics-popup-box button.close span {
    color : #ffffff !important;
}

.diagnostics-popup-box .modal-header .close {
    opacity     : 1;
    float       : right;
    font-size   : 25px;
    font-weight : 700;
    line-height : 1;
    color       : #000000;
    text-shadow : 0 1px 0 #ffffff;
    padding     : 1rem;
    margin      : -1rem 0rem -1rem auto;
}

.diagnostics-popup-box .modal-body {
    background : white;
}

/*.modal-body {*/
/*padding: 1.5rem;*/
/*!* color: #616161; *!*/
/*}*/
/*.modal-body {*/
/*position: relative;*/
/*-ms-flex: 1 1 auto;*/
/*flex: 1 1 auto;*/
/*padding: 1rem;*/
/*}*/

@-webkit-keyframes fadein {
    from {
        bottom  : 0;
        opacity : 0;
    }
    to {
        bottom  : 30px;
        opacity : 1;
    }
}

@keyframes fadein {
    from {
        bottom  : 0;
        opacity : 0;
    }
    to {
        bottom  : 30px;
        opacity : 1;
    }
}

@-webkit-keyframes fadeout {
    from {
        bottom  : 30px;
        opacity : 1;
    }
    to {
        bottom  : 0;
        opacity : 0;
    }
}

@keyframes fadeout {
    from {
        bottom  : 30px;
        opacity : 1;
    }
    to {
        bottom  : 0;
        opacity : 0;
    }
}

/**
 * option
 */
.wp-option {
    color       : #999999;
    float       : right;
    margin-left : 5px;
    font-size   : 13px;
    font-style  : oblique;
}

/**
 * 상단 최근 사용 내역 10건 (감사 로그)
 */
.audit-menu .audit-history a {
    white-space : inherit;
}

.audit-menu .audit-history a h4 {
    margin    : 0 0 0 5px;
    color     : #444444;
    font-size : 15px;
    position  : relative;
}

.audit-menu .audit-history a div.alarm-diagnostics-content {
    margin    : 5px 0 0 5px;
    font-size : 12px;
    color     : #888888;
}

/*
 * bootStrap Custom Common
 */
.btn-wapples {
    color            : #FFFFFF;
    background-color : #3C4C66;
}

.btn-wapples:hover {
    color            : #FFFFFF;
    background-color : #3C4C55;
}

.btn-wapples-otp {
    color            : #FFFFFF;
    background-color : #3C4C66;
}

.maximized {
    z-index  : 9999;
    width    : 100%;
    height   : 100%;
    position : fixed;
    top      : 0;
    left     : 0;
}

/* dx-dataGrid Custom*/
.dx-custom-toolbar {
    margin-right : 5px;
}

/* popup overlay color*/
.dx-overlay-shader {
    background-color : rgba(64, 64, 64, .8);
}

.filebox input[type="file"] {
    position : absolute;
    width    : 1px;
    height   : 1px;
    padding  : 0;
    margin   : -1px;
    overflow : hidden;
    clip     : rect(0, 0, 0, 0);
    border   : 0;
}

/**
* direct-info
*/
.direct-info .box-body {
    border-bottom-right-radius : 0;
    border-bottom-left-radius  : 0;
    position                   : relative;
    overflow-x                 : hidden;
    padding                    : 0;
}

.direct-info.info-pane-open .direct-info-contacts {
    -webkit-transform : translate(0, 0);
    -ms-transform     : translate(0, 0);
    -o-transform      : translate(0, 0);
    transform         : translate(0, 0);
}

.direct-info-original {
    -webkit-transform : translate(0, 0);
    -ms-transform     : translate(0, 0);
    -o-transform      : translate(0, 0);
    transform         : translate(0, 0);
    padding           : 10px;
    overflow          : auto;
}

.direct-info-original,
.direct-info-contacts {
    -webkit-transition : -webkit-transform 0.5s ease-in-out;
    -moz-transition    : -moz-transform 0.5s ease-in-out;
    -o-transition      : -o-transform 0.5s ease-in-out;
    transition         : transform 0.5s ease-in-out;
}

.direct-info-contacts-open .direct-info-contacts {
    -webkit-transform : translate(0, 0);
    -ms-transform     : translate(0, 0);
    -o-transform      : translate(0, 0);
    transform         : translate(0, 0);
    display           : block;
    width             : 50%;
    right             : 0;
    word-wrap         : break-word;
}

.direct-info-contacts {
    -webkit-transform : translate(101%, 0);
    -ms-transform     : translate(101%, 0);
    -o-transform      : translate(101%, 0);
    transform         : translate(101%, 0);
    position          : absolute;
    top               : 0;
    bottom            : 0;
    display           : none;
    background        : #222d32;
    color             : #ffffff;
    overflow          : auto;
}

/*
* Login page
*/
.login .login-top {
    width            : 100%;
    height           : 300px;
    background-color : #323A49;
}

.login .login-top-title {
    position   : relative;
    top        : 100px;
    color      : white;
    text-align : center;
}

.login .login-middle {
    padding-top : 50px;
}

.login .login-bottom {
    position         : fixed;
    bottom           : 0px;
    height           : 30px;
    width            : 100%;
    background-color : #E6E8ED;
}

.login .login-bottom-copy {
    text-align  : center;
    color       : #7E8EA8;
    font-size   : 12px;
    line-height : 30px;
}

.login .dx-overlay-wrapper.dx-toast-wrapper {
    width : 100%;
}

.login .dx-overlay-content.dx-toast-error.dx-toast-content.dx-resizable {
    min-width : 600px;
}

.dx-toast-message {
    white-space : pre-line;
}

.login .otp-login {
    display : none;
}

/**
 * EULA
 */
.eula-popup div.eula {
    height : 100%;
}

.eula-popup .eula h4 {
    margin-bottom : 2px;
}

.eual-data-sentence {
    margin       : 0;
    text-indent  : -0.9em;
    padding-left : 13px;
}

.eual-main-sentence {
    margin-bottom : 5px;
    text-indent   : 0;
    padding-left  : 0;
}

.eula-popup textarea.eula {
    box-sizing  : border-box;
    resize      : none;
    font-weight : bold;
}

.identify-eula {
    cursor      : pointer;
    color       : #555555;
    margin-left : 5px;
}

.identify-sub-eual {
    font-size      : 12px;
    text-align     : left;
    line-height    : 20px;
    color          : #666666;
    padding-bottom : 11px;
    padding-left   : 30px;
    text-indent    : -1.4em;
}

/**
 * 대시보드 공통
 */
#summaryOverview section.content {
    padding-top : 0;
}

.dx-theme-generic-typography {
    font-size : 13px;
}

.main-sidebar .sidebar-menu span.menuName {
    margin-left : 10px;
}

.main-sidebar {
    position   : fixed;
    top        : 0;
    right      : 0;
    left       : 0;
    overflow-x : auto;
    height     : 100%;
}

@media (min-width : 768px) {
    .sidebar-mini.sidebar-collapse .main-sidebar {
        width : 0px !important;
    }
}

@media (min-width : 768px) {
    .sidebar-mini.sidebar-collapse .content-wrapper,
    .sidebar-mini.sidebar-collapse .right-side,
    .sidebar-mini.sidebar-collapse .main-footer {
        margin-left : 0 !important;
    }
}

@media (min-width : 768px) {
    .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
        width     : auto;
        min-width : 180px;
    }
}

.content-header .breadcrumb {
    float    : none;
    position : static;
}

.content-header .breadcrumb {
    font-weight : bolder;
}

.content-header .breadcrumb > li,
.content-header .breadcrumb > li + li:before {
    color : #222d32;
}

.content-header .breadcrumb i.fa-lg {
    font-size : 1.6em;
}

.summary-overview .info-box-icon {
    width : 45%;
}

/**
 * 대시보드 > 요약
 */
.summary-overview .stats-counter {
    background            : none repeat scroll 0 0 #ffffff;
    -webkit-border-radius : 1px;
    -moz-border-radius    : 1px;
    -ms-border-radius     : 1px;
    -o-border-radius      : 1px;
    border-radius         : 1px;
    float                 : left;
    overflow              : hidden;
    position              : relative;
    text-align            : center;
    width                 : 100%;
    -webkit-transition    : all 0.4s ease 0s;
    -moz-transition       : all 0.4s ease 0s;
    -ms-transition        : all 0.4s ease 0s;
    -o-transition         : all 0.4s ease 0s;
    transition            : all 0.4s ease 0s;
}

.status-progress {
    margin-top : 20px;
    width      : 100%;
}

.summary-overview .tps-box .info-box {
    border-top-color : #a0c2c3;
}

.summary-overview .cps-box .info-box {
    border-top-color : #8297aa;
}

.summary-overview .traffic-box .info-box {
    border-top-color : #fdccae;
}

.summary-overview .detect-box .info-box {
    border-top-color : #fd9e9c;
}

.liquidFillGaugeText {
    font-family : Helvetica;
    font-weight : bold;
}

.summary-overview .detect-box h3,
.summary-overview .traffic-box h3,
.summary-overview .tps-box h3,
.summary-overview .cps-box h3 {
    float          : left;
    font-size      : 16px;
    letter-spacing : 0.3px;
    line-height    : 10px;
    margin         : 20px 0 15px;
    text-align     : center;
    width          : 100%;
}

.summary-overview .detect-box span.intrusionlog,
.summary-overview .traffic-box span.traffic,
.summary-overview .tps-box span.tps,
.summary-overview .cps-box span.cps {
    color         : #333333;
    font-size     : 31px;
    font-weight   : 600;
    line-height   : 24px;
    margin-bottom : 11px;
    margin-top    : -2px;
    text-align    : center;
}

.summary-overview .contrast {
    font-size : 13px;
}

.summary-overview .gray {
    color : #6d6a6a;
}

.summary-overview .green {
    color : #1ABB9C;
}

.summary-overview .red {
    color : #E74C3C;
}

.summary-overview .system {
    padding : 0;
}

.summary-overview .system li {
    list-style : none;
    display    : block;
}

.summary-overview .system li dd {
    float     : left;
    min-width : 50px;
}

.summary-overview .equipment .raid div {
    border-bottom : 1px solid #eeeeee;
}

.summary-overview .equipment .raid div.last {
    border-bottom : 0 solid;
}

.summary-overview .map-box {
    margin-bottom : -5px;
}

.summary-overview .map-box #worldMap {
    margin : 0 auto;
}

.summary-overview .detect-box h6,
.summary-overview .traffic-box h6,
.summary-overview .tps-box h6,
.summary-overview .cps-box h6 {
    background  : none repeat scroll 0 0 #f5f5f5;
    border-top  : 1px solid #ecedf0;
    color       : #777777;
    float       : left;
    font-size   : 14px;
    font-weight : normal;
    margin      : 5px 0 0;
    padding     : 28px 0 17px;
    width       : 100%;
    height      : 70px;
}

.summary-overview #intrusionlogGraph,
.summary-overview #trafficGraph,
.summary-overview #tpsGraph,
.summary-overview #cpsGraph {
    max-width : 90%;
    margin    : 0 auto;
}

.summary-overview .x_content {
    padding    : 0 5px 6px;
    float      : left;
    clear      : both;
    margin-top : 5px;
}

.summary-overview .wp-summary-box,
.summary-detect-overview .wp-summary-box {
    display : inline-block;
    padding : 20px;
}

.summary-overview .website-list-box .title,
.summary-overview .source-ip-list-box .title {
    font-size   : 18px;
    margin-top  : 10px;
    font-weight : 600;
}

.summary-overview table.website-list,
.summary-overview table.source-ip-list {
    width : 100%;
}

.summary-overview table.source-ip-list td,
.summary-overview table.website-list td,
.summary-overview table.countries-list td {
    padding     : 0 10px;
    line-height : 30px;
    border-top  : 1px solid #eeeeee;
}

.summary-overview table.countries-list td {
    padding : 2px 10px;
}

@media only screen and (max-width : 991px) {
    .summary-overview .col-xs-12.wp-padding-0-right {
        padding-right : 15px;
    }
}

#worldMap {
    height : 360px;
    width  : 100%;
}

.summary-overview .wapples-info-box .title {
    font-size   : 18px;
    font-weight : 600;
    margin-top  : 0;
}

.summary-overview .system-status-box .title {
    display     : none;
    margin      : 0 0 0 5px;
    position    : absolute;
    font-size   : 14px;
    font-weight : 600;
}

.summary-overview .system-status-box .cpu-title {
    top : 100px;
}

.summary-overview .system-status-box .ram-title {
    top : 190px;
}

.summary-overview .system-status-box .disk-title {
    top : 280px;
}

.summary-overview .cpu-gauge,
.summary-overview .ram-gauge {
    margin-bottom : -10px;
}

.summary-overview .cpu-gauge {
    margin-top : -20px;
}

.summary-overview .disk-gauge {
    margin-bottom : -7px;
}

.summary-overview .equipment-status-box .equipment-status,
.summary-overview .wapples-box .wapples {
    width : 100%;
}

.summary-overview .wapples-info-box .info-box {
    min-height     : 372px;
    margin-bottom  : 0;
    padding-bottom : 5px;
}

.summary-overview .system-status-box {
    margin-top : 30px;
}

.summary-overview .wapples-info-box .sw-bypass-title.on {
    color       : red;
    font-weight : bolder
}

.summary-overview .wapples-info-box .sw-bypass-info.on {
    background : blanchedalmond;
}

.dxm-tooltip {
    z-index : 811;
}

#gdp-sectors {
    width         : 260px;
    height        : 80px;
    margin-bottom : 20px;
    display       : block;
}

/**
 * 대시보드 > LB
 */
.lb-overview .content .box-header > .box-tools {
    top : 5px;
}

/**
 * 대시보드 > 탐지 요약
 */
.summary-detect-overview .dx-datagrid .dx-row > td {
    padding : 5px;
}

.summary-detect-overview .stats-counter {
    background            : none repeat scroll 0 0 #ffffff;
    -webkit-border-radius : 1px;
    -moz-border-radius    : 1px;
    -ms-border-radius     : 1px;
    -o-border-radius      : 1px;
    border-radius         : 1px;
    float                 : left;
    overflow              : hidden;
    position              : relative;
    text-align            : center;
    width                 : 100%;
    -webkit-transition    : all 0.4s ease 0s;
    -moz-transition       : all 0.4s ease 0s;
    -ms-transition        : all 0.4s ease 0s;
    -o-transition         : all 0.4s ease 0s;
    transition            : all 0.4s ease 0s;
}

.summary-detect-overview table.rule td,
.summary-detect-overview table.source-ip td,
.summary-detect-overview table.country td {
    padding     : 0 10px;
    line-height : 28px;
    border-top  : 1px solid #eeeeee;
}

.summary-detect-overview .detect-count-box span.detect-count {
    color         : #333333;
    font-size     : 31px;
    font-weight   : 600;
    line-height   : 24px;
    margin-bottom : 11px;
    margin-top    : -2px;
    text-align    : center;
}

.summary-detect-overview .detect-count-box h3 {
    float          : left;
    font-size      : 16px;
    letter-spacing : 0.3px;
    line-height    : 10px;
    margin         : 20px 0 15px;
    text-align     : center;
    width          : 100%;
}

.summary-detect-overview .detect-count-box h3.en {
    margin-top : 9px;
}

.summary-detect-overview .detect-box .info-box {
    height : 137px;
}

.summary-detect-overview .detect-box #detectGrid {
    height : 100%
}

.summary-detect-overview .website-box,
.summary-detect-overview .rule-box,
.summary-detect-overview .source-ip-box,
.summary-detect-overview .country-box {
    /*margin : 20px 20px 10px 20px;*/
}

.summary-detect-overview .website-box .title,
.summary-detect-overview .rule-box .title,
.summary-detect-overview .source-ip-box .title,
.summary-detect-overview .country-box .title {
    font-size   : 18px;
    margin-top  : 0px;
    font-weight : 600;
}

.summary-detect-overview .rule-box .rule,
.summary-detect-overview .source-ip-box .source-ip,
.summary-detect-overview .country-box .country {
    width : 100%;
}

/**
 * 대시보드 > 서비스 현황
 */
.dashboard-service-overview .service-tps-box button.active,
.dashboard-service-overview .service-cps-box button.active,
.dashboard-service-overview .service-traffic-box button.active,
.dashboard-service-overview .service-throughput-box button.active,
    /*.dashboard-service-overview .service-box button.active,*/
.dashboard-service-overview .website-box button.active,
.dashboard-service-overview .nic-box button.active {
    color : maroon;
}

.dashboard-service-overview .service-period {
    margin : 0 0 10px 0;
}

.dashboard-service-overview .service-period button[name="1h"],
.dashboard-service-overview .service-period button[name="1d"] {
    margin-left : 0
}

.dashboard-service-overview .content .info-box {
    min-height : 0;
}

.dashboard-service-overview .content .box-header {
    padding : 15px;
}

.dashboard-service-overview .content .box-header .graph-header,
.dashboard-service-overview .content .box-header .service-graph,
.dashboard-service-overview .content .box-header .website-graph,
.dashboard-service-overview .content .box-header .nic-graph {
    box-shadow : none;
}

.dashboard-service-overview .content .box-header .table-header,
.dashboard-service-overview .content .box-header .service-table,
.dashboard-service-overview .content .box-header .website-table,
.dashboard-service-overview .content .box-header .nic-table {
    padding : 0;
    /*margin-top : 2px;*/
}

.dashboard-service-overview .content .box-header .table-header i,
.dashboard-service-overview .content .box-header .service-table i,
.dashboard-service-overview .content .box-header .website-table i,
.dashboard-service-overview .content .box-header .nic-table i {
    font-size : 18px;
}

.dashboard-service-overview .content .box-header .graph-header i,
.dashboard-service-overview .content .box-header .service-graph i,
.dashboard-service-overview .content .box-header .website-graph i,
.dashboard-service-overview .content .box-header .nic-graph i {
    font-size : 18px;
}

.dashboard-service-overview .content .box-tools {
    margin : 12px 0;
    left   : 10px;
}

.dashboard-service-overview .content .service-title {
    vertical-align : inherit;
    font-weight    : 600;
}

.dashboard-service-overview .content .graph-title {
    font-size   : 20px;
    text-align  : center;
    width       : 100%;
    font-weight : 600;
}

.dashboard-service-overview .content .info-box .service-tps-table-box,
.dashboard-service-overview .content .info-box .service-cps-table-box,
.dashboard-service-overview .content .info-box .service-traffic-table-box,
.dashboard-service-overview .content .info-box .service-throughput-table-box,
    /*.dashboard-service-overview .content .info-box .service-table-box,*/
.dashboard-service-overview .content .info-box .website-table-box,
.dashboard-service-overview .content .info-box .nic-table-box {
    margin : 0;
}

.tooltip-header {
    margin-bottom  : 5px;
    font-size      : 16px;
    font-weight    : 500;
    padding-bottom : 5px;
    border-bottom  : 1px solid #c5c5c5;
}

.tooltip-body {
    width : 170px;
}

.tooltip-body .series-name {
    font-weight   : normal;
    opacity       : 0.6;
    display       : inline-block;
    line-height   : 1.5;
    padding-right : 10px;
    width         : 126px;
}

.tooltip-body .value-text {
    display     : inline-block;
    line-height : 1.5;
    width       : 30px;
}

/**
 * 환경 설정 > 시스템 현황
 */
.dashboard-system-overview #cpuGraph,
.dashboard-system-overview #ramGraph {
    margin-bottom : 5px;
}

.dashboard-system-overview #diagnosticsGridContainer {
    margin         : 0 20px 20px 20px;
    padding-bottom : 15px;
}

.dashboard-system-overview .ram-box .info-box,
.dashboard-system-overview .cpu-box .info-box,
.dashboard-system-overview .diagnostics-box .info-box {
    height : 288px;
}

.dashboard-system-overview .content .box-title,
.dashboard-system-overview .content .graph-title {
    font-size   : 20px;
    text-align  : center;
    width       : 100%;
    font-weight : 600;
}

.dashboard-system-overview #databaseGraph {
    width          : 100%;
    vertical-align : bottom;
    height         : 200px;
    margin-top     : 15px;
}

.dashboard-system-overview table.system td {
    padding     : 0 10px;
    line-height : 30px;
    border-top  : 1px solid #eeeeee;
}

.dashboard-system-overview table.database-table,
.dashboard-system-overview table.raid-table,
.dashboard-system-overview table.pls-table,
.dashboard-system-overview table.ha-table {
    width : 100%;
}

.dashboard-system-overview .disk1-graph-box {
    margin-top : -15px;
}

.dashboard-system-overview .psu-box .voltage-table {
    margin : 0 auto;
    width  : 80%;
}

.dashboard-system-overview .psu-box .fa-plug,
.dashboard-system-overview .psu-box .fa-thermometer-half {
    font-size     : 45px;
    margin-bottom : 10px;
}

.dashboard-system-overview .psu-box .graph-title {
    margin-bottom : 0;
}

.dashboard-system-overview .psu-box .voltage-icon-box {
    margin-top    : 20px;
    margin-bottom : 105px;
    text-align    : center;
}

.dashboard-system-overview .psu-box .voltage-icon {
    text-align    : center;
    margin-bottom : 20px;
}

.dashboard-system-overview .psu-box .voltage .title {
    text-align  : center;
    font-weight : 600;
}

.dashboard-system-overview .psu-box .temperature .title {
    text-align    : center;
    font-weight   : 600;
    margin-bottom : 25px;
}

.dashboard-system-overview .disk-box .info-box {
    height : 357px;
}

.dashboard-system-overview .disk-box .disk-data-box {
    height     : 300px;
    overflow-x : hidden;
    overflow-y : auto;
}

.dashboard-system-overview .disk-box .box-tools {
    left : 10px;
    top  : -13px;
}

.dashboard-system-overview .disk-box .box-tools button {
    float : right;
}

.dashboard-system-overview .disk-box .box-tools label {
    position       : absolute;
    left           : 10%;
    text-align     : center;
    width          : 80%;
    font-weight    : 600;
    font-size      : 20px;
    vertical-align : sub;
}

.dashboard-system-overview .database-box .info-box {
    min-height : 358px;
}

.dashboard-system-overview .database-box .database-table {
    margin  : 0 auto;
    width   : 60%;
    display : none;
}

.dashboard-system-overview .database-box .database-used-size {
    color : #ff7c7c;
}

.dashboard-system-overview .nic-box .info-box {
    min-height : 358px;
}

.dashboard-system-overview .nic-box #nicGridContainer {
    margin : 10px 20px;
}

.dashboard-system-overview .ha-pls-box .info-box {
    min-height : 310px;
}

.dashboard-system-overview .ha-pls-box .server {
    font-size : 45px;
    color     : #47454D;
}

.dashboard-system-overview .ha-pls-box .sync-alt {
    font-size : 30px;
    margin    : 10px;
    color     : #00a65a;
}

.dashboard-system-overview .ha-pls-box .ha-on-title {
    text-align : left;
    margin     : 13px 0 5px 0;
}

.dashboard-system-overview .ha-pls-box .ha-off-title {
    margin : 13px 0 5px 0;
}

.dashboard-system-overview .wapples-info-box .info-box {
    min-height : 310px;
}

.dashboard-system-overview .ha-icon-box {
    text-align : center;
}

.dashboard-system-overview .pls-icon-box {
    text-align : center;
}

.dashboard-system-overview .pls-icon-box .server {
    font-size : 45px;
    color     : #47454D;
}

.dashboard-system-overview .pls-icon-box .sync-alt {
    font-size : 30px;
    margin    : 10px;
    color     : #00a65a;
}

.dashboard-system-overview .pls-icon-box .pls-on-box .sync-time .sync-title {
    text-align     : left;
    margin-bottom  : 3px;
    padding-bottom : 5px;
    border-bottom  : 1px solid #eeeeee;
}

.dashboard-system-overview .pls-icon-box .pls-on-box .sync-time .sync-info {
    text-align : left;
    margin     : 5px 0 0 10px;
}

.dashboard-system-overview .pls-icon-box .pls-on-box .pls-on-title {
    text-align : left;
    margin     : 13px 0 5px 0;
}

.dashboard-system-overview .pls-icon-box .pls-off-box .pls-off-title {
    margin : 13px 0 5px 0;
}

.dashboard-system-overview .raid-box .info-box {
    min-height : 271px;
}

.dashboard-system-overview .raid-box .row {
    margin : 8px 0 0 0;
}

.dashboard-system-overview .raid-box .box-tools {
    left : 10px;
    top  : -13px;
}

.dashboard-system-overview .raid-box .box-tools button {
    float : right;
}

.dashboard-system-overview .raid-box .box-tools label {
    position       : absolute;
    left           : 10%;
    text-align     : center;
    width          : 80%;
    font-weight    : 600;
    font-size      : 20px;
    vertical-align : sub;
}

.dashboard-system-overview .raid-box .raid-icon-box {
    border-top  : 1px solid #eeeeee;
    padding-top : 15px;
}

.dashboard-system-overview .wapples-info-table {
    width  : 95%;
    margin : 10px auto;
}

.dashboard-system-overview .raid-box button.detail {
    float : right;
}

#detailDiagnosticsGridContainer .dx-master-detail-cell {
    padding : 15px 10px 10px 10px;
}

.dashboard-system-overview .diagnostics-box .row {
    margin : 8px 0 0 0;
}

.dashboard-system-overview .diagnostics-box .box-tools {
    left : 10px;
    top  : -13px;
}

.dashboard-system-overview .diagnostics-box .box-tools label {
    position       : absolute;
    left           : 10%;
    text-align     : center;
    width          : 80%;
    font-weight    : 600;
    font-size      : 20px;
    vertical-align : sub;
}

.dashboard-system-overview .diagnostics-box button.detail {
    float : right;
}

.diagnostics-popup .diagnostics-result {
    position : absolute;
    z-index  : 1;
}

.diagnostics-popup .total-count {
    width : 100%;
}

.summary-overview .normal-color,
.dashboard-system-overview .normal-color,
.diagnostics-popup .normal-color {
    color : #0080ff;
}

.summary-overview .critical-color,
.dashboard-system-overview .critical-color,
.diagnostics-popup .critical-color {
    color : #ff7c7c;
}

.summary-overview .warning-color,
.dashboard-system-overview .warning-color,
.diagnostics-popup .warning-color {
    color : #f39c12;
}

.summary-overview .failure-color,
.dashboard-system-overview .failure-color,
.diagnostics-popup .failure-color {
    color : #999999;
}

.diagnostics-popup td {
    padding     : 0 10px;
    line-height : 30px;
    border-top  : 1px solid #eeeeee;
}

/**
 * 환경 설정 > 시스템 현황 > 상세보기
 */
.disk-popup table {
    width : 100%
}

.disk-popup table td {
    padding       : 0 10px;
    line-height   : 30px;
    border-top    : 1px solid;
    border-bottom : 1px solid #CCCBCE;
}

.disk-popup table td.user-size {
    border-bottom : 1px solid #000000;
    color         : #ff7c7c;
}

.raid-popup table {
    width : 100%
}

.raid-popup table td {
    padding       : 0 10px;
    line-height   : 30px;
    border-top    : 1px solid;
    border-bottom : 1px solid #CCCBCE;
}

.raid-popup table td.vendor {
    border-bottom : 1px solid #000000;
}

/**
 * 환경 설정 > 탐지 > X-Forwarded-For 설정
 */
.xforwardedfor-overview .content .box-body {
    margin : 15px;
    border : 1px solid #F4F4F4;
}

.xforwardedfor-overview .content .box-body dl {
    float : left;
}

.xforwardedfor-overview .content .box-body dt {
    float  : left;
    clear  : both;
    margin : 10px;
    width  : 220px;
}

.xforwardedfor-overview .content .box-body dd {
    margin : 10px;
    float  : left;
}

/**
 * 환경 설정 > 패턴 > Error Handling 패턴 저장소
 */
.error-pattern-overview .pattern-name-box-body {
    margin-top : 0px;
}

.error-pattern-overview .pattern-info-box {
    margin-top : 60px;
}

.error-pattern-overview .pattern-policy-box-body {
    margin-top : 20px;
}

.error-pattern-popup .box-footer {
    margin-top : 30px;
}

@media only screen and (min-width : 768px) {
    .error-pattern-overview .pattern-name-box-body {
        margin-top : 46px;
    }
}

@media only screen and (min-width : 768px) {
    .error-pattern-overview .pattern-info-box {
        margin-top : 0px;
    }
}

/**
 * 환경 설정 > 패턴 > User Handling 패턴 저장소
 */
.user-pattern-overview .pattern-name-box-body {
    margin-top : 0px;
}

.user-pattern-overview .pattern-info-box {
    margin-top : 60px;
}

.user-pattern-overview .pattern-policy-box-body {
    margin-top : 20px;
}

.user-pattern-popup .box-footer {
    margin-top : 30px;
}

.cd-container {
    width     : 90%;
    max-width : 768px;
    margin    : 2em auto;
}

.cd-container::after {
    content : '';
    display : table;
    clear   : both;
}

@media only screen and (min-width : 768px) {
    .user-pattern-overview .pattern-name-box-body {
        margin-top : 37px;
    }
}

@media only screen and (min-width : 768px) {
    .user-pattern-overview .pattern-info-box {
        margin-top : 0;
    }
}

/**
 * 예외 패턴, 서버 패턴 검색
 */
.dx-datagrid-search-panel {
    margin-left : 5px;
}

/**
 * Fixed Save 버튼
 */
div.fixed-save {
    display     : none;
    bottom      : 0;
    top         : inherit;
    margin      : 0 15px 0 15px;
    padding-top : 10px;
}

div.fixed-save div {
    border-top       : 1px solid #f4f4f4;
    padding          : 10px;
    background-color : #ffffff;
    margin-bottom    : 0;
    margin-left      : 230px;
    min-height       : 50px;
    border-radius    : 0;
}

@media only screen and (min-width : 768px) {
    div.fixed-save {
        display : block;
    }
}

div.fixed-save.et-visible {
    bottom      : 0;
    top         : inherit;
    margin      : 0 15px;
    padding-top : 10px;
    right       : 0;
    left        : 0;
    position    : fixed;
    z-index     : 200;
}

div.fixed-save.et-hidden {
    width                              : 0;
    -webkit-transition                 : width 2s; /* Safari */
    -webkit-transition-timing-function : linear; /* Safari */
    transition                         : width 2s;
    transition-timing-function         : linear;
    opacity                            : 0;
    display                            : none;
}

div.fixed-save.et-hidden div {
    display : none;
}

div.fixed-save-cookie {
    display : none;
}

/**
 * 환경 설정 > SSL Profile
 */
.wp-blockquote {
    padding : 5px 5px 5px 20px;
    margin  : 10px;
}

.wp-small {
    font-size : small;
}

.wp-x-small {
    font-size : x-small;
}

/**
 * 환경 설정 > 서버 > acl
 */
#aclOverview .use-acl-box {
    margin  : 5px 0 15px 0;
    z-index : 1;
}

.acl-popup .acl-filter-box {
    min-height : 188px;
}

/**
 * 환경 설정 > 서버 > 네트워크 필터 자동 등록
 */
.net-filter-condition-overview #blockListGridDelete {
    position : absolute;
    z-index  : 1;
}

/**
 * 환경 설정 > 자가 점검 > S/W 바이패스
 */
.recover-term-help-box,
.reset-term-help-box {
    margin  : 15px 0 0 5px;
    padding : 0;
}

/**
 * 환경 설정 > 서버 > SSL 프로파일
 */
.ssl-profile-popup .pull-right {
    top : 0;
}

.ssl-profile-popup .ssl-side-copy-title {
    font-weight : 500;
}

.ssl-profile-popup .ssl-side-copy {
    padding        : 1px 5px;
    margin         : 0;
    line-height    : 0;
    vertical-align : inherit;
}

.ssl-profile-popup .sslv3-tooltip {
    color : darkorange
}

.ssl-profile-popup .sslv3-tooltip + .tooltip > .tooltip-inner {
    font-weight : 500;
    padding     : 10px;
}

.ssl-profile-popup .sslv3-tooltip + .tooltip > .tooltip-arrow,
.ssl-profile-popup .sslv3-tooltip + .tooltip > .tooltip-inner {
    margin-bottom : 10px;
}

/**
 * 환경 설정 > 서버 > 웹 서버
 */
.webserver-popup .pull-right {
    top : 0;
}

/**
 * 환경 설정 > 운영 > 계정
 */
.account-popup .monitor-readonly {
    margin-top : 5px;
}

/**
 * 연동 > email
 */
#emailOverview .email-box .time {
    margin : 5px 0 5px 0;
}

/**
 * 연동 > syslog, snmptrap
 */
.snmp-agent-overview .addition-conditional,
.snmptrap-overview .addition-conditional,
.syslog-overview .addition-conditional {
    padding       : 5px 10px;
    margin-bottom : 5px;
    border-radius : 3px;
}

.snmp-agent-overview .resources,
.snmptrap-overview .resources,
.syslog-overview .resources {
    border      : 1px solid #2c3b41;
    top         : 34px;
    padding     : 5px 5px 0 5px;
    margin-left : 15px;
}

.snmp-agent-overview .resources .divider,
.snmptrap-overview .resources .divider,
.syslog-overview .resources .divider {
    margin : 0;
}

.snmp-agent-overview .resources li a,
.snmptrap-overview .resources li a,
.syslog-overview .resources li a {
    color : #444444;
}

.snmp-agent-overview .resources-box,
.snmptrap-overview .resources-box,
.syslog-overview .resources-box {
    overflow-x : auto;
    overflow-y : auto;
}

.snmp-agent-overview .resources-box .box-line,
.snmptrap-overview .resources-box .box-line,
.syslog-overview .resources-box .box-line {
    border : 1px solid #d2d6de;
}

.snmp-agent-overview .resources-box .box-line .box-tools,
.snmptrap-overview .resources-box .box-line .box-tools,
.syslog-overview .resources-box .box-line .box-tools {
    top : 0;
}

.snmp-agent-overview .resources-box .box-header,
.snmptrap-overview .resources-box .box-header,
.syslog-overview .resources-box .box-header {
    padding : 7px;
}

.snmp-agent-overview .resources-box .box-body,
.snmptrap-overview .resources-box .box-body,
.syslog-overview .resources-box .box-body {
    padding : 5px 0;
}

.snmp-agent-overview .resources-box .box-header .box-title,
.snmptrap-overview .resources-box .box-header .box-title,
.syslog-overview .resources-box .box-header .box-title {
    display   : block;
    font-size : inherit;
}

.snmp-agent-overview .resources-box .dx-datagrid .dx-row > td,
.snmptrap-overview .resources-box .dx-datagrid .dx-row > td,
.syslog-overview .resources-box .dx-datagrid .dx-row > td {
    padding : 0 7px 0 7px;
}

.snmp-agent-overview .resources-box .dx-datagrid-rowsview,
.snmptrap-overview .resources-box .dx-datagrid-rowsview,
.syslog-overview .resources-box .dx-datagrid-rowsview {
    border-top : 0;
}

.snmp-agent-overview .resources .fa-edit,
.snmptrap-overview .resources .fa-edit,
.syslog-overview .resources .fa-edit {
    float   : right;
    margin  : 0;
    padding : 3px 0;
}

.snmp-agent-overview .security-level-mode {
    margin-bottom : 0;
}

.snmp-agent-overview .user-authentication {
    margin : 0 0 10px 0;
}

.snmp-agent-overview .auth-protocol-box {
    margin : 0;
}

.snmp-agent-overview .private-authentication {
    margin : 0 0 10px 0;
}

.snmp-agent-overview .private-protocol-box {
    margin : 0;
}

.snmp-popup .auth-protocol-title {
    display       : inline-block;
    max-width     : 100%;
    margin-bottom : 5px;
    font-weight   : 700;
}

.snmp-popup .private-protocol-title {
    display       : inline-block;
    max-width     : 100%;
    margin-bottom : 5px;
    font-weight   : 700;
}

.format-type-name {
    z-index   : 1;
    left      : 105px;
    height    : 36px;
    top       : 25px;
    font-size : 16px;
    position  : absolute;
}

#formatType {
    position : absolute;
    z-index  : 1;
    left     : 150px;
    height   : 36px;
}

#popupWebsite .wp-font-weight,
#popupSystemMonitor .label-name,
#popupIpBlock .wp-font-weight {
    margin-left : 5px;
}

/**
 * 시스템 > 정보
 */
#infoOverview .wp-default-box {
    min-height : 230px;
}

/**
 * 시스템 > WAPPLES 라이선스
 */
#licenseOverview .license-box .wp-default-box {
    min-height : 500px;
    max-height : 500px;
    overflow-x : hidden;
}

#licenseOverview .warring-msg {
    font-weight : bold;
    color       : #E74C3C;
}

/**
 * 시스템 > 관리도구 라이선스
 */
.authentication-overview .auth-title,
.authentication-overview .private-title {
    float  : left;
    margin : 0 15px;
}

.authentication-overview input[name="auth_file_text"],
.authentication-overview input[name="private_key_file_text"] {
    margin-top : 5px;
}

/**
 * 시스템 > 시간 동기화
 */
#popupManual .bootstrap-timepicker-widget {
    z-index : 1600;
}

.time-sync-overview .sync-period-box {
    min-height : 466px;
}

/**
 * 시스템 > 업데이트 실행
 */
.update-execution-overview .update-execution-caution {
    color       : darkred;
    font-weight : bold;
}

.update-execution-overview .now-version,
.update-execution-overview .update-server {
    font-weight : bold;
}

.update-execution-overview .progress-box {
    display       : block;
    min-height    : 90px;
    background    : #ffffff;
    width         : 100%;
    box-shadow    : 0 1px 1px rgba(0, 0, 0, 0.1);
    border-radius : 2px;
    margin-bottom : 15px;
    text-align    : center;
}

.update-execution-overview .progress-box-icon {
    border-top-left-radius     : 2px;
    border-top-right-radius    : 0;
    border-bottom-right-radius : 0;
    border-bottom-left-radius  : 2px;
    display                    : block;
    text-align                 : center;
    font-size                  : 45px;
    line-height                : 90px;
    background                 : rgba(0, 0, 0, 0.2);
}

.update-execution-overview .progress-box-text {
    text-align    : center;
    font-size     : 14px;
    white-space   : nowrap;
    overflow      : hidden;
    text-overflow : ellipsis;
}

.update-execution-overview .current-info-title {
    width: 200px;
}

/**

 * 정책 설정 > box
 */
#popupPolicyRule .wp-shadow-erase-box {
    margin-bottom : 15px;
}

.policy-overview {
    animation-name              : fadeInRight;
    animation-duration          : 1s;
    -webkit-animation-fill-mode : both;
    animation-fill-mode         : both;
}

.policy-overview .policy-box .rule-grid-box {
    position : absolute;
    z-index  : 1;
}

.policy-overview .policy-box .rule-grid-box #ruleGridDelete {
    margin-bottom : 11px;
}

/**

 * 정책 설정 > 웹 사이트
 */
.policy-overview .website-box .website-detail-box {
    border     : 1px solid #d2d6de;
    min-height : 545px;
}

.policy-overview .website-box .website-detail {
    overflow-y : auto;
}

.policy-overview .website-box .website-edit-box {
    position  : absolute;
    left      : 50%;
    transform : translateX(-50%);
    bottom    : 20px;
}

.policy-overview .website-box .additional-box,
.policy-overview .website-box .access-box {
    overflow-y : auto;
}

.popup-website-basic-popup #noticePageUse,
.popup-website-basic-popup #caseSensitive {
    margin-bottom : 5px;
}

/**

 * 정책 설정 > 룰 복사
 */
.policy-move-popup textarea[name="copy_rule_list"] {
    text-align : justify;
}

.policy-move-popup .caution-msg {
    font-weight : bold;
    color       : #E74C3C;
}

/**

 * 정책 설정 > 룰 > Website Defacement
 */
.website-defacement button.website-view,
.website-defacement button.website-load,
.website-defacement button[name="comparison_page_view"],
.website-defacement button[name="comparison_page_source"],
.website-defacement button[name="restore_page_source"],
.website-defacement button[name="restore_page_view"] {
    min-width : 100px;
}

/**

 * 정책 설정 > 룰 > Cross Site Request Forgery
 */
#tokenGridAdd {
    position : absolute;
    z-index  : 1;
}

#tokenGridDelete {
    position : absolute;
    z-index  : 1;
    left     : 55px;
}

#tokenWebsiteButton {
    position : absolute;
    z-index  : 1;
    left     : 55px;
}

/**

 * 정책 설정 > 룰 > Privacy Output Filtering
 */
.privacy-output-filtering .custom-mask-box {
    margin : 5px 0 0 25px;
}

/**

 * 정책 설정 > 룰  slider

 */
.irs-from,
.irs-to,
.irs-single {
    font-size  : 20px;
    padding    : 5px 10px;
    background : #428bca;
    margin-top : -15px;
}

.irs-min,
.irs-max {
    font-size  : inherit;
    background : inherit;
}



.irs-bar,

.irs-bar-edge {
    border : 0;
}

/**
 * 정책 설정 > 웹사이트 이동
 */
#gridWebsiteMove {
    position : absolute;
    z-index  : 1;
    left     : 95px;
}

/**

 * 정책 설정 > 룰 > 대응 설정
 */
#popupPolicyRule .
response-error-code {
    min-width : 130px;
    padding   : 0;
}

#popupPolicyRule .response-redirect {
    white-space : nowrap;
    min-width   : 130px;
    padding     : 0;
}

/**

 * 정책 설정 > 룰 > 위험도
 */
#popupPolicyRule .ipblock-weight-box {
    min-height : 216px;
}

#popupPolicyRule .ipblock-weight-top {
    margin-top : 40px;
}

#popupPolicyRule .ipblock-weight-max-width {
    min-width : 70px;
}

#popupPolicyRule input[name="ipblock_weight"] {
    min-width : 65px;
}

/**
 * 정책 설정 > 룰 > Suspicious Access
 */
.validate-cookie-box .detect-exception-condition label {
    width : 170px;
}

/**
 * 정책 설정 > 룰 > File Upload
 */
#popupPolicyRule #useLimitedFileNumber,
#popupPolicyRule #useUploadSizeLimit {
    margin : 0 5px 5px 0;
}

/**
 * 정책 설정 > 룰 > Request Header Filtering Add
 */
#filteringPopupGridAdd {
    position : absolute;
    z-index  : 1;
}

#filteringPopupGridDelete {
    position : absolute;
    z-index  : 1;
    left     : 55px;
}

/**
 * 정책 설정 > 룰 > Privacy File Filtering
 */
#popupPolicyRule .ip-filtering .country-list {
    margin-bottom  : 0;
    padding-bottom : 0;
}

/**
 * 정책 설정 > 룰 > Privacy File Filtering
 */
.privacy-file-filtering .detect-title {
    margin-bottom : 5px;
}

.privacy-file-filtering .matching-number-box {
    margin-left : 0;
}

.privacy-file-filtering .matching-number {
    width     : 40%;
    max-width : 150px;
}

.privacy-file-filtering #userCustomGrid {
    margin-top : 50px;
}

/**
 * 정책 설정 > 룰 > Privacy Input Filtering
 */
.privacy-input-filtering .matching-number-box {
    margin-left : 0;
}

.privacy-input-filtering .matching-number {
    width     : 40%;
    max-width : 150px;
}

.privacy-input-filtering #userCustomGrid {
    margin-top : 50px;
}

/**
 * 정책 설정 > 룰 > Privacy Output Filtering
 */
.privacy-output-filtering .matching-number-box {
    margin-left : 0;
}

.privacy-output-filtering .matching-number {
    width     : 40%;
    max-width : 150px;
}

.privacy-output-filtering #userCustomGrid {
    margin-top : 50px;
}

/**
 * 정책 설정 > 룰 > User Defined Pattern
 */
.user-defined-pattern .url-message-max-length-box,
.user-defined-pattern .body-message-max-length-box,
.user-defined-pattern .header-message-max-length-box {
    margin-left : 0;
}

.user-defined-pattern .url-message-max-length,
.user-defined-pattern .body-message-max-length,
.user-defined-pattern .header-message-max-length {
    width     : 40%;
    max-width : 150px;
}

.user-defined-pattern .popup-grid {
    height : 310px;
}

/**
 * 정책 설정 > 룰 > Custom
 */
.policy-add-popup .rule-name-box {
    margin : 0 0 10px 0;
}

.policy-add-popup .rule-name-title {
    padding-top : 0;
}

.policy-add-popup .pattern-info-box label {
    margin   : 20px 0 0 0;
    position : absolute;
    z-index  : 1;
}

.custom-rule-popup textarea[name="message"] {
    height : 99px;
    resize : none;
}

.custom-rule-popup #popupPatternGridAdd {
    position : absolute;
    z-index  : 1
}

.custom-rule-popup #popupPatternGridDelete {
    position : absolute;
    z-index  : 1;
    left     : 55px;
}

.custom-rule-popup .tooltip {
    z-index : 1503;
}

.custom-rule-popup .tooltip-icon,
.custom-item .product-name .tooltip-icon {
    color : darkorange
}

.custom-rule-popup .tooltip .tooltip-inner {
    font-weight : 500;
    padding     : 10px;
}

.custom-rule-popup .tooltip .tooltip-arrow,
.custom-rule-popup .tooltip .tooltip-inner {
    margin-bottom : 10px;
}

/**
 * 정책 설정 > 룰 > table Group
 */
#policyDataGridContainer .dx-datagrid-rowsview tbody tr:first-child td {
    display : none;
}

#policyDataGridContainer .dx-datagrid-rowsview tbody tr.dx-group-row td.custom {
    color : #0049db;
}

#policyDataGridContainer .dx-datagrid-rowsview tbody tr.dx-group-row td.important {
    color : #ff7f00;
}

/**

 * 로그 > 탐지 로그 > 추가 조건

 */
#detectOverview .divider {
    margin : 0;
}

/**

 * 로그 > 탐지 로그 > 날짜

 */
.ranges li {
    color : #000000;
}

.ranges li:hover {
    background-color : #D9D9D9;
    border           : 1px solid #d9e0e7;
    color            : #000000;
}

.ranges li.active {
    background-color : #D9D9D9;
    border           : 0;
    color            : #000000;
}

.custom-rule .fa-edit {
    float   : right;
    margin  : 0;
    padding : 3px 0;
}

.custom-rule.dropdown-menu > li > a > .fa {
    margin : 0;
}

.log-filter-box .box-line {
    border : 1px solid #d2d6de;
}

/**
 * 보안 설정 > 보호 대상 서버
 */
#lbGridDelete {
    position : absolute;
    z-index  : 1;
    left     : 55px;
}

/**
 * 로그 > 탐지 로그
 */
#detectOverview button.caret-right {
    padding : 0 10px;
}

#detectOverview button.caret-left {
    padding : 0 10px;
}

#detectOverview .filter-box button {
    padding       : 4px 8px;
    margin-bottom : 5px;
}

#detectOverview #dateRange {
    width         : 100%;
    overflow      : hidden;
    text-overflow : ellipsis;
    white-space   : nowrap;
}

#detectOverview button.search {
    width  : 100%;
    height : 40px;
}

#detectOverview button.addition-conditional {
    padding       : 5px 10px;
    margin-bottom : 5px;
    border-radius : 3px;
}

#detectOverview .log-filter-box {
    max-height : 550px;
    overflow-x : auto;
    overflow-y : auto;
}

#detectOverview .log-filter-box .box-title {
    padding : 0;
    float   : left;
}

#detectOverview .log-filter-box .box-tools {
    margin : 0 0 -5px 0;
}

#detectOverview .log-filter .box-tools {
    top : 0;
}

#detectOverview .log-filter .box-body {
    padding : 5px 0;
}

#detectOverview .page-box .log-menu-box {
    float : left;
}

#detectOverview .page-box .log-menu-box .log-menu-button {
    padding       : 3px 12px;
    border-radius : 3px;
}

#detectOverview .page-box button[name="backward"] {
    padding      : 3px 12px;
    float        : left;
    margin-right : 5px;
}

#detectOverview .page-box button[name="forward"] {
    padding      : 3px 12px;
    float        : left;
    margin-right : 10px;
}

#detectOverview .page-box button[name="timer"],
#detectOverview .page-box button[name="add_count"],
#detectOverview .page-box button[name="page_move"] {
    float   : left;
    padding : 3px 12px;
}

#detectOverview .page-box input[name="page_number"] {
    padding      : 2.6px 12px;
    height       : auto;
    width        : 100px;
    float        : left;
    margin-right : 5px;
}

#detectOverview .page-box .max-page-number {
    padding            : 3px 12px;
    height             : auto;
    background-color   : #eeeeee;
    margin-right       : 5px;
    float              : left;
    display            : block;
    border             : 1px solid #cccccc;
    border-radius      : 4px;
    -webkit-box-shadow : inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition : border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition      : border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition         : border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

#detectOverview .page-box .total-count {
    margin : 5px 5px 0 0;
    float  : left;
}

/**
 * 로그 > 탐지 로그 > 추가 조건 제목
 */
#detectOverview .log-filter-box .box-header {
    padding : 7px;
}

#detectOverview .log-filter-box .box-title {
    display   : block;
    font-size : inherit;
}

#detectOverview .dx-datagrid-rowsview {
    border-top : 0;
}

.dx-datagrid-filter-row .dx-editor-cell .dx-editor-with-menu .dx-menu {
    display : block;
}

/**
 * 로그 > 탐지 로그 > Table
 */
#detectOverview .dx-datagrid .dx-row > td {
    padding : 0 7px 0 7px;
}

#detectOverview .dx-datagrid-headers .dx-header-row > td {
    padding : 7px;
}

#detectOverview .dx-datagrid-headers .dx-datagrid-filter-row > td {
    padding : 0;
}

#detectOverview .dx-editor-cell .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon {
    font-size : 10px;
}

#detectOverview .dx-datagrid-checkbox-size .dx-checkbox-icon {
    height : 14px;
    width  : 14px;
}

#detectOverview .dx-datagrid-checkbox-size.dx-checkbox-indeterminate .dx-checkbox-icon:before {
    width  : 6px;
    height : 6px;
    left   : 3px;
    top    : 3px;
}

/**
 * 로그 > 탐지 로그 > 드롭다운
 */
#detectOverview .dropdown-menu > li > a {
    color : #444444;
}

/**
 * 로그 > 탐지 로그 > 로그 상세 보기 Header
 */
#requestGridContainer .dx-datagrid-headers tbody tr td,
#responseGridContainer .dx-datagrid-headers tbody tr td {
    border-top : 2px solid #dddddd;
}

/**
 * 로그 > 탐지 로그 td max-width 설정
 */
#detectGridContainer {
    margin-top : 5px;
}

#detectGridContainer table > tbody > tr > td {
    max-width : 250px;
}

/**
 * 로그 > 탐지 로그 > 대응 상태 이미지
 */
#detectGridContainer .action-img {
    vertical-align : text-top;
}

/**
 * 로그 > 탐지 로그 > 실시간
 */
#detectOverview button.start-timer,
#detectOverview button.stop-timer {
    padding      : 0 12px;
    margin-top   : -4px;
    float        : left;
    margin-right : 10px;
}

#detectOverview button.start-timer span,
#detectOverview button.stop-timer span {
    vertical-align : sub;
    font-size      : 23px;
    margin-left    : 3px;
    font-weight    : 400;
}

/**
 * 로그 > 탐지 로그 > 내보내기
 */
#detectOverview .log-export {
    margin-top : -5px;
}

/**
 * 로그 > 탐지 로그 > 상세보기
 */
#detectDetailOverview .data-stream pre {
    height      : 350px;
    margin      : 1px;
    white-space : initial;
}

#detectDetailOverview .detail-footer {
    margin-top : -15px;
}

#detectDetailOverview .position {
    color : #ff0000;
}

/**
 * 로그 > 감사 로그
 */
#auditOverview button.caret-left {
    padding : 0 10px;
}

#auditOverview button.caret-right {
    padding : 0 10px;
}

#auditOverview #dateRange {
    width         : 100%;
    overflow      : hidden;
    text-overflow : ellipsis;
    white-space   : nowrap;
}

#auditOverview button.search {
    width  : 100%;
    height : 40px;
}

#auditOverview .page-box button[name="backward"] {
    padding      : 3px 12px;
    float        : left;
    margin-right : 5px;
}

#auditOverview .page-box button[name="forward"] {
    padding      : 3px 12px;
    float        : left;
    margin-right : 10px;
}

#auditOverview .page-box button[name="timer"],
#auditOverview .page-box button[name="add_count"],
#auditOverview .page-box button[name="page_move"] {
    float   : left;
    padding : 3px 12px;
}

#auditOverview .page-box input[name="page_number"] {
    padding      : 3px 12px;
    height       : auto;
    width        : 100px;
    float        : left;
    margin-right : 5px;
}

#auditOverview .page-box .max-page-number {
    padding            : 3px 12px;
    height             : auto;
    background-color   : #eeeeee;
    margin-right       : 5px;
    float              : left;
    display            : block;
    border             : 1px solid #cccccc;
    border-radius      : 4px;
    -webkit-box-shadow : inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition : border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition      : border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition         : border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

#auditOverview .page-box .total-count {
    margin : 5px 5px 0 0;
    float  : left;
}

#auditOverview table > tbody > tr > td {
    max-width : 250px;
}

#auditOverview .audit-export-loading {
    position : absolute;
    top      : 40%;
    left     : 50%;
    z-index  : 10000;
}

#auditOverview .log-export button {
    margin-top : -5px;
}

/**
 * 로그 > 감사 로그 > 팝업창
 */
.audit-detail-overview textarea[name="info"] {
    word-break : break-all;
}

#auditDetailOverview .dx-datagrid-content .dx-datagrid-table .dx-row > td,
.dx-datagrid-content .dx-datagrid-table .dx-row > tr > td {
    white-space : initial;
}

.audit-detail-overview .properties-box {
    height : 195px;
}

.audit-detail-overview .description-box {
    float : right
}

.audit-detail-overview .memo-box {
    float : none;
}

/**
 * 로그 > 웹사이트로그
 */
#observationClientGridContainer {
    margin-top : 35px;
}

#observationOverview button.caret-left {
    padding : 0 10px;
}

#observationOverview button.caret-right {
    padding : 0 10px;
}

#observationOverview #dateRange {
    width         : 100%;
    overflow      : hidden;
    text-overflow : ellipsis;
    white-space   : nowrap;
}

#observationOverview button.search,
#observationOverview button.reset {
    width  : 100%;
    height : 40px;
}

#observationOverview .page-box button[name="backward"] {
    padding      : 3px 12px;
    float        : left;
    margin-right : 5px;
}

#observationOverview .page-box button[name="forward"] {
    padding      : 3px 12px;
    float        : left;
    margin-right : 10px;
}

#observationOverview .page-box button[name="timer"],
#observationOverview .page-box button[name="add_count"],
#observationOverview .page-box button[name="page_move"] {
    float   : left;
    padding : 3px 12px;
}

#observationOverview .page-box input[name="page_number"] {
    padding      : 3px 12px;
    height       : auto;
    width        : 100px;
    float        : left;
    margin-right : 5px;
}

#observationOverview .page-box .max-page-number {
    padding            : 3px 12px;
    height             : auto;
    background-color   : #eeeeee;
    margin-right       : 5px;
    float              : left;
    display            : block;
    border             : 1px solid #cccccc;
    border-radius      : 4px;
    -webkit-box-shadow : inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition : border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition      : border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition         : border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

#observationOverview .page-box .total-count {
    margin : 5px 5px 0 0;
    float  : left;
}

#observationOverview table > tbody > tr > td {
    max-width : 250px;
}

/**
 * 로그 > 내보내기 목록
 */
#exportListOverview #gridDownload {
    position : absolute;
    z-index  : 1;
}

#exportListOverview #gridDelete {
    position : absolute;
    z-index  : 1;
    left     : 55px;
}

#exportListOverview #gridRefresh {
    position : absolute;
    z-index  : 1;
    left     : 105px;
}

/**
 * 통계 분석 > 그래프
 */
#graphOverview button.caret-left {
    padding : 0 10px;
}

#graphOverview button.caret-right {
    padding : 0 10px;
}

#graphOverview #dateRange {
    width         : 100%;
    overflow      : hidden;
    text-overflow : ellipsis;
    white-space   : nowrap;
}

#graphOverview button.search {
    width  : 100%;
    height : 40px;
}

#graphOverview .page-box {
    position : absolute;
    z-index  : 10;
    top      : 22px;
    left     : 10px
}

#graphOverview button.start-timer,
#graphOverview button.stop-timer {
    padding    : 0 12px;
    margin-top : -4px;
    float      : left;
}

#graphOverview button.start-timer span,
#graphOverview button.stop-timer span {
    vertical-align : sub;
    font-size      : 23px;
    margin-left    : 3px;
    font-weight    : 400;
}

#graphOverview #notGraph {
    font-size : 2em;
    position  : absolute;
    top       : 200px;
    left      : 50%;
    transform : translate(-50%, -50%)
}

.graph-tooltip-header {
    font-size      : 15px;
    font-weight    : bold;
    margin-bottom  : 5px;
    padding-bottom : 5px;
    border-bottom  : 1px solid #c5c5c5;
}

.graph-tooltip-body .graph-series-name {
    display     : inline-block;
    line-height : 1.5;
    min-width   : 70px;
    font-weight : normal;
}

.graph-tooltip-body .graph-value-text {
    display     : inline-block;
    line-height : 1.5;
    font-size   : 13px;
    font-weight : normal;
}

/**
 * 통계 분석 > 탐지 검토
 */
.detect-examination-overview .divider {
    margin : 0;
}

.detect-examination-overview button.caret-right {
    padding : 0 10px;
}

.detect-examination-overview button.caret-left {
    padding : 0 10px;
}

.detect-examination-overview .filter-box button {
    padding       : 4px 8px;
    margin-bottom : 5px;
}

.detect-examination-overview #dateRange {
    width         : 100%;
    overflow      : hidden;
    text-overflow : ellipsis;
    white-space   : nowrap;
}

.detect-examination-overview button.search {
    width  : 100%;
    height : 40px;
}

.detect-examination-overview button.addition-conditional {
    padding       : 5px 10px;
    margin-bottom : 5px;
    border-radius : 3px;
}

.detect-examination-overview .log-filter-box {
    max-height : 200px;
    overflow-x : auto;
    overflow-y : auto;
}

.detect-examination-overview .log-filter .box-tools {
    top : 0;
}

.detect-examination-overview .log-filter .box-body {
    padding : 5px 0;
}

.detect-examination-overview .page-box .log-menu-box .log-menu-button {
    padding       : 3px 12px;
    margin-bottom : 5px;
    border-radius : 3px;
}

.detect-examination-overview .page-box button[name="backward"] {
    padding      : 3px 12px;
    float        : left;
    margin-right : 5px;
}

.detect-examination-overview .page-box button[name="forward"] {
    padding      : 3px 12px;
    float        : left;
    margin-right : 10px;
}

.detect-examination-overview .page-box button[name="timer"],
.detect-examination-overview .page-box button[name="add_count"],
.detect-examination-overview .page-box button[name="page_move"] {
    float   : left;
    padding : 3px 12px;
}

.detect-examination-overview .page-box input[name="page_number"] {
    padding      : 3px 12px;
    height       : auto;
    width        : 100px;
    float        : left;
    margin-right : 5px;
}

.detect-examination-overview .page-box .max-page-number {
    padding            : 3px 12px;
    height             : auto;
    background-color   : #eeeeee;
    margin-right       : 5px;
    float              : left;
    display            : block;
    border             : 1px solid #cccccc;
    border-radius      : 4px;
    -webkit-box-shadow : inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition : border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition      : border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition         : border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.detect-examination-overview .page-box .total-count {
    margin : 5px 5px 0 0;
    float  : left;
}

/**
 * 통계 분석 > 탐지 검토 > 추가 조건 제목
 */
.detect-examination-overview .log-filter-box .box-header {
    padding : 7px;
}

.detect-examination-overview .log-filter-box .box-title {
    display   : block;
    font-size : inherit;
}

.detect-examination-overview .dx-datagrid-rowsview {
    border-top : 0;
}

/**
 * 통계 분석 > 탐지 검토 > Table
 */
.detect-examination-overview .dx-datagrid .dx-row > td {
    padding : 0 7px 0 7px;
}

.detect-examination-overview .dx-datagrid-headers .dx-header-row > td {
    padding : 7px;
}

.detect-examination-overview .dx-datagrid-headers .dx-datagrid-filter-row > td {
    padding : 0;
}

.detect-examination-overview .dx-editor-cell .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon {
    font-size : 10px;
}

.detect-examination-overview .dx-datagrid-checkbox-size .dx-checkbox-icon {
    height : 14px;
    width  : 14px;
}

.detect-examination-overview .dx-datagrid-checkbox-size.dx-checkbox-indeterminate .dx-checkbox-icon:before {
    width  : 6px;
    height : 6px;
    left   : 3px;
    top    : 3px;
}

/**
 * 통계 분석 > 탐지 검토 > 드롭 다운
 */
.detect-examination-overview .dropdown-menu > li > a {
    color : #444444;
}

/**
 * 환경 설정 > 백업 목록
 */
#backupListOverview #gridUpload label:hover {
    -webkit-box-shadow : 0 1px 3px transparent;
    -moz-box-shadow    : 0 1px 3px transparent;
    box-shadow         : 0 1px 3px transparent;
    background-color   : #e6e6e6;
    border-color       : #bebebe;
}

#backupListOverview #gridUpload label:active {
    -webkit-box-shadow : 0 1px 3px transparent;
    -moz-box-shadow    : 0 1px 3px transparent;
    box-shadow         : 0 1px 3px transparent;
    background-color   : #d4d4d4;
    border-color       : #9d9d9d;
    color              : #333333;
}

#backupListOverview #gridUpload label:focus {
    -webkit-box-shadow : 0 1px 3px transparent;
    -moz-box-shadow    : 0 1px 3px transparent;
    box-shadow         : 0 1px 3px transparent;
    background-color   : #e6e6e6;
    border-color       : #9d9d9d;
}

#backupListOverview #gridUpload {
    position : absolute;
    z-index  : 1;
}

#backupListOverview #gridUpload label {
    padding : 10px 9px;
}

#backupListOverview #gridDownload {
    position : absolute;
    z-index  : 1;
    left     : 55px;
}

#backupListOverview #gridDelete {
    position : absolute;
    z-index  : 1;
    left     : 105px;
}

#backupListOverview #gridRefresh {
    position : absolute;
    z-index  : 1;
    left     : 145px;
}

/**
 * 환경 설정 > DB > 백업 설정
 */
.backup-set-overview .confdb-box {
    min-height : 400px;
}

.backup-set-overview .ftp-box {
    min-height : 635px;
}

/**
 * 환경 설정 > 운영 > 통합 알림 설정
 */
.notification-overview .dx-datagrid-content .dx-datagrid-table .dx-row > td {
    vertical-align : inherit;
}

#notificationGridContainer .notification-critical {
    color : #f71752;
}

#notificationGridContainer .notification-condition {
    color : #005DAA;
}

#notificationGridContainer .notification-warning,
#notificationGridContainer .notification-state {
    color : #f39c12;
}

#notificationGridContainer .notification-critical.off,
#notificationGridContainer .notification-condition.off,
#notificationGridContainer .notification-warning.off,
#notificationGridContainer .notification-state.off {
    color : #999999;
}

/*.notification-popup .use-notification-box label {*/
/*vertical-align : text-top;*/
/*}*/

.notification-popup .warning-critical span.warning {
    color : #fdccae;
}

.notification-popup .warning-critical span.critical {
    color : #ff7c7c;
}

.notification-popup .critical-warning span.critical {
    color : #ff7c7c;
}

.notification-popup .critical-warning span.warning {
    color : #fdccae;
}

.notification-popup .condition span {
    color : #fdccae;
}

.notification-popup .irs-to,
.notification-popup .irs-from,
.notification-popup .irs-bar-edge,
.notification-popup .irs-single {
    font-size  : 15px;
    padding    : 5px;
    background : white;
    color      : #fdccae;
    border     : 1px solid #d2d6de;
    margin-top : -9px;
    z-index    : 1;
}

.notification-popup .irs-to {
    color : #ff7c7c;
}

.notification-popup .irs-bar {
    background : #fdccae;
}

.notification-popup .irs-slider.from {
    border     : 1px solid azure;
    background : #fdccae !important
}

.notification-popup .irs-slider.to {
    border     : 1px solid azure;
    background : #ff7c7c !important;
}

.notification-popup .critical-warning .irs-from {
    color : #ff7c7c;
}

.notification-popup .critical-warning .irs-to {
    color : #fdccae;
}

.notification-popup .critical-warning .irs-slider.from {
    background : #ff7c7c !important;
}

.notification-popup .critical-warning .irs-bar,
.notification-popup .critical-warning .irs-slider.to {
    background : #fdccae !important;
}

.notification-popup .warning-alarm-box .warning-alarm-popup,
.notification-popup .critical-alarm-box .warning-alarm-popup {
    margin-bottom : 5px;
    margin-top    : 5px;
}

.notification-popup .interval-box {
    margin-left : -5px;
}

.notification-popup .irs-bar-edge {
    font-size  : 0;
    padding    : 0;
    margin-top : 0;
    background : linear-gradient(to top, rgba(66, 139, 202, 1) 0%, rgba(127, 195, 232, 1) 100%);;
    border     : none;
}

.notification-popup .irs-bar-edge.condition,
.notification-popup .irs-bar.condition {
    background : none;
}

.duration-box .duration-button {
    margin-top : 24px;
    padding    : 0;
}

/**
 * 탐지 설정 > Parameter Encryption
 */
#popupParameterEncryption .analyze {
    width      : 30%;
    height     : 40px;
    padding    : 0;
    float      : right;
    margin-top : 5px;
}

#popupParameterEncryption .preview {
    height : 200px;
    border : 1px solid #cccccc;
}

@media (min-width : 768px) {
    #popupParameterEncryption .trigger-info {
        margin-right : 10px;
    }

    #popupParameterEncryption .analyze {
        width      : 100%;
        height     : 72px;
        padding    : 0;
        margin-top : 0;
    }
}

/**
 * 환경 설정 > 업데이트 설정
 */
#updateSettingOverview select[name="update_server_1"],
#updateSettingOverview select[name="update_server_2"] {
    margin-bottom : 5px;
}

/**
 * 리포트 > 리포트 생성
 */
#reportRegistOverview .report-detail .wp-default-box,
#reportRegistOverview .report-option .wp-default-box {
    min-height : 320px;
    min-width  : 250px;
}

#reportRegistOverview .report-detail .report-range-detail .row {
    display : none;
}

#reportRegistOverview .auto-content {
    min-height : 100px;
    border     : 1px solid #d2d6de;
    padding    : 5px;
    display    : none;
}

#popupReportAutoConfig .transmission-base-date select {
    display : none;
}

/**
 * 보고서 > 리스트
 */
#reportOverview #gridDownload {
    position : absolute;
    z-index  : 1;
}

#reportOverview #gridDelete {
    position : absolute;
    z-index  : 1;
    left     : 55px;
}

#reportOverview #gridRefresh {
    position : absolute;
    z-index  : 1;
    left     : 105px;
}

/**
 * 보고서 > 리스트 > 상세
 */
#popupReportDetail .detail-box {
    height     : 350px;
    overflow   : hidden;
    overflow-y : scroll;
}

#popupReportDetail .detail-box .label-title {
    padding : 5px 0 0 0;
}

/**
 * 탐지 설정 > 기타 > S/W 바이패스
 */

.sw-bypass-overview .content .description li {
    list-style   : none;
    padding-left : 0px;
}

.sw-bypass-overview .content .packet-dump-grid {
    position : relative;
    top      : 20px;
}

#delimiterOverview .delimiter .wp-shadow-erase-box .col-sm-12 {
    margin-left : 15px;
    width       : 98%;
}

#delimiterOverview .delimiter .col-sm-12 .id-number-label {
    margin-top : 20px;
}

#popupDelimiter .format-button {
    padding-bottom : 3px;
}

#popupDelimiter .box .box-body {
    padding : 15px 15px 10px 15px;
}

#popupSetNotice .set-notice-box .title {
    font-size : large;
    color     : #cc4400;
}

#makeReportOverview .filebox input[type="file"] {
    position : absolute;
    width    : 1px;
    height   : 1px;
    padding  : 0;
    margin   : -1px;
    overflow : hidden;
    clip     : rect(0, 0, 0, 0);
    border   : 0;
}

#makeReportOverview .filebox .upload-name {
    display             : inline-block;
    padding             : .5em .75em;
    font-size           : inherit;
    font-family         : inherit;
    line-height         : normal;
    vertical-align      : middle;
    background-color    : #f5f5f5;
    border              : 1px solid #ebebeb;
    border-bottom-color : #e2e2e2;
    border-radius       : .25em;
    -webkit-appearance  : none;
    -moz-appearance     : none;
    appearance          : none;
    margin-right        : 1px;
}

/*
*============================
*  WAPPLES ControlCenter
*============================
*/
.wcc-nav-top .wcc-nav-host {
    float  : left;
    margin : 15px 0 0 5px;
    color  : #008D4C;
}

.wcc-left-toggle-box {
    position : fixed;
    left     : 205px;
    top      : 50%;
    z-index  : 1500;
}

.wcc-sidebar-menu .wapples-box a.depth-1 {

}

.wcc-sidebar-menu .ellipsis {
    width         : 100%;
    overflow      : hidden;
    white-space   : nowrap;
    text-overflow : ellipsis;
}