/* @import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css); */
@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	font-display: swap;
	src: local('Pretendard Black'), url(../webfonts/Pretendard-Black.woff2) format('woff2'), url(../webfonts/Pretendard-Black.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: local('Pretendard ExtraBold'), url(../webfonts/Pretendard-ExtraBold.woff2) format('woff2'), url(../webfonts/Pretendard-ExtraBold.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: local('Pretendard Bold'), url(../webfonts/Pretendard-Bold.woff2) format('woff2'), url(../webfonts/Pretendard-Bold.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: local('Pretendard SemiBold'), url(../webfonts/Pretendard-SemiBold.woff2) format('woff2'), url(../webfonts/Pretendard-SemiBold.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: local('Pretendard Medium'), url(../webfonts/Pretendard-Medium.woff2) format('woff2'), url(../webfonts/Pretendard-Medium.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: local('Pretendard Regular'), url(../webfonts/Pretendard-Regular.woff2) format('woff2'), url(../webfonts/Pretendard-Regular.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: local('Pretendard Light'), url(../webfonts/Pretendard-Light.woff2) format('woff2'), url(../webfonts/Pretendard-Light.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: local('Pretendard ExtraLight'), url(../webfonts/Pretendard-ExtraLight.woff2) format('woff2'), url(../webfonts/Pretendard-ExtraLight.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: local('Pretendard Thin'), url(../webfonts/Pretendard-Thin.woff2) format('woff2'), url(../webfonts/Pretendard-Thin.woff) format('woff');
}

html, body {
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    font-family: "Pretendard";
    font-size: 14pt;
    color: #777;
    background: #3D424C;
}

div, button, input, textarea {
    outline: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-overflow-scrolling: touch;
    font-family: "Pretendard";
}

#bConfirm .confirm-box .icon,
#bAlert .alert-box .icon {
    position: relative;
    padding: 30px 20px 20px 20px;
    text-align: center;
}

#bConfirm .confirm-box .content,
#bAlert .alert-box .content {
    position: relative;
    padding: 0 20px;
    font-size: 16px;
    /* color: #fff; */
    text-align: center;
    line-height: 24px;
}

#bConfirm .confirm-box .content .sub,
#bAlert .alert-box .content .sub {
    padding-top: 8px;
    font-size: 14px;
    color: #72829d;
    line-height: 19px;
}

#bConfirm .confirm-box .btn-area,
#bAlert .alert-box .btn-area {
    position: relative;
    display: flex;
    justify-content: space-evenly;
    padding: 30px 20px 20px 20px;
    white-space: nowrap;
}

#bConfirm .confirm-box .btn-area button {
    width: calc(50% - 5px);
    width: -moz-calc(50% - 5px);
    width: -webkit-calc(50% - 5px);
    padding-top: 1px;
}

#gLoading div {
    font-size: 16px;
    font-family: 'Roboto';
    color: #fff;
    text-align: center;
}

.dialogCloseButton,
.miniDialogCloseButton {
    position: absolute;
    top: 14px;
    right: 16px;
    width: 24px;
    height: 24px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent url(/images/icon_close.svg) center no-repeat;
    background-size: 16px;
    cursor: pointer;
}

.miniDialogCloseButton {
    width: 20px;
    height: 20px;
    background-size: 12px;
}

.dialogCloseButton:hover,
.miniDialogCloseButton:hover {
    background-image: url(/images/icon_close_hover.svg);
}

.searchDialogCloseButton{
    position: absolute;
    top: 14px;
    right: 16px;
    width: 24px;
    height: 24px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent url(/images/icon_close.svg) center no-repeat;
    background-size: 16px;
    cursor: pointer;
}

.searchDialogCloseButton:hover{
    background-image: url(/images/icon_close_hover.svg);
}
/* for jquery.custom.js UI */


/* Base for label styling */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
    position: absolute;
    left: -9999px;
}
[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
    position: relative;
    padding-left: 33px;
    padding-top: 3px;
    cursor: pointer;
}

/* checkbox aspect */
[type="checkbox"]:not(:checked) + label:before,
[type="checkbox"]:checked + label:before {
    content: '';
    position: absolute;
    left:0;
    top: 1px;
    width: 18px; height: 18px;
    border: 1px solid #989FAC;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: none;
}
/* checked mark aspect */
[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
    content: '✔';
    position: absolute;
    top: 2px; left: 2px;
    font-size: 11px;
    font-family: 'Roboto';
    width: 17px;
    height: 17px;
    line-height: 19px;
    text-align: center;
    color: #72829d;
    background: #283041;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    transition: all .1s;
}
/* checked mark aspect changes */
[type="checkbox"]:not(:checked) + label:after {
    opacity: 0;
    transform: scale(0);
}
[type="checkbox"]:checked + label:after {
    opacity: 1;
    transform: scale(1);
}
/* disabled checkbox */
[type="checkbox"]:disabled:not(:checked) + label:before,
[type="checkbox"]:disabled:checked + label:before {
    box-shadow: none;
    border-color: #72829d;
    background-color: #47546a;
}
[type="checkbox"]:disabled:checked + label:after {
    color: #72829d;
}
[type="checkbox"]:disabled + label {
    color: #d8dadc;
}
[type="checkbox"]:disabled:checked + label:after {
    color: #d8dadc;
}
[type="checkbox"]:disabled + label {
    color: #d8dadc;
}

[type="radio"]:not(:checked),
[type="radio"]:checked {
    position: absolute;
    left: -9999px;
}
[type="radio"]:not(:checked) + label,
[type="radio"]:checked + label {
    position: relative;
    padding-left: 33px;
    padding-top: 1px;
    cursor: pointer;
    line-height: 16px;
}

/* radio aspect */
[type="radio"]:not(:checked) + label:before,
[type="radio"]:checked + label:before {
    content: '';
    position: absolute;
    left:0; top: 1px;
    width: 18px; height: 18px;
    border: 1px solid #72829d;
    background: #283041;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    box-shadow: none;
}

/* checked mark aspect */
[type="radio"]:not(:checked) + label:after,
[type="radio"]:checked + label:after {
    content: '•';
    position: absolute;
    left: 1.1px;
    top: 3px;
    font-size: 31px;
    font-family: monospace !important;
    width: 20px;
    height: 20px;
    color: #72829d;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background: transparent;
    transition: all .1s;

}
/* checked mark aspect changes */
[type="radio"]:not(:checked) + label:after {
    opacity: 0;
    transform: scale(0);
}
[type="radio"]:checked + label:after {
    opacity: 1;
    transform: scale(1);
}
/* disabled radio */
[type="radio"]:disabled:not(:checked) + label:before,
[type="radio"]:disabled:checked + label:before {
    box-shadow: none;
    border-color: #72829d;
    background-color: #47546a;
}
[type="radio"]:disabled:checked + label:after {
    color: #72829d;
}
[type="radio"]:disabled + label {
    color: #d8dadc;
}
[type="radio"]:disabled:checked + label:after {
    color: #d8dadc;
}
[type="radio"]:disabled + label {
    color: #d8dadc;
}

.cd-frame {
    position: relative;
}

.cd-frame .cd-titlebar,
.cd-frame .cd-titlebar-drag {
    display: flex;
    align-items: center;
    height: auto;
    border-bottom: 1px solid #eee;
    cursor: default;
    color: #2A2E35;
    font-size: 16px;
    font-family: Pretendard;
    font-weight: 700;
    line-height: 20px;
    word-wrap: break-word;
    padding-left: 42px !important;
}
.cd-frame .cd-titlebar-drag {
    padding: 0 40px 0 45px;
}
.cd-frame.tiny .cd-titlebar,
.cd-frame.tiny .cd-titlebar-drag {
    height: 50px;
}

.cd-tContents .cd-contents .cd-title,
.cd-tContents .cd-contents .cd-title-drag,
.cd-rContents .cd-contents .cd-title,
.cd-rContents .cd-contents .cd-title-drag {
    display: flex;
    align-items: center;
    margin: 0 16px;
    padding: 0 40px 0 10px;
    height: 70px;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    /*border-bottom: 1px solid #414e62;*/
    cursor: default;

}
.cd-tContents .cd-contents .cd-title-drag,
.cd-rContents .cd-contents .cd-title-drag {
    padding: 0 40px 0 45px;
}

