@charset "utf-8";

html {height:100%; font-size:14px;}
body, h1, h2, h3, h4, h5, h6, fieldset, ul, ol, dl, dt, dd, p, button, figure, xmp {margin:0; padding:0;}
body {line-height:1.5; font-family:"Nanum Gothic", "맑은 고딕", "Malgun Gothic", "roboto", "돋움", Dotum, Helvetica, Arial, sans-serif; color:#333333; word-break:keep-all; -webkit-touch-callout:none; box-sizing:border-box; -webkit-text-size-adjust:none; text-size-adjust:none;}
legend, caption {position:absolute !important; height:1px; width:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); clip:rect(1px 1px 1px 1px); word-break:initial; word-wrap:initial;}
a {text-decoration:none; color:inherit;}
a[href^="tel"] {cursor:default;}
img {vertical-align:middle; border:0 none;}
fieldset, button {background:none; border:0;}
ul::after,ol::after {content:''; display:block; clear:both;}
li {list-style:none;}
table {position:relative; width:100%; border-spacing:0; border-collapse:collapse;}
iframe {width:100%; vertical-align:middle; border:0 none;}
hr {margin:1.25em 0; border:0 none; height:1px; background:#ccc;}
button, input, optgroup, select, textarea {font:inherit;}
button {cursor:pointer;}
h1, h2, h3, h4, h5, h6 {font-weight:400; -webkit-font-smoothing:subpixel-antialiased;}
input, select, textarea {padding:0; -webkit-appearance:none; -moz-appearance:none; appearance:none; -webkit-border-radius:0; border-radius:0; border:none;}
input::-ms-clear {display:none;}
input[type=password]::-ms-reveal {display:none;}
b, strong {font-weight:700;}
em {font-style:inherit;}
* {box-sizing:border-box;}
body {height:auto; min-height:100%; min-height:100%; background-color:#f5f5f5; overflow-y:hidden;}
html {height:100%;}

:root {
    /* COLOR */
    --star-requried-color: #e4423b;
    --total-color: #007dc6;
    --danger-color: #e4423b;
    --warning-color: #db8330;
    --cost-color: #007dc6;
    --primary-color: #007dc6;
    --light-gray-color: #ccc;
    --gray-color: #aaa;
    --dark-gray-color: #666;
    --success-color: #1ead56;
}

/* COMMON */
.col {width:100%!important;}
.col-1 {width:8.3%!important;}
.col-2 {width:16.6%!important;}
.col-3 {width:24.9%!important;}
.col-4 {width:33.2%!important;}
.col-5 {width:41.5%!important;}
.col-6 {width:49.8%!important;}
.col-7 {width:58.1%!important;}
.col-8 {width:66.4%!important;}
.col-9 {width:74.7%!important;}
.col-10 {width:83%!important;}
.col-11 {width:91.3%!important;}
.col-12 {width:100%!important;}

.center {text-align:center!important;}
.left {text-align:left!important;}
.right {text-align:right!important;}
.mgr-0 {margin-right:0!important;}
.mglr-0 {margin-left:0!important; margin-right:0!important;}
.mgt-5 {margin-top:5px!important;}
.mgt-10 {margin-top:10px!important;}
.mgt-15 {margin-top:15px!important;}
.mgt-20 {margin-top:20px!important;}
.mgt-30 {margin-top:30px!important;}
.mgb-5 {margin-bottom:5px!important;}
.mgb-10 {margin-bottom:10px!important;}
.mgb-15 {margin-bottom:15px!important;}
.mgb-20 {margin-bottom:20px!important;}
.mgb-30 {margin-bottom:30px!important;}
.mgl-0 {margin-left:0!important;}
.mgl-5 {margin-left:5px!important;}
.mgl-10 {margin-left:10px!important;}
.mgl-20 {margin-left:20px!important;}
.mgl-30 {margin-left:30px!important;}
.mgl-50 {margin-left:50px!important;}
.mgr-5 {margin-right:5px!important;}
.mgr-10 {margin-right:10px!important;}
.mgr-20 {margin-right:20px!important;}
.mgr-30 {margin-right:30px!important;}

.pdr-0 {padding-right:0!important;}
.pdlr-0 {padding-left:0!important; padding-right:0!important;}
.pdt-5 {padding-top:5px!important;}
.pdt-10 {padding-top:10px!important;}
.pdt-15 {padding-top:15px!important;}
.pdt-20 {padding-top:20px!important;}
.pdt-30 {padding-top:30px!important;}
.pdb-5 {padding-bottom:5px!important;}
.pdb-10 {padding-bottom:10px!important;}
.pdb-15 {padding-bottom:15px!important;}
.pdb-20 {padding-bottom:20px!important;}
.pdb-30 {padding-bottom:30px!important;}
.pdl-0 {padding-left:0!important;}
.pdl-5 {padding-left:5px!important;}
.pdl-10 {padding-left:10px!important;}
.pdl-20 {padding-left:20px!important;}
.pdl-30 {padding-left:30px!important;}
.pdl-50 {padding-left:50px!important;}
.pdr-5 {padding-right:5px!important;}
.pdr-10 {padding-right:10px!important;}
.pdr-20 {padding-right:20px!important;}
.pdr-30 {padding-right:30px!important;}
.pdv-5 {padding-left:5px!important; padding-right:5px!important;}
.pdv-10 {padding-left:10px!important; padding-right:10px!important;}
.pdv-15 {padding-left:15px!important; padding-right:15px!important;}
.pdv-20 {padding-left:20px!important; padding-right:20px!important;}
.pdh-5 {padding-top:5px!important; padding-bottom:5px!important;}
.pdh-10 {padding-top:10px!important; padding-bottom:10px!important;}
.pdh-15 {padding-top:15px!important; padding-bottom:15px!important;}
.pdh-20 {padding-top:20px!important; padding-bottom:20px!important;}

.none {display:none!important;}
.block {display:block!important;}
.display-flex {display:flex!important;}
.display-flex-wrap {flex-wrap:wrap!important;}
.flex-el-width-auto {flex: 0 0 auto;!important;}
.justify-content-start {justify-content:flex-start!important;}
.justify-content-center {justify-content:center!important;}
.justify-content-end {justify-content:flex-end!important;}
.justify-content-between {justify-content:space-between!important;}
.align-item-start {align-items:flex-start!important;}
.align-item-center {align-items:center!important;}
.align-item-end {align-items:flex-end!important;}
.grow-full {flex-grow:1;}
.cursor-pointer {cursor: pointer;}

.flex-gap2 {gap: 2px;}
.flex-gap4 {gap: 4px;}
.flex-gap5 {gap: 5px;}
.flex-gap6 {gap: 6px;}
.flex-gap8 {gap: 8px;}
.flex-gap10 {gap: 10px;}
.flex-gap15 {gap: 15px;}
.flex-gap20 {gap: 20px;}
.flex-gap25 {gap: 25px;}

.rounded-5 {border-radius: 5px!important;}
.rounded-10 {border-radius: 10px!important;}
.rounded-15 {border-radius: 15px!important;}

/* 너비 * 높이 */
.w-100 {width: 100px!important;}
.w-150 {width: 150px!important;}
.w-200 {width: 200px!important;}
.w-250 {width: 250px!important;}
.w-300 {width: 300px!important;}
.w-350 {width: 350px!important;}
.w-400 {width: 400px!important;}
.w-500 {width: 500px!important;}
.w-600 {width: 600px!important;}

.h-550 {height: 550px!important;}
.h-600 {height: 600px!important;}
.h-650 {height: 650px!important;}

.blind {position:absolute !important; height:1px; width:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); clip:rect(1px 1px 1px 1px); word-break:initial; word-wrap:initial;}
.star-requried {color:#e4423b!important;}
.total {color:#007dc6!important;}
.danger {color:#e4423b!important;}
.warning {color:#db8330!important;}
.cost {color:#007dc6!important;}
.primary {color:#007dc6!important;}
.light-gray {color:#ccc!important;}
.gray {color:#aaa!important;}
.dark-gray {color:#666!important;}
.bold {font-weight:700!important;}
.medium {font-weight:400!important;}
.fw-normal {font-weight:normal!important;}
.ws-nowrap {white-space: nowrap!important;}
.bg-light-blue {background-color:#f1f5f9!important;}
.bg-none {background: none!important;}

.text-align-center {text-align: center!important;}
.text-align-right {text-align: right!important;}
.text-align-left {text-align: left!important;}

/* FONT */
.fs-12 {font-size: 12px!important;}
.fs-13 {font-size: 13px!important;}
.fs-14 {font-size: 14px!important;}
.fs-15 {font-size: 15px!important;}
.fs-16 {font-size: 16px!important;}
.fs-17 {font-size: 17px!important;}
.fs-18 {font-size: 18px!important;}
.fs-19 {font-size: 19px!important;}
.fs-20 {font-size: 20px!important;}
.fs-21 {font-size: 21px!important;}
.fs-22 {font-size: 22px!important;}
.fs-23 {font-size: 23px!important;}
.fs-24 {font-size: 24px!important;}
.fs-25 {font-size: 25px!important;}

.pst-rel {position: relative!important;}
.pst-abs {position: absolute!important;}

/* SCROLL */
::-webkit-scrollbar {width:8px; height:8px;}
::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment {display:block; width:0; height:0; background: rgba(0, 0, 0, 0.02);}
::-webkit-scrollbar-track {background:rgba(0, 0, 0, 0.05);}
::-webkit-scrollbar-thumb {background:rgba(0, 0, 0, 0.2); cursor:pointer; border-radius:6px;}

/* ELLIPSIS - ONE LINE */
.as_ellipsis {display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; -ms-text-overflow:ellipsis; -webkit-text-overflow:ellipsis;}
.blur img {-webkit-filter:blur(6px); -moz-filter:blur(6px);}

/* ELLIPSIS - MULTI LINE */
.multiline {position:relative; width:100%; max-height:4.2rem; margin:auto; overflow:hidden; text-align:justify; line-height:1.4; text-overflow:ellipsis; word-break:normal; word-wrap:normal;}
.multiline::before, .multiline::after {content:'...'; position:absolute; top:3em; right:0; line-height:1; -ms-wrap-flow:start;} /* IE */
.multiline::after {background:currentColor; color:white; top:auto;}
@supports (-webkit-line-clamp:2) {/* 멀티라인이 2줄일 경우 */
    .multiline {-webkit-box-orient:vertical; display:-webkit-box; -webkit-line-clamp:2;}
    .multiline::before, .multiline::after {content:normal;}
}

/* MIX */
.h-wrap + .h-wrap .h3 {margin-top:20px;}
.h-wrap + .input-area {margin-top:10px;}
.h-wrap + .table-wrap {margin-top:10px;}
.h-wrap + .board-group {margin-top:10px;}
.input-area + .input-area {margin-top:30px;}
.input-area + .table-info-area {margin-top:15px;}
.btn-wrap + .h-wrap .h3 {margin-top:30px}
.table-wrap + .btn-wrap {margin-top:20px;}
.table-wrap + .h-wrap {margin-top:20px;}
.flex-wrap + .table-info-area {margin-top:10px;}
.popup-wrap .flex-wrap + .table-info-area {margin-top:20px;}
.flex-wrap .check-wrap + .marker {margin-left:5px;}
.sale-area + .staff-area {margin-top:10px;}
.staff-area + .memo-area {margin-top:10px;}
.memo-area + .btn-wrap {margin-top:20px;}
.table-info-area + .marker {margin-top:10px;}
.marker + .text-area {margin-top:20px;}
.text-area + .img-wrap {margin-top:10px;}
.table-info-area .data-table + .text-area {margin-top:10px;}
.table-info-area .data-table + .btn-wrap {margin-top:10px;}
.table-info-area .data-table + .btn-wrap + .bbs-paging {margin-top:10px;}
.text-area + .table-info-area {margin-top:5px;}
.flex-wrap.gap + .flex-wrap.gap .text-area {margin-left:5px;}
.table-wrap + .etc-area {margin-top:10px;}
.etc-area + .btn-wrap {margin-top:20px;}
.h-wrap + .marker-wrap {margin-top:5px;}
.marker-wrap + .marker {margin-top:5px;}
.flex-wrap > ul + .text-wrap {margin-left:20px!important;}
.flex-wrap > ul li {flex-wrap:inherit!important;}
.h-wrap + .tab-wrap {margin-top:10px;}
.tab-wrap + .flex-wrap {margin-top:20px;}
.h-wrap.flex-wrap + .flex-wrap {margin-top:10px;}
.popup-wrap .select-wrap + .textarea-wrap {margin-top:10px;}
.popup-wrap .select-wrap + .textarea-wrap + .btn-wrap {margin-top:20px;}
.email-wrap input[type="text"] + .dash + input[type="text"] + .select-wrap {margin-left:5px;}
.email-wrap > input[type="text"]:first-of-type {margin-left:0;}
.flex-wrap span + .btn.btn-warning {margin-left:5px;}
.table-wrap + .text-area {margin-top:5px;}
.text-wrap.add-unit + .textarea-wrap {margin-top:5px;}
.table-wrap.table-info-area + .table-wrap.input-area {margin-top:10px;}
.table-wrap.table-info-area + .marker-wrap.line {margin-top:20px;}
.popup-body-heading + .h-wrap {margin-top:20px;}
.text-area + .customer-area {margin-top:10px;}
.customer-area .flex-wrap + .text-wrap {margin-top:10px;}
.customer-area + .btn-wrap {margin-top:20px;}
.excel-popup .flex-wrap.gap + .flex-wrap.gap {margin-top:10px;}
.flex-wrap .user-id + .btn {margin-left:10px;}
.h-wrap + .select-wrap {margin-top:10px;}
.flex-wrap.input-area + .h-wrap {margin-top:20px;}
.flex-wrap.justify-content-center .result + .btn-wrap {margin-left:10px;}
.comment-info + .comment-wrap {margin-top:10px;}
.data-table + .data-table.etc {margin-top:-1px;}
.data-table thead tr {background-color: #eaedf1;}

/* HEADING */
.h2 {font-size:18px; font-weight:700;}
.h3 {font-size:14px; font-weight:700;}
.h4 {font-size:12px; font-weight:700;}
.h-title {font-size:16px; font-weight:700;}
.h-wrap {display:flex; justify-content:flex-start;}

/* PLACEHOLDER */
::placeholder{font-size:0.85714rem; color:#999; line-height:1.5;}
::-webkit-input-placeholder{font-size:0.85714rem; color:#999; line-height:1.5;}
::-moz-placeholder{font-size:0.85714rem; color:#999; line-height:1.9;}
:-moz-placeholder{font-size:0.85714rem; color:#999; line-height:1.9;}
::-ms-input-placeholder{font-size:0.85714rem; color:#999; line-height:1.5;}
:-ms-input-placeholder{font-size:0.85714rem; color:#999; line-height:1.5;}

.text-area.small {font-size:0.85714rem;}

/* INPUT */
table input[type="text"],
table input[type="password"],
table input[type="number"],
table input[type="tel"],
table input[type="email"],
table input[type="search"] {appearance:none; padding:1px 8px; height:28px; font-size:0.85714rem; line-height:19px; border:1px solid #cccccc; vertical-align:middle; background-color:#f4f7fa; border-radius:2px;}

input, select, textarea {outline:none; font-size:0.85714rem;}
input[type="text"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="email"],
input[type="search"] {appearance:none; padding:1px 8px; height:28px; font-size:0.85714rem; line-height:19px; border:1px solid #cccccc; vertical-align:middle; background-color:#fff; border-radius:2px;}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="email"]:focus,
input[type="search"]:focus {border-color:#000; border-width:2px; padding:0 7px;}
input[type="text"][readonly],
input[type="password"][readonly],
input[type="number"][readonly],
input[type="tel"][readonly],
input[type="email"][readonly],
input[type="search"][readonly] {cursor:default; border-color:#ccc; background-color:#f7f7f7;}
input[type="text"][disabled],
input[type="password"][disabled],
input[type="number"][disabled],
input[type="tel"][disabled],
input[type="email"][disabled],
input[type="search"][disabled] {cursor:not-allowed; border-color:#ccc; background-color:#f7f7f7;}
input[type="text"][file],
input[type="password"][file],
input[type="number"][file],
input[type="tel"][file],
input[type="email"][file],
input[type="search"][file] {width:100%; background-color:#FFF; border:1px solid #ddd; font-size:0.85714rem;}
input[type="radio"] {opacity:0;}
input[type="radio"][disabled] + span  {opacity:0.5;}
input[type="checkbox"] {opacity:0;}
input[type="checkbox"][disabled] + span {opacity:0.5;}

/* TEXT WRAP */
input[type="text"],
input[type="password"],
.text-wrap {min-width:70px;}
.text-wrap input[type="text"],
.text-wrap input[type="password"] {width:100%;}
.text-wrap.add-unit {display:flex; justify-content:flex-start; align-items:center;}
.text-wrap.add-unit input[type="text"],
.text-wrap.add-unit input[type="password"] {padding-right:20px; color:#007dc6; font-weight:700;}
.text-wrap.add-unit input[type="text"] + .unit {margin-left:-19px; font-size:0.85714rem;}
.text-wrap.add-unit input[type="text"]:focus + .unit {margin-left:-20px;}

.calendar-wrap .text-wrap {position:relative; min-width:113px;}
.calendar-wrap .text-wrap > * {float:left;}
.calendar-wrap .text-wrap:after {display:block; clear:both; content:'';}
.calendar-wrap .text-wrap .btn-calendar {position:absolute; top:0; right:0; width:32px; height:28px; background:url(../image/ico-cal.png) no-repeat center center;}
.calendar-wrap .btn-calendar-search { padding: 3px 13px; background-color: var(--primary-color); color: #fff; }
.calendar-wrap .btn-calendar-search.radius-all { border-radius: 5px;}
.calendar-wrap .btn-calendar-reset { padding: 3px 13px; background-color: var(--success-color); color: #fff; }
.calendar-wrap .btn-calendar-reset.radius-all { border-radius: 5px;}
.calendar-group {display:flex; justify-content:flex-start;}
.calendar-group .calendar-wrap + .dash {display:flex; justify-content:center; align-items:center; margin-left:5px; margin-right:5px;}
.msie .calendar-group .calendar-wrap + .dash {width:30px;}

.datepicker-calendar {width:300px;}
.datepicker-calendar.after {top:27px; padding:10px; border-radius:3px; border:1px solid rgba(0,0,0,0.2); background-color:#f4f7fa;}
.datepicker-grid tbody td {padding:2px;}
.datepicker-month-wrap .pull-left,
.datepicker-month-wrap .pull-right {display:flex; justify-content:center; align-items:center; border-radius:3px; background-color:#fff;}
.datepicker-grid tbody td.cur-day.focus {background-color:#0085c7; border:1px solid #0085c7;}
.datepicker-grid tbody td.focus {border:2px solid #0085c7; box-sizing:border-box;}
.datepicker-grid .cur-day {background-color:#0085c7;}
.datepicker-close {top:10px; right:8px;}
.datepicker-month-wrap + .datepicker-grid {margin-top:5px;}

.discount {text-decoration: line-through;}

/* TEXTAREA WRAP*/
.textarea-wrap + .textarea-wrap {margin-top:5px;}
textarea {width:100%; min-height:50px; padding:5px; resize:vertical; -webkit-appearance:none; border:1px #ccc solid; background-color:#f4f7fa; vertical-align:middle; box-sizing:border-box; max-height: 150px;}
textarea:focus {padding:4px; border:2px solid #000;}
.textarea-wrap textarea.h-100 {height: 100px; min-height: 100px; max-height: 200px;}
.textarea-wrap .pre-line-top {white-space: pre-line;height: 600px;overflow-y: auto;}

/* SELECT WRAP */
table .select-wrap {position:relative; width:100%; height:28px; min-width:70px; border:1px solid #ccc; vertical-align:middle; border-radius:2px;  background-color:#f4f7fa;}
.select-wrap {position:relative; width:100%; height:28px; min-width:70px; border:1px solid #ccc; vertical-align:middle; border-radius:2px;  background-color:#fff;}
.select-wrap::after {display:block; position:absolute; top:calc(50% - 1px); right:8px; width:5px; height:5px; border-left:2px solid #333; border-bottom:2px solid #333; transform:translateY(-50%) rotate(-45deg); -webkit-transform:translateY(-50%) rotate(-45deg); -moz-transform:translateY(-50%) rotate(-45deg); -ms-transform:translateY(-50%) rotate(-45deg); content:"";}
select::-ms-expand {display:none; -moz-appearance:none; -webkit-appearance:none; appearance:none;}
select {width:100%; height:100%; font-size:0.85714rem; color:rgb(51, 51, 51); padding:0 20px 0 6px; background-color:transparent; white-space:nowrap; text-overflow:ellipsis;}


/* REDIO WRAP */
.radio-wrap {display:flex; justify-content:flex-start; flex-wrap:wrap;}
.radio-wrap label {position:relative; padding:5px 0; cursor:pointer; white-space:nowrap; }
.radio-wrap.gap label {margin-right:10px;}
.radio-wrap.gap label + label{margin-right:10px;}
.radio-wrap.gap label + .flex-wrap {margin-right:20px;}
.radio-wrap input[type="radio"] {position:absolute; left:0; top:0;}
.radio-wrap input[type="radio"] + .text {position:relative; padding-left:18px;}
.radio-wrap input[type="radio"] + .text::before {display:block; position:absolute; left:0; top:50%; width:14px; height:14px; border-radius:50%; background-color:#c8c8c8; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); content:"";}
.radio-wrap input[type="radio"] + .text::after {display:block; position:absolute; left:3px; top:50%; width:8px; height:8px; border-radius:50%; background-color:#fff; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); content:"";}
.radio-wrap input[type="radio"]:checked + .text::before {background-color:#355371;}

/* CHECK WRAP */
.check-wrap {display:flex; justify-content:flex-start; flex-wrap:wrap;}
.check-wrap > label {position:relative; padding:5px 0; cursor:pointer; white-space:nowrap;}
.check-wrap.gap label {margin-right:20px;}
.check-wrap.gap label:last-child {margin-right:0;}
.check-wrap.mix label {margin-right:0;}
.radio-wrap.gap label + label{margin-right:10px;}
.check-wrap.gap label + .flex-wrap {margin-right:20px;}
.check-wrap.gap label + .flex-wrap + .flex-wrap {margin-right:20px;}
/* .check-wrap.gap label + .flex-wrap + .flex-wrap {margin-left:20px;} */
.check-wrap input[type="checkbox"] {position:absolute; left:0; top:0;}
.check-wrap input[type="checkbox"] + .text {position:relative; padding-left:18px;}
.check-wrap.simple input[type="checkbox"] + .text {position:relative; padding-left:15px;}
.check-wrap input[type="checkbox"] + .text::before {display:block; position:absolute; left:0; top:50%;  width:14px; height:14px; background-color:#c8c8c8; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); content:"";}
.check-wrap input[type="checkbox"] + .text::after {display:block; position:absolute; left:3px; top:calc(50% - 5px); width:6px; height:4px; border-left:1.9px solid #fff; border-bottom:1.9px solid #fff; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); content:"";}
.check-wrap input[type="checkbox"]:checked + .text::before {background-color:#355371;}

/* FILE WRAP */
.file-wrap {overflow:hidden;}
.file-wrap.small .file-input label {height:28px; line-height:28px;}
.file-wrap.large .file-input label {height:40px; line-height:40px;}
.file-wrap .file-input label {position:relative; cursor:pointer; float:left; overflow:hidden; padding:0 12px; background:#253278; color:#fff; text-align:center; font-size:0.85714rem;}
.file-wrap .file-input label input {width:100%; height:100%; position:absolute; top:0; left:0; opacity:0; filter:alpha(opacity=0);}
.file-wrap .file-input + .file-list {margin-top:5px;}
.file-list {display:flex; justify-content:flex-start; flex-wrap:wrap;}
.file-list li {display:flex; justify-content:flex-end; align-items:center;}
.file-list li + li {margin-left:20px;}
.file-list li .btn.delete {margin-left:5px;}
.file-list li .file-name:not(.excel) {padding-left:20px; background:url(../image/ico-photo.png) no-repeat left center;}

/* FLEX WRAP */
.flex-wrap {display:flex; justify-content:flex-start; align-items:center;}
.flex-wrap.wrapping {flex-wrap:wrap;}
.flex-wrap > * {/*white-space:nowrap;*/}
.flex-wrap.gap > * {margin-left:5px;}
.flex-wrap.gap5 > * {margin-left:5px;}
.flex-wrap.gap10 > * {margin-left:10px;}
.flex-wrap > .flex-wrap {margin-left:0;}
.flex-wrap > [class^="select-"]:first-of-type,
.flex-wrap > [class^="text-"]:first-of-type,
.flex-wrap > [class^="check-"]:first-of-type,
.flex-wrap > [class^="radio-"]:first-of-type,
.flex-wrap > [class^="marker"]:first-of-type,
.flex-wrap > [class^="btn-"]:first-of-type,
.flex-wrap > ul:first-of-type {margin-left:0;}
.flex-wrap.plus label {margin-right:10px;}
.flex-wrap .ml-0 {margin-left:0;}
.flex-wrap .marker + .select-wrap {margin-left:10px;}
.flex-wrap label + .select-wrap {flex:1;}
.flex-wrap .marker + .text-wrap {flex:1;}
.flex-wrap .text-area.small {white-space:nowrap;}

/* ADRESS WRAP */
.adress-wrap > .flex-wrap + .flex-wrap {margin-top:5px;}

/* LINK */
.link {color: var(--primary-color);}
.link:hover {text-decoration: underline;}

/* BUTTON */
.btn-wrap.flex-wrap .btn + .btn {margin-left:5px;}
.btn-wrap.btn-sticky {position:sticky; left:calc(100% - 110px); top:0; z-index:100; width:110px;}
.btn {display:inline-block;}
.btn-bar {width:40px; height:40px; border-radius:50%; margin-left:20px!important; border:1px solid #999; background:url(../image/ico-bar.svg) no-repeat center center / 45% auto; opacity:0.3;}
.btn.default {display:inline-block; color:#fff; border:1px solid #253278; background-color:#253278;}
.btn.small {padding:0 11px; height:28px; line-height:26px; font-size:12px; font-weight:normal; border-radius:2px;}
.flag.default {display:flex; align-items:center; color:#fff; border:1px solid #253278; background-color:#253278;}
.flag.xsmall {padding:0 6px; height:22px; line-height:1; font-size:12px; font-weight:normal; border-radius:2px;}
.flag.secondary {color:#fff; border:1px solid #007dc6; background-color:#007dc6;}
.btn.outline {border:1px solid #253278; color:#253278; background:#fff;}
.btn.success {color:#fff; border:1px solid #16bd57; background-color:#16bd57;}
.btn.btn-danger {color:#fff; background-color:var(--danger-color);}
.btn.btn-default {color:#fff; background-color:var(--primary-color);}
.btn.btn-close {color:#fff; background-color:var(--gray-color);}
.btn.btn-warning {color:#fff; border:1px solid #f58c2a; background-color:#f58c2a;}
.btn.right-ar {display:flex; flex-wrap:wrap; justify-content:center; align-items:center;}
.btn.right-ar::after {display:block; width:5px; height:5px; border-right:2px solid #222; border-bottom:2px solid #222; margin-left:5px; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); content:"";}
.btn.underline {text-decoration:underline;}
.btn.secondary {color:#fff; border:1px solid #007dc6; background-color:#007dc6;}
.btn.delete {position:relative; width:15px; height:15px; background:url(../image/btn-delete.png) no-repeat center center;}
.btn.btn-tooltip {width:30px; height:30px; background:url(../image/btn-tooltip.png) no-repeat center center/ 16px auto;}
.btn.btn-info {width:30px; height:30px; background:url(../image/btn-info.png) no-repeat center center/ 16px auto;}
.btn.btn-toggle {padding-right:20px; background:url(../image/ico-toggle-ar.png) no-repeat calc(100% - 2px) 4px;}
/* .btn.btn-tooltip:hover + .tooltip-con {display:block;} */
.btn.btn-plus {width:30px; height:30px; background:url(../image/btn-plus.png) no-repeat center center/ 16px auto;}
.btn.btn-file {padding-right:15px; background:url(../image/ico-file.png) no-repeat right center;}
.btn.btn-comment {background-color:#000; color:#fff; padding:4px 10px;}
.btn.write {width:20px; height:15px; background:url(../image/btn-pen.svg) no-repeat center center / auto 14px;}
.btn.small.comment {height:auto; font-size:12px; line-height:1.5; font-weight:normal; border-radius:2px; color:#fff; border:1px solid #253278; background-color:#253278;}
.btn.small.comment.outline {height:auto; border:1px solid #253278; color:#253278; background:#fff;}
.btn.small.comment + .btn.small.comment.outline {margin-left:5px;}
.btn[disabled],
.btn:disabled {opacity:0.3; cursor: not-allowed;}

.btn.page {display:flex; justify-content:center; align-items:center; position:relative; width:20px; height:20px; color:#999;}
.btn.page + .btn.page {margin-left:3px;}
.btn.page.active {color:#222; font-weight:700;}
.btn.page span {line-height:1;}
.btn.page.prev-page {margin-right:5px;}
.btn.page.next-page {margin-left:10px;}
.btn.page.first-page::before {display:block; position:absolute; left:5px; top:calc(50% - 2px); width:5px; height:5px; border-left:1px solid #222; border-bottom:1px solid #222; transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg);  content:"";}
.btn.page.first-page::after {display:block; position:absolute; left:10px; top:calc(50% - 2px); width:5px; height:5px; border-left:1px solid #222; border-bottom:1px solid #222; transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg);  content:"";}
.btn.page.last-page::before {display:block; position:absolute; left:3px; top:calc(50% - 2px); width:5px; height:5px; border-right:1px solid #222; border-bottom:1px solid #222; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg);  content:"";}
.btn.page.last-page::after {display:block; position:absolute; left:7px; top:calc(50% - 2px); width:5px; height:5px; border-right:1px solid #222; border-bottom:1px solid #222; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg);  content:"";}
.btn.page.prev-page::before {display:block; position:absolute; left:8px; top:calc(50% - 2px); width:5px; height:5px; border-left:1px solid #222; border-bottom:1px solid #222; transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg);  content:"";}
.btn.page.next-page::before {display:block; position:absolute; left:6px; top:calc(50% - 2px); width:5px; height:5px; border-right:1px solid #222; border-bottom:1px solid #222; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg);  content:"";}

.btn.block {width: 100%!important;}

/* MARKER */
[class^="marker"] {color:#666;}
[class^="marker"].small {font-size:0.85714rem;}
[class^="marker"] .type {display:inline-block; height:100%; padding-right:5px;}
.marker.danger {color:#e4423b;}
.marker.refer + .text-wrap {margin-left:10px;}
.marker-wrap.line {border-top:1px solid #ccc; border-bottom:1px solid #ccc; padding-top:10px; padding-bottom:10px;}
.marker ul .marker {padding-left:15px;}
.marker-wrap + .sign-area {margin-top:20px;}
.sign-area .sign {padding-left:150px;}
.marker-wrap + .center-info-area {margin-top:20px;}
.marker-wrap .star {padding-left: 10px;font-size: 14px;font-weight: 800; position: relative;}
.marker-wrap .star:before {content: '*'; top: 0; left: 0; position: absolute;}

/* TABLE */
.table-wrap.scroll {max-height:500px; overflow-y:auto; padding-right:5px;}
.table-wrap.line {border-top:1px solid #ccc; padding-top:10px; padding-bottom:10px;}
.table-wrap.line + .table-wrap.line {margin-top:0;}
.table-wrap.line + .table-wrap.line:last-of-type {border-bottom:1px solid #ccc;}
.table-wrap.line + .marker-wrap {margin-top:20px;}
.data-table tr.error td {background-color:#f7e9e8;}
.data-table.user-select-none {user-select: none;}

.table-wrap.scroll-tbody {max-height:calc(100vh - 400px); overflow-x:hidden; overflow-y:scroll; }
.firefox .table-wrap.scroll-tbody {padding-left:1px;}
.table-wrap.scroll-tbody .data-table thead th {position:sticky; top:0;}
.chrome .table-wrap.scroll-tbody {border-top:1px solid #ccc; border-bottom:1px solid #ccc;}
.chrome .table-wrap.scroll-tbody .data-table thead th {border-top:none;}

.firefox .table-wrap.scroll-tbody {border-bottom:1px solid #ccc;}
.firefox .table-wrap.scroll-tbody .data-table thead th {padding:0; border:none;}
.firefox .table-wrap.scroll-tbody .data-table thead th span {display:inline-block; width:100%; height:100%; padding:4px 6px; border:1px solid #ccc; border-left:none; border-bottom:none;}
.firefox .table-wrap.scroll-tbody .data-table thead th:first-child span {border-left:1px solid #ccc; width:calc(100% + 1px); margin-left:-1px;}
.chrome .table-wrap.scroll-tbody .data-table tbody tr:last-child td,
.firefox .table-wrap.scroll-tbody .data-table tbody tr:last-child td {border-bottom:none;}


/* .table-wrap .data-table.scroll tbody {float:left;width:100%; overflow-y:auto; max-height:calc(100vh - 500px)}
.table-wrap .data-table.scroll tbody tr {display:table; table-layout:fixed; width:100%;} */
.table-wrap .data-table.scroll {display:block;}
.table-wrap .data-table.scroll tbody {display:block; max-height:calc(100vh - 400px); overflow-y:scroll; overflow-x:hidden;}
.table-wrap .dataTables_scrollHeadInner {margin: 0 auto;}

.table-wrap .data-table.scroll thead,
.table-wrap .data-table.scroll tbody tr {display:table; width:100%; table-layout:fixed; margin-top:-1px;}
.chrome .table-wrap .data-table.scroll thead tr th:last-child,
.safari .table-wrap .data-table.scroll thead tr th:last-child {width:calc(77px + 8px)}
.chrome .table-wrap .data-table.scroll tbody tr td:last-child,
.safari .table-wrap .data-table.scroll tbody tr td:last-child {width:calc(77px);}


.msie .table-wrap .data-table.scroll thead tr th:last-child,
.firefox .table-wrap .data-table.scroll thead tr th:last-child {width:calc(77px + 8px)}
.msie .table-wrap .data-table.scroll tbody tr td:last-child,
.firefox .table-wrap .data-table.scroll tbody tr td:last-child {width:calc(77px - 9px);}

/* .chrome .table-wrap .data-table.scroll tbody,
.safari .table-wrap .data-table.scroll tbody {width:calc(100% + 8px);}
.firefox .table-wrap .data-table.scroll tbody {width:calc(100% + 10px);} */


.content-horizontal-wrap {display:flex; flex-direction:column;}

.table-wrap + .sale-area {margin-top:10px;}
.data-table {width:100%; font-size:12px; color:rgb(51, 51, 51); text-align:left; table-layout:fixed; border-collapse:collapse; border-spacing:0px; box-shadow:rgba(126, 142, 159, 0.1) 1px 1px 5px;}
.data-table th {border:1px solid #d7dde4; background-color:#eaedf1;}
.data-table td {height:26px; word-break:keep-all;  word-break:break-word;}
.data-table:not(.display) td {background-color:#fff;}

.data-table td button {word-break:keep-all;}
.data-table.small tr th,
.data-table.small tr td {height:37px; padding:4px 6px;}
.data-table.center th,
.data-table.center td {text-align:center;}
.data-table tr.text-center th,
.data-table tr.text-center td {text-align:center;}
.data-table thead th,
.data-table tbody th {text-align:center; border:1px solid #cfd6de;}
.data-table.display thead th,
.data-table.display tbody th {border-left:1px solid #cfd6de; border-top:1px solid #cfd65e;}

.data-table.display thead th {border:none; border-left:1px solid #cfd6de; border-top:1px solid #cfd6de;}
.data-table.display thead th {border:1px solid #cfd6de; border-right:none;}
.data-table.display thead th:last-child {border-right:1px solid #cfd6de;}


.data-table tbody tr th {border:1px solid #cfd6de;} /* d7dde4 */
.data-table tbody tr td {border:1px solid #cfd6de;} /* d7dde4 */
.data-table.display tbody tr th {border:none; border-left:1px solid #cfd6de;} /* d7dde4 */
.data-table.display tbody tr td {border:none; border-left:1px solid #cfd6de;} /* d7dde4 */
.data-table.display tbody tr th:last-child,
.data-table.display tbody tr td:last-child {border-right:1px solid #cfd6de;}
.data-table thead th[rowspan^="2"],
.data-table thead th[rowspan^="3"] {border-bottom:none;}
.data-table tbody tr th + th {background-color:#8b9197;}
.data-table td .data-table thead tr th + th {background-color:#eaedf1;}

.data-table.year-table tbody tr th + th {background-color:#eaedf1;}
.data-table tfoot tr th, .data-table tfoot tr td {border:1px solid #cfd6de;} /* d7dde4 */
.data-table tfoot tr td {background-color:#f0f2f5;}
.data-table + .bbs-paging {margin-top:15px;}
.data-table + .btn-wrap.flex-wrap {margin-top:15px;}
.data-table thead tr:last-child th {border-bottom:none;}
.data-table.display thead tr:last-child th {border-bottom:1px solid #cfd6de;}
.data-table tr.part > th,
.data-table tr.part > td {border-top:2px solid #d7dde4;}
.data-table tr:first-child.part > th,
.data-table tr:first-child.part > td td {border-top:1px solid #d7dde4;}
.data-table.small td.no-data {padding:50px;}
.data-table .data-table.small td.no-data {padding:10px;}
.data-table th.highlight,
.data-table td.highlight {background-color:#e8ecfb;}
.data-table tr.highlight td {background-color:#e8ecfb;}
.data-table td.highlight-percent {background-color:#f5ebd7;}
.center-left th {text-align:center;}
.center-left td {text-align:left;}
.center-right td {text-align:right;}
.data-table .datepicker-grid thead th {background-color:transparent!important; border:none!important;}
.data-table .datepicker-grid tbody td {background-color:transparent!important; border:none!important;}
.data-table .datepicker-grid tbody td.cur-day.focus {background-color:#0085c7!important; border:1px solid #0085c7!important;}
.data-table .datepicker-grid tbody td.focus {border:2px solid #0085c7!important;}
.data-table .datepicker-grid .cur-day {background-color: #0085c7!important;}
table.dataTable.display.no-footer {border-bottom:1px solid #cfd6de;}

table.dataTable.display.stripe tbody tr.odd,table.dataTable.display tbody tr.odd{background-color:#eae9e9;}
table.dataTable.display.stripe tbody tr.odd.selected,table.dataTable.display tbody tr.odd.selected{background-color:#aabdce;}
table.dataTable.display.hover tbody tr:hover,
table.dataTable.display tbody tr:hover{background-color:#eae9e9;}
table.dataTable.display.hover tbody tr:hover.selected,
table.dataTable.display tbody tr:hover.selected{background-color:#aabdce;}
table.dataTable.display.order-column tbody tr>.sorting_1,table.dataTable.order-column tbody tr>.sorting_2,table.dataTable.order-column tbody tr>.sorting_3,table.dataTable.display tbody tr>.sorting_1,table.dataTable.display tbody tr>.sorting_2,table.dataTable.display tbody tr>.sorting_3{background-color:#fafafa}
table.dataTable.display.order-column tbody tr.selected>.sorting_1,table.dataTable.order-column tbody tr.selected>.sorting_2,table.dataTable.order-column tbody tr.selected>.sorting_3,table.dataTable.display tbody tr.selected>.sorting_1,table.dataTable.display tbody tr.selected>.sorting_2,table.dataTable.display tbody tr.selected>.sorting_3{background-color:#acbad5}
table.dataTable.display tbody tr.odd>.sorting_1,table.dataTable.order-column.stripe tbody tr.odd>.sorting_1{background-color:#f1f1f1}
table.dataTable.display tbody tr.odd>.sorting_2,table.dataTable.order-column.stripe tbody tr.odd>.sorting_2{background-color:#f3f3f3}
table.dataTable.display tbody tr.odd>.sorting_3,table.dataTable.order-column.stripe tbody tr.odd>.sorting_3{background-color:whitesmoke}
table.dataTable.display tbody tr.odd.selected>.sorting_1,table.dataTable.order-column.stripe tbody tr.odd.selected>.sorting_1{background-color:#a6b4cd}
table.dataTable.display tbody tr.odd.selected>.sorting_2,table.dataTable.order-column.stripe tbody tr.odd.selected>.sorting_2{background-color:#a8b5cf}
table.dataTable.display tbody tr.odd.selected>.sorting_3,table.dataTable.order-column.stripe tbody tr.odd.selected>.sorting_3{background-color:#a9b7d1}
table.dataTable.display tbody tr.even>.sorting_1,table.dataTable.order-column.stripe tbody tr.even>.sorting_1{background-color:#fafafa}
table.dataTable.display tbody tr.even>.sorting_2,table.dataTable.order-column.stripe tbody tr.even>.sorting_2{background-color:#fcfcfc}
table.dataTable.display tbody tr.even>.sorting_3,table.dataTable.order-column.stripe tbody tr.even>.sorting_3{background-color:#fefefe}
table.dataTable.display tbody tr.even.selected>.sorting_1,table.dataTable.order-column.stripe tbody tr.even.selected>.sorting_1{background-color:#acbad5}
table.dataTable.display tbody tr.even.selected>.sorting_2,table.dataTable.order-column.stripe tbody tr.even.selected>.sorting_2{background-color:#aebcd6}
table.dataTable.display tbody tr.even.selected>.sorting_3,table.dataTable.order-column.stripe tbody tr.even.selected>.sorting_3{background-color:#afbdd8}
table.dataTable.display tbody tr:hover>.sorting_1,table.dataTable.order-column.hover tbody tr:hover>.sorting_1{background-color:#eaeaea}
table.dataTable.display tbody tr:hover>.sorting_2,table.dataTable.order-column.hover tbody tr:hover>.sorting_2{background-color:#ececec}
table.dataTable.display tbody tr:hover>.sorting_3,table.dataTable.order-column.hover tbody tr:hover>.sorting_3{background-color:#efefef}
table.dataTable.display tbody tr:hover.selected>.sorting_1,table.dataTable.order-column.hover tbody tr:hover.selected>.sorting_1{background-color:#a2aec7}
table.dataTable.display tbody tr:hover.selected>.sorting_2,table.dataTable.order-column.hover tbody tr:hover.selected>.sorting_2{background-color:#a3b0c9}
table.dataTable.display tbody tr:hover.selected>.sorting_3,table.dataTable.order-column.hover tbody tr:hover.selected>.sorting_3{background-color:#a5b2cb}

table.dataTable.display.data-table tbody tr:first-child th,
table.dataTable.display.data-table tbody tr:first-child td {border-top:1px solid #ddd;}
.dataTable.data-table.display thead tr:last-child th {border-bottom:none;}
.dataTable.data-table.display thead th {border-bottom:none;}
.dataTable.data-table.display thead tr + tr > th:last-child {border-right:none;}
/*.dataTable.data-table.display thead th:last-child:not([rowspan^="2"]) {border-right:none;}*/

.dataTable.data-table.small thead tr th,
.dataTable.data-table.small thead tr td {height:auto;}


.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate {font-size:0.85714rem!important;}
.dataTables_wrapper .dataTables_info {margin-bottom:10px!important;}
.dataTables_wrapper .dataTables_paginate {margin-top:15px!important; margin-bottom:10px!important;}
.dataTables_wrapper .dataTables_paginate .paginate_button {min-width:30px!important; padding:2px!important;}
.dataTables_wrapper .dataTables_paginate a.paginate_button{box-sizing:border-box;display:inline-block;min-width:1.5em;padding:0.5em 1em;margin-left:2px;text-align:center;text-decoration:none !important;cursor:pointer;*cursor:hand;color:#333 !important;border:1px solid transparent;border-radius:2px}
.dataTables_wrapper .dataTables_paginate a.paginate_button.current,
.dataTables_wrapper .dataTables_paginate a.paginate_button.current:hover{color:#fff!important; border:1px solid #007dc6!important; background:#007dc6!important;}
.dataTables_wrapper .dataTables_paginate a.paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate a.paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate a.paginate_button.disabled:active{cursor:default; color:#b1b1b1!important; border:none!important; background:transparent; box-shadow:none}
.dataTables_wrapper .dataTables_paginate a.paginate_button:hover{color:#333!important; border:1px solid #007dc6!important;  background:none!important; }
/*.dataTables_wrapper .dataTables_paginate a.paginate_button.previous:hover,*/
/*.dataTables_wrapper .dataTables_paginate a.paginate_button.next {cursor: pointer;}*/
.dataTables_wrapper .dataTables_paginate a.paginate_button:active{outline:none; background-color:#2b2b2b;}
.dataTables_wrapper .dataTables_length select {appearance:auto; width:auto; background-color:#fff!important;}
.dataTables_wrapper .dataTables_length {margin-top:15px!important; margin-bottom:10px!important;}
.dataTables_wrapper .dataTables_filter label input[type="search"] {background-color:#fff;}
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {font-size:0.85714rem;}
.dataTables_wrapper .dataTables_processing {display: block;background-color: #ffffff;z-index: 1;padding-top: 0;line-height: 40px;height: 100%;top: 25px;}

 /* BBS */
.bbs-paging {display:flex; justify-content:center; padding-bottom:15px;}

/* POPUP */
.popup-wrap {display:none; position:fixed; top:0; left:0; z-index:9000; width:100%; height:100%; background-color:rgba(0, 0, 0, 0.5);}
.popup-wrap.active {display:block;}
.popup-wrap .popup-content {display:flex; justify-content:center; align-items:center; width:100%; height:100%;}
.popup-wrap .popup-cover {position:relative;  z-index:9999; overflow:hidden; background-color:#fff;}
.popup-wrap.default .popup-cover {width:800px;}
.popup-wrap.default .popup-cover.w-900 {width:900px;}
.popup-wrap.small .popup-cover {width:400px;}
.popup-wrap.medium .popup-cover {width:1000px;}
.popup-wrap.large .popup-cover {width:1200px;}
.popup-wrap.maximum .popup-cover {width:100%; height:100%;}


.popup-wrap.print-wrap .popup-cover {width:960px; height:calc(100% - 20px); overflow-y:auto; /*width:595px; height:842px;*/}
.popup-wrap.print-wrap .popup-cover .popup-inner {height:1358px; padding-left:20px; padding-right:20px;}
.popup-wrap .popup-heading {padding:15px 30px; background-color:#193282;}
.popup-wrap .popup-heading .popup-title {color:#fff; font-size:20px; font-weight:700;}
.popup-wrap .popup-body {overflow-y:auto; -webkit-overflow-scrolling:touch; width:100%; padding:20px 15px;}
.popup-wrap .popup-cover .btn-close {position:absolute; top:21px; right:30px; width:26px; height:22px; background:url(../image/btn-popup-close.png) no-repeat center center;}
.popup-wrap h4.h4 {font-size:14px; font-weight:700;}
.popup-body-heading .popup-body-title {text-align:center; font-size:25px; font-weight:700; text-decoration:underline;}
.popup-body-heading .receipt-code {text-align:center;}
.popup-body-heading .popup-body-title + .receipt-code {margin-top:5px;}
.popup-body-heading + .receipt-info {margin-top:10px;}

.dl-wrap .dl-list {display:flex;}
.count-wrap {width:20px; height:20px; background-color:#ccc; text-align:center; }
.count-wrap + .data-table {margin-left:10px;}

/* HEADER */
.header {height:55px; border-bottom:1px solid #d2d3d5;  background-color:#fff;}
.header-wrap {display:flex; height:100%; justify-content:space-between; align-items:center;}
.header-wrap .logo {width:130px; height:40px; margin-left:30px; background:url(../image/ascenter-logo.jpg) no-repeat left center / 130px auto;}
.header-wrap .util {margin-right:30px;}
.header-wrap .util button {position:relative; padding-left:10px; padding-right:10px; font-size:0.85714rem;}
.header-wrap .util button:first-child::after {display:block; position:absolute; left:100%; top:50%; transform:translateY(-50%); width:0; height:10px; border-left:1px solid #a7a9ac; content:"";}
.header-wrap .util .user {font-weight:700;}
.header-wrap .util .log-out {background-color:#222; border:1px solid #222;}
.content {display:flex; min-height:calc(100% - 110px);}
.content .lnb {width:350px; min-height:100%; padding-top:14px; background-color:#007dc6; overflow-y:auto;}
.content .lnb.active {transform:translateX(-100%);}
.content .lnb li .btn {position:relative; width:100%; padding:12px 46px 12px 20px; color:#fff; font-weight:700; text-align:left;}
.content .lnb .menu > li > .btn::after {display:block; position:absolute; right:20px; top:50%; width:6px; height:6px; border-right:2px solid #fff; border-bottom:2px solid #fff; transform:translateY(-50%) rotate(45deg); -webkit-transform:translateY(-50%) rotate(45deg); -moz-transform:translateY(-50%) rotate(45deg); -ms-transform:translateY(-50%) rotate(45deg); transition:all 0.3s; content:""; }
.content .lnb .menu > li > .btn.active::after {transform:translateY(-50%) rotate(-135deg);}
.content .lnb .menu > li > .btn.active {background-color:rgba(0, 0, 0, 0.2);}
/* .content .lnb .menu > li .sub-menu {height:0; overflow:hidden;} */
.content .lnb .menu > li .sub-menu > li {padding-left:20px;}
.content .lnb .menu > li .sub-menu > li .btn {position:relative; padding:5px 30px; font-size:0.85714rem; font-weight:400;}
.content .lnb .menu > li .sub-menu > li .btn::after {display:block; position:absolute; right:22px; top:50%; width:4px; height:4px; border-top:2px solid #fff; border-right:2px solid #fff; border-bottom:none; transform:translateY(-50%) rotate(45deg); -webkit-transform:translateY(-50%) rotate(45deg); -moz-transform:translateY(-50%) rotate(45deg); -ms-transform:translateY(-50%) rotate(45deg); content:"";}
.content .lnb .menu > li .sub-menu > li .btn:hover,
.content .lnb .menu > li .sub-menu > li .btn.active {font-weight:700;}
.content .lnb .menu > li .sub-menu > li .btn span {position:relative; display:inline-block;}
.content .lnb .menu > li .sub-menu > li .btn:hover span::after,
.content .lnb .menu > li .sub-menu > li .btn.active span::after {display:block; position:absolute; left:0; bottom:-1px; width:100%; height:0; border-bottom:1px solid rgba(255,255,255,0.4); content:"";}
.btn-menu span {padding-left:10px;}
.btn-menu::before {font-family:'Font Awesome 5 Free'}
.btn-menu-as::before {content:'\f0c5';}
.btn-menu-order::before {content:'\f108';}
.btn-menu-change::before {content:'\f044';}
.btn-menu-static::before {content:'\f200';}
.btn-menu-ar::before {content:'\f35d';}
.btn-menu-master::before {content:'\f13e';}
.btn-menu-my::before {content:'\f007';}
.btn-menu-rental::before {content:'\f06b';}
.btn-menu-board::before {content:'\f086';}
.btn-menu-operation::before {content:'\f0ae';}
.content .con-wrap {padding:20px 30px; height:100%; overflow-y:auto;}
.content .con-wrap.active {margin-left:-360px;}
.msie .table-wrap + .btn-wrap.flex-wrap.justify-content-center,
.firefox .table-wrap + .btn-wrap.flex-wrap.justify-content-center {margin-bottom:20px;}

.footer {height:55px; background-color:#efefef; border-top:1px solid #d2d3d5;}
.footer-wrap {display:flex; height:100%; align-items:center; padding-left:20px;}
.footer-wrap div {margin-right:20px; color:#222; font-size:0.85714rem; }
.footer-wrap .data {padding:10px 10px 10px 0px;}

/* CONTENT */
/* body {display:flex; flex-direction: row;} */
.wrapper {position:relative; width:100%; min-width:1450px; height:100%; min-height:100%; /*background-color:#f4f7fa;*/ background-color:#f5f5f5;}
.con-wrap {width:100%; overflow-y:auto;}
.con-wrap:not(.login-wrap) {height:100%; min-height:500px;}

.info-wrap {display:flex; justify-content:flex-end; font-size:0.85714rem;}
.info-wrap span:not(:last-of-type) {padding-right:10px}
.info-wrap span {position:relative;}
.info-wrap span:not(:first-of-type) {padding-left:10px;}
.info-wrap span:not(:first-of-type):before {display:block; position:absolute; left:0; top:50%; width:0; height:10px; border-left:1px solid #aaa; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); content:"";}

.prev-history li {position:relative; font-size:0.85714rem;}
.prev-history li:not(:last-child) {padding-right:10px;}
.prev-history li + li {padding-left:10px;}
.prev-history li + li::before {display:block; position:absolute; left:0; top:50%; width:0; height:10px; border-left:1px solid #c8c8c8; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); content:"";}
.prev-history .heading {font-weight:700;}
.prev-history .body {color:#007dc6; font-weight:700;}
.prev-history + .table-wrap {margin-top:10px;}

.con-wrap.login-wrap {position:absolute; left:50%; top:50%; width:auto; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%);}
.con-wrap .login-box {width:500px; padding:28px 40px 42px; background-color:#fff;}
@media screen and (max-width: 500px) {
    .con-wrap .login-box {width: 400px;}
}
@media screen and (max-width: 360px) {
    .con-wrap .login-box {width: 350px;}
}
.con-wrap .login-box .info-txt {text-align:center; font-size:0.85714rem;}
.con-wrap .img-wrap + .info-txt {margin-top:20px;}
.con-wrap .img-wrap + .info-txt ~ .text-area.small {margin-top:20px;}

.con-wrap .login-box .field {margin-top:14px;}
.con-wrap .login-box .field .insert {box-sizing:border-box; display:inline-block; position:relative; width:100%; padding-left:51px; border:1px solid #e6ebf1; border-radius:5px; vertical-align:middle;}
.con-wrap .login-box .field .insert label {display:inline-block; width:15px; height:20px; position:absolute; top:50%; left:0; margin-top:-10px; padding:0 18px;}
.con-wrap .login-box .field .insert input {box-sizing:border-box; width:100%; height:40px; padding-left:10px; border:0; font-size:13px;}
.con-wrap .login-box .field p {margin-top:5px; font-size:12px;}
.con-wrap .login-box .submit-btn {margin-top:22px;}
.con-wrap .login-box .submit-btn button {display:block; width:100%; font-size:15px;}
.fa, .fas {font-family:'Font Awesome 5 Free'; font-weight:900;}
.fa, .fas, .far, .fal, .fab {-moz-osx-font-smoothing:grayscale; -webkit-font-smoothing:antialiased; display:inline-block; font-style:normal; font-variant:normal; text-rendering:auto; line-height:1;}
.fa-user:before {content:"\f007";}
.fa-unlock-alt:before {content:"\f13e";}
.auth-contents .auth-wrap .login-box .submit-btn button {display:block; width:100%; font-size:15px;}
.btn.info {color:#fff; border:1px solid #2bd7d8; background-color:#2bd7d8;}
.btn.xlarge {padding:0 20px; height:40px; line-height:38px; font-size:20px; font-weight:normal; border-radius:2px;}

/* TAB WRAP */
.tab-wrap .tab {display:flex; align-items:center;}
.tab li {margin-right:1px; background-color:rgba(159, 164, 169, 0.9);}
.tab li.active, .tab li:hover {background-color:#193282;}
.tab li a {display:block; color:#fff; padding:3px 10px;}
.tab li .inner {display:flex; justify-content:center; align-items:center; min-width:120px; min-height:30px; max-height:40px;}

/* tap dropdown */
.dropdown{ position : relative; display : inline-block; }
.dropdown.caret::after {display: block;position: absolute;right: 20px;top: 50%;width: 6px;height: 6px;border-right: 2px solid #fff;border-bottom: 2px solid #fff;transform: translateY(-50%) rotate(45deg);-webkit-transform: translateY(-50%) rotate(45deg);-moz-transform: translateY(-50%) rotate(45deg);-ms-transform: translateY(-50%) rotate(45deg);transition: all 0.3s;content: "";}
.dropdown-content{ display : none; position : absolute; z-index : 1; background-color:rgba(159, 164, 169, 0.9); }
.dropdown-content a {min-width:120px; min-height:30px; max-height:40px;}
.dropdown-content a:hover, .dropdown-content > .active { background-color:#193282;}
.dropdown:hover .dropdown-content {display: block;}

/* TOOLTIP WRAP */
.tooltip-wrap { position:relative; display:flex; justify-content:center; align-items:center;}
.tooltip-wrap .tooltip-con {display:none; position:absolute; bottom:30px; z-index:800; width:200px; border:1px solid #333; border-radius:3px; background-color:#fff; padding:10px;}
.tooltip-wrap .tooltip-con-hover {display:none; position:absolute; z-index:800; border:1px solid #333; border-radius:3px; background-color:#fff; padding:5px 10px;}
.tooltip-wrap > p:hover ~ .tooltip-con-hover {display:block;}
.tooltip-wrap .tooltip-con-hover.right {right: -30px;}
.tooltip-wrap .tooltip-con-hover.top {top: -35px;}
.tooltip-wrap .tooltip-con-hover.top div {display: flex;white-space: nowrap;gap: 5px;}
.tooltip-wrap .tooltip-con-hover.left {left:-30px;}
.tooltip-wrap .tooltip-con-hover.bottom {bottom:-35px;}
.tooltip-wrap .tooltip-con.active {display:block;}
.tooltip-wrap .tooltip-con::after {display:block; position:absolute; z-index:801; left:50%; bottom:-6px; width:10px; height:10px; border-left:1px solid #333; border-bottom:1px solid #333; background-color:#fff; transform:translateX(-50%) rotate(-45deg); -webkit-transform:translateX(-50%) rotate(-45deg); -moz-transform:translateX(-50%) rotate(-45deg); -ms-transform:translateX(-50%) rotate(-45deg); content:"";}
.tooltip-con .tooltip-heading {text-align:left; font-weight:bold; padding-right:20px;}
.tooltip-con .tooltip-heading + .tooltip-body {padding-right:0;}
.tooltip-con .tooltip-body {text-align:left; padding-right:20px;}
.tooltip-con .tooltip-heading + .tooltip-body {margin-top:10px;}
.tooltip-con .tooltip-close {position:absolute; width:15px; height:15px; right:10px; top:10px; background:url(../image/btn-tooltip-close.png) no-repeat center center / 10px auto;}

.tool-tip {display: inline; position: relative;}
.tool-tip .tool-tip-icon {display: inline; cursor: pointer;}
.tool-tip .tool-tip-icon:hover + .tool-tip-cont {display: inline-block;}
.tool-tip .tool-tip-cont {display: none; position: absolute; background-color: #fff;border: 1px solid #c1c1c1;border-radius: 10px;z-index: 1; padding: 5px 10px; white-space: nowrap;}
.tool-tip .tool-tip-cont.tool-tip-left      {top: 0; right: 20px;}
.tool-tip .tool-tip-cont.tool-tip-right     {top: 0; left: 20px;}

.tool-tip .tool-tip-cont .tool-tip-cont-header {font-weight: bold;}
.tool-tip .tool-tip-cont .tool-tip-cont-body {font-size: 14px; font-weight: lighter;}

/* .table-wrap.accordion {opacity:0;} */
.table-wrap .data-table .acc-sub-list > td:first-child {padding-left:20px;}
.table-wrap .data-table .acc-sub-sub > td:first-child {padding-left:45px;}
.table-wrap .data-table .acc-sub-list td {background-color:#f2f5f9}
.table-wrap .data-table .acc-sub-sub td {background-color:#e6eaf1;}
.table-wrap .data-table .acc-list.active {display:table-row}
.table-wrap .data-table .acc-sub-list.active {display:table-row;}
.table-wrap .data-table .acc-sub-sub.active {display:table-row;}

.table-wrap .data-table .acc-list .unit,
.table-wrap .data-table .acc-sub-list .unit {display:inline-block; width:15px; padding-right:3px;}

/* BOARD */
.board-group {display:flex; }
.board-group + .board-group {margin-top:20px;}
.board-wrap {display:flex; width:calc(50% - 10px); padding:20px; border-radius:5px;; background-color:#fff; box-shadow:rgba(126, 142, 159, 0.1) 1px 1px 5px;}
.board-wrap:nth-of-type(2n) {margin-left:20px;}
.board-heading {width:100px; display:flex; flex-direction:column; justify-content:center; align-items:center; }
.board-heading .h3 {padding-top:60px; background:url(../image/ico_notice.svg) no-repeat center top / auto 45px; font-size:15px;}
.board-heading.board-data .h3 {background-image:url(../image/ico_data.svg);}
.board-heading.board-free .h3 {background-image:url(../image/ico_free.svg);}
.board-heading.board-tech .h3 {background-image:url(../image/ico_tech.svg);}
.board-heading .more {font-size:11px; color:#8c94a0; padding-top:5px;}
.board-heading .more .txt:after {content:" +";}
.board-body {width:calc(100% - 100px); padding-left:20px;}
.board-body li {display:flex; justify-content:space-between; padding:4px 0; border-bottom:1px solid #f5f5f5;}
.board-body li:last-child {border-bottom:none;}
.board-body li .title {padding-right:20px; flex:1; color:#333; font-size:13px;}
.board-body li .date {color:#a1a8b5; font-size:13px;}
.bbs-title {flex-wrap:nowrap}
.bbs-title .comment-num {padding-left:10px; font-weight:700; word-break:keep-all;}
.bbs-title .btn.underline ~ .flag.xsmall.default {margin-left:10px;}
.comment-info .comment-total {font-weight:700; color:#007dc6;}
.comment-id + .textarea-wrap {margin-top:10px; align-items:stretch;}
.comment-id {font-weight:700;}
.comment-wrap {border-top:1px solid #ccc; padding-top:10px;}
.comment-write-group + .comment-list-group {margin-top:10px;}
.comment-list-group li {border-top:1px solid #ccc; padding:10px;}
.comment-list-group li:last-child {border-bottom:1px solid #ccc;}
.comment-list-group li .view-group {font-size:0.85714rem;}
.comment-list-group li.delete {background-color:#dae1e4;}

.comment-list-group .list-header {display:flex; align-items:center;}
.comment-list-group .list-header .user-id {padding-right:10px;}
.comment-list-group .list-header .date {position:relative; padding-left:10px; padding-right:5px;}
.comment-list-group .list-header .date::before {display:block; position:absolute; left:0; top:50%; width:0; height:10px; border-left:1px solid #ccc; transform:translateY(-50%); content:"";}
.comment-list-group .list-header .date ~ .btn.write {padding-left:5px; padding-right:5px; margin-left:5px;}
.comment-list-group .list-header .date ~ .btn.delete {margin-left:10px;}
.comment-list-group .list-header + .list-body {margin-top:5px;}
.comment-list-group + .bbs-paging {margin-top:20px;}

/* NOTICE 목록 스타일 */
.notice-wrap {}
.notice-wrap .notice-tit { font-size: 16px;font-weight: 700; position: relative;}
.notice-wrap .notice-tit:before {content: '';position: absolute;width: 10px;height: 10px;left: 0;}
.notice-wrap .ul-depth1 {counter-reset: custom-counter;}
.notice-wrap .ul-depth1 .li-depth1 {list-style: none;counter-increment: custom-counter;position: relative;padding-left: 20px;margin-top: 3px;font-size: 15px;}
.notice-wrap .ul-depth1 .li-depth1:before {content: counter(custom-counter) ") ";position: absolute;top: 0;left: 0;}
.notice-wrap .ul-depth1 .li-depth1 > .ul-depth2 {}
.notice-wrap .ul-depth1 .li-depth1 > .ul-depth2 .li-depth2 { position: relative;padding-left: 12px;margin-top: 3px;font-size: 15px;}
.notice-wrap .ul-depth1 .li-depth1 > .ul-depth2 .li-depth2:before {content: "-";position: absolute;top: 0;left: 0;}

/* 로딩*/
#loading {
	height: 100%;
	left: 0px;
	position: fixed;
	_position:absolute;
	top: 0px;
	width: 100%;
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	opacity : 0.5;
}

.loading {
	background-color: white;
	z-index: 199;
}

.loading-wrapper { width: 100%;height: 100%;background-color: rgba(255, 255, 255, .9);border: 1px solid #d5d5d5;position: absolute;top: 0;left: 0;}

#loading_img{
	position:absolute;
	top:50%;
	left:50%;
	height:35px;
	margin-top:-75px;	//	이미지크기
	margin-left:-75px;	//	이미지크기
	z-index: 200;
}

.issue-close                 {color: var(--gray-color); text-decoration: line-through;}
.issue-complete              {color: var(--success-color);}
.issue-processing            {color: var(--primary-color);}
.issue-urgent                {color: var(--danger-color);}
.issue-confirm-from-as       {color: var(--warning-color);}
.issue-confirm-from-admin    {color: #FFE700;}

table.dataTable td.dataTables_empty {text-align: center;vertical-align: middle;}

.divider-vertical {width: 2px; height: calc(100% - 20%); background-color: #b8b8b8; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

.tmpl-cont { width: 640px; min-height: 150px; background-color: #fff; padding: 10px 10px; border: 1px solid #ccc; font-size: 14px; line-height: 1.5; resize: vertical; overflow: auto; box-sizing: border-box; border-radius: 6px; max-height: 500px; }
.tmpl-cont:focus {padding: 10px 10px; border: 1px solid #000;}
.tmpl-cont p {padding-top: 5px; padding-bottom: 5px;}
.tmpl-cont p:first-child {padding-top: 0; padding-bottom: 5px;}
.tmpl-cont p:last-child {padding-top: 5px; padding-bottom: 0;}

.tmpl-kywrd { display: inline; padding: 2px 5px; background-color: var(--dark-gray-color);color: #fff;user-select: none; pointer-events: none; border-radius: 10px;text-decoration: none;font-style: normal;}

.cBadge {padding: 3px 6px; font-size: 12px; border-radius: 13px; cursor: pointer; user-select: none;}
.cBadge.cBadge-default {background-color: var(--dark-gray-color); color: #fff;}
.cBadge.cBadge-primary {background-color: var(--primary-color); color: #fff;}
.cBadge.cBadge-success {background-color: var(--success-color); color: #fff;}
.cBadge.cBadge-danger {background-color: var(--danger-color); color: #fff;}
.cBadge.cBadge-warning {background-color: var(--warning-color); color: #fff;}
.cBadge.out-line.cBadge-default {background-color: #fff; border: 1px solid var(--dark-gray-color); color: var(--dark-gray-color);}
.cBadge.out-line.cBadge-primary {background-color: #fff; border: 1px solid var(--primary-color); color: var(--primary-color);}
.cBadge.out-line.cBadge-success {background-color: #fff; border: 1px solid var(--success-color); color: var(--success-color);}
.cBadge.out-line.cBadge-danger {background-color: #fff; border: 1px solid var(--danger-color); color: var(--danger-color);}
.cBadge.out-line.cBadge-warning {background-color: #fff; border: 1px solid var(--warning-color); color: var(--warning-color);}

.switch-wrapper {position: relative;}
.switch-wrapper .switch {position: absolute; appearance: none;-webkit-appearance: none;-moz-appearance: none;}
/* checking style */
.switch-wrapper .switch:checked+.switch-label {background: #ffffff;border: 1px solid var(--primary-color);}
.switch-wrapper .switch:checked+.switch-label:hover {background: var(--primary-color);}
.switch-wrapper .switch:checked+.switch-label:hover .onf_btn {background: #fff;}

/* move */
.switch-wrapper .switch:checked+.switch-label .onf_btn {top: 3px; left: 21px;background: var(--primary-color);box-shadow: 1px 2px 3px #00000020;}

.switch-wrapper .switch-label { position: relative;cursor: pointer;display: inline-block;width: 45px;height: 26px;background: #fff;border: 1px solid var(--dark-gray-color);border-radius: 20px;transition: 0.2s;}
.switch-wrapper .switch-label .onf_btn {position: absolute;top: 3px;left: 4px;display: inline-block;width: 18px;height: 18px;border-radius: 20px;background: var(--dark-gray-color);transition: 0.2s;}

.template-item {border: 1px solid var(--gray-color); border-radius: 12px;padding: 8px 11px;}
.template-item:first-child {margin-top: 0;}
.template-list > *:not(:first-child):not(:last-child) {margin-bottom: 5px; margin-top: 5px;}
.template-list > :nth-child(2):nth-last-child(1) {margin-top: 5px;}
.template-item:last-child {margin-bottom: 0;}
.template-item .template-item-header {cursor: pointer;}
.template-item .template-item-header h3 {position: relative; font-size: 14px; color: var(--dark-gray-color); width: 350px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.template-item .template-item-header p {font-size: 13px; color: var(--dark-gray-color);}

.template-item .template-item-body {border-top: 1px solid var(--light-gray-color);margin-top: 5px;}
.template-item .template-item-body .template-content-wrap {position: relative; background-color: #f4f7fa; border: 1px solid #cfe6ff; padding: 5px 10px; margin-top: 10px; font-size: 13px; height: 200px; overflow-y: auto; white-space: pre-line; user-select: none;}
.template-item .template-item-body .template-content-wrap .template-content .selected { background-color: yellow;}
.template-item .template-item-body .template-content-wrap .btn-template-copy {opacity: 0; position: absolute; top: 10px; right: 10px; cursor: pointer; transition: 0.5s;}
.template-item .template-item-body .template-content-wrap:hover .btn-template-copy {opacity: 1;}

.template-item .template-item-body .template-content-wrap .btn-template-copy .btn-template-copy-tooltip { opacity: 0; position: absolute;top: -2px;right: 25px;width: 160px;font-size: 12px;background-color: white;text-align: center;border: 1px solid;padding: 2px 4px;border-radius: 5px; transition: 0.3s;}
.template-item .template-item-body .template-content-wrap:hover .btn-template-copy:hover .btn-template-copy-tooltip {opacity: 1;}

.template-item .template-item-body .template-keyword-item {}
.template-item .template-item-body .template-keyword-item .keyword-input-group {position: relative; height: 35px;display: flex;justify-content: start;align-items: center;}
.template-item .template-item-body .template-keyword-item .keyword-input-group .keyword-label { width: 160px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis; cursor: pointer;}
.template-item .template-item-body .template-keyword-item .keyword-input-group .keyword-label.selected {font-weight: bold;}
.template-item .template-item-body .template-keyword-item .keyword-input-group .keyword-label + .keyword-label-tooltip { display: none; position: absolute;top: -1px;min-height: 30px;line-height: 30px;box-sizing: border-box;left: 116px;background-color: rgba(0, 0, 0, .9);padding: 3px 10px;color: #fff;border-radius: 6px;font-size: 12px;}
.template-item .template-item-body .template-keyword-item .keyword-input-group .keyword-label + .keyword-label-tooltip::before {content: '';position: absolute;top: 50%;left: -12px;transform: translateY(-50%);width: 0;height: 0;border-top: 6px solid transparent;border-bottom: 6px solid transparent;border-right: 6px solid rgba(0, 0, 0, .9);border-left: 6px solid transparent;}
.template-item .template-item-body .template-keyword-item .keyword-input-group .keyword-label:hover + .keyword-label-tooltip {display: block;}
.template-item .template-item-body .template-keyword-item .keyword-input-group .keyword-input {width: 100%;border-radius: 5px;}

.page-link {position: relative; }
.page-link label {display: inline-block; width: inherit; color: var(--primary-color); cursor: pointer; white-space: nowrap;overflow: hidden;text-overflow: ellipsis; text-align: left;}
.page-link label + span {display: none;position: absolute;top: -5px;left: 0;box-sizing: border-box;background-color: rgba(0, 0, 0, 1);padding: 3px 10px;color: #fff;border-radius: 6px;font-size: 12px;z-index: 1;}
.page-link label:hover {text-decoration: underline;}
.page-link:hover label + span {display: block;}

#templateSetting {display: none;}
#dataTablesLoading { position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

.tbl-progress-loading {display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: white; z-index: 1;}
.tbl-progress-loading .progress {text-align: center; position: relative;}
.tbl-progress-loading .progress .percent {position: absolute;top: 50%;left: 50%;transform: translate(-58%, -70%);font-weight: 800;}
.tbl-progress-loading .progress .percent .percent-value {}
.tbl-progress-loading .tbl-loading-msg {text-align: center;margin-top: 10px;font-size: 13px;font-weight: 400;}

.btn-loading-gauge-txt {position: relative; z-index: 1; color: #fff;}
.btn-loading-gauge {z-index: 0; position: absolute; top: 0; left: 0; height: 100%; background-color: #0512cf;}

#image-viewer {position: fixed;top: 0;left: 0;background: rgba(0, 0, 0, .8);width: 100%;height: 100%;z-index: 100;}
#image-viewer .image-body {position: relative; width: 100%; height: 100vh; clip-path: border-box;}
#image-viewer .image-body #targetImage {background-size: contain;background-repeat: no-repeat; background-position: center; /*width: 50%; height: 50%;*/ /*top: 50%; left: 50%;*/ position: absolute; /*transform: translate(-50%, -50%);*/}
#image-viewer .image-control {/*position: absolute;top: 0;left: 50%;transform: translateX(-50%);*/padding: 10px 30px 10px 30px;border-radius: 10px;width: 100%;background-color: #000;}
#image-viewer .image-control .image-info {color: white;}
#image-viewer .image-control-btn {position: relative; color: white;font-size: 20px;cursor: pointer;}
#image-viewer .image-control-btn span {display: none; position: absolute;bottom: -35px;left: 50%;background-color: white;color: #000;padding: 5px 10px;transform: translateX(-50%);font-size: 13px; z-index: 100;}
#image-viewer .image-control-btn:hover span {display: block;}

.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody::-webkit-scrollbar {height: 4px;}

.tooltip-btn {position: relative;}
.tooltip-btn .btn-tooltip-content {display: none;position: absolute;top: 33px;right: 0;padding: 5px 10px;background-color: rgba(0, 0, 0, 1);white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.tooltip-btn:not(:disabled) .btn-tooltip-content {display: none;}
.tooltip-btn:disabled:hover .btn-tooltip-content {display: block;}
