@charset "UTF-8";
:root {
  --font-system: "Pretendard", "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --text: #8a8a8a;
  --line: #dddddd;
  --bg: #DEE4F0;
  /* color */
  --black: #000000;
  --white: #ffffff;
  --cyan30: #00C3CC;
  --blue10: #4fa7f5;
  --blue30: #1C89E9;
  --green10: #44e188;
  --green30: #00BD52;
  --yellow30: #FFB300;
  --red10: #ef7b75;
  --red30: #F2473D;
  --pink30: #F81AE9;
  --navy30: #00337B;
  --gray99: #F7F7F8;
  --gray90: #F7FBFB;
  --gray80: #F2F6F6;
  --gray70: #E9EDED;
  --gray60: #DEE2E2;
  --gray50: #BCC0C0;
  --gray40: #9DA1A1;
  --gray30: #747777;
  --gray20: #606363;
  --gray10: #414444;
  --gray5: #202323;
  /* sizing */
  --basicSize: 4px;
  /* border-radius */
  --brS: 6px;
  --brR: 99px;
  --brM: 8px;
  --brL: 12px;
}

/* font-face */
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/fonts-archive/Pretendard/Pretendard-Thin.woff") format("woff");
  font-weight: 100;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/fonts-archive/Pretendard/Pretendard-ExtraLight.woff") format("woff");
  font-weight: 200;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/fonts-archive/Pretendard/Pretendard-Light.woff") format("woff");
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/fonts-archive/Pretendard/Pretendard-Regular.woff") format("woff");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/fonts-archive/Pretendard/Pretendard-Medium.woff") format("woff");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/fonts-archive/Pretendard/Pretendard-SemiBold.woff") format("woff");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/fonts-archive/Pretendard/Pretendard-Bold.woff") format("woff");
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/fonts-archive/Pretendard/Pretendard-ExtraBold.woff") format("woff");
  font-weight: 800;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/fonts-archive/Pretendard/Pretendard-Black.woff") format("woff");
  font-weight: 900;
  font-display: swap;
}
/* 1. 박스 모델을 border-box로 통일하여 레이아웃 계산을 쉽게 만듭니다. */
html {
  box-sizing: border-box;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* 2. html, body에 기본 폰트와 행간, 브라우저 스크롤 바를 설정합니다. */
html,
body {
  width: 100%;
  height: 100%;
  font-family: var(--font-system);
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
}

/* 3. 이미지와 비디오가 컨테이너를 벗어나지 않도록 설정합니다. */
img,
video {
  max-width: 100%;
  height: auto;
}

/* 4. HTML5 블록 요소들을 일관성 있게 표시합니다. */
article,
aside,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section {
  display: block;
}

/* 5. 텍스트 관련 요소 초기화 */
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var {
  margin: 0;
  padding: 0;
  font-style: normal;
  font-weight: normal;
}

/* 6. 리스트 스타일 초기화 */
ul,
ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 7. 테이블 스타일 초기화 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}

/* 8. 폼 요소 초기화 */
button,
input,
select,
textarea {
  border: none;
  background: transparent;
  padding: 0;
  margin: 0;
  font-size: 100%;
  box-sizing: border-box;
}

button {
  cursor: pointer;
}

/* 9. 링크 기본 스타일 제거 */
a {
  text-decoration: none;
  color: inherit;
}

caption,
legend {
  position: absolute;
  top: -9999px;
  left: -9999px;
  width: 0px;
  height: 0px;
  font-size: 0px;
  line-height: 0;
  overflow: hidden;
}

input, textarea {
  opacity: 1;
  -webkit-text-fill-color: inherit;
}

input, textarea, select {
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  color: var(--gray5);
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  line-height: normal;
  -webkit-appearance: none;
  appearance: none;
  outline: none;
}

textarea, select {
  outline: none;
}

select::-ms-expand {
  display: none;
}

select:disabled {
  pointer-events: none;
}

input,
textarea {
  opacity: 1;
  -webkit-text-fill-color: inherit;
}

input,
textarea,
select {
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  color: var(--gray5);
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  line-height: normal;
  -webkit-appearance: none;
  appearance: none;
  outline: none;
}

textarea,
select {
  outline: none;
}

select::-ms-expand {
  display: none;
}

select:disabled {
  pointer-events: none;
}

.hidden {
  display: none;
}

.center {
  text-align: center;
}

.left {
  text-align: left;
}

.right {
  text-align: right;
}

/* Typography */
h1 {
  font-size: 48px;
  font-weight: 800;
  line-height: 56px;
  color: var(--gray5);
}

h2 {
  font-size: 32px;
  font-weight: 600;
  line-height: 38px;
  color: var(--gray5);
}

h3 {
  font-size: 32px;
  font-weight: 500;
  line-height: 38px;
  color: var(--gray5);
}

h4 {
  font-size: 24px;
  font-weight: 600;
  line-height: 28px;
  color: var(--gray5);
}

h5 {
  font-size: 20px;
  font-weight: 600;
  line-height: 26px;
  color: var(--gray5);
}

.sh1 {
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  color: var(--gray5);
}

.sh2 {
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
  color: var(--gray5);
}

.sh3 {
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
  color: var(--gray5);
}

.sh4 {
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  color: var(--gray5);
}

.bdy1 {
  font-size: 16px;
  font-weight: 500;
  line-height: 22px;
  color: var(--gray5);
}

.bdy2 {
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  color: var(--gray5);
}

.bdy3 {
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: var(--gray5);
}

.bdy4 {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: var(--gray5);
}

.bdy5 {
  font-size: 13px;
  font-weight: 600;
  line-height: 15px;
  color: var(--gray5);
}

.bdy6 {
  font-size: 13px;
  font-weight: 500;
  line-height: 15px;
  color: var(--gray5);
}

.bdy7 {
  font-size: 13px;
  font-weight: 400;
  line-height: 15px;
  color: var(--gray5);
}

.caption1 {
  font-size: 12px;
  font-weight: 600;
  line-height: 14px;
  color: var(--gray5);
}

.caption1 {
  font-size: 12px;
  font-weight: 500;
  line-height: 14px;
  color: var(--gray5);
}

.caption1 {
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  color: var(--gray5);
}

/*input*/
.inpBoxGroup {
  display: flex;
  gap: 4px;
}

.inpBox {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: var(--brS);
  border: 1px solid var(--line);
  background-color: #FFFFFF;
  height: 34px;
}

.inpBox.flex-1 {
  flex: 1;
}

.inpBox input {
  font-size: 14px;
  line-height: 20px;
  color: var(--black);
  font-weight: 500;
  border: 0;
  outline: none;
  background-color: transparent;
  width: 100%;
  height: 100%;
}

.inpBox:focus-within {
  border-color: var(--navy30);
}

.inpBox input:invalid {
  border-color: var(--red50);
}

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

/*disabled 처리*/
.inpBox:has(:disabled),
.inpBox:has(.readonly) {
  background-color: var(--gray80);
  border: 0;
}

.inpBox:has(:disabled) input,
.inpBox:has(.readonly) input {
  color: var(--gray50);
  pointer-events: none;
}

.inpBox:has(.readonly) .ui-datepicker-trigger {
  pointer-events: none;
}

/*검색*/
.inpBox.inpSearch {
  position: relative;
  padding-right: 68px;
}

.inpBox.inpSearch button.ic_search {
  position: absolute;
  top: 50%;
  right: 7px;
  cursor: pointer;
  transform: translateY(-50%);
}

.inpBox.inpSearch button.ic_close {
  position: absolute;
  top: 50%;
  right: 35px;
  transform: translateY(-50%);
}

/*달력*/
.inpBox.datePicker {
  position: relative;
  width: 130px;
  padding-right: 40px;
}

.inpBox.datePicker .ui-datepicker-trigger {
  position: absolute;
  top: 3px;
  right: 7px;
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2205_25350)'%3E%3Cpath d='M6 11V15.5C6 16.8785 7.1215 18 8.5 18H15.5C16.8785 18 18 16.8785 18 15.5V11H6ZM13.5 15H10.5C10.224 15 10 14.776 10 14.5C10 14.224 10.224 14 10.5 14H13.5C13.776 14 14 14.224 14 14.5C14 14.776 13.776 15 13.5 15ZM6 10V9.5C6 8.1215 7.1215 7 8.5 7H9V6.5C9 6.224 9.224 6 9.5 6C9.776 6 10 6.224 10 6.5V7H14V6.5C14 6.224 14.224 6 14.5 6C14.776 6 15 6.224 15 6.5V7H15.5C16.8785 7 18 8.1215 18 9.5V10H6Z' fill='%2396A6AE'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_2205_25350'%3E%3Crect width='12' height='12' fill='white' transform='translate(6 6)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-size: 24px;
}

/* 기본 셀렉트 */
.selectBox {
  position: relative;
  display: inline-flex;
  align-items: center;
  border-radius: 6px;
  border: 1px solid var(--line);
  background-color: #FFFFFF;
}

.selectBox::after {
  content: "";
  width: 24px;
  height: 24px;
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  background-size: 24px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 10L11.2929 13.2929C11.6834 13.6834 12.3166 13.6834 12.7071 13.2929L16 10' stroke='%2396A6AE' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  pointer-events: none;
}

#int_no {
  font-size: 14px;
  line-height: 24px;
  padding: 4px 28px 4px 8px;
  color: var(--black);
  font-weight: 500;
  border: 0;
  border-radius: 6px;
  outline: none;
  background-color: white;
}
.selectBox select {
  font-size: 14px;
  line-height: 24px;
  padding: 4px 28px 4px 8px;
  color: var(--black);
  font-weight: 500;
  border: 0;
  outline: none;
  background-color: transparent;
  width: 100%;
}

.selectBox:focus-within {
  border-color: var(--navy30);
}

.selectBox:focus-within::after {
  transform: translateY(-50%) rotate(180deg);
}

/*disabled 처리*/
.selectBox:has(:disabled) {
  background-color: var(--gray80);
  border: 0;
}

.selectBox:has(:disabled) select {
  color: var(--gray50);
}

/* 텍스트박스 */
.textArea {
  width: 100%;
}

.textArea textarea {
  width: 100%;
  height: 100%;
  min-height: 68px;
  background-color: white;
  border: 1px solid var(--gray70);
  border-radius: 8px;
  padding: 6px 12px;
  font-size: 14px;
  color: var(--gray5);
  resize: none;
}

.textArea textarea:focus-within {
  border-color: var(--gray-1);
}

.textArea textarea:disabled {
  border-color: var(--gray80);
  color: var(--gray50);
  background-color: var(--gray80);
}

.textArea.invalid textarea {
  border-color: var(--red50);
}

/*radio*/
.radCKArea {
  display: flex;
  column-gap: 16px !important;
}

.radioTy1 {
  display: flex;
  align-items: center;
}

.radioTy1 input {
  display: none;
}

.radioTy1 label {
  position: relative;
  display: inline-flex;
  gap: 8px;
  cursor: pointer;
  height: 16px;
  line-height: 16px;
}

.radioTy1 label::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1px solid var(--gray60);
  background-color: var(--white);
  box-sizing: border-box;
}

.radioTy1 input:disabled + label::before {
  background-color: var(--gray70);
}

.radioTy1 input:checked + label::before {
  border-color: var(--navy30);
  background-color: var(--navy30);
  box-sizing: border-box;
}

.radioTy1 input:checked + label::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: 4px;
  left: 4px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--white);
}

.radioTy1 input:checked:disabled + label::before {
  border-color: var(--gray70);
  background-color: var(--gray70);
}

.radioTy1 input:checked:disabled + label::after {
  background-color: var(--gray80);
}

.radioTy2 {
  display: flex;
  align-items: center;
}

.radioTy2 input {
  display: none;
}

.radioTy2 label {
  display: inline-flex;
  gap: 8px;
  cursor: pointer;
  height: 24px;
  line-height: 24px;
  padding-left: 32px;
  background-image: url("../images/common/ic_radio2_off.png");
  background-size: 24px 24px;
  background-repeat: no-repeat;
}