.cd-tContents .cd-contents .cd-title,
.cd-tContents .cd-contents .cd-title-drag,
.cd-rContents .cd-contents .cd-title,
.cd-rContents .cd-contents .cd-title-drag {
    height: 50px;
}

.cd-frame .dialogCloseButton {
    top: 22px;
    right: 22px;
}
.cd-frame.tiny .dialogCloseButton {
    top: 13px;
}

.cd-frame .cd-contents {
    position: relative;
    padding: 30px 16px 10px 16px;
}
.cd-frame.tiny .cd-contents {
    padding: 10px 40px;
}

.cd-frame .cd-contents .cd-btn-box {
    padding: 3px 0;
}
.cd-frame .cd-contents .cd-btn-box .btn_common_t1 {
    padding: 0 15px;
    border: 1px solid #47546a;
    text-align: left;
}
.cd-frame .cd-contents .cd-btn-box .btn_common_t1:hover {
    color: #fff;
}
.cd-frame .cd-contents .cd-btn-box .btn_common_t1.on {
    color: #fff;
    border: 1px solid #fff;
}
.cd-frame .cd-contents .cd-divide-4 {
    display: inline-block;
    width: calc(40% - 5px);
    width: -moz-calc(40% - 5px);
    width: -webkit-calc(40% - 5px);
    padding-right: 5px;
    vertical-align: top;
}
.cd-frame .cd-contents .cd-divide-6 {
    display: inline-block;
    width: calc(60% - 5px);
    width: -moz-calc(60% - 5px);
    width: -webkit-calc(60% - 5px);
    padding-left: 5px;
    vertical-align: top;
}
.cd-frame .cd-contents .cd-legend {
    height: 30px;
    text-align: right;
    padding-bottom: 10px;
    color: #ccc;
    font-size: 13px;
}
.cd-frame .cd-contents .cd-legend-line {
    display: inline-block;
    width: 20px;
    height: 8px;
    margin: 0 6px 0 10px;
}
.cd-frame .cd-contents .cd-history-mapview {
    width: 100%;
    height: 500px;
    border: 1px solid #47546a;
    margin-bottom: 10px;
}
.cd-frame .cd-contents .cd-history-summary {
    padding: 30px 0 10px 0;
    color: #ccc;
    font-size: 14px;
    line-height: 1.5em;
}
.cd-frame .cd-contents .cd-history-summary .summary-title {
    display: inline-flex;
    align-items: center;
    width: 145px;
    height: 30px;
}
.cd-frame .cd-contents .cd-history-summary .summary-content {
    display: inline-flex;
    align-items: center;
    color: #fff;
    width: calc(100% - 145px);
    width: -moz-calc(100% - 145px);
    width: -webkit-calc(100% - 145px);
}
.cd-frame .cd-contents .cd-history-summary.multiline {
    padding-top: 0;
}
.cd-frame .cd-contents .cd-history-btn {
    padding-top: 15px;
    text-align: center;
}
.cd-frame .cd-contents .cd-history-btn button {
    width: 120px;
    height: 32px;
    margin: 0 5px;
    padding-top: 2px !important;
}


.cd-history-header,
.cd-history-body .hb-row {
    display: flex;
    align-items: center;
    margin: 0 10px;
    padding: 4px 0;
    min-height: 40px;
    border-top: 1px solid #666;
    border-bottom: 1px solid #666;
    font-size: 12px;
    /* text-align: center; */
    color: #777;
    background: rgba(255, 255, 255, 0.04);
    cursor: default;
}
.cd-history-body .hb-row {
    margin: 0 0 0 10px;
    border-top: 0;
    border-bottom: 1px solid #666;
    color: #ddd;
    text-align: left;
    background: transparent;
}
.cd-history-body .hb-row:hover {
    background: rgba(0, 0, 0, 0.1);
}
.cd-history-body {
    overflow-y: scroll;
    margin-right: 0;
    height: 305px;
}
.cd-history-header .h-linked,
.cd-history-body .h-linked {
    width: 14%;
    padding: 0 5px;
}
.cd-history-header .h-field,
.cd-history-body .h-field {
    width: 18%;
    padding: 0 5px;
}
.cd-history-header .h-before,
.cd-history-body .h-before,
.cd-history-header .h-after,
.cd-history-body .h-after {
    width: 34%;
    padding: 0 5px;
}

.cd-frame .btn_dragmove {
    position: absolute;
    top: 5px;
    left: 16px;
    width: 40px;
    height: 40px;
    background: transparent url(/images/icon_popup_move.svg) center no-repeat;
    background-size: 18px;
}
.cd-frame .btn_dragmove:hover {
    background-image: url(/images/icon_popup_move_hover.svg);
}

