/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
@charset "utf-8";
@import url(material-icons.css);
@font-face {
  font-family: 'NG';
  font-style: normal;
  font-weight: 400;
  src: url('../font/NanumGothic-Regular.eot');
  src: url('../font/NanumGothic-Regular.eot?#iefix') format('embedded-opentype'),
       url('../font/NanumGothic-Regular.woff2') format('woff2'),
       url('../font/NanumGothic-Regular.woff') format('woff'),
       url('../font/NanumGothic-Regular.ttf') format('truetype');
}
@font-face {
  font-family: 'NGB';
  font-style: normal;
  font-weight: 700;
  src: url('../font/NanumGothic-Bold.eot');
  src: url('../font/NanumGothic-Bold.eot?#iefix') format('embedded-opentype'),
       url('../font/NanumGothic-Bold.woff2') format('woff2'),
       url('../font/NanumGothic-Bold.woff') format('woff'),
       url('../font/NanumGothic-Bold.ttf') format('truetype');
}
@font-face {
  font-family: 'NGEB';
  font-style: normal;
  font-weight: 800;
  src: url('../font/NanumGothic-ExtraBold.eot');
  src: url('../font/NanumGothic-ExtraBold.eot?#iefix') format('embedded-opentype'),
       url('../font/NanumGothic-ExtraBold.woff2') format('woff2'),
       url('../font/NanumGothic-ExtraBold.woff') format('woff'),
       url('../font/NanumGothic-ExtraBold.ttf') format('truetype');
}

.txt-hidden {position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;}