.radioTy2 input:checked + label {
  background-image: url("../images/common/ic_radio2_on.png");
}

/*checkbox*/
.checkbox {
  display: inline-flex;
  align-items: center;
}

.checkbox input {
  display: none;
}

.checkbox label {
  display: inline-flex;
  gap: 8px;
  cursor: pointer;
  height: 16px;
  line-height: 16px;
  font-size: 14px;
}

.checkbox label::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  border-radius: 4px;
  border: 1px solid var(--gray60);
  box-sizing: border-box;
}

.checkbox input:disabled + label::before {
  background-color: var(--gray70);
}

.checkbox input:checked + label::before {
  border-color: var(--navy30);
  background-color: var(--navy30);
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 4C0 1.79086 1.79086 0 4 0H12C14.2091 0 16 1.79086 16 4V12C16 14.2091 14.2091 16 12 16H4C1.79086 16 0 14.2091 0 12V4Z' fill='%2300337B'/%3E%3Cpath d='M4 8L6.0414 10.1872C6.44674 10.6215 7.13908 10.6088 7.52815 10.1598L12 5' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  background-position: -1px -1px;
}

.checkbox input:checked:disabled + label::before {
  border-color: var(--gray70);
  background-color: var(--gray70);
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 4C0 1.79086 1.79086 0 4 0H12C14.2091 0 16 1.79086 16 4V12C16 14.2091 14.2091 16 12 16H4C1.79086 16 0 14.2091 0 12V4Z' fill='%23DBE0E3'/%3E%3Cpath d='M4 8L6.0414 10.1872C6.44674 10.6215 7.13908 10.6088 7.52815 10.1598L12 5' stroke='%23C4CDD2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

/*이미지 체크박스 용도 */
.checkboxTy2 {
  display: inline-flex;
}

.checkboxTy2 input {
  display: none;
}

.checkboxTy2 label {
  display: inline-flex;
  width: 24px;
  height: 24px;
  line-height: 24px;
  background-size: 24px 24px;
  background-repeat: no-repeat;
  overflow: hidden;
  text-indent: 9999px;
}

.checkboxTy2 input:checked + label {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 8.0011L7.19766 11L12 5' stroke='%233D7ADC' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

/*파일선택*/
.fileInpBox {
  display: flex;
}

.fileInpBox .fileTxt {
  padding: 5px 12px;
  line-height: 20px;
  border-radius: 8px;
  border: 1px solid var(--gray70);
  background-color: #FFFFFF;
  width: calc(100% - 84px);
}

.fileInpBox .fileInp {
  display: none;
}

.fileInpBox .fileInpLabel {
  width: 80px;
  margin-right: 4px;
  height: 24px;
  line-height: 24px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 400;
  color: var(--black);
  background-color: var(--gray70);
}

/*버튼*/
.btnArea {
  display: flex;
  justify-content: flex-end;
  gap: 4px;
  margin-top: 16px;
}

.btn {
  min-width: 60px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  background-color: var(--white);
  border-radius: 6px;
  padding: 0 12px;
  white-space: nowrap;
  cursor: pointer;
}

.btn:disabled,
.btn.disabled {
  pointer-events: none;
}

/* size */
.btn.large {
  height: 36px;
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
}

.btn.medium {
  height: 33px;
  font-size: 14px;
  font-weight: 500;
  line-height: 18px;
}

.btn.small {
  height: 24px;
  font-size: 13px;
  font-weight: 500;
  line-height: 14px;
}

.btn.xsmall {
  height: 18px;
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  border-radius: 4px;
}

.btn.block {
  width: 100%;
}

/* color */
.btn {
  background-color: var(--white);
  color: var(--gray5);
}

.btn:hover {
  filter: opacity(0.8);
}

.btn:disabled {
  color: var(--gray50) !important;
  background-color: var(--gray70) !important;
}

.btn.primary {
  background-color: var(--navy30);
  color: var(--white);
}

.btn.blue {
  background-color: var(--navy30);
  color: var(--white);
}

.btn.red {
  background-color: var(--red80);
  color: var(--red30);
}

.btn.line {
  background-color: var(--white);
  color: var(--black);
  border: 1px solid var(--black);
}

.btn .ic::before {
  width: 16px;
  height: 16px;
}

/*아이콘*/
.ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ic::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center center;
}

.ic_back::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 8L10.7071 11.2929C10.3166 11.6834 10.3166 12.3166 10.7071 12.7071L14 16' stroke='%2396A6AE' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ic_check::before {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 8.0011L7.19766 11L12 5' stroke='%233D7ADC' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ic_close::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.28033 7.21967C7.98744 6.92678 7.51256 6.92678 7.21967 7.21967C6.92678 7.51256 6.92678 7.98744 7.21967 8.28033L10.8893 11.95L7.21967 15.6197C6.92678 15.9126 6.92678 16.3874 7.21967 16.6803C7.51256 16.9732 7.98744 16.9732 8.28033 16.6803L11.95 13.0107L15.6197 16.6803C15.9126 16.9732 16.3874 16.9732 16.6803 16.6803C16.9732 16.3874 16.9732 15.9126 16.6803 15.6197L13.0107 11.95L16.6803 8.28033C16.9732 7.98744 16.9732 7.51256 16.6803 7.21967C16.3874 6.92678 15.9126 6.92678 15.6197 7.21967L11.95 10.8893L8.28033 7.21967Z' fill='%2396A6AE'/%3E%3C/svg%3E%0A");
}

.ic_down::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 10L11.2929 13.2929C11.6834 13.6834 12.3166 13.6834 12.7071 13.2929L16 10' stroke='%2396A6AE' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ic_info::before {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='1.5' y='1.5' width='13' height='13' rx='6.5' stroke='%23ADB9C0'/%3E%3Cpath d='M7.23242 12.2129V6.78906H8.4082V12.2129H7.23242ZM7.82031 5.55859C7.36914 5.55859 7 5.2168 7 4.7793C7 4.3418 7.36914 4 7.82031 4C8.27148 4 8.6543 4.3418 8.6543 4.7793C8.6543 5.2168 8.27148 5.55859 7.82031 5.55859Z' fill='%23ADB9C0'/%3E%3C/svg%3E%0A");
}

.ic_next::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 8L13.2929 11.2929C13.6834 11.6834 13.6834 12.3166 13.2929 12.7071L10 16' stroke='%2396A6AE' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ic_print::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2089_5014)'%3E%3Cpath d='M15.5 8C15.5 7.46957 15.2893 6.96086 14.9142 6.58579C14.5391 6.21071 14.0304 6 13.5 6H10.5C9.96957 6 9.46086 6.21071 9.08579 6.58579C8.71071 6.96086 8.5 7.46957 8.5 8V8.5H15.5V8Z' fill='%2396A6AE'/%3E%3Cpath d='M14 13.5H10C9.17157 13.5 8.5 14.1716 8.5 15V16.5C8.5 17.3284 9.17157 18 10 18H14C14.8284 18 15.5 17.3284 15.5 16.5V15C15.5 14.1716 14.8284 13.5 14 13.5Z' fill='%2396A6AE'/%3E%3Cpath d='M15.5 9.5H8.5C7.8372 9.5008 7.20178 9.76444 6.73311 10.2331C6.26444 10.7018 6.00079 11.3372 6 12V14C6.00064 14.4859 6.14285 14.9611 6.40925 15.3674C6.67565 15.7737 7.05468 16.0937 7.5 16.288V15C7.50079 14.3372 7.76444 13.7018 8.23311 13.2331C8.70178 12.7644 9.3372 12.5008 10 12.5H14C14.6628 12.5008 15.2982 12.7644 15.7669 13.2331C16.2356 13.7018 16.4992 14.3372 16.5 15V16.288C16.9453 16.0937 17.3244 15.7737 17.5908 15.3674C17.8571 14.9611 17.9994 14.4859 18 14V12C17.9992 11.3372 17.7356 10.7018 17.2669 10.2331C16.7982 9.76444 16.1628 9.5008 15.5 9.5ZM15 11.5H14C13.8674 11.5 13.7402 11.4473 13.6464 11.3536C13.5527 11.2598 13.5 11.1326 13.5 11C13.5 10.8674 13.5527 10.7402 13.6464 10.6465C13.7402 10.5527 13.8674 10.5 14 10.5H15C15.1326 10.5 15.2598 10.5527 15.3536 10.6465C15.4473 10.7402 15.5 10.8674 15.5 11C15.5 11.1326 15.4473 11.2598 15.3536 11.3536C15.2598 11.4473 15.1326 11.5 15 11.5Z' fill='%2396A6AE'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_2089_5014'%3E%3Crect width='12' height='12' fill='white' transform='translate(6 6)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}

.ic_search::before {
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='13' viewBox='0 0 14 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.143 10.3572C8.74662 10.3572 10.8573 8.2465 10.8573 5.64287C10.8573 3.03925 8.74662 0.928589 6.143 0.928589C3.53937 0.928589 1.42871 3.03925 1.42871 5.64287C1.42871 8.2465 3.53937 10.3572 6.143 10.3572Z' stroke='black' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12.5718 12.0714L9.57178 9.07141' stroke='black' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ic_search_W::before {
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='13' viewBox='0 0 14 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.143 10.3572C8.74662 10.3572 10.8573 8.2465 10.8573 5.64287C10.8573 3.03925 8.74662 0.928589 6.143 0.928589C3.53937 0.928589 1.42871 3.03925 1.42871 5.64287C1.42871 8.2465 3.53937 10.3572 6.143 10.3572Z' stroke='white' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12.5718 12.0714L9.57178 9.07141' stroke='white' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ic_trash::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.79807 5.76112C9.79807 5.39876 10.0918 5.10501 10.4542 5.10501H13.7347C14.0971 5.10501 14.3908 5.39876 14.3908 5.76112C14.3908 6.12348 14.0971 6.41723 13.7347 6.41723H10.4542C10.0918 6.41723 9.79807 6.12348 9.79807 5.76112ZM7.66364 9.13423H6.84623C6.48387 9.13423 6.19012 8.84048 6.19012 8.47813C6.19012 8.11577 6.48387 7.82202 6.84623 7.82202H17.3439C17.7063 7.82202 18 8.11577 18 8.47813C18 8.84048 17.7063 9.13423 17.3439 9.13423H16.5277L15.8419 17.2544C15.7989 17.764 15.3727 18.1557 14.8612 18.1557H12.0957H9.33013C8.81871 18.1557 8.39251 17.764 8.34947 17.2544L7.66364 9.13423Z' fill='%2396A6AE'/%3E%3C/svg%3E%0A");
}

.ic_up::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 14L12.7071 10.7071C12.3166 10.3166 11.6834 10.3166 11.2929 10.7071L8 14' stroke='%2396A6AE' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ic_zoomIn::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.2426 11.25C16.6569 11.25 16.9926 11.5858 16.9926 12C16.9926 12.4142 16.6569 12.75 16.2426 12.75L12.75 12.75V16.2426C12.75 16.6569 12.4142 16.9926 12 16.9926C11.5858 16.9926 11.25 16.6569 11.25 16.2426L11.25 12.75H7.75736C7.34315 12.75 7.00736 12.4142 7.00736 12C7.00736 11.5858 7.34315 11.25 7.75736 11.25H11.25L11.25 7.75736C11.25 7.34315 11.5858 7.00736 12 7.00736C12.4142 7.00736 12.75 7.34315 12.75 7.75736L12.75 11.25L16.2426 11.25Z' fill='%2396A6AE'/%3E%3C/svg%3E%0A");
}

.ic_zoomOut::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.9926 12C16.9926 11.5858 16.6569 11.25 16.2426 11.25L7.75736 11.25C7.34315 11.25 7.00736 11.5858 7.00736 12C7.00736 12.4142 7.34315 12.75 7.75736 12.75L16.2426 12.75C16.6569 12.75 16.9926 12.4142 16.9926 12Z' fill='%2396A6AE'/%3E%3C/svg%3E%0A");
}

