@charset "utf-8";

@font-face {
  font-family: 'NotoSansKR';
  font-display: auto;
  font-style: normal;
  font-weight: 400;
  src: url(/font/NotoSansKR-Regular.woff2) format('woff2'), url(/font/NotoSansKR-Regular.woff) format('woff'), url(/font/NotoSansKR-Regular.otf) format('opentype');
}

@font-face {
  font-family: 'NotoSansKR';
  font-display: auto;
  font-style: normal;
  font-weight: 500;
  src: url(/font/NotoSansKR-Medium.woff2) format('woff2'), url(/font/NotoSansKR-Medium.woff) format('woff'), url(/font/NotoSansKR-Medium.otf) format('opentype');
}

@font-face {
  font-family: 'NotoSansKR';
  font-display: auto;
  font-weight: 700;
  src: url(/font/NotoSansKR-Bold.woff2) format('woff2'), url(/font/NotoSansKR-Bold.woff) format('woff'), url(/font/NotoSansKR-Bold.otf) format('opentype');
}

/* CSS 초기화 */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:normal;}
li{list-style:none;}
caption{text-align:left;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:text-top;}
sub{vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}
input,textarea,select{font-size:100%;}
legend{color:#000;}
del,ins{text-decoration:none;}

/* 기본 */
body {margin:0;padding:0;}
BODY,DIV,TABLE,TH,TD,INPUT,SELECT,TEXTAREA,PRE {font-size:12px; font-family:'NotoSansKR', sans-serif; color:#444;}
.float-clear {display:block;float:none;clear:both;height:0;width:100%;font-size:0 !important;line-height:0 !important;overflow:hidden;}
div:focus { outline:none; }
A:link, A:visited {color:#444444; text-decoration:none;}
A:hover, A:active {color:#444444; text-decoration:underline;}
select::-ms-expand { display: none; }	/*익스플로어에서도 select박스 기본화살표가 안보이고 이미지화살표만 보이게 하기 위해서*/

/* Form Style */
select, input[type=text], input[type=file], input[type=number], input[type=tel], input[type=email], input[type=password], input[type=time], textarea {border:1px solid #aaa; background-color:#fff; font-size:12px; color:#231f20;}
select, input[type=text], input[type=file], input[type=number], input[type=tel], input[type=email], input[type=password], input[type=time] {height:28px; vertical-align:middle;}
select, input[type=text], input[type=file], input[type=number], input[type=tel], input[type=email], input[type=password], input[type=time], textarea {-webkit-appearance:none; -moz-appearance:none; outline:none;}
select, input, textarea {border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; box-sizing:border-box;}

select {padding-left:7px; padding-right:20px; background-image:url('/images/ic_selectbox_indicator_type2.png'); background-repeat:no-repeat; background-position:100% 57%;}
input[type=text], input[type=number], input[type=tel], input[type=email], input[type=password], input[type=time] {padding-left:7px; padding-right:7px;}
input[type=text].date {padding-right:28px; background-image:url('/images/ic_input_calendar.png'); background-repeat:no-repeat; background-position:100% 50%;}
input[type=text].search {padding-left:5px; padding-right:30px; background-image:url('/images/ic_input_search.png'); background-repeat:no-repeat; background-position:100% 50%;}
input[type=text].right {text-align:right;}
input[type=text].center {text-align:center;}
input[type=text].noBorder, input[type=number].noBorder, input[type=tel].noBorder, input[type=email].noBorder {background-color:transparent; border-style:none;}
textarea {padding:10px; line-height:1.5em; color:#333; resize:none; overflow-y:auto;}

input[type=text]:focus,
input[type=file]:focus,
input[type=number]:focus,
input[type=tel]:focus,
input[type=email]:focus {border:1px solid #0063c6 !important;}

input[type=text]:disabled,
input[type=file]:disabled,
input[type=number]:disabled,
input[type=tel]:disabled,
input[type=email]:disabled,
select:disabled,
textarea:disabled {background-color:#f5f5f5 !important; border:1px solid #ddd !important;}

input[type=text].readonly,
input[type=file].readonly,
input[type=number].readonly,
input[type=tel].readonly,
input[type=email].readonly {background-color:#fefefe !important; border:1px solid #d0d0d0 !important;}

/* Label Field */
label.label-field {display:inline-block; height:30px; margin-left:15px;}
label.label-field:first-child {margin-left:0;}
label.label-field > span {padding-right:10px; font-size:12px; color:#000;}
label.label-field > select,
label.label-field > input[type=text],
label.label-field > input[type=number],
label.label-field > input[type=tel],
label.label-field > input[type=email] {}

/* Placeholder */
::-webkit-input-placeholder {/* WebKit, Blink, Edge */ color:#aaa; }
:-moz-placeholder {/* Mozilla Firefox 4 to 18 */ color:#aaa; }
::-moz-placeholder {/* Mozilla Firefox 19+ */ color:#aaa; }
:-ms-input-placeholder {/* Internet Explorer 10-11 */ color:#aaa; }
::-ms-input-placeholder { /* Microsoft Edge */ color:#aaa; }

/* 스크롤 */
::-webkit-scrollbar {width:0.6rem; height:1rem !important; background:transparent; }
::-webkit-scrollbar-track {background-color:#f1f1f1; }
::-webkit-scrollbar-thumb {background-color:#c1c1c1; }

/* Button Style */
button.button-style {padding-left:19px; padding-right:19px; height:30px; line-height:30px; border:1px solid #aaa; vertical-align:middle; font-size:12px; font-weight:normal; cursor:pointer;}
button.button-style {border-radius:2px 2px 2px 2px; -moz-border-radius:2px 2px 2px 2px; -webkit-border-radius:2px 2px 2px 2px;}
button.button-style {-webkit-appearance:none; -moz-appearance:none; outline-style:none; cursor:pointer;}
button.button-style {background-color:#f5f5f5; color:#333;}
button.button-style.w100 {padding-left:0; padding-right:0; width:100px;}
button.button-style.blue {background-color:#0063c6; border-style:none; color:#fff;}
button.button-style.red {background-color:#c00000; border-style:none; color:#fff;}
button.button-style.black {background-color:#5d6165; border-style:none; color:#fff;}
button.button-style.gray {background-color:#999; border-style:none; color:#fff;}
button.button-style.green {background-color:#029e60; border-style:none; color:#fff;}
button.button-style.white {background-color:#fff; border-color:#0063c6; color:#0063c6;}
button.button-style:disabled {background-color:#f5f5f5; border-color:#ddd; color:#c4c4c4;}
button.button-style.blue:disabled {background-color:#4c86b2; border-color:#ddd; color:#c0c0c0;}
button.button-style.red:disabled {background-color:#b07979; border-color:#ddd; color:#c7c7c7;}
button.button-style.green:disabled {background-color:#7fa87f; border-color:#ddd; color:#c0c0c0;}

button.list-style {padding-left:10px; padding-right:10px; height:28px; line-height:28px; border:1px solid #0063c6; vertical-align:middle; font-size:12px !important; font-weight:normal; cursor:pointer;}
button.list-style {border-radius:2px 2px 2px 2px; -moz-border-radius:2px 2px 2px 2px; -webkit-border-radius:2px 2px 2px 2px;}
button.list-style {-webkit-appearance:none; -moz-appearance:none; outline-style:none; cursor:pointer;}
button.list-style {background-color:#fff; color:#0063c6;}
button.list-style.black {border-color:#5d6165; color:#5d6165;}
button.list-style.gray {border-color:#999; color:#999;}
button.list-style.red {border-color:#c00000; color:#c00000;}
button.list-style.green {border-color:#029e60; color:#029e60;}
button.list-style.white {border-color:#0063c6; color:#0063c6;}
button.list-style:disabled {background-color:#f5f5f5; border-color:#ddd; color:#c4c4c4;}
button.list-style.black:disabled {background-color:#4c86b2; border-color:#ddd; color:#c0c0c0;}
button.list-style.red:disabled {background-color:#b07979; border-color:#ddd; color:#c7c7c7;}
button.list-style.green:disabled {background-color:#7fa87f; border-color:#ddd; color:#c0c0c0;}

/* Checkbox */
label.checkbox {display:inline-block; width:auto;}
label.checkbox input {display: none!important;}
label.checkbox span {width:20px; height:20px; display:inline-block; background: url("../images/bg_checkbox_off.png"); background-size:100%; vertical-align:middle;}
label.checkbox input:checked + span {background: url("../images/bg_checkbox_on.png"); background-size:100%;}
label.checkbox input:checked {-webkit-appearance:none; -moz-appearance:none;}
label.checkbox em.lbl {display:inline-block; margin-left:7px; font-size:12px; line-height:16px; vertical-align:middle;}

/* Radio */
label.radio {display:inline-block; width:auto;}
label.radio input {display: none!important;}
label.radio span {width:20px; height:20px; display:inline-block; background: url("../images/bg_radio_off.png"); background-size:100%; vertical-align:middle;}
label.radio input:checked + span {background: url("../images/bg_radio_on.png"); background-size:100%;}
label.radio input:checked {-webkit-appearance:none; -moz-appearance:none;}
label.radio em.lbl {display:inline-block; margin-left:7px; font-size:12px; line-height:16px; vertical-align:middle;}

/* Switch */
.custom-switch {position:relative; display:inline-block; width:32px; height:20px;}
.custom-switch input {opacity:0; width:0; height:0;}
.custom-switch .slider {position:absolute; cursor:pointer; top:0; left:0; right:0; bottom:0; background-color:#6a7276; -webkit-transition:.4s; transition:.4s;}
.custom-switch .slider:before {position:absolute; content:""; height:16px; width:16px; left:2px; bottom:2px; background-color:white; -webkit-transition:.4s; transition:.4s;}
.custom-switch input:checked + .slider {background-color:#0db456;}
.custom-switch input:focus + .slider {box-shadow:0 0 1px #0db456;}
.custom-switch input:checked + .slider:before {-webkit-transform:translateX(12px); -ms-transform:translateX(12px); transform: translateX(12px);}
.custom-switch .slider{border-radius:10px;}
.custom-switch .slider:before {border-radius:50%;}

/* Loading Box */
#__Loading_Box {z-index:80000; position:fixed; top:0; left:0; width:100%; height:100%;}
#__Loading_Box > div.inner-box {position:relative; display:table; width:100%; height:100%; background-color:rgba(0, 0, 0, 0.7);}
#__Loading_Box > div.inner-box > div.message-box {display:table-cell; vertical-align:middle; text-align:center; font-size:12px; color:#fff;}
#__Loading_Box > div.inner-box > div.message-box div.icon-box {height:60px;}
#__Loading_Box > div.inner-box > div.message-box span.icon {display: inline-block; width: 15px; height: 15px; background-color: #fcdc29; border-radius: 50%; animation: loading 1s infinite;  transform-origin: bottom center;  position: relative;}
#__Loading_Box > div.inner-box > div.message-box span.icon1 {animation-delay: 0.1s;}
#__Loading_Box > div.inner-box > div.message-box span.icon2 {animation-delay: 0.2s;}
#__Loading_Box > div.inner-box > div.message-box span.icon3 {animation-delay: 0.3s;}
#__Loading_Box > div.inner-box > div.message-box span.icon4 {animation-delay: 0.4s;}
#__Loading_Box > div.inner-box > div.message-box span.icon5 {animation-delay: 0.5s;}
#__Loading_Box > div.inner-box > div.message-box p.message {font-size:12px;}

@keyframes loading {
  0%{
    transform: translateY(0px);
    background-color: #fcdc29;
  }
  50%{
    transform: translateY(30px);
    background-color: #ef584a;
  }
  100%{
    transform: translateY(0px);
    background-color: #fcdc29;
  }
}

/* Layer Popup Style */
#LayerPopupBox > div.layer-popup-box {position:absolute; top:0; left:0; width:100%; height:100%;}
#LayerPopupBox > div.layer-popup-box div.disabled-box {position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0, 0, 0, 0.5);}
#LayerPopupBox > div.layer-popup-box div.layer-popup {position:absolute; top:0; left:0;}
#LayerPopupBox > div.layer-popup-box div.layer-popup {box-shadow:3px 3px 7px 0 rgba(0,0,0,0.35); -webkit-box-shadow:3px 3px 7px 0 rgba(0,0,0,0.35); -moz-box-shadow:3px 3px 7px 0 rgba(0,0,0,0.35)}
#LayerPopupBox > div.layer-popup-box div.layer-popup {overflow:hidden; border-radius:5px 5px 5px 5px; -moz-border-radius:5px 5px 5px 5px; -webkit-border-radius:5px 5px 5px 5px;}
#LayerPopupBox > div.layer-popup-box div.title-bar {position:relative; height:63px; background-color:#fff; box-sizing:border-box;}
#LayerPopupBox > div.layer-popup-box div.title-bar * {box-sizing:border-box;}
#LayerPopupBox > div.layer-popup-box div.title-bar h3 {height:63px; line-height:63px; padding-left:20px; font-size:20px; font-weight:bold; color:#111;}
#LayerPopupBox > div.layer-popup-box div.title-bar h3 > em {display:inline-block; margin-left:5px; font-size:12px; font-weight:bold; color:#fff;}
#LayerPopupBox > div.layer-popup-box div.title-bar p.btn-close {position:absolute; top:19px; right:20px; width:24px; height:24px; background:url('/images/ic_popup_close_type2.png') no-repeat 0 0; background-size:24px 24px;}
#LayerPopupBox > div.layer-popup-box div.title-bar p.btn-close:hover {cursor:pointer;}
#LayerPopupBox > div.layer-popup-box div.contents {/* overflow-x:hidden; overflow-y:auto; */ position:relative; width:100%; height:calc(100% - 63px); background-color:#fff;}
#LayerPopupBox > div.layer-popup-box div.contents {padding:10px 10px 10px 10px; box-sizing:border-box;}
#LayerPopupBox > div.layer-popup-box div.contents div.page-loading {height:60px; line-height:60px; text-align:center; font-size:12px;}
#LayerPopupBox > div.layer-popup-box div.contents div.page-loading img {vertical-align:middle;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-sub-title {position:relative; width:100%; height:52px; border-bottom:2px solid #231f20; box-sizing:border-box;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-sub-title.noline {border-bottom-style:none;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-sub-title * {box-sizing:border-box;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-sub-title > h5 {height:50px; line-height:50px; font-size:16px; font-weight:bold; color:#231f20;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-sub-title > div.button {position:absolute; top:0; right:0; height:40px; text-align:right;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-sub-title > div.button > * {margin-left:10px;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-button {box-sizing:border-box; width:100%; height:40px; padding:10px 0 0 0; text-align:center;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-button:after {content: ""; display:block; clear:both; visibility:hidden; font-size:0; height:0;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-button p {width:calc(100% / 2); height:40px;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-button p.left {float:left; text-align:left;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-button p.right {float:right; text-align:right;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-button button {margin-left:10px;}
#LayerPopupBox > div.layer-popup-box div.contents div.pop-button button:first-child {margin-left:0;}

/* Vue 깜빡임 방지용 */
[v-cloak] { display:none; }

.vs10 {display:block; height:10px;}
p.input-style {height:28px; line-height:28px; border:1px solid #aaa; background-color:#fff; font-size:12px; color:#231f20;}

/* Span Style*/
.color-red {color:#cd0a0a;}
.group_gray {background-color:#f7f7f7; }

.link-style {cursor:pointer;}
.link-style:hover {text-decoration:underline;}
.text-ellipsis {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; word-break:break-all;}


/* jqgrid tooltip 관련 */
.tooltip {
  opacity: 1 !important;
}
.tooltip_list {
  cursor: pointer;
  position: inherit;
  text-align: center;
}
.tooltip-text {
  display: none;
  position: absolute;
  max-width: 200px;
  border: 1px solid;
  border-radius: 5px;
  padding: 5px;
  color: black;
  background: #3cdbff;
  z-index: 1030;
  font-family: "Open Sans",Arial,Helvetica,Sans-Serif;
  font-style: normal;
  font-weight: 400;
  letter-spacing: normal;
  line-break: auto;
  line-height: 1.42857143;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  white-space: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  font-size: 12px;
}

.tooltip_list:hover .tooltip-text {
  display: inline-block !important;
}