.font-icon::before {font-family: 'Material Symbols Outlined'; font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; vertical-align: middle; font-size:24px; color:#fff;}
.font-icon[class*="font-"] {display:flex; font-display: block;}
.font-icon.filled::before {font-variation-settings:'FILL' 1;}
.font-icon.font-dashboard::before {content:'dashboard';}
.font-icon.font-folder::before {content:'folder_open';}
.font-icon.font-star::before {content:'star';}
.font-icon.font-question::before {content:'help'; font-size:18px;}
.font-icon.font-add::before {content:'add'; color:#000; font-size:18px;}
.font-icon.font-minus::before {content:'remove'; color:#000; font-size:18px;}
.font-icon.font-window-resize::before {content:'fit_screen'; font-size:18px;}

.font-icon-100,
.font-icon-100::before {font-variation-settings:'wght' 100}
.font-icon-400,
.font-icon-400::before {font-variation-settings:'wght' 400}
.font-icon-700,
.font-icon-700::before {font-variation-settings:'wght' 700}


body.body-parent {overflow:hidden;}
body.window-popup {min-width:auto;}
body:has(.datepicker.dropdown-menu) .container-tab-item {overflow:hidden;}
body:has(#lnb-area.menu-open) #contents::before {content:''; width:100%; height:100%; position:fixed; left:0; top:0; background-color:rgba(0,0,0,0.4); z-index:999;}

/* 로그인 */
body.login {background-color:#EFF4FF; background:url(../images/bg/login-bg-img@2x.png) center center #EFF4FF no-repeat; background-size:1055px;}
body.login #wrap {min-height:100svh; display:flex; align-items: center; justify-content: center;}
.login-box {width:570px; padding:60px 0; border: 1px solid #ddd; border-radius: 12px; background-color:#fff;}
.login-top {padding-bottom:32px; display:flex; justify-content: center; align-items: center; gap:0 16px;}
.login-top .login-logo {width:52px; height:60px; display:block; background:url(../images/common/login-logo@2x.png) 0 0 no-repeat; background-size:100%;}
.login-top .login-company-name {margin-bottom:5px; font-size:24px; font-weight:600; color:#000;}
.login-top .login-company-name span {color:#2C60D0; font-weight:600; font-size:24px;}
.login-desc {padding:32px 0; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
.login-desc .login-desc-text {font-size:15px; font-weight:500; color:#000; text-align: center;}
.login-desc .login-desc-text span {font-weight:600; color:#1747AC; font-size:15px;}
.login-field-area {width:430px; margin:0 auto; padding-top:32px;}
.login-field-area .form {display:flex; flex-wrap:wrap; gap:0 12px;}
.login-field {display:flex; flex-direction:column; gap:12px 0;}
.login-field .login-field-item {display:flex; align-items: center;}
.login-field .login-field-item label {min-width:88px; font-size:14px; font-weight:500; color:#666;}
.login-field .login-field-item label.w-118 {min-width:118px;}
.login-field .login-field-item .login-input {width:100%; height:46px; padding:0 12px; border-radius:6px; border:1px solid #ddd;}
.login-field .login-field-item .common-input {height:38px;}
.login-btn-area {flex:1;}
.login-btn-area button {width:100%; height:100%; background-color:#333; border-radius:6px; font-size:16px; font-weight:600; color:#fff;}
.login-btn-area button:hover {background-color:#000;}
.login-field-opt {width:100%; margin-left:88px; margin-top:16px; display:flex; justify-content: space-between; align-items: center;}
.login-field-opt .btn-chg-pw {font-size:14px; font-weight:500; color:#666; text-decoration:underline;}
.login-field-opt .common-check {gap:0 8px;}
.login-field-opt .common-check label {font-size:14px;}
.login-field-opt .common-check input[type="checkbox"] {width:24px; height:24px; min-width:24px; }
.login-infor-text {margin-top:60px; display:flex; align-items: center; gap:0 8px; justify-content: flex-end; font-size:14px; color:#666;}
.login-infor-text::before {content:''; width:3px; height:3px; display:block; border-radius:50%; background-color:#333;}

#container {min-height:100svh; display:flex;}

#lnb-area {width:90px; min-width:70px; position:relative; display:flex; flex-direction: column; background-color:#2c60d0; z-index:1000;}
.left-button {width:100%; height:60px; }
.left-button:not(.btn-toggle-menu):hover,
.left-button:not(.btn-toggle-menu).active,
.lnb-menu-area > li.active .left-button {background-color:#1747AC;}

.lnb-menu-area .font-icon {width:20px; height:20px; margin:0 auto; display:block; background-repeat:no-repeat; background-position:center center; }
.lnb-menu-area .font-icon::before {content: '';}
.lnb-menu-area .font-icon.icon-favorite {background-image:url(/static/images/icon/icon-favorite.svg)}
.lnb-menu-area .font-icon.icon-mydesk {background-image:url(/static/images/icon/icon-mydesk.svg)}
.lnb-menu-area .font-icon.icon-project {background-image:url(/static/images/icon/icon-project.svg)}
.lnb-menu-area .font-icon.icon-sales {background-image:url(/static/images/icon/icon-sales.svg)}
.lnb-menu-area .font-icon.icon-purchase {background-image:url(/static/images/icon/icon-purchase.svg)}
.lnb-menu-area .font-icon.icon-product {background-image:url(/static/images/icon/icon-product.svg)}
.lnb-menu-area .font-icon.icon-quality {background-image:url(/static/images/icon/icon-quality.svg)}
.lnb-menu-area .font-icon.icon-account {background-image:url(/static/images/icon/icon-account.svg)}
.lnb-menu-area .font-icon.icon-hr {background-image:url(/static/images/icon/icon-hr.svg)}
.lnb-menu-area .font-icon.icon-system {background-image:url(/static/images/icon/icon-system.svg)}
.lnb-menu-area .font-icon.icon-memory {background-image:url(/static/images/icon/icon-memory.svg)}
.lnb-menu-area .font-icon.icon-doc-sch {background-image:url(/static/images/icon/icon-doc-sch.svg)}
.lnb-menu-area .font-icon.icon-money-bag {background-image:url(/static/images/icon/icon-money-bag.svg)}

.left-button.btn-toggle-menu {background-color:#111111;}
.left-button.btn-toggle-menu .material-symbols-outlined {color:#fff; font-size:24px; }
.left-button .menu-name {margin-top:12px; font-size:12px; color:#fff;}

.lnb-menu-area {max-height: calc(100svh - 60px); overflow-y: auto;}
.lnb-menu-area > li {margin-top:4px}
.lnb-menu-area > li.active > .sub-menu-area {display:block;}
.sub-menu-area {height:100%; display:none; position:absolute; left:70px; top:0; z-index:1000;}
.sub-menu-area .sub-menu-title {height:60px; padding-left:40px; display:flex; align-items: center; gap:0 12px; background-color:#333; font-size:16px; color:#fff; font-weight:700;}
.sub-menu-area .sub-menu-title .font-icon {margin:0;}
.sub-menu-area .sub-menu-inner {height:calc(100% - 60px); display:flex;}
.sub-menu-area .sub-menu-inner .sub-menu-dep2 {width:210px; overflow-y:auto; background-color:#f4f4f4;}
.sub-menu-area .sub-menu-inner .sub-menu-dep2 ul {}
.sub-menu-area .sub-menu-inner .sub-menu-dep2 ul li {}
.sub-menu-area .sub-menu-inner .sub-menu-dep2 ul li button {width:100%; min-height:54px; padding:18px 16px; display:flex; align-items: center; font-size:14px; color:rgba(7, 7, 7, 0.7); text-align:left;}
.sub-menu-area .sub-menu-inner .sub-menu-dep2 ul li button span {min-width:fit-content; font-size:14px; margin-right:12px;}
.sub-menu-area .sub-menu-inner .sub-menu-dep2 ul li button:hover,
.sub-menu-area .sub-menu-inner .sub-menu-dep2 ul li.active button {background-color:#fff; font-weight:600; color:#1747AC;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3 {width:310px; display:none; overflow-y:auto; background-color:#fff;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3.active {display:block;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3 .sub-menu-item {display:none;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3 ul {padding:5px 0; margin:0 16px}
.sub-menu-area .sub-menu-inner .sub-menu-dep3 ul + ul {border-top:1px solid #ddd;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3 ul li {display:flex; gap:0 12px; justify-content:space-between;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3 ul li > button {padding:15px 0px; font-size:14px; color:rgba(7, 7, 7, 0.7); text-align:left; flex:1;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3 ul li > button:hover,
.sub-menu-area .sub-menu-inner .sub-menu-dep3 ul li.active > button {background-color:#fff; font-weight:600; color:#1747AC;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3.type-favorite .sub-menu-item {display:none;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3.type-favorite .sub-menu-item ul li {}
.sub-menu-area .sub-menu-inner .sub-menu-dep3.type-favorite .sub-menu-item ul li button:not(.btn-favorite) {flex:1;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3.type-favorite .sub-menu-item ul li button.btn-favorite {padding:0; flex:none;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3.type-favorite .sub-menu-item ul li button.btn-favorite::before {content:'star_border'; font-family: 'Material Symbols Outlined'; font-size:24px; font-weight:400; color:#B5B5B5;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3.type-favorite .sub-menu-item ul li button.btn-favorite:hover::before {color:#B5B5B5;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3.type-favorite .sub-menu-item ul li button.btn-favorite.active::before {content:'star'; font-variation-settings:'FILL' 1; color:#FFAC10D5;}
.sub-menu-area .sub-menu-inner .sub-menu-dep3 .grp-title {display: flex; justify-content: center; align-items: center; height: 50px; font-weight: 600; font-size: 14px; color: #1747AC;}

.sub-menu-area .sub-menu-inner .sub-menu-dep3 .sub-menu-item.active {display:block;}
.lnb-menu-area > li.menu-favorite .sub-menu-area .sub-menu-inner .sub-menu-dep3 {display:block;}

#contents {flex:1;}

#header {min-width:1300px; height:60px; padding:0 36px; display:flex; align-items: center; background-color:#F5F6FA;}
.left-area {display:flex; align-self: center;}
.left-area h1 {margin:0; padding:0; display:inline-flex; align-items: center; gap:0 12px;}
.left-area h1 .top-logo {width:30px; height:24px; background:url(../images/common/logo-hd-color@2x.png) 0 0 no-repeat; background-size:100%;}
.left-area h1 .top-logo-text {margin-top:5px; font-size:15px; font-weight:600; color:#000;}

input[type="search"] {text-indent:4px;}
.top-search-area {width:230px; margin-left:36px; display:flex; overflow:hidden; position:relative;}
.top-search-area form {flex:1; display:flex; align-items: center;}
.top-search-area input[type="search"] {width:100%; height:32px; padding:0 5px; border:0; background-color:#fff; border-radius:8px; border:2px solid #1843A0; font-size:12px; color:#000;}
.top-search-area input[type="search"]::placeholder {color:#666;}
.top-search-area input[type="search"]:focus {outline:0;}
.top-search-area .btn-top-search {position:absolute; right:6px; top:50%; transform:translateY(-50%);}
.top-search-area .btn-top-search .material-symbols-outlined {font-size:24px; font-weight:400; vertical-align: top; color:#1843A0;}

.right-area {margin-left:auto; display:flex; align-items: center;}
.right-area .header-time-text {color:#000;}
.right-area .header-time-text span {color:#1747AC; font-weight:600;}
.right-area .item-line {margin-left:16px; padding-left:16px; position:relative;}
.right-area .item-line::before {content:''; width:1px; height:24px; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%); background-color:#ddd;}
.right-area .user-info-area {display:flex; align-items: center; gap:0 8px;}
.right-area .user-info-area .img-avatar {width:24px; height:24px; display:flex; position:relative; border-radius:50%; overflow:hidden; border:1px solid #8B8B8B; background-color:#fff;}
.right-area .user-info-area .img-avatar:before {content:'person'; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); color:#0066ff71;}
/*2026.01.06 이미지 존재할시  기본이미지 제거 */
.right-area .user-info-area .img-avatar.img_on:before { display: none; }
.right-area .user-info-area .img-avatar img {width:100%; height:100%; object-fit:cover; aspect-ratio: 1/1;position:relative; z-index:2;}
.right-area .user-info-area .user-name {font-weight:600; color:#1843A0; line-height:normal;}
.right-area .user-info-area .btn-user-info-modify {height:24px; padding:0 8px; color:#000; border-radius:4px; background-color:#fff; border:1px solid #707070; line-height:normal;}
.right-area .user-info-area .btn-user-info-modify:hover {border-color:#000; color:#000;}

.right-area .header-login-time {color:#000; position:relative; display:flex; align-items: center; justify-self: center; justify-content: center; height:32px;}
.right-area .header-login-time:hover::after {content:attr(tooltip-text); width:max-content; padding:5px 8px; position:absolute; left:50%; top:100%; transform:translateX(-50%); background-color:#000; border-radius:12px; color:#fff; font-weight:500; line-height:normal;}

.header-btn-area {display:flex; align-items: center; gap:0 8px;}
.header-menu-button {width:32px; min-width:32px; height:32px; position:relative; display:flex; align-items: center; justify-self: center; justify-content: center;}
.header-menu-button .msg-num {padding-top:1px; display:flex; align-items: center; justify-content: center; position:absolute; right:-5px; top:-5px; width:24px; height:24px; font-size:11px; font-weight:600; color:#fff; background-color:#F20808; border:2px solid #F5F6FA; border-radius:50%; line-height:normal;}
.header-menu-button .msg-num:empty {display:none;}
.header-menu-button::before {font-family: 'Material Symbols Outlined'; color:#777; font-size:24px;}
.header-menu-button:hover::after {content:attr(tooltip-text); width:max-content; padding:5px 8px; position:absolute; left:50%; top:100%; transform:translateX(-50%); background-color:#000; border-radius:12px; color:#fff; font-weight:500; line-height:normal;}
.header-menu-button.notice::before {content:'notifications_active';}
.header-menu-button.new-msg::before {content:'mail';}
.header-menu-button.all-menu::before {content:'view_comfy_alt';}
.header-menu-button.org-chart::before {content:'account_tree';}
.header-menu-button.msg-write::before {content:'send';}
.header-menu-button.logout::before {content:'logout';}
.header-menu-button.settings::before {content:'settings';} /* 20260225 수정 : 수정버튼을 팝업설정 아이콘 버튼으로 변경 */
.header-main {position:relative; display:flex; height:32px;}
.header-main:hover::after {content:attr(tooltip-text); width:max-content; padding:5px 8px; position:absolute; left:50%; top:100%; transform:translateX(-50%); background-color:#000; border-radius:12px; color:#fff; font-weight:500; line-height:normal;}

/*.contents-inner {max-height:calc(100svh - 85px); padding-top:36px; overflow-y:auto;}*/

.container-tab-area .container-tab-item {width: calc(100vw - 60px); height: calc(100svh - 102px); display:none; overflow:auto;}
.container-tab-area:has(.flex-box.dashboard) .container-tab-item {height: calc(100svh - 60px);}
.container-tab-area .container-tab-item.active {display:block;}
.iframe-content-area {min-width:1200px; width:100%; padding:0 10px;}

.flex-box {display:flex; align-items:center; gap:0 12px;}
.flex-box.layout {gap:12px; overflow:visible;}
.flex-box.has-important {justify-content: flex-end; gap:0;}
.flex-box.dashboard {padding-top:12px; gap:12px; flex-wrap:wrap;}
.flex-box.flex-wrap {flex-wrap:wrap; gap:12px;}
.flex-box.flex-wrap.multiple {gap:0;}
.flex-box .flex-box-item {align-self: stretch;}
.flex-box.flex-wrap.multiple .flex-box-item {width:calc(100% / 6)}
.flex-box .flex-box-item.flex-both {flex:1;}
.flex-box .flex-box-item.flex-auto {flex:auto;}
.flex-box .flex-box-item.align-flex-end {align-self: flex-end;}
.flex-box.dashboard .flex-box-item {width:calc(100% / 3 - 8px); flex:none;}
.flex-box.direction-column {flex-direction: column;}
.flex-box.height-100 {height:100%;}
.flex-box-vertical {display:flex; flex-direction:column; gap:12px;}

.gap-0 {gap:0px;}
.gap-4 {gap:4px;}

.flex-btn-area {display:flex; flex-direction: column; gap:8px 0;}
.flex-btn-area .flex-btn-arrow {min-width:38px; padding:0;}
.flex-btn-area .flex-btn-arrow .material-symbols-outlined {font-size:24px;}

.top-tab-area {margin:10px 10px 0; display:flex; position:relative;}
.top-tab-area::after {content:''; width:100%; height:1px; display:block; position:absolute; left:0; bottom:0; background-color:#ddd;}
.top-tab-area .top-tab-btn {margin-right:-1px; height:32px; padding:0 24px; display:flex; align-items: center; gap:0 8px; border:1px solid #ddd; color:#000; line-height:normal;}
.top-tab-area .top-tab-btn.active {position:relative; z-index: 1; border-color:#2C60D0; font-weight:600; color:#1747AC;}
.top-tab-area .top-tab-btn .material-symbols-outlined {width:18px; height:18px; display:flex; align-items: center; justify-content: center; border-radius:4px; background-color:#EDEDED; border:1px solid #ddd; font-size:18px; text-decoration:none;}
.top-tab-area .top-all-close {min-width: auto; height: auto; padding: 0; position: absolute; right: 0; top: 50%; transform:translateY(-50%)}
.top-tab-area .top-all-close .material-symbols-outlined {padding: 2px; font-size: 20px; font-weight: 400;}

/* 공통 폼 관련 */
.common-check {display:flex; align-items: center; gap:0 4px;}
.common-check input[type="checkbox"],
.common-check input[type="radio"] {width:13px; min-width:13px; height:13px; cursor:pointer;}
.common-check input[type="checkbox"] + label,
.common-check input[type="radio"] + label {width:max-content; color:#000; font-weight:500; cursor:pointer; line-height:normal;}

input::placeholder {color:#999; font-weight:400;}

.common-input:disabled,
.common-datepicker input:disabled,
.common-select select:disabled,
.common-check input[type="checkbox"]:disabled,
.common-check input[type="radio"]:disabled,
.common-toggle input[type="checkbox"]:disabled + label,
.common-toggle input[type="checkbox"]:disabled:checked + label {background-color:#eee; cursor:default;}
.common-check input[type="checkbox"]:disabled + label,
.common-check input[type="radio"]:disabled + label {opacity:0.3}

.common-toggle {position:relative; display:flex;}
.common-toggle label {display:inline-flex; align-items: center; gap:0 8px; cursor:pointer;}
.common-toggle label .common-toggle-text {width:max-content;}
.common-toggle label::after {content:''; min-width:40px; height:24px; display:block; border-radius:25px; background-color:#ccc;}
.common-toggle label:has(input[type="checkbox"]:checked)::after {background-color:#2c60d0;}
.common-toggle label::before {content:''; width:18px; height:18px; display:block; position:absolute; right:18px; top:50%; transform:translateY(-50%); border-radius:50%; background-color:#fff; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); transition:right ease-in-out .3s;}
.common-toggle label:has(input[type="checkbox"]:checked)::before {right:4px; transition:right ease-in-out .3s;}

.common-toggle input[type="checkbox"] {display:none;}

.common-input {width:100%; height:24px; padding:0 8px; border-radius:6px; border:1px solid #ddd; font-size:14px;}
.common-input::placeholder {color:#999; font-size:12px;}
.common-input.type-textarea {padding:8px; height:50px; resize: none;}

.common-select {min-width:max-content; display:flex; position:relative; overflow:hidden;}
.common-select.full {width:100%;}
.common-select select {width:100%; height:24px; padding:0 28px 0 8px; appearance: none; border-radius:6px; border:1px solid #ddd; line-height:26px; font-size:12px;}
.common-select::after {content:'keyboard_arrow_down'; font-family: 'Material Symbols Outlined'; position:absolute; right:4px; top:50%; transform:translateY(-50%); font-size:20px; color:#000; pointer-events: none;}

.common-datepicker {display:flex; position:relative; overflow:hidden;}
.common-datepicker .type-datepicker {width:100%; height:24px; padding:0 30px 0 12px; appearance: none; border-radius:6px; border:1px solid #ddd;}
.common-datepicker::after {content:'calendar_month'; font-family: 'Material Symbols Outlined'; position:absolute; right:8px; top:50%; transform:translateY(-50%); font-size:16px; color:#000; pointer-events: none;}

.common-input.type-select {appearance: none;}

.common-search-input {position:relative;}
.common-search-input .btn-input-search {position:absolute; right:8px; top:50%; transform:translateY(-50%); vertical-align:top;}
.common-search-input .btn-input-search .material-symbols-outlined {vertical-align: middle; font-size:20px;}

.datepicker {min-width:236px; position:absolute; background-color:#fff; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); border-radius:5px; border: 1px solid #ccc; z-index: 1000; font-size:14px; }
.datepicker td, .datepicker th {width:30px; height:30px;}

/* 버튼 */
.common-btn-area {width:100%; display:flex; gap:0 8px; margin-top:12px;}
.common-btn-area.d-flex .common-btn {flex:1;}
.common-btn-area.align-l {justify-content: flex-start;}
.common-btn-area.align-r {justify-content: flex-end;}
.common-btn-area.align-c {justify-content: center;}
.common-btn-area.login-form {margin-top:12px; margin-left:118px;}
.common-btn {min-width:60px; height:24px; padding:0 8px; display:inline-flex; align-items: center; justify-content: center; gap:0 8px; flex:none; border-radius:6px; background-color:#fff; border:1px solid #333; font-weight:600; color:#333; line-height:normal; white-space:nowrap;}
.common-btn:has(.material-symbols-outlined) {gap:0 4px;}
.common-btn:has(.font-icon) {gap:0 4px; padding: 0 8px 0 6px; justify-content: center;}
.common-btn:disabled {opacity:0.6;}
.common-btn:hover {border-color:#000; color:#000; background-color:#F9F9F9;}
.common-btn.c-black-fill {background-color:#333; color:#fff; border-color:transparent;}
.common-btn.c-black-fill:hover {background-color:#000;}
.common-btn.c-black-fill .font-icon {color:#fff;}
.common-btn.c-blue {border-color:#2C60D0; color:#2C60D0;}
.common-btn.c-blue:hover {background-color:#F5F8FF;}
.common-btn.c-blue-fill {background-color:#2C60D0; color:#fff;}
.common-btn.c-blue-fill:hover {background-color:#1747AC;}
.common-btn.btn-excel {border-color:#2E7D32; color:#2E7D32; background-color:#fff;}
.common-btn.btn-excel:hover {background-color:#F9F9F9;}
.common-btn .font-icon {font-size:18px;}
.common-btn .font-icon.c-white {color:#fff; font-weight:200;}
.common-btn.auto-l {margin-left:auto;}
.common-btn.auto-r {margin-right:auto;}

.text-infor-box {margin-top:12px; padding:12px; background-color:#FAFAFA;}
.text-infor-box ul {}
.text-infor-box ul li {display:flex; gap:0 12px; font-size:14px; color:#666; line-height:24px; }
.text-infor-box ul li::before {content:'-'}

.layer-chg-pw-text-01 {padding:20px; border:1px solid #1747AC; font-size:16px; font-weight:600; color:#000; line-height:24px;}
.layer-chg-pw-text-01 span {color:#1747AC; font-weight:600; font-size:16px;}
.layer-chg-pw-text-02 {font-size:14px; color:#000; line-height:24px;}
.layer-chg-pw-text-01 + .layer-chg-pw-text-02 {margin-top:20px;}
.layer-chg-pw-text-02 span {color:#1747AC; font-weight:600;}

.layer-popup {display: none;}
.layer-popup.active {display: block;}
.layer-popup:before {content:''; width:100%; height:100%; display:block; position:fixed; left:0; top:0; background-color: rgba(0,0,0,0.5); z-index:1000; opacity: 0;}
.layer-popup.active:before {opacity: 0.5;}
.layer-popup .layer-inner {width:400px; overflow:hidden; transform:translate(-50%, -50%); position:fixed; left:50%; top:50%; background-color:#fff; border-radius:12px; z-index:1000;}
.layer-popup .layer-head {height:52px; display:flex; align-items: center; justify-content: center; background-color:#1747AC;}
.layer-popup .layer-head .head-inner {padding:0 20px; position:relative; flex:1;}
.layer-popup .layer-head .head-inner .btn-layer-close {width:32px; height:32px; padding:0; display:flex; align-items: center; justify-content: center; position:absolute; right:10px; top:50%; transform:translateY(-50%); border:0;}
.layer-popup .layer-head .head-inner .btn-layer-close .material-symbols-outlined {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); color: #fff; font-size: 32px; font-weight:100;}
.layer-popup.type-window .layer-head .head-inner {display:flex; justify-content: space-between; align-items: center;}
.layer-popup.type-window .layer-head .head-inner .common-btn-area {width:auto; margin-top:0;}

.layer-popup .layer-head .head-inner .head-title {margin:0; font-size: 16px; font-weight: 500; color:#fff; line-height:normal;}
.layer-popup .layer-body .layer-body-inner {padding:24px 20px; max-height:70svh; overflow-y:auto;}
.layer-popup .layer-body .layer-body-inner .login-field-area {width:100%; padding-top:0;}
.layer-popup .layer-body .layer-body-inner .login-field-area .login-field {width:100%;}
.layer-popup .layer-body .layer-body-inner .login-field-area:has(.login-btn-area) .login-field {max-width:calc(100% - 100px)}
.layer-popup .layer-body .layer-body-inner .login-field-area .common-btn {height:38px; font-size:14px;}
.layer-popup .layer-body .layer-body-inner .login-infor-text {margin-top:32px; color:#666;}
.layer-popup .layer-body .layer-body-inner .layer-form-box {padding:16px 0 20px;}
.layer-popup .layer-body .layer-body-inner .layer-form-box:first-child {padding:0 0 20px;}
.layer-popup .layer-body .layer-body-inner .layer-form-box .layer-form-text {font-size:14px; color:#000;}
.layer-popup .layer-body .layer-body-inner .layer-form-box .layer-form-text.important {display:flex; align-items: center; color:#BA0101; gap:0 4px;}
.layer-popup .layer-body .layer-body-inner .layer-form-box .layer-form-text.important .material-symbols-outlined {font-size:20px; color:#BA0101;}
.layer-popup .layer-body .layer-body-inner .layer-form-box .layer-form-text + .login-field-area {padding-top:32px}
.layer-popup .layer-body .layer-body-inner .layer-form-box + .layer-form-box {border-top:1px solid #ddd; margin:0 -20px; padding:16px 20px 20px;}
.layer-popup .layer-body .layer-body-inner .layer-form-box + .layer-form-box:last-child {padding:16px 20px 0;}
.layer-popup .layer-body .layer-body-inner .top-search-condition-area {margin-top:0; margin-bottom:12px;}
.layer-popup .layer-body .layer-body-inner .title-wrap {display: flex; justify-content: space-between; align-items: center;}

.layer-popup.type-window:before {display:none;}
.layer-popup.type-window .layer-inner {width:100%; overflow:hidden; transform:unset; position:relative; left:0; top:0; border-radius:0;}
.layer-popup.type-window .layer-body .layer-body-inner {max-height:inherit;}

html {height: 100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; box-sizing: border-box;}
body {height: 100%; /* min-width: 1280px; */ background: #eaf6ff; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,p,button,table,th,td,pre {margin: 0; padding: 0;}
body,div,dl,dt,dd,h1,h2,h3,h4,h5,h6,form,fieldset,p,th,td,input,textarea,select,button,pre,a {font-family: NG, 'Malgun Gothic', '맑은 고딕', Arial, Helvetica, sans-serif; font-size: 12px; line-height: 1.5; font-weight: normal;}
/*
input[type="checkbox" i] {margin-top: 0; margin-left: 0;}
*/

strong,
.font-bold {font-weight: bold; font-family: "NGB";}
input[type="password"] {font-family: NG, 'Malgun Gothic', '맑은 고딕', Arial, Helvetica, sans-serif;}
textarea {width: 100%; border-radius: 4px; resize: none;}
select,input,img, button {vertical-align: middle;}
button {border: 0; background: transparent;}
ul, ol {list-style-type: none; }
ul li {padding: 0; margin: 0;}
.hide,legend,hr,caption span {position: absolute; left: -3000%;}
em, address, i {font-style: normal;}
table {border-collapse: collapse; border-spacing: 0; width: 100%;}
a {color: #666; text-decoration: none;}
a:focus,
a:hover {text-decoration: none;}
fieldset, img, button{border: 0;}
input[type=text]::-ms-clear {display: none;}
select {padding:0 0 0 5px; height:8px; border:px solid #e3e3e3;}
textarea,
input[type="file"],
input[type="password"],
input[type="text"] {text-indent: 4px; border: 1px solid #bbb;}
textarea {text-indent: 0px;}
select {height:30px \0IE8;} /* IE8 전용*/
select:focus, textarea:focus,
input[type="password"]:focus,
input[type="file"]:focus,
input[type="text"]:focus {border:1px solid #2777d1;}
textarea[readonly="readonly"],
button[readonly="readonly"],
select[readonly="readonly"],
input[readonly="readonly"],
textarea[disabled="disabled"],
button[disabled="disabled"],
select[disabled="disabled"],
input[disabled="disabled"] {background: #e9ecef; border-color: #bbb;}

/*
input[type="password"],
input[type="file"],
input[type="text"] {height: 34px; line-height: 34px;} */
input[type="file"] {width: 100%; vertical-align: middle; text-indent: -999px;}
input[type="radio"] {vertical-align: text-bottom;}
label {display: inline-block; margin-bottom: 0px;}
.clear {zoom: 1; clear: both;}
.clear:after {content: ""; display: block; clear: both;}
.dpb {display: block !important;}
.dpn {display: none !important;}
.dpf {display: flex !important;}
.dpf-inline {display: inline-flex !important;}
.inline {display: inline-block !important;}
.visible {visibility: visible!important}
.invisible {visibility: hidden!important}
.pr {position: relative;}
.position-static {position: static!important}
.algin-item-center {align-items: center;}
.border-0 {border: 0 !important}
.border-top-0 {border-top: 0 !important}
.border-right-0 {border-right: 0 !important}
.border-bottom-0 {border-bottom: 0 !important}
.border-left-0 {border-left: 0 !important}
.border-top {border-top: 1px solid #ddd !important;}
.border-bottom {border-bottom: 1px solid #ddd !important;}
.text-left {text-align:left !important;}
.text-center {text-align:center !important;}
.text-right {text-align:right !important;}
.v-align-top {vertical-align:top !important;}
.v-align-middle {vertical-align:middle !important;}
.v-align-bottom {vertical-align:bottom !important;}
/* .mr-1, .mx-1 {margin-right: .375rem!important} */

.p16 {padding: 16px !important;}
.pt10 {padding-top: 10px !important;}
.pt12 {padding-top: 12px !important;}
.pr0 {padding-right: 0px !important;}
.pr5 {padding-right: 5px !important;}
.pr10 {padding-right: 10px !important;}
.pr15 {padding-right: 15px !important;}
.pr30 {padding-right: 30px;}
.pb0 {padding-bottom: 0px !important;}
.pb10 {padding-bottom: 10px;}
.pb12 {padding-bottom: 12px !important;}
.pl0 {padding-left: 0px !important;}
.pl5 {padding-left: 5px !important;}
.pl10 {padding-left: 10px !important;}
.pl15 {padding-left: 15px !important;}
.pl20 {padding-left: 20px !important;}
.mt0 {margin-top: 0px !important;}
.mt3 {margin-top: 3px;}
.mt5 {margin-top: 5px;}
.mt6 {margin-top: 6px;}
.mt7 {margin-top: 7px;}
.mt10 {margin-top: 10px;}
.mt12 {margin-top: 12px;}
.mt15 {margin-top: 15px;}
.mt16 {margin-top: 15px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 30px;}
.mt40 {margin-top: 40px;}
.mt-5 {margin-top: -5px;}
.mt-6 {margin-top: -6px;}
.mt-9 {margin-top: -9px;}
.mt-10 {margin-top: -10px;}
.mr0 {margin-right: 0px !important;}
.mr3 {margin-right: 3px !important;}
.mr5 {margin-right: 5px;}
.mr10 {margin-right: 10px;}
.mr15 {margin-right: 15px;}
.mr25 {margin-right: 25px;}
.mr-1 {margin-right: -1px !important;}
.mb3 {margin-bottom: 3px;}
.mb5 {margin-bottom: 5px !important;}
.mb7 {margin-bottom: 7px;}
.mb10 {margin-bottom: 10px;}
.mb20 {margin-bottom: 20px;}
.mb50 {margin-bottom: 50px;}
.mb100 {margin-bottom: 100px;}
.mb180 {margin-bottom: 180px;}
.ml5 {margin-left: 5px;}
.ml10 {margin-left: 10px;}
.ml15 {margin-left: 15px;}
.ml25 {margin-left: 25px;}
.ml75 {margin-left: 75px;}
.ml100 {margin-left: 100px;}
.ml150 {margin-left: 150px;}
.ml200 {margin-left: 200px;}
.ml-7 {margin-left: -7px !important;}

.text-primary {color:#005da7 !important;}
a.text-primary:focus,
a.text-primary:hover {color: #044273!important;}
.text-secondary {color:#d91920 !important;}
a.text-secondary:focus,
a.text-secondary:hover {color: #9c0e13!important;}
.text-danger {color:#ff0000 !important;}
a.text-danger:focus,
a.text-danger:hover {color: #ac0b0b!important;}
.text-success {color:#31933d !important;}
a.text-success:focus,
a.text-success:hover {color: #14691f!important;}
.text-warning {color:#ff7e00 !important;}
a.text-warning:focus,
a.text-warning:hover {color: #a75608!important;}
.text-default {color:#aaa !important;}
a.text-default:focus,
a.text-default:hover {color: #6f6f6f!important;}

.text-default-50 {color:#ccc !important;}
.text-default-50:focus,
.text-default-50:hover {color: #6f6f6f!important;}

.text-info {color:#2489e1 !important;}
a.text-info:focus,
a.text-info:hover {color: #10528c!important;}
.text-light {color: #f8f9fa!important;}
a.text-light:focus,
a.text-light:hover {color: #dae0e5!important;}
.text-dark {color: #666!important;}
a.text-dark:focus,
a.text-dark:hover {color: #1d2124!important;}
.text-muted {color: #6c757d!important;}
.text-white {color: #fff !important;}
.state .text-title,
.calendar-table .text-title {color: #666;}
.state .text-complete,
.calendar-table .text-complete {color: #bbb;}
.state .text-transfer,
.calendar-table .text-transfer {color: #000;}
.state .text-fix,
.calendar-table .text-fix {color: #005da7;}

.text-hide {font: 0/0 a; color: transparent; text-shadow: none; background-color: transparent; border: 0;}
.text-white {color: #fff!important}
.fixed-table.spacing-sm {letter-spacing: -1px;}
.spacing-sm {letter-spacing: -1.5px;}
.font-11 {font-size: 11px!important; line-height: 1.2rem;}
.font-12 {font-size: 12px!important; line-height: 1.4rem;}
.font-13 {font-size: 13px!important; line-height: 1.4rem;}
.font-14 {font-size: 14px!important; line-height: 1.4rem;}
.font-15 {font-size: 15px!important; line-height: 1.4rem;}
.font-16 {font-size: 16px!important;}
.font-18 {font-size: 18px!important; line-height: 1.4rem;}
.font-24 {font-size: 24px!important; line-height: 1.4rem;}
.font-30 {font-size: 30px!important; line-height: 1.4rem;}
.font-italic {font-style: italic!important}

.text-lowercase {text-transform: lowercase!important;}
.text-uppercase {text-transform: uppercase!important}
.text-capitalize {text-transform: capitalize!important}

[type=button]:not(:disabled),
[type=reset]:not(:disabled),
[type=submit]:not(:disabled),
button:not(:disabled) {cursor: pointer;}
.btn {display: inline-block; margin-bottom: 0; font-weight: normal;	text-align: center;	white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; background-image: none; border: 1px solid transparent; padding: 3px 4px 2px 4px; font-size: 12px; height: 27px; border-radius: 3px; -webkit-user-select: none; -moz-user-select: none;	-ms-user-select: none; user-select: none;}
.btn-lg,
.btn-group-lg > .btn {padding: 10px 16px; font-size: 16px; line-height: 1.3333333; border-radius: 6px;}
.btn-md,
.btn-group-md > .btn {padding: 5px 10px; font-size: 12px; line-height: 1.5; border-radius: 3px;}
.btn-block {display: block; width: 100%;}
.btn-block + .btn-block {margin-top: 5px;}
input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {width: 100%;}

.btn-sm,
.font-sm {font-size: 10px;}
button[disabled] {background: #ccc !important; color: #777 !important; border: 1px solid #bbb !important;}
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {cursor: not-allowed; filter: alpha(opacity=65); opacity: 0.65; -webkit-box-shadow: none; box-shadow: none;}
a.btn.disabled,
fieldset[disabled] a.btn {pointer-events: none;}

.btn-icon {padding: 0 !important;}
.btn-rounded {border-radius: 2em}
.btn:hover {color: #6c757d; text-decoration: none}
.btn.focus,
.btn:focus {outline: 0;}
.btn.disabled,
.btn:disabled {opacity: .65}
a.btn.disabled,
fieldset:disabled a.btn {pointer-events: none}

.btn-default {
color: #000;
background: rgb(245,245,245); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(221,221,221,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 ); /* IE6-9 */
border: 1px solid #bbb;
}
.btn-default:hover {
color: #000;
background: rgb(221,221,221); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(221,221,221,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(221,221,221,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(221,221,221,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.btn-default.focus,
.btn-default:focus {-webkit-box-shadow: 0 0 0 0px rgba(153, 153, 153, 0.5); box-shadow: 0 0 0 0px rgba(153, 153, 153, .5)}
.btn-default.disabled,
.btn-default:disabled {color: #fff; background-color: #6c757d; border-color: #6c757d}
.btn-default:not(:disabled):not(.disabled).active,
.btn-default:not(:disabled):not(.disabled):active,
.show>.btn-default.dropdown-toggle {color: #000; background-color: #777; border-color: #777}
.btn-default:not(:disabled):not(.disabled).active:focus,
.btn-default:not(:disabled):not(.disabled):active:focus,
.show>.btn-default.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(153, 153, 153, .5); box-shadow: 0 0 0 0px rgba(153, 153, 153, .5)}

.btn-important {
color: #fff;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#2e84c8+0,145aa8+100 */
background: #2e84c8; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #2e84c8 0%, #145aa8 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #2e84c8 0%,#145aa8 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #2e84c8 0%,#145aa8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2e84c8', endColorstr='#145aa8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.btn-important:hover {
color: #fff;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#145aa8+0,145aa8+45,2e84c8+99 */
background: #145aa8; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #145aa8 0%, #145aa8 45%, #2e84c8 99%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #145aa8 0%,#145aa8 45%,#2e84c8 99%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #145aa8 0%,#145aa8 45%,#2e84c8 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#145aa8', endColorstr='#2e84c8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.btn-important.focus,
.btn-important:focus {-webkit-box-shadow: 0 0 0 0px rgba(4, 66, 115, 0.5); box-shadow: 0 0 0 0px rgba(4, 66, 115, .5)}
.btn-important.disabled,
.btn-important:disabled {color: #fff; background-color: #005da7; border-color: #044273}
.btn-important:not(:disabled):not(.disabled).active,
.btn-important:not(:disabled):not(.disabled):active,
.show>.btn-important.dropdown-toggle {color: #fff; background-color: #005da7; border-color: #005da7}
.btn-important:not(:disabled):not(.disabled).active:focus,
.btn-important:not(:disabled):not(.disabled):active:focus,
.show>.btn-important.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 .2px rgba(0, 93, 167, .5); box-shadow: 0 0 0 .2px rgba(0, 93, 167, .5)}

.btn-primary-gra {
color: #0e4c92;
background: rgb(245,245,245); /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, rgba(221,221,221,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 ); /* IE6-9 */
border: 1px solid #aaa;
}
.btn-primary-gra:hover {
color: #0b2b50;
background: rgb(221,221,221); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(221,221,221,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(221,221,221,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(221,221,221,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
border: 1px solid #999;
  }
.btn-primary-gra.focus,
.btn-primary-gra:focus {-webkit-box-shadow: 0 0 0 0px rgba(153, 153, 153, 0.5); box-shadow: 0 0 0 0px rgba(153, 153, 153, .5)}
.btn-primary-gra.disabled,
.btn-primary-gra:disabled {color: #fff; background-color: #6c757d; border-color: #6c757d}
.btn-primary-gra:not(:disabled):not(.disabled).active,
.btn-primary-gra:not(:disabled):not(.disabled):active,
.show>.btn-primary-gra.dropdown-toggle {color: #000; background-color: #777; border-color: #777}
.btn-primary-gra:not(:disabled):not(.disabled).active:focus,
.btn-primary-gra:not(:disabled):not(.disabled):active:focus,
.show>.btn-primary-gra.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(153, 153, 153, .5); box-shadow: 0 0 0 0px rgba(153, 153, 153, .5)}

.btn-primary {color: #fff; background-color: #0c70c0; border-color: #0c70c0}
.btn-primary:hover {color: #fff; background-color: #044273; border-color: #044273}
.btn-primary.focus,
.btn-primary:focus {-webkit-box-shadow: 0 0 0 0px rgba(4, 66, 115, 0.5); box-shadow: 0 0 0 0px rgba(4, 66, 115, .5)}
.btn-primary.disabled,
.btn-primary:disabled {color: #fff; background-color: #0c70c0; border-color: #044273}
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show>.btn-primary.dropdown-toggle {color: #fff; background-color: #0c70c0; border-color: #0c70c0}
.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show>.btn-primary.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 .2px rgba(0, 93, 167, .5); box-shadow: 0 0 0 .2px rgba(0, 93, 167, .5)}

.btn-secondary {color: #fff; background-color: #d91920; border-color: #d91920}
.btn-secondary:hover {color: #fff; background-color: #9c0e13; border-color: #9c0e13}
.btn-secondary.focus,
.btn-secondary:focus {-webkit-box-shadow: 0 0 0 0px rgba(156, 14, 19, .5); box-shadow: 0 0 0 0px rgba(156, 14, 19, .5)}
.btn-secondary.disabled,
.btn-secondary:disabled {color: #fff; background-color: #ff969a; border-color: #ff969a}
.btn-secondary:not(:disabled):not(.disabled).active,
.btn-secondary:not(:disabled):not(.disabled):active,
.show>.btn-secondary.dropdown-toggle {color: #fff; background-color: #545b62; border-color: #4e555b}
.btn-secondary:not(:disabled):not(.disabled).active:focus,
.btn-secondary:not(:disabled):not(.disabled):active:focus,
.show>.btn-secondary.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(156, 14, 19, .5); box-shadow: 0 0 0 0px rgba(156, 14, 19, .5)
}

.btn-danger {color: #fff; background-color: #ff0000; border-color: #ff0000}
.btn-danger:hover {color: #fff; background-color: #ac0b0b; border-color: #ac0b0b}
.btn-danger.focus,
.btn-danger:focus {-webkit-box-shadow: 0 0 0 0px rgba(172, 11, 11, .5); box-shadow: 0 0 0 0px rgba(172, 11, 11, .5)}
.btn-danger.disabled,
.btn-danger:disabled {color: #fff; background-color: #ff969a; border-color: #ff969a}
.btn-danger:not(:disabled):not(.disabled).active,
.btn-danger:not(:disabled):not(.disabled):active,
.show>.btn-danger.dropdown-toggle {color: #fff; background-color: #545b62; border-color: #4e555b}
.btn-danger:not(:disabled):not(.disabled).active:focus,
.btn-danger:not(:disabled):not(.disabled):active:focus,
.show>.btn-danger.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(172, 11, 11, .5); box-shadow: 0 0 0 0px rgba(172, 11, 11, .5)
}

.btn-success {color: #fff; background-color: #31933d; border-color: #31933d}
.btn-success:hover {color: #fff; background-color: #14691f; border-color: #14691f}
.btn-success.focus,
.btn-success:focus {-webkit-box-shadow: 0 0 0 0px rgba(20, 105, 31, .5); box-shadow: 0 0 0 0px rgba(20, 105, 31, .5)}
.btn-success.disabled,
.btn-success:disabled {color: #fff; background-color: #4cc65b; border-color: #4cc65b}
.btn-success:not(:disabled):not(.disabled).active,
.btn-success:not(:disabled):not(.disabled):active,
.show>.btn-success.dropdown-toggle {color: #fff; background-color: #545b62; border-color: #4e555b}
.btn-success:not(:disabled):not(.disabled).active:focus,
.btn-success:not(:disabled):not(.disabled):active:focus,
.show>.btn-success.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(20, 105, 31, .5); box-shadow: 0 0 0 0px rgba(20, 105, 31, .5)}

.btn-warning {color: #fff; background-color: #ff7e00; border-color: #ff7e00}
.btn-warning:hover {color: #fff; background-color: #a75608; border-color: #a75608}
.btn-warning.focus,
.btn-warning:focus {-webkit-box-shadow: 0 0 0 0px rgba(167, 86, 8, .5); box-shadow: 0 0 0 0px rgba(167, 86, 8, .5)}
.btn-warning.disabled,
.btn-warning:disabled {color: #fff; background-color: #ffb063; border-color: #ffb063}
.btn-warning:not(:disabled):not(.disabled).active,
.btn-warning:not(:disabled):not(.disabled):active,
.show>.btn-warning.dropdown-toggle {color: #fff; background-color: #545b62; border-color: #4e555b}
.btn-warning:not(:disabled):not(.disabled).active:focus,
.btn-warning:not(:disabled):not(.disabled):active:focus,
.show>.btn-warning.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(167, 86, 8, .5); box-shadow: 0 0 0 0px rgba(167, 86, 8, .5)
}

.btn-info {color: #fff; background-color: #2489e1; border-color: #2489e1}
.btn-info:hover {color: #fff; background-color: #10528c; border-color: #10528c}
.btn-info.focus,
.btn-info:focus {-webkit-box-shadow: 0 0 0 0px rgba(16, 82, 140, .5); box-shadow: 0 0 0 0px rgba(16, 82, 140, .5)}
.btn-info.disabled,
.btn-info:disabled {color: #fff; background-color: #87c7ff; border-color: #87c7ff}
.btn-info:not(:disabled):not(.disabled).active,
.btn-info:not(:disabled):not(.disabled):active,
.show>.btn-info.dropdown-toggle {color: #fff; background-color: #0b406e; border-color: #0b2841}
.btn-info:not(:disabled):not(.disabled).active:focus,
.btn-info:not(:disabled):not(.disabled):active:focus,
.show>.btn-info.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(16, 82, 140, .5); box-shadow: 0 0 0 0px rgba(16, 82, 140, .5)
}

.btn-light {color: #333; background-color: #fff; border-color: #bbb}
.btn-light:hover {color: #333; background-color: #eee; border-color: #aaa}
.btn-light.focus,
.btn-light:focus {-webkit-box-shadow: 0 0 0 0px rgba(16, 82, 140, .5); box-shadow: 0 0 0 0px rgba(16, 82, 140, .5)}
.btn-light.disabled,
.btn-light:disabled {color: #fff; background-color: #6c757d; border-color: #6c757d}
.btn-light:not(:disabled):not(.disabled).active,
.btn-light:not(:disabled):not(.disabled):active,
.show>.btn-light.dropdown-toggle {color: #333; background-color: #eee; }
.btn-light:not(:disabled):not(.disabled).active:focus,
.btn-light:not(:disabled):not(.disabled):active:focus,
.show>.btn-light.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(16, 82, 140, .5); box-shadow: 0 0 0 0px rgba(16, 82, 140, .5)
}

.btn-dark {color: #fff; background-color: #888; border-color: #777}
.btn-dark:hover {color: #fff; background-color: #777; border-color: #777}
.btn-dark.focus,
.btn-dark:focus {-webkit-box-shadow: 0 0 0 .2rem rgba(80, 88, 98, .5); box-shadow: 0 0 0 .2rem rgba(80, 88, 98, .5)}
.btn-dark.disabled,
.btn-dark:disabled {color: #fff; background-color: #313a46; border-color: #313a46}
.btn-dark:not(:disabled):not(.disabled).active,
.btn-dark:not(:disabled):not(.disabled):active,
.show>.btn-dark.dropdown-toggle {color: #fff; background-color: #1c2128; border-color: #171b21}
.btn-dark:not(:disabled):not(.disabled).active:focus,
.btn-dark:not(:disabled):not(.disabled):active:focus,
.show>.btn-dark.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 .2rem rgba(80, 88, 98, .5); box-shadow: 0 0 0 .2rem rgba(80, 88, 98, .5)}

.btn-deepdark {color: #fff; background-color: #333; }
.btn-deepdark:hover {color: #fff; background-color: #000; }
.btn-deepdark.disabled,
.btn-deepdark:disabled {color: #fff; background-color: #666;}
.btn-deepdark:not(:disabled):not(.disabled).active,
.btn-deepdark:not(:disabled):not(.disabled):active,
.show>.btn-deepdark.dropdown-toggle {color: #fff; background-color: #1c2128;}
.btn-disbable,
.btn-disbable:hover {color: #fff; border: 1px solid #fff; background: #666; opacity: 0.3; filter: alpha(opacity=30); cursor: not-allowed;}

.btn-link {color: #005da7; text-decoration: underline; text-align: left}
.btn-link:hover {color: #000981; text-decoration: underline}
.btn-link.focus,
.btn-link:focus {text-decoration: none; -webkit-box-shadow: none; box-shadow: none}
.btn-link.disabled,
.btn-link:disabled {color: #adb5bd; pointer-events: none}

.btn-outline-default {color: #666; border-color: #d6d6d6}
.btn-outline-default:hover {color: #000; border-color: #999}
.btn-outline-default.focus,
.btn-outline-default:focus {-webkit-box-shadow: 0 0 0 0px rgba(153, 153, 153, 0.5); box-shadow: 0 0 0 0px rgba(153, 153, 153, .5)}
.btn-outline-default.disabled,
.btn-outline-default:disabled {color: #fff; background-color: transparent;}
.btn-outline-default:not(:disabled):not(.disabled).active,
.btn-outline-default:not(:disabled):not(.disabled):active,
.show>.btn-outline-default.dropdown-toggle {color: #fff; background-color: #005da7; border-color: #005da7}
.btn-outline-default:not(:disabled):not(.disabled).active:focus,
.btn-outline-default:not(:disabled):not(.disabled):active:focus,
.show>.btn-outline-default.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 .2px rgba(153, 153, 153, .5); box-shadow: 0 0 0 .2px rgba(153, 153, 153, .5)}

.btn-outline-primary {color: #0c70c0; background: #fff; border-color: #0c70c0}
.btn-outline-primary:hover {color: #044273; border-color: #044273}
.btn-outline-primary.focus,
.btn-outline-primary:focus {-webkit-box-shadow: 0 0 0 0px rgba(4, 66, 115, 0.5); box-shadow: 0 0 0 0px rgba(4, 66, 115, .5)}
.btn-outline-primary.disabled,
.btn-outline-primary:disabled {color: #0c70c0; background-color: transparent}
.btn-outline-primary:not(:disabled):not(.disabled).active,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.show>.btn-outline-primary.dropdown-toggle {color: #0c70c0; border-color: #0c70c0}
.btn-outline-primary:not(:disabled):not(.disabled).active:focus,
.btn-outline-primary:not(:disabled):not(.disabled):active:focus,
.show>.btn-outline-primary.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 .2px rgba(0, 93, 167, .5); box-shadow: 0 0 0 .2px rgba(0, 93, 167, .5)}

.btn-outline-secondary {color: #d91920; border-color: #d91920}
.btn-outline-secondary:hover {color: #9c0e13; border-color: #9c0e13}
.btn-outline-secondary.focus,
.btn-outline-secondary:focus {-webkit-box-shadow: 0 0 0 0px rgba(156, 14, 19, .5); box-shadow: 0 0 0 0px rgba(156, 14, 19, .5)}
.btn-outline-secondary.disabled,
.btn-outline-secondary:disabled {color: #d91920; background-color: transparent;}
.btn-outline-secondary:not(:disabled):not(.disabled).active,
.btn-outline-secondary:not(:disabled):not(.disabled):active,
.show>.btn-outline-secondary.dropdown-toggle {color: #fff; background-color: #545b62; border-color: #4e555b}
.btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
.btn-outline-secondary:not(:disabled):not(.disabled):active:focus,
.show>.btn-outline-secondary.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(156, 14, 19, .5); box-shadow: 0 0 0 0px rgba(156, 14, 19, .5)
}

.btn-outline-danger {color: #ff0000; border-color: #ff0000}
.btn-outline-danger:hover {color: #ac0b0b; border-color: #ac0b0b}
.btn-outline-danger.focus,
.btn-outline-danger:focus {-webkit-box-shadow: 0 0 0 0px rgba(172, 11, 11, .5); box-shadow: 0 0 0 0px rgba(172, 11, 11, .5)}
.btn-outline-danger.disabled,
.btn-outline-danger:disabled {color: #fff; background-color: transparent}
.btn-outline-danger:not(:disabled):not(.disabled).active,
.btn-outline-danger:not(:disabled):not(.disabled):active,
.show>.btn-outline-danger.dropdown-toggle {color: #fff; background-color: #545b62; border-color: #4e555b}
.btn-outline-danger:not(:disabled):not(.disabled).active:focus,
.btn-outline-danger:not(:disabled):not(.disabled):active:focus,
.show>.btn-outline-danger.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(172, 11, 11, .5); box-shadow: 0 0 0 0px rgba(172, 11, 11, .5)
}

.btn-outline-success {color: #31933d; border-color: #31933d}
.btn-outline-success:hover {color: #14691f; border-color: #14691f}
.btn-outline-success.focus,
.btn-outline-success:focus {-webkit-box-shadow: 0 0 0 0px rgba(20, 105, 31, .5); box-shadow: 0 0 0 0px rgba(20, 105, 31, .5)}
.btn-outline-success.disabled,
.btn-outline-success:disabled {color: #fff; background-color: transparent;}
.btn-outline-success:not(:disabled):not(.disabled).active,
.btn-outline-success:not(:disabled):not(.disabled):active,
.show>.btn-outline-success.dropdown-toggle {color: #08400f; background-color: #fff; border-color: #08400f}
.btn-outline-success:not(:disabled):not(.disabled).active:focus,
.btn-outline-success:not(:disabled):not(.disabled):active:focus,
.show>.btn-outline-success.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(20, 105, 31, .5); box-shadow: 0 0 0 0px rgba(20, 105, 31, .5)
}

.btn-outline-warning {color: #ff7e00; border-color: #ff7e00}
.btn-outline-warning:hover {color: #a75608; border-color: #a75608}
.btn-outline-warning.focus,
.btn-outline-warning:focus {-webkit-box-shadow: 0 0 0 0px rgba(167, 86, 8, .5); box-shadow: 0 0 0 0px rgba(167, 86, 8, .5)}
.btn-outline-warning.disabled,
.btn-outline-warning:disabled {color: #fff; background-color: transparent;}
.btn-outline-warning:not(:disabled):not(.disabled).active,
.btn-outline-warning:not(:disabled):not(.disabled):active,
.show>.btn-outline-warning.dropdown-toggle {color: #fff; background-color: #545b62; border-color: #4e555b}
.btn-outline-warning:not(:disabled):not(.disabled).active:focus,
.btn-outline-warning:not(:disabled):not(.disabled):active:focus,
.show>.btn-outline-warning.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(167, 86, 8, .5); box-shadow: 0 0 0 0px rgba(167, 86, 8, .5)
}

.btn-outline-warning2 {
    color: #ff7e00; border-color: #dc8b2a;
    background: rgb(245,245,245); /* Old browsers */
    background: -moz-linear-gradient(top,  #ffffff 0%, rgba(221,221,221,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 ); /* IE6-9 */
}

.btn-outline-warning2:hover {
    color: #a75608; border-color: #d87412;
    background: rgb(221,221,221); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(221,221,221,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(221,221,221,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(221,221,221,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

.btn-outline-info {color: #2489e1; border-color: #2489e1}
.btn-outline-info:hover {color: #10528c; border-color: #10528c}
.btn-outline-info.focus,
.btn-outline-info:focus {-webkit-box-shadow: 0 0 0 0px rgba(16, 82, 140, .5); box-shadow: 0 0 0 0px rgba(16, 82, 140, .5)}
.btn-outline-info.disabled,
.btn-outline-info:disabled {color: #fff; background-color: #6c757d; border-color: #6c757d}
.btn-outline-info:not(:disabled):not(.disabled).active,
.btn-outline-info:not(:disabled):not(.disabled):active,
.show>.btn-outline-info.dropdown-toggle {color: #fff; background-color: transparent;}
.btn-outline-info:not(:disabled):not(.disabled).active:focus,
.btn-outline-info:not(:disabled):not(.disabled):active:focus,
.show>.btn-outline-info.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(16, 82, 140, .5); box-shadow: 0 0 0 0px rgba(16, 82, 140, .5)
}

.btn-outline-light {color: #ccc; border-color: #ccc}
.btn-outline-light:hover {color: #999; border-color: #999}
.btn-outline-light.focus,
.btn-outline-light:focus {-webkit-box-shadow: 0 0 0 0px rgba(16, 82, 140, .5); box-shadow: 0 0 0 0px rgba(16, 82, 140, .5)}
.btn-outline-light.disabled,
.btn-outline-light:disabled {color: #fff; background-color: #6c757d; border-color: #6c757d}
.btn-outline-light:not(:disabled):not(.disabled).active,
.btn-outline-light:not(:disabled):not(.disabled):active,
.show>.btn-outline-light.dropdown-toggle {color: #fff; background-color: transparent;}
.btn-outline-light:not(:disabled):not(.disabled).active:focus,
.btn-outline-light:not(:disabled):not(.disabled):active:focus,
.show>.btn-outline-light.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 0px rgba(16, 82, 140, .5); box-shadow: 0 0 0 0px rgba(16, 82, 140, .5)
}

.btn-outline-dark {color: #313a46; border-color: #313a46}
.btn-outline-dark:hover {color: #1c2128; border-color: #1c2128}
.btn-outline-dark.focus,
.btn-outline-dark:focus {-webkit-box-shadow: 0 0 0 .2rem rgba(80, 88, 98, .5); box-shadow: 0 0 0 .2rem rgba(80, 88, 98, .5)}
.btn-outline-dark.disabled,
.btn-outline-dark:disabled {color: #fff; background-color: transparent;}
.btn-outline-dark:not(:disabled):not(.disabled).active,
.btn-outline-dark:not(:disabled):not(.disabled):active,
.show>.btn-outline-dark.dropdown-toggle {color: #fff; background-color: #1c2128; border-color: #171b21}
.btn-outline-dark:not(:disabled):not(.disabled).active:focus,
.btn-outline-dark:not(:disabled):not(.disabled):active:focus,
.show>.btn-outline-dark.dropdown-toggle:focus {-webkit-box-shadow: 0 0 0 .2rem rgba(80, 88, 98, .5); box-shadow: 0 0 0 .2rem rgba(80, 88, 98, .5)}

.btn-rounded {border-radius: 30px;}

*,
*::before,
*::after {box-sizing: inherit;}

.row {display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -5px; margin-left: -5px;}
.row.mg0 {margin-left: 0 !important; margin-right: 0 !important;}

.no-gutters {margin-right: 0; margin-left: 0;}
.no-gutters > .col,
.no-gutters > [class*="col-"] {padding-right: 0; padding-left: 0;}

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col,
.col-auto {position: relative; width: 100%; padding-right: 5px; padding-left: 5px; flex-basis: auto; border: 0px dashed #ff0000;}
.col {-ms-flex-preferred-size: 0; flex-basis: auto; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%;}

.col-auto {-ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: 100%;}
.col-1 {-ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333%;}
.col-2 {-ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%;}
.col-3 {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.col-4 {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
.col-5 {-ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667%;}
.col-6 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.col-7 {-ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%;}
.col-8 {-ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%;}
.col-9 {-ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;}
.col-10 {-ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333%;}
.col-11 {-ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%; max-width: 91.666667%;}
.col-12 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}

/* 로그인 */
.login-bg {width: 100%; height: 100%; background: linear-gradient(270deg, #ececec 50%, #ffffff 50%); overflow: auto;}
.login-wrap {display: flex; width: 1600px; height: 100%; margin: 0 auto;}
.left-banner {display: flex; width: 1040px; background: #fff; position: relative; border-right: 1px solid #cdcdcd;}
.bx-wrapper {position: relative;}
.bx-controls-direction a {position: absolute; top: 325px; }
.bx-controls-direction .bx-prev {left: 20px; background: url(../images/login-arr-left.png); width: 48px; height: 82px; overflow: hidden; text-indent: -200px;}
.bx-controls-direction .bx-next {right: 20px; background: url(../images/login-arr-right.png); width: 48px; height: 82px; overflow: hidden; text-indent: -200px;}
.bx-pager {display: none;}
.right-loginform {display: flex; flex-direction: column; align-items: center; text-align: center; padding-top: 210px; padding-left: 40px;}
.right-loginform .form {width: 100%;}
.yk-text {font-size: 16px; line-height: 24px; color: #474747; margin-top: 20px; margin-bottom: 20px;}
.right-loginform .form input {display: block; width: 300px; margin: 0 auto 8px; padding: 12px 5px; background: #fff; border: 1px solid #aaa; border-radius: 5px; box-sizing: border-box;}
.right-loginform .form input::placeholder {font-size: 14px; color: #999; font-family: 'NS';}
.right-loginform .form input[type="password"] {font-family: 'malgun gothic';}
.btn-login-submit {width: 300px; height: 44px; font-size: 16px; border-radius: 5px; box-sizing: border-box; font-family: 'NG'; color: #fff;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#46a1eb+0,2670a8+99 */
background: #46a1eb; /* Old browsers */
background: -moz-linear-gradient(top,  #46a1eb 0%, #2670a8 99%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #46a1eb 0%,#2670a8 99%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #46a1eb 0%,#2670a8 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#46a1eb', endColorstr='#2670a8',GradientType=0 ); /* IE6-9 */
}
.btn-login-submit:hover,
.btn-login-submit:active {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#2670a8+1,46a1eb+98 */
background: #2670a8; /* Old browsers */
background: -moz-linear-gradient(top,  #2670a8 1%, #46a1eb 98%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #2670a8 1%,#46a1eb 98%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #2670a8 1%,#46a1eb 98%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2670a8', endColorstr='#46a1eb',GradientType=0 ); /* IE6-9 */
}
.login-btn-group {width: 100%; width: 300px; margin-top: 7px; height: 28px;}
.login-btn-group input[type="checkbox"] {vertical-align: middle;}
.login-btn-group label { font-size: 12px; color: #666; vertical-align: middle; line-height: 24px; }

.login-btn-group {display: flex; align-items: center; vertical-align: middle;}
.group-left {display: flex; flex: 1; align-items: center;}
.group-right {display: flex;}
.login-btn-group a:hover,
.login-btn-group a:active {
background: rgb(221,221,221); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(221,221,221,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(221,221,221,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(221,221,221,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

/* top */
.top-wrap {display: flex; width: 100%; min-width: 1280px; background: #4598d9;}
.topmenu-logo {display: flex; /* background: #fff; */ border-bottom: 1px solid #2981c5/* #99bfdc */;}
.topmenu-logo a {padding: 16px 22px; height: 59px;}
@media all and (min-width:1280px) {
    .topmenu-logo a {padding: 16px 54px; width: 205px; height: 59px;}
}
.top-menu-item {display: flex; flex-direction: column; justify-content: center; align-items: center; height: 60px;}
.top-menu-item i {display: flex; width:65px;}
.top-menu-item span {color: #fff;}
.top-menu-item .new-icon {position: absolute; right: 7px; top: 5px; background: #e50000; border: 2px solid #e50000; border-radius: 50%; width: 18px; height: 18px; line-height: 15px; text-align: center; font-family: "NGB"; font-size: 11px;}
.top-menu-left {display: flex; flex: 1; align-items: center;}
.top-menu-left ul {display: flex;}
.top-menu-left ul li:hover,
.top-menu-left ul li.active {/* background: #1268b1; */}
.top-menu-left li:first-child {margin-left: 5px;}
.top-wrap .top-menu-right a:hover span {color: #000;}
.top-wrap .top-menu-right a:hover span.new-icon {color: #fff;}
.top-menu-right ul {display: flex;}
.top-menu-right i {height: 35px;}
.top-menu-right .favorite-header i {height: auto;}
.top-menu-right span {height: 25px;}
.top-container {display: flex; flex: 1; border-bottom: 1px solid #2981c5;}

/* 메뉴 아이콘 */
.top-wrap [class^='icon-btn-'],
.left-wrap [class^='icon-btn-'] {display: flex; padding:0; color:#fff; text-decoration:none; outline:none; border:1; background:transparent; -webkit-appearance:none; border: 0px solid #ff0000;}
.top-wrap [class^='icon-btn-'] {flex-direction: column; align-items: center;}
.top-wrap [class^='icon-btn-']:before {width: 23px; height: 18px; margin-top: 10px; margin-left: 4px; content:"";background:url(../images/icons.png) no-repeat;}
.top-wrap .top-menu-left [class^='icon-btn-']:before {margin-left: 15px;}
.left-wrap [class^='icon-btn-']:before {width: 18px; height: 18px; margin-top: 2px; margin-left: 0px; content:"";background:url(../images/icons.png) no-repeat;}
.left-wrap .icon-btn-favorite-s:before,
.left-wrap .icon-btn-favorite-s-no:before {width: 16px; height: 18px; margin-top: 1px; margin-left: 2px; content:"";background:url(../images/icons.png) no-repeat;}
.left-wrap .icon-btn-favorite-s:before {background-position: 0px 0px;}
.left-wrap .icon-btn-favorite-s-no:before {background-position: 0px -25px;}
.top-menu-left ul li {box-sizing: border-box; width: 70px;}
.top-menu-left li {height: 60px;}
.top-menu-left li:hover {/* background: #1268b1; */}
.top-menu-left li:hover a {color: #fff;}
.top-menu-left li a {color: #fff;}
.top-menu-left li a:hover  {color: #00477f; text-decoration: underline; font-weight: bold;}
.top-menu-left li.active a {color: #fff;}
.top-menu-left li.active a:hover {color: #00477f;}
.top-menu-left .top-menu-item {display: block;}
.top-menu-left .top-menu-item.new-window {height: 35px}
.top-menu-left .top-menu-item.menu-go {height: 25px; text-align: center;}
.top-menu-left ul li i {display: flex; width:70px;}

.top-wrap a .icon-btn-my:before {width: 34px; height: 24px; background-position: 0 -240px;}
.top-menu-left li:hover .icon-btn-my:before,
.top-menu-left li.active .icon-btn-my:before {background-position: 0 -280px;}
.top-menu-left li:hover .new-window:hover .icon-btn-my:before  {background-position: 0 -320px;}

.top-wrap a .icon-btn-customer:before {width: 34px; height: 24px; background-position: -40px -240px;}
.top-menu-left li:hover .icon-btn-customer:before,
.top-menu-left li.active .icon-btn-customer:before {background-position: -40px -280px;}
.top-menu-left li:hover .new-window:hover .icon-btn-customer:before  {background-position: -40px -320px;}

.top-wrap a .icon-btn-sales:before {width: 35px; height: 24px; background-position: -80px -240px;}
.top-menu-left li:hover .icon-btn-sales:before,
.top-menu-left li.active .icon-btn-sales:before {background-position: -80px -280px;}
.top-menu-left li:hover .new-window:hover .icon-btn-sales:before  {background-position: -80px -320px;}

.top-wrap a .icon-btn-part:before {width: 33px; height: 24px; background-position: -120px -240px;}
.top-menu-left li:hover .icon-btn-part:before,
.top-menu-left li.active .icon-btn-part:before {background-position: -120px -280px;}
.top-menu-left li:hover .new-window:hover .icon-btn-part:before  {background-position: -120px -320px;}

.top-wrap a .icon-btn-service:before {width: 35px; height: 24px; background-position: -160px -240px;}
.top-menu-left li:hover .icon-btn-service:before,
.top-menu-left li.active .icon-btn-service:before {background-position: -160px -280px;}
.top-menu-left li:hover .new-window:hover .icon-btn-service:before  {background-position: -160px -320px;}

.top-wrap a .icon-btn-rental:before {width: 35px; height: 24px; background-position: -200px -240px;}
.top-menu-left li:hover .icon-btn-rental:before,
.top-menu-left li.active .icon-btn-rental:before {background-position: -200px -280px;}
.top-menu-left li:hover .new-window:hover .icon-btn-rental:before  {background-position: -200px -320px;}

.top-wrap a .icon-btn-accounting:before {width: 35px; height: 24px; background-position: -240px -240px;}
.top-menu-left li:hover .icon-btn-accounting:before,
.top-menu-left li.active .icon-btn-accounting:before {background-position: -240px -280px;}
.top-menu-left li:hover .new-window:hover .icon-btn-accounting:before  {background-position: -240px -320px;}

.top-wrap a .icon-btn-common:before {width: 35px; height: 24px; background-position: 0px -360px;}
.top-menu-left li:hover .icon-btn-common:before,
.top-menu-left li.active .icon-btn-common:before {background-position: 0px -400px;}
.top-menu-left li:hover .new-window:hover .icon-btn-common:before  {background-position: 0px -440px;}

.top-wrap a .icon-btn-code:before {width: 35px; height: 24px; background-position: -40px -360px;}
.top-menu-left li:hover .icon-btn-code:before,
.top-menu-left li.active .icon-btn-code:before {background-position: -40px -400px;}
.top-menu-left li:hover .new-window:hover .icon-btn-code:before  {background-position: -40px -440px;}

.top-wrap a .icon-btn-setting:before {width: 35px; height: 24px; background-position: -80px -360px;}
.top-menu-left li:hover .icon-btn-setting:before,
.top-menu-left li.active .icon-btn-setting:before {background-position: -80px -400px;}
.top-menu-left li:hover .new-window:hover .icon-btn-setting:before  {background-position: -80px -440px;}

.top-wrap a .icon-btn-pricetable:before {width: 30px; height: 20px; background-position: -220px -50px;}
.top-wrap a:hover .icon-btn-pricetable:before,
.top-wrap .active a .icon-btn-pricetable:before {background-position: -220px -75px;}

.top-wrap a .icon-btn-db:before {height: 20px; background-position: -200px -50px;}
.top-wrap a:hover .icon-btn-db:before,
.top-wrap .active a .icon-btn-db:before {background-position: -200px -75px;}

.top-wrap a .icon-btn-barcode:before {background-position: -150px -50px;}
.top-wrap a:hover .icon-btn-barcode:before,
.top-wrap .active a .icon-btn-barcode:before {background-position: -150px -75px;}

.top-wrap a .icon-btn-group:before {background-position: 0 -50px;}
.top-wrap a:hover .icon-btn-group:before,
.top-wrap .active a .icon-btn-group:before {background-position: 0 -75px;}

.top-wrap a .icon-btn-memo:before {background-position: -175px -49px;}
.top-wrap a:hover .icon-btn-memo:before,
.top-wrap .active a .icon-btn-memo:before {background-position: -175px -74px;}

.top-wrap a .icon-btn-sms:before {background-position: -25px -50px;}
.top-wrap a:hover .icon-btn-sms:before,
.top-wrap .active a .icon-btn-sms:before {background-position: -25px -75px;}

.top-wrap a .icon-btn-favorite:before {background-position: -50px -50px;}
.top-wrap a:hover .icon-btn-favorite:before,
.top-wrap .active a .icon-btn-favorite:before {background-position: -50px -75px;}

.top-wrap a .icon-btn-logout:before {background-position: -75px -50px;}
.top-wrap a:hover .icon-btn-logout:before,
.top-wrap .active a .icon-btn-logout:before {background-position: -75px -75px;}

.left-wrap .icon-btn-user:before {background-position: -225px 0; vertical-align: middle;}
.left-wrap .active .icon-btn-title:before {background-position: -250px 0;}
.left-wrap .icon-btn-title:before {background-position: -250px -25px; margin-top: 5px}

.left-wrap .icon-btn-arr span {display: none;}
.left-wrap .icon-btn-arr:before {background-position: -275px -21px; margin-top: 0px;}
.left-wrap .active .icon-btn-arr:before {background-position: -275px 4px; margin-top: 0px;}

.top-wrap .top-menu-left .btn-menu {width: 40px; height: 40px; border-radius: 6px;}
.top-wrap .top-menu-left .icon-btn-menuclose:before,
.top-wrap .top-menu-left .icon-btn-menuopen:before {width: 25px; height: 18px; margin-top: 1px; margin-left: 0px;}
.top-wrap .icon-btn-menuclose:before {background-position: -40px 0px;}
.top-wrap .icon-btn-menuopen:before {background-position: -80px 0px;}
.top-menu-left ul.notice-items {display: flex; height: 38px; align-items: center; justify-content: center; margin-top: 22px;}
.top-menu-left ul.notice-items li a {text-decoration: none;}
.top-menu-left ul.notice-items li i {width: auto;}
.top-wrap .top-menu-left .notice {display: flex; width: calc(100vw - 680px); min-width: 550px; align-items: center; margin-left: 15px; color: #146bae; font-size: 14px; padding: 8px 8px 8px 13px; background: #fff; border-radius: 20px;}
@media all and (min-width:1280px) {
    .top-wrap .top-menu-left .notice {width: calc(100vw - 730px)}
}
.top-wrap .top-menu-left .notice span {padding-left: 7px; overflow: hidden; white-space: nowrap; text-overflow:ellipsis;}
.top-wrap .top-menu-left .notice:hover {color: #0b4e82; font-weight: bold;}
.top-wrap .top-menu-left .notice:hover span {/* text-decoration: underline; */}

/* 즐겨찾기 팝업 */
.favorite-menu .tri {position: absolute; right: 24px; top: 55px; width: 0px; height: 0px; border-top: 8px solid none; border-bottom: 8px solid #fff;border-right: 8px solid transparent; border-left: 8px solid  transparent; z-index: 20;}
.favorite {display: flex; flex-direction: column; position: absolute; right: 5px; top: 60px; width: 200px; min-height: 200px; border: 1px solid #ccc; border-radius: 5px; background: #fff; z-index: 10;}
.favorite .favorite-header {display: flex; flex-direction: row; width: 100%; height: 32px; justify-content: space-between; align-items: center; border-bottom: 1px solid #ccc; padding: 5px 5px 5px 10px;}
.favorite-menu .no-data {display: flex; justify-content: center; align-items: center; text-align: center; line-height: 1.3; min-height: 160px;}
.favorite-menu .data {display: flex; flex-direction: column; padding: 5px 5px 5px 10px; max-height: 700px; overflow: auto;}
.favorite-menu .data li [class^="material-icons"] {color: #aaa; font-size: 14px; vertical-align: middle; padding-top: 3px;}
.favorite-menu .data li a {width: 100%; display: flex; justify-content: space-between; height: initial; padding: 2px;}
.favorite-select h5 {color: #005da7; font-size: 14px; font-weight: bold; padding-bottom: 5px;}
.favorite-select ul li {display: flex; justify-content: space-between; align-items: center; border: 1px solid #ccc; border-top: 0; height: 30px; padding: 3px;}
.favorite-select ul li:first-child {border-top: 1px solid #ccc; }
.favorite-select [class^="material-icons"] {margin-top: -2px; color: #777;}

/* 아이콘 버튼 */
.btn [class^="material-icons"] {margin-top: -3px; vertical-align: middle; font-size: 18px; line-height: 18px; border: 0px solid #ff0000;}
.inline-btn {display: inline-flex;}
.icon-btn-excel:before {width: 17px; height: 17px; margin-top: 0px; margin-left: 0px; content:"";background:url(../images/icons.png) no-repeat; background-position: -123px -49px;}
.icon-btn-rank:before {width: 17px; height: 17px; margin-top: 0px; margin-left: 0px; content:"";background:url(../images/icons.png) no-repeat; background-position: -123px -74px;}

.icon-noimg {display: flex; justify-content: center; padding-bottom: 5px;}
.icon-noimg:before {width: 32px; height: 32px; margin-top: 0px; margin-left: 0px; content:"";background:url(../images/icons.png) no-repeat; background-position: 0px -140px;}

.icon-drag {display: flex; justify-content: center; padding-bottom: 15px;}
.icon-drag:before {width: 44px; height: 52px; margin-top: 0px; margin-left: 0px; content:"";background:url(../images/icons.png) no-repeat; background-position: -40px -140px;}

.attach-delete {position: absolute; right: 5px;}
.attach-delete button {border-radius: 50%; background: #333;}
.icon-drag-item {height: 100%; display: flex; flex-direction: column; justify-content: center; text-align: center;}

button i,
button span {vertical-align: middle;}

/* left */
.layout-box {display: flex; min-width: 1280px;}
.layout-left {display: flex; flex-direction: column; width: 100%;}
.left-wrap {display: flex; width: 200px; min-width: 200px; padding: 5px 0 5px 5px; border:0px dashed #ff0000;}
.personal {width: 100%; height: 160px; background: #fff; border: 1px solid #d6d6d6; border-radius: 5px;}
.personal a,
.personal a:hover {color: #d91920; font-size: 15px;}
.personal a:hover {text-decoration: underline;}
.personal-header {display: flex; align-items: center; justify-content: space-between; background: #9d9d9d; height: 38px; padding: 0 7px; border-radius: 5px 5px 0 0;}
.personal-header .user {display: flex; padding-top: 0px;}
.personal-header .user strong {font-size: 14px; color: #fff;}
.personal-header .user span {color: #ccc; padding-top:1px;}
.personal-header .user span:after {content: ""; display: inline-block; width: 1px; height: 10px; background-color: #ccc; margin-left: 7px; vertical-align: middle;}
.user-con {display: flex; flex: 1; justify-content: flex-end;}
.user-con a,
.user-con a:hover {font-size: inherit; color: #ffcc00; text-decoration: none;}
.user-con a:hover {font-weight: bold;}
.user-con a .num {color: #ffcc00;}
.user-con a:hover .num {text-decoration: underline;}
.new-note {color: #fff; display: flex; align-items: center; padding-right: 3px;}
.new-note i.material-iconsmail_outline {padding-right: 3px;
color: #e2e2e2;
font-size: 18px;}
.new-note i.material-iconsmail_outline ~ span:last-of-type {color: #ccc;}
.worktime {display: flex; align-items: center; justify-content: space-between; height: 38px; padding: 0 7px;}
.worktime .time-chk {color: #000;}
.worktime .time-chk .title {color: #999; padding-right:3px;}
.worktime-content {display: flex; border-top: 1px solid #d6d6d6;}
.worktime-content .content {display: flex; flex-direction: column; border-left: 1px solid #d6d6d6; align-items: center; justify-content: center;  width: 50%; height: 82px;}
.worktime-content .content:first-child {border-left: 0;}
.worktime-content .count {display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: #ffa31e; color: #fff; font-weight: bold;}
.worktime-content .title {margin-top: 10px;}
.snb {margin-top: 5px; border:1px solid #d6d6d6; border-radius: 5px; padding:0;}
.snb > ul {background: #fff; border-radius: 5px;}
.snb > ul > li {border-bottom: 1px solid #d6d6d6;}
.snb > ul > li:last-child {border-bottom: 0;}
.snb > ul > li > a .title > span {padding-left: 4px;}
.snb > ul > li a:hover,
.snb > ul > li.active > a .title > span,
.snb > ul > li.active > ul > li.active > a {font-weight: bold; color: #015ea8;}
.snb > ul > li.active > ul {display: block;}
.snb > ul > li > ul {display: none;}
.snb > ul > li > ul > li > a {display: block; color: #777; padding: 3px 20px 3px 14px;}
.snb > ul > li > ul > li > a:before {content:url('../images/snb-bul.png'); width: 10px; height: 6px; display: inline-block; clear: both;}
.snb > ul > li.active {background: #fff; border-radius: 5px 5px 0 0;}
.snb > ul > li.active > ul > li {background: #f0f0f0; color: #777;}
.snb > ul > li.active > ul > li:first-child {border-top: 1px solid #d6d6d6;}
.snb > ul > li.active > ul > li.active {background: #f0f0f0; color: #015ea8;}
.snb > ul > li .title-wrap {display: flex; justify-content: space-between; width: 100%; padding: 8px 12px;}
.snb > ul > li .title-wrap .title {display: flex; align-items: center; font-size: 13px;}
.snb > ul > li .title-wrap .icon-btn-arr {display: flex; align-items: center;}

/* 컨텐츠 */
.content-wrap {display: flex; flex-direction: column; width: 100%; padding:0px 5px 5px 5px; justify-content: space-between; border: 0px solid #ff0000;}
.content-box {width: 100%; height: 100%; border: 1px solid #d6d6d6; background: #fff; border-radius: 5px; padding: 0px;}
.content-box h2 {font-size: 14px; padding-top: 1px; padding-left: 2px;}
.content-box h2:before {content:""; display: inline-block; clear: both; width: 4px; height:10px;  border-radius:5px; background: #1071bd; margin-right: 5px; /* vertical-align: middle; */}
.content-wrap .title-wrap {display: flex; justify-content: space-between; align-items: center;}
.content-box .detail h2:before {background: none; margin-right: 0px;}
.content-wrap .title-wrap {border: 0px solid #ff0000; min-height: 26px;}
.content-wrap .title-wrap h4 {flex: 0 0 auto; line-height: 26px;}
.title-wrap > .left {display: flex; align-items: center;}
.title-wrap > .left .com-info {display: flex; align-items: center;}
.title-wrap > .left .com-info:before {display: inline-block; content: ""; clear: both; width: 1px; height: 10px; background: #999; margin: 0 7px;}
.title-wrap > .right .icon-btn-favorite,
.title-wrap > .right .icon-btn-favorite-no,
.favorite-select .icon-btn-favorite,
.favorite-select .icon-btn-favorite-no {display: flex; padding: 0;}
.title-wrap > .right .icon-btn-favorite-no:before,
.title-wrap > .right .icon-btn-favorite:before,
.favorite-select .icon-btn-favorite-no:before,
.favorite-select .icon-btn-favorite:before {width: 18px; height: 18px; margin-top: 0px; margin-left: 0px; content: ""; background: url(../images/icons.png) no-repeat;}
.title-wrap > .right .icon-btn-favorite-no:before,
.favorite-select .icon-btn-favorite-no:before {background-position: -100px -50px;}
.title-wrap > .right .icon-btn-favorite:before,
.favorite-select .icon-btn-favorite:before {background-position: -100px -25px;}

.title-wrap .right.dpf,
.title-wrap .right.dpf .dpf {align-items: center;}
.title-wrap .right.radio-area {padding-top: 2px; padding-left: 15px;}
.ver-line:before {display: inline-block; content: ""; clear: both; width: 1px; height: 10px; background: #999; margin: -1px 7px -1px 5px;}
.content-wrap h4:before,
.title-wrap h4:before {content:""; display: inline-block; clear: both; width: 4px; height:4px;  border-radius:50%; background: #1071bd; margin-right: 5px; vertical-align: middle;}
.title-wrap h4.bul-gray:before {content:""; display: inline-block; clear: both; width: 4px; height:4px;  border-radius:50%; background: #666; margin-right: 5px; vertical-align: middle;}

.content-wrap .title-wrap h4.primary {font-size: 14px; margin-left: -8px;}
.content-wrap .title-wrap h4.primary:before {background: none;}
.content-wrap .title-wrap .title-sum {display: flex;}
.content-wrap .title-wrap .title-sum  > div {padding-left: 10px; color: #777; line-height: 26px;}
.content-wrap .title-wrap .title-sum  > div:before {content: "- ";}

.content-wrap .title-wrap.type-01 {align-items: flex-end; gap:0 5px;}
.content-wrap .title-wrap.type-01 .search-wrap {margin-left:auto;}
.content-wrap .title-wrap.type-01 .btn-group {width:auto;}

.title-wrap.half-print {align-items: flex-end;}
.condition-items {display: flex; flex: auto; justify-content: flex-end;}
.condition-items .left {flex: 1;}
.condition-items .condition-item {display: flex; align-items: center;}

.content-box.main-contents {border: 0; background: transparent;}
.content-box .main-title-todo {padding: 15px 0px 20px 10px; background: #eaf6ff; border-bottom: 0px solid #ddd;}
.content-box .main-title-todo h3 {font-size: 18px; color: #0c5086; font-weight: bold; padding-left: 5px;}
.content-box .main-title-todo > div {display: flex; width: 100%; margin-top: 10px;}
.content-box .main-title-todo > div .box-type1,
.content-box .main-title-todo > div .box-type2 {display: flex; align-items: center; flex-grow: 1; border-radius: 6px; padding: 25px 8px; box-shadow:0 3px 7px rgba(0, 0, 0, 0.2);}
.content-box .main-title-todo > div .box-type1 {justify-content: space-between; flex-basis: 140px;}
.content-box .main-title-todo > div .box-type2 {justify-content: flex-end;}
.content-box .main-title-todo > div .box-type1 .data,
.content-box .main-title-todo > div .box-type2 .data {display: flex; flex-direction: column; text-align: right;}
.content-box .main-title-todo > div .box-type1 {background: #fff; margin-right: 10px;}
.content-box .main-title-todo > div .box-type2 {background: #1071bd; color: #fff;}
.content-box .main-title-todo > div .box-type1 .icon {width: 40px; height: 40px; border-radius: 50%; background: #e5ecf7; align-items: center;}
.content-box .main-title-todo > div .box-type1 .icon i {color: #1071bd !important; padding: 8px;}
.content-box .main-title-todo > div .box-type1 .data .num,
.content-box .main-title-todo > div .box-type2 .data .num {font-size: 32px; line-height: 32px;}
.content-box .main-title-todo > div .box-type1 .data .title {color: #666; font-size: 12px; margin-top: 3px;}
.content-box .main-title-todo > div .box-type1 .data .num {color: #000;}
.content-box .main-title-todo > div .box-type2 .data .num {color: #fff;}
.content-box .main-title {display: flex; justify-content: space-between; padding: 13px 15px 7px; /* border-bottom: 1px solid #ddd; */ align-items: center; height: 52px;}
.content-box .main-contents-wrap {padding: 0 10px;}
.content-box .main-contents-wrap .contents {border: 1px solid #d6d6d6; border-radius: 5px;  background: #fff;}

.content-box .contents {padding: 0px 15px 15px 15px;}
.content-box .main-title .detail-left {display: flex; align-items: center; margin-bottom: 5px;}
.content-box .main-title .detail-left button:focus i,
.content-box .main-title .detail-left button:hover i {color: #6f6f6f!important;}
.approval {display: flex;}
.approval-left {display: flex; flex: 1; justify-content: space-between;}
.approval-left .left {display: flex;}
.approval-left span.condition-item,
.half-print span.condition-item {display: inline-block; font-size: 11px; border: 0px solid #ddd; background: #eee; border-radius: 20px; padding: 2px 8px; font-weight: bold;}

.condition-box {display: flex; border: 1px solid #ddd; margin-top: 5px; padding: 10px 6px; background: #fafafa;}
.condition-box .form-check.form-check-inline {margin-right: 7px;}
.condition-box > div {position: relative;/* border-bottom: 1px dashed #ddd; */padding: 5px 0; margin-right: 10px;}
.condition-box > div:first-child {/* padding-top: 0; */}
.condition-box > div:last-child {margin-right: 0px; /* border-bottom: 0; padding-bottom: 0; */}
.condition-box .checkbox-area {display: flex; align-items: center;}
.condition-box .div-line {margin-left: 5px;}
.condition-box .div-line:before {content: ""; width: 1px; height: 10px; background: #777; position: absolute; top: 30%; left: -12px;}
.grid-comment {text-align: center; color: #999; padding: 25px 0;}
.grid-comment-2 {text-align: center; color: #999; padding: 5px 0;}

.approval-table {display: flex; justify-content: space-between; align-items: flex-start; /* width: 120px; */}
.approval-table .input-area,
.approval-table .delete-area {display: flex;}
.approval-table .input-area {position: relative; /* width: 102px; */}
.approval-table .input-area input {border: 0; background: transparent; padding-right: 18px; /* width: 102px; */ box-sizing: border-box;}
.approval-table .icon-btn-search {position: absolute; right: 0;}
.approval-table .icon-btn-search i.material-iconssearch,
.approval-table .icon-btn-close i.material-iconsclose {font-size: 18px;}
.approval-table .icon-btn-search i.material-iconssearch {color: #888;}
.approval-table .icon-btn-close i.material-iconsclose {color: #0e4c92;}
.approval-table .delete-area {border-left: 0px dashed #ccc;  width: 18px;}

.gallery-board {display:flex; flex-wrap: wrap; border: 0px solid #ffcc00; box-sizing: border-box; margin-top: 5px;}
.gallery-item {width: calc(20% - 8px); height: auto;  margin: 5px 5px;}
.gallery-item:first-child,
.gallery-item:nth-child(5n+1) {margin-left: 0;}
.gallery-item:nth-child(5n) {margin-right: 0;}
.gallery-item .header {display: flex; justify-content: space-between; align-items: center; padding: 5px 8px 0px 10px;}
.gallery-item .header .num {font-size: 20px; color: #000;}
.gallery-item .header .info {font-size: 12px; color: #999;}
.gallery-item .body {border: 1px solid #ccc;}
.gallery-item .body .thumb a {display: flex; justify-content: center; align-items: center; border-bottom: 1px solid #ccc;}
.gallery-item .body .thumb a img {width: 100%; height: auto;}
.gallery-item .body .setting {display: flex;}
.gallery-item .body .body-bottom {background: #eee;}
.gallery-item .body .body-bottom .title {padding: 10px; border-bottom: 1px solid #ccc;}
.gallery-item .body .body-bottom .setting {display: flex; justify-content: space-between; align-items: center; padding: 10px 5px 10px 10px;}
.gallery-item .body .body-bottom .setting .left {flex: 1;}
.gallery-item .body .body-bottom .setting .right {display: flex; align-items: center;}

.gallery-item.db {width: 232px; margin: 0; padding: 0px 20px 20px; box-sizing: border-box;}
.gallery-item.db .header {padding: 0 0 0 3px;}
.gallery-item.db .body {width: 192px; height: 192px; overflow: hidden;}
.gallery-item.db .body .thumb {}
.gallery-item.db .body .thumb a {vertical-align: middle; height: 190px; border: 0; background:#fbfbfb;}
.gallery-item.db .body .thumb a img {/* width: 100%; height: auto; */}
.gallery-item.db input[type="checkbox"] {width: 20px; height: 20px;}
.gallery-item.db .header .info {font-size: 14px; color: #666;}
.file-info {padding: 14px 5px;}
.file-info .title {font-size: 14px; padding-bottom: 3px;}
.file-info .volume {font-size: 12px; color: #999;}

.smstable-section {padding: 6px; margin-top: 5px; background: #f7f7f7; border: 1px solid #ddd; border-radius: 4px; height: 500px;}

.smstable-section-div {display: flex; flex-direction: column; padding: 6px; margin-top: 5px; background: #f7f7f7; border: 1px solid #ddd; border-radius: 4px;}
.smstable-section-div .no-img-wrap {margin-top: 30px; text-align: center;}
.smstable-section-div img {width: 100%;}
.smstable-section-div .no-img-wrap .no-img-txt {font-size: 14px; color: #aaa;}

.smstable-search {width: 100%; display: flex; align-items: center; justify-content: space-between;}
.smstable-search h5 {display: flex; flex: 0 0 auto; margin-right: 5px;}
.smstable-search .flex-1 {display: flex;}
.smstable-search > div {display: flex;}

.smstable-search .flex-1 select {margin-right: 5px;}
.smstable-search button {min-width: 54px; margin-right: 5px;}
.smstable-search button:last-child {margin-right: 0;}
.text-insert {margin-top: 5px;}

.chk-btn {color: #000;
background: rgb(245,245,245); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(221,221,221,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 ); /* IE6-9 */
border: 1px solid #ddd;
border-radius: 4px;}
.chk-btn:hover {color: #000;
background: rgb(221,221,221); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(221,221,221,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(221,221,221,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(221,221,221,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.chk-btn {}
.chk-btn * {vertical-align: middle;}
.chk-btn input[type="checkbox"] {position: absolute; visibility: hidden;}
.chk-btn label {position: relative; display: block; padding: 2px 7px 3px 3px; font-size: 12px; vertical-align: middle;}
.chk-btn input[type="checkbox"] + label i:before,
.chk-btn input[type="checkbox"]:checked + label i:before {padding-right: 3px;}

.chk-btn input[type="checkbox"] + label [class^="material-icons"],
.chk-btn input[type="checkbox"]:checked + label [class^="material-icons"]
{font-size: 17px; border: 0px solid #ff0000; vertical-align: middle;}
.chk-btn input[type="checkbox"]:checked + label {color: #0e4c92;}
.footer {text-align: center; padding-top: 15px;}

.breadcrumb {display: flex; align-items: center;}
.breadcrumb [class^="material-icons"] {font-size: 15px; color: #bbb;}
.breadcrumb-item + .breadcrumb-item:before {display: inline-block; content: ""; margin-right: 6px; margin-left: 6px; color: #666; width: 4px; height: 4px; border-radius: 50%; background: #bbb; vertical-align: middle;}
.breadcrumb-item:hover {text-decoration: underline;}
.breadcrumb-item.active {font-weight: bold; color: #000;}

.icons-list-demo div {cursor: pointer; line-height: 45px; white-space: nowrap; text-overflow: ellipsis; display: block; overflow: hidden}
.icons-list-demo div p {margin-bottom: 0; line-height: inherit}
.icons-list-demo i {text-align: center; vertical-align: middle; font-size: 22px; width: 50px; height: 50px; line-height: 50px; margin-right: 12px;border-radius: 3px; display: inline-block; -webkit-transition: all .2s; transition: all .2s}

.contract-info {text-align: center; padding: 50px;}
.doc-title-wrap2 ~ .contract-info {padding: 50px 10px;}
.contract-name {position: absolute; right: 10px; top: 60px; color: #666;}
.btn-switch {width: 24px; padding: 0; display: flex; flex-direction: column; justify-content: center; align-items:center;}
.btn-switch button:first-child {margin-bottom: 5px;}

.info-imgcon {text-align: center;}
.info-imgcon img {border: 1px solid #ddd; margin-top: 10px; max-width: 760px;}
.info-docpagination-wrap {padding: 5px; background: #f1f1f1; border-radius: 5px;}
.info-docpagination {color: #555;}
.info-docpagination span {padding: 0 2px;}
.info-docpagination .current {color: #2489e1; font-weight: bold;}

/* 폼 컨트롤 */
.form-control:disabled,
.form-control[readonly] {background-color: #e9ecef; opacity: 1;}
textarea.form-control {padding: 4px;}
.valid-feedback {width: 100%; margin-top: .25rem; font-size: 12px; color: silver;}
.invalid-feedback {width: 100%; margin-top: .25rem; font-size: 12px; color: #cf0a2c;}
.col-form-label.required::after {content: '*'; color: #cf0a2c;}
.essential-item:before {content: '*'; display: inline-block; color: #cf0a2c}
.essential-bg {background: #fff7f6 !important;}
.alert {position: relative; padding: .75rem 1.25rem; margin-bottom: 1rem; border: 1px solid transparent}
.alert .title {display: flex; align-items: center; padding-bottom: 15px;}
.alert ul li:before {content: "-"; display: inline-block; padding-right: 5px;}
.alert-primary {color: #7b0f13; background-color: #fbd2d3; border-color: #fabfc2}
.alert-primary hr {border-top-color: #f8a7ab}
.alert-primary .alert-link {color: #4e090c}
.alert-secondary {color: #535353; background-color: #f7f7f7; border-color: #e4e4e4}
.alert-secondary hr {border-top-color: #d7d7d7}
.alert-secondary .alert-link {color: #3a3a3a}
.alert-success {color: #035f79; background-color: #cdf0fb; border-color: #b9ebf9}
.alert-success hr {border-top-color: #a2e4f7}
.alert-success .alert-link {color: #023847}
.alert-info {color: #033a79; background-color: #cde2fb; border-color: #b9d7f9}
.alert-info hr {border-top-color: #a2caf7}
.alert-info .alert-link {color: #022247}
.alert-warning {color: #817629; background-color: #fff8cd; border-color: #fff6b8}
.alert-warning hr {border-top-color: #fff39f}
.alert-warning .alert-link {color: #534801}
.alert-danger {color: #6c0517; background-color: #f5ced5; border-color: #f2bac4}
.alert-danger hr {border-top-color: #eea5b2}
.alert-danger .alert-link {color: #3b030d}
.alert-light {color: #7e7b7e; background-color: #fcfbfd; border-color: #fbfafc}
.alert-light hr {border-top-color: #eeeaf2}
.alert-light .alert-link {color: #646264}
.alert-dark {color: #1b1e21; background-color: #d6d8d9; border-color: #c6c8ca}
.alert-dark hr {border-top-color: #b9bbbe}
.alert-dark .alert-link {color: #040505}

.form-control {display: block; width: 100%; height: 24px; line-height: 22px; padding: 0; font-size: 12px;  color: #495057; background-color: #fff; border: 1px solid #bbb; border-radius: 4px; }
.form-group {margin-bottom: 5px;}
.form-group tr:hover {background: transparent !important;}
.form-control.bg-gray {background: #eee;}

.form-group .form-text {font-size: 12px;}
.form-group .row,
.form-group .form-row {margin-bottom: 5px;}
.form-text {display: block; margin-top: 6px;}
select.form-control[size], select.form-control[multiple] {height: auto;}
.form-inline {display:-ms-flexbox; display: flex; -ms-flex-flow: row wrap; flex-flow: row wrap;-ms-flex-align: center; align-items: center}
.form-control.text-right {padding-right: 5px;}
/* 검색영역 */
.search-wrap {width: 100%; background: #f7f7f7; border: 1px solid #ddd; border-radius: 5px; padding: 6px;}
.search-wrap.boder-bottom-sq {border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
.search-wrap + .tabs-inner .tabs-inner-line {padding: 10px 5px 6px;}
.search-wrap .table th,
.search-wrap .table td {padding: 2px 2px;}
.search-wrap .table th {text-align: right; color: #555;}
.search-wrap .btn-extend {padding-top: 10px; margin-top: 10px; border-top: 1px dashed #999;}
.search-wrap .search-info-journal > span {position: relative; padding: 0 5px 0 10px;}
.search-wrap .search-info-journal > span:before {content: ""; position: absolute; width: 1px; height: 8px; background: #ccc; left: 0px; top: 3px;}
.search-wrap .search-info-journal > span:first-child:before {width: 0;}
.search-wrap .search-info-journal > span:last-child {padding-right: 0;}



h3.guide-title {padding: 10px 0 10px 0;}
.search-div-line {border-bottom: 1px dashed #ccc; margin-bottom: 10px; margin-top: 10px;}
.triangle-down-right {position: absolute; right: 0; bottom: 0; cursor: pointer;}
.icon-btn-triangle-down,
.icon-btn-triangle-up {display: flex; padding:0; color:#fff; text-decoration:none; outline:none; border:1; background:transparent; -webkit-appearance:none;}
.icon-btn-triangle-down:before,
.icon-btn-triangle-up:before {width: 24px; height: 24px; margin-top: 0px; margin-left: 0px; content:"";background:url(../images/icons.png) no-repeat;}
.icon-btn-triangle-down:before {background-position: 0px -100px;}
.icon-btn-triangle-up:before {background-position: -25px -100px;}
.multiselect,
.con-info {position: absolute; left: 5px; top: 0; border: 1px solid #ddd; border-radius: 5px; background: #fff; padding: 5px; width: 100%; z-index: 10; overflow: auto; box-shadow:3px 3px 7px rgba(0,0,0,0.4); border: 1px solid #2758bd;}
.con-info li a:hover {color: #2758bd;}

.multiselect {}
.multiselect * {vertical-align: middle;}
.multiselect .row {padding-top: 4px;}
.multiselect .row:first-child {padding-top: 0;}

.multiselect.td-wid-100per {width: calc(100% - 10px);}
.con-info {padding: 0;}
.con-info ul {padding: 3px;}
.con-info li {border-top: 0px dashed #ddd; color: #666; padding: 3px 5px;}
.con-info li:first-child {border-top: 0;}
.con-info li:before {content: '- ';}

.table-border .profilephoto-item {position: relative; width: 188px; margin: 0 auto;}
.table-border .icon-profilephoto {width: 100%;}
.table-border .icon-profilephoto ~ .profilephoto-delete {position: absolute; right: 5px; top: 5px; border-radius: 50%; background: #cc0000; opacity: 0.6; filter: Alpha(opacity=60);}
.table-border .profilephoto-delete {position: absolute; right: 5px; top: 5px; border-radius: 50%; background: #cc0000; opacity: 0.6; filter: Alpha(opacity=60);}
.btn.btn-icon-md {padding: 0; width: 22px; height: 22px;}

/* 레이어 팝업 삭제 */
.popup-wrap.width-100per {background: #fff; width: 100%; min-height: 100%; position: static; box-shadow: none; border: 0;}

/* 레이어 팝업 */
.popup-pg {position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: 0.8; filter: Alpha(opacity=80); z-index: 11;}
.popup-wrap {position: absolute; z-index: 20; left: 50%; top: 50%; border: 1px solid #333; border-radius: 0px; background: #fff; box-shadow:5px 5px 13px rgba(0,0,0,0.5);}
.popup-wrap.pos-center-center {transform:translate(-50%,-50%)}
.popup-wrap [class*="material-icons"] {cursor: pointer;}
.popup-wrap.width-300 {width: 300px; margin-left: -150px;}
.popup-wrap.width-400 {width: 400px; margin-left: -200px;}
.popup-wrap.width-450 {width: 450px; margin-left: -225px;}
.popup-wrap.width-500 {width: 500px; margin-left: -250px;}
.popup-wrap.width-560 {width: 500px; margin-left: -280px;}
.popup-wrap.width-600 {width: 600px; margin-left: -300px;}
.popup-wrap.width-700 {width: 700px; margin-left: -350px;}
.popup-wrap.width-800 {width: 800px; margin-left: -400px;}
.popup-wrap.width-900 {width: 900px; margin-left: -450px;}
.popup-wrap.width-1000 {width: 1000px; margin-left: -500px;}
.popup-wrap.width-1100 {width: 1100px; margin-left: -550px;}
.popup-wrap.width-1200 {width: 1200px; margin-left: -600px;}
.popup-wrap .main-title [class^="material-icons"] {color: #fff; padding-top: 3px;}
.popup-wrap .main-title {display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #ccc; background: #666; width: 100%; padding: 5px 12px;}
.popup-wrap .main-title .right {display: flex; align-items: center;}
.popup-wrap .main-title .right button {display: flex; align-items: center;}
.popup-wrap .main-title .right button:last-child {margin-left: 6px;}
.popup-wrap .main-title.blue-bg {background: #1268b1; border-bottom: 1px solid #1f5ab1;}
.doc-title-wrap {display: flex; justify-content: space-between; align-items: center;}
.doc-title-wrap2 {text-align: center;}
.doc-title-wrap h4,
.doc-title-wrap2 h4 {font-size:28px;}
.doc-title-wrap2 h4:before {display: none;}
.doc-title-wrap2 h5 {font-size: 18px;}
.content-wrap .doc-title-wrap h4:before {display: none;}
.doc-title-wrap img {flex: 1}
.doc-info {display: flex; align-items: center; justify-content: space-between;}

.popup-wrap .top-control-wrap {display: flex; justify-content: space-between; width: 100%; padding: 5px 12px 7px 12px; background: #efefef; align-items: center; border-bottom: 1px solid #ddd;}
.popup-wrap .top-control-wrap h3 {font-size: 13px;}
.popup-wrap .sub-main-title {display: flex; justify-content: space-between; width: 100%; padding: 0px 0 0 5px; margin-top: 10px; align-items: center;}
.popup-wrap .main-title h2 {color: #fff; margin-top: 2px; margin-bottom: 3px; font-size: 14px;}
.popup-wrap .sub-title-wrap .btn-group {flex: 1;}
.popup-wrap .content-wrap {width: 100%; padding: 10px 15px 15px 15px;}
.sms-btn-group {position: absolute; bottom: 43px;}
.sms-btn-group .btn-group {display: flex; width: 100%; justify-content: space-between; padding: 3px;}
.sms-btn-group .btn-group > button {margin-left: 3px;}
.sms-btn-group .btn-group > button:first-child {margin-left: 0;}
.btn-group {display: flex; width: 100%; justify-content: space-between; align-items: center;}
.btn-group button {min-width: 60px;}
.btn-group button.btn-width-initial {min-width: auto;}
.btn-group .center {flex: 1; text-align: center; width: 100%;}
.btn-group .left {flex: 1; text-align: left;}
.btn-group .right {flex: 1; text-align: right; }
.btn-group .right > button {margin-left: 0px;}
.btn-group .right > button:first-child {margin-left: 0;}
.btn-group .right.dpf {justify-content: flex-end; align-items: center;}
.form.row {padding: 0;}
.text-com {padding-bottom: 10px;}
.time-count {position: absolute; right: 15px; top: 3px; color: #ac0b0b;}
.content-wrap .form {padding: 15px 0; border-bottom: 1px dashed #ccc;}
.content-wrap .item-group {width: 100%; padding-top: 15px; padding-bottom: 10px; border-bottom: 1px dashed #ccc;}
.specialchar {display: flex; flex-wrap: wrap;}
.specialchar button {display: flex; text-align: center; align-items: center; justify-content: center; width: 24px; height: 30px; font-size: 16px;}
.row-accordion.connected {padding-right: 5px; padding-left: 5px;}
.row-accordion.connected > div:nth-child(1){margin-top: 0 !important;}
.row-accordion.connected > div:nth-child(2n+1) {margin-top: -6px;}
.boxing .boxing-header {cursor: pointer;}
.boxing {display: flex; border: 1px solid #ccc; border-radius: 0px; padding: 7px 6px 6px 6px; align-items: center; /* justify-content: center; */ margin-bottom: 5px;}
.boxing.bd0 {border: 0; }
.boxing.pd0 {padding: 0px !important;}
.boxing-header {display: flex; justify-content: space-between; align-items: center; color: #000; background: #efefef; border-radius: 0px 0px 0 0; padding: 5px 10px; border: 1px solid #eee;}
.boxing div {vertical-align: top; align-items: center;}
.radio-inline {vertical-align: top;}
.radio-inline label {display: inline-block; margin-right: 5px; margin-bottom: 0px;}
.radio-items {display: flex; align-items: center;}
.popup-wrap .col-form-label {padding-top: calc(.2rem + 0px); padding-bottom: calc(.2rem + 0px);margin-bottom: 0; font-size: inherit; line-height: 1.5}
.boxing.vertical-line {flex-wrap: wrap;}
.boxing.vertical-line > span {position: relative; border: 0px solid orange; padding-right: 15px; padding-left: 15px;}
.boxing.vertical-line span:after {content: ""; position: absolute; top: 50%; right: 0; margin-top: -5px; width: 1px; height: 10px; background: #ccc; display: inline-block;}
.boxing.vertical-line span:nth-last-child(1):after {display: none;}

.phone-sms-bg {position:relative; left: 20px; background: url(../images/phone-sms-bg.png) no-repeat; width: /* 388px */ 305px; height: 643px;}
.sms-content {position: absolute; left: 17px; top: 68px; border: 0px solid #ff0000; width: 282px; height: 496px;}
.sms-text {font-size: 14px; padding: 0 15px; line-height: 20px;}
.text-deny {position: absolute; bottom: 76px; width: 100%; text-align: center;}
.text-bytes {position: absolute; width: 100%; height:  40px; bottom: 0; padding-top: 13px; text-align: center; background: #333; color: #fff;}
.scr-auto {overflow: auto;}

.tabs-c {display: flex; flex-wrap: wrap; padding-left: 0; margin-bottom: 5px; list-style: none; border-bottom: 1px solid #1071bd}
.tabs-c.mb0 {margin-bottom: 0;}
.tabs-item {min-width: 70px; text-align: center; margin-bottom: -1px; margin-right: -1px}
.tabs-link {display: block; padding: 5px 10px; color: #666; background-color: #f6f6f6; border: 1px solid silver; border-bottom-color: #1071bd; font-size: 13px; width: 100%; cursor: pointer}
.tabs-link:hover {color: #666; background-color: #fff}
.tabs-link:hover,
.tabs-link:focus {text-decoration: none}
.tabs-link.disabled {color: #999; pointer-events: none; cursor: default}
.tabs-link.active {position: relative; font-weight: 700; color: #1071bd; background-color: #fff; border-color: #1071bd #1071bd #fff}
.tabs-ink-bar {border-bottom-color: #dbdbdb}
.tabs-ink-bar .tabs-item {margin-bottom: 0}
.tabs-ink-bar .tabs-link {position: relative; padding: 1rem 1.25rem; border: 0 !important; background-color: #fff}
.tabs-ink-bar .tabs-link:hover {color: #000}
.tabs-ink-bar .tabs-link.active {color: #1071bd}
.tabs-ink-bar .tabs-link.active::before {content: ""; position: absolute; left: 0; right: 0; bottom: -1px;  height: 5px; background-color: #1071bd}
.tabs-justified .tabs-item {flex-basis: 0; flex-grow: 1; text-align: center}
.tabs-inner {margin-top: -5px;}
.tabs-inner-line {padding: 5px; border: 1px solid #ccc; border-top: 0;}
.tabs-search-wrap .table th {text-align: right; color: #555;}
.tabs-search-wrap .table th,
.tabs-search-wrap .table td {padding: 2px 2px;}
.tabs-inner-line .search {padding: 5px 14px;}
.tabs-c-right-btn {position:absolute; right: 0;}

.table-fixed {table-layout:fixed !important;}
.table-border th,
.table-border td {border: 1px solid #ccc; padding: 6px; height: 36px; word-break: break-all;}
.table-border th .fixed-table-container th,
.table-border td .fixed-table-container td {padding: 0px 2px;}
.table-border {border: 1px solid #ccc; table-layout:fixed;}
.table-border th.th-sum,
.table-border td.td-sum {color: #ad6e00; background-color: #fffabf;}
.table-border th.td-gray,
.table-border td.td-gray {background-color: #f1f1f1;}
.table-border th {background: #f2f8fe; color: #555; letter-spacing: -0.5px;}
.table-border th.th-orange,
.table-border td.td-orange {background: #ffe9dd;}
.table-border th.th-yellow,
.table-border td.td-yellow {background: #fbfce8;}
.table-border .text-primary a,
.table-border .text-primary a:hover {color: #005da7;}
.table-attfile {display: flex; flex-wrap: wrap;}
.table-attfile .table-attfile-item {padding-right: 10px;}
.table-attfile .table-attfile-item button {height: 22px; width: 22px; border-radius: 4px;}
.table-attfile .table-attfile-item button i.font-18 {line-height: 1.3rem;}
.table-attfile-item:hover .remove-btn {
    display: inline-block !important;
}

.table-summary {padding: 5px 5px 10px 5px;}
.each-add {padding: 10px 0 0 0; border-top: 1px dashed #ccc;}
.table-border tr:hover {/* background: #e4f0fb; */}
.table-border.link td.td-link:hover {background-color: #c3e1ff; text-decoration: underline;}
.table-border .text-strong {font-size: 15px; font-family: "NGB";}
.table-pd-sm th,
.table-pd-sm td {height: 24px;}
.doc-table {table-layout: auto !important;}
.doc-table th,
.table-border th.th-gray {background: #efefef;}
.table-border th.th-skyblue {background: #c3e1ff;}
.doc-height th {height: 60px;}
.doc-height th,
.doc-height td {font-size: 14px;}
.doc-table .title-bg,
.table-border .title-bg {background: #ffe9dd;}
.doc-table .yk-stamp {position: absolute; left: 45px; top: -3px;}
.table-border td.align-c {text-align:center;}

.calendar-table {border: 1px solid #ccc; table-layout:fixed;}
.calendar-table th {padding: 6px;}
.calendar-table td {padding: 0; vertical-align: top; width: 14.2857%; height: 140px;}
.calendar-table.type-vertical-unset td {vertical-align:baseline;}
.calendar-table td a {border: 0px solid #ff0000;}
.calendar-table .disable {color: #aaa;}
.calendar-table th,
.calendar-table td {border: 1px solid #ccc; word-break: break-all;}

.calendar-table .date-item {float: right; padding: 3px 5px 0 0; text-align: right;}
.calendar-table .week-title,
.calendar-table .vt-center {text-align: center; vertical-align: middle;}
.calendar-table .vt-center.text-left {padding-left: 6px; padding-right: 6px;}
.calendar-table .week-title .week-item {font-size: 18px;}
.calendar-table .date-item .date {font-size: 15px;}
.calendar-table .date-item .date.prev,
.date.next {color: #ccc;}
.calendar-table .date-item .center {color: #0e4c92;}
.calendar-table .datail-list {padding: 25px 5px 10px 5px; clear: both; color: #cc0000; font-size: 11px;}
.calendar-table .datail-list2 {padding: 10px 5px 10px 5px; clear: both; color: #cc0000; font-size: 10px; letter-spacing: -2px;}
.calendar-table.type-vertical-unset th {background-color:#f7f7f7;}
.calendar-table.type-vertical-unset .date-item {width:100%; float:none;}
.calendar-table.type-vertical-unset .datail-list {width:100%; margin-top:auto;}
.calendar-table.type-vertical-unset td.sunday-bg .date-item .date {color:red;}
.calendar-table.type-vertical-unset td.satuday-bg .date-item .date {color:blue;}
.calendar-table.type-vertical-unset td.today-bg .date-item .date {font-weight:bold;}
.calendar-inner-list .flex-box {justify-content: space-between;}
.calendar-inner-list li + li {margin-top:4px;}
.calendar-inner-list li p {color:#000;}
.calendar-inner-list li p:nth-child(2) { text-align: left; }
.calendar-inner-list li.bottom-btn .btn {width:100%; background:transparent; border:1px solid #ccc;}
.calendar-inner-list li.bottom-btn .btn:focus { background:transparent; }
.calendar-inner-list li .btn.btn-transparent {background:transparent; border:1px solid #ccc;}
.calendar-inner-list li.bottom-btn .btn:hover,
.calendar-inner-list li .btn.btn-transparent:hover {color:#000; border-color:#a0a0a0;}

.datail-list2 .am,
.datail-list2 .pm {color: #000; padding: 5px; border-radius: 5px;}
.datail-list2 .am {background: #ffeaea;}
.datail-list2 .pm {background: #e1f5ff;}
.datail-list2 ul ~ ul {margin-top: 7px;}
.bul-am,
.bul-pm {position: relative; padding-left: 15px;}
.bul-am {padding-right: 5px;}
.bul-am:before,
.bul-pm:before {content: ""; display: inline-block; position: absolute; left: 0; top: 1px; width: 10px; height: 10px; border-radius: 3px;}
.bul-am:before {background: #f3d2d2;}
.bul-pm:before {background: #cde7f5;}
.calendar-table .detail-holiday {padding: 25px 5px 10px 5px; clear: both; color: #000; font-size: 14px; text-align: center;}
.calendar-table .detail-journal {padding: 35px 5px 10px 5px; clear: both; color: #000; font-size: 14px; text-align: center;}
.calendar-table .sunday-bg {background: #ffeaea;}
.calendar-table .satuday-bg {background: #e1f5ff;}
.calendar-table .complete-bg {background: #ededed;}
.calendar-table .holiday-bg {background: #ffeaea;}
.calendar-table .fixedsche-bg {background: #fffcf1;}
.calendar-table .today-bg {background: #fdf0e5;}
.calendar-table .text-holiday {color: #d91920;}
.calendar-table th.th-sum {color: #ad6e00; background-color: #fffabf;}
.calendar-table th.td-gray,
.calendar-table td.td-gray {background-color: #f1f1f1;}
.calendar-table th {background: #f2f8fe; color: #555;}

.checklist-comment {font-size: 14px; color: #ff7e00; padding-bottom: 10px; border-bottom: 1px dashed #ddd;}
.checklist-item {margin: 10px 0 10px 0; position: relative;}
.checklist-item img,
.checklist-item .no-img  {border: 1px solid #ccc; width: 190px; height: 253px; text-align: center;}
.checklist-item .no-img {display: flex; flex-direction: column; justify-content: center; align-items: center; font-size: 14px; color: #aaa; background: #f3f3f3;}
.checklist-item.thumb-sm {display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #ddd; padding-bottom: 10px;}
.checklist-item.thumb-sm .flex-1 {flex: 1;}
.checklist-item.thumb-sm img,
.checklist-item.thumb-sm .no-img {width: 144px; height: 192px; margin-right: 10px;}
.checklist-item.thumb-sm .att-title:before {content: "- "; display: inline-block; padding-right: 5px;}
.table-border td .no-img-txt {font-size: 14px; color: #aaa;}
.checklist-item .attach-delete {right: 6px; top: 6px;}
.checklist-item .attach-file {position: absolute; right: 6px; bottom: 6px;}

.checklist-im-wrap {padding: 5px 0px 10px 0px;}
.checklist-im {width: 100%; padding: 8px; border-radius: 70px; background: #ddd; color: #fff;}
.checklist-im .checklist-im-inner {display: flex; align-items: center; width: 100%; padding: 10px 30px; border-radius: 60px; background: #f89926; color: #fff;}
.checklist-im .checklist-im-inner .header {flex-basis: 160px; font-size: 15px;}
.checklist-im .checklist-im-inner .body {display: flex; flex: 1; flex-direction: column; margin-right: 20px; font-size: 14px;}
.checklist-im .checklist-im-inner .body div {font-size: 13px; border-bottom: 1px dashed #f5c080; width: 100%;padding: 5px 0 5px 0;}

.photo-upload {position: relative;}
.photo-upload .attach-file {position: absolute; right: 12px; bottom: 12px;}
.photo-upload .no-img {flex-direction: column; font-size: 14px; color: #aaa; background: #f3f3f3; padding: 50px 0;}
.photo-upload img,
.photo-upload .no-img {display: flex; align-items: center; justify-content: center; border: 1px solid #ccc; text-align: center;}

.badge {display: inline-block; padding: .25em .4em; font-size: 75%; font-weight: 700; line-height: 1; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: .25rem}
.badge:empty {display: none}
.btn .badge {position: relative; top: -1px}
.badge-pill {padding-right: .6em; padding-left: .6em;border-radius: 10rem}
.badge-primary {color: #fff; background-color: #1071bd}
.badge-secondary {color: #fff; background-color: #6c757d}
.badge-success {color: #fff; background-color: #28a745}
.badge-info {color: #fff; background-color: #17a2b8}
.badge-warning {color: #212529; background-color: #ffc107}
.badge-danger {color: #fff; background-color: #dc3545}
.badge-light {color: #212529; background-color: #f8f9fa}
.badge-dark {color: #fff; background-color: #343a40}

.staff-cal {color: #333; font-size: 11px;}
.staff-cal .badge {width: 50px;}

td.pd0 {padding:0;}
.sm-table {padding: 0 5px; margin: 0; }
.sm-table input {}
.sm-table .th,
.sm-table .td {font-size: 10px !important; height: 20px; padding: 0px;}
.sm-table .td input {padding: 0; margin: 0;border:0;border-bottom: 1px solid #ddd; border-radius: 0;height: 14px; }
.sm-table .td.border-n input {border-bottom: 0}

.md-table .th,
.md-table .td {font-size: 11px !important; height: 20px; padding: 0px 2px;}

.lg-table .th,
.lg-table .td {font-size: 15px !important; height: 70px; padding: auto 14px; font-family: "NGB";}
.lg-table .th {background: #2489e1; color: #fff;}

.fixed-table-container {/*width: 800px;height: 200px;*/	position: relative; padding-top: 0px;}
.fixed-table-header-bg {border: 1px solid #ccc;	text-align: center; color: #000; background: #efefef; height: 20px; position: absolute; top: 0; right: 0; left: 0;}
.fixed-table-wrapper {overflow-x: hidden; overflow-y: auto; height: 100%; border: 1px solid #ccc; border-top: 0;}
table.fixed-table {width: 100%;	border-collapse: collapse;}
table.fixed-table th {border: 0;}
table.fixed-table td {border: 1px solid #ccc; height: 20px; padding: 3px 10px 2px; text-align: left; color:#666; border-left: 0; border-top: 0; font-size: 11px;}
table.fixed-table td + td {border: 1px solid #ccc; border-top: 0;}
table.fixed-table td + td.last {border-right: 0;}
table.fixed-table td input[type="checkbox"] {margin-top: 0;}
table.fixed-table th {padding: 0px; /* reset */}
table.fixed-table .th-text {position: absolute; top: 0;	width: inherit; line-height: 20px; border-left:1px solid #ccc; font-size: 11px;}
table.fixed-table th:first-child .th-text {border-left: 0;}

.img-view,
.img-view2,
.img-view3,
.img-view4 {text-align: center;}
.img-view img {height: 700px;}
.img-view2 img {height: 576px; border: 1px solid #ddd; margin-top: 10px;}
.img-view3 img {height: 1024px;}
.img-view3 .photo-wrap {position: relative; width: 768px; margin: 0 auto;}
.img-view3 > .drag-comment {width: 768px; height: 1024px; margin-top: 5px;}
.img-view3 .photo-delete {position: absolute; right: 10px; top: 10px; border-radius: 50%; background: #cc0000; opacity: 0.6; filter: Alpha(opacity=60);}
.img-view3 > .photo-delete button i {font-size: 24px; margin-top: 0;}
.img-view4 img {height: 200px; margin-top: 5px;}
.img-view4 .photo-wrap {position: relative; width: 300px; margin: 0 auto;}
.img-view4 > .drag-comment {width: 100%; height: 200px; margin-top: 5px;}
.img-view4 .photo-delete {position: absolute; right: 10px; top: 10px; border-radius: 50%; background: #cc0000; opacity: 0.6; filter: Alpha(opacity=60);}
.img-view4 > .photo-delete button i {font-size: 24px; margin-top: 0;}
.file-name {font-size: 14px; padding: 6px 0 6px 0; color: #666; text-align: center;}
.custom-file-wrap {margin: 10px 0 0 0; padding: 10px; border: 1px dashed #ddd;  background: #fafafa;}
.attachfile-item {position: relative; margin: 0 auto;}
.attachfile-item .attach-delete button {position: absolute; right: 90px; top: 25px; border-radius: 50%; background: #cc0000; opacity: 0.6; filter: Alpha(opacity=60);}
.drag-comment {display: flex; flex-direction: column; width: 432px; height: 576px; justify-content: center; border: 1px solid #ddd; margin: 0 auto; margin-top: 10px;}

/* 박준영과장 추가 (컨펌중)
.img-view5 img {height: 700px;}
.img-view5 .photo-wrap {position: relative; width: 525px; margin: 0 auto;}
.img-view5 > .drag-comment {width: 525px; height: 700px; margin-top: 5px;}
.img-view5 .photo-delete {position: absolute; right: 10px; top: 10px; border-radius: 50%; background: #cc0000; opacity: 0.6; filter: Alpha(opacity=60);}
.img-view5 > .photo-delete button i {font-size: 24px; margin-top: 0;}
*/

.input-group {position: relative; display: flex; flex-wrap: wrap; align-items: stretch; width: 100%}
.input-group > .form-control + .form-control,
.input-group > .form-control + .custom-select,
.input-group > .form-control-plaintext + .form-control,
.input-group > .form-control-plaintext + .custom-select,
.input-group > .form-control-plaintext + .custom-file,
.input-group > .custom-select + .form-control,
.input-group > .custom-select + .custom-select,
.input-group > .custom-select + .custom-file,
.input-group > .custom-file + .form-control,
.input-group > .custom-file + .custom-select,
.input-group > .custom-file + .custom-file {
    margin-left: -1px
}
.input-group .form-control {border-radius: 4px 0 0 4px;}
.input-group .form-control ~ .btn {border-radius: 0px 4px 4px 0;}
.date-range {padding: 0 5px;}
.icon-btn-cancel-wrap {position: relative; /* display: flex; flex: 1; */}
.icon-btn-cancel-wrap input {padding-right: 20px;}
.icon-btn-cancel-wrap .icon-btn-cancel {position: absolute; right: 2px; top: 0px; cursor: pointer;}
.input-group.icon-btn-cancel-wrap .icon-btn-cancel {position: absolute; right: 25px; top: 2px; cursor: pointer; z-index: 10;}

.icon-btn-cancel-wrap.login .icon-btn-cancel {right: 10px; top: 13px;}
.icon-btn-cancel-wrap.login input {padding-right: 30px;}
.custom-file-input {position: relative; z-index: 2; width: 100%; height: 26px; margin: 0; opacity: 0;}
.custom-file-label {position: absolute; top: 0; right: 0; left: 0; z-index: 1; height: 26px; padding: 0 5px; font-size: 13px; font-weight: 400; line-height: 26px; color: #aaa; background-color: #fff; border: 1px solid #ccc; border-radius: 4px;}
.custom-file-label.align-bottom {top: auto; bottom: 0;}
.custom-file-label.disabled {background-color: #e9ecef;}
.custom-file-input ~ .custom-file-label:after {content: "파일찾기"; font-size: 12px;}
.custom-file-input ~ .custom-file-label.txt2:after {content: "불러오기"; font-size: 12px;}
.custom-file-label:after {float: left;}
.custom-file-label:after {
  position: absolute; top: 0; right: 0; bottom: 0; z-index: 3; display: block; height: 24px; padding: 0 5px; line-height: 26px; color: #0e4c92; content: "Browse"; border-left: inherit; border-radius: 0 4px 4px 0;
  background: rgb(245,245,245); /* Old browsers */
  background: -moz-linear-gradient(top,  #ffffff 0%, rgba(221,221,221,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 ); /* IE6-9 */
}
.input-group > .form-control:focus,
.input-group > .custom-select:focus,
.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label {z-index: 3}
.input-group > .custom-file .custom-file-input:focus {z-index: 4}
.input-group > .custom-file {display: flex; align-items: center}
.form-control:focus {
  color: #495057;
  /* background-color: transparent; */
  border-color: #80bdff;
  outline: 0;
  box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .25)
}
.form-control::-webkit-input-placeholder {
  color: #aaa;
  opacity: 1;
  font-size: 11px;
}
.form-control::-moz-placeholder {
  color: #aaa;
  opacity: 1;
  font-size: 11px;
}
.form-control:-ms-input-placeholder {
  color: #aaa;
  opacity: 1;
  font-size: 11px;
}
.form-control.ph-c::-webkit-input-placeholder {text-align: center;}
.form-control.ph-c::-moz-placeholder {text-align: center;}
.form-control.ph-c:-ms-input-placeholder {text-align: center;}

.input-group-prepend,
.input-group-append {display: flex;}
.input-group-prepend .btn,
.input-group-append .btn {position: relative; z-index: 2}
.input-group-prepend .btn:focus,
.input-group-append .btn:focus {z-index: 3}
.input-group-prepend .btn + .btn,
.input-group-prepend .btn + .input-group-text,
.input-group-prepend .input-group-text+.input-group-text,
.input-group-prepend .input-group-text+.btn,
.input-group-append .btn+.btn,
.input-group-append .btn+.input-group-text,
.input-group-append .input-group-text+.input-group-text,
.input-group-append .input-group-text+.btn {margin-left: -1px}
.input-group-prepend {margin-right: -1px}
.input-group-append {margin-left: -1px}
.input-group-text {display: flex; align-items: center; padding: .4rem .75rem; margin-bottom: 0; font-size: .875rem; font-weight: 400; line-height: 1.5; color: #495057; text-align: center; white-space: nowrap; background-color: #e9ecef; border: 1px solid silver}
.input-group-text input[type="radio"],
.input-group-text input[type="checkbox"] {margin-top: 0}
.form-row {display: flex; flex-wrap: wrap; align-items: center; margin-right: -5px; margin-left: -5px}
.form-row.inline-pd {align-items: center;}

/* col- 테스트  */
.form-row.inline-pd [class^="col"] {padding-right: 5px; padding-left: 0px;}
.form-row.inline-pd [class^="col"]:first-child {padding-left: 5px;}
.search-wrap .col {flex-grow: 0;}
.form-row.widthfix {flex-grow: 0;}
.form-row.widthfix [class^="col"] {flex-grow: 0;}
.row.widthfix {flex-grow: 0;}

.width10px,
.row.widthfix .width10px,
.form-row.widthfix .width10px {max-width: 10px;}

.width16px,
.row.widthfix .width16px,
.form-row.widthfix .width16px {max-width: 16px;}

.width22px,
.row.widthfix .width22px,
.form-row.widthfix .width22px {max-width: 22px;}

.width28px,
.row.widthfix .width28px,
.form-row.widthfix .width28px {max-width: 28px;}

.width33px,
.row.widthfix .width33px,
.form-row.widthfix .width33px {max-width: 33px;}

.width35px,
.row.widthfix .width35px,
.form-row.widthfix .width35px {max-width: 35px;}

.width40px,
.row.widthfix .width40px,
.form-row.widthfix .width40px {max-width: 40px;}

.width45px,
.row.widthfix .width45px,
.form-row.widthfix .width45px {max-width: 45px;}

.width50px,
.row.widthfix .width50px,
.form-row.widthfix .width50px {max-width: 50px;}

.width60px,
.row.widthfix .width60px,
.form-row.widthfix .width60px {max-width: 60px;}

.width70px,
.row.widthfix .width70px,
.form-row.widthfix .width70px {max-width: 70px;}

.width80px,
.row.widthfix .width80px,
.form-row.widthfix .width80px {max-width: 80px;}

.width90px,
.row.widthfix .width90px,
.form-row.widthfix .width90px {max-width: 90px;}

.width95px,
.row.widthfix .width95px,
.form-row.widthfix .width95px {max-width: 95px !important;}

.width100px,
.row.widthfix .width100px,
.form-row.widthfix .width100px {max-width: 100px !important;}

.width106px,
.row.widthfix .width106px,
.form-row.widthfix .width106px {max-width: 106px;}

.width110px,
.row.widthfix .width110px,
.form-row.widthfix .width110px {max-width: 110px;}

.width115px,
.row.widthfix .width115px,
.form-row.widthfix .width115px {max-width: 115px;}

.width120px,
.row.widthfix .width120px,
.form-row.widthfix .width120px {max-width: 120px;}

.width130px,
.row.widthfix .width130px,
.form-row.widthfix .width130px {max-width: 130px;}

.width140px,
.row.widthfix .width140px,
.form-row.widthfix .width140px {max-width: 140px;}

.width145px,
.row.widthfix .width145px,
.form-row.widthfix .width145px {max-width: 145px;}

.width150px,
.row.widthfix .width150px,
.form-row.widthfix .width150px {max-width: 150px;}

.width160px,
.row.widthfix .width160px,
.form-row.widthfix .width160px {max-width: 160px;}

.width200px,
.row.widthfix .width200px,
.form-row.widthfix .width200px {max-width: 200px !important;}

.width210px,
.row.widthfix .width210px,
.form-row.widthfix .width210px {max-width: 210px !important;}

.width215px,
.row.widthfix .width215px,
.form-row.widthfix .width215px {max-width: 215px;}

.width230px,
.row.widthfix .width230px,
.form-row.widthfix .width230px {max-width: 230px;}

.width250px,
.row.widthfix .width250px,
.form-row.widthfix .width250px {max-width: 250px !important;}

.width280px,
.row.widthfix .width280px,
.form-row.widthfix .width280px {max-width: 280px;}

.width400px,
.row.widthfix .width400px,
.form-row.widthfix .width400px {max-width: 400px;}

.width600px,
.row.widthfix .width600px,
.form-row.widthfix .width600px {max-width: 600px;}

.width750px,
.row.widthfix .width750px,
.form-row.widthfix .width750px {max-width: 750px;}

.width780px,
.row.widthfix .width780px,
.form-row.widthfix .width780px {max-width: 780px;}

.width1000px,
.row.widthfix .width1000px,
.form-row.widthfix .width1000px {max-width: 1000px;}

.width1200px,
.row.widthfix .width1200px,
.form-row.widthfix .width1200px {max-width: 1200px;}

.input-group.width100px,
.form-control.width100px {max-width: 100px;}
.input-group.width120px,
.form-control.width120px {max-width: 120px;}
.input-group.width140px,
.form-control.width140px {max-width: 140px;}

.btn.btn-icon {padding: 0; width: 24px; height: 24px;}
.btn.btn-icon-lg {padding: 0; width: 28px; height: 28px;}
.input-group>.form-control, .input-group>.form-control-plaintext, .input-group>.custom-select, .input-group>.custom-file {position: relative; flex: 1 1 auto; width: 1%; margin-bottom: 0;}
.custom-control {position: relative; display: block; min-height: 1.5rem; padding-left: 1.5rem;}
.custom-control-inline {display: -ms-inline-flexbox; display: inline-flex; margin-right: 1rem;}
.form-check {position: relative; display: block; padding-left: 1.25rem;;}
.form-check-input {position: absolute; margin-top: .23rem; margin-left: -1.25rem}
.form-check-inline {display: -ms-inline-flexbox; display: inline-flex; -ms-flex-align: center; align-items: center; padding-left: 0; margin-right: .75rem; padding-top: 1px}
.form-check-inline .form-check-input {position: static; margin-top: 2px; margin-right: .3125rem; margin-left: 0; margin-bottom: 1px;}
.form-check-input:disabled~.form-check-label {color: #6c757d}
.form-check-label {margin-bottom: 0;     margin-top: 0px;}
.right-line {border-right: 1px solid #ddd;}

.satisfaction-survey-item {}
.satisfaction-survey-item .s-commemt {padding: 20px 0; font-size: 15px; line-height: 24px; color: #ff7e00; text-align: center;}
.satisfaction-survey-item .s-check {background: #efefef; border: 1px solid #ccc; padding: 12px; text-align: center; }
.satisfaction-survey-item .s-check  h3 {font-size: 15px; padding: 10px 0 20px 0;}
.satisfaction-survey-item .s-check label {color: #333; font-size: 14px;}

.maintenance-item {display: flex; padding: 5px; border: 1px solid #ccc; background: #efefef;}
.maintenance-item .header {width: 50px; padding-left: 6px;}
.maintenance-item .body {display: flex; flex-direction: column; flex: 1;}
.maintenance-item .body .select-section {display: flex; flex-direction: row;}

.box-border {border: 1px solid #ddd; margin-top: 4px;}
.box-border [class^='col'].box-gray {padding-bottom: 10px; background: #fafafa;}

.multiselect-s-wrap {background: #fff; border: 1px solid #bbb; padding: 3px 0 3px 4px; border-radius: 4px; overflow: auto;}
.multiselect-s-wrap .select-area {cursor: pointer; margin-right: 18px;}
.multiselect-s-wrap .select-area * {vertical-align: top;}
.multiselect-s-wrap .select-area label {margin-left: 0px; width: calc(100% - 25px); word-break: break-all;}

.addr-search-wrap {border: 0px solid #eee;  padding: 10px;}
.road-search {display: flex; width: 100%; padding: 0 0;}
.road-addr {flex: 1; border: 3px solid #ccc; border-right: 0;}
.road-addr input {width: 100%; height: 30px; line-height: 30px; border: 0;}
.road-addr .icon-btn-cancel {right: 3px; top: 4px;}
.road-search .btn-area {}
.road-search .btn-area button {border-radius: 0; background: #777; width: 36px; height: 36px; line-height: 36px; color: #fff;}
.road-search .btn-area button.btn [class^="material-icons"] {margin-top: -8px; vertical-align: middle; font-size: 24px;}
.road-search-tip {padding: 5px 5px; color: #777}
.landlot-txt {display: block; font-size: 12px; color: #aaa;}
.pagination {margin-top: 10px;}
.pagination ul {display: flex; flex-direction: row; justify-content: center;}
.pagination li a {display: block; padding: 5px 10px;}
.pagination li a.active {background: #1268b1; color: #fff;}
.pagination li a.disable {color: #ddd;}
.addr-save-btn {width: 100%; text-align: center;}

.comment-header .title-comment * {vertical-align: middle;}
.comment-header .title-comment .material-iconschat {font-size: 18px; padding-right: 2px;}
.comment-header .comment-input-item {display: flex; margin-top: 5px;}
.comment-header .comment-input-item button {width: 100px;}
.comment-body {border: 0px solid #ff0000; padding: 5px 0;}
.comment-body .comment-item {padding: 10px; border-bottom: 1px solid #ddd;}
.comment-body .comment-item.even {background: #fcfcfc;}
.comment-body .comment-item .comment-info {padding-bottom: 5px;}
.comment-body .comment-item .comment-info span {position: relative; padding: 0 10px; color: #aaa;}
.comment-body .comment-item .comment-info span:before {content: ""; position: absolute; width: 1px; height: 8px; background: #ccc; left: 0px; top: 3px;}
.comment-body .comment-item .comment-info span:first-child {padding-left: 0px;}
.comment-body .comment-item .comment-info span:first-child:before {width: 0px;}
.comment-body .comment-item .comment-text {padding-bottom: 5px;}

a.link-bracket:before {content: "[ ";}
a.link-bracket:after {content: " ]";}

/* 품의서 등록 스텝 */
.step-wrap {border: 0px solid #ff0000; display: flex;}
.step-wrap .step {border: 0px solid #ffcc00; }
.step-wrap .step li {margin-bottom: 3px;}
.step-wrap .step a {display: flex; flex-direction: column; justify-content: center; width: 114px; height: 85px; padding-left: 18px; box-sizing: border-box; color: #666; background: #eee; border: 1px solid #ddd;}
.step-wrap .step a.active {color: #fff; background: #1071bd; border: 1px solid #0b60a2;}
.step-wrap .step a .step-num {font-size: 12px; line-height: 1.6;}
.step-wrap .step a .step-title {font-size: 16px; font-weight: bold; line-height: 1.6;}
.step-wrap .step-con {padding: 30px 35px; border: 1px solid #ddd; margin-left: -1px;}
.step-wrap .step-con .step-title {font-size: 16px; font-weight: bold; line-height: 1.6; color: #1071bd; margin-bottom: 15px;}
.step-wrap .step-con .step-num {font-size: 15px;}
.step-wrap .step-con .step-title {font-size: 22px; font-weight: bold;}
.step-wrap .step-con .step-info {font-size: 14px; line-height: 1.6; margin-bottom: 15px;}

.content-wrap .title-rank h4:before {display: none;}
.title-rank {text-align: center;}
.title-rank h4 {font-size: 22px; padding: 20px 10px 20px; color: #000;}
.rank-items {display: flex; justify-content: space-between;}
.rank-items .rank-item {width: 23%;
display: flex; flex-direction: column;}
.rank-field {background: #1bae44; font-size: 18px; padding: 10px; text-align: center; color: #fff; border: 1px solid #1bae44; }
.rank-photo {display: flex; padding: 20px 25px 20px 30px; justify-content: space-between; align-items: center; border: 1px solid #ddd; border-top: 0;}
.rank-photo .photo {}
.rank-photo .photo img {width: 90px; height: 102px; border: 1px solid #ddd; border-radius: 3px;}
.rank-photo .photo img.icon-user {width: 100%;}
.rank-info {display: flex; align-items: center; justify-content: center;  text-align: center; padding: 10px; border: 1px solid #ddd; border-top: 0; font-size: 14px; background: #fafafa;}
.rank-info span {width: 50%; position: relative;}
.rank-info span:first-child:before {content: ""; display: inline-block; position: absolute; width: 1px; height: 10px; background: #ddd; right: 0; top: 6px;}
.rank-figure {display: flex; justify-content: flex-end; padding: 15px; font-size: 20px; align-items: baseline; border: 1px solid #ddd; border-top: 0; background: #f1f1f1;}
.rank-figure .font-sm {font-size: 15px; color: #999; padding-left: 2px;}

.income-items {padding: 10px 0px}
.income-items h5 {font-size: 14px; padding-bottom: 5px; font-weight: bold;}
.income-item {margin-bottom: 20px;}
.income-item .income-period {padding: 10px;}
.income-item .income-period .period {font-size: 14px; padding-bottom: 15px;}
.income-item .income-period .com {font-size: 14px; line-height: 1.8; text-align: center;}
strong.income-sum {font-size: 15px; color: #000;}
.income-item table .td-sum {color: #000;}
.income-item ul {padding: 15px 15px; font-size: 14px;;}
.income-item ul li {padding: 5px; line-height: 1.6; text-indent: -10px;}
.income-item ul li:before {content: "- ";}
.sign-items {padding:0 20%;}
.sign-items .sign-item {}
.sign-corporatename {width: 90px; display: inline-block;}
.sing-personname {display: inline-block; text-align: right; width: calc(100% - 175px);}
.sing-personname + span {width: 100px;display: inline-block; text-align: right; padding-right: 15px;}
.sign-agree {color: #005da7; border: 1px solid #005da7; padding: 10px;}

.doc-com {text-align: center; padding: 25px;}
.doc-com:after {content: ""; display: block; clear: both;}
.doc-com .text {font-size: 14px; line-height: 26px;}
.doc-com .detail-info {font-size: 13px; text-align: right; color: #777;}

.location-wrap {display: flex; width: 100%; padding-top: 15px;}
.location {display: flex; flex: 1; align-items: center; padding-left: 10px; border-bottom: 1px solid #ddd; padding-bottom: 10px;}
.location a {display: flex; align-items: center; align-items: center; font-size: 13px;}
.location a.active {color: #2489e1; font-family: "NGB"}
.location a:after {content: " > "; display: inline-block; clear: both; padding: 0 5px;}
.location li:last-child a:after {content: "";}
.icon-btn-home {margin-top: 1px;}
.icon-btn-home:before {content:""; display: inline-block; background:url(../images/icons.png) no-repeat; width: 15px; height: 13px; background-position: -120px 0px;}

.folder-items {width: 100%; display: flex; justify-content: flex-start; flex-wrap: wrap; margin-top: 10px; margin-bottom: 20px;}
.folder-items2 {width: 100%; display: flex; justify-content: flex-start; flex-wrap: wrap; margin-top: 10px; margin-bottom: 10px;}
.folder-item2 {width: 146px; margin: 0 10px;}
.folder-item2 .date {font-size: 12px; color: #777; margin-bottom: 5px; padding: 0 5px;}
.folder-item2:hover .date {color: #000;}
.folder-item2 .info {font-size: 13px; color: #000; margin-bottom: 20px; padding: 0 0px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; max-height: 54px; line-height: 18px; text-overflow:ellipsis;}
.folder-item2:hover .info {color: #2489e1;}
.folder-item2 .thumb {width: 146px; height: 146px; margin-bottom: 8px; border: 1px solid #ddd; display: flex; justify-content: center; align-items: center; position: relative;}
.folder-item2 .thumb .hover {display: none;}
.folder-item2:hover .thumb .hover {display: block; position: absolute; left: 0; top: 0; width: 144px; height: 144px; background: #555; border: 1px solid #111; opacity: 0.5; filter: alpha(opacity=50); z-index: 10;}
.folder-item2 .thumb .hover ~ .btns {display: none; position: absolute; bottom: 7px; right: 5px; z-index: 10;}
.folder-item2:hover .thumb .hover ~ .btns {display: block;}
.folder-item2 .thumb .num {position: absolute; right: 10px; top: 10px; background: #608be5; color: #fff; padding: 1px 8px; border-radius: 15px; z-index: 5;}
.folder-item2 .info input {border: 1px solid #bbb;}
.folder-items2 ~ hr.div-line {position: static; margin-bottom: 20px; border: 0; border-top: 1px solid #ddd; width: calc(100% - 5px);}
.folder-items2.folder-step {display: flex;}
.folder-items2.folder-step .folder-upper {display: flex; padding: 0px;}
.folder-items2.folder-step .folder-upper .folder-item2 .info > div {font-family: "NGB";}
.folder-items2.folder-step .folder-upper .folder-item2 .thumb,
.folder-items2.folder-step .folder-upper .folder-item2:hover .thumb {border: 1px solid #555;}
.folder-items2.folder-step .folder-upper .folder-item2:hover .info {color: #000;}
.folder-items2.folder-step .folder-upper .folder-item2 .fromto {display: flex; flex-direction: column; padding-bottom: 5px; border-bottom: 1px dashed #ddd; margin-bottom: 10px;}
.folder-items2.folder-step .folder-upper .folder-item2 .fromto .from,
.folder-items2.folder-step .folder-upper .folder-item2 .fromto .to {display: flex; flex-direction: row; color: #777; justify-content: space-between;}
.folder-items2.folder-step .folder-upper .folder-item2 .fromto .tit {color: #000;}
.folder-items2.folder-step .folder-lower {display: flex; flex-wrap: wrap; flex: 1;}
.folder-items2.folder-step .folder-lower .folder-item2 .thumb {background: #fbfbfb;}
.folder-item2 .thumb .icon-folder {display: inline-block; background: url(../images/icon-folder2.png) no-repeat; width: 55px; height: 58px;}
.folder-item2 .thumb .icon-folder.folder {background-position: 0 0;}
.folder-item2 .thumb .icon-folder.doc {background-position: 0 -58px;}
.folder-item2 .thumb .icon-folder.etc {background-position: 0 -116px;}
.folder-item2 .thumb .icon-folder.audio {background-position: 0 -174px;}
.folder-item2 .thumb .icon-folder.video {background-position: 0 -232px;}
.folder-item2 .thumb .icon-folder.img {background-position: 0 -290px;}
.folder-item2 .thumb .icon-folder.zip {background-position: 0 -348px;}
.folder-item2 .thumb .icon-folder.exe {background-position: 0 -406px;}
.folder-item2 .thumb .icon-folder.folder-add {background-position: 0 -693px;}
.folder-item2 .thumb .icon-folder.b-folder {background-position: 0 -464px;}
.folder-item2 .thumb .icon-folder.o-folder {background-position: 0 -522px;}
.folder-item2 .thumb .icon-folder.g-folder {background-position: 0 -580px;}
.folder-item2 .thumb .icon-folder.y-folder {background-position: 0 -638px;}

.folder-items.list {display: flex;}
.folder-items.list .folder-item.folder-lower:first-child {}
.folder-items.list .folder-item.folder-upper {width: 160px; /*  194px; */}
.folder-items.list .folder-item {/* width: 156px; */}
.folder-items.list .folder-lower-wrap {display: flex; flex-flow: wrap; flex: 1; padding-left: 10px;}
.folder-items.list .folder-item.folder-upper .icon-folder:hover {background-position: 0 -114px;}
.folder-items.list .folder-item.folder-upper .icon-folder:active {background-position: 0 -228px;}
.folder-items.list .folderin-wrap.lower-state .icon-folder,
.folder-items.list .folder-item.folder-lower .icon-folder:hover {background-position: 0 -570px;}
.folder-items.list .folderin-wrap.lower-state .icon-folder .text-item {color: #000;}
.folder-items.list .folder-item.folder-upper {display: flex; height: auto; border-right: 1px solid #ddd;}
.folder-item {display: flex; justify-content: center; width: 194px; /* height: 131px; margin-top: 15px; */ width: 140px; height: 131px;}
.folder-item.sm {width: 140px; height: 131px;}
.folder-item .folderin-wrap {position: relative; width: 116px;}
.folder-item .folderin-wrap:after {content: ""; display: inline-block; clear: both;}
/* .folder-item:hover .folderin-wrap.default-state .chkbox, */
.folder-item .folderin-wrap.default-state input[type="checkbox"]:checked.chkbox {display: block;}
.folder-item .chkbox {position: absolute; right: 0px; top: 0px; z-index: 10;}
.folder-item .folderin-wrap.default-state .chkbox,
.folder-item .folderin-wrap.add-state .chkbox {display: none;}
.folder-item .icon-folder {background: url(../images/icon-folder.png) no-repeat; width: 116px; height: 114px; position: absolute; left: 0px; top: 15px;}
.folder-item .icon-folder:hover,
.folder-item input[type="checkbox"]:hover + .icon-folder,
.folderin-wrap .btns:hover + .icon-folder {background-position: 0 -114px;}
.folder-item .icon-folder:active,
.folder-item input[type="checkbox"]:checked + .icon-folder:active {background-position: 0 -228px;}

.folder-item input[type="checkbox"]:checked + .icon-folder {background-position: 0 -342px;}
.folderin-wrap.add-state .icon-folder {background-position: 0 -456px;}
.folderin-wrap .btns {display: none; position: absolute; bottom: 7px; right: 5px; z-index: 10;}
.folderin-wrap:hover .btns {display: block;}
.row.db-con {border-bottom: 1px solid #ddd;}
.row.db-con [class^='col'] {border-left: 1px solid #ddd;}
.row.db-con [class^='col']:first-child {border-left: 0;}

.db-title {font-size: 24px; font-family: "NGB"; text-align: center; padding-top: 30px;}
.icon-add {background: url(../images/icon-folder.png) no-repeat; width: 15px; height: 15px; position: absolute; left: 0px; top: 15px;}
.folder-item input[type="checkbox"] {width: 20px; height: 20px;}
.folder-item .text-item {position: absolute; width: 70%; height: 44px; padding: 3px 3px; text-align: center; left: 15%; bottom: 29px; font-size: 12px; color: #fff; /* overflow: hidden; white-space: nowrap; text-overflow: ellipsis; */ display: flex; justify-content: center; align-items: center;}
.folder-item .text-item span {display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
overflow: hidden; max-height: 42px; line-height:14px; text-overflow:ellipsis;}
.folder-item .text-item.input-area {position: absolute; left: 15%; bottom: 31px; padding: 0; height: 50px; background: rgb(245,245,245); background: linear-gradient(180deg, rgba(245,245,245,1) 0%, rgba(240,239,240,1) 100%);}
.folder-item .text-item.input-area input {border: 1px solid #ddd; width: 100%; height: 30px; margin-top: 12px; text-align: center; font-size: 12px; border: 1px solid #ddd; border-radius: 3px;}
.folder-items ~ hr.div-line {position: static; margin-top: 10px; border: 0; border-top: 1px solid #eee; width: calc(100% - 5px);}

.save-location-wrap {display: flex; border: 1px solid #ddd; padding: 10px 5px; flex-wrap: wrap; }
.save-location-wrap .save-location {padding: 5px 12px 5px 10px; position: relative; border: 1px solid #e7e7e7; margin: 6px 6px; color: #666; border-radius: 30px; background: #f7f7f7;}
.save-location-wrap .delete {position: absolute; right: -10px; top: -8px; border-radius: 50%; background: #333;}

ul.row-list {display: flex; flex-wrap: wrap; border: 1px solid #ddd; padding: 5px 5px; }
ul.row-list li {padding: 5px 10px 5px 10px; border: 1px solid #e7e7e7; margin: 6px 3px; color: #666; border-radius: 30px; background: #f7f7f7;}

.detailimg-item {position: relative; margin: 0 auto; width: 200px; margin-top: 10px;}
.detailimg-item .detailphoto {width: 200px; border: 1px solid #ddd; box-sizing: border-box;}
.detailimg-item .detailphoto ~ .detailphoto-delete {position: absolute; right: 5px; top: 5px; border-radius: 50%; background: #cc0000; opacity: 0.6; filter: Alpha(opacity=60);}
.detailimg-item ~ button {margin-top: 10px;}
.detailimg-item .no-img {width: 200px; height: 280px; display: flex; flex-direction: column; border: 1px solid #ccc; align-items: center; justify-content: center; background: #f3f3f3; font-size: 14px; color: #aaa;}
.row-input {margin-top: 10px;}
.row-input a.input-style {margin-top: 6px; height: 24px; border: 1px solid #bbb; display: block; border-radius: 4px; text-indent: 4px; background: #fafafa;}

.bul-sm {display: inline-block; width:8px; height: 8px; border-radius: 50%;}
.bul-red {background: #dd0000;}
.bul-blue {background: #2489e1;}
.bul-green {background: #31933d;}
.level-state {display: flex; align-items: center; justify-content: space-around;}
.level-state .state-bul {display: flex; flex-direction: column;}
.level-state .state-bul span {margin-top: 5px;}
.level-state .state-bul span:first-child {margin-top: 0;}
.level-state .form-check-inline {margin-right: 0;}

.file-attach-group {padding: 10px; border: 1px solid #ddd;}
.file-attach-item {display: flex; align-items: center;}
.file-attach-item:not(:first-child) {padding-top: 10px;}
.file-attach-item:not(:last-child) {padding-bottom: 10px;}
.file-attach-item + .file-attach-item {border-top: 1px dashed #eee;}
.file-attach-item > span:first-child {margin-right: 6px;}
.file-attach-item > button {margin-left: 12px;}
.file-attach-group .file-attach-item button {height: 22px; width: 22px; border-radius: 4px;}
.icon-file-attach-sm {display: inline-block; background: url(../images/icon-file-attach-sm.png) no-repeat; width: 22px; height: 22px;}
.icon-file-attach-sm.txt {background-position: 0 0;}
.icon-file-attach-sm.ppt {background-position: 0 calc(-22px * 1);}
.icon-file-attach-sm.pptx {background-position: 0 calc(-22px * 2);}
.icon-file-attach-sm.doc {background-position: 0 calc(-22px * 3);}
.icon-file-attach-sm.docx {background-position: 0 calc(-22px * 4);}
.icon-file-attach-sm.xls {background-position: 0 calc(-22px * 5);}
.icon-file-attach-sm.xlsx {background-position: 0 calc(-22px * 6);}
.icon-file-attach-sm.hwp {background-position: 0 calc(-22px * 7);}
.icon-file-attach-sm.pdf {background-position: 0 calc(-22px * 8);}
.icon-file-attach-sm.jpg {background-position: 0 calc(-22px * 9);}
.icon-file-attach-sm.jpeg {background-position: 0 calc(-22px * 10);}
.icon-file-attach-sm.png {background-position: 0 calc(-22px * 11);}
.icon-file-attach-sm.gif {background-position: 0 calc(-22px * 12);}
.icon-file-attach-sm.mp4 {background-position: 0 calc(-22px * 13);}
.icon-file-attach-sm.mov {background-position: 0 calc(-22px * 14);}

.error-msg-wrap {text-align: center; padding-top: 100px;}
.error-text {font-size: 16px; margin-top: 20px;}

/* 개별 웹 페이지 */
.web-doc-page {
  max-width: 1280px;
  border: 1px solid #ddd;
  padding: 2rem 1rem;
  margin: 0 auto;
  font-size: 16px;
}

.thumb-list-group .thumb-list-item.doc {
    margin-bottom: 1rem;
}

.thumb-list-group .thumb-list-item.doc .thumb {
    width: 162px;
    height: 216px;
    border: 1px solid #ddd;
}

.thumb-list-group .thumb-list-item.doc .thumb.noimg {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: #fdfdfd;
  color: #646264;
  font-size: 18px;
  line-height: 1.2;
  color: #aaa
}

.thumb-list-group .thumb-list-item.doc img {
    width: 160px;
    height: 214px;
}

.thumb-list-group .thumb-list-item.doc .file-name-1line {
  font-size: 16px;
  width: 160px;
  line-height: 1.25;
  color: #333;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 0.75rem;
}

.web-doc-page .table th {
  font-weight: bold;
  background-color: #fafafa;
}
.web-doc-page .table th,
.web-doc-page .table td {
  padding: 10px 12px;
  border: 1px solid #ddd;
  font-size: 16px;
}

.web-doc-page .web-boxing {
  border: 1px solid #ddd;
  background-color: #fafafa;
  padding: 1rem;
  border-radius: 0.375rem;
}

.web-doc-page .web-boxing .header .left,
.web-doc-page .web-boxing .header .right {
  font-size: 16px !important;
}

.web-doc-page .web-boxing .row {
  margin-top: 16px;
  margin-bottom: -16px;
}

.web-doc-page .web-boxing .col-auto {
  margin-right: 8px;
  margin-left: 8px;
  margin-top: -8px;
  margin-bottom: 8px;
}
.web-doc-page .ver-line {
  position: relative !important;
  padding-right: 0.75rem !important;
  margin-right: 0.75rem !important;
}

.web-doc-page .ver-line:before {
  display: none;
}

.web-doc-page .ver-line:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 1px;
  height: 0.75rem;
  background-color: #bbb;
}

.web-doc-page .sub-title-wrap .left {
  font-size: 16px;
  font-weight: bold;
}

.web-doc-title {
  text-align: center;
  padding: 2rem;
}

.web-doc-title .title-wrap {
  border-bottom: 3px double #bbb; display: inline-block; padding-bottom: 0.75rem; font-size: 1.5rem; font-weight: 600;
}

.web-doc-title .title-wrap .yk-logo {
  height: 1.625rem;
}

.web-doc-title .title-wrap .title {
  vertical-align: middle;
}

.web-doc-title .sub-title-wrap {
  font-size: 20px;
}

.bg-white {
  background-color: #fff !important;
}

.align-items-center {
  align-items: center !important;
}
.justify-content-between {
  justify-content: space-between !important;
}
.d-flex {
  display: flex !important;
}

.d-block {
  display: block !important;
}

.justify-content-start {
  justify-content: flex-start !important;
}

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

.web-doc-page .font-title-4 {
  font-size: 16px;
}

input[type=range] {
  -webkit-appearance: none;
  width: 100%;
  height: 0.5rem;
  background: #ddd;
  border-radius: 0.5rem;
}
input[type=range].green {
  background-image: linear-gradient(#009651, #009651);
  background-size: 50% 100%;
  background-repeat: no-repeat;
}
input[type=range].blue {
  background-image: linear-gradient(#225CA4, #225CA4);
  background-size: 50% 100%;
  background-repeat: no-repeat;
}
input[type=range].red {
  background-image: linear-gradient(#AC0B0B, #AC0B0B);
  background-size: 50% 100%;
  background-repeat: no-repeat;
}

/* Input Thumb */
input[type=range].green::-webkit-slider-thumb,
input[type=range].blue::-webkit-slider-thumb,
input[type=range].red::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 1.25rem;
  width: 1.25rem;
  border-radius: 50%;
  cursor: ew-resize;
  box-shadow: 0 0 2px 0 #555;
  -webkit-transition: background 0.3s ease-in-out;
  transition: background 0.3s ease-in-out;
}

input[type=range].green::-webkit-slider-thumb {
  background: #009651;
}

input[type=range].blue::-webkit-slider-thumb {
  background: #225CA4;
}

input[type=range].red::-webkit-slider-thumb {
  background: #AC0B0B;
}

input[type=range].green::-moz-range-thumb,
input[type=range].blue::-moz-range-thumb,
input[type=range].red::-moz-range-thumb {
  -webkit-appearance: none;
  height: 1.25rem;
  width: 1.25rem;
  border-radius: 50%;
  cursor: ew-resize;
  box-shadow: 0 0 2px 0 #555;
  -moz-transition: background 0.3s ease-in-out;
  transition: background 0.3s ease-in-out;
}

input[type=range].green::-moz-range-thumb {
  background: #009651;
}

input[type=range].blue::-moz-range-thumb {
  background: #225CA4;
}

input[type=range].red::-moz-range-thumb {
  background: #AC0B0B;
}

input[type=range].green::-ms-thumb,
input[type=range].blue::-ms-thumb,
input[type=range].red::-ms-thumb {
  -webkit-appearance: none;
  height: 1.25rem;
  width: 1.25rem;
  border-radius: 50%;
  cursor: ew-resize;
  box-shadow: 0 0 2px 0 #555;
  -ms-transition: background 0.3s ease-in-out;
  transition: background 0.3s ease-in-out;
}

input[type=range].green::-ms-thumb {
  background: #009651;
}

input[type=range].blue::-ms-thumb {
  background: #225CA4;
}

input[type=range].red::-ms-thumb {
  background: #AC0B0B;
}

/* Input Track */
input[type=range]::-webkit-slider-runnable-track {
  -webkit-appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
}

input[type=range]::-moz-range-track {
  -webkit-appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
}

input[type=range]::-ms-track {
  -webkit-appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
}
.border {
  border: 1px solid #ddd;
}
.view-avi {
  position: relative;
}
.icon-view-avi-white {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: inline-block;
  width: 5rem;
  height: 5rem;
  background-image: url("../images/icon-view-avi-white.png");
  background-repeat: no-repeat;
  background-position: center;
}

/* ARS */
.d-flex {display: flex !important;}
.flex-column {flex-direction: column !important;}
.align-items-start {align-items: flex-start !important;}
.justify-content-center {justify-content: center !important;}

.ars-bg,
.ars-bg-disabled {border-radius: 5px; height: 84px; display: flex; align-items: center; flex: 1 0 auto;}
.ars-bg {border: 1px solid #DBECFC; background-color: #F5FAFF; padding: 14px;}
.ars-bg-disabled {border: 1px solid #ccc; background-color: #e7e7e7; padding: 14px;}

.ars-bg.login select,
.ars-bg.login input {flex: 0 0 125px;}
.ars-bg.login * + * {margin-left: 5px;}

.ars-bg.call,
.ars-bg-disabled.call {padding: 0;}

.ars-bg.call .col,
.ars-bg-disabled.call .col {border-right: 1px solid; height: 100%; display: flex; align-items: center; padding: 14px;}
.ars-bg.call .col {border-color: #D8E9FA;}
.ars-bg-disabled.call .col {border-color: #ccc;}

.ars-bg.call .col:last-child,
.ars-bg-disabled.call .col:last-child {border-right: 0;}

.ars-bg .btn-md,
.ars-bg-disabled .btn-md {border-radius: 30px; padding-left: 10px; padding-right: 10px;}

.detail-info-summary {width: calc(100% + 30px); box-shadow: 0 0.75rem 0.75rem rgba(0, 0, 0, 0.15); margin: -10px -15px; border: 0; display: flex; justify-content: center; flex-wrap: wrap;margin-bottom: 20px; min-height: 100px;}
.detail-info-summary .left {width: 25%; display: flex; align-items: center; justify-content: center;}
.detail-info-summary .right {width: 75%; display: flex; flex-direction: column; justify-content: center; padding: 20px; border-left: 1px solid #ddd;}
.detail-info-summary .detail-img {display: flex; align-items: center;}
.detail-info-summary-title {font-weight: 600; font-size: 16px;}
.detail-info-summary-content {margin-top: 10px;}
.detail-info-summary .no-img {height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.detail-info-summary .no-img .no-img-txt {font-size: 14px; color: #aaa;}

.option-group {margin-top: 5px; border: 1px solid #ddd; padding: 6px 10px; overflow: auto;}
.option-item + .option-item {margin-top: 16px;}
.option-item .title-wrap {color: #000; margin-bottom: 4px; display: flex; justify-content: space-between; align-items: center;}
.option-item .title:before {content: '-'; display: inline-block; padding-right: 4px;}

/* 조직도 트리구조 */
.staff-wrap {border: 1px solid #ccc; border-top: 0;}
.staff-wrap.border {border: 1px solid #ccc;}
.staff-th {width: 100%;   background: #ecf5fc; text-align: center; border: 1px solid #ccc; margin-top: 10px;}
.staff-th > div {border-left: 1px solid #ccc; padding: 8px;}
.staff-th > div:first-child {border-left: 0;}
.staff-item {background: #ddd; color: #111; border-bottom: 1px solid #bbb;}
.staff-item .children {display: none;}
.staff-item .staff-item {background: #efefef; color: #111;}
.staff-item .children .staff-item {border-bottom: 0px;}
.staff-item .staff-item .staff-item {background: #fff; border-bottom: 1px solid #ccc; color: #333;}
.staff-item .staff-item .staff-item:last-child {border-bottom: 0;}
.staff-item .staff-item .staff-item-header {padding-left: 30px;}
.staff-item .staff-item .staff-item .staff-item-header {padding-left: 45px;}
.staff-item .staff-item .staff-item .staff-item .staff-item-header {padding-left: 65px; background: #fff;}
.staff-item-header {padding: 10px;}
.staff-item-header.opened {color: #111; border-bottom: 1px dashed #bbb;}
.staff-item-header.opened + .children {display: block;}

/* 경영지원 - 공휴일설정 */
.table-top-box-style {margin-top:8px; display:flex;}
.table-top-box-style .table-top-box-items {display:flex; gap:0 16px; align-items: center;}
.table-top-box-style .table-top-box-items .table-top-box-items-inner {display:flex; gap:0 4px;}
.table-top-box-style .table-top-box-items .table-top-box-items-inner .table-top-box-text {color:#FFAB32;}
.table-top-box-style .right {margin-left:auto;}
.check-group-box-area {padding:8px; margin-top:4px; display:flex; flex-wrap:wrap; gap:8px; background: #f7f7f7; border: 1px solid #ddd;}
.check-group-box-area .check-group-item {position:relative;}
.check-group-box-area .check-group-item input {width:100%; height:100%; position:absolute; left:0; top:0; appearance: none; cursor:pointer;}
.check-group-box-area .check-group-item input + label {padding:4px 6px; background-color:#fff; color:#000; border:1px solid #ddd; border-radius:4px;}
.check-group-box-area .check-group-item input:checked + label {color: #fff; background-color: #2489e1; border-color:#2489e1;}

/* 파일보기 */
.common-popup-head-area {padding:16px; position:relative; border-bottom:1px solid #ddd; background-color:#999;}
.common-popup-head-area .common-popup-title {position:absolute; left:16px; top:50%; transform:translateY(-50%); font-size:12px; color:#fff;}
.common-popup-head-area .common-popup-group-name {text-align: center; color:#10528c; font-size:14px; font-weight:600; color:#fff;}
.common-popup-head-area .common-popup-right {display:flex; align-items: center; position:absolute; right:8px; top:50%; transform:translateY(-50%);}
.common-popup-head-area .common-popup-right .swiper-paging {margin-right:16px; color:#fff;}
.common-popup-head-area .common-popup-right .swiper-paging .swiper-pagination-current {font-weight:600; font-size:13px; color:#fff;}
.common-popup-head-area .common-popup-right .swiper-paging .swiper-pagination-total {font-size:13px; color:#fff;}
.common-popup-head-area .common-popup-right .btn-popup-total-download,
.common-popup-head-area .common-popup-right .btn-popup-close {padding:8px; color:#fff;}

.common-popup-body {display:block;}
.common-popup-body .preview-image-area {margin:16px 48px; border:1px solid #ddd;}
.common-popup-body .preview-image-area .preview-image {padding:16px 0; display:flex; align-items: center; justify-content: center; object-fit:cover;}
.common-popup-body .preview-image-area .preview-image img {max-width:100%; height:380px}
.common-popup-body .image-preview-swiper {height:490px;}
.common-popup-body .image-preview-swiper .swiper-button-next.swiper-button-disabled,
.common-popup-body .image-preview-swiper .swiper-button-prev.swiper-button-disabled {display:none}
.common-popup-body .image-preview-swiper .swiper-button-next:after,
.common-popup-body .image-preview-swiper .swiper-button-prev:after {font-size:20px;}

.upload-file-detail-box {padding:16px; position:relative; text-align: center; border-top:1px solid #ddd}
.upload-file-detail-box .upload-file-name {padding-right:32px; white-space: nowrap; text-overflow: ellipsis; overflow:hidden;}
.upload-file-detail-box .upload-file-download {position:absolute; right:16px; top:50%; transform:translateY(-50%);}

.preview-not-support {min-height:412px; display:flex; align-items: center; justify-content: center; flex-direction: column; gap:8px 0;}
.preview-not-support .preview-icon {width:58px; height:56px; display:block;}
.preview-not-support .preview-text {color:#FFAB32;}

.common-btn-group {padding:16px; }

.approval-setting-area {width:100%; height:672px; display:flex; gap:0 16px;}
.approval-setting-area .approval-setting-left {min-width:0; width:300px;}
.approval-setting-area .approval-setting-right {min-width:0; flex:7;}

.approval-setting-right {}
.approval-setting-right .approval-line-item {display:flex; gap:0 16px;}
.approval-setting-right .approval-line-item .approval-setting-btns {min-width:75px; display:flex; flex-direction: column; gap:8px 0; align-self: center; flex:1;}
.approval-setting-right .approval-line-item .approval-setting-btns .btn {padding:3px 4px 3px 12px; display:flex; align-items: center; justify-content: space-between;}
.approval-setting-right .approval-line-item .approval-setting-btns .btn .material-symbols-outlined {font-size:12px;}
.approval-setting-right .approval-line-item .approval-table-area {flex:9;}
.approval-setting-right .approval-line-item .approval-table-area .title-wrap {display:flex; justify-content: space-between;}
.approval-setting-right .approval-line-item .approval-table-area .title-wrap .btn-group {width:auto;}
.approval-setting-right .approval-line-item .approval-table-area:has(.approval-table-wrap.table-drag-group) {border:1px solid #ccc;}
.approval-setting-right .approval-line-item .approval-table-area .approval-drag-inner {padding:8px 20px 8px 8px;}
.approval-setting-right .approval-line-item .approval-table-area .approval-table-wrap.type-disabled .approval-drag-inner {position:relative;}
.approval-setting-right .approval-line-item .approval-table-area .approval-table-wrap.type-disabled .approval-drag-inner::after {content: ''; width:100%; height:100%; display: block; position: absolute; left:0; top:0; background-color: rgba(239, 239, 239, 0.5); z-index: 1;}
.approval-setting-right .approval-line-item .approval-table-area .approval-table-wrap#base-line-container.type-disabled .table-border {position:relative;}
.approval-setting-right .approval-line-item .approval-table-area .approval-table-wrap#base-line-container.type-disabled .table-border::after {content: ''; width:100%; height:100%; display: block; position: absolute; left:0; top:0; background-color: rgba(239, 239, 239, 0.5); z-index: 1;}
.approval-setting-right .approval-line-item .approval-table-area .approval-table-wrap#base-line-container .approval-drag-inner {position:static;}
.approval-setting-right .approval-line-item .approval-table-area .approval-table-wrap#base-line-container .approval-drag-inner::after {display:none;}
.approval-setting-right .approval-line-item .approval-table-area .approval-table-wrap.table-drag-group {margin:0 -1px;}
.approval-setting-right .approval-line-item .approval-table-area .approval-table-wrap.table-drag-group tr td {min-height:64px;}
.approval-setting-right .approval-line-item .approval-table-area .approval-table-wrap.table-drag-group tr td.align-c:hover {cursor:move;}
.approval-setting-right .approval-line-item .approval-table-area .approval-table-wrap tr .btn-line-del {display:none;}
.approval-setting-right .approval-line-item .approval-table-area .approval-table-wrap tr:hover .btn-line-del {display:flex;}
.approval-setting-right .approval-line-item .approval-table-area .approval-table-wrap tr {position:relative;}
.approval-setting-right .approval-line-item tr:has(#finance-sortable .approval-drag-inner:empty) .btn-line-del,
.approval-setting-right .approval-line-item tr:has(#reception-sortable .approval-drag-inner:empty) .btn-line-del,
.approval-setting-right .approval-line-item tr:has(#reference-sortable .approval-drag-inner:empty) .btn-line-del,
.approval-setting-right .approval-line-item tr:has(#finance-sortable .approval-drag-inner:not(:empty)) .btn-line-del,
.approval-setting-right .approval-line-item tr:has(#reception-sortable .approval-drag-inner:not(:empty)) .btn-line-del,
.approval-setting-right .approval-line-item tr:has(#reference-sortable .approval-drag-inner:not(:empty)) .btn-line-del,
.approval-setting-right .approval-line-item .approval-table-wrap.type-disabled tr:has(#finance-sortable .approval-drag-inner:not(:empty)) .btn-line-del,
.approval-setting-right .approval-line-item .approval-table-wrap.type-disabled tr:has(#reception-sortable .approval-drag-inner:not(:empty)) .btn-line-del,
.approval-setting-right .approval-line-item .approval-table-wrap.type-disabled tr:has(#reference-sortable .approval-drag-inner:not(:empty)) .btn-line-del {display:none;}
.approval-setting-right .approval-line-item tr:has(#finance-sortable .approval-drag-inner:not(:empty)):hover .btn-line-del,
.approval-setting-right .approval-line-item tr:has(#reception-sortable .approval-drag-inner:not(:empty)):hover .btn-line-del,
.approval-setting-right .approval-line-item tr:has(#reference-sortable .approval-drag-inner:not(:empty)):hover .btn-line-del {display:flex;}
.approval-setting-right .approval-line-item.type-custom .approval-setting-btns .btn {transform:translateY(20px)}
.approval-setting-right .approval-line-item #finance-sortable .approval-drag-area,
.approval-setting-right .approval-line-item #reception-sortable .approval-drag-area,
.approval-setting-right .approval-line-item #reference-sortable .approval-drag-area {max-height:68px; overflow-y:auto; overflow-x:hidden;}
.approval-setting-right .approval-line-item #finance-sortable,
.approval-setting-right .approval-line-item #reception-sortable,
.approval-setting-right .approval-line-item #reference-sortable {height:68px; padding:0;}
.approval-setting-right #three-line-container td:nth-child(3) {padding:0;}

.common-circle-number {width:20px; height:20px; display:inline-flex; align-items: center; justify-content: center; background-color:#bec2c5; border-radius:50%; color:#fff;}

.approval-table-wrap.table-overflow-y {overflow-y:auto;}

.btn-item-group {display:flex; justify-content: center;}
.btn-item-group .btn-item {position:relative; margin-right:-1px;}
.btn-item-group .btn-item input {width:100%; height:100%; margin:0; padding:0; appearance: none; position:absolute; left:0; top:0; cursor:pointer;}
.btn-item-group .btn-item input + label {padding:2px 5px; border:1px solid #a3a3a3; color:#a3a3a3; background-color:#fff;}
.btn-item-group .btn-item input:checked + label {position:relative; border-color:#000; color:#fff; z-index:1; font-weight:600; background-color:#000;}
.btn-item-group .btn-item:first-child input + label {border-radius:4px 0 0 4px;}
.btn-item-group .btn-item:last-child input + label {border-radius:0 4px 4px 0;}

.approval-drag-area .approval-drag-inner {min-height:68px;  display:flex; gap:8px; flex-wrap:wrap;}
.approval-drag-area .approval-drag-item {width:fit-content; padding:5px 8px; position:relative; border:1px solid #ccc; background-color:#f5f5f5;}
.approval-drag-area .approval-drag-item:hover {cursor:move;}
.approval-drag-area .approval-drag-item .approval-name {font-weight:600; font-size:14px;}
.approval-drag-area .approval-drag-item .approval-org {opacity:0.6}
.approval-drag-area .approval-drag-item .btn-drag-item-del {display:none}
.approval-drag-area .approval-drag-item:hover .btn-drag-item-del {display:flex;}


.btn-line-del,
.btn-drag-item-del {width:18px; height:18px; display:flex; align-items: center; justify-content: center; position:absolute; right:5px; top:5px; border-radius:50%; background-color:#fff; border:1px solid #ddd; z-index:1}
.btn-line-del .material-symbols-outlined,
.btn-drag-item-del .material-symbols-outlined {font-size:12px;}

.common-btn-circle {width: 18px; min-width:18px; height: 18px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background-color: #fff; border: 1px solid #ddd;}
.common-btn-circle .material-symbols-outlined {font-size:12px;}

.content-wrap.type-fileupload {}
.content-wrap.type-fileupload .checklist-comment {padding-bottom:8px; display:flex; justify-content: space-between; border-bottom:0;}
.content-wrap.type-fileupload .checklist-comment .group_info_div {display:flex; align-items: center; gap:0 16px;}
.content-wrap.type-fileupload .checklist-comment .group_info_div > span {display:flex; align-items: center; gap:0 4px;}
.content-wrap.type-fileupload .checklist-comment .group_info_div > span .con-info {width:160px !important; left:auto !important; right:0; top:20px !important; word-break: break-all !important;}
.content-wrap.type-fileupload .table-border + .checklist-comment {padding-top:10px; margin-top:16px; border-top:1px solid #ccc;}

.content-wrap.type-fileupload .fileupload-th-area {padding:16px; text-align:right;}
.content-wrap.type-fileupload .fileupload-th-area .btn-group .right {display:flex; gap:0 4px;}
.content-wrap.type-fileupload .fileupload-th-area .btn-group .right button {flex:1;}

.content-wrap.type-fileupload .img-view6 {width:100%; height:100%; display:flex; align-items: center; justify-content: center;}
.content-wrap.type-fileupload .fileupload-drag-area {width:100%; height:100%;}
.content-wrap.type-fileupload .fileupload-drag-area .drag_tap {width:100%; height:100%; display:flex; align-items: center; justify-content: center;}

.content-wrap.type-fileupload .attachfile-item-outer {padding:5px 0;}
.content-wrap.type-fileupload .attachfile-item-outer .file-attach-item {padding:5px 10px; gap:0 8px;}
.content-wrap.type-fileupload .attachfile-item-outer .file-attach-item > button {margin-left:4px;}
.content-wrap.type-fileupload .attachfile-item-outer .file-attach-item + .file-attach-item {}
.content-wrap.type-fileupload .attachfile-item-outer .file-attach-item .file-attach-item-inner {display:flex; align-items: center; gap:0 8px;}
.content-wrap.type-fileupload .attachfile-item-outer .file-attach-item .file-attach-item-inner img {width:18px; height:18px; margin-top:0;}
.content-wrap.type-fileupload .attachfile-item-outer .file-attach-item .file-attach-item-inner .fileName {word-break:break-all;}
.content-wrap.type-fileupload .attachfile-item-outer .file-attach-item .file-attach-item-inner .fileSize {min-width:fit-content}
.content-wrap.type-fileupload .attachfile-item-outer .file-attach-item .fileupload-form-area {margin-left:auto; min-width:fit-content}

body:has(.schedule-top-section) .ui-datepicker {transform: translateY(30px);}
.schedule-top-section {width:fit-content; margin:0 auto; position:relative; display:flex; justify-content: center;}
.schedule-top-section .schedule-top-inner {display:flex; justify-content: center; align-items: center; gap:0 16px;}
.schedule-top-section .schedule-top-inner button {width:28px; height:28px; padding:5px; display:flex; align-items: center; justify-content: center; border-radius:50%;}
.schedule-top-section .schedule-top-inner button .material-symbols-outlined {font-size:16px;}
.schedule-top-section .schedule-top-inner .schedule-date-box {min-width:fit-content; font-size:20px;}
.schedule-top-section .schedule-top-inner .schedule-date-box.type-flex {display:flex; gap:0 8px;}
.schedule-top-section .schedule-top-inner .schedule-date-box.type-flex select.form-control {width:auto;}
.schedule-top-section .schedule-top-inner .input-group {}
.schedule-top-section .schedule-top-inner .input-group input {display:none;}
.schedule-top-section .schedule-top-inner .input-group button {border-radius:4px;}
.schedule-top-section .schedule-top-inner .input-group button .material-iconsdate_range {margin-top:0;}
.schedule-top-section .schedule-btn-group {width:max-content; display:flex; gap:0 8px; position:absolute; left:calc(100% + 24px); top:50%; transform:translateY(-50%);}
.schedule-top-wrapper {margin-bottom:10px; margin-top:10px; position:relative;}
.schedule-top-wrapper .schedule-top-section {}

.approval-sign-area {margin-top:10px; display:flex;}
.approval-sign-area .approval-sign-title {width:90px; padding:10px; display:flex; align-items: center; justify-content: center; background-color:#efefef; border:1px solid #ccc;}
.approval-sign-area .approval-sign-list-area {flex:1; border-width:0 0 1px 0; border-style:solid; border-color:#ccc;}
.approval-sign-area .approval-sign-list-area .approval-sign-list {}
.approval-sign-area .approval-sign-list-area .approval-sign-list {display:flex; flex-wrap:wrap;}
.approval-sign-area .approval-sign-list-area .approval-sign-list li {width:10%; text-align: center; border-right:1px solid #ccc;}
.approval-sign-area .approval-sign-list-area .approval-sign-list li .item-cell {min-height:32px; display:flex; align-items: center; justify-content: center; border-top:1px solid #ccc;}
.approval-sign-area .approval-sign-list-area .approval-sign-list li .item-cell .apprMem  {text-overflow: ellipsis; white-space: nowrap; overflow: hidden; padding: 0px 5px; cursor: pointer; position:relative; }
.approval-sign-area .approval-sign-list-area .approval-sign-list li .item-cell.type-sign {min-height:100px;}
.approval-sign-area .approval-sign-list-area .approval-sign-list li .item-cell .btn-link {color:#000;}

.flex-box .flex-box-item .approval-sign-area .approval-sign-list-area .approval-sign-list li {width:20%}

.signature-box {width:98px; height:98px; display:flex; justify-content: center; align-items: center; position:relative;}
.signature-box::before {width:58px; height:58px; display:flex; align-items: center; justify-content: center; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) rotate(-25deg); border-width:2px; border-style:solid; border-radius:50%; box-shadow: 2px 2px 10px rgba(0,0,0, 1); font-size: 20px; font-weight:600;}
.signature-box.type-approve::before {content:'승인'; border-color:#18a0dd; color:#18a0dd;}
.signature-box.type-reject::before {content:'반려'; border-color:#ff2600; color:#ff2600;}
.signature-box.type-cancel::before {content:'취소'; border-color:#ff2600; color:#ff2600;}
.signature-box.type-retrieve::before {content:'회수'; border-color:#ff2600; color:#ff2600;}
.signature-box.type-end::before {content:'종결'; border-color:#ff2600; color:#ff2600;}
.signature-box .signature-img {width:70px; height:50px; object-fit: contain;}
.ref-add {width: 20px; height: 20px; display:flex; justify-content: center; align-items: center; position:absolute;right: 2px; top: calc(50% - 10px)}
.ref-add::before {content: '+'; border-color: #cecbcb; color:#7c7c7c; background-color: #ffffff; width: 20px; height: 20px; display:flex; align-items: center; justify-content: center; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); border-width:2px; border-style:solid; border-radius:50%; font-size: 15px;}

.apprLine-add {width: 20px; height: 20px; display:flex; justify-content: center; align-items: center; position:absolute;right: 2px; top: calc(50% - 10px)}
.apprLine-add::before {content: '+'; border-color: #cecbcb; color:#7c7c7c; background-color: #ffffff; width: 20px; height: 20px; display:flex; align-items: center; justify-content: center; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); border-width:2px; border-style:solid; border-radius:50%; font-size: 15px;}

.reference-box {display:flex; margin-top:-1px; min-height: 36px;}
.reference-box .reference-title {width:90px; display:flex; align-items: center; justify-content: center; background-color:#efefef; border:1px solid #ccc;}
.reference-box .reference-list {padding:8px; display:flex; gap:8px; flex:1; border-width:1px 1px 1px 0; border-style:solid; border-color:#ccc;}
.reference-box .reference-list .btn-link {color:#000;}

.approval-detail-desc {margin-top:10px; padding:8px; border:1px solid #ccc;}

.upload-file-box-area {display:flex; justify-content: space-between; margin-bottom:8px;}

.doc-file-upload-list {}
.doc-file-upload-list li {}
.doc-file-upload-list li + li {margin-top:4px;}
.doc-file-upload-list li a {color:#000;}
.doc-file-upload-list li a:hover {text-decoration: underline;}

.schedule-aside-info {display:flex; gap:0 8px; position:absolute; right:0; top:50%; transform:translateY(-50%)}
i.color-box {width:20px; height:20px; display:block;}
.bg-mint {background-color:#ddf6e7;}
.bg-yellow {background: #f9f3e2 !important;}

.common-tab-container {display:flex; align-items: center; border:1px solid #ccc;}
.common-tab-container .tab-title {min-width:fit-content; padding:8px 12px; background-color:#f7f7f7; border-right:1px solid #ccc;}
.common-tab-container .tab-items {width:100%; display:flex;}
.common-tab-container .tab-items button {padding:8px; flex:1; position:relative;}
.common-tab-container .tab-items button::before {content:''; width:1px; height:100%; display:block; position:absolute; left:0; top:0; background-color:#ccc;}
.common-tab-container .tab-items button:first-child::before {display:none;}
.common-tab-container .tab-items button:hover {background-color: rgba(247,247,247,0.5);}
.common-tab-container .tab-items button:disabled {cursor:not-allowed; opacity:0.6; border:0 !important; background-color:#f7f7f7 !important;}
.common-tab-container .tab-items button .material-symbols-outlined {font-size:16px;}

.common-list-type-01 {padding:6px;}
.common-list-type-01 li {position:relative; padding-left:10px; word-break: keep-all;}
.common-list-type-01 li + li {margin-top:4px;}
.common-list-type-01 li::before {content:''; width:3px; height:3px; display:block; position:absolute; left:0; top:8px; background-color:#000; border-radius:50%;}
.common-list-type-01.type-both {display:flex; gap:6px 16px; flex-wrap:wrap;}
.common-list-type-01.type-both li {width: calc(50% - 8px);}
.common-list-type-01.type-both li + li {margin-top:0;}

.mfp-container:has(.popup-wrap.bookmarkWarp) {width:70%;}

.back-red {background-color: #ff0000}
.back-red:hover {background-color: #d91111}



/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance:none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance:textfield;
}