.ic_logo::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='1' y='4' width='22' height='16' rx='4' fill='%233D7ADC'/%3E%3Crect x='7' y='8.85718' width='6.28571' height='6.28571' rx='3.14286' fill='%23FEFEFE'/%3E%3Cg style='mix-blend-mode:soft-light'%3E%3Crect x='11.2744' y='8.85718' width='6.28571' height='6.28571' rx='3.14286' fill='%23FEFEFE'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.ic_searchWh::before {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.60291 3.50614C7.42795 4.33117 7.42795 5.66883 6.60291 6.49386C5.77787 7.3189 4.44022 7.3189 3.61518 6.49386C2.79015 5.66883 2.79015 4.33117 3.61518 3.50614C4.44022 2.6811 5.77787 2.6811 6.60291 3.50614ZM8.11837 7.00004C9.05324 5.59666 8.90164 3.68355 7.66357 2.44548C6.25275 1.03465 3.96535 1.03465 2.55452 2.44548C1.1437 3.8563 1.1437 6.1437 2.55452 7.55452C3.77442 8.77442 5.64969 8.93951 7.04697 8.04979C7.05001 8.05294 7.05308 8.05607 7.05619 8.05918L9.58504 10.588C9.87793 10.8809 10.3528 10.8809 10.6457 10.588C10.9386 10.2951 10.9386 9.82026 10.6457 9.52737L8.11837 7.00004Z' fill='white'/%3E%3C/svg%3E%0A");
}

.ic_searchWh:disabled::before {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.60291 3.50614C7.42795 4.33117 7.42795 5.66883 6.60291 6.49386C5.77787 7.3189 4.44022 7.3189 3.61518 6.49386C2.79015 5.66883 2.79015 4.33117 3.61518 3.50614C4.44022 2.6811 5.77787 2.6811 6.60291 3.50614ZM8.11837 7.00004C9.05324 5.59666 8.90164 3.68355 7.66357 2.44548C6.25275 1.03465 3.96535 1.03465 2.55452 2.44548C1.1437 3.8563 1.1437 6.1437 2.55452 7.55452C3.77442 8.77442 5.64969 8.93951 7.04697 8.04979C7.05001 8.05294 7.05308 8.05607 7.05619 8.05918L9.58504 10.588C9.87793 10.8809 10.3528 10.8809 10.6457 10.588C10.9386 10.2951 10.9386 9.82026 10.6457 9.52737L8.11837 7.00004Z' fill='%23C4CDD2'/%3E%3C/svg%3E%0A");
}

.ic_excel::before {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='5.14288' y='1.71428' width='6.85714' height='8.57143' rx='1' fill='white'/%3E%3Crect x='5.14288' y='3.42857' width='2.57143' height='1.02857' rx='0.514286' fill='%23369975'/%3E%3Crect x='8.57141' y='3.42857' width='1.71429' height='1.02857' rx='0.514286' fill='%23369975'/%3E%3Crect x='5.14288' y='5.4857' width='2.57143' height='1.02857' rx='0.514286' fill='%23369975'/%3E%3Crect x='8.57141' y='5.4857' width='1.71429' height='1.02857' rx='0.514286' fill='%23369975'/%3E%3Crect x='5.14288' y='7.54285' width='2.57143' height='1.02857' rx='0.514286' fill='%23369975'/%3E%3Crect x='8.57141' y='7.54285' width='1.71429' height='1.02857' rx='0.514286' fill='%23369975'/%3E%3Cpath d='M0 2.46859C0 2.02211 0.295977 1.62972 0.725279 1.50706L4.72528 0.364206C5.3641 0.181687 6 0.661351 6 1.32573V10.6743C6 11.3386 5.3641 11.8183 4.72528 11.6358L0.725279 10.4929C0.295977 10.3703 0 9.97789 0 9.53141V2.46859Z' fill='%23369975'/%3E%3Cpath d='M3.85717 4.28572L2.14288 7.37144M2.14288 4.62858L3.85717 7.71429' stroke='white' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ic_excel:disabled::before {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='5.14288' y='1.71428' width='6.85714' height='8.57143' rx='1' fill='white'/%3E%3Crect x='5.14288' y='3.42857' width='2.57143' height='1.02857' rx='0.514286' fill='%23C4CDD2'/%3E%3Crect x='8.57141' y='3.42857' width='1.71429' height='1.02857' rx='0.514286' fill='%23C4CDD2'/%3E%3Crect x='5.14288' y='5.4857' width='2.57143' height='1.02857' rx='0.514286' fill='%23C4CDD2'/%3E%3Crect x='8.57141' y='5.4857' width='1.71429' height='1.02857' rx='0.514286' fill='%23C4CDD2'/%3E%3Crect x='5.14288' y='7.54285' width='2.57143' height='1.02857' rx='0.514286' fill='%23C4CDD2'/%3E%3Crect x='8.57141' y='7.54285' width='1.71429' height='1.02857' rx='0.514286' fill='%23C4CDD2'/%3E%3Cpath d='M0 2.46859C0 2.02211 0.295977 1.62972 0.725279 1.50706L4.72528 0.364206C5.3641 0.181687 6 0.661351 6 1.32573V10.6743C6 11.3386 5.3641 11.8183 4.72528 11.6358L0.725279 10.4929C0.295977 10.3703 0 9.97789 0 9.53141V2.46859Z' fill='%23C4CDD2'/%3E%3Cpath d='M3.85717 4.28572L2.14288 7.37144M2.14288 4.62858L3.85717 7.71429' stroke='white' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ic_plus::before {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.75 2C6.75 1.58579 6.41421 1.25 6 1.25C5.58579 1.25 5.25 1.58579 5.25 2V5.25H2C1.58579 5.25 1.25 5.58579 1.25 6C1.25 6.41421 1.58579 6.75 2 6.75H5.25V10C5.25 10.4142 5.58579 10.75 6 10.75C6.41421 10.75 6.75 10.4142 6.75 10V6.75H10C10.4142 6.75 10.75 6.41421 10.75 6C10.75 5.58579 10.4142 5.25 10 5.25H6.75V2Z' fill='white'/%3E%3C/svg%3E%0A");
}

.ic_plus:disabled::before {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.75 2C6.75 1.58579 6.41421 1.25 6 1.25C5.58579 1.25 5.25 1.58579 5.25 2V5.25H2C1.58579 5.25 1.25 5.58579 1.25 6C1.25 6.41421 1.58579 6.75 2 6.75H5.25V10C5.25 10.4142 5.58579 10.75 6 10.75C6.41421 10.75 6.75 10.4142 6.75 10V6.75H10C10.4142 6.75 10.75 6.41421 10.75 6C10.75 5.58579 10.4142 5.25 10 5.25H6.75V2Z' fill='%23C4CDD2'/%3E%3C/svg%3E%0A");
}

.ic_delete::before {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.11309 0.566117C4.11309 0.253459 4.36655 0 4.67921 0H7.50979C7.82245 0 8.07591 0.253459 8.07591 0.566117C8.07591 0.878775 7.82245 1.13223 7.50979 1.13223H4.67921C4.36655 1.13223 4.11309 0.878775 4.11309 0.566117ZM2.27145 3.47659H1.56612C1.25346 3.47659 1 3.22313 1 2.91047C1 2.59781 1.25346 2.34435 1.56612 2.34435H10.624C10.9366 2.34435 11.1901 2.59781 11.1901 2.91047C11.1901 3.22313 10.9366 3.47659 10.624 3.47659H9.91976L9.32801 10.483C9.29087 10.9227 8.92313 11.2607 8.48184 11.2607H6.09561H3.70937C3.26808 11.2607 2.90034 10.9227 2.8632 10.483L2.27145 3.47659Z' fill='%237F929C'/%3E%3C/svg%3E%0A");
}

.ic_delete:disabled::before {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.11309 0.566117C4.11309 0.253459 4.36655 0 4.67921 0H7.50979C7.82245 0 8.07591 0.253459 8.07591 0.566117C8.07591 0.878775 7.82245 1.13223 7.50979 1.13223H4.67921C4.36655 1.13223 4.11309 0.878775 4.11309 0.566117ZM2.27145 3.47659H1.56612C1.25346 3.47659 1 3.22313 1 2.91047C1 2.59781 1.25346 2.34435 1.56612 2.34435H10.624C10.9366 2.34435 11.1901 2.59781 11.1901 2.91047C11.1901 3.22313 10.9366 3.47659 10.624 3.47659H9.91976L9.32801 10.483C9.29087 10.9227 8.92313 11.2607 8.48184 11.2607H6.09561H3.70937C3.26808 11.2607 2.90034 10.9227 2.8632 10.483L2.27145 3.47659Z' fill='%23C4CDD2'/%3E%3C/svg%3E%0A");
}

.ic_date::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2205_25350)'%3E%3Cpath d='M6 11V15.5C6 16.8785 7.1215 18 8.5 18H15.5C16.8785 18 18 16.8785 18 15.5V11H6ZM13.5 15H10.5C10.224 15 10 14.776 10 14.5C10 14.224 10.224 14 10.5 14H13.5C13.776 14 14 14.224 14 14.5C14 14.776 13.776 15 13.5 15ZM6 10V9.5C6 8.1215 7.1215 7 8.5 7H9V6.5C9 6.224 9.224 6 9.5 6C9.776 6 10 6.224 10 6.5V7H14V6.5C14 6.224 14.224 6 14.5 6C14.776 6 15 6.224 15 6.5V7H15.5C16.8785 7 18 8.1215 18 9.5V10H6Z' fill='%2396A6AE'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_2205_25350'%3E%3Crect width='12' height='12' fill='white' transform='translate(6 6)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}

.ic_logout::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 6.5V11.1538' stroke='%231E1E1E' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M15.3846 7.66473C16.2873 8.36951 16.9475 9.3385 17.2731 10.4365C17.5987 11.5345 17.5733 12.7068 17.2007 13.7897C16.828 14.8726 16.1266 15.8122 15.1943 16.4773C14.2619 17.1425 13.1453 17.5 12 17.5C10.8547 17.5 9.73805 17.1425 8.80574 16.4773C7.87343 15.8122 7.172 14.8726 6.79933 13.7897C6.42666 12.7068 6.40134 11.5345 6.7269 10.4365C7.05246 9.3385 7.71266 8.36951 8.61538 7.66473' stroke='%231E1E1E' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ic_caution::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 7C15.0376 7 17.5 9.46243 17.5 12.5V17.5H6.5V12.5C6.5 9.46243 8.96243 7 12 7Z' stroke='%231E1E1E'/%3E%3Cmask id='path-2-inside-1_169_11398' fill='white'%3E%3Crect x='4' y='17' width='16' height='4' rx='0.5'/%3E%3C/mask%3E%3Crect x='4' y='17' width='16' height='4' rx='0.5' stroke='%231E1E1E' stroke-width='2' mask='url(%23path-2-inside-1_169_11398)'/%3E%3Cpath d='M12 3V5' stroke='%231E1E1E' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M5.93994 5L7.35416 6.41421' stroke='%231E1E1E' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M18.061 5L16.6468 6.41421' stroke='%231E1E1E' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M9 11C9.30293 10.0894 10.0448 9.35392 11 9' stroke='%231E1E1E' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}