.cd-frame .cd-contents .cd-datalayer-box {
    position: relative;
    border: 1px solid #47546a;
    padding: 5px 0;
    margin: 5px 0;
    background: #2f3646;
}
.cd-frame .cd-contents .cd-datalayer-box.work {
    border: 1px solid #8297ba;
}
.cd-frame .cd-contents .cd-datalayer-box .cdb-visible {
    position: absolute;
    top: 0;
    left: 0;
    width: 45px;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cd-frame .cd-contents .cd-datalayer-box .cdb-info {
    padding: 0 50px;
}
.cd-frame .cd-contents .cd-datalayer-box .cdb-info .title {
    display: flex;
    align-items: center;
    height: 28px;
    font-size: 12px;
    color: #fff;
    margin-bottom: 4px;
}
.cd-frame .cd-contents .cd-datalayer-box .cdb-info .color,
.cd-frame .cd-contents .cd-datalayer-box .cdb-info .opacity {
    display: flex;
    align-items: center;
    height: 34px;
    font-size: 11px;
    color: #ccc;
}
.cd-frame .cd-contents .cd-datalayer-box .cdb-info .color .stitle,
.cd-frame .cd-contents .cd-datalayer-box .cdb-info .opacity .stitle {
    display: inline-flex;
    width: 50px;
}
.cd-frame .cd-contents .cd-datalayer-box .cdb-info .color .sarea,
.cd-frame .cd-contents .cd-datalayer-box .cdb-info .opacity .sarea {
    display: inline-flex;
    width: calc(100% - 50px);
    width: -moz-calc(100% - 50px);
    width: -webkit-calc(100% - 50px);
}
.cd-frame .cd-contents .cd-datalayer-box .cdb-info .color .sarea .def-fit-input,
.cd-frame .cd-contents .cd-datalayer-box .cdb-info .opacity .sarea .def-fit-input {
    width: 85px;
    height: 30px;
    padding: 6px 0;
    text-align: center;
}
.cd-frame .cd-contents .cd-datalayer-box .cdb-info .color .sarea .sp-replacer {
    padding: 0;
    border: 0;
    background: transparent;
}
.cd-frame .cd-contents .cd-datalayer-box .cdb-info .color .sarea .sp-replacer .sp-preview {
    width: 30px;
    height: 30px;
}
.cd-frame .cd-contents .cd-datalayer-box .cdb-info .color .sarea .sp-replacer .sp-dd {
    display: none;
}

/* ---------------------- search css --------------*/
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box {
    position: absolute;
    border: 0px solid #47546a;
    padding: 0px 0;
    margin: 0px 0;
    top: 90px;
    left: 375px;
    background: #2f3646;
}
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box.work {
    border: 1px solid #8297ba;
}
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-visible {
    position: absolute;
    top: 0;
    left: 0;
    width: 45px;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info {
    padding: 0 0px;
}
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info .title {
    display: flex;
    align-items: center;
    height: 28px;
    font-size: 12px;
    color: #fff;
    margin-bottom: 4px;
}
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info .color,
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info .opacity {
    display: flex;
    align-items: center;
    /*height: 34px;*/
    font-size: 11px;
    color: #ccc;
}
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info .color .stitle,
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info .opacity .stitle {
    display: inline-flex;
    width: 50px;
}
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info .color .sarea,
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info .opacity .sarea {
    display: inline-flex;
    width: calc(100% - 50px);
    width: -moz-calc(100% - 50px);
    width: -webkit-calc(100% - 50px);
}
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info .color .sarea .def-fit-input,
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info .opacity .sarea .def-fit-input {
    width: 85px;
    height: 30px;
    padding: 6px 0;
    text-align: center;
}
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info .color .sarea .sp-replacer {
    padding: 0;
    border: 0;
    background: transparent;
}
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info .color .sarea .sp-replacer .sp-preview {
    width: 30px;
    height: 30px;
}
.cd-frame .cd-contents .cd-resultColor .cd-datalayer-box .cdb-info .color .sarea .sp-replacer .sp-dd {
    display: none;
}

/* ------------- searchData end -------------------- */

.dl-opacity {
    width: 90%;
    height: 7px;
    background: #20232d;
    border: 1px solid #3d4557 !important;
}
.dl-opacity .ui-slider-range {
    background: #999;
}
.dl-opacity .ui-slider-handle {
    border: 1px solid #ccc;
    background: #bbb;
    width: 11px;
    height: 11px;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    cursor: pointer;
}
.dl-opacity .ui-slider-handle.ui-state-active {
    background: #fff;
}

.cd-frame .cd-contents .cd-datalayer-box .cdb-sort {
    position: absolute;
    top: 0;
    right: 0;
    width: 45px;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cd-frame .cd-contents .cd-datalayer-box .btn_iconbutton {
    width: 40px;
    height: 40px;
    font-size: 15px;
}

.cd-btn-frame {
    display: flex;
    justify-content: center;
    padding: 30px 20px;
}
.cd-btn-frame button {
    width: 140px;
    margin: 0 10px;
}
.cd-btn-frame.tiny {
    padding: 0 20px 15px 20px;
}

.cd-form-row {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 0 10px 6px 10px;
}
.cd-form-row .cd-form-title {
    width: 140px;
    padding: 0 6px;
    font-size: 14px;
    color: #4D5562;
}
.cd-form-row .cd-form-elm {
    width: calc(100% - 140px);
    width: -moz-calc(100% - 140px);
    width: -webkit-calc(100% - 140px);
    font-size: 14px;
    color: #ccc;
}
.cd-form-row .cd-form-elm .elm-comment {
    padding: 2px 12px;
    font-size: 13px;
    color: #aaa;
}
.cd-form-row .cd-form-elm .btn_common_t2,
.cd-form-row .cd-form-elm .btn_common_t3 {
    height: 38px;
    width: auto;
    padding: 0 20px;
}

.cd-form-row .cd-form-elm .pass-form {
    padding-top: 10px;
}
.cd-form-row .cd-form-elm .pass-form button {
    margin-left: 10px;
}
.cd-form-row .cd-form-elm .in-row,
.cd-form-row .cd-form-elm .in-row-right {
    position: relative;
    min-height: 44px;
    padding: 0 0 6px 0;
}
.cd-form-row .cd-form-elm .in-row-right {
    text-align: right;
}

.cd-form-row .selectric {
    background: #2f3646;
    border: 1px solid #47546a;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.16);
    z-index: 1;
}
.cd-form-row .selectric-open .selectric {
    background: #0e1013;
    border: 1px solid transparent;
}
.cd-form-row .selectric .label {
    height: 36px;
    line-height: 36px;
}
.cd-form-row .selectric .button {
    height: 36px;
}
.cd-form-row .selectric-items {
    z-index: 2;
}
.cd-form-row .selectric-items ul,
.cd-form-row .selectric-items li {
    min-height: 38px;
    line-height: 38px;
}

.cd-form-rows {
    position: relative;
    padding: 0 10px 6px 10px;
}
.cd-form-row .cd-form-content,
.cd-form-rows .cd-form-content {
    padding-left: 12px;
    font-size: 14px;
    color: #fff;
}
.cd-form-rows .cd-work-header,
.cd-form-rows .cd-work-list .wl-row {
    display: flex;
    align-items: center;
    margin: 0 10px;
    padding: 12px 0;
    border-top: 1px solid #666;
    border-bottom: 1px solid #666;
    font-size: 13px;
    text-align: center;
    color: #777;
    background: rgba(255, 255, 255, 0.04);
    cursor: default;
}
.cd-form-rows .cd-work-list {
    height: 130px;
    overflow-y: scroll;
}
.cd-form-rows .cd-work-list .wl-row {
    margin: 0 0 0 10px;
    padding: 12px 0;
    border-top: 0;
    border-bottom: 1px solid #666;
    color: #ddd;
    background: transparent;
}
.cd-form-rows .cd-work-list .wl-row-nolist {
    display: flex;
    margin: 0 0 0 10px;
    justify-content: center;
    align-items: center;
    height: 100%;
    font-size: 13px;
    color: #777;
    border-bottom: 1px solid #666;
    cursor: default;
}
.cd-form-rows .cd-work-header .w-num,
.cd-form-rows .cd-work-list .w-num {
    width: 80px;
}
.cd-form-rows .cd-work-header .w-title,
.cd-form-rows .cd-work-list .w-title {
    width: calc(100% - 180px);
    width: -moz-calc(100% - 180px);
    width: -webkit-calc(100% - 180px);
}
.cd-form-rows .cd-work-header .w-status,
.cd-form-rows .cd-work-list .w-status {
    width: 100px;
}
.cd-form-row .cd-form-info,
.cd-form-rows .cd-form-info {
    font-size: 13px;
    color: #777;
    text-align: right;
}

.ui-autocomplete {
    background: #0e1013 !important;
    border: 1px solid #47546a !important;
    border-top: 0;
    padding: 3px 0;
}
.ui-autocomplete .auto-item {
    font-size: 13px;
    color: #ddd;
    padding: 5px 15px;
}
.ui-autocomplete .auto-item:hover {
    color: #fff;
}

.cover-overlay {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    background: rgba(0, 0, 0, 0.4);
}
.set-area-map {
    width: 100%;
    height: 500px;
    border: 1px solid #47546a;
    background: transparent;
}
.cd-form-rows .set-area-map {
    border-top: 0;
}
.cd-form-rows .cover-overlay {
    left: 10px;
    right: 10px;
    bottom: 6px;
}

.def-fit-input {
    margin: 0;
    padding: 6px 12px;
    width: 100%;
    height: 38px;
    font-size: 14px !important;
    font-family: 'Noto Sans' !important;
    color: #fff;
    border: 1px solid #47546a;
    background: #283041;
}
.def-fit-input::placeholder {
    color: #72829d;
}
.def-fit-input:focus {
    border-bottom: 1px solid #6899eb;
}

/* change input color when autofill */
/* Chrome, Safari, Edge */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px #283041 inset !important; /* Change 'white' to your desired background color */
    -webkit-text-fill-color: #FFFFFF !important; /* Change 'black' to your desired text color */
    caret-color: #FFFFFF !important; /* Change 'red' to your desired caret color */
}

/* Firefox */
input:-moz-autofill {
    box-shadow: 0 0 0 30px #283041 inset !important; /* Change 'white' to your desired background color */
    text-fill-color: #FFFFFF !important; /* Change 'black' to your desired text color */
    caret-color: #FFFFFF !important; /* Change 'red' to your desired caret color */
}

/* Internet Explorer */
input:-ms-autofill {
    box-shadow: 0 0 0 30px #283041 inset !important; /* Change 'white' to your desired background color */
    text-fill-color: #FFFFFF !important; /* Change 'black' to your desired text color */
    caret-color: #FFFFFF !important; /* Change 'red' to your desired caret color */
}

/* selectric wrapper size */
.sw-type1 { width: 150px; }
.sw-type2 { width: 200px; }
/* end */


#header {
    position: relative;
    width: 100%;
    height: 50px;
    background: #2A2E35;
    z-index: 199;
}

#gnb_logo {
    display: flex;
    height: 100%;
    align-items: center;
}
#gnb_logo a {
    text-decoration: none;
    display: flex;
    align-items: center;
}
#gnb_logo img {
    margin-left: 10px;
}
#gnb_logo .bi-logo {
    display: inline-block;
    /* background: transparent url(/images/gnb_logo.svg) right center no-repeat; */
    background-size: 40px;
    width: 50px;
    height: 50px;
}
#gnb_logo .bi-text {
    margin-left: 10px;
    font-size: 21px;
    font-weight: 500;
    color: #fff;
    white-space: nowrap;
}

