/* reset.css */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    /*font: inherit;*/
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
    margin-bottom: 0px !important;
    table-layout: fixed;
}

.btn-xs {
    padding: 0.15rem .5rem !important;
    font-size: 13px !important;
}
.btn-soft-primary {
    background: #CFE4FC !important;
    border-color: #CFE4FC !important;
    color: #1E52A0 !important;
    font-weight: bold !important;
}
.btn-soft-primary:hover {
    background: #88B4E7 !important;
}
.btn-soft-orange {
    background: #FFE0C9 !important;
    border-color: #FFE0C9 !important;
    color: #B54D00 !important;
    font-weight: bold !important;
}

.btn-soft-orange:hover {
    background: #EFB386 !important;
}

/*@font-face {
    font-family: MalgunGothic;
    src: url(/fonts/MalgunGothic.eot);
}*/
/* ³ª´®°íµñ */
@font-face {
    font-family: "Nanum Gothic";
    font-style: normal;
    font-weight: 400;
    src: url(/fonts/NanumGothic-Regular.eot);
    src: url(/fonts/NanumGothic-Regular.eot?#iefix) format("embedded-opentype"), url(/fonts/NanumGothic-Regular.woff2) format("woff2"), url(/fonts/NanumGothic-Regular.woff) format("woff"), url(/fonts/NanumGothic-Regular.ttf) format("truetype");
}

@font-face {
    font-family: "Nanum Gothic";
    font-style: normal;
    font-weight: 700;
    src: url(/fonts/NanumGothic-Bold.eot);
    src: url(/fonts/NanumGothic-Bold.eot?#iefix) format("embedded-opentype"), url(/fonts/NanumGothic-Bold.woff2) format("woff2"), url(/fonts/NanumGothic-Bold.woff) format("woff"), url(/fonts/NanumGothic-Bold.ttf) format("truetype");
}

@font-face {
    font-family: "Nanum Gothic";
    font-style: normal;
    font-weight: 800;
    src: url(/fonts/NanumGothic-ExtraBold.eot);
    src: url(/fonts/NanumGothic-ExtraBold.eot?#iefix) format("embedded-opentype"), url(/fonts/NanumGothic-ExtraBold.woff2) format("woff2"), url(/fonts/NanumGothic-ExtraBold.woff) format("woff"), url(/fonts/NanumGothic-ExtraBold.ttf) format("truetype");
}
* {
    /*font-family: 'MalgunGothic';*/
    /*font-family: -apple-system, BlinkMacSystemFont, "Malgun Gothic", "¸¼Àº °íµñ", helvetica, "Apple SD Gothic Neo", sans-serif;*/
    box-sizing: border-box;
}

.text-primary {
    color: #0088c7 !important;
}
.text-darkGray {
    color: #4d4d4d !important;
}
.text-navy {
    color: #00557D !important;
}
.fs---1 {
    font-size: 14px !important;
}

/* common */
body {
    width: 100%;
    height: 100%;
    background: #f4f4f4;
    line-height: 1;
    font-family: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}

.main-container {
    padding: 5px 20px;
    position: relative;
}

.mainContsWrapper {
    display: flex;
    height: calc(100vh - 60px);
    min-height: calc(100vh - 52px);
    margin-top: 1px;
    position: relative;
}

.btn {
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.form-control.form-control-sm,
.k-dropdown-wrap {
    height: 24px;
    padding: 0 8px;
    font-size: 12px;
    font-weight: 700;
    border: solid 1px #d3dae6;
    border-radius: 4px;
    background-color: #fff;
    color: #000;
    /*background-image: none !important;*/
    background: transparent !important;
    border-color: #d3dae6 !important;
}
.form-select.form-select-sm {
    height: 24px;
    padding: 0 8px;
    font-size: 12px;
    font-weight: 700;
    border: solid 1px #d3dae6;
    border-radius: 4px;
    background-color: #fff;
    color: #000;
    border-color: #d3dae6 !important;
}
.form-control.form-control-sm:focus,
.form-select.form-select-sm:focus,
.k-dropdown-wrap:focus,
.k-dropdown-wrap.k-state-focused {
    border-color: #0088c7 !important;
    box-shadow: none;
    outline: none !important;
}
.btn:focus {
    box-shadow: none;
    border-color: transparent;
}

.btn.btn_icon:active {
    box-shadow: none;
    border-color: transparent;
    padding: 0px;
}

.btn.active {
    border-color: transparent;
}

.form-check-inline {
    display: flex;
    align-items: center;
}

.form-check-inline .form-check-input {
    margin-right: 10px;
}

.searchBox {
    position: relative;
}

.search_overlay {
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 3;
    height: 100vh;
    transition: display 0.2s;
}

.search_overlay .icon_popupClose {
    position: absolute;
    top: 10px;
    right: 10px;
}

.search_overlay .form-check-label {
    color: #ffffff;
}

.search_overlay .searchConts {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.search_overlay .searchText {
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    margin-bottom: 20px;
}

.search_overlay .searchBox {
    width: 100%;
}

.search_overlay .btn_search {
    transform: translateY(36%) !important;
}

.layerPopup.show {
    z-index: 9 !important;
}
.layerPopup .card {
    box-shadow: 0px 3px 23px 2px rgba(0, 0, 0, 0.25);
}

.layerPopup .card-header p {
    font-size: 16px;
    font-weight: bold;
    color: #000;
}

.searchRange-popup,
.history-popup,
.multiline-popup,
.document-popup {
    display: none;
    visibility: hidden;
}

.searchRange-popup.show,
.history-popup.show,
.multiline-popup.show,
.document-popup.show {
    display: block;
    visibility: visible;
    position: absolute;
    z-index: 3;
}

.searchRange-popup.show {
    width: 80%;
    height: 70vh;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.history-popup.show {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    height: 80vh;
}

.inner-card {
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.12);
}

.history-popup .inner-card:not(:first-child) {
    margin-top: 10px;
}

.history-popup .yearText {
    font-size: 18px;
    font-weight: bold;
    color: #004B6E;
}

.history-popup .chagneConts-container {
    padding: 15px;
}

.history-popup .docNum {
    display: inline-block;
    font-size: 14px;
    font-weight: bold;
    color: #000;
    border-bottom: 1px solid #000;
}

.history-popup .changeText {
    font-size: 14px;
    margin-top: 10px;
}

.multiline-popup.show {
    width: 40%;
    height: 30vh;
    top: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.history-popup .historyConts {
    width: 100%;
    height: calc(100% - 42px);
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    margin-top: 10px;
    overflow: auto;
    padding: 10px 15px;
}

.history-popup .changedHighlight {
    font-weight: bold;
    color: #0088c7;
}

.history-popup .card-body {
    height: calc(100% - 34px);
    overflow: auto;
}

.document-popup {
    width: 55%;
    height: 90vh;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.list-container {
    width: 100%;
    height: 100%;
    border: 1px solid #C6C6C6;
    border-radius: 6px;
    padding: 10px 15px;
}

.searchRange-popup .listBox {
    width: 100%;
    height: calc(100% - 30px);
    display: flex;
    justify-content: space-between;
}

.searchRange-popup .list-container {
    width: 46%;
    overflow: auto;
}

.searchRange-popup .buttonWrapper {
    width: 8%;
}

.btn-outline-primary:focus {
    border: 1px solid #0d6efd;
}

.btn-outline-primary.active {
    background: #0d6efd;
    border: 1px solid #0d6efd;
    color: #ffffff;
    padding: 4px 8px;
}

.btn-primary {
    background: #0088c7 !important;
    border-color: #0088c7 !important;
}
.btn-outline-navy {
    background: #fff;
    border-color: #00557D !important;
    color: #00557D;
}
.btn-outline-navy:hover {
    background: #00557D;
    color: #fff;
}
.form-check {
    display: flex;
    align-items: center;
}

.form-check .form-check-input {
    margin-right: 10px;
}

.text-red {
    color: #c00000 !important;
}

.text-orange {
    color: #FF6B00 !important;
}

/* kendo */
div[data-name="managementMenu"] .k-grid-content {
    height: calc(100% - 37px) !important;
}
.treeview-container {
    height: calc(100% - 85px);
    padding: 4px 10px;
}
.k-grid .documentImg {
    margin-left: 10px;
    width: 50px;
}
.k-grid tr.k-state-selected td:not(.k-command-cell) a {
    color: #fff;
    text-decoration-color: #fff;
}
.k-grid td.k-command-cell {
    text-align: center;
}

/* ±×¸®µå sm - grid div¿¡ gird-sm Ŭ·¡½º¸í ³Ö¾îÁÖ±â */
.grid-sm.k-grid td {
    font-size: 14px;
    padding: 3px 8px;
} 
.grid-sm.k-grid th {
    font-size: 15px;
} 
.grid-sm.k-grid .k-command-cell .k-button {
    padding: 3px 10px !important;
}

/* breadcrumb */
.breadcrumb .breadcrumb-item, .breadcrumb .breadcrumb-item a {
    font-size: 14px;
    color: #444;
    text-decoration: none;
    /* padding-left: 3px; */
} 
.breadcrumb .breadcrumb-item.active {
    font-size: 15px;
    font-weight: bold;
} 
.breadcrumb-item + .breadcrumb-item::before {
    float: left;
    padding-right: 3px;
    color: var(--bs-breadcrumb-divider-color);
    content: url(/images/icon_breadcrumb-chevron.svg);
}

/* °³Á¤ÀÌ·Â ¾ÆÀÌÄÜ */
.icon_revision {
    display: inline-block;
    width: 22px;
    height: 22px;
    background-image: url(/images/icon_revision.svg);
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 4px;
}
/* Àӽà ¾ÆÀÌÄÜ */
.icon_hamburgerIn {
    display: inline-block;
    width: 22px;
    height: 22px;
    background-image: url(/images/icon_hamburgerIn.svg);
    background-position: center;
    background-repeat: no-repeat;
} 
.icon_hamburgerOut {
    display: inline-block;
    width: 22px;
    height: 22px;
    background-image: url(/images/icon_hamburgerOut.svg);
    background-position: center;
    background-repeat: no-repeat;
} 
.icon_zoomReset {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/images/icon_zoomReset.svg);
    background-position: center;
    background-repeat: no-repeat;
} 
.icon_circlePerson {
    display: inline-block;
    width: 25px;
    height: 25px;
    background-image: url(/images/icon_circlePerson.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_home {
    display: inline-block;
    width: 27px;
    height: 27px;
    background-image: url(/images/icon_home.svg);
    background-position: center;
    background-repeat: no-repeat;
} 
.icon_rule {
    display: inline-block;
    width: 27px;
    height: 27px;
    background-image: url(/images/icon_rule.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_search {
    display: inline-block;
    width: 27px;
    height: 27px;
    background-image: url(/images/icon_search.svg);
    background-position: center;
    background-repeat: no-repeat;
} 
.icon_search-blue {
    display: inline-block;
    width: 15px;
    height: 15px;
    background-image: url(/images/icon_search-blue.svg);
    background-position: center;
    background-repeat: no-repeat;
} 
.icon_topSearch {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/images/icon_topSearch.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_bookmark {
    display: inline-block;
    width: 27px;
    height: 27px;
    background-image: url(/images/icon_bookmark.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_bookmark-main {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/images/icon_bookmark-main.svg);
    background-position: center;
    background-repeat: no-repeat;
} 
.icon_globe {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/images/icon_globe.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_note {
    display: inline-block;
    width: 18px;
    height: 19px;
    background-image: url(/images/icon_note.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_memo {
    display: inline-block;
    width: 25px;
    height: 25px;
    background-image: url(/images/icon_memo.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_memo-white {
    display: inline-block;
    width: 23px;
    height: 23px;
    background-image: url(/images/icon_memo-white.svg);
    background-position: center;
    background-repeat: no-repeat;
} 
.icon_management {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/images/icon_management.svg);
    background-position: center;
    background-repeat: no-repeat;
} 
.icon_bookmark-line {
    display: inline-block;
    width: 15px;
    height: 14px;
    background-image: url(/images/icon_bookmark-line.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_bookmark-fill {
    display: inline-block;
    width: 15px;
    height: 15px;
    background-image: url(/images/icon_bookmark-fill.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_share {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/images/icon_share.svg);
    background-position: center;
    background-repeat: no-repeat;
} 
.icon_download {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/images/icon_download.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_chevron-main {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url(/images/icon_chevron-main.svg);
    background-position: center;
    background-repeat: no-repeat;
} 
.icon_chevron-secondary {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url(/images/icon_chevron-secondary.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_add-right {
    display: inline-block;
    width: 23px;
    height: 23px;
    background-image: url(/images/icon_add-right.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_remove-left {
    display: inline-block;
    width: 23px;
    height: 23px;
    background-image: url(/images/icon_remove-left.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_chevron-upDown {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/images/icon_chevron-upDown.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_popupClose {
    display: inline-block;
    width: 25px;
    height: 25px;
    background-image: url(/images/icon_popupClose.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_menuClose {
    display: inline-block;
    width: 15px;
    height: 15px;
    background-image: url(/images/icon_menuClose.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_searchRange {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/images/icon_searchRange.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_clock-main {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/images/icon_clock-main.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_bell-main {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/images/icon_bell-main.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_history {
    display: inline-block;
    width: 25px;
    height: 25px;
    background-image: url(/images/icon_history.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_multiline {
    display: inline-block;
    width: 15px;
    height: 15px;
    background-image: url(/images/icon_multiline.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_float {
    display: inline-block;
    width: 25px;
    height: 25px;
    background-image: url(/images/icon_float.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_ko {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url(/images/icon_ko.svg);
    background-position: center;
    background-repeat: no-repeat;
}
.icon_en {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url(/images/icon_en.svg);
    background-position: center;
    background-repeat: no-repeat;
}

/* ½ºÅ©·Ñ¹Ù */
::-webkit-scrollbar {
    width: 5px !important;
    height: 5px !important;
    padding-right: 4px !important;
}
::-webkit-scrollbar-thumb {
    background: #a9a9a9 !important;
    border-radius: 6px !important;
    height: 10px !important;
    padding-bottom: 4px !important;
} 
::-webkit-scrollbar-track {
    width: 5px !important;
    background: #f2f2f2 !important;
}

/* Top menu */
.topConts {
    display: flex;
    align-items: center;
}
#btn_hamburger {
    display: none;
}
.logo-container {
    width: 414px;
    display: flex;
    align-items: center;
    text-decoration: none;
} 
.logoWrapper {
    display: inline-block;
    width: 65px;
    height: auto;
    cursor: pointer;
    margin-left: 5px;
} 
.logoWrapper > img {
    width: 100%;
    height: auto;
}
.logo-container .systemName {
    margin-left: 10px;
    font-size: 15px;
    color: #333;
    margin-bottom: 3px;
}
.topRight {
    width: calc(100% - 414px);
}
.topRight .userInfo .dropdown-toggle::after {
    display: none !important;
}
.topRight .userInfo .dropdown-menu {
    padding: 0px;
} 
.topRight .userInfo .dropdown-menu .dropdown-item {
    padding: 10px;
    text-align: center;
} 
.topConts .form-check label {
    font-size: 13px;
} 
.topConts .searchWrapper {
    display: flex;
    align-items: center;
    width: 65%;
}
.topConts .searchBox {
    width: calc(100% - 220px);
    height: 31px;
}
.searchBox .searchInput {
    border-radius: 50px;
    border-color: #0088c7 !important;
    padding: 0px 50px 0px 10px
}
.searchBox .btn_search, .searchBox .btn_multiline, .searchBox .btn_innerSearch {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    padding: 0px;
}
.searchBox .btn_multiline {
    right: 30px;
}
.topConts .langSelection {
    display: flex;
    align-items: center;
    margin: 0px 10px;
}
.topConts .userMsg {
    font-size: 13px;
    display: flex;
    align-items: center;
    white-space: nowrap;
} 
.topConts .userInfo .btn {
    padding: 0px;
    height: 25px;
}
.topConts .userInfo .btn_topSearch {
    display: none;
}
.bg-lightBlue {
    background: #E9F8FF;
}
.bg-gray {
    background: #f4f4f4 !important;
}
.w-30 {
    width: 30% !important;
} 
.form-group label {
    font-size: 13px;
    white-space: nowrap;
}
.tableWrapper {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
} 
.table th {
    background: #E6E6E6;
    font-weight: bold;
    text-align: center;
    font-size: 14px;
}
.table td {
    font-size: 14px;
    position: relative;
}
.table.table-vertical tr:not(:last-child) th, .table.table-vertical tr:not(:last-child) td {
    border-bottom: 1px solid #e0e0e0;
} 
.table.table-bordered.table-vertical th:not(:last-child) {
    border-right: 1px solid #f1f1f1;
} 
.table.table-bordered.table-vertical td:not(:last-child) {
    border-right: 1px solid #e0e0e0;
}


/* account page */
.accountBox {
    padding: 40px;
    box-sizing: border-box;
    width: 30vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.accountBox .title {
    font-size: 24px;
    margin-bottom: 40px;
} 
.accountBox label {
    font-size: 12px;
    color: #384357;
    font-weight: 700;
    line-height: 28px;
}


/* Left */
.left-contents {
    height: 100%;
    display: flex;
    /*margin-right: 10px;*/
    position: relative;
} 
.quickMenu {
    width: 52px;
    height: 100%;
    background: #0088c7;
    border-radius: 6px;
} 
.quickMenu .icon_home, .quickMenu .icon_search, .quickMenu .icon_rule, .quickMenu .icon_bookmark {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}
.quickMenu .menu-container {
    width: 52px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
} 
.quickMenu .menuWrapper {
    display: inline-block;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #00557D;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.2s ease;
}
.quickMenu .menuWrapper:not(.toggle-nav):hover, .quickMenu .menu-container .menuWrapper.active {
    /* background: #003D59;
    border: 1px solid #003D59; */
    background: #4C86B2;
    border: 1px solid #00557D;
}
.quickMenu .menu-container.mainToggleWrapper {
    margin-bottom: 25px;
} 
.quickMenu .menu-container.homeIcon .menuWrapper {
    width: 52px;
    height: 40px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
} 
.quickMenu .menu-container.mainToggleWrapper .menuWrapper {
    width: 52px;
    height: 40px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
} 
.menu-contents {
    display: none;
    width: 350px;
    height: 100%;
    background: #ffffff;
    border-radius: 6px;
    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, .12);
    /*transition: 0.3s ease-in-out;*/
    /* position: absolute; */
    left: 52px;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 4;
} 
.menu-contents.show {
    display: block;
}
.menu-contents[data-name="homeMenu"] {
    display: none !important;
}
.menu-contents > .topTitle {
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    font-weight: 800;
    color: #444;
    text-align: center;
    border-bottom: 1px solid #e7ebf2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0px 20px;
}
.menu-contents > .topTitle .form-select.form-select-sm {
    min-width: 100px;
    width: 40%;
    height: 30px;
}
.menu-contents > .topTitle .btn_menuClose {
    display: none;
}
.menu-contents .searchRange {
    padding: 10px 20px 0px 20px;
}
.menu-contents .langSelection {
    padding: 10px 20px 0px 20px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.ruleHistory {
    padding: 10px 20px;
    height: 190px;
}
.ruleHistory > .title {
    font-size: 14px;
    font-weight: bold;
    color: #555;
}
.ruleHistory-container, .myBookmark-container, .myMemo-container {
    /* height: calc(100% - 20px); */
    background: #E0F5FE;
    border-radius: 6px;
    margin-top: 5px;
    padding: 10px;
    overflow: auto;
} 
.ruleHistory-container > div:not(:last-child) {
    margin-bottom: 10px
}
.ruleHistory-container p {
    font-size: 13px;
}
.ruleHistory-container p:not(:last-child) {
    margin-bottom: 3px
} 
.myBookmark, .myMemo {
    height: calc(100% - 40px);
    padding: 10px 20px;
    overflow: auto;
} 
.myBookmark .docNum, .myMemo .docNum {
    font-size: 16px;
    font-weight: bold;
} 
.myBookmark .docBreadcrumb, .myMemo .docBreadcrumb {
    font-size: 14px;
    margin: 8px 10px;
}
.myBookmark .bookmarkPoint, .myMemo .bookmarkPoint {
    font-size: 13px;
    margin: 0px 20px;
}
.myBookmark .bookmarkRules, .myMemo .bookmarkRules {
    margin-top: 20px;
}
.myBookmark .bookmarkRule, .myMemo .bookmarkRule {
    display: flex;
    align-items: center;
}
.myBookmark .bookmarkRule:not(:last-child), .myMemo .bookmarkRule:not(:last-child) {
    margin-bottom: 5px;
}
.myBookmark .bookmarkRule .btn_openNote, .myMemo .bookmarkRule .btn_openNote {
    width: 25px;
    height: 19px;
    padding: 0px;
} 
.myBookmark .bookmarkRule .ruleName, .myMemo .bookmarkRule .ruleName {
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
}
.bookmarkRules .ruleName {
    color: #0d6efd;
    cursor: pointer;
}


/* Right */
.right-contents {
    width: calc(100% - 52px);
    /*width: 100%;*/
    display: flex;
}
/*.right-contents > div {
    display: none;
}
*/
.right-contents > div.active {
    display: block;
} 
.right-contents .mainContents, .rightMainConts .mainContents {
    width: 100%;
    height: 100%;    
    height: 100%;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, .12);
} 
.right-contents .rightMainConts {
    /*width: calc(100% - 360px);
    margin-left: 10px;*/
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.12);
}
/*.right-contents .rightMainConts {
    display: none;
}
*/
.rightMainConts[data-name="noticeBoard"] {
    width: 100%;
} 
.right-contents > div:not([data-name="'homeMenu'"]).active .mainContents {
    width: calc(100% - 350px);
    margin-left: 350px;
} 
.right-contents > div[data-name="homeMenu"] {
    width: 100%;
}
.right-contents > div[data-name='homeMenu'] .mainContents {
    padding: 30px 50px;
}
.right-contents > div[data-name="homeMenu"] .mainContents .mainCont-container {
    height: 100%;
    padding: 0px 10px;
}
.right-contents > div[data-name="homeMenu"] .main-title {
    display: flex;
    align-items: center;
}
.right-contents > div[data-name="homeMenu"] .main-title .titleTxt {
    font-size: 18px;
    font-weight: bold;
    color: #000;
    margin: 0px 10px 0px 5px;
    margin-bottom: 5px;
}
.right-contents > div[data-name="homeMenu"] .main-contents {
    width: 100%;
    height: calc(100% - 33px);
    border-radius: 10px;
    padding: 10px;
    margin-top: 10px;
    overflow: auto;
} 
.right-contents > div[data-name="homeMenu"] .main-contents > .card:not(:last-child) {
    margin-bottom: 10px;
}
.right-contents > div[data-name="homeMenu"] .main-contents .card-header {
    font-size: 16px;
    font-weight: bold;
    color: #003D59;
} 
.right-contents > div[data-name="homeMenu"] .cont-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
} 
.right-contents > div[data-name="homeMenu"] .cont-breadcrumb > p {
    font-size: 16px;
    font-weight: normal;
    color: #444;
}
.right-contents > div[data-name="homeMenu"] .docs-link {
    margin-top: 40px;
}
.right-contents > div[data-name="homeMenu"] .docs-link > p > a {
    display: inline-block;
    font-size: 14px;
    color: #0088C7;
}
.right-contents > div[data-name="homeMenu"] .docs-link > p:not(:last-child) {
    margin-bottom: 8px;
}
.right-contents > div[data-name="searchMenu"] .mainContents {
    padding: 20px;
}
.right-contents > div[data-name="searchMenu"] .searchResultTxt {
    font-size: 15px;
    color: #000000;
} 
.right-contents > div[data-name="searchMenu"] .resultsTable .table tr:not(:first-child):nth-child(odd) {
    border-top: 1px solid #e0e0e0;
}
.resultsTable {
    height: calc(100% - 20px);
} 
.resultsTable > table {
    display: block;
    height: 100%;
    overflow: auto;
}
.resultsTable > table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.resultsTable .highlight {
    font-weight: bold;
    color: #0088c7;
}
.topFunctions {
    padding: 5px 10px;
    background: #E8EFF2;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}
.k-treeview .btn_bookmark .line.fa-bookmark {
    display: block;
    margin-left: 5px;
}
.k-treeview .btn_bookmark .solid.fa-bookmark {
    margin-left: 5px;
    display: none;
}
.k-treeview .btn_bookmark.active .line.fa-bookmark {
    display: none;
}
.k-treeview .btn_bookmark.active .solid.fa-bookmark {
    display: block;
}
.k-treeview .k-in {
    position: relative;
    color: #000;
}
.k-treeview .treeviewBookmark {
    position: absolute;
    top: 50%;
    left: 100%;
    transform: translateY(-50%);
}
.topFunctions .docNum {
    font-size: 14px;
    font-weight: bold;
}
.topFunctions .searchBox {
    width: 50%;
}
.right-innerConts {
    height: calc(100% - 41px);
    overflow: auto;
    padding: 15px 20px;
}
.right-innerConts .docsViewerWrapper {
    width: 100%;
    display: flex;
}
.docsViewerWrapper .docsViewer-container > nav .breadcrumb {
    flex-wrap: nowrap;
    white-space: nowrap;
    overflow: auto;
}
.docsViewerWrapper .docsViewer-container:not(:first-child) {
    display: none;
}
/* .docsViewerWrapper .docsViewer-container.compare {
    display: none;
}
.docsViewerWrapper.showCompare .docsViewer-container.compare {
    display: block;
} */
.docsViewer {
    height: calc(100% - 33px);
    margin-top: 0px;
    overflow: auto;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    padding: 10px 20px;
    position: relative;
}
.docsViewer .floatingButtons {
    position: sticky;
    top: 5px;    
    display: flex;
    align-items: center;
    justify-content: flex-end;
    z-index: 2;
}
.docsViewer .docsLayoutWrapper {
    font-size: 16px;
    line-height: 1.6;
    width: 42%;
    /*min-width: 848px;*/
}
.docsViewer .docsLayoutSharedWrapper {
    font-size: 16px;
    line-height: 1.6;
    width: 80%;
    margin: 0 auto;
    min-width: 848px;
}
.docsViewer .docsLayoutHistoryWrapper {
    font-size: 16px;
    line-height: 1.6;
    width: 100%;
    /*min-width: 848px;*/
}
.docsViewer .widthBtnWrapper {
    display: flex;
    justify-content: flex-end;
}
.docsViewer .btn_normalWidth, .docsViewer .btn_wideWidth {
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.docsViewer .btn_normalWidth {
    display: none;
}
.docsViewer .paragraphTitle {
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}
.docsViewer div.rulePart.highlighted {
    padding: 10px 15px;
    background: #eee;
    border-radius: 6px;
    cursor: pointer;
    margin-top: 20px;
}
.docsViewer div.rulePart .contentTitle {
    font-weight: bold;
    margin: 20px 0px 5px 0px;
    cursor: pointer;
    display: flex;
    align-items: center;
}
.docsViewer div.rulePart.highlighted .contentTitle {
    margin: 0px 0px 5px 0px;
}
/*.docsViewer .docsLayoutWrapper .rulePart .contentTitle ~ .contents-inner {
    margin-left: 10px;
    margin-bottom: 0px;
}
.docsViewer .docsLayoutWrapper .rulePart .contentTitle ~ .contents-inner > .rulePart > .contents-inner {
    margin-left: 10px;
}*/
.docsViewer .docsLayoutWrapper .contentTitle ~ .contents-inner > .rulePart > .second {
    margin-left: 10px;
    font-weight: 300 !important;
}
.docsViewer .docsLayoutWrapper .contentTitle ~ .contents-inner > .rulePart > .second ~ .contents-inner > .rulePart > .second {
    margin-left: 20px;
    font-weight: 300 !important;
}
.docsViewer .docsLayoutWrapper .contentTitle ~ .contents-inner > .rulePart > .third > .rulePart > .contents-inner.third > .rulePart > .second {
    margin-left: 30px;
    font-weight: 300 !important;
}
.docsViewer .docsLayoutWrapper .contentTitle ~ .contents-inner > .rulePart > .third > .rulePart > .contents-inner.third > .rulePart > .third {
    margin-left: 40px;
    font-weight: 300 !important;
}
/*°øÀ¯È­¸é Ãß°¡*/
.docsViewer .docsLayoutSharedWrapper .contentTitle ~ .contents-inner > .rulePart > .second {
    margin-left: 10px;
    font-weight: 300 !important;
}

.docsViewer .docsLayoutSharedWrapper .contentTitle ~ .contents-inner > .rulePart > .second ~ .contents-inner > .rulePart > .second {
    margin-left: 20px;
    font-weight: 300 !important;
}

.docsViewer .docsLayoutSharedWrapper .contentTitle ~ .contents-inner > .rulePart > .third > .rulePart > .contents-inner.third > .rulePart > .second {
    margin-left: 30px;
    font-weight: 300 !important;
}

.docsViewer .docsLayoutSharedWrapper .contentTitle ~ .contents-inner > .rulePart > .third > .rulePart > .contents-inner.third > .rulePart > .third {
    margin-left: 40px;
    font-weight: 300 !important;
}

.docsViewer .contentSubTitle {
    white-space: nowrap;
    vertical-align: text-top;
}
.docsViewer .innerConts {
    margin-left: 9px;
    font-weight: normal !important;
    overflow: hidden;
}
.docsViewer img {
    max-width: 100%;
    /*margin: 20px 0;*/
}
.docsViewer table {
    width: auto;
    max-width: 100%;
    margin: 25px 0;
    margin-bottom: 20px !important;
    /*border: 2px solid #000;*/
    word-break: break-all;
}
.docsViewer table tr {
    border-left: 2px solid #000;
    border-right: 2px solid #000;
}
.docsViewer table tr:first-child {
    border-top: 2px solid #000;
}
.docsViewer table tr:last-child {
    border-bottom: 2px solid #000;
}
.docsViewer table th, .docsViewer table td {
    border: 1px solid #000;
    vertical-align: middle;
    padding: 5px 10px;
}
.docsViewer table th {
    text-align: center;
} 
.docsViewer table table {
    border-left: 0px;
    border-right: 0px;
}
.docsViewer table table td:first-child {
    border-left: 0px;
}
.docsViewer table table td:last-child {
    border-right: 0px;
}
.icon_contsBookmark.bookmark {
    display: inline-block !important;
}
.icon_contsMemo.memo {
    display: inline-block !important;
}
.memo-container {
    width: 30%;
    height: 100%;
    margin-left: 10px;
    border-radius: 6px;
    z-index: 2;
    min-width: 350px;
    max-width: 400px;
    display: none;
}
.memo-container.float {
    position: absolute;
    max-height: 775px;
    margin-left: 0px;
    cursor: move;
    box-shadow: 0 16px 18px rgba(0, 0, 0, 0.28), 0 4px 16px rgba(0, 0, 0, 0.12);
}
.memo-container.float .btn_float {
    display: none;
}
.memoWrapper {
    width: 100%;
    border-radius: 6px;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, .12);
}
.memoWrapper .memo-header {
    width: 100%;
    height: 40px;
    background: #004B6E;
    border: 1px solid #004B6E;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    padding: 0px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.memoWrapper .memo-header > span {
    font-size: 16px;
    font-weight: bold;
    color: #fff;
}
.memo-container .btn_popupClose {
    display: block;
}
/* .memo-container.float .btn_popupClose {
    display: block;
} */
.memo-container .memo-body {
    height: calc(100% - 40px);
}
.memo-container .memoTitle {
    font-size: 15px;
    font-weight: bold;
    color: #000;
}
.memo-container .memo-mainConts {
    height: 100%;
}
.memo-container .memo {
    height: calc(100% - 80px);
    margin: 5px 0px 10px 0px;
}
.memo-container.float .btn_memo {
    display: none;
}
.imgPreviewWrapper {
    width: 100%;
    height: calc(100% - 30px);
    border: 1px solid #e0e0e0;
}


/* kendo */
.k-breadcrumb .k-breadcrumb-root-link, .k-breadcrumb .k-breadcrumb-link {
    font-size: 14px !important;
    color: #444 !important;
}
.k-breadcrumb-item.k-breadcrumb-last-item {
    font-size: 15px !important;
    color: #000 !important;
    font-weight: bold !important;
}
.k-treeview.k-widget .k-icon.k-i-collapse, .k-widget .k-icon.k-i-expand {
    width: 16px;
    height: 16px;
    background-color: #DAE9F0;
    border-radius: 0px;
    position: relative;
    margin-top: 1px;
}
.k-treeview .k-i-collapse::before {
    content: "" !important;
    display: inline-block;
    position: absolute;
    top: 4%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 10px;
    height: 2px;
    border-radius: 1px;
    background-color: #0088C7;
}
.k-treeview .k-i-expand::before {
    content: "" !important;
    display: inline-block;
    position: absolute;
    top: 1px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 10px;
    height: 2px;
    border-radius: 1px;
    background-color: #0088C7;
}
.k-treeview .k-i-expand::after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2px;
    height: 10px;
    margin-top: -5px;
    margin-left: -1px;
    border-radius: 1px;
    background-color: #0088C7;
}
.k-treeview .k-in {
    font-size: 13px;
    margin-left: 7px;
    margin-bottom: 1px;
    cursor: pointer;
}
.k-treeview .k-in.k-state-selected, .k-treeview .k-in.k-state-hover, .k-treeview .selectedNode > div > .k-in {
    background-color: #e6f0fc !important;
    color: #0088C7 !important;
    font-weight: 800;
    box-shadow: none;
}
.k-treeview .k-in.k-state-focused {
    box-shadow: none !important;
}
.k-treeview .k-sprite {
    display: none;
    visibility: hidden;
}
.k-treeview .k-checkbox {
    margin-left: 7px;
}
.k-checkbox {
    width: 1em;
    height: 1em;
    margin-top: .25em;
    vertical-align: top;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: 1px solid rgba(0, 0, 0, .25);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-print-color-adjust: exact;
}
.k-checkbox:checked {
    background-color: #0d6efd;
    border-color: #0d6efd;  
    color: #fff !important;
    /*background-image: url(/images/icon_checkboxCheck.svg);*/
}
.k-checkbox:focus, .k-checkbox:checked:focus {
    box-shadow: 0 0 0 3px #CFE4FC;
    border-color: #CFE4FC;
}
#ruleMenuPage .k-treeview .k-checkbox-wrapper {
    height: 16px;
    margin-left: 5px;
}
.k-checkbox.k-state-indeterminate::before, .k-checkbox:indeterminate::before {
    height: 3px;
    background-color: #0d6efd;
}
/* search range popup ¼±ÅÃµÈ ¸®½ºÆ® ½ºÅ¸ÀÏ */
.selectedTreeItem {
    display: flex;
    align-items: center;
    margin-bottom: 4px;
}
.selectedTreeItem input[type="checkbox"] {
    cursor: pointer;
}
.selectedTreeItem .selectedText {
    font-size: 13px;
    margin-left: 7px;
    margin-bottom: 1px;
    margin-left: 5px;
}
#selectedTreeview .firstContTitle {
    margin-top: 10px;
    margin-bottom: 5px;
}
#selectedTreeview .firstContTitle > span {
    font-size: 14px;
    font-weight: bold;
    color: #00557D;
    display: block;
    margin-bottom: 5px;
}
#selectedTreeview .firstContTitle .childItems {
    margin-left: 15px;
}
.k-checkbox:disabled {
    opacity: .5;
    background: rgba(0, 0, 0, .15);
}

/* chcekbox ¸¦ bookmark Ç¥½Ã ¹Ù²Þ */
#ruleMenuPage .k-treeview .k-checkbox-wrapper input.k-checkbox {
    background-image: url(/images/icon_bookmark-line.svg);
    border: 0px;
    box-shadow: none;
}
#ruleMenuPage .k-treeview .k-checkbox-wrapper input.k-checkbox:checked {
    background-image: url(/images/icon_bookmark-fill.svg);
} 
#ruleMenuPage .k-checkbox::before {
    display: none;
    visibility: hidden;
} 
#ruleMenuPage .k-treeview .k-checkbox-wrapper + .k-in {
    margin-left: 0px;
}


/* kendo loader */
.k-widget.k-loader {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


/* ¼ö½Ä */
.MathJax {
    font-size: 105% !important;
}


/* table »ç¼±(´ë°¢¼±) */
table td.diagonal, table th.diagonal {
    background-image: linear-gradient(to left bottom, transparent calc(50% - 1px), #000000, transparent calc(50% + 1px));    
    /*background-size: 120% 120%;*/
    background-position: center;
    position: relative;
}
table td.diagonal .diagonalText {
    position: absolute;
}
table td.diagonal .diagonalText.leftBottom {
    left: 10px;
    bottom: 2px;
}
table td.diagonal .diagonalText.rightAbove {
    right: 10px;
    top: 2px;
}


/* Àå ÆäÀÌÁö */
.chapterListWrapper {
    width: 85%;
    min-width: 720px;
    margin: 0 auto;
    padding: 15px 25px;
    border-radius: 5px;
    margin-top: 20px;
    min-height: 657px;
    height: calc(100vh - 210px);
} 
.chapterList {
    display: flex;
    align-items: center;
}
.chapterList:not(:first-child) {
    margin-top: 15px;
} 
.chapterList .paragraphCircle {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #DEECFF;
    border: 1px solid #d8e2ef;
    display: flex;
    align-items: center;
    justify-content: center;
} 
.chapterList .paragraphCircle > svg {
    color: #2C7BE5;
} 
.chapterList .paragraphText {
    font-size: 13px;
    font-weight: bold;
    color: #59606A;
    margin-left: 16px;
}

/* splitter */
.vsplitter {
    position: absolute;
    cursor: e-resize !important;
    z-index: 900;
    width: 8px !important;
    height: 100%;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background: url(/images/ico_resizer_dot.svg) no-repeat center !important;
}


/* ¹ÝÀÀÇü - ¸ð¹ÙÀÏ */
@media screen and (max-width: 375px) {
    .menu-contents {
        width: 302px;
    }
} 
@media screen and (max-width: 430px) {
    .menu-contents {
        width: 302px;
    }
} 
@media screen and (max-width: 500px) {
    .logoWrapper {
        width: 57px;
    }

    .topRight {
        justify-content: flex-end !important;
    }

    .topConts .userInfo .btn_topSearch {
        display: block;
    }

    .menu-contents {
        width: 302px;
    }

    .topConts .searchWrapper, .topConts .searchBox {
        display: none;
    }

    .right-innerConts .memo-container {
        width: 100%;
        position: absolute;
    }

    .right-innerConts > div {
        position: relative;
    }

    .topFunctions .docNum {
        margin-bottom: 10px;
    }
} 

@media screen and (max-width: 766px) {
    .mainContents {
        height: auto !important;
    }
 
    .mainContsWrapper {
        height: auto;
    }

    .left-contents {
        height: auto;
    }

    .docsViewerWrapper .docsViewer-container > nav .breadcrumb {
        flex-wrap: wrap;
        white-space: normal;
    }

    .right-innerConts {
        height: auto;
    }

    .right-contents > div[data-name="homeMenu"] .mainContents .mainCont-container {
        margin-top: 15px;
    }

    .docsViewerWrapper.showCompare .docsViewer-container.compare {
        padding-top: 15px;
    }

    .history-popup.show {
        top: 5%;
        width: 88%;
        height: auto;
        transform: translate(-50%, 0);
    }

    .history-popup .card-body {
        height: auto;
    }

    .history-popup .card-body > .row {
        height: auto !important;
    }

    .history-popup .card-body > .row > div {
        height: auto !important;
    }

    .history-popup .historyConts {
        height: auto;
    }
}
@media screen and (max-width: 680px) {
    .tableTopButtons {
        flex-wrap: wrap;
    }
    .tableTopButtons .btn:nth-child(5), .tableTopButtons .btn:nth-child(6) {
        margin-top: 5px;
    }
} @media screen and (max-width: 780px) {
    .right-contents > div[data-name="homeMenu"] .main-title .titleTxt {
        font-size: 16px;
    }
}


/* ¹ÝÀÀÇü - ÅÂºí¸´ */
@media screen and (max-width: 870px) {
    .mainContents {
        min-height: 100vh;
    }
    .docsViewer {
        height: calc(100vh - 105px);
    }
} 
@media screen and (max-width: 890px) {
    .accountBox {
        width: 80vw !important;
    }

    .topConts .userMsg {
        display: none;
    }

    .searchBox {
        width: 90% !important;
    }

    .memo-container {
        display: none !important;
        cursor: default !important;
    }

    .memo-container.float {
        display: block !important;
    }

    .right-innerConts .docsViewerWrapper {
        width: 100% !important;
    }
}
@media screen and (max-width: 990px) {
    #btn_hamburger {
        display: inline-block;
    }

    .systemName {
        display: none;
    }

    .topRight {
        width: calc(100% - 137px);
        margin-left: 10px;
    }

    .searchBox {
        width: 90% !important;
    }
} 
@media screen and (max-width: 992px) {
    #btn_hamburger {
        display: inline-block;
    }

    .systemName {
        display: none;
    }
}
@media screen and (max-width: 1020px) {
    .systemName {
        display: none;
    }

    .topRight {
        width: calc(100% - 137px) !important;
        margin-left: 10px;
    }

    .topConts .userMsg {
        display: none;
    }

    .topConts .searchBox {
        width: 94% !important;
    }

    .topConts .searchWrapper {
        width: 100%;
    }
}


/* ¹ÝÀÀÇü - PC */
@media screen and (max-width: 1155px) {
    .topRight {
        width: calc(100% - 285px);
    }
} 
@media screen and (max-width: 1200px) {
    .topConts {
        justify-content: space-between;
    }

    .userMsg .loginTime {
        display: none;
    }

    .logo-container {
        width: auto;
    }

    .right-contents > div:not([data-name="homeMenu"]).active .mainContents {
        width: 100%;
        margin-left: 0px;
    }

    #splitLayout .vsplitter {
        display: none;
    }
    #splitLayout.splitter_panel .menu-contents.left_panel {
        position: absolute !important;
        box-shadow: 0px 1px 2px 3px rgba(0, 0, 0, 0.06);
    }
    #splitLayout.splitter_panel .rightMainConts.right_panel {
        position: initial !important;
    }

    .menu-contents > .topTitle .btn_menuClose {
        display: inline-block;
    }

    .right-contents .rightMainConts {
        width: calc(100% - 10px) !important;
        margin-left: 10px;
    }
}
@media screen and (min-width: 1200px) {
    .menu-contents {
        /*display: block !important;*/
        /*min-width: 350px;*/
    }
    #splitLayout .vsplitter {
        /*display: inline-block !important;*/
    }
} 
@media screen and (max-width: 1217px) {
    .topConts .searchWrapper {
        width: 45%;
    }
} 
@media screen and (max-width: 1250px) {
    .accountBox {
        width: 60vw;
    }
} 
@media screen and (max-width: 1280px) {
    .logo-container {
        width: auto;
    }
    .topConts {
        justify-content: space-between;
    }
    .topRight {
        width: 100%;
        margin-left: 20px;
    }
    .systemName {
        display: none;
    }
}
@media screen and (max-width: 1300px) {
    .docsViewerWrapper {
        width: 60%;
    }

    .memo-container {
        width: 70%;
    }
}
@media screen and (max-width: 1403px) {
    .topConts .searchWrapper {
        width: 50%;
    }
} 
@media screen and (max-width: 1415px) {
    .topConts .searchWrapper {
        width: 50%;
    }
}
@media screen and (max-width: 1475px) {
    .adminDocSearchbox .col-xl-2 {
        flex: 0 0 auto;
        width: 50%;        
    }
    .adminDocSearchbox .row > div:not(:first-child), .adminDocSearchbox .row > div:not(:nth-child(2)) {
        margin-top: 5px;
    }
} 
@media screen and (max-width: 1500px) {
    .right-contents > div[data-name="homeMenu"] .mainContents {
        padding: 20px 10px;
    }
}
@media screen and (max-width: 1545px) {
    .accountBox {
        width: 80vw;
    }
    .topConts .searchWrapper {
        width: 90%;
    }
} 
@media screen and (max-width: 1735px) {

}
@media screen and (max-width: 1800px) {
    .accountBox {
        width: 40vw;
    }
} .treeviewTitle {
    font-size: 15px;
    font-weight: bold;
    color: #555;
} div[data-name="ruleMenu"] .treeview-container {
    height: calc(100% - 40px);
    overflow: auto;
}