.ic_sign::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='7' y='4' width='10' height='16' rx='2' stroke='%231E1E1E'/%3E%3Ccircle cx='12' cy='15' r='1.5' stroke='%231E1E1E'/%3E%3Ccircle cx='12' cy='9' r='1.5' stroke='%231E1E1E'/%3E%3Cpath d='M4.91406 13.5H6.5C6.77614 13.5 7 13.7239 7 14V16.793L4.56055 14.3535C4.26544 14.0583 4.44286 13.5664 4.83301 13.5059L4.91406 13.5Z' stroke='%231E1E1E'/%3E%3Cpath d='M19.0859 13.5H17.5C17.2239 13.5 17 13.7239 17 14V16.793L19.4395 14.3535C19.7346 14.0583 19.5571 13.5664 19.167 13.5059L19.0859 13.5Z' stroke='%231E1E1E'/%3E%3Cpath d='M4.91406 7.5H6.5C6.77614 7.5 7 7.72386 7 8V10.793L4.56055 8.35352C4.26544 8.05829 4.44286 7.56639 4.83301 7.50586L4.91406 7.5Z' stroke='%231E1E1E'/%3E%3Cpath d='M19.0859 7.5H17.5C17.2239 7.5 17 7.72386 17 8V10.793L19.4395 8.35352C19.7346 8.05829 19.5571 7.56639 19.167 7.50586L19.0859 7.5Z' stroke='%231E1E1E'/%3E%3C/svg%3E%0A");
}

.ic_log::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='18' cy='17.5' r='4' stroke='%231E1E1E'/%3E%3Cpath d='M18 15.5V17.5H20' stroke='%231E1E1E' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M7.5 8H15.5' stroke='%231E1E1E' stroke-linecap='round'/%3E%3Cpath d='M7.5 12H14' stroke='%231E1E1E' stroke-linecap='round'/%3E%3Cpath d='M7.5 16H12' stroke='%231E1E1E' stroke-linecap='round'/%3E%3Cpath d='M14.5 20H7C5.89543 20 5 19.1046 5 18V6C5 4.89543 5.89543 4 7 4H16C17.1046 4 18 4.89543 18 6V13' stroke='%231E1E1E' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}

.ic_setting::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.77561 6.03025L10.316 4.63529C10.4071 4.39911 10.5675 4.19596 10.776 4.05244C10.9846 3.90893 11.2316 3.83174 11.4847 3.83099H12.5153C12.7684 3.83174 13.0154 3.90893 13.224 4.05244C13.4325 4.19596 13.5929 4.39911 13.684 4.63529L14.2244 6.03025L16.0592 7.08589L17.5421 6.85968C17.789 6.82616 18.0404 6.86681 18.2641 6.97646C18.4879 7.0861 18.674 7.2598 18.7988 7.47547L19.3015 8.35517C19.4303 8.57428 19.4897 8.82729 19.4717 9.08082C19.4538 9.33435 19.3594 9.57648 19.201 9.77526L18.2836 10.944V13.0553L19.2261 14.224C19.3845 14.4228 19.4789 14.6649 19.4969 14.9185C19.5148 15.172 19.4555 15.425 19.3267 15.6441L18.824 16.5238C18.6991 16.7395 18.513 16.9132 18.2893 17.0228C18.0655 17.1325 17.8142 17.1731 17.5673 17.1396L16.0843 16.9134L14.2495 17.969L13.7091 19.364C13.618 19.6002 13.4577 19.8033 13.2491 19.9468C13.0406 20.0904 12.7935 20.1675 12.5404 20.1683H11.4847C11.2316 20.1675 10.9846 20.0904 10.776 19.9468C10.5675 19.8033 10.4071 19.6002 10.316 19.364L9.77561 17.969L7.94081 16.9134L6.45788 17.1396C6.21096 17.1731 5.95965 17.1325 5.73588 17.0228C5.51211 16.9132 5.32599 16.7395 5.20117 16.5238L4.69848 15.6441C4.56967 15.425 4.51032 15.172 4.52827 14.9185C4.54622 14.6649 4.64062 14.4228 4.79902 14.224L5.71642 13.0553V10.944L4.77389 9.77526C4.61549 9.57648 4.52109 9.33435 4.50314 9.08082C4.48519 8.82729 4.54454 8.57428 4.67335 8.35517L5.17603 7.47547C5.30086 7.2598 5.48698 7.0861 5.71074 6.97646C5.93451 6.86681 6.18583 6.82616 6.43275 6.85968L7.91567 7.08589L9.77561 6.03025ZM9.48657 11.9996C9.48657 12.4968 9.63398 12.9827 9.91016 13.396C10.1863 13.8094 10.5789 14.1315 11.0382 14.3218C11.4974 14.512 12.0028 14.5618 12.4903 14.4648C12.9779 14.3678 13.4258 14.1284 13.7773 13.7769C14.1288 13.4254 14.3682 12.9775 14.4651 12.49C14.5621 12.0024 14.5123 11.4971 14.3221 11.0378C14.1319 10.5785 13.8097 10.186 13.3964 9.9098C12.9831 9.63362 12.4971 9.48621 12 9.48621C11.3334 9.48621 10.6941 9.75102 10.2227 10.2224C9.75138 10.6937 9.48657 11.333 9.48657 11.9996Z' stroke='%231E1E1E' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ic_location::before {
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.4281 14.8492C8.74972 15.1637 9.25028 15.1637 9.5719 14.8492C10.8843 13.5659 14 10.2422 14 7.61091C14 4.84949 11.7614 2.61092 9 2.61092C6.23858 2.61092 4 4.84949 4 7.61091C4 10.2422 7.11573 13.5659 8.4281 14.8492Z' stroke='%231E1E1E'/%3E%3Cpath d='M10.5974 7.40268C10.5974 8.2848 9.88233 8.99991 9.0002 8.99991C8.11808 8.99991 7.40298 8.2848 7.40298 7.40268C7.40298 6.52056 8.11808 5.80546 9.0002 5.80546C9.88233 5.80546 10.5974 6.52056 10.5974 7.40268Z' stroke='%231E1E1E'/%3E%3C/svg%3E%0A");
}

.ic_axis::before {
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 15C12.3137 15 15 12.3137 15 9C15 5.68629 12.3137 3 9 3M9 15C5.68629 15 3 12.3137 3 9C3 5.68629 5.68629 3 9 3M9 15C7.55025 15 6.375 12.3137 6.375 9C6.375 5.68629 7.55025 3 9 3M9 15C10.4497 15 11.625 12.3137 11.625 9C11.625 5.68629 10.4497 3 9 3M4.125 11.9163C5.22422 11.2868 7.05049 10.875 9.11757 10.875C11.275 10.875 13.17 11.3236 14.25 12M4.125 6.08372C5.22422 6.71317 7.05049 7.125 9.11757 7.125C11.275 7.125 13.17 6.6764 14.25 6' stroke='%231E1E1E'/%3E%3C/svg%3E%0A");
}

.ic_load::before {
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 15.3333C4 13.4924 5.49238 12 7.33333 12H10.6667C12.5076 12 14 13.4924 14 15.3333V15.3333C14 15.7015 13.7015 16 13.3333 16H4.66667C4.29848 16 4 15.7015 4 15.3333V15.3333Z' stroke='%231E1E1E'/%3E%3Ccircle cx='9' cy='7' r='5' stroke='%231E1E1E'/%3E%3Ccircle cx='9' cy='7' r='1.5' stroke='%231E1E1E'/%3E%3C/svg%3E%0A");
}