#gnb_signin {
    position: absolute;
    top: 0;
    right: 66px;
    bottom: 0;
    border-left: 1px solid #393939;
    border-right: 1px solid #393939;
}

#gnb_member {
    position: absolute;
    top: 0;
    right: 66px;
    bottom: 0;
    width: 185px;
    border-left: 1px solid #393939;
    border-right: 1px solid #393939;
}
#gnb_member .onoff {
    position: absolute;
    top: 0;
    left: -15px;
    bottom: 0;
    display: flex;
    align-items: center;
    transform: translateX(-100%);
}
#gnb_member .onoff .box {
    display: flex;
    align-items: center;
    padding: 2px 8px;
    border: 1px solid #666;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    font-size: 10px;
}
#gnb_member .onoff .box.on {
    background: #1E57DC;
    color: #fff;
    border-color: #fff;
}
#gnb_member .onoff .box.off {
    background: #1E57DC;
    color: #fff;
    border-color: #fff;
}

#body_content {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}

#loginfield {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
    vertical-align: middle;
    z-index: 2;
}

#loginfield .dialog {
    width: 360px;
    height: 100%;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    padding-top: 120px;
}
#loginfield .dialog.signup {
    width: 650px;
    padding: 30px 50px;
}

#loginfield .dialog .logo-area {
    text-align: center;
}

#loginfield .dialog .title-area {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 40px;
    flex-direction: column;
    gap: 20px;
}
#loginfield .dialog .title-area img {
    margin: 0 8px;
}
#loginfield .dialog .title-area .bi-text {
    /* margin: -2px 10px 0 10px; */
    font-size: 24px;
    font-weight: 700;
    line-height: 30px;
    color: rgba(255, 255, 255, 1);
}

#loginfield .dialog.signup .title-area {
    /* justify-content: normal; */
    padding: 0 20px 25px 20px;
    border-bottom: 1px solid #3d4758;
    margin-bottom: 20px;
}
#loginfield .dialog.signup .title-area .bi-text {
    margin: 0;
    font-size: 24px;
    font-weight: 400;
    color: #fff;
}

#loginfield .dialog .form-area {
    width: 360px;
    margin: 0 auto;
    margin-bottom: 20px;
}
#loginfield .dialog.signup .form-area {
    width: 100%;
    margin: 0;
    padding: 20px;
}

#loginfield .dialog.resetpass {
    width: 600px;
    /* padding: 30px 50px; */
    background-color: rgba(255, 255, 255, 1);
}

#loginfield .dialog.resetpass .form-area {
    width: 100%;
    margin: 0;
    padding: 20px;
    border: 1px solid rgba(238, 238, 238, 1);
}

#loginfield .dialog.resetpass .title-area {
    display: block;
    padding: 30px;
    text-align: left;
}

#loginfield .dialog .title-area .title-text {
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    color: rgba(42, 46, 53, 1);
}
#loginfield .dialog.resetpass .btn-box.half {
    margin: 30px;
}

#loginfield .dialog .form-area .form-comment {
    /* text-align: left; */
    font-size: 15px;
    /* color: #eee; */
    padding: 0 15px 20px 15px;
}

#loginfield .dialog .form-area .form-box {
    /* padding: 8px 12px; */
    /* height: 60px;
    text-align: initial; */
    background-color: rgba(77, 85, 98, 1);
    /* border: 1px solid  rgba(108, 119, 137, 1); */
    border-radius: 2px;
    margin-bottom: 12px;
}
#loginfield .dialog .form-area .form-box.focus {
    /* border-bottom: 1px solid #7a8cac; */
}

#loginfield .dialog .form-area .btn-box {
    padding-top: 20px;
    background-color: #00BECA;
    color: white;
    font-size: 14px;
    font-family: Pretendard;
    font-weight: 500;
    line-height: 18px;
    word-wrap: break-word
}

#loginfield .dialog .form-area .form-box .title {
    font-size: 12px;
    line-height: 15px;
    margin-bottom: 6px;
    color: #fff;
}
.essential:after {
    content: " *";
    color: rgba(0, 190, 202, 1);
}

#loginfield .dialog .form-area .form-box .content {
    font-size: 12px;
    line-height: 15px;
    position: relative;
}

#loginfield .dialog .form-area .form-box input {
    margin: 0;
    width: 100%;
    font-size: 14px;
    line-height: 20px;
    color: #EEEEEE;
    background: transparent;
    border: 0;
}

#loginfield .dialog .form-area .form-box input::placeholder {
    color: #6C7789;
}

#loginfield .dialog .bottom-area {
    /* padding: 20px 80px; */
    text-align: center;
}

#loginfield .dialog .bottom-area button {
    display: inline-block;
    width: 50%;
}


.btn-box.half button {
    display: inline-block;
    width: calc(50% - 10px);
    width: -moz-calc(50% - 10px);
    width: -webkit-calc(50% - 10px);
}
.btn-box.half button:last-child {
    margin-left: 20px;
}


.gnb_selectbox {
    width: 100%;
    height: 50px;
    line-height: 50px;
    background-color: #0e1013;
}

.gnb_signbtn {
    padding: 0 14px 0 11px;
    margin: 0;
    height: 50px;
    background: transparent;
    border: 0;
    cursor: pointer;
}

.gnb_signbtn .text {
    display: inline-block;
    color: #fff;
    font-size: 14px;
    padding-left: 9px;
    vertical-align: middle;
}

#framebox {
    position: relative;
    width: 100%;
    height: 100%;
}

.zoomcontrolbar {
    margin: 15px 20px 0 0;
}

.zoomcontrolbar .plus,
.zoomcontrolbar .minus {
    line-height: 0;
}