.ic_distance::before {
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.5 5.27051H15' stroke='%231E1E1E' stroke-linecap='round'/%3E%3Cpath d='M15.5 4.27051V6.27051' stroke='%231E1E1E' stroke-linecap='round'/%3E%3Cpath d='M2.5 4.27051V6.27051' stroke='%231E1E1E' stroke-linecap='round'/%3E%3Crect x='2.5' y='8' width='13' height='6' rx='1' stroke='%231E1E1E'/%3E%3Cpath d='M6 8.5V10.5' stroke='%231E1E1E' stroke-linecap='round'/%3E%3Cpath d='M9 8.5V10.5' stroke='%231E1E1E' stroke-linecap='round'/%3E%3Cpath d='M12 8.5V10.5' stroke='%231E1E1E' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}

.ic_area::before {
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.0526 11.6053V6.39474M11.6053 13.0526H6.68421M4.94737 11.4605V6.53947M6.39474 4.94737H11.4605M4.07895 6.39474H5.81579C6.13553 6.39474 6.39474 6.13553 6.39474 5.81579V4.07895C6.39474 3.7592 6.13553 3.5 5.81579 3.5H4.07895C3.7592 3.5 3.5 3.7592 3.5 4.07895V5.81579C3.5 6.13553 3.7592 6.39474 4.07895 6.39474ZM12.1842 6.39474H13.9211C14.2408 6.39474 14.5 6.13553 14.5 5.81579V4.07895C14.5 3.7592 14.2408 3.5 13.9211 3.5H12.1842C11.8645 3.5 11.6053 3.7592 11.6053 4.07895V5.81579C11.6053 6.13553 11.8645 6.39474 12.1842 6.39474ZM4.07895 14.5H5.81579C6.13553 14.5 6.39474 14.2408 6.39474 13.9211V12.1842C6.39474 11.8645 6.13553 11.6053 5.81579 11.6053H4.07895C3.7592 11.6053 3.5 11.8645 3.5 12.1842V13.9211C3.5 14.2408 3.7592 14.5 4.07895 14.5ZM12.1842 14.5H13.9211C14.2408 14.5 14.5 14.2408 14.5 13.9211V12.1842C14.5 11.8645 14.2408 11.6053 13.9211 11.6053H12.1842C11.8645 11.6053 11.6053 11.8645 11.6053 12.1842V13.9211C11.6053 14.2408 11.8645 14.5 12.1842 14.5Z' stroke='%231E1E1E' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}

.ic_tooltip::before {
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14.8499 6.25016L8.9999 3.00016L3.1499 6.25016V12.7502L8.9999 16.0002L14.8499 12.7502V6.25016ZM8.9999 11.6668C10.2435 11.6668 11.2516 10.6968 11.2516 9.50016C11.2516 8.30355 10.2435 7.3335 8.9999 7.3335C7.75634 7.3335 6.74824 8.30355 6.74824 9.50016C6.74824 10.6968 7.75634 11.6668 8.9999 11.6668Z' stroke='%231E1E1E' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ic_finder::before {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.5 3.8C7.5 4.07614 7.72386 4.3 8 4.3C8.27614 4.3 8.5 4.07614 8.5 3.8H8H7.5ZM8.5 1C8.5 0.72386 8.27614 0.500002 8 0.500002C7.72386 0.500002 7.5 0.72386 7.5 1H8H8.5ZM7.5 15C7.5 15.2761 7.72386 15.5 8 15.5C8.27614 15.5 8.5 15.2761 8.5 15H8H7.5ZM8.5 12.2C8.5 11.9239 8.27614 11.7 8 11.7C7.72386 11.7 7.5 11.9239 7.5 12.2H8H8.5ZM12.2 7.5C11.9239 7.5 11.7 7.72386 11.7 8C11.7 8.27614 11.9239 8.5 12.2 8.5V8V7.5ZM15 8.5C15.2761 8.5 15.5 8.27614 15.5 8C15.5 7.72386 15.2761 7.5 15 7.5V8V8.5ZM1 7.5C0.723858 7.5 0.5 7.72386 0.5 8C0.5 8.27614 0.723858 8.5 1 8.5V8V7.5ZM3.8 8.5C4.07614 8.5 4.3 8.27614 4.3 8C4.3 7.72386 4.07614 7.5 3.8 7.5V8V8.5ZM13.6 7.99996H13.1C13.1 10.8166 10.8167 13.1 8 13.1V13.6V14.1C11.3689 14.1 14.1 11.3689 14.1 7.99996H13.6ZM8 13.6V13.1C5.18335 13.1 2.9 10.8166 2.9 7.99996H2.4H1.9C1.9 11.3689 4.63106 14.1 8 14.1V13.6ZM2.4 7.99996H2.9C2.9 5.18331 5.18335 2.89996 8 2.89996V2.39996V1.89996C4.63106 1.89996 1.9 4.63102 1.9 7.99996H2.4ZM8 2.39996V2.89996C10.8167 2.89996 13.1 5.18331 13.1 7.99996H13.6H14.1C14.1 4.63102 11.3689 1.89996 8 1.89996V2.39996ZM8 3.8H8.5V1H8H7.5V3.8H8ZM8 15H8.5V12.2H8H7.5V15H8ZM12.2 8V8.5H15V8V7.5H12.2V8ZM1 8V8.5H3.8V8V7.5H1V8ZM10.1 8H9.6C9.6 8.88366 8.88366 9.6 8 9.6V10.1V10.6C9.43594 10.6 10.6 9.43594 10.6 8H10.1ZM8 10.1V9.6C7.11634 9.6 6.4 8.88366 6.4 8H5.9H5.4C5.4 9.43594 6.56406 10.6 8 10.6V10.1ZM5.9 8H6.4C6.4 7.11635 7.11634 6.4 8 6.4V5.9V5.4C6.56406 5.4 5.4 6.56406 5.4 8H5.9ZM8 5.9V6.4C8.88366 6.4 9.6 7.11635 9.6 8H10.1H10.6C10.6 6.56406 9.43594 5.4 8 5.4V5.9Z' fill='%231E1E1E'/%3E%3C/svg%3E%0A");
}

.ic_cross::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='5.5' y='10' width='13' height='4' rx='0.5' fill='%23767A85'/%3E%3Crect x='10' y='5.5' width='4' height='13' rx='0.5' fill='%23767A85'/%3E%3C/svg%3E%0A");
}

.ic_signGroup::before {
  background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='7.5' y='4' width='10' height='16' rx='2' fill='%23767A85' stroke='%23767A85'/%3E%3Ccircle cx='12.5' cy='15' r='2' fill='%23F0F2F6'/%3E%3Ccircle cx='12.5' cy='9' r='2' fill='%23F0F2F6'/%3E%3Cpath d='M5.41406 13.5H7C7.27614 13.5 7.5 13.7239 7.5 14V16.793L5.06055 14.3535C4.76544 14.0583 4.94286 13.5664 5.33301 13.5059L5.41406 13.5Z' stroke='%23767A85'/%3E%3Cpath d='M19.5859 13.5H18C17.7239 13.5 17.5 13.7239 17.5 14V16.793L19.9395 14.3535C20.2346 14.0583 20.0571 13.5664 19.667 13.5059L19.5859 13.5Z' stroke='%23767A85'/%3E%3Cpath d='M5.41406 7.5H7C7.27614 7.5 7.5 7.72386 7.5 8V10.793L5.06055 8.35352C4.76544 8.05829 4.94286 7.56639 5.33301 7.50586L5.41406 7.5Z' stroke='%23767A85'/%3E%3Cpath d='M19.5859 7.5H18C17.7239 7.5 17.5 7.72386 17.5 8V10.793L19.9395 8.35352C20.2346 8.05829 20.0571 7.56639 19.667 7.50586L19.5859 7.5Z' stroke='%23767A85'/%3E%3C/svg%3E%0A");
}
.ic_signGroup.on::before {
  animation: redFlash 1s infinite;
}

@keyframes redFlash {
  0%, 49%{
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='7.5' y='4' width='10' height='16' rx='2' fill='%23767A85' stroke='%23767A85'/%3E%3Ccircle cx='12.5' cy='15' r='2' fill='%23F0F2F6'/%3E%3Ccircle cx='12.5' cy='9' r='2' fill='%23F0F2F6'/%3E%3Cpath d='M5.41406 13.5H7C7.27614 13.5 7.5 13.7239 7.5 14V16.793L5.06055 14.3535C4.76544 14.0583 4.94286 13.5664 5.33301 13.5059L5.41406 13.5Z' stroke='%23767A85'/%3E%3Cpath d='M19.5859 13.5H18C17.7239 13.5 17.5 13.7239 17.5 14V16.793L19.9395 14.3535C20.2346 14.0583 20.0571 13.5664 19.667 13.5059L19.5859 13.5Z' stroke='%23767A85'/%3E%3Cpath d='M5.41406 7.5H7C7.27614 7.5 7.5 7.72386 7.5 8V10.793L5.06055 8.35352C4.76544 8.05829 4.94286 7.56639 5.33301 7.50586L5.41406 7.5Z' stroke='%23767A85'/%3E%3Cpath d='M19.5859 7.5H18C17.7239 7.5 17.5 7.72386 17.5 8V10.793L19.9395 8.35352C20.2346 8.05829 20.0571 7.56639 19.667 7.50586L19.5859 7.5Z' stroke='%23767A85'/%3E%3C/svg%3E%0A");
  }
  50%, 100% {
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='7.5' y='4' width='10' height='16' rx='2' fill='red' stroke='red'/%3E%3Ccircle cx='12.5' cy='15' r='2' fill='%23F0F2F6'/%3E%3Ccircle cx='12.5' cy='9' r='2' fill='%23F0F2F6'/%3E%3Cpath d='M5.41406 13.5H7C7.27614 13.5 7.5 13.7239 7.5 14V16.793L5.06055 14.3535C4.76544 14.0583 4.94286 13.5664 5.33301 13.5059L5.41406 13.5Z' stroke='red'/%3E%3Cpath d='M19.5859 13.5H18C17.7239 13.5 17.5 13.7239 17.5 14V16.793L19.9395 14.3535C20.2346 14.0583 20.0571 13.5664 19.667 13.5059L19.5859 13.5Z' stroke='red'/%3E%3Cpath d='M5.41406 7.5H7C7.27614 7.5 7.5 7.72386 7.5 8V10.793L5.06055 8.35352C4.76544 8.05829 4.94286 7.56639 5.33301 7.50586L5.41406 7.5Z' stroke='red'/%3E%3Cpath d='M19.5859 7.5H18C17.7239 7.5 17.5 7.72386 17.5 8V10.793L19.9395 8.35352C20.2346 8.05829 20.0571 7.56639 19.667 7.50586L19.5859 7.5Z' stroke='red'/%3E%3C/svg%3E%0A");
  }
}

.ic_cross:hover::before,
.active.ic_cross::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='5.5' y='10' width='13' height='4' rx='0.5' fill='%23002F7B'/%3E%3Crect x='10' y='5.5' width='4' height='13' rx='0.5' fill='%23002F7B'/%3E%3C/svg%3E%0A");
}

.ic_signGroup:hover::before,
.active.ic_signGroup::before {
  background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='7.5' y='4' width='10' height='16' rx='2' fill='%2300337B' stroke='%2300337B'/%3E%3Ccircle cx='12.5' cy='15' r='2' fill='%23F0F2F6'/%3E%3Ccircle cx='12.5' cy='9' r='2' fill='%23F0F2F6'/%3E%3Cpath d='M5.41406 13.5H7C7.27614 13.5 7.5 13.7239 7.5 14V16.793L5.06055 14.3535C4.76544 14.0583 4.94286 13.5664 5.33301 13.5059L5.41406 13.5Z' stroke='%2300337B'/%3E%3Cpath d='M19.5859 13.5H18C17.7239 13.5 17.5 13.7239 17.5 14V16.793L19.9395 14.3535C20.2346 14.0583 20.0571 13.5664 19.667 13.5059L19.5859 13.5Z' stroke='%2300337B'/%3E%3Cpath d='M5.41406 7.5H7C7.27614 7.5 7.5 7.72386 7.5 8V10.793L5.06055 8.35352C4.76544 8.05829 4.94286 7.56639 5.33301 7.50586L5.41406 7.5Z' stroke='%2300337B'/%3E%3Cpath d='M19.5859 7.5H18C17.7239 7.5 17.5 7.72386 17.5 8V10.793L19.9395 8.35352C20.2346 8.05829 20.0571 7.56639 19.667 7.50586L19.5859 7.5Z' stroke='%2300337B'/%3E%3C/svg%3E%0A");
}

/*table*/
.inTableArea {
  display: grid;
  grid-template-columns: 560px 560px;
  row-gap: 8px;
  justify-content: space-between;
  padding: 16px 0 0 0;
}

.inTableArea .inTable.col1 {
  grid-column: span 2;
}

.inTableArea .inTable {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.inTableArea .inTable .row {
  display: grid;
  grid-template-columns: 1fr;
  width: 100%;
}

.inTableArea .inTable .row .item {
  display: grid;
  grid-template-columns: 96px 1fr;
  min-height: 32px;
  align-items: center;
}

.inTableArea .inTable .row .item .tit {
  padding-top: 7px;
  line-height: 18px;
  color: #5E6A68;
  font-weight: 500;
  align-self: flex-start;
}

.inTableArea .inTable .row .item .tit span {
  position: relative;
  display: inline-block;
}

.inTableArea .inTable .row .item .tit span.imp:after {
  position: absolute;
  top: 0;
  right: -8px;
  width: 4px;
  height: 4px;
  border-radius: 4px;
  background-color: #BD5853;
  content: "";
}

.inTableArea .inTable .row .item .con {
  width: 100%;
}

.inTableArea .inTable .row .item .con .inpBox + .btn {
  margin-left: 8px;
}

.inTableArea .inTable .row .item .con .inpBox + .btn + .btn {
  margin-left: 8px;
}

.inTableArea .inTable .row.col2 {
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 40px;
  justify-content: space-between;
}

/*텍스트가 길때*/
.inTableArea .inTable.titW2 .row .item {
  grid-template-columns: 120px 1fr;
  grid-column-gap: 16px;
}

.inTableArea .inTable.titW2 .row .item:nth-child(2) {
  grid-template-columns: 96px 1fr;
}

.inTableArea .inTable.titW2 .row .item .tit {
  white-space: pre;
}

/*table box*/
.gridArea,
.dataTable {
  overflow: auto;
  border-top: 1px solid #5B7293;
}

.tableBody {
  position: relative;
  width: 100%;
}

.tableBody tbody td,
.tableBody tbody th {
  border: solid var(--bg);
  line-height: 16px;
  font-weight: 500;
}

.tableBody thead {
  position: sticky;
  z-index: 1;
  top: 0;
}

.tableBody thead th {
  background-color: #5B7293;
  padding: 0 8px;
  height: 30px;
  font-size: 14px;
  color: white;
  white-space: nowrap;
}

.tableBody tbody {
  background-color: #fff;
}

.tableBody tbody tr:not(.empty-box):hover td:not(.empty-history):not(.empty-evp) {
  background-color: #beebff;
}

.tableBody tbody td {
  position: relative;
  height: 36px;
  border-width: 1px;
  background-color: #fff;
  font-size: 14px;
  color: var(--gray5);
  text-align: center;
  padding: 8px;
}
.tableBody tbody tr.on td {
  background-color: #beebff;
}
.tableBody tbody tr:not(.empty-box):hover{
  cursor: pointer;
}
.tableBody.error-cnt-table tbody td,
.tableBody.error-stat-table tbody td {
  font-size: 12px;
}

.tableBody.error-cnt-table tbody td:nth-child(2),
.tableBody.error-stat-table tbody td:nth-child(2),
.tableBody.error-cnt-table tbody td:nth-child(4),
.tableBody.error-stat-table tbody td:nth-child(4)
{
  text-align: left;
}
.pagination a:hover {
  cursor: pointer;
}
.empty-box td {
  user-select: none;
}

.tableBody tbody td span,
.tableBody tbody td p {
  display: block;
  font-size: 14px;
  font-weight: 400;
  color: var(--gray5);
}

.tableBody tbody td:first-child {
  border-width: 1px 1px 1px 0;
}

.tableBody tbody td:last-child {
  border-width: 1px 0 1px 1px;
}

.gridArea .tableBody tbody td {
  padding: 0 8px;
  font-size: 12px;
}

/* calendar */
.ui-datepicker {
  width: 200px;
  background-color: white;
}

.ui-datepicker.ui-widget.ui-widget-content {
  border: 0;
  border-radius: 8px;
  border: 1px solid var(--line);
  box-shadow: 0px 0px 12px 0px rgba(32, 41, 54, 0.1);
  padding: 18px;
}

.ui-widget-header {
  background: var(--white);
  border: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--black);
  margin-bottom: 16px;
}

.ui-datepicker .ui-datepicker-title select {
  font-size: 13px;
  font-weight: 600;
  color: var(--black);
}

.ui-datepicker .ui-datepicker-next {
  right: 1px;
  cursor: pointer;
}

.ui-datepicker .ui-datepicker-prev {
  left: 1px;
  cursor: pointer;
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
  width: 24px;
  height: 24px;
  margin: 0;
  background-position: unset;
}

.ui-datepicker .ui-datepicker-prev span {
  position: unset;
  background-size: 100%;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 8L10.7071 11.2929C10.3166 11.6834 10.3166 12.3166 10.7071 12.7071L14 16' stroke='%2396A6AE' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.ui-datepicker .ui-datepicker-next span {
  position: unset;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 8L13.2929 11.2929C13.6834 11.6834 13.6834 12.3166 13.2929 12.7071L10 16' stroke='%2396A6AE' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

/*.ui-state-hover,*/
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
  border: 0;
  background: transparent;
}
.ui-state-default.ui-state-hover {
  background: #8390a3;
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
  width: auto;
  border: 0;
  text-align: right;
}

.ui-datepicker select.ui-datepicker-month {
  width: 30px;
  text-align: right;
}


.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
  border: 0;
  border-radius: 4px;
  background-color: var(--white);
  font-size: 12px;
  color: #414F63;
  text-align: center;
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
  background-color: var(--gray60);
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
  color: var(--white);
  background-color: var(--navy30);
}


.ui-datepicker th {
  font-size: 12px;
  font-weight: 500;
  color: #76859C;
}

.ui-datepicker td span,
.ui-datepicker td a {
  padding: 0;
  width: 20px;
  line-height: 20px;
}

/* 모달팝업 */
.modal-container {
  position: absolute;
  background: var(--white);
  border-radius: 8px;
  padding: 16px;
  border: 1px solid var(--gray60);
  margin-top: 8px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
  bottom: 0;
  right: 0;
  z-index: 999;
}
.modal-container::before {
  content: "";
  display: block;
  position: absolute;
  top: -8px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 8px 8px 8px;
  border-color: transparent transparent var(--gray5) transparent;
}
.modal-container .modal-contents {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}
.modal-container.open {
  opacity: 1;
  visibility: visible;
}

/* sign */
.status {
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
.status.green {
  background-color: var(--green30);
}
.status.blue {
  background-color: var(--blue30);
}
.status.red {
  background-color: var(--red30);
}

.iconSign {
  display: block;
  aspect-ratio: 1/1;
  border-radius: 50%;
}

.Signal {
  background-color: var(--red30);
}

.Blink {
  background-color: var(--yellow30);
}

.Out {
  background-color: var(--gray30);
}

.Passive {
  background-color: var(--cyan30);
}

.Normal_on {
  border: 2px solid var(--blue30);
  background-color: rgba(26, 112, 248, 0.2);
}

.Time_on {
  border: 2px solid var(--pink30);
  background-color: rgba(248, 26, 233, 0.2);
}

.Sensitive_on {
  border: 2px solid var(--red30);
  background-color: rgba(248, 26, 30, 0.2);
}

.Normal_off {
  border: 2px solid var(--blue30);
  background-color: var(--gray50);
}

.Time_off {
  border: 2px solid var(--pink30);
  background-color: var(--gray50);
}

.Sensitive_off {
  border: 2px solid var(--red30);
  background-color: var(--gray50);
}

.filebox .upload-name {
  display: inline-block;
  height: 34px;
  padding: 0 8px;
  vertical-align: middle;
  border-radius: 6px;
  border: 1px solid var(--line);
  width: 78%;
  font-size: 14px;
  color: var(--text);
}

.filebox label {
  display: inline-block;
  padding: 0 12px;
  color: #fff;
  vertical-align: middle;
  background-color: var(--line);
  color: var(--gray5);
  font-weight: 500;
  cursor: pointer;
  line-height: 34px;
  border-radius: 6px;
  margin-left: 4px;
}

.filebox input[type=file] {
  position: absolute;
  width: 0;
  height: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
}

.wrap {
  width: 100%;
  height: 100%;
  background-color: var(--bg);
  padding: 0;
}

.topArea {
  width: 100%;
  height: 60px;
  display: flex;
  justify-content: space-between;
  padding: 0 16px;
}
.topArea .logo {
  width: 320px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  color: var(--gray10);
}
.topArea .logo::before {
  content: "";
  display: block;
  width: 157px;
  height: 24px;
  background-image: url(/images/h1_logo.png);
  background-repeat: no-repeat;
  background-size: 100%;
}
.topArea .nav {
  display: flex;
  align-items: center;
  gap: 8px;
}
.topArea .nav li {
  height: 36px;
  font-size: 14px;
  font-weight: 500;
  color: var(--gray10);
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 12px;
  background-color: white;
  border-radius: 6px;
  box-shadow: -2px 3px 21px 0 rgba(0, 0, 0, 0.2);
  cursor: pointer;
}
.topArea .nav li::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
}
.topArea .nav li:hover {
  color: var(--navy30);
}

.container {
  width: 100%;
  height: calc(100% - 60px);
  display: flex;
  padding: 0 8px 8px 8px;
  overflow: hidden;
}
.container .LnbArea {
  position: relative;
  width: 312px;
  height: 100%;
  display: grid;
  grid-template-rows: 36px 1fr;
  padding: 0 10px 0 0;
  transition: all 0.3s;
}
.container .LnbArea.fold {
  margin-left: -312px;
}
.container .LnbArea .tab {
  width: 100%;
  display: flex;
}
.container .LnbArea .tab li {
  height: 36px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid var(--gray50);
  cursor: pointer;
}
.container .LnbArea .tab li:hover, .container .LnbArea .tab li.active {
  border-bottom: 4px solid var(--navy30);
}
.container .LnbArea .tab li:hover span, .container .LnbArea .tab li.active span {
  color: var(--navy30);
}
.container .LnbArea .tab li span {
  font-size: 16px;
  font-weight: 600;
  color: var(--gray20);
  user-select: none;
}
.container .LnbArea .tab li:first-child {
  width: 100px;
}
.container .LnbArea .tab li:last-child {
  flex: 1;
}
.container .LnbArea .tab .ic_logout {
  position: absolute;
  bottom: 0;
  width: 60px;
  height: 60px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.container .LnbArea .tab .ic_logout span {
  font-size: 13px;
  font-weight: 600;
  color: white;
}
.container .LnbArea .tabContainer {
  flex: 1;
  display: flex;
  flex-direction: column;
  position: relative;
  height: 100%;
  overflow: hidden;
}
.container .LnbArea .tabContainer section {
  display: flex;
  flex-direction: column;
}
.container .LnbArea .tabContainer section h2 {
  font-size: 14px;
}
.container .LnbArea .tabContainer section .gridArea {
  flex: none;
  background-color: white;
  position: relative;
}
.container .LnbArea .tabContainer section + section {
  margin-top: 16px;
  margin-bottom: 16px;
}
.container .LnbArea .tabContainer .section_01 {
  height: 200px;
}
.container .LnbArea .tabContainer .section_02 {
  flex: 1;
}
.container .LnbArea .tabContainer .searchBox {
  width: 100%;
  height: 60px;
  position: relative;
  display: flex;
  gap: 4px;
  padding: 12px 0;
}
.container .LnbArea .tabContainer .searchBox .inpBox {
  flex: 1;
}
.container .LnbArea .tabContainer .searchBox .ic_search {
  position: absolute;
  right: 0;
  top: 12px;
  width: 36px;
  height: 36px;
}
.container .LnbArea .tabContainer .searchBox .ic_search::before {
  width: 16px;
  height: 16px;
}
.container .LnbArea .tabContainer .formArea {
  flex-direction: column;
  padding: 0;
  border: solid var(--gray40);
  border-width: 1px 0;
  padding: 8px;
  margin-bottom: 12px;
}
.container .LnbArea .tabContainer .formArea .formItem {
  gap: 0;
}
.container .LnbArea .tabContainer .formArea .label {
  font-size: 13px;
}
.container .LnbArea .btnFold {
  top: 50%;
  right: 0;
  width: 24px;
  height: 46px;
  border-radius: 0 6px 6px 0;
  transform: translate(24px, -50%);
}
.container .LnbArea .btnFold.fold::before {
  transform: rotate(180deg);
}
.container .LnbArea .treeArea {
  width: 100%;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  overflow: auto;
}
.container .LnbArea .treeArea .item .row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  font-size: 14px;
  cursor: pointer;
}
.container .LnbArea .treeArea .item .row span {
  display: flex;
  align-items: center;
  gap: 8px;
}
.container .LnbArea .treeArea .item .row .all .count {
  color: var(--blue30);
}
.container .LnbArea .treeArea .item .row .strange::before {
  content: "";
  display: block;
  width: 1px;
  height: 14px;
  background-color: #ddd;
}
.container .LnbArea .treeArea .item .row .strange .count {
  color: var(--red30);
}
.container .LnbArea .treeArea .item .row::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.9939 6L12.3982 6L8.19604 11.6611L3.9939 6Z' fill='%23A0A4B0' stroke='%23A0A4B0'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  transition: all 0.2s;
}
.container .LnbArea .treeArea .item.open .row {
  background-color: #EAF3FF !important;
}
.container .LnbArea .treeArea .item.open .row::before {
  transform: rotate(180deg);
}
.container .LnbArea .treeArea .item.open .villageList {
  display: block;
  background-color: var(--gray80);
  padding: 8px 0;
}
.container .LnbArea .treeArea .item.open .villageList li {
  padding: 0 16px 0 32px;
  margin-bottom: 8px;
}
.container .LnbArea .treeArea .item.open .villageList li .village {
  display: flex;
  align-items: center;
  gap: 8px;
}
.container .LnbArea .treeArea .item.open .villageList li .village span {
  font-size: 14px;
}
.container .LnbArea .treeArea .item.open .villageList li .village .act {
  font-weight: 600;
  color: var(--blue30);
}
.container .LnbArea .treeArea .item:nth-child(2n+1) .row {
  background-color: #F0F2F6;
}
.container .LnbArea .treeArea .villageList {
  display: none;
}
.container .btnFold {
  position: absolute;
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--bg);
}
.container .btnFold::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  background-image: url(/images/icon/ic_back.svg);
  background-repeat: no-repeat;
  background-size: 100%;
  transition: all 0.2s;
}
.container .contents {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  border: 1px solid #B4C0D2;
  overflow: hidden;
}
.container .contents .mapArea {
  position: relative;
  flex: 1;
  display: flex;
}
.container .contents .mapArea .fncButton {
  position: absolute;
  z-index: 1;
  top: 10px;
  left: 10px;
  display: flex;
  gap: 4px;
  z-index: 99;
}
.container .contents .mapArea .fncButton .btn {
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.15);
}
.container .contents .mapArea .fncButton .btn:focus {
  outline: none;
}
.container .contents .mapArea .fncButton .btn i::before {
  width: 18px;
  height: 18px;
}