.zoomcontrolbar .bar {
    width: 100%;
    min-height: 100px;
    background: #fff;
    border-left: 1px solid #e3e3e3;
    border-right: 1px solid #e3e3e3;
    padding: 11px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.zoomcontrolbar .ui-widget-content {
    width: 16px;
    border: 0;
    background: transparent url(/images/zoombar_back.png) top center repeat-y;
    background-size: 16px 9px;
}

.zoomcontrolbar .ui-slider-range {
    width: 2px;
    margin: 0 7px;
    border: 0;
    background-image: -webkit-linear-gradient(-180deg, #0078d4 0%, #00ffff 100%);
    background-image: -moz-linear-gradient(-180deg, #0078d4 0%, #00ffff 100%);
    background-image: -o-linear-gradient(-180deg, #0078d4 0%, #00ffff 100%);
    background-image: linear-gradient(-180deg, #0078d4 0%, #00ffff 100%);
}

.zoomcontrolbar .ui-slider-handle {
    width: 12px;
    height: 12px;
    border: 2px solid #55595c;
    background: #fff;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    outline: none;
    cursor: pointer;
    left: -0.5px;
    margin-bottom: -8px;
}


.color-noti-0 {
    color: #d9320b !important;
}
.color-noti-A {
    color: #888 !important;
}
.color-noti-P {
    color: #ccc !important;
}
.color-others {
    color: #999 !important;
}

.btn_zoom_plus {
    width: 28px;
    height: 28px;
    margin: 0;
    padding: 0;
    border: 1px solid #e3e3e3;
    background: #fff url(/images/icon_plus.svg) center no-repeat;
    background-size: 12px;
    border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;
    -webkit-border-radius: 3px 3px 0 0;
    cursor: pointer;
}
.btn_zoom_plus:hover, .btn_zoom_plus.on {
    background-color: #d8dadc;
}
.btn_zoom_plus.off {
    background-color: #d8dadc;
    background-image: url(/images/icon_plus_disabled.svg);
}

.btn_zoom_minus {
    width: 28px;
    height: 28px;
    margin: 0;
    padding: 0;
    border: 1px solid #e3e3e3;
    background: #fff url(/images/icon_minus.svg) center no-repeat;
    background-size: 12px;
    border-radius: 0 0 3px 3px;
    -moz-border-radius: 0 0 3px 3px;
    -webkit-border-radius: 0 0 3px 3px;
    cursor: pointer;
}
.btn_zoom_minus:hover, .btn_zoom_minus.on {
    background-color: #d8dadc;
}
.btn_zoom_minus.off {
    background-color: #d8dadc;
    background-image: url(/images/icon_minus_disabled.svg);
}

.btn_cancelinput {
    width: 23px;
    height: 23px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent url(/images/btn_text_cancle.svg) center no-repeat;
    background-size: 13px;
    cursor: pointer;
}

.btn_close {
    width: 24px;
    height: 24px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent url(/images/icon_close.svg) center no-repeat;
    background-size: 16px;
    cursor: pointer;
}

.btn_close:hover, .btn_close.on {
    background-image: url(/images/icon_close_hover.svg);
}

.btn_search {
    width: 38px;
    height: 38px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent url(/images/icon_search.svg) center no-repeat;
    background-size: 18px;
    cursor: pointer;
}

.btn_search:hover, .btn_search.on {
    background-image: url(/images/icon_search_hover.svg);
}

.btn_trash {
    width: 38px;
    height: 36px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent url(/images/icon_bin.svg) center no-repeat;
    background-size: 17px 18px;
    cursor: pointer;
}

.btn_trash.list {
    background: transparent url(/images/icon_list.svg) center no-repeat;
    background-size: 16px 15px;
    cursor: pointer;
}

.btn_trash.list:hover, .btn_trash.list.on {
    background-image: url(/images/icon_list_hover.svg);
}

.btn_more {
    width: 28px;
    height: 28px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent url(/images/icon_more.svg) center no-repeat;
    background-size: 16px;
    cursor: pointer;
}

.btn_more:hover, .btn_more.on {
    background-image: url(/images/icon_more_hover.svg);
}

.btn_next {
    width: 28px;
    height: 28px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent url(/images/btn_next.svg) center no-repeat;
    background-size: 16px;
    cursor: pointer;
}

.btn_next:hover, .btn_next.on {
    background-image: url(/images/btn_next_hover.svg);
}

.btn_back {
    width: 38px;
    height: 38px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent url(/images/btn_previous.svg) center no-repeat;
    background-size: 16px;
    cursor: pointer;
}

.btn_back:hover, .btn_back.on {
    background-image: url(/images/btn_previous_hover.svg);
}

.btn_common_t1:hover, .btn_common_t1.on {
    background: #B6BAC3 !important
}
.btn_common_t1:disabled, .btn_common_t1.off {
    border: 1px solid #2a343e;
    background: #2f3646;
    color: #47546a;
    cursor: default;
}

.btn_common_t1 {
    width: 100px;
    height: 52px;
    padding: 0;
    margin-right: 10px;
    border: 1px #2A2E35 solid;
    background: #fff;
    font-size: 15px;
    text-align: center;
    color: #2A2E35;
    cursor: pointer;
    border-radius: 2px;
}
.btn_common_r1:hover, .btn_common_r1.on {
    /* background: #232a35;*/
    border: 1px #fff solid;
}
.btn_common_r1:disabled, .btn_common_r1.off {
    color: #283041;
    background: #3d4758;
    cursor: default;
}

.btn_common_r1.next {
    background-image: url(/images/btn_next.svg);
    background-position: right 20px center;
    background-repeat: no-repeat;
    background-size: 16px;
}
.btn_common_r1.next:hover, .btn_common_r1.next.on {
    background-image: url(/images/btn_next.svg);
}
.btn_common_r1.next:disabled, .btn_common_r1.next.off {
    background-image: url(/images/btn_next_disabled.svg);
    cursor: default;
}

.btn_common_t2 {
    width: 100px;
    height: 52px;
    padding: 0;
    margin: 0;
    background: #00BECA;
    font-size: 15px;
    font-family: 'Roboto';
    text-align: center;
    color: #fff;
    cursor: pointer;
}
.btn_common_r2:hover, .btn_common_r2.on {
    background: #00A0AC !important;
}
.btn_common_r2:disabled, .btn_common_r2.off {
    color: #fff;
    background: #00A0AC;
    cursor: default;
}

.btn_common_r3 {
    width: 100%;
    height: 52px;
    padding: 0;
    margin: 0;
    border: 0;
    background: #72829d;
    font-size: 15px;
    font-family: 'Roboto';
    text-align: center;
    color: #fff;
    cursor: pointer;
}
.btn_common_r3:hover, .btn_common_r3.on {
    background: #47546a;
}
.btn_common_r3:disabled, .btn_common_r3.off {
    color: #72829d;
    background: #505c73;
    cursor: default;
}
.btn_common_r3.next {
    background-image: url(/images/btn_next.svg);
    background-position: right 20px center;
    background-repeat: no-repeat;
    background-size: 16px;
}
.btn_common_r3.next:hover, .btn_common_r3.next.on {
    background-image: url(/images/btn_next.svg);
}
.btn_common_r3.next:disabled, .btn_common_r3.next.off {
    background-image: url(/images/btn_next_disabled2.svg);
    cursor: default;
}

.btn_transparent {
    width: 100%;
    height: 52px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    font-size: 15px;
    text-align: center;
    color: #ddd;
    cursor: pointer;
}
.btn_transparent:hover, .btn_transparent.on {
    color: #fff;
    font-weight: bold;
}
.btn_transparent:disabled, .btn_transparent.off {
    color: #888;
    font-weight: normal;
    cursor: default;
}

.btn_iconbutton {
    width: auto;
    height: auto;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    text-align: center;
    color: #ccc;
    cursor: pointer;
}
.btn_iconbutton:hover, .btn_iconbutton.on {
    color: #fff;
}
.btn_iconbutton:disabled, .btn_iconbutton.off {
    color: #565656;
    cursor: default;
}
.btn_iconbutton.green {
    color: #46a764;
}
.btn_iconbutton.green:hover, .btn_iconbutton.on.green {
    color: #1ee85c;
}

.btn_download {
    min-width: 70px;
    height: 32px;
    padding: 7px 10px 7px 36px;
    margin: 0;
    border: 1px solid #72829d;
    background: #283041 url(/images/icon_download.svg) left 8px center no-repeat;
    background-size: 20px;
    font-size: 13px;
    font-family: 'Roboto';
    color: #d8dadc;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: left;
    cursor: pointer;
}
.btn_download:hover, .btn_download.on {
    background-color: #20232d;
}

.form-btm-line-error { border-bottom: 1px solid #d9320b !important; }
.form-btm-line-ok,
.form-btm-line-on { border-bottom: 1px solid #6899eb !important; }

.ficon-ok {
    background-image: url(/images/icon_confirm.svg) !important;
    background-position: right center !important;
    background-repeat: no-repeat !important;
    background-size: 13px !important;
}

.ficon-error {
    background-image: url(/images/icon_error.svg) !important;
    background-position: right center !important;
    background-repeat: no-repeat !important;
    background-size: 13px !important;
}

.ee-icon {
    display: inline-block;
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    vertical-align: middle;
}

.ee-icon-signin {
    /* background: transparent url(/images/icon_signin.svg) center no-repeat; */
    background-size: 19px 18px;
}
.ee-icon-siginin:hover {
    /* background-image: url(/images/icon_signin_hover.svg); */
}

.b-icon-profile {
    padding-left: 50px !important;
    background-image: url(/images/icon_profile.svg) !important;
    background-position: 15px center !important;
    background-repeat: no-repeat !important;
    background-size: 19px 19px !important;
}
.b-icon-profile:hover {
    background-image: url(/images/icon_profile_hover.svg) !important;
}

.b-icon-goto {
    padding-left: 50px !important;
    background-image: url(/images/icon_signout.svg) !important;
    background-position: 15px center !important;
    background-repeat: no-repeat !important;
    background-size: 19px 19px !important;
}
.b-icon-goto:hover {
    background-image: url(/images/icon_signout_hover.svg) !important;
}

.b-icon-logout {
    padding-left: 50px !important;
    background-image: url(/images/icon_signout.svg) !important;
    background-position: 15px center !important;
    background-repeat: no-repeat !important;
    background-size: 19px 19px !important;
}
.b-icon-logout:hover {
    background-image: url(/images/icon_signout_hover.svg) !important;
}

.b-icon-setting {
    padding-left: 50px !important;
    background-image: url(/images/icon_setting.svg) !important;
    background-position: 15px center !important;
    background-repeat: no-repeat !important;
    background-size: 19px 19px !important;
}
.b-icon-setting:hover {
    background-image: url(/images/icon_setting_hover.svg) !important;
}

.selectric-selectmbox .label {
    padding-left: 37px;
    background-image: url(/images/icon_profile.svg);
    background-position: 2px center;
    background-repeat: no-repeat;
    background-size: 19px 19px;
}

.pagination,
.pagination li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pagination .page-item {
    display: inline-block;
    padding: 0 10px;
    min-width: 10px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 14px;
    font-family: 'Roboto';
    color: #72829d;
    cursor: pointer;
}
.pagination .page-item:hover {
    color: #6899eb;
}
.pagination .page-item.on {
    color: #fff;
    cursor: default;
}


.input-calendar {
    width: 120px;
    height: 38px;
    padding: 8px 32px 8px 10px;
    font-size: 14px !important;
    font-family: 'Noto Sans' !important;
    color: #fff;
    background: #283041 url(/images/btn_calendar.svg) right 6px center no-repeat;
    background-size: 22px;
    border: 1px solid #47546a;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
}
.input-calendar:hover {
    background-image: url(/images/btn_calendar_hover.svg);
}
.input-calendar::placeholder {
    color: #72829d;
}
.input-calendar:focus {
    border-bottom: 1px solid #6899eb;
}
.input-calendar:disabled {
    color: rgba(255, 255, 255, 0.1);
    background-color: rgba(255, 255, 255, 0.1);
    background-image: url(/images/btn_calendar_disabled.svg);
    border: 1px solid transparent;
    cursor: default;
}
.input-calendar:disabled::placeholder {
    color: transparent;
}


.ui-datepicker {
    width: auto;
    padding: 40px 20px 12px 20px;
    background: #2b3034;
    border: 0 !important;
    border-radius: 8px;
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.25);
}
.ui-datepicker .ui-datepicker-header {
    border: 0;
    background: transparent;
    padding: 0;
    margin: 0;
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-title {
    position: relative;
    padding-bottom: 15px;
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-month {
    padding-left: 5px;
    font-size: 15px;
    color: #fff;
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-year {
    position: absolute;
    top: -22px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 11px;
    color: #aaa;
}
.ui-datepicker table {
    width: auto !important;
}
.ui-datepicker td {
    padding: 3px;
}
.ui-datepicker .ui-datepicker-calendar thead {
    color: #aaa;
    text-align: center;
}
.ui-datepicker .ui-datepicker-calendar thead th {
    font-size: 9px;
    font-weight: normal;
    padding: 0;
    width: 26px;
    height: 26px;
}
.ui-datepicker .ui-datepicker-calendar tbody {
    font-size: 12px;
    color: #aaa;
    text-align: center;
}
.ui-datepicker .ui-datepicker-calendar thead .ui-datepicker-week-end:first-child,
.ui-datepicker .ui-datepicker-calendar tbody .ui-datepicker-week-end:first-child a {
    color: #eb4d4d;
}
.ui-datepicker .ui-datepicker-calendar thead .ui-datepicker-week-end:last-child,
.ui-datepicker .ui-datepicker-calendar tbody .ui-datepicker-week-end:last-child a {
    color: #56dbe6;
}
.ui-datepicker .ui-datepicker-calendar tbody td .ui-state-default {
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    color: #aaa;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ui-datepicker .ui-datepicker-calendar tbody td a:hover {
    color: #fff;
}
.ui-datepicker .ui-datepicker-calendar tbody td a.ui-state-highlight {
    color: #fff;
    background: #ef6f1f;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}
.ui-datepicker .ui-datepicker-calendar tbody td.ui-state-disabled .ui-state-default {
    color: #777;
}

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
    width: 32px;
    height: 32px;
    background: #2b3034;
    color: #aaa;
    border: 0;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    cursor: pointer;
}
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
    display: none;
}
.ui-datepicker .ui-datepicker-prev:before {
    content: "<";
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}
.ui-datepicker .ui-datepicker-next:before {
    content: ">";
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}
.ui-datepicker .ui-datepicker-prev:hover, .ui-datepicker .ui-datepicker-next:hover {
    color: #fff;
    border: 0;
    background: #ef6f1f;
}

.ol-area-button, .ol-area-button button i {
    cursor: pointer !important;
}

.cd-frame .cd-contents .mc-form-row .searchbox {
    margin: 0;
    padding: 6px 68px 6px 15px;
    width: 100%;
    height: 100%;
    font-size: 13px;
    font-family: 'Noto Sans';
    color: #fff;
    background: transparent;
    border: 1px solid #47546a;
}
.cd-frame .cd-contents .mc-form-row .searchbox::placeholder {
    color: #72829d;
}
.cd-frame .title {
    display: flex;
    padding: 0 40px 0 25px;
    align-items: center;
    height: 28px;
    font-size: 13px;
    color: #fff;
    margin-bottom: 4px;
}

.cd-rContents .backBtn,
.cd-tContents .backBtn{
    background: transparent url(/images/arrow-left-solid.svg) center no-repeat;
    position: absolute;
    top: 15px;
    left: 20px;
    width: 24px;
    height: 24px;
    padding: 0;
    margin: 0;
    border: 0;
    background-size: 16px;
    cursor: pointer;
}

.cd-tContents .backBtn,
.cd-rContents .backBtn :hover{
    filter: opacity(0.6) drop-shadow(0 0 0 white);
}

.cd-tContents .cd-contents .title,
.cd-rContents .cd-contents .title{
    display: flex;
    padding: 0 40px 0 35px;
    align-items: center;
    height: 15px;
    font-size: 13px;
    color: #fff;
    /*margin-bottom: 4px;*/
}

.cd-rContents .cd-contents div[name=rUnData],
.cd-rContents .cd-contents div[name=rData] {
    padding: 3px 0;
}

.cd-tContents .cd-contents .tCount {
    font-size: 14px;

}

.cd-rContents .cd-contents div[name=rUnData],
.cd-rContents .cd-contents div[name=rData] {
    padding-left: 35px;
    /*padding-top: 5px;*/
    padding-bottom: 5px;
    /*margin-top: 10px;*/
    /*border: 1px solid #47546a;*/
    /*background-color: #47546a;*/
    text-align: left;
    font-size: 14px;
    color: #fff;
}

.cd-tContents .cd-contents .tData {
    padding: 0 30px;
    margin-top: 5px;
    margin-bottom: 5px;
    text-align: left;
    font-size: 14px;
    color: #fff;
}

.cd-contents .norData{
    padding: 0 30px;
    margin-top: 5px;
    margin-bottom: 5px;
    text-align: left;
    font-size: 14px;
    color: #fff;
}
.cd-tContents .cd-contents .viewObject {
    /*position: relative;*/
    /*padding-left: 370px;*/
    overflow:hidden;
    height:auto;
    float: right;
    cursor: pointer;
}

.cd-rContents .cd-contents input[name=ruCid],
.cd-rContents .cd-contents  input[name=rCid] {
    width: 80px;
    height: 20px;
    border: 1px solid #2c3853;
    background-color: #565656;
    margin-left: 30px;
}

.cd-rContents .cd-contents div[name=rUnColor],
.cd-rContents .cd-contents div[name=rColor] {
    padding-top: 5px;
    padding-bottom: 5px;
}

.cd-rContents .cd-contents .btn_eyes {
    position: absolute;
    padding-top: 5px;
    padding-left: 10px;
    vertical-align: middle;
}

.cd-rContents .cd-contents div[name=searchData] {
    margin-top: 5px;
    margin-bottom: 5px;
    font-size: 15px;
}

.cd-tContents .cd-titlebar,
.cd-rContents .cd-titlebar {
    padding-left: 60px;
}

/*.cd-tContents .backBtn,*/
/*.cd-rContents .backBtn {*/
/*    position: absolute;*/
/*    padding-left: 40px;*/
/*    padding-top: 13px;*/
/*    font-size: 16px;*/
/*    color: #fff;*/
/*}*/

.cd-frame .period-date input{
    width: 265px;
}
.cd-frame .period-date input[name=sdate]{
    margin-left: 16px;
}
.cd-frame .period-date span{
    color: white;
}
.dialogReloadButton {
    position: absolute;
    top: 116px;
    right: 435px;
    width: 24px;
    height: 24px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent url(/images/btn_sync-alt-solid.svg) center no-repeat;
    background-size: 16px;
    cursor: pointer;
}
.cntResult {
    position: absolute;
    font-size: 14px;
    color: #fff;
    top: 15px;
    left: 200px;
    right: 435px;
    width: 100px;
    height: 24px;
}

.dialogReloadButton:hover {
    filter: opacity(0.6) drop-shadow(0 0 0 white);
}

.cd-rContents .dialogReloadButton {
    position: absolute;
    top: 14px;
    right: 310px;
    width: 24px;
    height: 24px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent url(/images/btn_sync-alt-solid.svg) center no-repeat;
    background-size: 16px;
    cursor: pointer;
}
.cd-rContents .dialogReloadButton:hover {
    filter: opacity(0.6) drop-shadow(0 0 0 white);
}

.cd-tContents .dialogReloadButton {
    position: absolute;
    top: 14px;
    right: 380px;
    width: 24px;
    height: 24px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent url(/images/btn_sync-alt-solid.svg) center no-repeat;
    background-size: 16px;
    cursor: pointer;
}
.cd-tContents .dialogReloadButton:hover {
    filter: opacity(0.6) drop-shadow(0 0 0 white);
}


.cd-frame .cd-tableHead {
    display: table;
    font-size: 12px;
    color: #fff;
    text-align: center;
    padding: 6px 15px 6px 0px;
    width: 100%;
}

.cd-frame .cd-tableBody {
    display: table;
    font-size: 12px;
    color: #fff;
    text-align: center;
    /*border: 1px solid #47546a;*/
    padding: 6px 15px 6px 15px;
    width: 100%;
}

.cd-frame .cd-tableBody .cd-tableRow{
    display: table-row;
    background: #2f3646;
    border: 1px solid #47546a;
}

.cd-frame .cd-tableBody .cd-tableCell{
    padding: 0px 0px 6px 0px;
    display: table-cell;
    background: #2f3646;
    border: 1px solid #47546a;
    text-align: left;
    height: 40px;
    width: 250px;
}

/* searchTab */
.cd-frame .cd-tableBody div[name="cd-tab"] .cd-tableCell{
    padding: 0px 0px 6px 0px;
    display: table-cell;
    background: #2f3646;
    border: 1px solid #47546a;
    text-align: left;
    height: 40px;
    width: 285px;
}

.cd-frame .cd-tableBody .selectType {
    position: absolute;
    min-height: 20px;
    padding-top: 10px;
    font-size: 13px;
}

.cd-frame .cd-tableCell .labelName {
    position: absolute;
    margin-left: 35px;
    padding-top: 10px;
}

.cd-frame .cd-tableBody .st_selectType {
    position: absolute;
    min-height: 40px;
    padding-top: 10px;
    font-size: 13px;
}

.cd-frame .cd-tableBody .dataSelectType {
    position: absolute;
    min-height: 40px;
    padding-top: 10px;
    font-size: 13px;
}

.cd-frame .cd-tableBody .cd-tableCell ::before {
    margin-top: 8px;
    margin-left: 6px;
}
.cd-frame .cd-tableBody .cd-tableCell ::after {
    margin-top: 8px;
    margin-left: 6px;
}

.cd-frame .cd-tableBody .selectric {
    background: #2f3646;
    /*border: 1px solid #47546a;*/
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.16);
    z-index: 1;
}

.cd-frame .cd-tableBody .selectric-open .selectric {
    background: #0e1013;
    border: 1px solid transparent;
}

.cd-frame .cd-tableBody .selectric .label {
    height: 36px;
    line-height: 36px;
}
.cd-frame .cd-tableBody .selectric .button {
    margin-top: 10px;
    height: 36px;
}
.cd-frame .cd-tableBody .selectric-items {
    z-index: 2;
}
.cd-frame .cd-tableBody .type_select .selectric-items ul,
.cd-frame .cd-tableBody .type_select .selectric-items li {
    min-height: 38px;
    line-height: 38px;
}

.cd-frame .cd-tableBody .selectric {
    position: absolute;
    margin-left: 28px;
    width: 255px;
    min-width: 113px;
}

.cd-frame .cd-tableBody .selectric-items {
    margin-left: 28px;
    margin-top: 38px;
    width: 255px;
}

.cd-frame .cd-tableBody div[name="table_structure"] .selectric-items li {
    padding-left: 10px;
}

.cd-frame .cd-tableBody div[name="table_turn"] .selectric-items li {
    padding-left: 10px;
}

.cd-frame .searchTab ul, .cd-frame .searchTab li {
    list-style: none;
    margin: 0;
    padding: 0;
}
.cd-frame .searchTab ul[name="searchTab"] {
    padding-left: 15px;
}

.cd-frame .searchTab {
    top: 0;
    left: 15px;
    right: 270px;
    bottom: 0;
}

.cd-frame .searchTab li[name="sDetail"],
.cd-frame .searchTab li[name="sError"] {
    float: left;
    width: auto;
    height: 30px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    border-bottom: 1px solid transparent;
    cursor: pointer;
    border: 1px solid #47546a;
}

.cd-frame .searchTab li[name="sDetail"].on,
.cd-frame .searchTab li[name="sDetail"]:hover,
.cd-frame .searchTab li[name="sError"].on,
.cd-frame .searchTab li[name="sError"]:hover {
    color: #fff;
    background-image: -webkit-linear-gradient(#20232d 0%, #0e1013 100%);
    background-image: -moz-linear-gradient(#20232d 0%, #0e1013 100%);
    background-image: -o-linear-gradient(#20232d 0%, #0e1013 100%);
    background-image: linear-gradient(#20232d 0%, #0e1013 100%);
    border-bottom: 1px solid #fff;
}

.cd-frame .btn_search_div {
    position: absolute;
    margin-left: 315px;
    padding-top: 5px;
    padding-bottom: 10px;
}

.cd-frame .btn_exit_div {
    position: absolute;
    margin-left: 315px;
    padding-top: 5px;
    padding-bottom: 10px;
}

.cd-frame .btn_close_div {

    margin-left: 100px;
    padding-top: 5px;
    padding-bottom: 10px;
}

.cd-frame .btn_common_t2 {
    width: 190px;
    padding-top: 10px;
}

.btn_common_t2:hover, .btn_common_t2.on {
    background: #00A0AC;
    color: #FFFFFF;
}

.btn_common_t2:disabled, .btn_common_t2.off {
    border: 1px solid #47546a;
    background: #2f3646;
    color: #47546a;
    cursor: default;
}

.cd-frame .lineOption {
    width: 60px;
    margin-left: 30px;
    font-size: 13px;
    font-family: 'Noto Sans';
    color: #fff;
    background: #3d4758;
    border: 1px solid #47546a;
}

.cd-frame .speedCnt {
    width: 60px;
    margin-left: 25px;
    font-size: 13px;
    font-family: 'Noto Sans';
    color: #fff;
    background: #3d4758;
    border: 1px solid #47546a;
}

.cd-frame .btn_updown {
    /*position: absolute;*/
}

.cd-frame button[name="speedUpBtn"],
.cd-frame button[name="laneUpBtn"] {
    background: center no-repeat;
    filter: opacity(0.6) drop-shadow(0 0 0 white);
    position: absolute;
    top: 0px;
    left: 200px;
    width: 24px;
    height: 24px;
    padding: 0;
    margin: 0;
    border: 0;
    background-size: 16px;
    cursor: pointer;
    color: #FFFFFF;
    /*background: #FFFFFF;*/
}

.cd-frame button[name="speedDownBtn"]:hover,
.cd-frame button[name="laneDownBtn"]:hover,
.cd-frame button[name="speedUpBtn"]:hover,
.cd-frame button[name="laneUpBtn"]:hover {
    color: darkred;
}

.cd-frame button[name="speedDownBtn"].on,
.cd-frame button[name="speedUpBtn"].on,
.cd-frame button[name="laneDownBtn"].on,
.cd-frame button[name="laneUpBtn"].on {
    /*filter: opacity(0.6) drop-shadow(0 0 0 #47546a);*/
    color: #6899eb;
    font-weight: bold;
}

.cd-frame .speedDownBtn,
.cd-frame .laneDownBtn {
    position: absolute;
    top: 15px;
    left: 200px;
    width: 24px;
    height: 24px;
    padding: 0;
    margin: 0;
    border: 0;
    background-size: 16px;
    cursor: pointer;
    filter: opacity(0.6) drop-shadow(0 0 0 white);
    background: center no-repeat;
    color: #FFFFFF;
}

.btn_refresh {
    position: absolute;
    top: 10px;
    right: 140px;
    width: 200px;
    background-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 50px;
    height: 32px;
    padding: 0 15px;
    margin: 0;
    border: 0;
    color: #eee;
    background: #7c99e4;
    border-radius: 18px;
    cursor: pointer;
    font-size: 13px !important;
}

.btn_refresh:hover, .btn_refresh.on {
    color: #fff;
    background: #506394;
}

.btn_refresh .bboxRefresh {
    display: inline-block;
    /*width: 24px;*/
    height: 24px;
    margin: 2px 4px 0 0;
    /*background: transparent url(/images/btn_bboxRefresh.png) center no-repeat;*/
    background-size: 24px;
}

.rememberlogin [type="checkbox"]:checked + label:after {
    color: white;     
}

.rememberlogin {
    padding: 12px 0 20px 5px;
    text-align: start;
    color: #989FAC;
    font-size: 14px;
    font-family: Pretendard;
    font-weight: 500;
    line-height: 18px;
    word-wrap: break-word;
}

.message-error {
    color: rgba(217, 69, 69, 1);
    font-weight: 500;
    font-size: 12px;
    line-height: 18px;
    width: 100%;
    display: block;
    text-align: center;
    height: 20px;
    padding: 10px 0px 20px 2%;
}

.message-error-repass {
    color: rgba(217, 69, 69, 1);
    font-weight: 500;
    font-size: 12px;
    line-height: 18px;
    display: block;
    margin-left: 150px;
}

.logo-ft {
    position: absolute;
    bottom: 15px;
    width: 100%;
}
.btn_login {
    width: 100%;
    background: #00BECA;
    padding: 15px;
    border: none;
    color: white;
    font-size: 14px;
    font-family: Pretendard;
    font-weight: 500;
    line-height: 18px;
    word-wrap: break-word
}
.btn_resetpass {
    color: #00BECA;
    font-size: 14px;
    font-family: Pretendard;
    font-weight: 500;
    line-height: 18px;
    word-wrap: break-word;
    height: auto;
    padding:0 10px 1px 10px;
    width: auto !important;
    margin-top: 20px;
}
.btn_resetpass:hover {
    font-weight: 500;
    border-bottom: 1px #00BECA solid;
    color: #00BECA;
}

.pass-symbols {
    width: 30px;
    height: 30px;
    background: transparent url(/images/eye_close.svg) center no-repeat;
    display: flex;
    position: absolute;
    /* margin-top: -35px;
    margin-left: 315px; */
    z-index: 999;
    top: 35px;
    right: 2px;
}
.pass-symbols.off {
    background: transparent url(/images/eye_open.svg) center no-repeat;
}

.rep-box {
    padding: 20px;
    background-color: #F9F9F9;
    color: #4D5562;
    font-size: 14px;
    font-family: Pretendard;
    font-weight: 700;
    line-height: 18px;
    word-wrap: break-word
}

.form_bt {
    text-align: center;
    padding: 24px;
    border-top: 1px #eee solid;
    margin-top: 20px;
}

.mess-rsp {
    padding: 25px 0;
    color: #3D424C;
    font-size: 14px;
    font-family: Pretendard;
    font-weight: 400;
    line-height: 20px;
    word-wrap: break-word;
    text-align: center;
    width: 100%;
}


/*********************language dropdow************/
#gnb_lang {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
}

.nav-wrapper {
    text-align: center;
}
.sl-nav {
    display: inline;
}
.sl-nav ul {
    margin:0;
    list-style: none;
    position: relative;
    display: inline-block;
}
.sl-nav li {
    cursor: pointer;
    padding:16px 12px;
}
.sl-nav li ul {
    display: none;
}
.sl-nav li:hover ul {
    position: absolute;
    top: 50px;
    right: 0px;
    display: block;
    background: #2A2E35;
    padding-top: 0px;
    z-index: 1;
    border-radius: 0px;
}
.sl-nav li:hover .triangle {
    position: absolute;
    top: 55px;
    right: 23px;
    z-index:10;
    height: 14px;
    overflow:hidden;
    width: 30px;
    background: transparent;
    display: none;
}
.sl-nav li:hover .triangle:after {
    content: '';
    display: block;
    z-index: 20;
    width: 15px;
    transform: rotate(45deg) translateY(0px) translatex(10px);
    height: 15px;
    background: #fff;
    border-radius:2px 0px 0px 0px;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.2);
}
.sl-nav li ul li {
    position: relative;
    text-align: left;
    background: transparent;
    padding-bottom:0;
    z-index: 2;
}
.sl-nav li ul li{
    padding-bottom: 15px;
}
.sl-nav li ul li span {
    padding:5px 14px;
}
.sl-nav li ul li:hover {
    background-color: #4D5562 ;
    border-top: 1px #2A2E35 solid;
    color: #fff;
}
.sl-nav li ul li.deactive {
    display: none;
}
.dropd_lang {
    height: 16px;
    margin: 6px 6px;
    color: #0D3A4F;
}
.language_select {
    display: flex;
    justify-content: center;
    vertical-align: middle;
    span {
        color: white;
        font-size: 14px;
        font-family: Pretendard;
        font-weight: 500;
        line-height: 18px;
        word-wrap: break-word;
        margin: 0 10px;
        padding: 0px;
    }
    .rtg {
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }
}
.language_select:hover {
    background-color: #4D5562;
    .rtg {
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
/*----End button language----*/


.sub-bi-text {
    font-weight: 700;
    font-size: 20px;
    line-height: 28px;
    color: #D3D6DA;
    margin-top: 20px;
}

.noti-text {
    color: #6C7789;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    text-align: left;
    width: 100%;
    display: block;
    padding-left: 2%;
}

/** Text Input **/
input[type="text"], input[type="password"] {
    border: 1px solid  #6C7789 !important;;
    color: #2A2E35;
    &:hover {
        border: 1px solid #989FAC !important;;
    }
    &:focus {
        border: 1px solid #00BECA !important;
        caret-color:#00BECA
    }
    &:focus-visible {
        border: 1px solid #00BECA !important;
        caret-color:#00BECA
    } 
    &::placeholder {
        color: #6C7789 !important;
    }
    &:active {
        border: 1px solid #989FAC !important;
    }
    &.content-text { 
        border: 1px solid #989FAC !important;
        caret-color: #989FAC
    }
    &.error {
        border: 1px solid #FC3B22 !important;
    }
}

input[type="email"] {
    border: 1px solid  #D3D6DA !important;;
    color: #2A2E35;
    &:hover {
        border: 1px solid #4D5562 !important;;
    }
    &:focus {
        border: 1px solid #00BECA !important;
        caret-color:#00BECA
    }
    &:focus-visible {
        border: 1px solid #00BECA !important;
        caret-color:#00BECA
    } 
    &::placeholder {
        color: #989FAC !important;
    }
    &:active {
        border: 1px solid #4D5562 !important;
    }
    &.content-text {
        border: 1px solid #4D5562 !important;
        caret-color: #4D5562
    }
    &.error {
        border: 1px solid #FC3B22 !important;
    }
}