.container .contents .mapArea .fncButton .btn.on,
.container .contents .mapArea .fncButton .btn:hover {
  background-color: var(--navy30);
  color: white;
}
.container .contents .mapArea .fncButton .btn.on i::before,
.container .contents .mapArea .fncButton .btn:hover i::before {
  filter: invert(1);
}
.container .contents .infoArea {
  position: absolute;
  z-index: 1;
  bottom: 0;
  width: 100%;
  height: 212px;
  border-top: 1px solid var(--gray60);
  background-color: white;
  transition: all 0.3s;
}
.container .contents .infoArea.fold {
  bottom: -212px;
}
.container .contents .infoArea .legend {
  position: absolute;
  z-index: 1;
  right: 16px;
  top: 0;
  transform: translateY(-90px);
  display: flex;
  gap: 4px;
  padding: 4px;
  border-radius: 4px;
  background-color: white;
  border: 1px solid var(--green30);
}
.container .contents .infoArea .legend .label {
  position: relative;
  padding: 20px 8px 4px 8px;
  display: flex;
  gap: 8px;
}
.container .contents .infoArea .legend .label::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 11px;
  text-align: center;
  color: #6A6A6A;
}
.container .contents .infoArea .legend .label span {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 12px;
  text-align: center;
  color: #6A6A6A;
}
.container .contents .infoArea .legend .label .iconSign {
  width: 16px;
  height: 16px;
}
.container .contents .infoArea .legend .online {
  border-radius: 4px;
  background-color: rgba(0, 167, 60, 0.1);
}
.container .contents .infoArea .legend .online::before {
  content: "ON LINE";
}
.container .contents .infoArea .legend .offline {
  border-radius: 4px;
  background-color: rgba(0, 167, 60, 0.1);
}
.container .contents .infoArea .legend .offline::before {
  content: "OFF LINE";
}
.container .contents .infoArea .legend .sign {
  width: 16px;
  height: 16px;
}
.container .contents .infoArea .gridArea {
  width: 100%;
  height: 212px;
  overflow: auto;
}
.container .contents .infoArea .btnFold {
  top: 0;
  left: 50%;
  width: 46px;
  height: 24px;
  border-radius: 6px 6px 0 0;
  transform: translate(-50%, -24px);
  background-color: #5B7293;
}
.container .contents .infoArea .btnFold::before {
  background-image: url(/images/icon/ic_arrowDn.svg);
}
.container .contents .infoArea .btnFold.fold::before {
  transform: rotate(180deg);
}

.modal-contents .section .title {
  display: flex;
  align-items: center;
  gap: 8px;
  border-bottom: 1px solid var(--gray60);
  padding-bottom: 8px;
}
.modal-contents .section .title .iconSign {
  position: relative;
  width: 16px;
  height: 16px;
}
.modal-contents .section .title span {
  font-size: 16px;
  font-weight: 600;
  color: var(--gray5);
}
.modal-contents .infoTable {
  width: 100%;
  border-radius: 8px;
  background-color: var(--gray80);
  border: 1px solid var(--gray60);
}
.modal-contents .infoTable .row {
  display: flex;
  gap: 16px;
  padding: 4px 12px;
}
.modal-contents .infoTable .row + .row {
  border-top: 1px solid var(--gray60);
}
.modal-contents .infoTable dt {
  width: 70px;
  font-weight: 600;
  color: var(--gray10);
  display: flex;
  align-items: center;
  gap: 8px;
}
.modal-contents .infoTable dt::before {
  content: "";
  display: block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: var(--gray5);
}
.modal-contents .infoTable dt span {
  font-size: 13px;
  line-height: 15px;
}
.modal-contents .infoTable dd {
  flex: 1;
  background-color: white;
  border-radius: 8px;
  text-align: right;
  padding: 0 8px;
}
.modal-contents .infoTable dd span {
  font-size: 14px;
  font-weight: 500;
  line-height: 30px;
  color: var(--black);
}

.signalIcon {
  width: 48px;
  height: 48px;
  padding: 4px;
  cursor: pointer;
}
.signalIcon .iconSign {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 48px;
}

.Popup-contents {
  padding: 24px;
}
.Popup-contents .h1 {
  /*font-size: 24px;*/
  font-size: 18px;
  font-weight: 700;
  color: var(--black);
  margin-bottom: 16px;
  line-height: 18px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--gray60);
}

.h3 {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 16px;
  font-weight: 600;
  color: var(--navy30);
}
.h3::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border: 3px solid var(--navy30);
  border-radius: 50%;
}

.formArea {
  display: flex;
  flex-wrap: wrap;
  row-gap: 8px;
  column-gap: 24px;
  padding: 16px;
}
.formArea .formItem {
  display: flex;
  align-items: center;
  gap: 8px;
}
.formArea .formItem.flex-1 {
  flex: 1;
}
.formArea .formItem .label {
  display: flex;
  gap: 2px;
  font-size: 14px;
  font-weight: 600;
  line-height: 15px;
  color: var(--gray10);
  white-space: nowrap;
}
.formArea .formItem .label::after {
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 4px;
  background: transparent;
  margin-top: 2px;
}
.formArea .formItem .required::after {
  background: var(--red40);
}
.formArea .formItem .form {
  flex: 1 1 0%;
  display: flex;
  align-items: center;
  gap: 4px;
}
.formArea .formItem .form .flex-1 {
  flex: 1 1 0%;
}
.formArea .formItem .form + .label {
  margin-left: 16px;
}
.formArea.searchBox {
  position: relative;
  background-color: var(--bg);
  border-radius: 8px;
  margin-bottom: 16px;
}

.total {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  font-size: 13px;
  color: var(--gray40);
}
.total::before {
  content: "Total :";
}
.total span {
  color: var(--black);
  font-weight: 600;
}
.total:has(.selectBox) {
  justify-content: flex-end;
}
.total:has(.selectBox)::before {
  content: "앱번호 :";
}

.tabMenu {
  display: flex;
  gap: 4px;
  width: 100%;
  height: 46px;
  padding: 4px;
  background-color: var(--gray70);
  border-radius: 6px;
  margin-bottom: 16px;
}
.tabMenu button {
  flex: 1;
  border-radius: 6px;
  color: var(--gray10);
  cursor: pointer;
}
.tabMenu button.act {
  background-color: var(--green30);
}
.tabMenu button.act span {
  font-weight: 600;
  color: white;
}

.tabContainer .comment {
  font-size: 14px;
  color: var(--red30);
  margin-bottom: 8px;
}
.tabContainer .comment::before {
  content: "※";
  margin-right: 4px;
}

.inputForm {
  border-radius: 8px;
  border: 1px solid var(--line);
  overflow: hidden;
}
.inputForm table {
  width: 100%;
}
.inputForm table th,
.inputForm table td {
  font-size: 14px;
  border-bottom: 1px solid var(--line);
}
.inputForm table th {
  padding: 6px 16px;
  text-align: left;
  color: var(--gray320);
  font-weight: 500;
  background-color: var(--gray80);
}
.inputForm table td {
  padding: 6px;
  color: var(--gray40);
}
.inputForm table tr:last-child th,
.inputForm table tr:last-child td {
  border: 0;
}


#map {
  width: 100%;
  height: 100%;
}
#map.on {
  width: 50%;
}

#roadview {
  display: none;
  width: 50%;
  height: 100%;
}
#roadview.on {
  display: block;
}

.section_01 .treeLoading {
  display: none;
  position: absolute;
}
.section_02 .treeLoading{
  display: none;
  position: absolute;
  top: 80px;
  left: 45%
}

.tot, .error {
  /* padding: 0px 8px; */
  border-radius: 50px;
  cursor: pointer;
  color: var(--white);
  height: 20px;
  align-items: center;
  justify-content: space-between;
  font-size: 11px;
  display: flex;
  gap: 5px;
  padding : 0 10px;
  width: 65px;
}
.tot {
  background-color: var(--blue10);
}

.error {
  background-color: var(--red10);
}


.comm1 {
  width: 12px;  /* 원 크기 */
  height: 12px;
  background: var(--green30);
  border-radius: 50%;
  display: inline-block;
}

.comm0 {
  width: 12px;  /* 원 크기 */
  height: 12px;
  background: var(--red30);
  border-radius: 50%;
  display: inline-block;
}
.jstree-open > div:nth-child(1) {
  border-radius: 15px 15px 0 0;
}
.jstree-last > div {
  border-radius: 0 0 15px 15px;
}

.int-name {
  font-weight: bold;
  width: 235px;
  text-overflow: ellipsis;
  overflow: hidden;
}

.tree-box{
  height: calc(100% - 60px); max-width: 100%; overflow: auto; position:relative;
}

/* 전체 스크롤바 스타일 */
::-webkit-scrollbar {
  width: 8px; /* 스크롤바 두께 */
  height: 6px;
}

/* 스크롤바 트랙 (배경) */
::-webkit-scrollbar-track {
  background: #a4b1c4; /* 다크 모드에 어울리는 어두운 배경 */
  border-radius: 4px;
}

/* 스크롤바 핸들 (움직이는 부분) */
::-webkit-scrollbar-thumb {
  background: #5a7193; /* 더 밝은 회색 */
  border-radius: 4px;
}

/* 스크롤바 핸들 호버 효과 */
::-webkit-scrollbar-thumb:hover {
  background: #8ba6bd; /* 중간 회색 */
}

.modal-box {
  width: 710px;
  height: 610px;
  position: absolute;
  display: block;
  bottom: 0;
  right: 0;
  z-index: 999999;
  background-color: #212121;
  border: 1px solid var(--gray60);
  box-shadow: 2px 2px 5px 2px black;
}
.modal-box.on {
  width: 100%;
  height: 100%;
}

.modal-title-box > div:nth-child(1) {
  font-size: 16px;
  font-weight: bold;
}

.modal {
  height: 25px;
  width: 100%;
  display: flex;
  box-sizing: border-box;
  justify-content: space-between;
  padding: 0 10px;
  border-bottom: 1px solid #424242;
  align-items: center;
}

.modal-close {
  width: 15px;
  height: 15px;
  border: 1px solid #a9a9a9;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 4px;
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); /* 음영 추가 */
  user-select: none;
  background-color: #e5e3e3;
  font-weight: bold;
  color: #505050;
  margin-left: auto;
}

.modal-close:hover{
  filter: brightness(0.8);
}

#iframeModal {
  /*border-color: var(--gray60);*/
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  /*border-width: 1px;*/
  user-select: none;
  border: none;
}


.sigCustom {
  position: relative;
}

.sigCustom * {
  display: inline-block;
  vertical-align: top;
}

.sigCustom .left {
  background: url("http://t1.daumcdn.net/localimg/localimages/07/2011/map/storeview/tip_l.png") no-repeat;
  display: inline-block;
  height: 24px;
  overflow: hidden;
  vertical-align: top;
  width: 7px;
}

.sigCustom .center {
  background: url(http://t1.daumcdn.net/localimg/localimages/07/2011/map/storeview/tip_bg.png) repeat-x;
  display: inline-block;
  height: 24px;
  font-size: 12px;
  line-height: 24px;
}

.sigCustom .right {
  background: url("http://t1.daumcdn.net/localimg/localimages/07/2011/map/storeview/tip_r.png") -1px 0 no-repeat;
  display: inline-block;
  height: 24px;
  overflow: hidden;
  width: 6px;
}
#tabCont02 table.tableBody thead th {
  font-size: 12px;
}

.gridArea .tableBody tbody td.empty-evp {
  height: 130px;
  text-align: center;
  cursor: default;
  user-select: none;
  font-size: 14px;
}

.empty-history {
  height: calc(100% - 30px);
  display: flex;
  align-items: center;
  justify-content: center;
  user-select: none;
  font-size: 14px;
}


.play-box {
  width: 100%;
  border: solid var(--gray40);
  border-width: 1px 0 0 0;
  padding: 8px 0;
}
#pause.on,
#stop.on,
#play.on {
  cursor: pointer;
}
.play-box > div {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  gap: 5px;
  box-sizing: border-box;
  align-items: center;
}
.formArea .history-btn {
  margin-left: auto;
  padding: 5px 20px;
  background-color: #5b7293;
  color: white;
  border-radius: 5px;
}
.formArea .history-btn:hover{
  filter: brightness(0.8);
  cursor: pointer;
}
#intTree {
  width: 100%;
  height: 100%;
}

.evp-table tr:hover {
  cursor: pointer;
}

.evpContainer {
  width: 100%;
  height: 100%;
  overflow: auto;
}

.cvibDetailFrame {
  width: 665px;
  height: 530px;
}

.bottomInfoTop th,
.crossLoadInfo th {
  border-width: 1px;
  border-color: var(--gray60);
  padding: 0 8px;
  height: 30px;
  background-color: var(--gray80);
  font-size: 12px;
  color: var(--gray5);
  white-space: nowrap;
  border: solid var(--gray60);
  border-width: 1px;
}

.bottomInfoTop td,
.crossLoadInfo td{
  position: relative;
  height: 30px;
  background-color: #fff;
  font-size: 12px;
  color: var(--gray5);
  text-align: center;
  padding: 8px;
  border: solid var(--gray60);
  border-width: 1px;
}

#modalOpen.on {
  width: 100%;
  height: 100%;
}

.error-stat-table,
.error-cnt-table {
  display: none;
}
.error-stat-table.on,
.error-cnt-table.on {
  display: table;
}
.error-container {
  position: relative;
}
.error-container .showLoading {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.1);
  z-index: 3;
}

.pagination.on {
  display: flex;
}
.pagination {
  display: none;
  align-items: center;
  gap: 4px;
  margin-top: 24px;
}
/*.pagination a,*/
.pagination button {
  width: 24px;
  height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
}
.pagination a {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2px 4px;
  min-width: 25px;
  font-size: 12px;
  font-weight: bold;
}
.pagination .arrowBtn {
  display: flex;
  align-items: center;
  gap: 4px;
}
.pagination .arrowBtn button {
  font-size: 0;
  background-size: 24px;
  background-repeat: no-repeat;
}

.pagination .arrowBtn .backEnd {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMCAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE1IDEwTDEwIDE1TDE1IDIwIiBzdHJva2U9IiMyQTJBMkEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPgo8cGF0aCBkPSJNMTkgMTBMMTQgMTVMMTkgMjAiIHN0cm9rZT0iIzJBMkEyQSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+Cjwvc3ZnPgo=");
}
.pagination .arrowBtn .back {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMCAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE3IDEwTDEyIDE1TDE3IDIwIiBzdHJva2U9IiMyQTJBMkEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPgo8L3N2Zz4K");
}
.pagination .arrowBtn .nextEnd {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMCAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE1IDIwTDIwIDE1TDE1IDEwIiBzdHJva2U9IiMyQTJBMkEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPgo8cGF0aCBkPSJNMTEgMjBMMTYgMTVMMTEgMTAiIHN0cm9rZT0iIzJBMkEyQSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+Cjwvc3ZnPgo=");
}
.pagination .arrowBtn .next {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMCAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEzIDIwTDE4IDE1TDEzIDEwIiBzdHJva2U9IiMyQTJBMkEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPgo8L3N2Zz4K");
}
.pagination .pageGroup {
  display: flex;
  align-items: center;
  gap: 8px;
}
.pagination .pageGroup a {
  color: var(--gray10);
}
.pagination .pageGroup .act {
  color: white;
  background-color: var(--navy30);
  border-radius: 5px;
}
.pagination.center {
  justify-content: center;
}
.pagination.right {
  justify-content: right;
}

.pagination.between {
  justify-content: space-between;
}

.pagination .arrowBtn button:disabled {
  opacity: 0.3;
}

.cvibMapAndInfo {
  position: relative;
  width: 100%;
  height: 452px;
  display: flex;
  box-sizing: border-box;
}

.crossLoadMap {
  width: 520px;
  height: 452px;
  border: 1px solid var(--gray60);
}

.mapBox{
  background-image: url(images/cvib/CrossLoadBG.png);
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 500px;
}

.crossLoadInfo {
  width: calc(100% - 520px);
  height: 452px;
  border: 1px solid var(--gray60);
}

.bottomInfo {
  height: 100%;
  width: 100%;
  overflow: auto;
}


.bottomInfo .bottomInfoBottom .bottomInfoBody table tbody tr:nth-child(1) td {
  border-top: 0
}

.crossLoadInfo td.cvibLightsBack_1 {
  background-color: var(--red30);
  color: white;
}

.crossLoadInfo td.cvibLightsBack_2 {
  background-color: #ffff00;
}

.crossLoadInfo td.cvibLightsBack_3 {
  background-color: var(--green30);
  color: white;
}
.crossLoadInfo td.cvibLightsBack_4 {
  animation: redBlink 1s infinite alternate;
}

.crossLoadInfo td.cvibLightsBack_5 {
  animation: yellowBlink 1s infinite alternate;
}
.crossLoadInfo td.cvibLightsBack_6 {
    animation: greenBlink 1s infinite alternate;
}

@keyframes yellowBlink {
  0%, 49% { background-color: #ffff00;}
  50%, 100% { background-color: #FFFFFF;}
}

@keyframes redBlink {
  0%, 49% { background-color: var(--red30);  color: white;}
  50%, 100% { background-color: #FFFFFF; color: black; }
}

@keyframes greenBlink {
  0%, 49% { background-color: var(--green30);  color: white;}
  50%, 100% { background-color: #FFFFFF; color: black; }
}

.bottomInfo .bottomEvent {
  display: none;
  margin: 10px
}

.bottomInfo .bottomEvent .collctDtime img {
  cursor: pointer
}

.bottomInfo .bottomEvent .eventPopListTable {
  margin-top: 10px
}

.bottomInfo .bottomEvent .cvibLoading {
  display: none;
  margin: 0 auto
}

.crossLoadInfo table {
  border-collapse: separate;
  border-spacing: 0;
}

.crossLoadInfo table thead {
  position: sticky;
  top: 0;
  left: 0;
  z-index: 10;
}

.cvibInfoTop {
  display: flex;
  align-items: center;
  gap: 8px;
  border-bottom: 1px solid var(--gray60);
  height: 30px;
  font-size: 16px;
  font-weight: bold;
  padding: 0 10px;
  margin-bottom: 5px;
}

.cvibImgBack {
  background-image: url(/images/cvib/CrossLoadBG.png);
  width:100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 500px;
  background-color: #dbdbdb;
  position: relative;
}
.ic_refresh::before:hover,
.ic_refresh:hover::before {
  background-image: url("/images/arrow-clockwise2.svg");
}
.ic_refresh::before{
  background-image: url("/images/arrow-clockwise.svg");
}


#menu_wrap {
  position: absolute;
  top: 44px;
  left: 8px;
  padding: 5px;
  background: rgba(255, 255, 255, 0.7);
  z-index: 1000000;
  font-size: 12px;
  height: calc(100% - 275px);
  border-radius: 10px;
  width: 330px;
  display: none;
}

#menu_wrap.on {
  display: block;
}

.location_search {display: flex; align-items: center; justify-content: center; padding: 5px 5px 8px 5px; height: 45px; gap:5px; font-weight: bold; border-bottom: 2px solid #cccccc;}
#keyword {height: 25px; width: 180px; padding: 3px 5px; background-color: #eeeeee; border: 1px solid #cccccc;}
#placesList {
  width: 100%;
  height: calc(100% - 77px);
  padding-top: 5px;
  overflow: auto;
}
/* #menu_wrap {position:absolute;top:0;left:0;bottom:0;width:250px;margin:10px 0 30px 10px;padding:5px;overflow-y:auto;background:rgba(255, 255, 255, 0.7);z-index: 1;font-size:12px;border-radius: 10px;} */
.bg_white {background:#fff;}
/* #menu_wrap hr {display: block; height: 1px;border: 0; border-top: 2px solid #5F5F5F;margin:3px 0;} */
#menu_wrap .option{text-align: center;}
#menu_wrap .option p {margin:10px 0;}
#menu_wrap .option button {margin-left:5px;}
#placesList li {list-style: none;}
#placesList .item {position:relative;border-bottom:1px solid #888;overflow: hidden;cursor: pointer;min-height: 65px;}
#placesList .item span {display: block;margin-top:4px;}
#placesList .item h5, #placesList .item .info {text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
#placesList .item .info{padding:10px 0 10px 55px;}
#placesList .info .gray {color:#8a8a8a;}
#placesList .info .jibun {padding-left:26px;background:url(https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/places_jibun.png) no-repeat;}
#placesList .info .tel {color:#009900;}
#placesList .item .markerbg {z-index: 1; float:left;position:absolute;width:36px; height:37px;margin:10px 0 0 10px;background:url(https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/marker_number_blue.png) no-repeat;}
#placesList .item .marker_1 {background-position: 0 -10px;}
#placesList .item .marker_2 {background-position: 0 -56px;}
#placesList .item .marker_3 {background-position: 0 -102px}
#placesList .item .marker_4 {background-position: 0 -148px;}
#placesList .item .marker_5 {background-position: 0 -194px;}
#placesList .item .marker_6 {background-position: 0 -240px;}
#placesList .item .marker_7 {background-position: 0 -286px;}
#placesList .item .marker_8 {background-position: 0 -332px;}
#placesList .item .marker_9 {background-position: 0 -378px;}
#placesList .item .marker_10 {background-position: 0 -423px;}
#placesList .item .marker_11 {background-position: 0 -470px;}
#placesList .item .marker_12 {background-position: 0 -516px;}
#placesList .item .marker_13 {background-position: 0 -562px;}
#placesList .item .marker_14 {background-position: 0 -608px;}
#placesList .item .marker_15 {background-position: 0 -654px;}
#pagination {margin:10px auto;text-align: center;}
#pagination a {display:inline-block;margin-right:10px; text-decoration: none; color: black;}
#pagination .on {font-weight: bold; cursor: default;color:#777; text-decoration: underline;}

.location_search .searchBtn, .coord-btn {
  border: 1px solid #1e65c5;
  background-color: #1e65c5;
  color: white;
  font-weight: bold;
  cursor: pointer;
  border-radius: 5px;
}
.coord-btn{
  padding: 1px 14px;
  font-size: 14px;
}
.location_search .searchBtn {
  padding: 3px 7px;
}

.coordBox {
  background-color: white;
  gap: 10px;
  width: 340px;
  height: 40px;
  align-items: center;
  justify-content: center;
  position: absolute;
  z-index: 9999;
  left: 111px;
  top: 44px;
  border: 1px solid #cccccc;
  color: black;
  border-radius: 5px;
  display: none;
}

.coordinates_box.on {
  display: flex;
}
.coord-unit input {
  padding: 3px 5px;
  /*font-weight: bold;*/
  width: 200px;
  font-size: 12px;
  color: black;
  background-color: #eeeeee;
  height: 25px;
  border: 1px solid #cccccc;
}

#keyword:focus,
.coord-unit input:focus{
  outline: none;
}

.coord-unit {
  display: flex;
  gap: 5px;
  align-items: center;
  font-weight: bold;
  font-size: 12px;
}


.dot {overflow:hidden;float:left;width:12px;height:12px;background: url('https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/mini_circle.png');}
.dotOverlay {position:relative;bottom:10px;border-radius:6px;border: 1px solid #ccc;border-bottom:2px solid #ddd;float:left;font-size:12px;padding:5px;background:#fff;}
.dotOverlay:nth-of-type(n) {border:0; box-shadow:0px 1px 2px #888;}
.number {font-weight:bold;color:#ee6152;}
.dotOverlay:after {content:'';position:absolute;margin-left:-6px;left:50%;bottom:-8px;width:11px;height:8px;background:url('https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/vertex_white_small.png')}
.distanceInfo {position:relative;top:5px;left:5px;list-style:none;margin:0;}
.distanceInfo .label {display:inline-block;width:50px;}
.distanceInfo:after {content:none;}
.textInfo {
  position: relative;
  top: 5px;
  left: 5px;
  border-radius: 6px;
  border: 1px solid #ccc;
  border-bottom: 2px solid #ddd;
  font-weight: bold;
  color: #000000;
  font-size: 12px;
  padding: 5px;
  background: #cccccc;
  list-style: none;
  margin: 0;
}
.square_info {
  position: relative;
  top: 5px;
  left: 5px;
  border-radius: 6px;
  border: 1px solid #ccc;
  border-bottom: 2px solid #ddd;
  font-size: 12px;
  padding: 5px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.square_info .number {
  font-weight:bold;color:#00a0e9;;
}

.history-loading{
  width: 100%;
  height: calc(100% - 30px);
  display: none;
  align-items: center;
  justify-content: center;
}
.gridArea .tableBody thead th:not(.gridArea .tableBody thead th:last-child) {
  border-right: 1px solid var(--line);
}
.int-name > div:nth-child(1) {
  width: 78px;
}
.int-name > div:nth-child(2) {
  width: 160px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}