@charset "utf-8";

/* --- font --- */
@font-face {
  font-family: 'SCD-1';
  src: url('../font/Paperlogy-1Thin.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'SCD-2';
  src: url('../font/Paperlogy-2ExtraLight.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'SCD-3';
  src: url('../font/Paperlogy-3Light.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'SCD-4';
  src: url('../font/Paperlogy-4Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'SCD-5';
  src: url('../font/Paperlogy-5Medium.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'SCD-6';
  src: url('../font/Paperlogy-6SemiBold.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Pretendard-Regular';
  src: url('../font/Pretendard-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'Pretendard-Medium';
  src: url('../font/Pretendard-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'Pretendard-SemiBold';
  src: url('../font/Pretendard-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'Pretendard-Bold';
  src: url('../font/Pretendard-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Pretendard-ExtraBold';
  src: url('../font/Pretendard-ExtraBold.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
}


/* --- icon --- */
@font-face {
  font-family: "unifont";
  src: url('../font/fontello.eot?25674547&bust=210429');
  src: url('../font/fontello.eot?25674547#iefix&bust=210429') format('embedded-opentype'),
  url('../font/fontello.woff?25674547&bust=210429') format('woff'),
  url('../font/fontello.ttf?25674547&bust=210429') format('truetype'),
  url('../font/fontello.svg?25674547#fontello&bust=210429') format('svg');
  font-weight: normal;
  font-style: normal;
}
.unicon {
  font-family: "unifont";
  font-style: normal;
  font-weight: normal;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
[class^="ico-"]:before, [class*=" ico-"]:before {
  font-family: "unifont";
  font-style: normal;
  font-weight: normal;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.ico-uni-approval:before { content: '\e800'; } /* '' */
.ico-uni-arrow-down:before { content: '\e801'; } /* '' */
.ico-uni-arrow-left:before { content: '\e802'; } /* '' */
.ico-uni-arrow-right:before { content: '\e803'; } /* '' */
.ico-uni-arrow-up:before { content: '\e804'; } /* '' */
.ico-uni-calc-receipt:before { content: '\e805'; } /* '' */
.ico-uni-calendar:before { content: '\e806'; } /* '' */
.ico-uni-caution:before { content: '\e807'; } /* '' */
.ico-uni-check:before { content: '\e808'; } /* '' */
.ico-uni-check-receipt:before { content: '\e809'; } /* '' */
.ico-uni-circle:before { content: '\e80a'; } /* '' */
.ico-uni-close:before { content: '\e80b'; } /* '' */
.ico-uni-company-f:before { content: '\e80c'; } /* '' */
.ico-uni-diamond:before { content: '\e80d'; } /* '' */
.ico-uni-diamond-f:before { content: '\e80e'; } /* '' */
.ico-uni-doc:before { content: '\e80f'; } /* '' */
.ico-uni-file:before { content: '\e810'; } /* '' */
.ico-uni-fin:before { content: '\e811'; } /* '' */
.ico-uni-help:before { content: '\e812'; } /* '' */
.ico-uni-help-f:before { content: '\e813'; } /* '' */
.ico-uni-info:before { content: '\e814'; } /* '' */
.ico-uni-main-lc:before { content: '\e815'; } /* '' */
.ico-uni-cart-check:before { content: '\e816'; } /* '' */
.ico-uni-main-approval:before { content: '\e817'; } /* '' */
.ico-uni-main-pds:before { content: '\e818'; } /* '' */
.ico-uni-main-pes:before { content: '\e819'; } /* '' */
.ico-uni-manage:before { content: '\e81a'; } /* '' */
.ico-uni-manage-alarm:before { content: '\e81b'; } /* '' */
.ico-uni-manage-client:before { content: '\e81c'; } /* '' */
.ico-uni-manage-doc:before { content: '\e81d'; } /* '' */
.ico-uni-manage-hand:before { content: '\e81e'; } /* '' */
.ico-uni-manage-monitor:before { content: '\e81f'; } /* '' */
.ico-uni-manage-order:before { content: '\e820'; } /* '' */
.ico-uni-manage-pds:before { content: '\e821'; } /* '' */
.ico-uni-manage-user:before { content: '\e822'; } /* '' */
.ico-uni-minus:before { content: '\e823'; } /* '' */
.ico-uni-monitor:before { content: '\e824'; } /* '' */
.ico-uni-move:before { content: '\e825'; } /* '' */
.ico-uni-org-chart:before { content: '\e826'; } /* '' */
.ico-uni-pin:before { content: '\e827'; } /* '' */
.ico-uni-pin-f:before { content: '\e828'; } /* '' */
.ico-uni-plus:before { content: '\e829'; } /* '' */
.ico-uni-popup:before { content: '\e82a'; } /* '' */
.ico-uni-progress:before { content: '\e82b'; } /* '' */
.ico-uni-purchase:before { content: '\e82c'; } /* '' */
.ico-uni-receipt:before { content: '\e82d'; } /* '' */
.ico-uni-ref:before { content: '\e82e'; } /* '' */
.ico-uni-report:before { content: '\e82f'; } /* '' */
.ico-uni-retrieve:before { content: '\e830'; } /* '' */
.ico-uni-sales:before { content: '\e831'; } /* '' */
.ico-uni-search:before { content: '\e832'; } /* '' */
.ico-uni-set:before { content: '\e833'; } /* '' */
.ico-uni-set-approval:before { content: '\e834'; } /* '' */
.ico-uni-storage:before { content: '\e835'; } /* '' */
.ico-uni-supply:before { content: '\e836'; } /* '' */
.ico-uni-thumb-user:before { content: '\e837'; } /* '' */
.ico-uni-thumb-user02:before { content: '\e838'; } /* '' */
.ico-uni-thumb-user03:before { content: '\e839'; } /* '' */
.ico-uni-thumb-user04:before { content: '\e83a'; } /* '' */
.ico-uni-upload:before { content: '\e83b'; } /* '' */
.ico-uni-user:before { content: '\e83c'; } /* '' */
.ico-uni-user02:before { content: '\e83d'; } /* '' */
.ico-uni-user02-f:before { content: '\e83e'; } /* '' */
.ico-uni-user-f:before { content: '\e83f'; } /* '' */
.ico-uni-view-receipt:before { content: '\e840'; } /* '' */
.ico-uni-wallet:before { content: '\e841'; } /* '' */
.ico-uni-write:before { content: '\e842'; } /* '' */
.ico-uni-write-f:before { content: '\e843'; } /* '' */
.ico-uni-confirm:before { content: '\e844'; } /* '' */
.ico-uni-confirm-f:before { content: '\e845'; } /* '' */
.ico-uni-write-modify:before { content: '\e846'; } /* '' */
.ico-uni-turn:before { content: '\e847'; } /* '' */
.ico-uni-doc-empty:before { content: '\e848'; } /* '' */
.ico-uni-img:before { content: '\e849'; } /* '' */
.ico-uni-arrow-line-down:before { content: '\e84a'; } /* '' */
.ico-uni-arrow-line-left:before { content: '\e84b'; } /* '' */
.ico-uni-arrow-line-right:before { content: '\e84c'; } /* '' */
.ico-uni-arrow-line-up:before { content: '\e84d'; } /* '' */
.ico-uni-card1:before { content: '\e84e'; } /* '' */
.ico-uni-card2:before { content: '\e84f'; } /* '' */
.ico-uni-cards:before { content: '\e850'; } /* '' */
.ico-uni-download:before { content: '\e851'; } /* '' */
.ico-uni-img-empty:before { content: '\e852'; } /* '' */
.ico-uni-receipt-f:before { content: '\e853'; } /* '' */
.ico-uni-view-detail-f:before { content: '\e854'; } /* '' */
.ico-uni-downsize-f:before { content: '\e855'; } /* '' */
.ico-uni-upsize-f:before { content: '\e856'; } /* '' */
.ico-uni-downsize:before { content: '\e857'; } /* '' */
.ico-uni-upsize:before { content: '\e858'; } /* '' */
.ico-uni-globe-f:before { content: '\e859'; } /* '' */
.ico-uni-folder-f:before { content: '\e85a'; } /* '' */
.ico-uni-folder-open-f:before { content: '\e85b'; } /* '' */
.ico-uni-content-empty:before { content: '\e85c'; } /* '' */
.ico-uni-excel1:before { content: '\e85d'; } /* '' */
.ico-uni-excel2:before { content: '\e85e'; } /* '' */
.ico-uni-excel3:before { content: '\e85f'; } /* '' */
.ico-uni-lock:before { content: '\e860'; } /* '' */
.ico-uni-unlock:before { content: '\e861'; } /* '' */
.ico-uni-user-business:before { content: '\e862'; } /* '' */
.ico-uni-mail:before { content: '\e863'; } /* '' */
.ico-uni-find-pw:before { content: '\e864'; } /* '' */
.ico-uni-caution02:before { content: '\e865'; } /* '' */
.ico-uni-caution02-f:before { content: '\e866'; } /* '' */
.ico-uni-clock:before { content: '\e867'; } /* '' */
.ico-uni-timer1:before { content: '\e868'; } /* '' */
.ico-uni-timer2:before { content: '\e869'; } /* '' */
.ico-uni-graph:before { content: '\e86a'; } /* '' */
.ico-uni-graph-f:before { content: '\e86b'; } /* '' */
.ico-uni-main-econ:before { content: '\e86c'; } /* '' */
.ico-uni-main-tax:before { content: '\e86d'; } /* '' */
.ico-uni-trash:before { content: '\e86e'; } /* '' */
.ico-uni-download-doc:before { content: '\e86f'; } /* '' */
.ico-uni-no-doc1:before { content: '\e870'; } /* '' */
.ico-uni-no-doc2:before { content: '\e871'; } /* '' */
.ico-uni-service-link1:before { content: '\e872'; } /* '' */
.ico-uni-service-link2:before { content: '\e873'; } /* '' */
.ico-uni-service-link3:before { content: '\e874'; } /* '' */
.ico-uni-service-link4:before { content: '\e875'; } /* '' */
.ico-uni-speech-bubble:before { content: '\e876'; } /* '' */
.ico-uni-speech-bubble-f:before { content: '\e877'; } /* '' */
.ico-uni-coin1:before { content: '\e878'; } /* '' */
.ico-uni-user-smile:before { content: '\e879'; } /* '' */
.ico-uni-user-smile-plus:before { content: '\e87a'; } /* '' */
.ico-uni-user-smile-check:before { content: '\e87b'; } /* '' */
.ico-uni-user-smile-talk:before { content: '\e87c'; } /* '' */
.ico-uni-protect:before { content: '\e87d'; } /* '' */
.ico-uni-doc-talk:before { content: '\e87e'; } /* '' */
.ico-uni-doc-user-smile:before { content: '\e87f'; } /* '' */
.ico-uni-doc-noti:before { content: '\e880'; } /* '' */
.ico-uni-doc-qna:before { content: '\e881'; } /* '' */
.ico-uni-cancle:before { content: '\e882'; } /* '' */
.ico-uni-cancle-f:before { content: '\e883'; } /* '' */
.ico-uni-pen:before { content: '\e884'; } /* '' */
.ico-uni-pen2:before { content: '\e885'; } /* '' */
.ico-uni-pen-f:before { content: '\e886'; } /* '' */
.ico-uni-calc-check:before { content: '\e887'; } /* '' */
.ico-uni-doc-check:before { content: '\e888'; } /* '' */
.ico-uni-doc-plus:before { content: '\e889'; } /* '' */
.ico-uni-card-user:before { content: '\e88a'; } /* '' */
.ico-uni-card-company:before { content: '\e88b'; } /* '' */
.ico-uni-temp-col1:before { content: '\e88c'; } /* '' */
.ico-uni-temp-col2-h:before { content: '\e88d'; } /* '' */
.ico-uni-temp-col2-v:before { content: '\e88e'; } /* '' */
.ico-uni-temp-col4:before { content: '\e88f'; } /* '' */
.ico-uni-arrow-first:before { content: '\e890'; } /* '' */
.ico-uni-arrow-last:before { content: '\e891'; } /* '' */
.ico-uni-manage-user2:before { content: '\e892'; } /* '' */
.ico-uni-manage-site:before { content: '\e893'; } /* '' */
.ico-uni-manage-org-chart:before { content: '\e894'; } /* '' */
.ico-uni-manage-org-chart2:before { content: '\e895'; } /* '' */
.ico-uni-home:before { content: '\e896'; } /* '' */
.ico-uni-refresh:before { content: '\e897'; } /* '' */
.ico-uni-menu:before { content: '\e898'; } /* '' */
.ico-uni-camera:before { content: '\e899'; } /* '' */
.ico-uni-camera-f:before { content: '\e89a'; } /* '' */
.ico-uni-rotate:before { content: '\e89b'; } /* '' */
.ico-uni-money:before { content: '\e89c'; } /* '' */
.ico-uni-trash-check:before { content: '\e89d'; } /* '' */
.ico-uni-add:before { content: '\e89e'; } /* '' */
.ico-uni-add-f:before { content: '\e89f'; } /* '' */
.ico-uni-subtract:before { content: '\e8a0'; } /* '' */
.ico-uni-subtract-f:before { content: '\e8a1'; } /* '' */
.ico-uni-company2:before { content: '\e8a2'; } /* '' */
.ico-uni-company2-f:before { content: '\e8a3'; } /* '' */
.ico-uni-receipt2:before { content: '\e8a4'; } /* '' */
.ico-uni-receipt2-f:before { content: '\e8a5'; } /* '' */
.ico-uni-user-doc:before { content: '\e8a6'; } /* '' */
.ico-uni-position-top:before { content: '\e8a7'; } /* '' */
.ico-uni-position-left:before { content: '\e8a8'; } /* '' */
.ico-uni-position-right:before { content: '\e8a9'; } /* '' */
.ico-uni-more-f:before { content: '\e8aa'; } /* '' */
.ico-uni-more:before { content: '\e8ab'; } /* '' */
.ico-uni-main-unidocu:before { content: '\e8ac'; } /* '' */
.ico-uni-main-unidocu-off:before { content: '\e8ad'; } /* '' */
.ico-uni-no-receipt1:before { content: '\e8ae'; } /* '' */
.ico-uni-no-receipt2:before { content: '\e8af'; } /* '' */
.ico-uni-no-receipt3:before { content: '\e8b0'; } /* '' */
.ico-uni-monitor2:before { content: '\e8b1'; } /* '' */
.ico-uni-coin2:before { content: '\e8b2'; } /* '' */
.ico-uni-doc-coin:before { content: '\e8b3'; } /* '' */
.ico-uni-cloud:before { content: '\e8b4'; } /* '' */
.ico-uni-cloud-arrow:before { content: '\e8b5'; } /* '' */
.ico-uni-check-bold-f:before { content: '\e8b6'; } /* '' */
.ico-uni-check-bold:before { content: '\e8b7'; } /* '' */
.ico-uni-face-normal:before { content: '\e8b8'; } /* '' */
.ico-uni-face-bad:before { content: '\e8b9'; } /* '' */
.ico-uni-face-good:before { content: '\e8ba'; } /* '' */
.ico-uni-upload2:before { content: '\e8bb'; } /* '' */
.ico-uni-upload3:before { content: '\e8bc'; } /* '' */
.ico-uni-upload4:before { content: '\e8bd'; } /* '' */
.ico-uni-main-salescon:before { content: '\e8be'; } /* '' */
.ico-uni-logo-symbol:before { content: '\e8bf'; } /* '' */
.ico-uni-logo-symbol-line:before { content: '\e8c0'; } /* '' */
.ico-uni-main-avs:before { content: '\e8c1'; } /* '' */
.ico-uni-manage-time:before { content: '\e8c2'; } /* '' */
.ico-uni-clock2:before { content: '\e8c3'; } /* '' */
.ico-uni-arrow-right2:before { content: '\e8c4'; } /* '' */
.ico-uni-arrow-right2-f:before { content: '\e8c5'; } /* '' */
.ico-uni-arrow-up2:before { content: '\e8c6'; } /* '' */
.ico-uni-arrow-up2-f:before { content: '\e8c7'; } /* '' */
.ico-uni-arrow-down2:before { content: '\e8c8'; } /* '' */
.ico-uni-arrow-down2-f:before { content: '\e8c9'; } /* '' */
.ico-uni-arrow-left2:before { content: '\e8ca'; } /* '' */
.ico-uni-arrow-left2-f:before { content: '\e8cb'; } /* '' */
.ico-uni-manage-write:before { content: '\e8cc'; } /* '' */
.ico-uni-clock-bold-f:before { content: '\e8cd'; } /* '' */
.ico-uni-clock-bold:before { content: '\e8ce'; } /* '' */
.ico-uni-users01-f:before { content: '\e8cf'; } /* '' */
.ico-uni-users02-f:before { content: '\e8d0'; } /* '' */
.ico-uni-users03-f:before { content: '\e8d1'; } /* '' */
.ico-uni-theme-line:before { content: '\e8d2'; } /* '' */
.ico-uni-theme-rectangle:before { content: '\e8d3'; } /* '' */
.ico-uni-money-in:before { content: '\e8d4'; } /* '' */
.ico-uni-money-out:before { content: '\e8d5'; } /* '' */
.ico-uni-report-user:before { content: '\e8d6'; } /* '' */
.ico-uni-box:before { content: '\e8d7'; } /* '' */
.ico-uni-purchase2:before { content: '\e8d8'; } /* '' */
.ico-uni-money-in-out:before { content: '\e8d9'; } /* '' */
.ico-uni-graph-up:before { content: '\e8da'; } /* '' */
.ico-uni-no-receipt4:before { content: '\e8db'; } /* '' */
.ico-uni-no-receipt4-f:before { content: '\e8dc'; } /* '' */
.ico-uni-doc-receive:before { content: '\e8dd'; } /* '' */
.ico-uni-print:before { content: '\e8de'; } /* '' */
.ico-uni-print-f:before { content: '\e8df'; } /* '' */
.ico-uni-print2:before { content: '\e8e0'; } /* '' */
.ico-uni-docs:before { content: '\e8e1'; } /* '' */
.ico-uni-doc-storage-check:before { content: '\e8e2'; } /* '' */
.ico-uni-doc-storage-plus:before { content: '\e8e3'; } /* '' */
.ico-uni-folder-doc:before { content: '\e8e4'; } /* '' */
.ico-uni-list:before { content: '\e8e5'; } /* '' */
.ico-uni-preview:before { content: '\e8e6'; } /* '' */
.ico-uni-preview2:before { content: '\e8e7'; } /* '' */
.ico-uni-list2:before { content: '\e8e8'; } /* '' */
.ico-uni-home2:before { content: '\e8e9'; } /* '' */
.ico-uni-home3:before { content: '\e8ea'; } /* '' */
.ico-uni-home4:before { content: '\e8eb'; } /* '' */
.ico-uni-home5:before { content: '\e8ec'; } /* '' */
.ico-uni-home6:before { content: '\e8ed'; } /* '' */
.ico-uni-doc-storage-upload:before { content: '\e8ee'; } /* '' */
.ico-uni-manage-doc2:before { content: '\e8ef'; } /* '' */
.ico-uni-signature:before { content: '\e8f0'; } /* '' */
.ico-uni-certificate:before { content: '\e8f1'; } /* '' */
.ico-uni-certificate2:before { content: '\e8f2'; } /* '' */
.ico-uni-main-wps:before { content: '\e8f3'; } /* '' */
.ico-uni-mobile:before { content: '\e8f4'; } /* '' */
.ico-uni-telephone:before { content: '\e8f5'; } /* '' */
.ico-uni-main-community:before { content: '\e8f6'; } /* '' */
.ico-uni-doc-tax-money:before { content: '\e8f7'; } /* '' */


/* --- reset --- */
html, body {overflow: auto;}
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
button,
fieldset, form, label, legend, select, option,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, nav, nav, section, summary,
time, mark, audio, video {
  font-family: "Pretendard-Regular", "Roboto", "Helvetica Neue", Helvetica, Sans-serif;
  margin:0;
  padding:0;
  border:0 none;
  outline:0;
  background:transparent;
  -webkit-print-color-adjust:exact;
  print-color-adjust: exact;
}
dl, ul, ol, nav, li {list-style:none;}
img {
  border: 0;
  vertical-align: middle;
}
table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  background-color: #fff;
}
table caption {display: none;}
a:link, a:visited {
  color: #222;
  text-decoration: none;
}
button {
  border-radius: 12px;
  cursor: pointer;
}
input[disabled],
input.disabled,
fieldset[disabled],
fieldset.disabled,
select[disabled],
select.disabled,
textarea[disabled],
textarea.disabled,
.inp.disabled,
.slt.disabled,
.slt-area.disabled input.mobi-select,
.mobi-select.disabled {
  background-color: #eee;
  opacity: 1;
}
textarea {resize: none;}
fieldset {border: 0;}
legend {display: none;}
select {
  -webkit-appearance:none;
  -moz-appearance:none;
  -o-appearance:none;
  appearance:none;
}
select::-ms-expand{display:none;}
input,
textarea {font-family: Pretendard-Regular !important;}


/* --- body --- */
html, body {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
html::-webkit-scrollbar,
body::-webkit-scrollbar {
  display: none;
}
html {font-size: 100%;}
body {
  margin: 0;
  padding: 0;
  letter-spacing: -0.01em;
  font-family: "Pretendard-Regular", "Roboto", "Helvetica Neue", Helvetica, Sans-serif;
  color: #222;
  background-color: #F1F1F5;
  -webkit-font-smoothing: subpixel-antialiased;
}
.wrap {
  position: relative;
  height: calc(100vh - 3.75rem);
  font-size: 16px;
}
/* .wrap.home {height: calc(100vh - 3.75rem);} */
.wrap.login,
.wrap.err {
  height: 100vh;
}

/* --- 공통 --- */
/* 입력 스타일 기본 */
.edit .content-area {
  background-color: #fff !important;
}

.form-set .board-area dl {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  padding: 0 20px 16px;
  background-color: #fff;
}
.form-set .board-area dl dt {
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
  min-height: 52px;
  font-family: 'Pretendard-SemiBold';
  font-size: 17px;
  color: #222;
}
.form-set .board-area dl dt .tt {
  font-family: 'Pretendard-SemiBold';
  font-size: 17px;
  color: #222;
}
.form-set .board-area dl dt .tt-explain {
  position: relative;
  top: 1px;
  margin-left: auto;
  font-size: 14px;
  color: #888;
}
.form-set .board-area dl dt .tt-explain.left {margin-left: 12px;}
.form-set .board-area dl dt .checkbox-area {
  position: absolute;
  right: 12px;
  top: auto;
}
.form-set .board-area dl dd {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}
.form-set .board-area dl dd.dd-50 {width: 50%;}
.form-set .board-area dl dd.data-area {
  justify-content: center;
  height: 40px;
  padding: 0 10px;
  border-radius: 4px;
  background-color: rgba(233,234,239,.2);
  box-sizing: border-box;
}
.form-set .board-area dl dd.data-area.auto-h {
  height: auto;
  padding: 10px;
  line-height: 22px;
}
.form-set .board-area dl dd.data-area p:has(.mark-ref) {padding-left: 18px;}
.form-set .board-area dl dd.data-area p .mark-ref {position: relative;}
.form-set .board-area dl dd.data-area p .mark-ref::before {
  position: absolute;
  left: -18px;
  content: '※';
  font-family: "Roboto", "Helvetica Neue", Helvetica, sans-serif;
  font-size: 14px;
}
.form-set .board-area dl dd .board-explain {margin-top: 4px;}
.form-set .board-area dl dd + dd.in-explain {
  margin-top: 8px;
  padding-left: 10px;
  line-height: 20px;
  text-indent: -10px;
  box-sizing: border-box;
}
.form-set .board-area dl.in-dd-50 {
  justify-content: space-between;
  flex-direction: row;
  flex-wrap: wrap;
}
.form-set .board-area dl.in-dd-50 .dd-50 {width: calc(50% - 4px);}
.form-set .board-area dl.in-write-pop {padding: 0 20px 16px;}
.form-set .board-area dl.in-write-pop .red-star::before {display: none;}
.form-set .board-area dl.in-write-pop dt,
.form-set .board-area dl.in-write-pop dd {
  width: 100%;
}
.form-set .board-area dl.in-write-pop dt {padding: 0;}
.form-set .board-area dl.in-write-pop dd {
  padding: 0;
  background-color: inherit;
}
.form-set .board-area dl dd textarea,
.modal-set.bottom .form-set .board-area dl dd textarea {
  height: 114px;
  padding: 10px 16px;
  /* -webkit-line-clamp: 4; */
}
.form-set .board-area dl.in-write-pop dd textarea {
  height: 114px;
  padding: 10px 48px 10px 16px;
  -webkit-line-clamp: 4;
}
.modal-set.bottom .form-set .board-area dl.in-write-pop dd textarea {
  padding: 10px 16px;
  -webkit-line-clamp: none;
}
.form-set .board-area dl.in-write-pop dd > i {
  position: absolute;
  top: 0;
  right: 0;
  width: 48px;
  height: 114px;
  background-color: rgba(14, 92, 233, 0.04);
}
.form-set .board-area dl.in-write-pop dd > i::before {
  position: absolute;
  bottom: 12px;
  right: 10px;
  width: 24px;
  height: 24px;
  content: '';
  background: url('../images/ico-textarea.svg') 50% 50% no-repeat;
  background-size: 100%;
  opacity: .3;
}
.form-set .board-area dl dd .toggle-area {
  position: relative;
  top: auto;
  right: auto;
  width: auto;
}
.red-star + * .inp,
.red-star + * .slt {
  box-sizing: border-box;
}
.form-set .board-area dl dt.red-star::before {display: none;}
.form-set .board-area dl dt.red-star::after,
.form-set .board-area dl dt.red-star.in-explain .tt::after {
  position: relative;
  top: -4px;
  left: 4px;
  content: '*';
  line-height: 0;
  font-size: 18px;
  color: #FF6225;
}
.form-set .board-area dl dt.red-star.in-explain::after {display: none;}
.form-set .board-area dl dt .btn-area {margin-left: auto;}
.form-set .board-area dl dt .btn-area a {position: relative;}
.form-set .board-area dl dt .btn-area a i {
  width: 24px;
  height: 24px;
  vertical-align: middle;
  font-size: 24px;
}
.form-set .board-area dl dt .btn-area a i::before {
  width: 100%;
  height: 100%;
  content: '';
}
.form-set .board-area dl dt .btn-area a i.ico-uni-camera::before {
  background: url('../images/ico-camera.svg') 50% 50% no-repeat;
  background-size: 22px;
}
.form-set .board-area dl dt .btn-area a i.ico-uni-file::before {
  background: url('../images/ico-file.svg') 50% 50% no-repeat;
  background-size: 16px;
}
.form-set .board-area .add-period-area dd.in-slt-btn-set + dd.in-slt-btn-set {margin-top: 12px;}
.form-set .board-area .add-period-area dd.in-slt-btn-set .btn-area {
  top: calc(50% - 12px);
  right: 0;
}
.form-set .board-area .add-period-area dd.in-slt-btn-set .slt-set {width: calc(100% - 68px);}
.modal-set .form-set .board-area {
  padding: 28px 0 8px;
  border-top: 1px solid #eee;
}
.modal-set .form-set .board-area:has(dl.in-write-pop) {
  padding-top: 0;
  border-top: 0;
}
.modal-set .form-set .board-area dl {
  min-height: 40px;
  padding: 0 0 20px;
}
.modal-set .form-set .board-area:has(dl:first-child.column) {padding-top: 4px;}
.modal-set .form-set .board-area dl.column {height: inherit;}
.modal-set .form-set .board-area dl + dl.column:has(dt:not([style*="display: none"])) {margin-top: -8px;}
.modal-set .form-set .board-area dl:not(.column),
.form-set.write .board-area dl.row {
  flex-direction: row;
}
.modal-set .form-set .board-area dl:not(.column) dt {
  width: 100px;
  min-height: inherit;
}
.form-set.write .board-area dl.row {
  align-items: center;
  min-height: 52px;
}
.form-set.write .board-area dl.row dt {min-height: inherit;}
.form-set.write .board-area dl.row dd {align-items: flex-end;}
.form-set.write .board-area dl dd.row {flex-direction: row;}
.form-set.write .board-area .in-editor {
  margin-top: -8px;
  padding: 0 20px 16px !important;
}
.form-set.write .board-area .in-editor .tox-tinymce {
  border-color: #ddd;
  border-radius: 4px;
}
.form-set.write .board-area .in-editor .tox *:not(svg):not(rect) {color: #222;}
.form-set.write .board-area .in-editor .tox .tox-tbtn svg {fill: #222;}
.tox-statusbar:has(.tox-statusbar__path:empty) {
  height: 0;
  border: 0;
}
.wrap .content-area.form-set.note-view {
  margin: 60px 0 0;
  padding: 32px;
  background-color: rgba(14, 92, 233, 0.04);
}
.form-set.note-view .write-pop-area {height: calc(100vh - 124px);}
.form-set.note-view .write-pop-area textarea {
  height: auto;
  min-height: 212px;
  padding: 10px 20px;
  line-height: 32px;
  border: 1px solid #ddd;
  background: none;
  background-color: #fff;
}

/* 자원예약 */
.form-set .board-area {
  font-family: 'Pretendard-Bold';
  background-color: #fff;
}
.form-set .board-area dl dt.red-star::before {display: none;}
.form-set .board-area dl dt.red-star::after,
.form-set .board-area dl dt.red-star.in-explain .tt::after {
  position: relative;
  top: -4px;
  left: 4px;
  content: '*';
  line-height: 0;
  font-size: 18px;
  color: #FF6225;
}

/* 비밀번호 확인 */
.modal-set.modal-confirm-pw .form-set .board-area {
  margin: 20px 0 28px;
  padding: 0;
  border: 0;
}
.modal-set.modal-confirm-pw .form-set .board-area .inp-area {width: 100%;}


/* --- 상단 --- */
/* - 전체 홈 - */
.home .header {
  display: flex;
  align-items: center;
  padding: 0 1.5rem;
  box-shadow: 0 1px 20px rgba(0,0,0,.08);
  box-sizing: border-box;
}
.home .header .logo-area {
  overflow: hidden;
  max-width: calc(100% - 6.2rem);
  margin-top: 2px;
}
.home .header .logo-area img {
  width: 5.8rem;
  height: 1.75rem;
}
.home .header .btn-area.right {
  position: static;
  top: auto;
  right: auto;
  margin-left: auto;
}
.home .header .btn-area.right a {
  width: auto;
  height: auto;
}

/* - 로그인 - */
.login .header {
  position: static;
  top: 0;
  left: 0;
  width: 100%;
  height: 12rem;
  padding-top: 5rem;
  background-color: #fff;
  border-bottom: none;
}
.login.admin .header {height: 10.3rem;}
.login .header .logo-area {text-align: center;}
.login .header .logo-area p {
  margin: 2.25rem 1.2rem 0;
  padding: 0.35rem 0;
  letter-spacing: 0.15em;
  font-family: "Pretendard-Regular";
  font-size: 0.85rem;
  color: #aaa;
  background-color: rgba(255,255,255,.1);
}
.login .header .logo-area img {
  width: auto;
  max-width: 11rem;
  max-height: 4.5rem;
  margin-left: 1rem;
}
html:has(.login),
body:has(.login) {
  background-color: #fff !important;
  overflow: hidden !important;
  height: 100% !important;
}
/* - 기본 - */
.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 3.75rem;
  text-align: center;
  border-bottom: 1px solid #eee;
  background-color: #fff;
  box-sizing: border-box;
  z-index: 15;
  box-shadow: 0 1px 20px rgba(0,8,22,.08);
}
.header .header-tt {
  display: inline-block;
  height: 3.75rem;
  vertical-align: top;
  font-family: 'Pretendard-Bold';
  font-weight: normal;
  line-height: 3.75rem;
  margin-left : -1.125rem;
  font-size: 1.25rem;
  width: 60%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.header .header-tt::before {
  display: inline-flex;
  position: relative;
  top: -1px;
  width: 9px;
  height: 9px;
  margin-right: 8px;
  vertical-align: middle;
  content: '';
  border-radius: 50%;
  background-color: transparent;
}
.approval .header .header-tt::before {background-color: #ff8b00;}
.community .header .header-tt::before {background-color: #6dc34a;}
.reservation .header .header-tt::before {background-color: #6dc34a;}
.header .header-tt span {
  margin-left: 0.125rem;
  font-size: 1.05rem;
  color: #999;
}
.header .btn-area {position: relative;}
.header .btn-area.left {
  align-items: center;
  position: absolute;
  top: 0;
  left: 12px;
  height: 100%;
  line-height: 0;
}
.header .btn-area.right {
  align-items: center;
  position: absolute;
  top: 0;
  right: 12px;
  height: 100%;
  line-height: 0;
}
.header .btn-area a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: 60px;
}
.header .btn-area a + a {margin-left: 0.2rem;}
.header .btn-area a i {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 100%;
  /*opacity: .5;*/
}
.header .btn-area a i::before {
  width: 100%;
  height: 100%;
  content: '';
}
.header .btn-area a i.ico-uni-close::before {
  background: url('../images/btn-ico-close.svg') 50% 50% no-repeat;
  background-size: 16px;
}
.header .btn-area a i.ico-uni-arrow-left::before {
  background: url('../images/btn-ico-arrow.svg') 50% 50% no-repeat;
  background-size: auto 16px;
}
.header .btn-area a i.ico-uni-search::before {
  background: url('../images/ico-search.svg') 50% 50% no-repeat;
  background-size: auto 18px;
}
.header .btn-area a i.ico-uni-menu::before {
  background: url('../images/btn-ico-menu.svg') 50% 50% no-repeat;
  background-size: auto 16px;
}
.header .btn-area a i.ico-uni-refresh::before {
  background: url('../images/btn-ico-refresh.svg') 50% 50% no-repeat;
  background-size: auto 18px;
}


/* 더보기 메뉴 추가 */
.header .add-menu {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  padding-top: 3.4rem;
  background-color: rgb(255, 255, 255);
  box-sizing: border-box;
}
.header .add-menu .btn-area {top: 0.85rem;}
.header .add-menu .btn-area .btn-close {
  position: relative;
  display: inline-block;
  width: 1.9rem;
  height: 1.9rem;
  line-height: 0;
  background-color: #000;
  border-radius: 50%;
}
.header .add-menu .btn-area .btn-close i {
  vertical-align: sub;
  font-size: 1.15rem;
  color: #fff;
}
.header .add-menu .btn-area .btn-close i::before {font-weight: bold;}
.header .add-menu ul {
  margin: 0 1.2rem;
  background-color: #fff;
  border-radius: 1.2rem;
}
.header .add-menu ul li + li {border-top: 1px solid rgba(0,0,0,.05);}
.header .add-menu ul li > * {
  display: block;
  width: 100%;
  padding: 0.6rem 0;
  font-size: 0.95rem;
}


/* --- 메뉴(공통) --- */
.wrap.menu {height: calc(100vh - 6.85rem);}
.wrap.menu.on {
  overflow: auto;
  display: block;
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 1000;
  background-color: #F1F1F5;
}
.menu .header .user-area {
  position: relative;
  padding: 12px;
  background-color: #F1F1F5;
}
.menu .header .user-area .user-name {
  overflow: hidden;
  display: flex;
  align-items: center;
  width: calc(100% - 40px);
  height: 52px;
  padding: 0 20px;
  text-align: left;
  font-family: 'Pretendard-SemiBold';
  font-size: 17px;
  border-radius: 20px;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  background-color: rgba(255,255,255,.5);
}
.menu .header .user-area .user-name a {margin-left: auto;}
.menu .header .user-area .user-name a i {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 24px;
  height: 24px;
  background: url('../images/ico-set.svg') 50% 50% no-repeat;
}
.menu .header .user-area .user-name a i::before {display: none;}
.menu .menu-area {
  margin: 136px 12px 0;
  padding-bottom: 12px;
}
.menu .menu-area .quick + .menu-dp1,
.menu .menu-area .menu-dp1 + .menu-dp1,
.menu .menu-area .menu-dp1 > li + li {margin-top: 12px;}
.menu .menu-area .quick > li > a,
.menu .menu-area .menu-dp1 > li > a {
  display: flex;
  align-items: center;
  height: 52px;
  padding: 0 20px;
}
.menu .menu-area .quick > li,
.menu .menu-area .quick > li > a,
.menu .menu-area .menu-dp1 > li.my-menu,
.menu .menu-area .menu-dp1 > li.my-menu > a {background-color: #fffde8;}
.menu .menu-area .quick > li,
.menu .menu-area .menu-dp1 > li {
  border-radius: 20px;
  background-color: #fff;
}
.menu .menu-area .menu-dp1 > li > a {
  font-family: 'Pretendard-SemiBold';
  font-size: 17px;
}
.menu .menu-area .menu-dp2 {
  padding: 12px 0;
  border-top: 1px solid #eee;
}
.menu .menu-area .menu-dp2 li a {
  position: relative;
  display: flex;
  align-items: center;
  height: 40px;
  padding: 0 20px 0 32px;
  font-family: 'Pretendard-Medium';
  color: #555;
}
.menu .menu-area .menu-dp2 li a::before {
  position: absolute;
  top: calc(50% - 3px);
  left: 20px;
  display: inline-block;
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: #ddd;
}
.menu .menu-area .menu-dp2 li a .badge-num {
  display: inline-block;
  height: 17px;
  margin: 0.16px 0 0 11px;
  padding: 0 8px;
  vertical-align: text-top;
  line-height: 20px;
  font-size: 12px;
  color: #fff;
  border-radius: 13px;
  background-color: #FF6225;
}

/* --- 전체 홈 --- */
/* .no-scroll::-webkit-scrollbar {display: none;} */
.home .content-area {padding-bottom: 4rem;}
.content-area.form-slt-user {
  background-color: #fff;
}
.content-box .btn-area.right {
  margin-top: -0.2rem;
  margin-left: auto;
}
.content-box .btn-area .btn-txt {
  /* display: flex;
  align-items: center; */
  display: inline-block;
  vertical-align: top;
  height: 1.4rem;
  padding: 0 0.375rem;
  line-height: 1.375rem;
  font-size: 14px;
  color: #222;
  border: 1px solid #222;
  border-radius: 12px;
  box-sizing: border-box;
}
.content-box .content-box-tt {
  display: flex;
  align-items: center;
  margin-bottom: 1.25rem;
}
.content-box .content-box-tt h3 {
  display: flex;
  align-items: center;
  font-weight: normal;
  font-family: 'Pretendard-SemiBold';
  font-size: 18px;
}
.home .my-board .user-info {
  display: flex;
  margin-bottom: 1.5rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid #e4e5ea;
}

.home .my-board .user-info .info-area {
  display: flex;
  justify-content: center;
  flex-direction: column;
}
.home .my-board .user-info .info-area .user-name {
  font-family: 'Pretendard-Medium';
  font-size: 1.0625rem;
}
.home .my-board .user-info .info-area .team-name {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #999;
}
.home .my-board .user-info .btn-area {margin-top: 0.25rem;}

.home .my-board .user-info .slt-area {
  margin-top : 10px;
}

.home .my-board .noti-list ul li {
  display: flex;
  align-items: center;
  font-size: 0.9375rem;
}
.home .my-board .noti-list ul li + li {margin-top: 0.75rem;}
.home .my-board .noti-list ul li .li-badge {
  /* display: flex;
  align-items: center;
  justify-content: center; */
  display: inline-block;
  vertical-align: baseline;
  text-align: center;
  width: 4.25rem;
  height: 1.875rem;
  margin-right: 1.25rem;
  line-height: 1.875rem;
  font-size: 0.8125rem;
  border-radius: 0.75rem;
  box-sizing: border-box;
}
.home .my-board .noti-list ul li.pes .li-badge {background-color: rgba(0,143,213,.08);}
.home .my-board .noti-list ul li.avs .li-badge {background-color: rgba(26,198,237,.08);}
.home .my-board .noti-list ul li.approval .li-badge {background-color: rgba(255,139,0,.08);}
.home .my-board .noti-list ul li.reservation .li-badge {background-color: #edf8e9;}
.home .my-board .noti-list ul li.econ .li-badge {background-color: rgba(229,65,96,.08);}
.home .my-board .noti-list ul li .li-num {
  margin-left: auto;
  color: #ff6225;
}
.home .my-board .noti-list ul li .li-num .point {
  margin-right: 0.25rem;
  text-decoration: underline;
}
.home .commute-time h3 .today {
  display: inline-flex;
  position: relative;
  top: -0.1rem;
  height: 1.375rem;
  margin-left: 0.75rem;
  padding: 0 0.75rem;
  line-height: 1.375rem;
  font-size: 0.75rem;
  border: 1px solid transparent;
  border-radius: 1.375rem;
  background-color: rgba(255,98,37,.1);
  box-sizing: border-box;
}
.home .commute-time .btn-area.link {
  display: flex;
  gap: 0.5rem;
}
.home .commute-time .btn-area.link::after {display: none;}
.home .commute-time .btn-area.link .btn-link {
  display: inline-block;
  position: relative;
  width: 100%;
  min-width: 4rem;
  height: 2.5rem;
  vertical-align: top;
  line-height: 2.5rem;
  font-size: 0.875rem;
  border: 1px solid rgba(228,229,234,.7);
  border-radius: 0.75rem;
  box-sizing: border-box;
}
.home .commute-time .btn-area.link .btn-link.request {
  width: 60%;
  color: #ff6225;
  border: 1px solid rgba(255,98,37,.4);
}
.home .commute-time .btn-area.link .btn-link.work-on,
.home .commute-time .btn-area.link .btn-link.work-off {
  color: #fff;
  border: 1px solid #1ac6ed;
  background-color: #1ac6ed;
}
.home .commute-time .btn-area.link .btn-link.disabled {
  border: 1px solid #ddd;
  background-color: #ddd;
  pointer-events: none;
}
.my-menu .my-menu-list {position: relative;}
.my-menu .my-menu-list .btn-area {
  position: absolute;
  top: 0.75rem;
  right: -0.25rem;
}
.my-menu-list .btn-area .btn-ico i.btn-arrow {
  padding: 0.25rem;
  opacity: .3;
  -webkit-transition: all .2s ease-out;
  -moz-transition: all .2s ease-out;
  -o-transition: all .2s ease-out;
  transition: all .2s ease-out;
}
.my-menu .my-menu-list.open .btn-area .btn-arrow {
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.my-menu .my-menu-list ul {
  overflow: hidden;
  overflow-x: auto;
  display: flex;
  width: calc(100% - 2rem);
  margin: -0.25rem;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.my-menu .my-menu-list ul::-webkit-scrollbar {display: none;}
.my-menu .my-menu-list.open ul {flex-wrap: wrap;}
.my-menu .my-menu-list ul li {
  margin: 0.25rem;
  white-space: nowrap;
}
.my-menu .my-menu-list ul li a {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  height: 42px;
  padding: 0 14px;
  font-size: 16px;
  border: 1px solid #E4E5EA;
  border-radius: 12px;
  box-sizing: border-box;
}
.my-menu .my-menu-list ul li a .li-badge {margin-right: 0.5rem;}
.my-menu .my-menu-list ul li a.pes .li-badge {color: #008fd5;}
.my-menu .my-menu-list ul li a.avs .li-badge {color: #1ac6ed;}
.my-menu .my-menu-list ul li a.approval .li-badge {color: #ff8b00;}
.my-menu .my-menu-list ul li a.econ .li-badge {color: #e54160;}
.my-menu .my-menu-list.no-cont {
  margin-top: 1.25rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e4e5ea;
}
.my-menu .my-menu-list.no-cont .btn-area {display: none;}
.my-menu .my-menu-list.no-cont ul {width: 100%;}
.my-menu .my-menu-list.no-cont ul li {
  width: 100%;
  margin-bottom: 0.5rem;
  text-align: center;
  font-size: 0.875rem;
  color: #999;
}

/* 홈 커뮤니티 더보기 영역 */
.home .content-box.comp-community {
  overflow: hidden;
  position: relative;
  padding: 0;
}
.home .comp-community .btn-area.right {margin-top: -1px;}
.home .comp-community .comp-reservation {
  position: absolute;
  top: 0;
  right: 0;
  padding: 24px 24px 20px;
  border-radius: 0 0 0 12px;
  background-color: #edf8e9;
}
.home .comp-community .comp-reservation .btn-link {
  display: flex;
  justify-content: center;
  font-weight: normal;
  font-family: 'Pretendard-SemiBold';
  font-size: 17px;
}
.home .comp-community .comp-reservation::before {
  position: absolute;
  top: 0;
  left: -20px;
  width: 20px;
  height: 20px;
  content: '';
  background: radial-gradient(circle 20px at bottom left, #0000 98%, #edf8e9) bottom left;
  background-color: #fff;
  pointer-events: none;
}
.home .comp-community .comp-reservation::after {
  position: absolute;
  bottom: -8px;
  right: 0;
  width: 8px;
  height: 8px;
  content: '';
  background: radial-gradient(circle 8px at bottom left, #0000 98%, #edf8e9) bottom left;
  background-color: #fff;
  pointer-events: none;
}
.home .comp-community .comp-reservation .btn-link .ico {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  top: -2px;
  width: 24px;
  height: 24px;
  margin-left: 8px;
  left: 4px;
  background: url('../images/ico-arrow.svg') 50% 50% no-repeat;
  transform: rotate(-90deg);
}
.home .comp-community .comp-board {padding: 24px;}
.home .comp-community .comp-board .content-box-tt {
  margin: 0 116px 36px -24px;
  padding: 0 24px;
  box-sizing: border-box;
}

/* 바로가기 추가/수정 팝업 */
.modal-set .my-menu .my-menu-list {
  margin: 0 -2rem;
  padding: 0 2rem;
  background-color: rgba(228,229,234,.3);
}
.modal-set .my-menu .my-menu-list ul {
  flex-wrap: wrap;
  width: calc(100% + 0.5rem);
  max-height: 68vh;
  margin: -0.25rem;
  overflow-y: auto;
}
.modal-set .my-menu .my-menu-list ul li {
  width: 100%;
}
.modal-set .my-menu .my-menu-list ul li:first-child {margin-top: 1rem;}
.modal-set .my-menu .my-menu-list ul li:last-child {margin-bottom: 1rem;}
.modal-set .my-menu .my-menu-list ul li a {
  justify-content: flex-start;
  position: relative;
  background-color: #fff;
}
.modal-set .my-menu .my-menu-list ul li a.on {border-color: rgba(14, 92, 233, 1);}
.modal-set .my-menu .my-menu-list ul li a.on::before {
  position: absolute;
  top: calc(50% - 0.25rem);
  right: 0.875rem;
  width: 0.625rem;
  height: 0.5rem;
  content: '';
  background: url('../images/ico-check.svg') 0 0 no-repeat;
  background-size: 100%;
}
.modal-set .my-menu .btn-area.bottom {
  top: auto;
  right: 0;
  width: 100%;
  margin-top: 1.5rem;
  padding: 0 32px;
  box-sizing: border-box;
}

.home .comp-board .comp-board-list ul li {
  display: flex;
  align-items: center;
  position: relative;
  margin-left: 1.25rem;
}
.home .comp-board .comp-board-list ul li::before {
  position: absolute;
  top: auto;
  left: -1rem;
  width: 0.25rem;
  height: 0.25rem;
  content: '';
  border-radius: 50%;
  background-color: #e4e5ea;
}
.home .comp-board .comp-board-list ul li a {
  overflow: hidden;
  display: block;
  line-height: 2.25rem;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.home .comp-board .comp-board-list ul li a .badge-noti {
  display: inline-block;
  position: relative;
  top: -1px;
  height: 18px;
  margin-right: 5px;
  padding: 0 6px;
  line-height: 18px;
  font-size: 12px;
  color: #fff;
  border-radius: 15px;
  background-color: #333;
}
.home .comp-board .comp-board-list ul li a .li-badge.new {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.125rem;
  height: 1.125rem;
  margin-right: 0.25rem;
  vertical-align: sub;
  background: url('../images/ico-new.svg') 0 0 no-repeat;
  background-size: 100%;
}
.home .comp-board .comp-board-list.no-cont {
  margin-top: 1.25rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e4e5ea;
}
.home .comp-board .comp-board-list.no-cont ul {width: 100%;}
.home .comp-board .comp-board-list.no-cont ul li {
  justify-content: center;
  width: 100%;
  margin-bottom: 0.5rem;
  margin-left: 0;
  font-size: 0.875rem;
  color: #999;
}
.home .comp-board .comp-board-list.no-cont ul li::before {display: none;}

/* 바텀 탭 신규 */
.nav-menu.bottom {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 80px;
  text-align: center;
  border-top: 1px solid rgba(228,229,234,.7);
  background-color: #fff;
  box-sizing: border-box;
  z-index: 15;
}
.nav-menu ul {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  box-sizing: border-box;
}
/*.nav-menu ul li {width: 20%;}*/
.nav-menu ul li a {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: relative;
  top: 0;
  height: 74px;
  font-family: 'Pretendard-SemiBold';
  font-size: 13px;
  color: #222;
}
.nav-menu ul li a i {
  width: 74px;
  height: 30px;
  margin-bottom: 6px;
}
.nav-menu ul li a .ico-approval {
  background: url('../images/ico-service-approval.svg') 50% 50% no-repeat;
  background-size: auto 26px;
}
.nav-menu ul li a .ico-community {
  background: url('../images/ico-service-community.svg') 50% 50% no-repeat;
  background-size: auto 22px;
}
.nav-menu ul li a .ico-reservation {
  background: url('../images/ico-reservation-calendar.svg') 50% 50% no-repeat;
  background-size: auto 25px;
}
.nav-menu ul li a .ico-uniworks {
  background: url('../images/ico-service-uniworks.svg') 50% 50% no-repeat;
  background-size: auto 22px;
}

/* 하단 nav-bar 추가메뉴 팝업 */
.modal-set {
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  opacity: 0;
  -webkit-transition: opacity .3s ease, visibility .3s ease;
  -moz-transition: opacity .3s ease, visibility .3s ease;
  -o-transition: opacity .3s ease, visibility .3s ease;
  transition: opacity .3s ease, visibility .3s ease;
}
.modal-set.open {
  visibility: visible;
  opacity: 1;
  z-index: 10100;
}
.modal-set .modal-bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0,0,0,.4);
  z-index: -1;
}
.modal-set .content-box {
  position: absolute;
  /* bottom: 0; */
  bottom: -100%;
  left: 0;
  width: 100%;
  margin: 0;
  padding: 36px;
  border-radius: 20px 20px 0 0;
  box-sizing: border-box;
  -webkit-transition: bottom .3s ease-out;
  -moz-transition: bottom .3s ease-out;
  -o-transition: bottom .3s ease-out;
  transition: bottom .3s ease-out;
}
.modal-set.bottom .content-box.in-cal {
  bottom: -100%;
  padding: 12px 0;
  opacity: 0;
}
.modal-set.bottom .content-box.in-cal.on {
  bottom: 0;
  opacity: 1;
}
.content-box.in-cal.on .dw-cal-btnc-ym .dw-cal-btnw {width: 45%;}
.modal-set.open .content-box,
.modal-set.full.open .content-box {
  bottom: 0;
}
.modal-set .nav-menu-more .nav-menu ul li a i {margin-top: -2px;}

/* 플로팅 메뉴 */
/* 공통 */
.modal-float-menu.modal-set .content-box {
  height: calc(100% - 60px);
  right: -100%;
  left: auto;
  -webkit-transition: bottom .3s ease-out;
  -moz-transition: bottom .3s ease-out;
  -o-transition: bottom .3s ease-out;
  transition: right .3s ease-out;
}
.modal-float-menu.modal-set .modal-bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0,8,22,.8);
  z-index: -1;
}
/* 바텀시트 */
.modal-set.bottom .content-box .content-box-tt {
  align-items: flex-start;
  flex-direction: column;
  gap: 8px;
}
.modal-set.bottom .content-box .board-basic.form-set {
  overflow-y: auto;
  max-height: calc(100vh - 200px);
}
/* 하단 nav-bar 추가메뉴 팝업 */
.modal-set {
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  opacity: 0;
  -webkit-transition: all .2s ease;
  -moz-transition: all .2s ease;
  -o-transition: all .2s ease;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.modal-set.open {
  visibility: visible;
  opacity: 1;
  z-index: 10100;
}
.modal-set .modal-bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0,0,0,.5);
  z-index: -1;
}
.modal-set .content-box {
  position: absolute;
  bottom: -100%;
  left: 0;
  width: 100%;
  margin: 0;
  padding: 36px;
  border-radius: 20px 20px 0 0;
  box-sizing: border-box;
  -webkit-transition: bottom .3s ease-out;
  -moz-transition: bottom .3s ease-out;
  -o-transition: bottom .3s ease-out;
  transition: bottom .3s ease-out;
}
.modal-set.full .content-box {
  height: calc(100% - 3.75rem);
  bottom: -100rem;
  -webkit-transition: bottom .4s ease-in;
  -moz-transition: bottom .4s ease-in;
  -o-transition: bottom .4s ease-in;
  transition: bottom .4s ease-in;
}
.modal-set.half .content-box {
  height: calc(100% - 24rem);
}
.modal-set .content-box.nav-menu-more {
  bottom: -192px;
  min-height: 160px;
}
.modal-set.open .content-box.nav-menu-more {bottom: 0;}
.modal-set .handle-bar {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: calc(50% - 36px);
  height: 32px;
  padding: 0 20px;
}
.modal-set .handle-bar span {
  display: inline-block;
  width: 32px;
  height: 4px;
  border-radius: 4px;
  background-color: #ddd;
}
.modal-set .nav-menu-more .nav-menu ul {
  justify-content: flex-start;
  flex-wrap: wrap;
  margin: 0 -4px;
  padding: 0;
}
.modal-set .nav-menu-more .nav-menu ul li {
  width: calc(25% - 8px);
  margin: 4px;
}
.modal-set .nav-menu-more .nav-menu ul li a {
  border: 1px solid #E4E5EA;
  border-radius: 12px;
}

/* --- 로그인/아이디비번찾기 --- */
.login .content-area {
  width: calc(100% - 80px);
  padding: 0 40px 60px;
  margin-top: -17px;
  background-color: #fff;
}
.login .login-area .user-info,
.login .login-area .tab-result {
  line-height: 2.6rem;
}
.login .login-area .user-info > label,
.login .login-area .tab-result label {
  display: block;
  width: 100%;
  font-family: "Pretendard-SemiBold";
  font-size: 16px;
  font-weight: bold;
}
.login .login-area .inp + label {margin-top: 0.5rem;}
.login .login-area .inp {
  width: 100%;
  height: 2.6rem;
  padding: 0 1rem;
  line-height: 2.6rem;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-sizing: border-box;
}
.login .login-area .user-info .checkbox-area {margin-top: 1.4rem;}
.login .login-area .user-info .checkbox-area input[type=checkbox]:checked + label {/*color: #ff253a;*/}
.login .login-area .btn-area {margin-top: 1.2rem;}
.login .login-area .find-info {
  margin-top: 24px;
  padding-top: 24px;
  line-height: 1.5;
  text-align: right;
  border-top: 1px solid #eee;
}
.login .login-area .find-info a {
  text-decoration: underline;
  text-underline-offset: 5px;
  text-decoration-color: #888;
}
.login .login-area .tab-result > div {margin-top: 1rem;}
.login .login-area .tab-area.tab-01 ul li {width: 50%;}
.login .login-area .tab-area.tab-01 ul a {position: relative;}
.login .login-area .tab-area.tab-01 ul li a::after {
  position: absolute;
  bottom: 0;
  left: 0;
  display: inline-block;
  content: '';
  width: 100%;
  border-bottom: 2px solid #eee;
}
.login .login-area .tab-area.tab-01 ul li.on a::after {border-bottom: 2px solid #ff253a;}
.login .login-area .tab-result .btn-certify {
  display: flex;
  position: relative;
  margin-top: 2.6rem;
}
.login .login-area .tab-result .btn-certify::before {
  content: "";
  position: absolute;
  top: -1.3rem;
  left: 0;
  width: 100%;
  height: 1px;
  background: repeating-linear-gradient(90deg, #ddd, #ddd 3px, transparent 0, transparent 5px);
}
.login .login-area .tab-result .btn-certify button {
  display: inline-block;
  width: calc(50% - 0.25rem);
  height: 5.6rem;
  text-align: center;
  letter-spacing: -0.05em;
  font-size: 0.85rem;
  color: #999;
  border: 1px solid #ddd;
  box-sizing: border-box;
  cursor: pointer;
}
.login .login-area .tab-result .btn-certify button.on {
  color: #ff253a;
  border: 1px solid #ff253a;
}
.login .login-area .tab-result .btn-certify button::before {
  display: block;
  font-family: "unifont";
  content: '\e845';
  margin: -0.25rem 0 0 0;
  font-size: 2rem;
  color: #ccc;
}
.login .login-area .tab-result .btn-certify button.on::before {color: #ff253a;}
.login .login-area .tab-result .btn-certify button + button {margin-left: 0.5rem;}
.login .login-area .tab-result .btn-certify p {
  display: inline-block;
  width: 100%;
  padding: 0.7rem 2.6rem 0.6rem;
  text-align: center;
  line-height: 1.4rem;
  font-size: 0.85rem;
  color: #ff253a;
  border: 1px solid #ff253a;
  box-sizing: border-box;
  cursor: pointer;
}
.login .login-area .tab-result .btn-area {margin-top: 1.9rem;}

/* 업체 로그인 추가 */
.login.comp .header {padding-top: 4.8rem;}
.login.comp .header .logo-comp {
  position: absolute;
  top: 1rem;
  left: 1.2rem;
}
.login.comp.bizmeka .header .logo-comp img {
  width: 7.2rem;
  height: auto;
}
.login.comp .login-area .btn-area .btn-red {
  border-color: #333;
  background-color: #333;
}
.login-area .link-login {margin: 2rem -1.4rem -1rem;}
.login-area .link-login a {
  display: inline-block;
  width: 100%;
  height: 3.2rem;
  text-align: center;
  line-height: 3.2rem;
  color: #fff;
  background-color: #a6afc1;
}
.login.comp .login-area .login-noti {
  margin: 2.5rem -1.4rem -2rem;
  padding: 1rem 1.2rem 1rem 2rem;
  text-indent: -0.7rem;
  line-height: 1.4rem;
  font-size: 0.85rem;
  color: #999;
  border: 0;
  background-color: rgba(166,175,193,.2);
}

/* 관리자 약관 동의 팝업 */
.step-in.agree {
  padding: 1.2rem;
  padding-bottom: 4.2rem;
}
.step-in.agree .agree-area {position: relative;}
.step-in.agree .agree-area + .agree-area {margin-top: 1.2rem;}
.step-in.agree .agree-area .checkbox-area {
  position: absolute;
  top: 0.15rem;
  right: 0;
  margin: 0;
}
.step-in.agree .agree-area h3 {font-size: 1.05rem;}
.step-in.agree .agree-area h3 span {margin-left: 0.2rem;}
.step-in.agree .agree-area .agree-cont {
  overflow: auto;
  max-height: 3.5rem;
  margin: 0.5rem 0;
  line-height: 1.5rem;
  font-size: 0.85rem;
  border: 1px solid #ddd;
}
.step-in.agree .agree-area .radio-area {text-align: right;}


/* --- 서브(공통) --- */
.content-area {
  overflow: hidden;
  position: relative;
  margin-top: 3.75rem;
}
.home .content-area {
  margin: 60px 0 0;
  box-sizing: border-box;
}
.wrap.community .content-area {
  margin: 60px 0 0;
  padding: 12px;
  box-sizing: border-box;
}
.wrap.pes .content-area,
.wrap.approval .content-area,
.wrap.econ .content-area,
.wrap.pds .content-area,
.wrap.tax .content-area,
.wrap.salescon .content-area,
.wrap.avs .content-area {
  margin: 60px 0 0;
  padding: 12px;
  box-sizing: border-box;
}
.wrap .content-area.viewer {
  overflow: inherit;
}
body .layer-modal .pop-modal-container .content-area {
  height: calc(100vh - 60px);
  margin: 0;
  padding: 12px;
  box-sizing: border-box;
}
body .layer-modal .pop-modal-container .content-area.write.form-set {padding: 12px 12px 76px;}
.content-box {
  margin: 12px;
  padding: 20px;
  border-radius: 20px;
  background-color: #fff;
}
.wrap:has(.content-area.popup-box) {height: inherit;}
.wrap .content-area.popup-box {
  padding: 20px;
  border-radius: 20px;
  background-color: #fff;
}
.wrap.approval.approval-submit {height: 100vh;}
.wrap.approval.approval-submit .content-area {
  overflow-y: auto;
  overflow-x: hidden;
  height: calc(100vh - 60px);
  max-height: calc(100vh - 60px);
  -webkit-overflow-scrolling: touch;
}
.wrap .content-area:has(.board-area),
.wrap.approval .content-area:has(.approval-detail-view) {
  padding-bottom: 78px;
}
.wrap.approval.approval-submit .editor-area {
  margin: 0 20px;
}
.wrap.approval.approval-submit .panel-list dl.in-write-pop-r dd {
  margin-top: 12px;
}
.wrap.approval.approval-submit .editor-area .tox-tinymce,
.wrap.approval.approval-submit .panel-list dl.in-write-pop-r dd .tox-tinymce {
  border-radius: 8px;
  border: 1px solid  #ddd;
}

/* 가이드 유니 */
.uni-guide-area {
  margin-top: 1.9rem;
  text-align: center;
}
.uni-guide-area a {display: inline-block;}
.uni-guide-area img {
  width: 4.2rem;
  margin-top: -1.5rem;
}
.uni-guide-area .speech-bubble {
  position: relative;
  display: inline-block;
  margin-left: 1.2rem;
  padding: 0.6rem 0.7rem 0.5rem;
  text-align: left;
  line-height: 1.5rem;
  font-size: 1.05rem;
  color: #555;
  border: 1px solid #ddd;
  border-radius: 0.125rem;
  background-color: #fff;
}
.uni-guide-area .speech-bubble::before,
.uni-guide-area .speech-bubble::after {
  content: '';
  position: absolute;
  top: calc(50% - 0.6rem);
  border-top: 0.6rem solid transparent;
  border-bottom: 0.6rem solid transparent;
}
.uni-guide-area .speech-bubble::before {
  left: -0.7rem;
  border-right: 0.7rem solid #ddd;
}
.uni-guide-area .speech-bubble::after {
  left: -0.6rem;
  border-right: 0.7rem solid #fff;
}
.uni-guide-area .speech-bubble * {font-family: 'Pretendard-Medium';}


/* --- 목록 --- */
.board-area {
  position: relative;
}
.board-area.top-fixed {padding-top: 56px;}
.board-area.top-fixed.top-line-2 {padding-top: 100px;}
.board-area.top-fixed.top-line-3 {padding-top: 40px;}
.board-area.in-check.noti-list {
  margin: -12px;
  padding-top: 100px;
}
.board-area.top-fixed .board-top,
.board-area.top-fixed .top-action-area {
  display: flex;
  align-items: center;
  gap: 8px;
  position: fixed;
  top: 60px;
  left: 0;
  width: 100%;
  height: 50px;
  padding: 0 20px;
  line-height: 50px;
  border-top: 1px solid rgba(14, 92, 233, 0.25);
  border-bottom: 1px solid rgba(14, 92, 233, 0.25);
  background-color: #F5F8FE;
  z-index: 10;
  box-sizing: border-box;

  height: 56px;
  line-height: 56px;
}
.board-area.top-fixed .board-top.align-c,
.board-area.top-fixed .top-action-area.align-c {
  justify-content: center;
}
.board-area.top-fixed.top-line-2 .board-top {
  display: block;
  width: 100%;
  height: 6.2rem;
  padding: 0;
  line-height: 6.2rem;
  background-color: inherit;
}
.board-area.noti-list .board-top {
  display: block;
  height: 6.1rem;
}
.board-area.noti-list .board-top .top-noti-area {
  display: flex;
  align-items: center;
  height: 50px;
  margin: 0 -20px;
  padding: 0 20px;
  border-bottom: 1px dashed #ddd;
  box-sizing: border-box;
}
.board-area.noti-list .board-top .top-noti-area::before {
  display: inline-flex;
  width: 20px;
  height: 20px;
  margin-right: 8px;
  content: '';
  background: url('../images/ico-status-caution-line.svg') 0 0 no-repeat;
  background-size: 100%;
  opacity: .4;
}
.board-area .board-top .checkbox-area {
  position: relative;
  vertical-align: text-top;
  line-height: 0;
}
.board-area .board-top .sort-list-area {
  position: relative;
  height: 3.1rem;
  line-height: 3.1rem;
  text-align: center;
}
.board-area .board-top .sort-list-area.inline {
  display: inline-block;
  text-align: inherit;
}
.board-area .board-top .sort-list-area span {
  position: relative;
  display: inline-block;
}
.board-area .board-top .sort-list-area span i {
  position: absolute;
  top: 0.7rem;
  right: -1.5rem;
  font-size: 1.5rem;
}
.board-area .board-top .sort-list-area span i::before {font-weight: bold;}
.board-area .board-top .sort-list-area .btn-sort {
  margin-bottom: 0.05rem;
  padding: 0 1.75rem 0 0.6rem;
  font-family: "Pretendard-Regular";
  line-height: 1.75rem;
  font-size: 0.85rem;
  border: 1px solid #ccc;
  border-radius: 1.75rem;
  background-color: #fff;
}
.board-area .board-top .sort-list-area .btn-sort i {
  position: absolute;
  top: 0.15rem;
  right: 0.35rem;
  font-size: 1.35rem;
}
.board-area .board-top.in-summary {margin-bottom: 0.6rem;}
.board-area .board-top .check-total {
  position: absolute;
  bottom: 0;
  right: 1.2rem;
  font-family: 'Pretendard-Medium';
}
.board-area.noti-list .board-top .check-total {
  top: auto;
  bottom: 0;
  height: 50px;
}
.board-area.no-check .board-top .check-total {
  position: static;
  height: 3.1rem;
  line-height: 3.1rem;
  text-align: center;
}
.board-area .board-top .check-total span {
  font-family: 'Pretendard-Medium';
  color: #ff253a;
}
.board-area .board-top .check-total span + span {margin-left: 0.5rem;}
.board-area .board-top .check-total span + button {margin-left: 0.5rem;}
.board-area .board-top .check-total button {
  line-height:  1.6rem;
  font-size:  1.6rem;
}
.board-area .board-top .check-total button + button {margin-left: 0.2rem;}
.board-area .board-top .check-total button i {
  width: 26px;
  height: 26px;
  vertical-align: middle;
}
.board-area .board-top .check-total button i.ico-uni-trash-check::before {
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-trash-check.svg') 50% 50% no-repeat;
  background-size: 19px;
  opacity: .5;
}
.board-area .board-top .btn-area.left {
  position: absolute;
  top: 0;
  left: 1.2rem;
}
.board-area .board-top .top-noti-area + .btn-area.left {
  align-items: center;
  justify-content: center;
  position: inherit;
  top: auto;
  left: auto;
  height: 50px;
}
.board-area .board-top .btn-area.right {
  align-items: center;
  position: absolute;
  top: 0;
  right: 20px;
  height: 100%;
}
.board-area .board-top .btn-area.right button {
  height: 1.75rem;
  margin-bottom: 0.05rem;
  padding: 0 0.6rem;
  font-family: "Pretendard-Regular";
  font-size: 0.85rem;
  border: 1px solid #ccc;
  border-radius: 1.75rem;
}
.board-area .board-top .btn-area.right button.btn-c1 {
  display: flex;
  align-items: center;
  width: inherit;
  height: 28px;
  padding: 0 10px;
  font-family: "Pretendard-SemiBold";
  font-size: 15px;
  color: #fff;
  border-radius: 12px;
  border-color: rgba(14, 92, 233, 1);
  background-color: rgba(14, 92, 233, 1);
}
.board-area .board-top .btn-area.right button.btn-c1.disabled {
  border-color: #ccc;
  background-color: #ccc;
  pointer-events: none;
}
.board-area .board-top .btn-area.right button.btn-c1-line,
.board-area .board-top .btn-area.right button.uni-blu {
  color: rgba(14, 92, 233, 1);
  border-color: rgba(14, 92, 233, 1);
}
.board-area .board-top .btn-area.right button.uni-red {border-color: rgba(255, 37, 58, 1);}
.board-area .board-top .btn-area.right button.btn-c1-line.disabled,
.board-area .board-top .btn-area.right button.uni-blu.disabled,
.board-area .board-top .btn-area.right button.uni-red.disabled {
  color: #ccc !important;
  border-color: #ccc;
  pointer-events: none;
}
.board-area div.point {
  overflow: hidden;
  border-radius: 8px;
}
.board-area div.point dl {background-color: #fff8f9;}
.board-area dl {
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  padding: 20px;
  background-color: #fff;
}
.board-area.line-s dl {padding: 0.7rem 1.9rem;}
.board-area dl.in-textarea {min-height: 4.2rem;}
.board-area dl.in-write-pop {
  padding: 0;
  background-color: inherit;
}
.board-area dl.in-write-pop .red-star::before {
  top: 1.2rem;
  left: 1.35rem;
}
.board-area dl.in-write-pop dt,
.board-area dl.in-write-pop dd {
  width: 100%;
}
.board-area dl.in-write-pop dt {
  padding: 1.2rem 1.9rem;
  background-color: #fff;
  box-sizing: border-box;
}
.board-area dl.in-write-pop dd {
  position: relative;
  padding: 1.2rem 1.2rem 1.05rem;
  background-color: rgba(255,255,255,.5);
  box-sizing: border-box;
}
.board-area dl.in-write-pop dd > i {
  position: absolute;
  top: 1.2rem;
  right: 1.2rem;
  width: 2.4rem;
  height: 4.2rem;
  line-height: 4.2rem;
  font-size: 1.4rem;
  color: #222;
  background-color: rgba(255,248,213,.3);
}
.board-area dl.in-write-pop dd > i::before {
  position: absolute;
  bottom: 12px;
  right: 10px;
  width: 24px;
  height: 24px;
  content: '';
  background: url('../images/ico-textarea.svg') 50% 50% no-repeat;
  background-size: 100%;
  opacity: .3;
}
.board-area dl.in-write-pop dd textarea {
  overflow: hidden;
  display: -webkit-box;
  width: 100%;
  height: 114px;
  padding: 10px 48px 10px 16px;
  word-wrap: break-word;
  text-overflow: ellipsis;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}
.board-area dl + dl,
.board-area dl + div.point,
.board-area div.point + dl {margin-top: 1px;}
.board-area .search-box dl + dl {margin-top: 0}
.board-area dl > * {float: left;}
/*.pes .board-area.in-search dl dt,
.pes .board-area .search-box dl dt {color: #008fd5;}
.approval .board-area.in-search dl dt,
.approval .board-area .search-box dl dt {color: #ff8b00;}*/
.board-area dl dt {
  width: 92px;
  padding-right: 12px;
  font-family: 'Pretendard-SemiBold';
}
.board-area dl dd {
  position: relative;
  width: calc(100% - 6.5rem);
}
.board-area dl.in-textarea dd {height: calc(100% - 2.25rem);}
.board-area dl dd .user-name {
  overflow: hidden;
  display: inline-block;
  width: calc(100% - 1.75rem);
  vertical-align: text-top;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.board-area dl dd .btn-search.ico {
  display: inline-block;
  position: absolute;
  top: -0.125rem;
  right: 0;
  width: 1.75rem;
  height: 1.75rem;
  line-height: 1.75rem;
  text-align: center;
  color: #008fd5;
}
.board-area dl dd .btn-search.ico::before {
  font-family: "unifont";
  content: '\e832';
  font-size: 1.45rem;
}
.board-area dl.in-textarea.in-write-pop-r dd > i {
  position: absolute;
  top: 0;
  right: 0;
  width: 2.6rem;
  height: 4.2rem;
  line-height: 4.2rem;
  font-size: 1.4rem;
  color: #008fd5;
  background-color: rgba(0,143,213,.05);
}
.board-area div.point dl.in-textarea.in-write-pop-r dd > i {
  color: #ff253a;
  background-color: rgba(255,37,58,.05);
}
.board-area dl.in-textarea.in-write-pop-r dd textarea {
  overflow: hidden;
  display: -webkit-box;
  padding-right: 2.6rem;
  word-wrap: break-word;
  white-space: normal;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.board-area dt.createVersion input[type="checkbox"] + .check-label {
  margin-left: 4px;
  display: inline-block;
  vertical-align: middle;
}
.board-area dl dd .checkbox-area:only-child {display: flex;}
.board-area dl dd .slt-area + .checkbox-area {margin-top: 1rem;}
.board-area dl dd .use-cost {
  font-family: 'Pretendard-Medium';
  color: #ff253a;
}
.board-area dl dd .approval-num:first-child {
  overflow: hidden;
  display: inline-block;
  max-width: 11.3rem;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.board-area dl dd a {
  margin-left: 0.5rem;
  vertical-align: top;
  text-decoration: underline;
  color: #ff253a;
}
.board-area dl dd .btn-area {
  position: absolute;
  top: -0.125rem;
  right: -0.2rem;
}
.board-area dl dd .btn-area a {
  display: inline-block;
  width: 1.45rem;
  height: 1.45rem;
  line-height: 1.45rem;
  text-decoration: none;
  color: inherit;
}
.board-area dl dd .btn-area a i {
  vertical-align: middle;
  font-size: 1.45rem;
}
.board-area dl dd .btn-area.no-absol {
  position: inherit;
  top: inherit;
  right: inherit;
}
.board-area dl dd .btn-area.no-absol a {
  display: block;
  width: calc(100% - 2.4rem);
  max-width: 18.4rem;
  margin: 1.2rem auto 0;
  padding: 0.5rem 1.2rem;
  border: 1px solid #ccc;
}
.board-area dl dd .btn-area.no-absol a i.ico-uni-camera {
  position: relative;
  top: -0.35rem;
  margin: 0 0.2rem 0 -0.5rem;
  vertical-align: text-top;
  font-size: 2rem;
}
.board-area dl dd.project-area .btn-area {
  position: inherit;
  top: inherit;
  right: inherit;
}
.board-area dl dd.project-area .btn-area button {
  width: calc(50% - 0.125rem);
  max-width: 10rem;
  height: 1.9rem;
  margin-top: 0.7rem;
  line-height: 1.9rem;
  font-size: 0.85rem;
}
.board-area dl dd.project-area .btn-area button + button {margin-left: 4px;}
.board-area ul li {
  position: relative;
  background-color: #fff;
}
.board-area ul li + li {margin-top: 0.125rem;}
.board-area ul li > a {
  position: relative;
  display: block;
  padding: 1.2rem 1.9rem;
}
.board-area ul li > a::after {
  position: absolute;
  top: 1.2rem;
  right: 1.75rem;
  display: inline-block;
  margin-left: 0.125rem;
  font-family: 'unifont';
  content: '\e803';
  font-weight: bold;
  font-size: 1.2rem;
  color: #999;
}
.board-area .board-noti {
  margin-top: 0.5rem;
  font-size: 0.85rem;
  color: #ff253a;
}
.board-area .board-explain,
.tbl-explain {
  margin-top: 0.5rem;
  font-size: 0.85rem;
  color: #999;
}
.board-list li .badge-new {
  position: relative;
  top: 0.125rem;
  display: inline-block;
  width: 1.05rem;
  height: 1.05rem;
  margin-right: 0.35rem;
  vertical-align: text-top;
  font-family: 'Pretendard-Medium';
  text-align: center;
  line-height: 1.05rem;
  font-size: 0.6rem;
  color: #fff;
  border-radius: 1.05rem;
  background-color: #ff253a;
}
.board-list li .badge-important {
  display: inline-block;
  width: 1.45rem;
  margin-right: 0.35rem;
  padding: 0.05rem 0.4rem;
  line-height: 1.05rem;
  vertical-align: text-top;
  font-size: 0.75rem;
  color: #ff253a;
  border: 1px solid #ff253a;
  border-radius: 1.75rem;
}
.board-list li i.ico-uni-file {font-size: 1.4rem;}
.msg-error {
  font-size: 0.85rem;
  color: #ff253a;
}

/* 증명서 목록 추가 */
.board-area dd .ce-inp-list {margin-top: -0.25rem;}
.board-area dd .ce-inp-list li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.board-area dd .ce-inp-list li + li {margin-top: 0.5rem;}
.board-area dd .ce-inp-list li .li-tt {
  /* width: 40vw; */
  width: calc(100% - 4rem);
}
.board-area dd .ce-inp-list li .inp {
  display: inline-block;
  width: 2.5rem;
  height: 1.9rem;
  margin: 0;
  padding: 0 0.5rem;
  text-align: right;
  box-sizing: border-box;
}

/* 사용내역 상세 구조 변경 */
.board-area .usage-area ~ * {margin-top: 12px;}
.board-area .usage-area {
  overflow: hidden;
  border-radius: 20px;
}
.board-area .usage-area dl {padding: 12px 20px;}
.board-area .usage-area + .receipt-area {
  border-radius: 20px;
  background-color: #fff;
}
.board-area .usage-area + .receipt-area .receipt-box {padding-top: 0;}

/* 등록 상단 액션바 추가 */
.board-area.top-fixed .top-action-area {
  justify-content: center;
  text-align: center;
}
.board-area.top-fixed .top-action-area .btn-area {
  position: absolute;
  top: 0;
}
.board-area.top-fixed .top-action-area .btn-area.left {left: 20px;}
.board-area.top-fixed .top-action-area .btn-area.right {right: 20px;}
.board-area.top-fixed .top-action-area .btn-area button {
  height: 28px;
  margin-bottom: 1px;
  padding: 0 10px;
  font-family: "Pretendard-Regular";
  line-height: 28px;
  font-size: 14px;
  border: 1px solid #ccc;
  border-radius: 28px;
}
.board-area .top-action-area .count-area {
  display: inline-block;
  line-height: 22px;
}
.board-area .top-action-area .count-area a {
  display: inline-block;
  margin: 0 6px;
}
.board-area .top-action-area .count-area a i {
  width: 22px;
  height: 22px;
  line-height: 24px;
  border-radius: 50%;
  background-color: #fff;
}
.board-area .top-action-area .count-area a i::before {font-weight: bold;}
.board-area .top-action-area .count-area span {
  font-family: "Pretendard-Bold";
  color: #222 !important;
}

/* 팝업 상단 검색 박스 */
.board-area .search-box {
  margin-bottom: 12px;
  padding-top: 11px;
  border-radius: 20px;
  background-color: #fff;
}
.board-area .search-box dl {padding: 8px 20px;}
.board-area .search-box .btn-area {
  justify-content: center;
  padding: 8px 0 20px;
}
.board-area .search-box .btn-area button {
  width: calc(100% - 41px);
  height: 40px;
  font-size: inherit;
}

/* 회사 검색 추가 */
.board-area.search-detail .comp-list li {
  position: relative;
  padding: 0 1.2rem;
  height: 3.1rem;
  line-height: 3.1rem;
}
.board-area.search-detail .comp-list li + li {
  margin: 0;
  border-top: 1px dashed #ddd;
}
.board-area.search-detail .comp-list li a {
  overflow: hidden;
  display: flex;
  width: 100%;
  padding: 0;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.board-area.search-detail .comp-list li a::after {display: none;}
.board-area.search-detail .comp-list li a .comp-num {
  display: inline-block;
  width: 6.5rem;
  color: #999;
}
.board-area.search-detail .comp-list li a .comp-name {
  overflow: hidden;
  display: inline-block;
  width: calc(100% - 7.7rem);
  margin-left: 1.2rem;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  vertical-align: top;
}

/* 계정과목/비용항목 조회 추가 */
.select-account-title-op {background-color: #fff;}
.select-account-title-op .op-line dl {
  position: relative;
  padding: 0.6rem 1.2rem;
  border-bottom: 1px dashed #e5e5e5;
}
.select-account-title-op .op-line dl dt {margin: 0.4rem 0 0.8rem;}
.select-account-title-op .op-line dl dd {
  position: relative;
  margin: 0.5rem 0;
  padding-left: 1rem;
  color: #2F79A6;
}
.select-account-title-op .op-line dl dd::before {
  position: absolute;
  top: 0;
  left: -0.1rem;
  line-height: 1.5rem;
  font-family: "unifont";
  content: '\e8b7';
  font-size: 0.95rem;
}

/* - 종이증빙/개인카드/법인카드 - */
.board-area .board-list li {padding: 1.2rem;}
.board-area .board-list.in-fold-btn li {padding: 0;}
.board-area .board-list li.cancel,
.board-area.in-check .board-list li.checked.cancel {background-color: #ffe9eb;}
.board-area .board-list li.fin,
.board-area .board-list li.checked,
.board-area.in-check .board-list li.fin.checked {background-color: #fff8d5;}
.board-area.in-check .board-list li.checked {background-color: #fff;}
.board-area .board-list li.receive,
.board-area.in-check .board-list li.fin.receive,
.board-area.in-check .board-list li.checked.receive {background-color: #def7e6;}
.board-area .board-list li + li {margin-top: 0.6rem;}
.board-area .board-list li.checked::before {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  content: '';
  width: 100%;
  height: 100%;
  border: 2px solid #222;
  box-sizing: border-box;
  z-index: 5;
  pointer-events: none;
}
.board-area.in-check .board-list .select-area {padding: 1.2rem 1.2rem 1.2rem 0.2rem;}
.board-area.no-check .board-list .select-area {padding: 1.2rem;}
.board-area .board-list.in-fold-btn .btn-area {margin-left: -2.6rem;}
.board-area .board-list.in-fold-btn li.no-check .btn-area {margin-left: -1.2rem;}
.board-area.no-check .board-list.in-fold-btn .btn-area {margin: 0;}
.board-list .noti-area {
  position: relative;
  margin-bottom: 0.6rem;
}
.board-list .noti-area .li-badge span {
  margin-left: -0.2rem;
  line-height: 1.4rem;
  font-size: 1.4rem;
}
.board-list .noti-area .li-badge.paper {color: #8485d5;}
.board-list .noti-area .li-badge.user {color: #00c0b5;}
.board-list .noti-area .li-badge.comp {color: #008fd5;}
.board-list .noti-area .li-badge i {vertical-align: middle;}
.board-list .noti-area .li-progress {
  position: absolute;
  top: 0;
  right: -0.2rem;
  color: #aaa;
}
.board-list .fin .noti-area .li-progress {color: #222;}
.board-list .noti-area .li-progress span {
  line-height: 1.4rem;
  font-size: 1.2rem;
}
.board-list .noti-area .li-progress i {vertical-align: middle;}
.board-list .cont-area {
  position: relative;
  line-height: 1.75rem;
}
.board-area.in-check .board-list li .checkbox-area + * {padding-left: 0.2rem;}
.board-area.in-check .board-list li .checkbox-area + label {display: block;}
.board-list .cont-area .card-user {
  width: 70%;
  font-family: 'Pretendard-Medium';
}
.board-list .cont-area .card-user.user {color: #00c0b5;}
.board-list .cont-area .card-user.comp {color: #008fd5;}
.board-list .cont-area .summary,
.board-list .cont-area .use-place,
.board-list .cont-area .cont-tt {
  overflow: hidden;
  width: 70%;
  font-family: 'Pretendard-Medium';
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.board-list .cont-area .cont-summary {
  overflow: hidden;
  display: -webkit-box;
  width: 70%;
  max-height: 3.5rem;
  padding-top: 0.125rem;
  line-height: 1.5rem;
  word-wrap: break-word;
  white-space: normal;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.board-list .cont-area .cont-summary.comp {
  display: inherit;
  max-height: inherit;
  white-space: nowrap;
}
.board-list .cont-area .use-cost {
  position: absolute;
  top: 0;
  right: 0;
  font-family: 'Pretendard-Medium';
  color: #ff253a;
}
.board-list .cont-area .use-cost .tag-add-division {
  display: inline-block;
  position: relative;
  top: -0.125rem;
  left: 0;
  height: 0.9rem;
  margin-right: 0.25rem;
  padding: 0 0.125rem;
  font-weight: normal;
  font-family: 'Pretendard-Medium';
  line-height: 0.9rem;
  font-size: 11px;
  color: #ff253a;
  border: 1px solid #ff253a;
  border-radius: 0.25rem;
}
.board-list .cont-area .bott-area {overflow: hidden;}
.board-list .cont-area .bott-area .tag {float: left;}
.board-list .cont-area .bott-area .write-date {
  position: static;
  float: right;
}
.board-list .cont-area .memo,
.board-list .cont-area .tag {
  overflow: hidden;
  width: 70%;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.board-list .cont-area .tag {
  position: relative;
  width: calc(70% - 1.2rem);
  padding-left: 1.2rem;
  color: #999;
}
.board-list .cont-area .tag::before {
  position: absolute;
  top: calc(50% - 0.5rem);
  left: 0;
  display: inline-block;
  content: '';
  width: 1rem;
  height: 1rem;
  border-radius: 1rem;
  background-color: #999;
}
.board-list .cont-area .tag.tag-01::before {background-color: #81ce00;}
.board-list .cont-area .tag.tag-02::before {background-color: #d7a8d8;}
.board-list .cont-area .tag.tag-03::before {background-color: #ffaeb0;}
.board-list .cont-area .write-date {
  position: absolute;
  bottom: 0;
  right: 0;
  color: #999;
}
.board-list .cont-area .card-info {
  overflow: hidden;
  width: 100%;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.board-list .cont-area .card-info .approval-num,
.board-list .cont-area .card-info .card-nick {font-family: 'Pretendard-Medium';}
.board-list .cont-area .card-info .approval-num {text-decoration: underline;}
.board-list .cont-area .card-info .card-nick {
  margin-left: 1rem;
  color: #008fd5;
}
.board-list .cont-area .approval-date {color: #999;}
.board-list .cont-area.img-only {overflow: hidden;}
.board-list .cont-area.img-only > * {float: left;}
.board-list .cont-area.img-only .img-area {
  float: right;
  width: 3.35rem;
  height: 3.35rem;
  text-align: right;
}
.board-list .cont-area.img-only .img-area img {
  width: 100%;
  height: 100%;
}
.board-list .cont-area.img-only .memo.no-write {color: #999;}
.board-list .cont-area.img-only .write-date {
  position: static;
  width: 70%;
}
.board-list.in-fold-btn .select-area + .btn-area {
  padding: 0.7rem 1.2rem;
  border-top: 1px solid #eee;
}
.board-area.in-check .board-list li {
  position: relative;
  padding-left: 2.6rem;
}
.board-area.in-check .board-list li.no-check {padding-left: 1.2rem;}
.board-area.in-check .board-list li .progress-msg {
  width: 100%;
  position: absolute;
  top: calc(50% - 4rem);
  left: 0;
  text-align: center;
  z-index: 10;
}
.board-area.in-check .board-list li .progress-msg span {
  font-family: 'Pretendard-SemiBold';
  font-size: 3.2rem;
  color: rgba(255,37,58,.1);
}
.board-area.in-check .board-list li .checkbox-area {
  position: absolute;
  top: 1.5rem;
  left: 1.2rem;
}
.board-area.in-link-r .board-list li {
  position: relative;
  padding-right: 2.6rem;
}
.board-area.in-link-r .board-list li .btn-area {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  margin: 0;
  padding: 0;
}
.board-area.in-link-r .board-list li .btn-area a {
  position: relative;
  display: inline-block;
  width: 1.9rem;
  height: 100%;
  background-color: rgba(0,0,0,.01);
}
.board-area.in-link-r .board-list li .btn-area a i {
  position: absolute;
  top: calc(50% - 0.7rem);
  left: calc(50% - 0.7rem);
  font-size: 1.4rem;
}
.board-area.in-link-r .board-list li .btn-area a i::before {font-weight: bold;}

/* 결과없음 */
.result-empty {
  overflow: hidden;
  position: relative;
  padding: 1.2rem;
  min-height: 10.5rem;
  text-align: center;
  background-color: #fff;
}
.result-empty::after {
  display: inline-block;
  position: absolute;
  left: calc(50% - 4.7rem);
  bottom: -2.4rem;
  font-family: "unifont";
  content: '\e85c';
  vertical-align: middle;
  font-size: 9.4rem;
  color: rgba(0,0,0,.03);
}
.result-empty .result-empty-in {
  margin: 1.9rem 0;
  font-size: 1rem;
}
.result-empty .result-empty-in p::before {
  display: inline-block;
  font-family: "unifont";
  content: '\e807';
  margin: -0.2rem 0.2rem 0 0;
  vertical-align: middle;
  font-size: 1.25rem;
  font-weight: 600;
  color: #999;
}

/* - 알림목록 - */
.board-list.noti-list li.new,
.board-list.noti-list li.new.checked {background-color: #ffe9eb;}
.board-list.noti-list li .cont-area {min-height: inherit;}
.board-list.noti-list li .cont-area .cont-tt {color: #999;}
.board-list.noti-list li.new .cont-area .cont-tt {color: #ff253a;}
.board-list.noti-list li .cont-area .write-date {top: 0;}


/* --- 첨부파일(커뮤니티) --- */
.board-area dl.file-upload-box {
  flex-direction: column;
  margin-bottom: 8px;
  padding: 0 20px 16px;
  background-color: inherit;
}
.board-area dl.file-upload-box dt {
  position: relative;
  width: 100%;
  padding: 20px 0;
  background-color: #fff;
  box-sizing: border-box;
}
.board-area dl.file-upload-box dt .btn-area {
  position: absolute;
  top: 1rem;
  right: 0;
}
.board-area dl.file-upload-box dt .btn-area a {
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
}
.board-area dl.file-upload-box dt .btn-area a i {
  vertical-align: middle;
  font-size: 24px;
}
.board-area dl.file-upload-box dt .btn-area a input[type=file] {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  opacity: 0;
}
.board-area dl.file-upload-box dd {
  position: relative;
  width: 100%;
  background-color: #fff;
  box-sizing: border-box;
}
.board-area dl.file-upload-box dd ul {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 15px;
  border-radius: 8px;
  background-color: #F9F9FD;
}
.board-area dl.file-upload-box dd ul:not(:has(li)),
.board-area dl.file-upload-box dd ul:empty {
  display: none;
}
.board-area dl.file-upload-box dd ul li {
  display: flex;
  align-items: center;
  position: relative;
  height: 28px;
  margin: 0;
  line-height: 28px;
  background-color: transparent;
  box-sizing: border-box;
}
.board-area dl.file-upload-box dd ul li .file-name {
  overflow: hidden;
  display: inline-block;
  max-width: 70%;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: "Pretendard-Medium";
}
.board-area dl.file-upload-box dd ul li .file-size {
  margin: 0 8px;
  white-space: nowrap;
  font-size: 0.75rem;
  color: #aaa;
}
.board-area dl.file-upload-box dd ul li .btn-area.right {
  flex: 0 0 auto;
  position: inherit;
  top: inherit;
  right: inherit;
  margin-left: auto;
/*  display: flex !important;
  gap: 12px;
  align-items: center;*/
}
.board-area dl.file-upload-box dd ul li .btn-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: auto;
  right: 0.6rem;
  width: 1.45rem;
  height: 1.45rem;
  line-height: 1;
}
.board-area dl.file-upload-box dd ul li .btn-preview::before {
  font-family: "unifont";
  content: '\e832';
  font-weight: bold;
  font-size: 1.3rem;
  opacity: 0.4;
  border-radius: 50%;
  margin-right: 5px;
  margin-bottom: 0.1rem;
}
.board-area dl.file-upload-box.insert dd ul li .btn-preview::before {display: none;}
.board-area dl.file-upload-box dd ul li .btn-del {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  right: 3px !important;
  opacity: .4;
}
.board-area dl.file-upload-box dd ul li .btn-del::before {
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-close.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.board-area dl.file-upload-box dd ul li .btn-download {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  opacity: .4;
}
.board-area dl.file-upload-box dd ul li .btn-download::before {
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-download.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.board-area dl.file-upload-box.insert dd ul li .btn-download::before {display: none;}
.uni-board .board-area dl.file-upload-box dd ul li .btn-download {margin-left: auto;}

.board-detail .version-slt {
  display: inline-block;
  vertical-align: middle;
  margin-top : 8px;
}

/* --- 첨부파일 --- */
.content-area dl.add-file-area {
  flex-direction: column;
  padding: 0;
  border-radius: 20px;
}
.content-area dl.add-file-area.no-dt dt {display: none;}
.content-area dl.add-file-area dt {
  position: relative;
  width: 100%;
  padding: 20px;
  background-color: #fff;
  box-sizing: border-box;
}
.content-area dl.add-file-area dt.red-star::before {
  top: 20px;
  left: 22px;
}
.content-area dl.add-file-area dt span {
  position: absolute;
  top: 20px;
  left: 134px;
}
.content-area dl.add-file-area dt .btn-area {
  position: absolute;
  top: 30px;
  right: 20px;
}
.content-area dl.add-file-area dt .btn-area a {
  display: inline-block;
  position: relative;
  width: 24px;
  height: 24px;
  margin-left: 12px;
  line-height: 24px;
}
.content-area dl.add-file-area dt .btn-area a i {
  display: flex;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  font-size: 0;
  color: transparent;
}
.content-area dl.add-file-area dt .btn-area a i.ico-uni-camera::before {
  display: block;
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-camera.svg') 50% 50% no-repeat;
  background-size: 22px;
}
.content-area dl.add-file-area dt .btn-area a i.ico-uni-file::before {
  display: block;
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-file.svg') 50% 50% no-repeat;
  background-size: 16px;
}
.content-area dl.add-file-area dt .btn-area a input[type=file],
.board-area dl.add-file-area dt .btn-area a input[type=file] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.content-area dl.add-file-area dd {
  width: calc(100% - 40px);
  margin: 0 20px;
}
.board-area dl dd .empty .btn-area,
.approval-detail-view .panel-list .empty .btn-area {
  flex-direction: column;
  position: static;
}
.board-area dl dd .empty .btn-area a,
.approval-detail-view .panel-list .empty .btn-area a {
  width: inherit;
  height: inherit;
}
.file-area {
  overflow: hidden;
  position: relative;
  width: 333px;
  height: 333px;
  margin: 20px auto;
  text-align: center;
  border-radius: 8px;
  background-color: #F9F9FD;
}
.file-area.in-img + .file-area,
.file-area.in-file + .file-area {
  margin: 10px auto;
}
.file-area.in-file {
  width: 100%;
  height: inherit;
  margin: 20px auto 10px;
  box-sizing: border-box;
}
.file-area.in-file:only-child {margin: 20px auto;}
.board-area dl.add-file-area dt + dd .file-area.in-file {margin-top: 0;}
.board-area dl dd .empty .btn-area .file-add,
.approval-detail-view .panel-list .btn-area .file-add {
  display: inline-block;
  margin: calc(50% - 45px) 0 0 0;
}
.board-area dl dd .empty .btn-area .file-add i,
.approval-detail-view .panel-list .btn-area .file-add i {
  font-size: 90px;
  color: #888;
}
.board-area dl dd .file-area.empty .btn-area .file-add {margin-top: calc(50% - 61px);}
.board-area dl dd .file-area .add-explain {
  height: 29px;
  margin-left: 0;
  line-height: 29px;
}
.board-area dl dd .file-area .add-explain p {
  display: inline-block;
  position: relative;
  padding-left: 24px;
}
.board-area dl dd .file-area .add-explain p::before {
  position: absolute;
  top: 0;
  left: 0;
  font-family: 'unifont';
  font-weight: bold;
  font-size: 18px;
  color: #FF6225;
  content: '\e807';
}
.board-area dl dd .file-area.in-img {
  height: inherit;
  margin: 0;
}
.layer-modal .board-area dl dd .file-area.in-img {
  width: calc(100vw - 64px);
  margin-bottom: 20px;
  background-color: #F9F9FD;
}
.board-area dl dd .file-area.in-img .add-explain {
  height: 45px;
  padding-left: 20px;
  text-align: left;
  line-height: 45px;
  color: #888;
  background-color: #fffee5;
}
.file-area .file-add-type {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100% - 112px);
  padding-top: 112px;
  background-color: rgba(0,0,0,.2);
}
.file-area .file-add-type button {
  display: block;
  width: 187px;
  height: 56px;
  margin: 0 auto;
  font-size: 16px;
  border: 1px solid #222;
  background-color: #fff;
}
.file-area .file-add-type button + button {margin-top: 8px;}
.file-area-in .action-area,
.panel-list.add-file-area .file-area-in .action-area {
  position: relative;
  height: 45px;
  padding: 0 12px;
  text-align: left;
  line-height: 45px;
}
.file-area.in-file .file-area-in .action-area {border-bottom: 0;}
.file-area-in .action-area .file-name {
  overflow: hidden;
  display: inline-block;
  width: 65%;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: "Pretendard-Medium";
}
.file-area-in .action-area .btn-area,
.panel-list.add-file-area .file-area-in .action-area .btn-area {
  position: absolute;
  right: 12px;
}
.board-area dl dd .btn-area.file-item {
  top : -0.5rem;
}
.file-area-in .action-area .btn-area a {
  display: inline-block;
  width: 24px;
  height: 24px;
  vertical-align: inherit;
  line-height: 24px;
  opacity: .4;
}
.file-area-in .action-area .btn-area a + a {margin-left: 6px;}
.file-area-in .action-area .btn-area a i {
  width: 24px;
  height: 24px;
  vertical-align: middle;
  font-size: 24px;
}
.file-area-in .action-area .btn-area a i::before {
  width: 100%;
  height: 100%;
  content: '';
}
.file-area-in .action-area .btn-area a i.ico-uni-rotate::before {
  background: url('../images/ico-rotate.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.file-area-in .action-area .btn-area a i.ico-uni-download::before {
  background: url('../images/ico-download.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.file-area-in .action-area .btn-area a i.ico-uni-search::before {
  background: url('../images/ico-search.svg') 50% 50% no-repeat;
  background-size: 18px;
}
.file-area-in .action-area .btn-area a i.ico-uni-close::before {
  background: url('../images/ico-close.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.panel-list.add-file-area .file-area-in .action-area .btn-area {
  width: inherit;
  height: inherit;
  line-height: inherit;
}
.panel-list.add-file-area .file-area-in .action-area .btn-area a i {color: inherit;}
.file-area-in .img-box {
  display: table-cell;
  width: 333px;
  height: 288px;
  vertical-align: middle;
  background-color: #ededf1;
}
.file-area-in .img-box img {
  max-width: 333px;
  max-height: 288px;
}
.file-area-in .img-box .btn-area.in-btn-scan {
  position: absolute;
  top: inherit;
  right: 16px;
  bottom: 16px;
}
.file-area-in .img-box .btn-area.in-btn-scan .btn-scan {
  position: relative;
  width: 38px;
  height: 38px;
  /* border: 1px solid #bbb; */
  border-radius: 50%;
  background-color: #fff;
}
.file-area-in .img-box .btn-area.in-btn-scan .btn-scan::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-text-scan.svg') 50% 50% no-repeat;
  background-size: 21px 24px;
}
.file-area .file-box {
  display: inline-block;
  margin-top: calc(50% - 67px);
}
.file-area .file-box i {
  font-size: 67px;
  color: #888;
}

.content-area dl.add-file-area.add-doc dd {
  align-items: center;
  flex-direction: row;
  position: relative;
  padding: 0 15px;
  line-height: 24px;
  background-color: #F9F9FD;
  box-sizing: border-box;
}
.content-area dl.add-file-area.add-doc dt + dd:nth-child(2):last-child {
  padding: 4px 15px;
  border-radius: 8px;
}
.content-area dl.add-file-area.add-doc dt + dd {
  padding-top: 4px;
  border-radius: 8px 8px 0 0;
}
.content-area dl.add-file-area.add-doc dd:last-child {
  margin-bottom: 20px;
  padding-bottom: 4px;
  border-radius: 0 0 8px 8px;
}
.content-area dl.add-file-area.add-doc dd .add-ref-name {
  overflow: hidden;
  display: inline-block;
  position: relative;
  width: 100%;
  height: 38px;
  text-align: left;
  vertical-align: top;
  line-height: 40px;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: "Pretendard-Medium";
}
.content-area dl.add-file-area.add-doc dd .add-ref-name:first-child {border-radius: 8px 8px 0 0;}
.content-area dl.add-file-area.add-doc dd .add-ref-name:last-child {border-radius: 0 0 8px 8px;}
.content-area dl.add-file-area.add-doc dd .add-ref-name:only-child {border-radius: 8px;}
.content-area dl.add-file-area.add-doc dd .btn-area {
  position: inherit;
  top: inherit;
  right: inherit;
  margin-left: auto;
}
.content-area dl.add-file-area.add-doc dd .btn-area a {
  display: inline-block;
  width: 24px;
  height: 24px;
  margin: 0;
  line-height: 24px;
  opacity: .4;
}
.content-area dl.add-file-area.add-doc dd .btn-area a i {
  display: inline-flex;
  width: 100%;
  height: 100%;
}
.content-area dl.add-file-area.add-doc dd .btn-area a i::before {
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-close.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.panel-list.add-file-area dt .btn-area {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  display: flex;
}

.panel-list.add-file-area dt .btn-area a {
  display: inline-block;
  width: 24px;
  height: 24px;
  margin-left: 12px;
}

.panel-list.add-file-area dt .btn-area a i {
  display: block;
  width: 100%;
  height: 100%;
}
.panel-list.add-file-area dt .btn-area a i.ico-uni-file::before {
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  background: url('../images/ico-file.svg') 50% 50% no-repeat;
  background-size: 16px;
}

/* - 원본사진 보기 - */
.img-control {padding-top: 1.2rem;}
.img-control-in {
  position: relative;
  width: calc(100vw - 2.4rem);
  height: calc(100vh - 5.8rem);
  margin: 0 auto;
  text-align: center;
  background-color: #000;
}
.img-control-in .btn-area {
  position: absolute;
  top: 1.2rem;
  right: 1.2rem;
}
.img-control-in .btn-area a {
  display: block;
  width: 2rem;
  height: 2rem;
  text-align: center;
  line-height: 2rem;
  font-size: 1.2rem;
  color: #fff;
  border: 1px solid #fff;
  border-radius: 50%;
  background-color: rgba(0,0,0,.7);
}
.img-control-in .btn-area a + a {margin-top: 1rem;}
.img-control-in .btn-area a i::before {font-weight: bold;}
.img-control-in img {
  max-width: 100%;
  max-height: 80vh;
}

/* --- 증빙(영수증) 보기 등록화면에 추가 --- */
.board-area dl.receipt-area {
  padding: 0;
  background-color: inherit;
}
.board-area dl.receipt-area > dt {
  position: relative;
  width: 100%;
  padding: 1.2rem 1.9rem;
  background-color: rgba(0,143,213,.08);
  box-sizing: border-box;
}
.board-area dl.receipt-area > dd {width: 100%;}
.receipt-area .receipt-box {padding: 1.2rem;}
.receipt-area .view-receipt {
  position: relative;
  width: 100%;
  max-width: 20.8rem;
  margin: 0 auto;
  border: 1px dashed #bbb;
}
.receipt-area .view-receipt .view-receipt-in {box-shadow: none;}
.receipt-area .view-receipt .view-receipt-in::after {display: none;}
.receipt-area .view-receipt .view-receipt-in dl,
.receipt-area .view-receipt .view-receipt-in dl dt,
.receipt-area .view-receipt .view-receipt-in dl dd {
  margin: 0;
  padding: 0;
}
.receipt-area .view-receipt .view-receipt-in .line-1st dl dt {color: inherit;}

/* 증빙(영수증) 보기 */
.view-receipt .progress-ing {
  width: 100%;
  position: absolute;
  top: calc(50% - 4.2rem);
  left: 0%;
  text-align: center;
  z-index: 10;
  animation: fadeInUp .5s ease-in-out 1;
}
.view-receipt .progress-ing span {
  font-family: 'Pretendard-SemiBold';
  font-size: 4.2rem;
  color: rgba(255,37,58,.1);
}
.view-receipt-in {
  position: relative;
  width: calc(100% - 2.4rem);
  max-width: 20.8rem;
  margin: 0 auto;
  padding: 1.2rem;
  background-color: #fff;
  box-shadow: 0 0.5rem 0.5rem rgba(18,42,79,.07);
}
.view-receipt-in::after {
  display: block;
  content: '';
  position: absolute;
  bottom: -0.7rem;
  left: 0;
  width: 100%;
  height: 0.7rem;
  background: url('../images/bg-receipt-bott.png') 0 0 repeat-x;
  background-size: 0.8rem;
}
.view-receipt-in > p:first-child {
  padding: 1rem 0 1.4rem;
  font-family: "Pretendard-Medium";
  text-align: center;
  font-size: 1.15rem;
  border-bottom: 3px double #ddd;
}
.view-receipt-in dt.point {
  overflow: hidden;
  width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.view-receipt-in dt.point + dd {display: none;}
.view-receipt-in .line-1st {margin-top: 1.2rem;}
.view-receipt-in div + div {
  margin-top: 1.2rem;
  padding-top: 1.2rem;
  border-top: 1px solid #ddd;
}
.view-receipt-in div dl {
  overflow: hidden;
  line-height: 1.9rem;
  font-size: 0.85rem;
}
.view-receipt-in div dl * {float: left;}
.view-receipt-in div dl dt {width: 40%;}
.view-receipt-in div dl dd {width: 60%;}
.view-receipt-in div dl dd.address {
  height: 2.8rem;
  overflow: hidden;
  display: -webkit-box;
  margin-top: 0.2rem;
  line-height: 1.4rem;
  text-overflow: ellipsis;
  white-space: normal;
  -o-text-overow: ellipsis;
  -webkit-line-clamp: 2;
  word-wrap: break-word;
  -webkit-box-orient: vertical;
}
.view-receipt-in .line-2nd dl dt,
.view-receipt-in .line-3rd dl dt {
  color: #777;
}
.view-receipt-in .line-3rd dl dd {text-align: right;}

/* - 작성 팝업 - */
.write-pop-area {height: calc(100vh - 6.6rem);}
.write-pop-area textarea {
  height: 100%;
  padding: 0 1.2rem;
  line-height: calc(2.4rem - 0.5px);
  border: 0;
  background: repeating-linear-gradient( rgba(0,0,0,.05), rgba(0,0,0,.05) 1px, #fffdf3 1px, #fffdf3 calc(2.4rem - 0.5px));
  background-attachment: local;
}

/* - 영수증 스캔 추가 - */
.img-scan .img-control .img-control-in {
  height: auto;
  max-height: 80vh;
}
.img-scan .scanning-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.img-scan .scanning-box::before {
  display: block;
  width: 100%;
  height: 100%;
  content: '';
  background-color: #3fefef;
  opacity: .2;
}
.img-scan .scanning-box .scanning-bar {
  display: flex;
  align-items: center;
  justify-content: center;
}
.img-scan .scanning-box .scanning-bar::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  content: '';
  background: #3fefef;
  filter: drop-shadow(0 0 5px #3fefef)
  drop-shadow(0 0 10px #3fefef);
  animation: animate-line 8s ease-in-out infinite;
}
.img-scan .scanning-box p {
  position: absolute;
  left: 0;
  top: 0;
  min-width: 4rem;
  height: 1.8rem;
  padding: 0 0.6rem;
  line-height: 1.8rem;
  font-size: 0.8rem;
  color: #3fefef;
  background-color: #222;
}
.img-scan .scanning-box p span {animation: opacity 1s ease-in-out infinite;}
.img-scan .scan-cont {
  margin-top: 1.2rem;
  padding: 1.2rem;
  background-color: #fff;
}
.img-scan .scan-cont dt {
  position: relative;
  height: 3.1rem;
  margin: -1.2rem -1.2rem 1.2rem;
  padding: 0 1.2rem;
  font-family: 'Pretendard-Medium';
  line-height: 3.1rem;
  background-color: #ddecf5;
}
.img-scan .scan-cont dd .tbl-area .tbl-tt {
  margin-bottom: 0.5rem;
  font-family: 'Pretendard-Medium';
}
.img-scan .scan-cont dd .tbl-area th,
.img-scan .scan-cont dd .tbl-area td {
  font-size: 0.8rem;
  background-color: transparent;
  border-right: 0;
}
.img-scan .scan-cont dd .tbl-area td.align-r {
  padding-left: 0;
  padding-right: 0;
}
.img-scan dd .message-box {
  width: calc(100% - 2.4rem);
  margin-top: 1.2rem;
  padding: 0.7rem 1.2rem;
  line-height: 1.3rem;
  font-size: 0.85rem;
  border-radius: 0.2rem;
  background-color: rgba(255,37,58,.05);
}
.img-scan dd .btn-area {margin-top: 1.2rem;}


/* --- 기본 게시판 --- */
/* - 목록 - */
.board-basic.list .board-list {
  display: flex;
  flex-direction: column;
}
.board-basic.list .board-list li > *:nth-child(1),
.board-basic.list .board-area ul li > a::after {display: none;}
.board-basic.list .board-list li {
  position: relative;
  padding: 0;
}
.board-basic.list .board-list li.no-cont {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 5.25rem;
  text-align: center;
}
.board-basic.list .board-list li + li {margin-top: 0;}
.board-basic.list .board-list li > *:nth-child(2) {
  overflow: hidden;
  padding: 1.2rem 1.2rem 2.8rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.board-basic.list .board-list li > *:nth-child(3) {
  position: absolute;
  bottom: 1rem;
  right: 1rem;
  pointer-events: none;
}
.board-basic.list .board-list li > *:nth-child(4) {
  position: absolute;
  margin: -2.4rem 0 0 1.2rem;
  color: #999;
  pointer-events: none;
}

/* - 게시판 상단 옵션 - */
.board-basic .op-area {
  position: relative;
  padding: 20px;
  text-align: center;
}
.board-basic .op-area .total {
  display: block;
  font-size: 18px;
}
.board-basic .op-area .total span {
  margin-left: 5px;
  font-family: 'Pretendard-Bold';
  color: #FF6225;
}
.board-basic .op-area .search-box {
  margin: 0 0 10px;
  padding-top: 0;
  background-color: inherit;
}
.board-basic .op-area .search-box .inp-area {width: 65%;}
.board-basic .op-area .search-box .inp-area .inp {
  width: calc(100% - 30px);
  box-sizing: border-box;
}
.board-basic .op-area .search-box .inp-area .inp + i {
  width: 30px;
  height: 30px;
  margin-top: -3px;
  text-align: center;
  line-height: 30px;
  font-size: 20px;
  color: #fff;
  background-color: #888;
  cursor: pointer;
}
.board-basic .op-area .btn-area.tab {margin-top: 1rem;}
.board-basic .op-area .btn-area.tab span {
  display: inline-block;
  width: 1.9rem;
  height: 1.9rem;
  padding: 0.125rem;
  text-align: center;
  line-height: 1.9rem;
  border-radius: 50%;
  background-color: #FFF;
  cursor: pointer;
}
.board-basic .op-area .btn-area.tab span.on {
  color: #FFF;
  background-color: #ff253a;
}
.board-basic .op-area .btn-area.tab span + span {margin-left: 0.2rem;}
.board-basic .op-area .btn-area.tab span i {font-size: 1.2rem;}
.board-basic .op-area .btn-area.tab span i::before {font-weight: bold;}

/* - 게시판 상단 옵션 / 카운트 - */
.uni-board .board-area .set-noti-area {
  margin-bottom: 12px;
  border-radius: 20px;
  background-color: #fff;
}
.uni-board .board-area .set-noti-area .total-num {
  padding: 12px 20px;
  line-height: 24px;
  font-family: 'Pretendard-SemiBold';
  border: 1px solid rgba(14, 92, 233, 0.25);
  border-radius: 20px;
  background-color: rgba(14, 92, 233, 0.08);
}
.uni-board .board-area .set-noti-area .total-num span {
  font-family: 'Pretendard-Bold';
  color: rgba(255, 98, 37, 1);
}

/* - 게시판 상세 - */
.board-detail .detail-tt {
  padding: 20px;
  line-height: 28px;
  border-bottom: 1px solid #999;
  background-color: #fff;
}
.board-detail .detail-tt p {
  font-family: 'Pretendard-SemiBold';
  font-size: 17px;
}
.board-detail .detail-tt span {color: #888;}
.board-detail .detail-cont {
  margin-top: 0;
  padding: 20px;
  line-height: 28px;
}
.board-detail .detail-cont div p + p {margin-top: 20px;}
.board-detail .detail-cont .attached-file {
  margin-top: 45px;
  padding: 11px 22px;
  color: #001f3d;
  background-color: #fafafc;
}
.board-detail .detail-cont .attached-file a {
  display: block;
  position: relative;
  padding-left: 22px;
  line-height: 28px;
  color: #001f3d;
}
.board-detail .detail-cont .attached-file a::before {
  display: inline-block;
  overflow: hidden;
  font-family: "unifont";
  content: '\e810';
  position: absolute;
  top: 0;
  left: 0;
  font-size: 22px;
}
.board-detail .detail-prev,
.board-detail .detail-next {
  margin: 0 20px;
  background-color: inherit;
}
.board-detail li.detail-prev {border-top: 1px solid #ddd;}
.board-detail li.detail-next {
  margin-bottom: 40px;
  border-top: 1px solid #ddd;
}
.board-detail .detail-prev dl,
.board-detail .detail-next dl {
  display: inherit;
  padding: 10px;
  line-height: 24px;
  background-color: inherit;
}
.board-detail .detail-prev dl > *,
.board-detail .detail-next dl > * {
  float: none;
}
.board-detail .detail-prev dl dt,
.board-detail .detail-next dl dt {
  margin-bottom: 8px;
  font-family: 'Pretendard-Medium';
  font-size: 14px;
  color: #6dc34a;
}
.board-detail .detail-prev dl dd,
.board-detail .detail-next dl dd {
  width: 100%;
}
.board-detail .detail-prev dl dd a,
.board-detail .detail-next dl dd a {
  display: block;
  margin-left: 0;
  text-decoration: none;
  color: inherit;
}
.board-detail + .btn-area {
  margin-top: 40px;
  text-align: center;
}

/* - 공지사항 내부 스타일 수정 - */
.m-notice-detail .cont-area > * + * {margin-top: 0.6rem;}
.m-notice-detail .cont-area * + h3 {margin-top: 1.2rem;}
.m-notice-detail .cont-area h4 {margin-top: 0.6rem;}
.m-notice-detail .cont-area img {max-width: 100%;}
.m-notice-detail .cont-area dl dt,
.m-notice-detail .cont-area dl dd {width: inherit;}
.m-notice-detail .main-noti .renew-point + dl,
.m-notice-detail .main-noti .renew-point {border: 1px solid #ddd;}
.m-notice-detail .pes-grand-open .point-yel {
  font-family: "Pretendard-Medium";
  color: inherit !important;
}
.board-detail .add-comment dt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  padding: 10px 0 !important;
}
.board-detail .add-comment dt .btn-on-off {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  color: rgba(14, 92, 233, 1);
}
.board-detail .add-comment .comment-list:first-child {margin-top: 0;}
.board-detail .add-comment .comment-list.reply {
  position: relative;
  padding: 11px 34px;
  background-color: #fafafc;
}
.board-detail .add-comment .comment-list.reply::before {
  position: absolute;
  top: 16px;
  left: 16px;
  content: '';
  width: 8px;
  height: 8px;
  border-left: 1px solid #999;
  border-bottom: 1px solid #999;
}
.board-detail .add-comment .comment-list > span {
  order: 2;
  display: block;
  width: 85%;
  font-size: 14px;
  color: #888;
}
.board-detail .add-comment .comment-list > span:first-child {margin-top: 4px;}
.board-detail .add-comment .comment-list > span + span {color: #888;}
.board-detail .add-comment .comment-list > p {order: 1;}
.board-detail .add-comment .comment-list > .in-comment {
  position: relative;
  display: inline-block;
  width: inherit;
  height: 24px;
  margin-top: 16px;
  padding: 0 8px;
  line-height: 24px;
  border: 1px solid #aaa;
  cursor: pointer;
  color: #aaa;
}
.board-detail .add-comment .comment-list > .btn-area {
  align-items: flex-end;
  position: absolute;
  top: 0;
  bottom: 12px;
  right: 12px;
  margin: 0;
}
.board-detail .add-comment .comment-list > .btn-area i {
  display: flex;
  position: relative;
  width: inherit;
  font-size: 14px;
  cursor: pointer;
}
.board-detail .add-comment .comment-list > .btn-area i + i {margin-left: 16px;}
.board-detail .add-comment .comment-list > .btn-area i::before {
  display: flex;
  width: inherit;
  font-family: "Pretendard-Regular";
  color: #555;
}
.board-detail .add-comment .comment-list > .btn-area i.ico-uni-write-modify::before {content: '수정';}
.board-detail .add-comment .comment-list > .btn-area i.ico-uni-close::before {content: '삭제';}
.board-detail .add-comment .comment-list > .btn-area i + i::after {
  position: absolute;
  top: 1px;
  left: -8px;
  width: 1px;
  height: 13px;
  content: '';
  background-color: #bbb;
}
.board-detail .add-comment .comment-write {
  margin-top: 20px;
  border: 1px solid #ddd;
  background-color: #fff;
}
.board-detail .add-comment .comment-write .tox-tinymce {
  border: 0;
}
.board-detail .add-comment .comment-list .comment-write.in-size {
  margin: 11px 0;
  border: 1px solid #eee;
}
.board-detail .add-comment .comment-list.reply .comment-write.in-size {margin: 11px -22px;}
.board-detail .add-comment .comment-write textarea {
  padding: 3px 8px;
  border: 0;
}
.board-detail .add-comment .comment-write .comment-upload {
  position: relative;
  height: 40px;
  border-top: 1px solid #F1F1F5;
}
.board-detail .add-comment .comment-write .comment-upload p {
  padding-left: 22px;
  font-size: 12px;
  line-height: 40px;
  color: #888;
  background-color: #F1F1F5;
}
.board-detail .add-comment .comment-write .comment-upload p span {color: #222;}
.board-detail .add-comment .comment-write .comment-upload button {
  position: absolute;
  top: 0;
  right: 0;
  height: 40px;
  padding: 0 16px;
  line-height: 40px;
  font-family: "Pretendard-Regular";
  font-size: 15px;
  color: #222;
  border-color: #ccc;
  border-radius: 4px;
  background-color: #fff;
}

/* - 목록(작성) - */
.uni-board .board-basic.write .checkbox-area {margin-top: 11px;}
.uni-board .board-basic.write .checkbox-area:only-child {margin: 0;}
.uni-board .board-basic.write .board-area dl.in-editor {padding: 0;}
.uni-board .board-basic.write .board-area dl.in-editor dt {display: none;}
.uni-board .board-basic.write .board-area dl.in-editor dd {
  width: 100%;
  margin: 0;
}

.board-detail .add-comment dt .badge-num {
  margin-left: 6px;
  color: #FF6225;
}
.board-detail .detail-prev dl dt,
.board-detail .detail-next dl dt {
  color: #62ab41
}
.board-detail .add-comment .comment-write textarea {
  width: 100%;
  padding: 16px;
  border: 0;
  font-size: 14px;
}
.board-detail .add-comment .comment-upload button {
  height: 32px;
  padding: 0 16px;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 6px;
  font-family: "Pretendard-Medium";
  font-size: 14px;
  color: #222;
}
.btn-area.btn-mix .bid-reject  {
  background-color: #fff;
  border : 1px solid #000;
  color: #222;
}

/* 스타일 조합 */
.btn-area.btn-mix {justify-content: center;}
.btn-area.btn-mix button {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-width: 88px;
  height: 52px;
  padding: 0 12px;
  white-space: nowrap;
  font-family: "Pretendard-SemiBold";
  font-size: 17px;
  border-radius: 12px;
  box-sizing: border-box;
}
.btn-area.btn-mix button + button {margin-left: 8px;}
.btn-area.btn-mix button.none + button {margin: 0;}
.btn-area.btn-mix button:not(.btn-c1,.btn-c-type) {
  flex: 0 0 auto;
  width: auto;
}
.pop-in.approval .pop-cont-area .btn-area.btn-mix button + button {
  margin-left: -8px !important;
}
.pop-in.approval .pop-cont-area .btn-area.bottom.btn-mix button.btn-c1-line {
  min-width: 244px !important;
  color: #fff !important;
  background-color: rgba(14, 92, 233, 1) !important;
}
.community.edit .btn-area.fixed.btn-mix button.btn-blue {
  color: #fff !important;
  background-color: rgba(14, 92, 233, 1) !important;
}
.btn-area.btn-mix:has(button:nth-child(4)) button {
  flex: 1;
  min-width: inherit;
}
.btn-area.btn-mix button:only-child,
.btn-area.btn-mix button.variable-wid {
  flex: 1;
  width: auto;
}
.btn-area.btn-mix .btn-c1 {
  flex: 1 1 auto;
  width: 100%;
  background-color: rgba(14, 92, 233, 1);
}
/* .btn-area.btn-mix button + button + .btn-c1 {flex: 0;}
.modal-my-photo .btn-area.btn-mix button + button + .btn-c1 {flex: 1 1 auto;} */
.btn-area.btn-mix .btn-def {
  color: #fff;
  border: 1px solid transparent;
  background-color: #333;
}
.btn-area.btn-mix .btn-c1.disabled,
.btn-area.btn-mix .btn-def.disabled {
  border-color: #ccc !important;
  background-color: #ccc !important;
  pointer-events: none;
}
.btn-area.btn-mix .btn-c1-line {
  color: rgba(14, 92, 233, 1);
  border-color: rgba(14, 92, 233, 1);
  background-color: #fff;
  min-width: 150px !important;
}
.btn-area.btn-mix .btn-act-line {
  color: rgba(255, 98, 37, 1);
  border: 1px solid rgba(255, 98, 37, 1);
  background-color: #fff;
}
.btn-area.btn-mix .btn-alert-line {
  color: rgba(255, 37, 58, 1);
  border: 1px solid rgba(255, 37, 58, 1);
  background-color: #fff;
}
.btn-area.btn-mix .btn-def-line {
  color: #333;
  border: 1px solid #333;
  background-color: #fff;
}
.btn-area.btn-mix .btn-c1-line.disabled,
.btn-area.btn-mix .btn-def-line.disabled,
.btn-area.btn-mix .btn-act-line.disabled,
.btn-area.btn-mix .btn-alert-line.disabled {
  color: #ccc !important;
  border-color: #ccc !important;
  background-color: #f5f5f5 !important;
  pointer-events: none;
}
.modal-center .btn-area.btn-mix button {
  flex: inherit;
  width: auto;
  min-width: 68px;
  height: 40px;
  font-size: 16px;
}
.btn-area.btn-mix .btn-c-type {
  flex: 1 1 auto;
  width: 100%;
  color: #fff;
}

/* 전자결재 버튼 추가 */
.btn-area.btn-mix .all-pass {background-color: #BD967E;}
.modal-set.bottom .btn-area.right .btn-ico {display: none;}

/* --- 추가 게시판 --- */
/* - 목록(기본) - */
.content-area .uni-board .board-list li {
  position: relative;
  background: #fff;
  border-radius: 1.125rem;
  margin-bottom: 0.625rem;
  border-top: none;
  border-bottom: none;
}
.content-area .uni-board .board-list {
  background: transparent;
}
.content-area .uni-board .board-list li .board-num,
.content-area .uni-board .board-list li .write-date {color: #999;}
.content-area .uni-board .board-list li .board-tt,
.content-area .uni-board .board-list li .write-user {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.content-area .uni-board .board-list li .board-tt {
  position: inherit;
  width: calc(100% - 4.8rem);
  padding: 1.2rem 3.5rem 2.8rem 1.2rem;
}
.content-area .uni-board .board-list li .board-tt .badge-num {
  position: absolute;
  top: 1.2rem;
  right: 1.2rem;
  color: #ff253a;
}
.content-area .uni-board .board-list li .board-tt .badge-num.plus::after {
  display: inline-block;
  content: '+';
}
.content-area .uni-board .board-list li .board-file {
  position: absolute;
  right: inherit;
  bottom: 0.8rem;
  left: 7rem;
  pointer-events: none;
}
.content-area .uni-board .board-list li .write-date {
  position: absolute;
  bottom: 1rem;
  left: 1.2rem;
  pointer-events: none;
  font-size: 0.8rem;
}
.content-area .uni-board .board-list li .write-user {
  position: absolute;
  bottom: 1rem;
  right: 1.2rem;
  width: 45%;
  margin: 0;
  text-align: right;
  color: inherit;
  pointer-events: none;
  font-size: 0.8rem;
}

/* - 상세(기본) - */
.uni-board .board-detail {
  overflow: hidden;
  border-radius: 20px;
  background-color: #fff;
}
.uni-board .board-detail li.detail-tt {
  position: relative;
  line-height: 24px;
  border-bottom: 1px solid #eee;
}
.uni-board .board-detail li.detail-tt .board-name {
  font-family: 'Pretendard-SemiBold';
  font-size: 14px;
}
.uni-board .board-detail li.detail-tt .board-tt {
  font-family: 'Pretendard-Medium';
  font-size: 18px;
}
.uni-board .board-detail li.detail-tt .board-name + .board-tt {margin-top: 2px;}
.uni-board .board-detail li.detail-tt .board-tt .badge-important {
  display: inline-block;
  width: 24px;
  margin-right: 6px;
  padding: 1px 6px;
  line-height: 20px;
  vertical-align: text-top;
  font-size: 12px;
  color: #FF6225;
  border: 1px solid #FF6225;
  border-radius: 28px;
}
.uni-board .board-detail li.detail-tt .write-user {
  display: inline-block;
  width: 100%;
  margin-top: 12px;
  font-size: 14px;;
}
.uni-board .board-detail li.detail-tt .write-date {
  display: inline-block;
  font-size: 14px;
}
.uni-board .board-detail li.detail-tt .viewer {
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: 18px;
  right: 95px;
  height: 28px;
  padding: 0 13px 0 38px;
  font-size: 14px;
  color: #555;
  border-radius: 30px;
  background-color: #F9F9FD;
}
.uni-board .board-detail li.detail-tt .viewer::before {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 8px;
  width: auto;
  height: 28px;
  content: '조회';
}
.uni-board .board-detail li.detail-tt .btn-area {
  overflow: hidden;
  position: absolute;
  bottom: 18px;
  right: 20px;
}
.uni-board .board-detail li.detail-tt .btn-area a {
  width: 28px;
  height: 28px;
  text-align: center;
  border-radius: 50%;
  background-color: #F9F9FD;
}
.uni-board .board-detail li.detail-tt .btn-area a + a {margin-left: 8px;}
.uni-board .board-detail li.detail-tt .btn-area a i {
  display: flex;
  width: 100%;
  height: 100%;
}
.uni-board .board-detail li.detail-tt .btn-area a i::before {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/btn-ico-arrow.svg') 50% 50% no-repeat;
  background-size: auto 10px;
}
.uni-board .board-detail li.detail-tt .btn-area a i.ico-uni-arrow-right::before {
  transform: rotateZ(180deg) translateZ(0);
  will-change: transform;
}
.uni-board .board-detail li.detail-cont {padding: 24px 20px;}
.uni-board .board-detail li.detail-cont * {
  border: 0;
  box-shadow: none;
}
.uni-board .board-detail li.detail-prev dl dd a,
.uni-board .board-detail li.detail-next dl dd a {
  overflow: hidden;
  width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.uni-board .board-detail li.detail-prev dl dd .write-user,
.uni-board .board-detail li.detail-next dl dd .write-user {
  overflow: hidden;
  position: absolute;
  top: -32px;
  right: 0;
  width: calc(100% - 104px);
  margin: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: right;
  font-size: 14px;
  color: #888;
}
.uni-board .board-detail dl.file-upload-box {
  margin-bottom: 12px;
  padding: 20px;
}

/* 댓글 추가 */
.board-detail .add-comment {padding: 12px 20px 40px;}
.board-detail .add-comment dl {
  flex-direction: column;
  width: 100%;
  padding: 0;
}
.board-detail .add-comment dt,
.board-detail .add-comment dd {
  float: inherit;
  width: inherit;
  height: inherit;
  padding: 0;
  line-height: inherit;
  border: 0;
}
.board-detail .add-comment dt .btn-on-off::after {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 8px;
  height: 8px;
  content: '';
  background: url('../images/btn-ico-arrow-bl.svg') 50% 50% no-repeat;
  background-size: auto 8px;
  transform: rotateZ(-90deg) translateZ(0);
  will-change: transform;
}
.board-detail .add-comment.on dt .btn-on-off::after {transform: rotateZ(90deg) translateZ(0);}
.board-detail .add-comment dt p {font-family: "Pretendard-SemiBold";}
.board-detail .add-comment dt .badge-num {
  margin-left: 4px;
  font-family: "Pretendard-SemiBold";
  color: #FF6225;
}
.board-detail .add-comment dd {display: none;}
.board-detail .add-comment.on dd {display: block;}
.board-detail .add-comment .comment-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  position: relative;
  margin-top: 12px;
  padding: 12px 16px;
  border-radius: 8px;
  background-color: #F9F9FD;
}
.board-detail .add-comment .comment-list.reply .comment-write.in-size {margin: 0.7rem -1.4rem;}
.board-detail .add-comment .comment-write textarea {
  padding: 0.2rem 0.5rem;
  border: 0;
}
.board-detail .add-comment .comment-write .comment-anony {
  display: flex;
  position: relative;
  border-top: 1px solid #f5f5f5;
}
.board-detail .add-comment .comment-write .comment-anony input {
  height: 2.6rem;
  width: 50%;
}
.board-detail .add-comment .comment-write .tox .tox-statusbar {
  border-top: none;
}

/* - 목록(작성) - */
.uni-board .board-basic.write .board-area dl.in-editor {padding: 0;}
.uni-board .board-basic.write .board-area dl.in-editor dt {display: none;}
.uni-board .board-basic.write .board-area dl.in-editor dd {width: 100%;}


/* --- btn --- */
.btn-area {
  overflow: hidden;
  display: flex;
  position: relative;
  text-align: center;
}
.btn-area::after {
  display: block;
  content: '';
  clear: both;
}
.btn-area.fixed {
  overflow: visible;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 12px;
  background-image: linear-gradient(to bottom, rgba(255,255,255,.2) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%);
  z-index: 10;
  box-sizing: border-box;
}
.btn-area.fixed.edit {
  display: flex;
  gap: 0px;
}
.btn-area.fixed.edit button:first-child {
  flex: 0 0 auto;
  width: 88px;
}
.btn-area.fixed.edit button:last-child {
  flex: 1;
  margin-left: 6px;
}

.btn-area.inner {margin: 1.9rem 1.9rem 0;}
.btn-fl-left {float: left;}
.btn-fl-right {float: right;}
.btn-area > * + * {margin-left: 10px;}
.btn-fl-left *,
.btn-fl-right * {vertical-align: middle;}
.btn-center {display: inline-block;}
.btn-po-left {position: absolute;top: 0;left: 0;}
.btn-po-right {position: absolute;top: 0;right: 0;}

/* size */
.btn-100,
.btn-50,
.btn-33 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 52px;
  font-family: "Pretendard-Bold";
  font-size: 17px;
  color: #fff;
  border-radius: 12px;
  box-sizing: border-box;
}
.btn-25 {
  float: left;
  width: 25%;
  max-width: 8rem;
  height: 3.2rem;
  font-family: "Pretendard-Regular";
  line-height: 3.2rem;
  font-size: 1rem;
  color: #fff;
}
.btn-20 {
  float: left;
  width: 20%;
  max-width: 8rem;
  height: 3.2rem;
  font-family: "Pretendard-Regular";
  line-height: 3.2rem;
  font-size: 1rem;
  color: #fff;
}
.btn-area .btn-33:only-child,
.btn-area .btn-25:only-child,
.btn-area .btn-20:only-child {
  max-width: 8rem;
}
.btn-list {
  height: 1.75rem;
  margin-bottom: 0.05rem;
  padding: 0 0.6rem;
  font-family: "Pretendard-Regular";
  line-height: 1.75rem;
  font-size: 0.85rem;
  border: 1px solid #ccc;
  border-radius: 1.75rem;
}

/* color */
/*.pes .btn-c1,*/
.btn-pes {
  color: #fff;
  background-color: #008fd5;
  border: 1px solid #008fd5;
}
/*.approval .btn-c1,*/
.btn-approval {
  color: #fff;
  background-color: #008fd5;
  border: 1px solid #008fd5;
  font-size: 17px;
}
/*.econ .btn-c1,*/
.btn-econ {
  color: #fff;
  background-color: #e54160;
  border: 1px solid #e54160;
}
/*.pds .btn-c1,*/
.btn-pds {
  color: #fff;
  background-color: #51b300;
  border: 1px solid #51b300;
}
/*.tax .btn-c1,*/
.btn-tax,
/*.salescon .btn-c1,*/
.btn-salescon {
  color: #fff;
  background-color: #00c0b5;
  border: 1px solid #00c0b5;
}
/*.avs .btn-c1,*/
.btn-avs {
  color: #fff;
  background-color: #1ac6ed;
  border: 1px solid #1ac6ed;
}
/* .community .btn-c1, */
.btn-community {
  color: #fff;
  background-color: #6dc34a;
  border: 1px solid #6dc34a;
}
.btn-red,
.btn-danger {
  color: #fff;
  background-color: #ff253a;
  border: 1px solid #ff253a;
}
.btn-222 {
  color: #fff;
  background-color: #222;
  border: 1px solid #222;
}
.btn-555 {
  color: #fff;
  background-color: #555;
  border: 1px solid #555;
}
.btn-999 {
  color: #fff;
  background-color: #999;
  border: 1px solid #999;
}
.btn-eee {
  color: inherit;
  background-color: #eee;
  border: 1px solid #eee;
}
.btn-c1-line {
  color: #222;
  border: 1px solid #222;
}
.btn-blue {
  background-color: rgba(14,92,233,1);
  border-radius: 12px;
}
.btn-cancle {
  color: #222;
  background-color: #fff;
  border-radius: 12px;
  border: 1px solid #222;
  width: 22%;
}
.pes .btn-c1-line,
.btn-pes-line {
  color: #008fd5;
  border: 1px solid #008fd5;
}
.approval .btn-c1-line,
.btn-approval-line {
  color: #ff8b00;
  border: 1px solid #ff8b00;
}
.econ .btn-c1-line,
.btn-econ-line {
  color: #e54160;
  border: 1px solid #e54160;
}
.pds .btn-c1-line,
.btn-pds-line {
  color: #51b300;
  border: 1px solid #51b300;
}
.tax .btn-c1-line,
.btn-tax-line,
.salescon .btn-c1-line,
.btn-salescon-line {
  color: #00c0b5;
  border: 1px solid #00c0b5;
}
.avs .btn-c1-line,
.btn-avs-line {
  color: #17b2d5;
  border: 1px solid #17b2d5;
}
.community .btn-c1-line,
.btn-community-line {
  color: #6dc34a;
  border: 1px solid #6dc34a;
}
.btn-red-line {
  color: #ff253a;
  border: 1px solid #ff253a;
}
.btn-222-line {
  color: #222;
  border: 1px solid #222;
}
.btn-555-line {
  color: #555;
  border: 1px solid #555;
}
.btn-999-line {
  color: #999;
  border: 1px solid #999;
}
.btn-ccc-line {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  padding: 0 10px;
  font-family: "Pretendard-Regular";
  font-size: 14px;
  color: #222;
  border: 1px solid #333;
  border-radius: 28px;
}
.btn-area.left .btn-ccc-line:last-child {
  margin-left: 4px;
}

/* 전결 */
.btn-arbitrary {
  color: #fff;
  background-color: #bd967e;
  border: 1px solid #bd967e;
}
.popup-area .btn-area button {color: #999;}
.popup-area .btn-area button.uni {color: #222;}
.popup-area .btn-area button.pes {color: #008fd5;}
.popup-area .btn-area button.approval {color: #ff8b00;}
.popup-area .btn-area button.econ {color: #e54160;}
.popup-area .btn-area button.pds {color: #51b300;}
.popup-area .btn-area button.tax,
.popup-area .btn-area button.salescon {color: #00c0b5;}
.popup-area .btn-area button.avs {color: #1ac6ed;}
.popup-area .btn-area button.community {color: #6dc34a;}
.btn-more {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  height: 40px;
  margin: 24px 12px 0;
  padding: 0 12px;
  font-family: "Pretendard-SemiBold";
  font-size: 16px;
  color: #888;
  background-color: #fff;
/*  border: 1px solid rgba(136,136,136,.5);*/
}
.btn-end {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  height: 40px;
  margin: 24px 12px 0;
  padding: 0 12px;
  font-family: "Pretendard-SemiBold";
  font-size: 16px;
  color: #aaa;
  border: transparent;
  border-radius: 12px;
  background-color: rgba(136,136,136,.1);
}
.board-area .btn-more,
.board-area .btn-end {
  margin: 24px 0;
}
.btn-write {
  position: fixed;
  right: 8px;
  bottom: 8px;
}
.btn-write i {
  position: relative;
  font-size: 3.2rem;
}
.btn-write i::after {
  position: absolute;
  top: 0.8rem;
  left: 0.8rem;
  display: inline-block;
  content: '';
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 50%;
  background-color: #fff;
  z-index: -1;
}
.btn-write-tt {
  position: fixed;
  right: 1.2rem;
  bottom: 1.2rem;
  width: 2.8rem;
  height: 2.8rem;
  text-align: center;
  line-height: 2.8rem;
  font-size: 0.85rem;
  color: #fff;
  border-radius: 50%;
  background-color: #222;
}

/* 추가 */
.btn-c1 {
  color: #fff;
  border-color: rgba(14, 91, 233, 1);
  background-color: rgba(14, 91, 233, 1);
}
.btn-def {
  color: #fff;
  border: 1px solid #333;
  background-color: #333;
}
.btn-area .btn-c1.disabled,
.btn-area .btn-def.disabled {
  border-color: transparent;
  background-color: #ccc;
  pointer-events: none;
}
.btn-def-line {
  color: #333;
  border: 1px solid #333;
  background-color: #fff;
}
.btn-basic-line {
  color: #333;
  border: 1px solid #333;
  background-color: #fff;
}
.btn-float {
  position: relative;
  padding: 8px 12px;
  font-size: 16px;
  color: #fff;
  border-radius: 12px;
  background-color: rgba(0,8,22,.7);
}
.btn-float.write {padding-left: 36px;}
.btn-float.write::before {
  position: absolute;
  top: 0;
  left: 8px;
  width: 24px;
  height: 100%;
  content: '';
  background: url('../images/ico-write2-w.svg') 50% 50% no-repeat;
  background-size: 15px;
}
.header .btn-area .btn-c1 {
  display: flex;
  align-items: center;
  width: inherit;
  height: 32px;
  padding: 0 12px;
  font-family: "Pretendard-SemiBold";
  color: #fff;
  border-radius: 12px;
  background-color: #008FD5;
  box-sizing: border-box;
}
.header .btn-area .btn-def {
  display: flex;
  align-items: center;
  width: inherit;
  min-width: inherit;
  height: 32px;
  padding: 0 12px;
  font-family: "Pretendard-SemiBold";
  font-size: 16px;
  color: #fff;
  border-radius: 12px;
  background-color: #333;
  box-sizing: border-box;
}
.header .btn-area .btn-c1.disabled,
.header .btn-area .btn-def.disabled {
  border-color: transparent;
  background-color: #ccc;
  pointer-events: none;
}
.count-box {
  position: fixed;
  bottom: 86px;
  left: 0;
  width: 100%;
  margin: 0 auto;
  text-align: center;
  z-index: 10;
  opacity: 1;
  pointer-events: none;
}
.board-area.noti-list .count-box {bottom: 24px;}
.btn-more.in-count-area,
.btn-end.in-count-area {
  gap: 12px;
}
.btn-more.in-count-area .count-area,
.btn-end.in-count-area .count-area {
  display: flex;
  gap: 3px;
  font-size: 14px;
}
.btn-more.in-count-area .count-area span:first-child {color: #222;}
.count-box-in {
  display: inline-block;
  padding: 6px 10px;
  font-size: 14px;
  border-radius: 12px;
  background-color: rgba(228,229,233,.5);
}
.count-box-in span:first-child {
  font-family: 'Pretendard-Medium';
  color: #222;
}
.count-box-in span + span {
  margin-left: 3px;
  color: #888;
}

/* 아이콘 버튼 */
.btn-area .btn-ico i {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 1.5rem;
  height: 1.5rem;
}
.btn-area .btn-ico.new i::before {
  position: absolute;
  top: -2px;
  right: -1px;
  content: '';
  width: 6px;
  height: 6px;
  border: 3px solid #fff;
  border-radius: 50%;
  background-color: #FF6225;
}
.btn-area .btn-ico .btn-noti {
  display: inline-block;
  width: 40px;
  height: 24px;
  background-size: contain;
  vertical-align: middle;
  background: url('../images/ico-noti.svg') 50% 50% no-repeat;
}
.btn-area .btn-ico .btn-set {background: url('../images/ico-set.svg') 50% 50% no-repeat;}
.btn-area .btn-ico .btn-plus {background: url('../images/ico-plus.svg') 50% 50% no-repeat;}
.btn-area .btn-ico .btn-arrow {background: url('../images/ico-arrow.svg') 50% 50% no-repeat;}
.btn-area .btn-ico .btn-close {background: url('../images/ico-close.svg') 50% 50% no-repeat;}

 /* 기본 버튼 */
.btn-area .btn-def.line {
  color: #999;
  border: 1px solid #999;
}
.btn-area .btn-def.line.c1 {
  color: #1e88e3;
  border-color: #1e88e3;
}
.btn-area .btn-def.bg {
  color: #fff;
  border: 1px solid transparent;
  background-color: #222;
}
.btn-area .btn-def.bg.c1 {background-color: #1e88e3;}

/* 모달 버튼 스타일 추가 */
.modal-set .btn-area {
  display: flex;
  justify-content: center;
}
.modal-set .btn-area .btn-def + .btn-def {margin-left: 0.5rem;}
.btn-area .btn-def {
  display: inline-block;
  min-width: 4.25rem;
  height: 2.5rem;
  padding: 0 1rem;
  vertical-align: top;
  line-height: 2.5rem;
  font-family: "Pretendard-Medium";
  font-size: 0.9375rem;
  border-radius: 1rem;
  box-sizing: border-box;
}


/* --- form --- */
input::-webkit-input-placeholder,
input::-moz-placeholder,
input:-moz-placeholder,
input:-ms-input-placeholder {color: #bbb;}
textarea::-webkit-input-placeholder,
textarea::-moz-placeholder,
textarea:-moz-placeholder,
textarea:-ms-input-placeholder {color: #bbb;}
input:focus,
select:focus,
textarea:focus {
  outline: 0;
}
input.error,
select.error,
textarea.error,
input.error:focus,
select.error:focus,
textarea.error:focus {
  color: #ff253a;
  background-color: rgba(255,37,58,.05);
}
.inp-area,
.slt-area,
.form-slt{
  display: inline-block;
  position: relative;
}
.slt-area::after,
.form-slt::after {
  position: absolute;
  top: calc(50% - 5px);
  right: 15px;
  width: 12px;
  height: 12px;
  content: '';
  background: url('../images/btn-ico-arrow.svg') 50% 50% no-repeat;
  background-size: auto 12px;
  transform: rotateZ(-90deg);
  transform-origin: center;
  pointer-events: none;
}
table .slt-area::after {top: 3px;}
.slt-area .mobi-select {
  width: 100%;
  box-sizing: border-box;
}
.form-set input,
.inp,
.slt,
.mobi-select {
  font-family: "Pretendard-Regular";
  height: 40px;
  padding: 16px 10px;
  font-size: 16px;
  color: #222;
  border: 1px solid #ddd;
  border-radius: 4px;
  background-color: #fff;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.form-set .period-area input {border: 0;}
.slt-set {
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
}
table .inp,
table .slt,
table .mobi-select {
  margin-top: inherit;
  box-sizing: border-box;
}
.inp.next-check {
  width: calc(100% - 0.5rem);
  margin-bottom: 0.5rem;
}
.in-password {position: relative}
.in-password .inp {padding-right: 2.375rem;}
.in-password .btn-toggle {
  position: absolute;
  top: 0;
  right: 0;
  width: 2.375rem;
  height: 100%;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background-color: transparent;
  cursor: pointer;
}

.in-password .btn-toggle::before {
  display: block;
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-eye1-close.svg') 50% calc(50% + 1px) no-repeat;
  background-size: 1.3rem;
}

.in-password.open .btn-toggle::before {
  background: url('../images/ico-eye1-open.svg') 50% 50% no-repeat;
  background-size: 1.4rem;
}
.slt,
.mobi-select {padding: 0 40px 0 10px;}
.required-line {border: 1px dashed rgba(255,98,37,.5);}
.board-area .inp,
.board-area .slt {
  box-sizing: border-box;
}
.board-area .inp,
.board-area .slt-area {
  width: 100%;
}
.board-area .slt-area.slt-year {width: 90px;}
textarea {
  width: 100%;
  height: 4.2rem;
  padding: 0 0.5rem;
  line-height: 2.5;
  font-family: "Pretendard-Regular";
  font-size: 0.95rem;
  border: 1px dashed #ddd;
  border-radius: 0;
  background-color: #fff;
  background-image: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-sizing: border-box;

  /* form-set 내부 스타일과 맞춤 */
  min-height: 114px;
  padding: 10px 16px;
  line-height: 1.5;
}
textarea.auto-h {
  overflow-y: hidden;
  resize: none;
}
.form-set .period-area {
  display: flex;
  align-items: center;
  margin-top: 0;
}
.period-area {
  overflow: hidden;
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
  height: 40px;
  padding: 0 40px 0 10px;
  border: 1px solid #ddd;
  border-radius: 4px;
  background-color: #fff;
  box-sizing: border-box;
}
table .period-area {
  width: inherit;
  height: inherit;
  margin-top: 0;
  padding: 0;
  line-height: inherit;
  border: 0;
  background-color: inherit;
  box-sizing: border-box;
}
table .period-area .inp {
  margin-right: 0;
  border: 1px dashed #ddd;
}
table .period-area button {right: 0;}
.period-area span {color: #999;}
.form-set .period-area span {margin: 0 8px;}
.in-ico-btn {position: relative;}
.period-area .inp,
.in-ico-btn .inp {
  width: calc(100% - 1.9rem);
  margin-right: 1.2rem;
  font-size: 0.9rem;
}
.period-area .inp {
  border: 0;
  background-color: transparent;
}
.period-area button,
.in-ico-btn button {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 26px;
  line-height: 0;
}
.in-ico-btn button {top: calc(50% - 13px);}
.period-area button i.ico-uni-calendar {
  display: flex;
  width: 38px;
  height: 38px;
}
.period-area button i.ico-uni-calendar::before {
  position: absolute;
  top: 0;
  right: 0px;
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-calendar.svg') 50% 50% no-repeat;
  background-size: auto 20px;
}
.cal-area.in-dd .period-area button i.ico-uni-calendar::before {display: none;}
.mobi-single-date {
  width: 80px;
  padding: 0;
  letter-spacing: -0.06em;
  font-family: "Pretendard-Regular";
  font-size: 16px;
  border: 0;
  background-color: #fff !important;
}
.form-set .mobi-single-date {
  width: 80px;
  font-size: 16px;
}
.cal-area .inp {
  width: 100%;
  padding: 0 40px 0 10px;
  box-sizing: border-box;
}
.cal-area::after {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
  content: '';
  background: url('../images/ico-calendar.svg') 50% 50% no-repeat;
  background-size: auto 20px;
  pointer-events: none;
}
.cal-area.in-dd::after {display: none;}
.cal-area.in-dd dd::after {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
  content: '';
  background: url('../images/ico-calendar.svg') 50% 50% no-repeat;
  background-size: auto 20px;
  pointer-events: none;
}
.cal-area.in-dd dd.cal-none::after {display: none;}

/* checkbox */
.checkbox-area {
  display: inline-block;
  align-items: center;
}
.checkbox-area::after {
  display: block;
  content: '';
  clear: both;
}
.checkbox-area label ~ label {margin-left: 16px;}

input[type=checkbox] {
  opacity: 0;
  position: absolute;
  width: 0;
  height: 0;
  padding: 0;
  border: 0;
}
.checkbox-area:has(#notiYn) {
  margin-bottom: 4px;
  margin-top : -11px;
}
input[type=checkbox] + .check-label {
  position: relative;
  min-height: 20px;
  padding-left: 28px;
  line-height: 20px;
  white-space: nowrap;
  cursor: pointer;
}
input[type=checkbox]:checked + .check-label::before,
input[type=checkbox]:checked + .check-label::after,
input[type=checkbox] + .check-label::before,
input[type=checkbox] + .check-label::after {
  content: '';
  left: 0;
  position: absolute;
}

input[type=checkbox] + .check-label::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  margin: 0;
  border: 0;
  border-radius: 0;
  background-color: #fff;
  opacity: 1;
  cursor: pointer;
  transform: none;
  -webkit-appearance: none;
  appearance: none;
  outline-style: none;
}
input[type=checkbox]:checked + .check-label::before {
  background: url('../images/ico-checkbox-bl.svg') 50% 50% no-repeat;
  background-size: auto 8px;
  background-color: #fff;
}
input[type=checkbox] + .check-label::after {
  top: 0;
  width: 18px;
  height: 18px;
  border: 1px solid #ddd;
  border-radius: 4px;
  z-index: 0;
}
input[type=checkbox]:checked + .check-label::after {
  border-color: #008fd5;
}
input[type=checkbox] + .check-label.disabled::before,
input[type=checkbox] + .check-label.readonly::before,
input[type=checkbox] + .check-label.disabled::after,
input[type=checkbox] + .check-label.readonly::after {
  background-color: #E9EAEF;
}
input[type=checkbox]:checked + .check-label.disabled::before,
input[type=checkbox]:checked + .check-label.readonly::before {
  background-color: transparent;
}
input[type=checkbox]:checked + .check-label.disabled::after,
input[type=checkbox]:checked + .check-label.readonly::after {
  border: 1px solid #ddd;
  background-color: #ddd;
}
/*.pes input[type=checkbox]:checked + .check-label::after {
  border: 1px solid #008fd5;
  background-color: #008fd5;
}
.approval input[type=checkbox]:checked + .check-label::after {
  border: 1px solid #ff8b00;
  background-color: #ff8b00;
}
.econ input[type=checkbox]:checked + .check-label::after {
  border: 1px solid #e54160;
  background-color: #e54160;
}
.pds input[type=checkbox]:checked + .check-label::after {
  border: 1px solid #51b300;
  background-color: #51b300;
}
.tax input[type=checkbox]:checked + .check-label::after,
.salescon input[type=checkbox]:checked + .check-label::after {
  border: 1px solid #00c0b5;
  background-color: #00c0b5;
}
.avs input[type=checkbox]:checked + .check-label::after {
  border: 1px solid #1ac6ed;
  background-color: #1ac6ed;
}
.community input[type=checkbox]:checked + .check-label::after {
  border: 1px solid #6dc34a;
  background-color: #6dc34a;
}*/

.check-square-02 input[type=checkbox] + .check-label::after {
  border-radius: 4px;
  background-color: #fafafa;
  border: 1px solid #999;
}
.update-noti-modal input[type=checkbox]:checked + .check-label::after {
  border: 1px solid #999;
  background-color: #fafafa;
}
.update-noti-modal input[type=checkbox]:checked + .check-label::before {
  top: 0;
  left: 0;
  width: 3px;
  height: 10px;
  border-top: 3px solid transparent;
  border-left: 3px solid transparent;
  border-right: 3px solid #999;
  border-bottom: 3px solid #999;
  background-color: transparent;
  z-index: 5;
  -webkit-transform: rotateZ(39deg);
  transform: rotateZ(39deg);
  -webkit-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
}
/* radio */
.radio-area .radio-label {margin-right: 0.5rem;}
.radio-area .radio-label:last-child {margin-right: 0;}
input[type=radio] {
  opacity: 0;
  width: 100%;
  position: absolute;
}
input[type=radio] + .radio-label {
  position: relative;
  padding-left: 1.4rem;
  line-height: 1.75rem;
  white-space: nowrap;
  cursor: pointer;
}
input[type=radio]:checked + .radio-label::before,
input[type=radio]:checked + .radio-label::after {
  content: '';
  top: 0;
  left: 0;
  position: absolute;
}
input[type=radio]:checked + .radio-label::before {background-color: transparent;}
input[type=radio]:checked + .radio-label::after {
  top: 0;
  left: 0;
  width: 1rem;
  height: 1rem;
  margin-top: 0.1rem;
  border-radius: 50%;
  border: 1px solid #ff253a;
  background-color: #ff253a;
  z-index: 0;
}
input[type=radio] + .radio-label::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 1rem;
  height: 1rem;
  margin-top: 0.1rem;
  z-index: 0;
  border: 1px solid #ddd;
  background-color: #fff;
  border-radius: 50%;
}
input[type=radio] + .radio-label.disabled::before,
input[type=radio] + .radio-label.readonly::before,
input[type=radio] + .radio-label.disabled::after,
input[type=radio] + .radio-label.readonly::after {
  background-color: #eee;
}
input[type=radio]:checked + .radio-label.disabled::before,
input[type=radio]:checked + .radio-label.readonly::before {
  border-color: #eee;
  background-color: #eee;
}
input[type=radio]:checked + .radio-label.disabled::after,
input[type=radio]:checked + .radio-label.readonly::after {
  border: 1px solid #bbb;
  background-color: #bbb;
}
.pes input[type=radio]:checked + .radio-label::after {
  border: 1px solid #008fd5;
  background-color: #008fd5;
}
.approval input[type=radio]:checked + .radio-label::after {
  border: 1px solid #ff8b00;
  background-color: #ff8b00;
}
.econ input[type=radio]:checked + .radio-label::after {
  border: 1px solid #e54160;
  background-color: #e54160;
}
.pds input[type=radio]:checked + .radio-label::after {
  border: 1px solid #51b300;
  background-color: #51b300;
}
.tax input[type=radio]:checked + .radio-label::after,
.salescon input[type=radio]:checked + .radio-label::after {
  border: 1px solid #00c0b5;
  background-color: #00c0b5;
}
.avs input[type=radio]:checked + .radio-label::after {
  border: 1px solid #1ac6ed;
  background-color: #1ac6ed;
}
.community input[type=radio]:checked + .radio-label::after {
  border: 1px solid #6dc34a;
  background-color: #6dc34a;
}


/* --- table --- */
.tbl-area {margin-top: 20px;}
.tbl-area:first-child {margin-top: 0;}
.tbl-area table:not(.in-editor table) {
  border-top: 1px solid #ddd;
}
.tbl-area.bo-t-0 table {border-top: 0;}
.tbl-area.align-c table th,
.tbl-area.align-c table td {
  vertical-align: inherit;
  text-align: center;
}
.tbl-area table th,
.tbl-area table td {
  padding: 8px 10px;
  vertical-align: middle;
  text-indent: 0;
  font-weight: normal;
  border-right: 1px solid #eee;
  border-bottom: 1px solid #eee;
}
.tbl-area table th:last-child,
.tbl-area table td:last-child {
  border-right: 0;
}
.tbl-area table th.bo-r,
.tbl-area table td.bo-r {
  border-right: 1px solid #eee;
}
.tbl-center .tbl-area table th,
.tbl-center .tbl-area table td {
  text-align: center;
}
.tbl-area table th {
  text-align: center;
  background-color: rgba(233,234,239,.2);
}
.tbl-th-left .tbl-area table th {
  padding-left: 20px;
  text-align: left;
}
.tbl-area table th.empty,
.tbl-area table td.empty {
  background-image: linear-gradient(to top left,white 50%,#eee,white 51%);
}
.tbl-area table .total-col,
.tbl-area table tr.total-line th {font-family: 'Pretendard-Medium';}
.tbl-area table tr.total-line td {
  font-family: 'Pretendard-Medium';
  color: #ff253a;
}

/* - color - */
.avs .tbl-c1.tbl-area table th {background-color: rgba(26,198,237,.05);}

/* 폰트 크게 */
.font-l .tbl-area table th,
.font-l .tbl-area table td {
  padding: 0.7rem;
  font-size: 0.985rem;
}
.font-s .tbl-area table th,
.font-s .tbl-area table td {
  padding: 0.4rem;
  font-size: 0.85rem;
}


/* --- tab --- */
/* tab 1 */
.tab-area.tab-01 {
  height: 3.1rem;
  line-height: 3.1rem;
  background-color: #fff;
}
.tab-area.tab-01 ul {overflow: hidden;}
.tab-area.tab-01 ul li {
  float: left;
  width: 25%;
}
.tab-area.tab-01.col-2 ul li {width: 50%;}
.tab-area.tab-01.col-3 ul li {width: 33.33333333%;}
.tab-area.tab-01 ul li + li {margin: inherit;}
.tab-area.tab-01 ul li a {
  display: inline-block;
  width: 100%;
  padding: inherit;
  text-align: center;
  font-family: 'Pretendard-SemiBold';
}
.tab-area.tab-01 ul li a::after {display: none;}
.tab-area.tab-01 ul li.on a {
  position: relative;
  color: #ff253a;
}
.tab-area.tab-01 ul li.on a::after {
  position: absolute;
  bottom: 0;
  left: 0;
  display: inline-block;
  content: '';
  width: 100%;
  border-bottom: 2px solid #ff253a;
}
.pes .tab-area.tab-01 ul li.on a {color: #008fd5;}
.pes .tab-area.tab-01 ul li.on a::after {border-bottom: 2px solid #008fd5;}
.approval .tab-area.tab-01 ul li.on a {
  position: relative;
  color: rgba(14,92,233, 1);
}
.approval .tab-area.tab-01 ul li.on a::after {position: absolute;
  bottom: 0;
  left: 0;
  display: inline-block;
  content: '';
  width: 100%;
  border-bottom: 2px solid rgba(14,92,233, 1);
}
.econ .tab-area.tab-01 ul li.on a {color: #e54160;}
.econ .tab-area.tab-01 ul li.on a::after {border-bottom: 2px solid #e54160;}
.pds .tab-area.tab-01 ul li.on a {color: #51b300;}
.pds .tab-area.tab-01 ul li.on a::after {border-bottom: 2px solid #51b300;}
.tax .tab-area.tab-01 ul li.on a,
.salescon .tab-area.tab-01 ul li.on a {color: #00c0b5;}
.tax .tab-area.tab-01 ul li.on a::after,
.salescon .tab-area.tab-01 ul li.on a::after {border-bottom: 2px solid #00c0b5;}
.avs .tab-area.tab-01 ul li.on a {color: #1ac6ed;}
.avs .tab-area.tab-01 ul li.on a::after {border-bottom: 2px solid #1ac6ed;}
.community .tab-area.tab-01 ul li.on a {color: #6dc34a;}
.community .tab-area.tab-01 ul li.on a::after {border-bottom: 2px solid #6dc34a;}

/* 다중탭 추가 */
.tab-area.col-multiple {
  height: inherit;
  padding: 1.2rem;
  line-height: inherit;
}
.tab-area.col-multiple ul {
  display: flex;
  align-items: center;
  justify-content: center;
}
.tab-area.col-multiple ul + ul {margin-top: 0.8rem;}
.tab-area.col-multiple ul li {
  max-width: 8rem;
  margin-right: 0.5rem;
}
.tab-area.col-multiple ul li + li {
  margin: 0;
  margin-right: 0.5rem;
}
.tab-area.col-multiple ul li + li:nth-child(4n) {margin-right: 0;}
.tab-area.col-multiple ul li a {
  height: 2rem;
  line-height: calc(2rem - 2px);
  border: 1px solid #eee;
  border-radius: 1.2rem;
  box-sizing: border-box;
}
.tab-area.col-multiple ul li.on a::after {display: none;}
.salescon .tab-area.col-multiple ul li.on a {
  color: #fff;
  border-color: transparent;
  background-color: #00c0b5;
}
.salescon .tab-area.col-multiple + .my-summary {margin-top: 0.6rem;}


/* --- popup --- */
.pop-fixed {
  position: fixed;
  z-index: 20000;
}
.noti-pop .pop-in {
  bottom: 0;
  top: auto;
  left: 0;
  width: 100%;
  z-index: 101;
  padding: 0 !important;
  z-index: 20001;
}
.overlay-bg {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0,0,0,0.5);
  transition: .5s;
  z-index: 19000;
}
.pop-in {
  position: fixed;
  top: 4rem;
  padding: 0 1.2rem;
  width: 100%;
  box-sizing: border-box;
  z-index: 20000;
}
.pop-cont-area {
  overflow: auto;
  width: 100%;
  max-height: calc(100vh - 8rem);
  padding: 1.4rem 1.2rem 1.2rem;
  background-color: #fff;
  border-radius: 0.8rem 0.8rem 0 0;
  padding: 36px;
  padding-bottom: 16px;
  box-sizing: border-box;
  animation: content-slide-up 0.3s ease-out both;
}
@keyframes content-slide-up {
  from {transform: translateY(50%); opacity: 0;}
  to {transform: translateY(0); opacity: 1;}
}
.pop-cont-area .pop-con-tt {
  padding-bottom: 0.7rem;
  text-align: left;
  font-family: 'Pretendard-SemiBold';
  font-size: 18px;
}
.pop-cont-area .board-area {
  margin-top: 0.7rem;
  padding-bottom: 1rem;
}
.pop-cont-area .board-area dl {padding: 0.5rem 0;}
.pop-cont-area .board-area > dl + dl,
.pop-cont-area .board-area > dl + div,
.pop-cont-area .board-area > div + dl {
  /*margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid #ddd;*/
}
.pop-cont-area .board-area dl dt {
  width: 5.1rem;
  margin-left: 0.7rem;
  box-sizing: border-box;
}
.pop-cont-area .board-area dl dd {
  width: calc(100% - 5.8rem);
  box-sizing: border-box;
}
.pop-cont-area .board-area .pop-cont-box {
  width: 100%;
  box-sizing: border-box;
}
.pop-cont-area .board-area .add-file-area {
  display: block;
}
.pop-cont-area .board-area .add-file-area dt {
  width: 100%;
  height: 2.6rem;
  margin: 0;
  padding: 0rem;
  line-height: 2.6rem;
  font-family: 'Pretendard-SemiBold';
  font-size: 1.1rem;
  color: #222;
  background-color: #fff;
}
.pop-cont-area .board-area .add-file-area dt .btn-area {
  right: -0.4rem;
}
.pop-cont-area .board-area .add-file-area dt .btn-area a i {color: #222;}
.pop-cont-area .board-area .add-file-area dd {
  width: 100%;
}
.pop-cont-area .board-area .add-file-area dd .action-area {
  height: 2.6rem;
  line-height: 2.6rem;
}
.pop-cont-area .board-area .add-file-area dd .file-area {
  width: 100%;
  margin: 0.35rem auto;
  box-sizing: border-box;
}
.pop-cont-area .board-area .add-file-area dd .file-area:first-child {margin-top: 0;}
.pop-cont-area .board-area .add-file-area dd .file-area .btn-area {right: 0.6rem;}
.pop-cont-area .board-area .checkbox-area {width: 100%;}
.pop-cont-area .board-area .checkbox-area,
.pop-cont-area .board-area .checkbox-area * {
  margin-left: 0;
}
.pop-cont-area .board-area .check-label {
  display: block;
  float: none;
  margin-top: 0.7rem;
}
.pop-cont-area .board-area input:first-child + .check-label {margin-top: 0;}
.pop-cont-area .btn-area {
  display: flex;
  gap: 8px;
  padding-top: 1rem;
}
.pop-cont-area .btn-area .noti-pop-btn {
  flex: 2;
  height: 3.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1.2rem;
  font-size: 0.95rem;
  border: none;
  color: #fff;
  background-color: rgba(14, 92, 233, 1);
  cursor: pointer;
}
.pop-cont-area .btn-area .noti-pop-btn i {
  margin-right: 5px;
}
.pop-cont-area .btn-area button {
  padding: 0.5rem 1.2rem;
  font-size: 0.95rem;
}
.pop-cont-area .btn-area .noti-pop-btn.btn-555-line {
  flex: 0.6;
  background-color: #fff;
  border: 1px solid #000;
  color: #000;
  min-width: 60px;
  margin-left: -0.5rem;
}
.pop-cont-area .btn-area.btn-mix {
  flex-direction: row-reverse;
  gap: 8px;
  padding: 0;
}


/* 기본 얼럿 팝업 추가 */
.alert-pop .pop-cont-area {
  width: calc(100vw - 2.4rem);
  max-width: 22rem;
  margin: 0 auto;
}
.alert-pop .pop-cont-area .pop-con-tt {
  padding-bottom: 1rem;
  border: 0;
}
.alert-pop .pop-cont-area .btn-area {margin-top: 1.4rem;}

/* 정렬 팝업 추가 */
.pop-in .sort-list-in dl {position: relative;}
.pop-in .sort-list-in dl + dl {
  margin-top: 0.7rem;
  padding-top: 0.7rem;
  border-top: 1px solid #f5f5f5;
}
.pop-in .sort-list-in dt {display: inline-block;}
.pop-in .sort-list-in dd {
  position: absolute;
  top: 0.7rem;
  right: 0;
}
.pop-in .sort-list-in dl:first-child dd {top: 0;}
.pop-in .sort-list-in dd i {
  font-size: 1.4rem;
  border-radius: 50%;
  background-color: #eee;
}
.pop-in .sort-list-in dd i.on {
  color: #fff;
  background-color: #222;
}
.pop-in .sort-list-in dd i + i {margin-left: 0.5rem;}

/* 유니 팝업 추가 */
.uni-pop .pop-cont-area {
  overflow: inherit;
  position: relative;
  width: 90%;
  padding-top: 2.8rem;
}
.uni-pop .pop-cont-area .uni-face {
  position: absolute;
  top: -2.4rem;
  left: calc(50% - 2.6rem);
  width: 4.8rem;
}
.uni-pop .pop-cont-area .pop-con-tt {border: 0;}
.uni-pop .pop-cont-area .btn-area {margin-top: 1.4rem;}


/* --- 설정 --- */
.wrap .content-area.page-set {
  margin: 60px 0 0;
  padding: 12px;
  padding-bottom: 78px;
  box-sizing: border-box;
}
.page-set .board-area ul li + li {margin-top: 1px;}
.page-set .board-area ul li:first-child {
  overflow: hidden;
  border-radius: 20px 20px 0 0;
}
.page-set .board-area ul li:nth-last-child(2) {
  overflow: hidden;
  border-radius: 0 0 20px 20px;
}
.page-set .board-area ul li:last-child {margin-top: 24px;}
.page-set.set-alarm .board-area ul li:first-child {border-radius: 20px;}
.page-set .board-area ul li.in-padding {padding: 20px;}
.page-set .board-area ul li .btn-logout {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  padding: 0;
  font-family: "Pretendard-Bold";
  font-size: 18px;
  color: #333;
  border: 1px solid #333;
  border-radius: 12px;
  background-color: #fff;
  box-sizing: border-box;
}
.page-set .board-area ul li .btn-logout::after {display: none;}
.page-set .board-area ul li a.btn-def {
  display: flex;
  padding: 0;
  color: #fff;
}
.page-set .board-area ul li a::after {
  position: absolute;
  top: calc(50% - 10px);
  right: 20px;
  width: 20px;
  height: 20px;
  content: '';
  background: url('../images/btn-ico-arrow.svg') 50% 50% no-repeat;
  background-size: auto 12px;
  transform: rotateZ(180deg);
  transform-origin: center;
  opacity: .5;
}
.page-set .board-area .board-explain {margin-top: 1rem;}
.page-set .board-area dl {border-radius: 0;}
.page-set .board-area ul.user-info ~ dl:last-of-type {
  overflow: hidden;
  border-radius: 0 0 20px 20px;
}
.page-set .board-area .board-noti + dl {
  overflow: hidden;
  border-radius: 20px;
}
.page-set .board-area dl dt {width: 80px;}
.page-set .board-area dl dd {width: calc(100% - 92px);}
.page-set .board-area dd,
.page-set .board-area .inp,
.page-set .board-area .slt {text-align: left;}
.page-set .board-area .user-info {margin-bottom: 1px;}
.page-set .board-area .user-info li {background-color: #fffde8;}
.page-set .board-area .user-info li.in-padding {margin: 0;}
.page-set .board-area .user-info li dl {
  padding: 3px 0;
  background-color: transparent;
}
.page-set .board-area .user-info li dl dt,
.page-set .board-area .user-info + dl dt,
.page-set .board-area .user-info ~ dl dt {
  color: #777;
}
.page-set .board-area .board-noti {margin: 40px 30px 16px;}
.page-set .board-area .confirm-pw dl dt,
.page-set .board-area .change-pw dl dt {display: none;}
.page-set .board-area .confirm-pw dl dd,
.page-set .board-area .change-pw dl dd {
  width: 100%;
  top: 0;
  left: 0;
  right: inherit;
}
.page-set .email-area .inp {
  width: 40%;
  max-width: 15rem;
}
.page-set .email-area span + .inp {
  width: 49%;
  max-width: 20rem;
}
.page-set .email-area button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 240px;
  height: 30px;
  margin-top: 11px;
  font-size: 14px;
}
.page-set .board-area dl.column {
  align-items: flex-start;
  flex-direction: column;
  gap: 12px;
}
.page-set .board-area dl.column dd {width: 100%;}
.page-set .board-area dl.column dd:not(.email-area) {
  display: flex;
  align-items: center;
  gap: 6px;
}
.page-set .board-area dl.column dd .slt-area:first-child {width: calc(100% + 110px);}
.page-set dl.column .email-area {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}
.page-set dl.column .email-area .inp,
.page-set dl.column .email-area span + .inp {
  width: calc(50% - 13px);
  max-width: inherit;
}
.page-set dl.column .email-area button {max-width: inherit;}

/* 비번수정 */
.page-set .board-area .change-pw dl:first-child {border-radius: 20px 20px 0 0;}
.page-set .board-area .change-pw dl:last-child {border-radius: 0 0 20px 20px;}
.page-set .board-area .change-pw dl:only-child {border-radius: 20px;}

/* 비번확인 */
.page-set .board-area .confirm-pw.intro dl {border-radius: 20px;}
.page-set .board-area .confirm-pw.intro dd p {margin-bottom: 20px;}


/* 기기인증 */
.page-set .board-area .device-certify + .device-certify {margin-top: 3.5rem;}
.page-set .board-area .device-certify .board-explain {
  padding: 0 1.9rem;
  line-height: 1.4rem;
}
.page-set .board-area .device-certify .certify-timer {
  margin-top: 1.9rem;
  text-align: center;
  font-size: 1.05rem;
  color: #2f79a6;
}
.page-set .board-area .device-certify .certify-timer span {font-family: 'Pretendard-SemiBold';}
.page-set .board-area .device-certify .msg-error {margin: 1rem 1.9rem;}

/* 이용약관 / 개인정보처리방침 내용 */
.agree-cont {
  padding: 1.2rem;
  line-height: 1.4rem;
  background-color: #fff;
}
.agree-cont .previous-version {
  margin-bottom: 1rem;
  font-family: 'Pretendard-Medium';
  font-size: 1.05rem;
  color: #2f79a6;
}
.agree-cont a.previous-version {
  font-family: inherit;
  font-size: inherit;
}
.agree-cont .previous-version + h4 {margin-top: 0;}
.agree-cont h4 {
  display: inline-block;
  margin: 2.6rem 0 0.2rem;
  padding-bottom: 0.2rem;
  font-family: 'Pretendard-Medium';
  font-weight: normal;
  font-size: 0.95rem;
  border-bottom: 1px solid #999;
}
.agree-cont h4:first-child {margin-top: 0;}
.agree-cont > p + p {margin-top: 0.7rem;}
.agree-cont > p.end-line {margin-top: 2.6rem;}
.agree-cont dl dt,
.agree-cont dl.indent dd {
  padding-left: 1.2rem;
  text-indent: -1.2rem;
}
.agree-cont dl .no-indent {
  padding-left: 0 !important;
  text-indent: 0 !important;
}
.agree-cont .in-dash,
.agree-cont dl .in-dash {
  padding-left: 1.2rem;
  text-indent: -0.7rem;
}
.agree-cont dt {
  margin: 1rem 0 0.2rem;
  font-family: 'Pretendard-Medium';
  color: #555;
}
.agree-cont.privacy h4 + dl dt {margin-top: 0;}
.agree-cont dd {color: #555;}
.agree-cont dl.indent .no-indent {
  padding-left: inherit;
  text-indent: inherit;
}
.agree-cont dl .none {display: none;}
.agree-cont dl dd + dd {margin-top: 0.5rem;}
.agree-cont dl.indent dd p {
  margin-top: 0.2rem;
  padding-left: 1.2rem;
}
.agree-cont dl.indent dd p span {
  display: block;
  padding-left: 1.4rem;
}


/* --- 오류페이지 --- */
.wrap.err {
  display: flex;
  justify-content: center;
  align-items: center;
}
.page-err {
  padding: 0 1.2rem;
  text-align: center;
}
.page-err .page-err-in .err-img {animation: shake .5s ease-in-out 1;}
.page-err .page-err-in .err-img img {
  width: 10rem;
  margin: 0 0 1.2rem 1.2rem;
}
.page-err .page-err-in .err-msg .err-msg-tt {
  font-family: 'Pretendard-Medium';
  font-size: 1.8rem;
}
.page-err .page-err-in .err-msg p + p {margin-top: 0.125rem;}
.page-err .page-err-in .err-msg .err-msg-tt + p {margin-top: 0.5rem;}
.page-err .btn-area {margin-top: 1.9rem;}
.page-err .btn-area button {
  float: none;
  height: 2.6rem;
  padding: 0 1rem;
  line-height: 2.6rem;
  font-size: 1rem;
}
.page-err .btn-area button + button {margin-left: 0.2rem;}


/* --- 경비처리 --- */
/* - 메인 - */
.pes .end-date {
  padding: 1.2rem 1.9rem;
  background-color: #fff;
}
.pes .end-date p,
.pes .anchor-date p {
  font-family: 'Pretendard-Medium';
  font-size: 0.985rem;
}
.pes .end-date .add-explain,
.pes .anchor-date .add-explain {
  margin-top: 0.5rem;
  font-size: 0.75rem;
  color: #777;
}
.pes .end-date p span {
  margin-left: 0.5rem;
  font-family: 'Pretendard-Medium';
  color: #ff253a;
}
.pes .anchor-date {
  padding: 1.2rem 1.9rem;
  border-bottom: 1px solid #eee;
}
.pes .anchor-date p span {
  margin-left: 0.5rem;
  font-family: 'Pretendard-Medium';
  color: #008fd5;
}
.pes .my-summary {
  margin-top: 0.6rem;
  background-color: #fff;
}
.pes .my-summary ul {padding: 0.6rem 1.4rem 0.6rem 1.9rem;}
.pes .my-summary ul + ul {border-top: 1px dashed #eee;}
.pes .my-summary ul li:first-child {border-top: 0;}
.pes .my-summary ul li a {
  position: relative;
  display: block;
  height: 2.8rem;
  line-height: 2.8rem;
  font-size: 0.985rem;
}
.pes .my-summary ul li a > * {vertical-align: middle;}
.pes .my-summary ul li a .badge-step {
  display: inline-block;
  height: 1.35rem;
  margin-right: 0.6rem;
  padding: 0 0.5rem;
  line-height: 1.35rem;
  font-size: 0.75rem;
  color: #aaa;
  border: 1px solid #aaa;
  border-radius: 1.9rem;
  box-sizing: border-box;
}
.pes .my-summary ul li a .badge-step.step-1 {
  color: #008fd5;
  border: 1px solid #008fd5;
}
.pes .my-summary ul li a .badge-step.step-2 {
  color: #22ab52;
  border: 1px solid #22ab52;
}
.pes .my-summary ul li a .badge-step.step-3 {
  color: #ff8b00;
  border: 1px solid #ff8b00;
}
.pes .my-summary ul li a .total-num,
.pes .my-summary ul li a .btn-write {
  position: absolute;
  top: 0;
  right: 0;
  font-family: 'Pretendard-Medium';
}
.pes .my-summary ul li a .total-num::after,
.pes .my-summary ul li a .btn-write::after {
  display: inline-block;
  margin-left: 0.2rem;
  font-family: 'unifont';
  content: '\e803';
  font-weight: bold;
  font-size: 1.2rem;
}


/* --- 전자결재 --- */
/* - 메인 - */
.my-chart {
  overflow: hidden;
  padding: 24px 0;
  background-color: #fff;
  border-radius: 20px;
}
.my-chart .chart-area {
  float: left;
  position: relative;
  width: 7.85rem;
  height: 7.85rem;
  margin-left: calc(50% - 9.35rem);
}
.my-chart .chart-area .chart-total {
  position: absolute;
  width: 100%;
  margin-top: 40px;
  text-align: center;
  z-index: 5;
}
.my-chart .chart-area .chart-total .total-num {
  font-family: 'Pretendard-Medium';
  line-height: 2.6rem;
  font-size: 1.9rem;
}
.my-chart .chart-area .chart-area-in {
  display: inline-block;
  width: 7.85rem;
  height: 7.85rem;
}
.my-chart .chart-area .chart-area-in > div {
  display: inline-block;
  width: 100%;
  height: 100%;
}
.my-chart .chart-area .chart-area-in .chart-sample {
  overflow: hidden;
  position: relative;
  display: inline-block;
  width: 100%;
  height: 100%;
  text-indent: -9999px;
  background-color: #6cc84b;
  border-radius: 100%;
}
.my-chart .chart-area .chart-area-in .chart-sample::after {
  overflow: hidden;
  display: inline-block;
  content: '';
  position: absolute;
  top: 0.65rem;
  left: 0.65rem;
  display: inline-block;
  width: 6.55rem;
  height: 6.55rem;
  background-color: #fff;
  border-radius: 50%;
}
.my-chart .chart-op-area {
  float: left;
  width: 7rem;
  margin: -0.2rem 0 0 3.5rem;
}
.my-chart .chart-op-area li {
  position: relative;
  line-height: 34px;
}
.my-chart .chart-op-area li::before {
  position: absolute;
  top: calc(50% - 0.2rem);
  left: -0.8rem;
  display: inline-block;
  content: '';
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background-color: #999;
}
.my-chart .chart-op-area li span:last-child {
  position: static;
  top: 0;
  right: 0;
  font-family: 'Pretendard-Medium';
}
.my-chart .chart-op-area li span {
  font-family: 'Pretendard-SemiBold';
}
.my-chart .chart-op-area li span.bid-wait,
.my-chart .chart-op-area li span.bid-process,
.my-chart .chart-op-area li span.bid-return,
.my-chart .chart-op-area li span.bid-complete {
  position: absolute;
  top: 0;
  right: 1.2rem;
  font-family: 'Pretendard-SemiBold';
  font-weight: bold;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.my-chart .chart-op-area li span.bid-wait + span,
.my-chart .chart-op-area li span.bid-process + span,
.my-chart .chart-op-area li span.bid-return + span,
.my-chart .chart-op-area li span.bid-complete + span {
  position: absolute;
  top: 0;
  right: 0;
  font-family: 'Pretendard-Medium';
  text-decoration: none;
}
/* .my-chart + .my-summary {margin-top: 0.6rem;} */
.link-btn-area.main {margin: 1rem;}
.link-btn-area.main .btn-certificate {
  display: block;
  position: relative;
  padding: 1rem 1.2rem;
  /* text-align: center; */
  /* font-size: 1rem; */
  font-family: 'Pretendard-Medium';
  color: #ff7883;
  border: 1px solid rgb(255 120 131 / 30%);
  border-radius: 0.6rem;
  background-color: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .05);
}
.link-btn-area.main .btn-certificate::before {
  display: block;
  position: absolute;
  top: calc(50% - 0.85rem);
  right: 0.9rem;
  width: 1.7rem;
  height: 1.9rem;
  content: '';
  background: url('../images/ico-certificate-mark2.png') 0 0 no-repeat;
  background-size: 1.7rem 1.9rem;
}
.approval .my-summary {margin-top: 12px;}
.approval .my-summary .tab-area.tab-01 {
  border-radius: 20px 20px 0 0;
  height: 52px;
  line-height: 52px;
}

.my-summary ul.tab-result li {
  position: relative;
  margin-top: 2px;
}
.my-summary ul.tab-result li a,
.my-summary ul.tab-result li .no-cont {
  display: block;
  padding: 20px;
  line-height: 28px;
  background-color: #fff;
}
.my-summary ul.tab-result li .no-cont {
  text-align: center;
  border-radius: 0 0 20px 20px;
}
.my-summary ul.tab-result li .no-cont::before {
  display: inline-block;
  font-family: "unifont";
  content: '\e807';
  margin: -0.2rem 0.2rem 0 0;
  vertical-align: middle;
  font-size: 1.2rem;
  font-weight: 600;
  color: #999;
}
.my-summary ul.tab-result li .no-cont,
.my-summary ul.tab-result li:last-child a {
  border-radius: 0 0 20px 20px;
}
.my-summary ul.tab-result li:last-child a {
  margin-bottom: 80px;
}
.my-chart .chart-op-area li.progress-wait::before,
.my-summary ul.progress-wait li a::before {background-color: #008fd5;}
.my-chart .chart-op-area li.progress-ing::before,
.my-summary ul.progress-ing li a::before {background-color: #ff8b00;}
.my-chart .chart-op-area li.progress-rej::before,
.my-summary ul.progress-rej li a::before {background-color: #ff253a;}
.my-chart .chart-op-area li.progress-agree::before,
.my-summary ul.progress-agree li a::before {background-color: #00c0b5;}
.my-chart .chart-op-area li.progress::before,
.my-summary ul.progress li a::before {background-color: #6cc84b;}
.my-summary ul.tab-result li a p:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: break-word;
}
.my-summary ul.tab-result li a p:first-child span {margin-right: 0.2rem;}
.my-summary ul.tab-result li a p:first-child .level-1 {
  display: inline-block;
  color: #ff253a;
}
.my-summary ul.tab-result li a p:first-child .level-2 {
  display: inline-block;
  color: #008fd5;
}
.my-summary ul.tab-result li a p:first-child .level-4 {display: inline-block;}
.my-summary ul.tab-result .write-user,
.my-summary ul.tab-result .write-date {
  display: inline-block;
  color: #999;
}
.my-summary ul.tab-result .write-date {
  position: absolute;
  bottom: 1.05rem;
  right: 1.9rem;
}

/* - 목록 - */
.approval-list {
  position: relative;
  padding-bottom: 78px;
}
.approval-list ul.tab-result li {
  position: relative;
  margin-top: 2px;
}
.approval-list .tab-area.tab-01 {overflow-x: auto;}
.approval-list .tab-area.tab-01 ul {
  overflow-x: auto;
  width: 563px;
  white-space: nowrap;
}
.card-list-area {overflow: hidden;}
.card-list-area .card-box {
  position: relative;
  margin-top: 12px;
  border-radius: 20px;
  background-color: #fff;
}
.card-list-area .card-box:first-child {margin-top: 0;}
.card-box .badge-area span {
  display: inline-block;
  height: 26px;
  padding: 0 8px;
  font-size: 14px;
  line-height: 26px;
  color: #777;
  border-radius: 8px;
  box-sizing: border-box;
}
.card-box .badge-area .progress {
  margin: 0;
  color: #fff;
  border: 0;
  border-radius: 0;
  background-color: #888;
}
.card-box.progress-wait .badge-area .progress {
  background-color: 008fd5;
}
.card-box.progress-ing .badge-area .progress {
  background-color: #ff8b00;
}
.card-box.progress-rej .badge-area .progress {
  background-color: #FF253A;
}
.card-box.progress-agree .badge-area .progress {
  background-color: #6CC84B;
}
.card-box.progress-save .badge-area .progress {
  background-color: #4C9675;
}
.card-box.progress-cancel .badge-area .progress {
  background-color: #A77581;
}
.card-box.progress-retr .badge-area .progress {
  background-color: #8398B5;
}
.card-box.progress-cc .badge-area .progress {
  background-color: #9d9ed7;
}
.card-box.progress-read .badge-area .progress {
  background-color: #7db9e8;
}
.card-box .title-area {margin-top: 12px;}
.card-box .title-area .card-title {margin: 0 20px;}
.card-box .title-area .card-title p:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: break-word;
  font-size: 13px;
  color: #888;
}
.card-box .title-area .card-title p:first-child span {
  display: none;
  margin-right: 3px;
}
.card-box .title-area .card-title p:first-child .level-1 {
  display: inline-block;
  color: #FF6225;
}
.card-box .title-area .card-title p:first-child .level-2 {
  display: inline-block;
  color: #008fd5;
}
.card-box .title-area .card-title p:first-child .level-4 {display: inline-block;}
.card-box .title-area .card-title .page-link a {
  display: block;
  overflow: hidden;
  margin-top: 4px;
  font-family: 'Pretendard-SemiBold';
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: break-word;
  font-size: 17px;
}
.card-box .title-area .card-title + div {
  position: relative;
  margin-top: 20px;
  padding: 0 20px;
  font-size: 14px;
}
.title-area .card-title + div .line-1st {display: inline-block;}
.title-area .card-title + div .line-2nd {
  position: absolute;
  top: 0;
  left: 58%;
}
.title-area .card-title + div dl {
  position: relative;
  line-height: 22px;
}
.title-area .card-title + div .line-2nd dl {float: left;}
.title-area .card-title + div .line-2nd .total-cost {float: none;}
.title-area .card-title + div .line-2nd dl:last-child {margin-left: 11px;}
.title-area .card-title + div dl * {display: inline-block;}
.title-area .card-title + div dt {
  margin-right: 12px;
  color: #888;
}
.title-area .card-title + div .line-2nd .total-cost dd {
  font-family: 'Pretendard-SemiBold';
  color: #FF6225;
}
.card-box .current-user {
  overflow-x: auto;
  overflow-y: hidden;
  height: 28px;
  margin-top: 20px;
  padding: 16px 20px;
  white-space: nowrap;
  line-height: 28px;
  font-size: 14px;
  border-radius: 0 0 20px 20px;
}
.card-box .current-user {position: relative;}
.card-box .current-user::before {
  position: absolute;
  content: '';
  width: calc(100% - 40px);
  height: 1px;
  background-color: #eee;
  top: 0;
  left: 20px;
}
.card-box .current-user span::after,
.approval-line-list .current-user span::after {
  display: inline-block;
  font-family: "unifont";
  content: '\e803';
  margin: 0 3px 0 5px;
  font-weight: 600;
  color: #888;
}
.card-box .current-user span.agree::after,
.approval-line-list .current-user span.agree::after {
  display: inline-block;
  content: '|';
  margin: 0 4px 0 8px;
  vertical-align: middle;
  font-size: 11px;
  color: #888;
}
.card-box .current-user .fin:has(.receive)::after,
.approval-line-list .current-user .fin:has(.receive)::after {
  display: inline-block;
  content: '▶';
  margin: 0 4px 0 8px;
  vertical-align: middle;
  font-size: 11px;
  color: #888;
}
.card-box .current-user span:last-child::after,
.approval-line-list .current-user span:last-child::after {display: none;}
.card-box .current-user .fin {color: #888;}
.card-box .current-user .on i {font-size: 12px;}
.card-box .current-user .on {
  color: #222;
  background-color: rgba(255, 139, 0, .1);
  padding: 4px 6px;
  border-radius: 8px;
  font-family: 'Pretendard-Medium';
}
.card-box.progress-wait .current-user .on {color: rgba(14, 92, 233, 1);}
.card-box.progress-ing .current-user .on {
  background-color: rgba(255, 139, 0, .1);
}
.card-box.progress-rej .current-user .on {
  background-color: rgba(255, 37, 58, .1);
}
.card-box.progress-agree .current-user .on {
  background-color: rgba(108, 200, 75, .1);
}
.card-box.progress-save .current-user .on {
  background-color: rgba(76, 150, 117, .1);
}
.card-box.progress-cancel .current-user .on {
  background-color: rgba(167, 117, 129, .1);
}
.card-box.progress-retr .current-user .on {
  background-color: rgba(131, 152, 181, .1);
}
.card-box.progress-cc .current-user .on {
  background-color: rgba(157, 158, 215, .1)
}
.card-box.progress-read .current-user .on {
  background-color: rgba(125, 185, 232, .1)
}
/* 결재목록 (카드) 체크박스 추가 */
.approval-list.in-check .checkbox-area {
  position: absolute;
  top: 0.35rem;
  left: 0.35rem;
  transform: scale(.9);
}

/* 결재목록 (카드) 즐겨찾기 추가 */
.approval-list.in-mark .mark-area {
  position: absolute;
  top: 0.35rem;
  left: 0.35rem;
}
.card-list-area .mark-area .ico-mark {
  display: inline-block;
  width: 0.985rem;
  height: 0.985rem;
  background: url('../images/img-mark-star.svg') 0 0 no-repeat;
  background-size: 0.985rem;
  cursor: pointer;
}
.card-list-area .mark-area.on .ico-mark {
  background: url('../images/img-mark-star-on.svg') 0 0 no-repeat;
  background-size: 0.985rem;
  opacity: 1;
}

/* 결재목록 (카드) v2 추가 */
.approval-list.v2 .card-box .badge-area .progress {
  position: absolute;
  top: 20px;
  right: 20px;
  display: none;
  width: 41px;
  padding: 0;
  text-align: center;
  box-sizing: border-box;
  border-radius: 8px;
}
.approval-list.v2.on-progress .card-box .badge-area {
  font-size: 0;
  padding: 20px 20px 0;
}
.approval-list.v2.on-progress .card-box .badge-area .progress {display: inline-block;}
.approval-list.v2 .card-box .badge-area .progress i {display: none;}
.approval-list.v2 .card-box .badge-area span + span {
  overflow: hidden;
  max-width: 100%;
  color: #222;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  border: 0;
  background-color: rgba(255,139,0,.08);
}
.approval-list.in-check.v2 .card-box .badge-area span + span,
.approval-list.in-mark.v2 .card-box .badge-area span + span {
  padding-left: 2rem;
}
.approval-list.v2.on-progress .card-box .badge-area span + span,
.approval-list.in-check.v2.on-progress .card-box .badge-area span + span,
.approval-list.in-mark.v2.on-progress .card-box .badge-area span + span {
  max-width: calc(100% - 2.25rem);
}

/* 결재 양식목록 선택 */
.program-list {padding: 10px 4px 82px;}
.program-list .list-set .list-set-in + .list-set-in {margin-top: 1.2rem;}
.program-list .list-set h3 {
  margin-bottom: 0.6rem;
  vertical-align: middle;
  font-size: 1rem;
}
.program-list .list-set h3::before {
  margin-right: 0.25rem;
  font-family: 'unifont';
  font-size: 1.2rem;
  color: #ff8b00;
  content: '\e800';
}
.program-list .list-set ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
}
.program-list .list-set ul li {width: calc(50% - 4px);}
.program-list .list-set .list-box {
  position: relative;
  display: flex;
  width: 100%;
  height: 1rem;
  min-height: 3.75rem;
  padding: 0.7rem;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 0.85rem;
  border: 2px solid #e5e5e5;
  border-radius: 0.85rem;
  background-color: #fff;
  box-sizing: border-box;
  box-shadow: 0 0.5rem 1rem rgba(0,41,76,.05);
}
.program-list .list-set .list-box.new-doc {border-style: dashed;}
.program-list .list-set .list-box::before {
  display: none;
  position: absolute;
  top: 0.4rem;
  left: 0.4rem;
  width: 0.35rem;
  height: 0.35rem;
  content: '';
  border-radius: 50%;
}
.program-list .list-set .list-box.new-doc::before {
  position: absolute;
  top: calc(50% - 1rem);
  left: calc(50% - 1rem);
  font-family: "unifont";
  content: '\e89f';
  font-size: 1.9rem;
  color: #999;
}
.program-list .list-set .list-box.c-gray::before {background-color: #999;}
.program-list .list-set .list-box.c-red::before {background-color: #FFAEB0;}
.program-list .list-set .list-box.c-org::before {background-color: #FFAE55;}
.program-list .list-set .list-box.c-yel::before {background-color: #FEC810;}
.program-list .list-set .list-box.c-blu::before {background-color: #27ABE0;}
.program-list .list-set .list-box.c-ind::before {background-color: #7D97DD;}
.program-list .list-set .list-box.c-sky::before {background-color: #38D0F2;}
.program-list .list-set .list-box.c-grn::before {background-color: #66c390;}
.program-list .list-set .list-box.c-navy::before {background-color: #72A7C4;}
.program-list .list-set .list-box.c-gold::before {background-color: #D3BA75;}
.program-list .list-set .list-box.c-yel-grn::before {background-color: #b1d766;}
.program-list .list-set .list-box.c-pur::before {background-color: #AB93CE;}
.program-list .list-set .list-box.c-tur::before {background-color: #50D3C9;}
.program-list .list-set .list-box.c-pink::before {background-color: #FFA3CD;}
.program-list .list-set .list-box.program-vmform::before {
  display: block;
  position: absolute;
  top: 0.4rem;
  left: 0.4rem;
  width: 0.35rem;
  height: 0.35rem;
  content: '';
  background-color: #36c8da;
  border-radius: 50%;
}
.program-list .list-set .list-box span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* 결재상세 */
.approval-detail-view .action-area.button-area{
  overflow: hidden;
  background-color: #ECF2FE;
  border-radius: 20px;
  border: 1px solid rgba(14, 92, 233, 0.25);
}
.approval-detail-view .action-area > button,
.approval-detail-view .action-area .btn-area {
  text-align: left;
  height: 50px;
  line-height: 50px;
  font-size: 17px;
  color: #222;
  font-family: 'Pretendard-SemiBold';
}
.approval-detail-view .action-area > button {
  width: 100%;
  padding: 0 20px;
  padding-bottom : 12px;
}
.approval-detail-view .action-area.in-move-btn > button {
  width: calc(100% - 90px);
  font-family: 'Pretendard-SemiBold';
}
.wrap.approval .approval-detail-view .action-area.button-area {position: relative;}
.wrap.approval .approval-detail-view .action-area.button-area i {
  font-size: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 20px;
  height: 20px;
  top: calc(50% - 10px);
  right: 20px;
}
.wrap.approval .approval-detail-view .action-area.button-area .ico-uni-arrow-down {background: url('../images/ico-arrow.svg') 50% 50% no-repeat;}
.wrap.approval .approval-detail-view .top-panel-on.button-area .ico-uni-arrow-down {display: none;}
.wrap.approval .approval-detail-view .action-area.button-area .ico-uni-arrow-up {
  display: none;
  background: url('../images/ico-arrow.svg') 50% 50% no-repeat;
  transform: rotate(180deg);
}
.wrap.approval .approval-detail-view .top-panel-on.button-area .ico-uni-arrow-up {display: inline-block;}
.wrap.approval .approval-detail-view .action-area .btn-area {
  height: auto;
  line-height: 24px;
  background-color: rgba(255,255,255,.2);
}
.wrap.approval .approval-detail-view .action-area .btn-area a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 32px !important;
  height: 32px !important;
}
.approval-detail-view .top-panel .current-user .crntArvUs {
  display: inline;
  color: #222;
  background-color: rgba(255, 139, 0, 0.1);
  padding: 4px 6px;
  border-radius: 8px;
  font-family:'Pretendard-Medium';
}
body .approval-detail-view .top-panel-on + .top-panel {
  background-color: #fff;
  border: 1px solid rgba(14, 92, 233, 0.25);
  border-radius: 20px;
  box-sizing: border-box;
  margin: 12px 0 12px;
  padding-bottom: 12px;
}
.approval-detail-view .top-panel .template-explain dl {border-bottom: 1px solid #eee;}
.approval-detail-view .top-panel dl + dl {border-top: 1px solid #eee;}
.approval-detail-view dl.panel-list > dt,
.approval-detail-view .top-panel .template-explain dt {
  position: relative;
  padding: 20px 20px 12px;
  font-family: 'Pretendard-SemiBold';
  font-size: 17px;
  border-radius: 20px 20px 0 0;
}
.approval-detail-view .panel-list.detail-basic.line-1 > dt {
  margin-bottom: 20px;
  padding: 0 20px;
  background-color: #F7FAFE;
  border-bottom: 1px solid #eee;
  height: 50px;
  line-height: 50px;
  box-sizing: border-box;
}
.approval-detail-view dl.panel-list dt .explain-line {
  margin-left: 10px;
}
.approval-detail-view dl.panel-list dt .btn-area.inline {
  display: inline;
  position: relative;
  right: inherit;
  margin-left: 8px;
  text-align: left;
}
.approval-detail-view dl.panel-list dt .btn-area .btn-size .label {
  margin-right: 2px;
  vertical-align: middle;
  font-size: 12px;
  color: #777;
}
.approval-detail-view dl.panel-list dt .btn-area .btn-size .btn-toggle {
  width: 29px;
  height: 14px;
}
.approval-detail-view dl.panel-list dt .btn-area .btn-size .btn-toggle span {
  width: 14px;
  height: 14px;
  border-radius: 14px;
}
.approval-detail-view dl.panel-list dt .btn-area .btn-size .btn-toggle :checked + span {left: calc(100% - 14px);}
.cont-all dl.panel-list > dd,
.approval-detail-view dl.panel-list > dd,
.approval-detail-view .top-panel .template-explain dd {
  position: relative;
  padding: 0 20px 16px;
}
.approval-detail-view.write dl.panel-list > dd {
  position: relative;
  padding: inherit;
}
.approval-detail-view.write dl.panel-list > dd + div.basic-view {border-top: 1px solid #eee;}
.approval-detail-view .panel-list.approval-request-cont {margin-top: 16px;}
.approval-detail-view .panel-list.approval-request-cont > dt,
.approval-detail-view .panel-list.toggle-button-area > dt {
  padding: 0 20px;
  border-radius: initial;
  background-color: #F7FAFE;
  height: 50px;
  line-height: 50px;
  box-sizing: border-box;
}
.approval-detail-view .panel-list.approval-request-cont .bo-t {padding: 16px 20px;}
.approval-detail-view dl.panel-list.in-slt > dt.tit-hide {display: none;}
.approval-detail-view .bo-t dl.panel-list.in-slt > dd {margin-top: 16px;}
.approval-detail-view dl.panel-list.in-slt > dd {padding: 0 16px 14px;}
.approval-detail-view .panel-list.approval-request-cont .btn-area a i,
.approval-detail-view .top-panel .toggle-button-area .btn-area.toggle-button a i,
.approval-detail-view .panel-list.add-cont-area .btn-area a i {font-size: 0;}
.approval-detail-view .panel-list.approval-request-cont .btn-area a i.ico-uni-arrow-down,
.approval-detail-view .top-panel .toggle-button-area .btn-area.toggle-button a i.ico-uni-arrow-down,
.approval-detail-view .panel-list.add-cont-area .btn-area a i.ico-uni-arrow-down {
  display: flex;
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-arrow.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.approval-detail-view .panel-list.approval-request-cont.cont-on .btn-area a i.ico-uni-arrow-up,
.approval-detail-view .top-panel .toggle-button-area.on .btn-area.toggle-button a i.ico-uni-arrow-up,
.approval-detail-view .panel-list.add-cont-area.cont-on .btn-area a i.ico-uni-arrow-up {
  display: flex;
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-arrow.svg') 50% 50% no-repeat;
  background-size: 20px;
  transform: rotate(180deg);
}
.panel-list.related-document-area .dd-set .btn-area.toggle-button a i.ico-uni-close::before {
  display: block;
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-close.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.top-panel.dl-set > dl:not(.toggle-button-area) {display: none;}
.top-panel.dl-set.on > dl {display: block;}
.approval-detail-view .top-panel.dl-set {
  overflow: hidden;
  height: 50px;
  padding: initial;
}
.approval-detail-view .top-panel.dl-set.on {height: inherit;}
.approval-detail-view .top-panel.dl-set dl + dl {border: 0;}
.approval-detail-view .top-panel.dl-set.on .panel-list.toggle-button-area > dt {border-bottom: 1px solid #eee;}
.approval-detail-view .panel-list.approval-request-cont.cont-on > dt {border-bottom: 1px solid #eee;}

/* 추가 */
.panel-list.slt-user dd {
  background-color: #F9F9FD;
  border-radius: 20px;
  margin: 0 14px;
  overflow: hidden;
}
.panel-list.slt-user + .panel-list.slt-user {
  margin: 12px 0;
  border-top: 0;
}
.my-approval-line.panel-list + .panel-list.slt-user {border: 0;}
.approval-detail-view .panel-list.detail-set dd.document-top {
  border-top: 1px solid #eee;
  padding: 20px;
}
.approval-detail-view .panel-list.detail-set dd.document-top dl dt {
  line-height: 40px;
  color: #222;
  font-family: 'Pretendard-Medium';
}
.approval-detail-view .panel-list.detail-set dd.document-top dl dd {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  min-height: 40px;
  padding: 4px 10px;
  line-height: 26px;
  border-radius: 4px;
  background-color: rgba(233,234,239,.3);
  box-sizing: border-box;
}
.approval-detail-view .panel-list.detail-set dd.document-top dl dt {line-height: 40px;}
.approval-detail-view .panel-list.detail-set dd.document-top dl.col-100 dd {
  float: inherit;
  width: 100%;
  background-color: initial;
  height: inherit;
  line-height: inherit;
  padding: 0;
}
.approval-detail-view .panel-list.detail-set dd.document-top dl.col-100 dd:empty {display: none;}
.approval-detail-view .panel-list.detail-set dd.document-top dl.col-100 + dl {margin-top: 0;}
.approval-detail-view .panel-list.detail-set dd.document-top dl.col-100 + dl:last-child dd {
  width: 100%;
  padding: 8px 10px;
  border-radius: 4px;
  background-color: rgba(233, 234, 239, .3);
  box-sizing: border-box;
}
.approval-detail-view .panel-list.detail-set dd.document-top dl + dl:last-child dd {
  background-color: inherit;
  padding: 0;
}
.approval-detail-view .panel-list.detail-set dd.document-top dl pre {line-height: initial;}
.approval-detail-view .panel-list.detail-set dd.document-top .doc-list h3 {
  font-size: 16px;
  font-weight: normal;
  padding: 20px 0;
  font-family: 'Pretendard-Medium';
}
.approval-detail-view dl.panel-list.add-file-area {
  background-color: #fff;
  margin: 12px 0;
  border-radius: 20px;
  padding-bottom: 1px;
}
.approval-detail-view.write dl.panel-list.add-file-area {margin: 0;}
.approval-detail-view dl.panel-list.referencedoc,
.approval-detail-view dl.panel-list.opinion-area,
.approval-detail-view dl.panel-list.process {
  background-color: #fff;
  border-radius: 20px;
  margin-top: 12px;
}
.approval-detail-view dl.panel-list.add-file-area .file-area.in-file {margin: auto 0;}
.approval-detail-view dl.panel-list.add-file-area > dd {margin: 0 auto;}

/* 의견글 영역 */
.approval-detail-view dl dd .comment-list {
  position: relative;
  padding-top: 11px;
  background: #F9F9FD;
  border-radius: 8px;
  padding: 16px 12px;
}
.approval-detail-view dl dd .comment-list + div {
  margin-top: 12px;
}
.approval-detail-view dl dd .comment-list p {
  font-family: 'Pretendard-Medium';
  margin-bottom: 10px;
  width: calc(100% - 40px);
}
.approval-detail-view dl dd .comment-list .comment-list-in p {
  font-size: 14px;
  margin-bottom: 0;
  margin-top: 8px;
  font-family: 'Pretendard-Regular';
  color: #888;
}
.approval-detail-view dl dd .comment-list span {
  overflow: hidden;
  display: inline-block;
  width: 100%;
  vertical-align: top;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #555;
  font-size: 15px;
}
.approval-detail-view dl dd .comment-list span + span {
  display: block;
  margin-top: 2px;
  color: #888;
}
.approval-detail-view dl dd .comment-list .file-list {
  margin-top: 12px;
  border-radius: 8px;
  background-color: #fff;
  border: 1px dashed #ddd;
}
.approval-detail-view dl dd .comment-list .file-list i {color: inherit;}
.approval-detail-view dl dd .comment-list .file-list i:first-child::before {font-weight: normal;}
.approval-detail-view dl dd .comment-list .file-list a {
  display: inline;
  word-break: break-all;
  color: #777;
  font-size: 11px;
  padding: 1px 4px;
  border-radius: 1px;
  background-color: #f5f5f5;
}
.comment-list .file-list .file-area.in-file {
  width: 100%;
  border-radius: initial;
  margin: 0;
  background-color: initial;
}
.comment-list .file-list .file-area.in-file + .file-area.in-file {margin-top: -10px;}
.comment-list .file-list .file-area.in-file .file-area-in .action-area .file-name {
  max-width: 70%;
  color: #888;
}
.comment-list .file-list .file-area.in-file .file-area-in .action-area .btn-area a {
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  padding: 0;
  font-size: inherit;
  border-radius: 0;
  background-color: transparent;
}
.approval-detail-view dl dd .comment-list .btn-area {top: 9px;}
.approval-detail-view dl dd .comment-list:first-child > .btn-area {top: 10;}
.approval-detail-view .panel-list.process .comment-list-in {margin-top: 3px;}
.approval-detail-view .panel-list.process .comment-list-in p:last-child {margin-right: 0;}
.approval-detail-view .panel-list.process .comment-list-in p .op-tt {
  width: 93px;
  font-family: 'Pretendard-SemiBold';
}

/* 내 결재선 */
.approval-detail-view .inp.next-check {
  width: 100%;
  box-sizing: border-box;
}

/* 서비스용 서식 */
.approval-detail-view .panel-list.detail-noeditor dd dl {overflow: hidden;}
.approval-detail-view .panel-list.detail-noeditor dd dl + dl {margin-top: 11px;}
.approval-detail-view .panel-list.detail-noeditor dd dl dt,
.approval-detail-view .panel-list.detail-noeditor dd dl dd {
  float: left;
}
.approval-detail-view .panel-list.detail-noeditor dd dl.float-none dt,
.approval-detail-view .panel-list.detail-noeditor dd dl.float-none dd {
  float: none;
}
.approval-detail-view .panel-list.detail-noeditor dd dl dt {
  position: relative;
  width: 93px;
  color: #777;
}
.approval-detail-view .panel-list.detail-noeditor dd dl dd {width: calc(100% - 93px);}
.approval-detail-view .panel-list.detail-noeditor dd dl.float-none dt {width: inherit;}
.approval-detail-view .panel-list.detail-noeditor dd dl.float-none dd {
  display: -webkit-box;
  width: inherit;
  height: 74px;
  margin-top: 3px;
  text-align: justify;
  white-space: normal;
  line-height: 24px;
  -webkit-line-clamp: 3;
  word-wrap: break-word;
  -webkit-box-orient: vertical;
}

/* 공통 서식 */
.approval-detail-view .panel-list.detail-set dd dl {overflow: hidden;}
.approval-detail-view .panel-list.detail-set dd dl + dl {margin-top: 12px;}
.approval-detail-view .panel-list.detail-set dd dl dt,
.approval-detail-view .panel-list.detail-set dd dl dd {
  float: left;
}
.approval-detail-view .panel-list.detail-set dd dl.float-none dt,
.approval-detail-view .panel-list.detail-set dd dl.float-none dd {
  float: none;
}
.approval-detail-view .panel-list.detail-set dd dl dt {
  position: relative;
  width: 93px;
  color: #777;
}
.approval-detail-view .panel-list.detail-set dd dl dd {width: calc(100% - 93px);}
.approval-detail-view .panel-list.detail-set dd dl.float-none dt {width: inherit;}
.approval-detail-view .panel-list.detail-set dd dl.float-none dd {
  display: -webkit-box;
  width: inherit;
  height: 74px;
  margin-top: 3px;
  text-align: justify;
  white-space: normal;
  line-height: 24px;
  -webkit-line-clamp: 3;
  word-wrap: break-word;
  -webkit-box-orient: vertical;
}
.approval-detail-view .panel-list dd dl.col-100 dt {
  width: inherit !important;
  float: inherit;
}
.approval-detail-view .panel-list dd dl.col-100 dd {
  width: inherit !important;
  margin-top: 3px;
}
.approval-detail-view .panel-list dd dl.col-100 dd h3 {
  font-size: 16px;
  font-weight: normal;
  font-family: 'Pretendard-Medium';
  width: 100%;
}
.approval-detail-view .panel-list dd dl.col-100 dd h3 + table {margin-top: 20px;}
.approval-detail-view .panel-list .current-user > span:last-child::after {display: none;}

/* 추가 */
.approval-detail-view .panel-list .current-user {position: relative;}
.approval-detail-view .panel-list .current-user span + span::before {
  display: inline-block;
  font-family: "unifont";
  content: '\e803';
  margin: 0 5px 0 3px;
  font-weight: 600;
  color: #888;
}
.approval-detail-view .panel-list .current-user span {font-size: 16px;}
.approval-detail-view .panel-list .current-user span span.approve {
  font-size: 16px;
  color: #ff8b00;
}
.approval-detail-view .panel-list .current-user span span.agree,
.approval-detail-view .panel-list .current-user span span.receive {
  color: #00c0b5;
}
.approval-detail-view .panel-list .current-user span span.rej {color: #FF6225;}
.approval-detail-view .panel-list .add-ref-name,
.approval-detail-view .panel-list .file-name {
  overflow: hidden;
  display: inline-block;
  vertical-align: top;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.approval-detail-view .panel-list .add-ref-name {
  max-width: 90%;
  font-family: "Pretendard-Medium";
}
.approval-detail-view .panel-list .file-name {max-width: 70%;}
.approval-detail-view .panel-list .file-name + span {
  margin-left: 3px;
  font-size: 12px;
  color: #2f79a6;
}
.approval-detail-view .panel-list .btn-area {
  position: absolute;
  top: calc(50% - 16px);
  right: 22px;
}
.approval-detail-view .panel-list .btn-area.toggle-button {
  position: absolute;
  top: calc(50% - 12px);
  right: 20px;
}
.approval-detail-view .panel-list .btn-area.btn-icon-plus {
  top: calc(50% - 5px);
  font-size: 0;
  background: url(../images/ico-plus.svg) 50% 50% no-repeat;
  background-size: 20px;
  width: 20px;
  height: 20px;
  opacity: .4;
}
.approval-detail-view .panel-list .btn-area.btn-icon-plus a {
  width: 20px;
  height: 20px;
}
.approval-detail-view .panel-list .btn-area.txt-btn {
  position: absolute;
  top: 20px;
  right: 20px;
}
.approval-detail-view .panel-list .btn-area.txt-btn a {
  height: 20px;
  line-height: 20px;
}
.approval-detail-view .panel-list .btn-area a.button-ico {
  width: 20px;
  height: 20px;
}
.approval-detail-view .panel-list .btn-area a {
  display: inline-block;
  position: relative;
  width: 24px;
  height: 24px;
  line-height: 24px;
}
.approval-detail-view .panel-list .btn-area a + a {margin-left: 5px;}
.approval-detail-view .panel-list .btn-area a i {
  vertical-align: middle;
  font-size: 20px;
  color: #888;
  font-weight: bold;
}
/* 결재상세 > 상세 */
.wrap.approval .board-area .image {border-radius: 20px;}

/* 결재 팝업페이지 내 스타일 추가 */
.pop-modal-container .content-area.form-set .approval-detail-view .slt-user {margin-bottom: 16px;}
.pop-modal-container .approval-detail-view dl.panel-list.slt-user > dt {padding: 20px;}
.pop-modal-container .approval-detail-view.write dl.panel-list > dd {
  margin: 0;
  border-radius: 20px;
  background-color: #fff;
}
.pop-modal-container .content-area.cont-all .approval-detail-view dl.panel-list > dd {border-top: 1px solid #eee;}
.pop-modal-container .content-area.cont-all .approval-detail-view dl.panel-list.detail-basic {margin: 0;}

/* 바텀시트 내 스타일 추가 : 결재상세 */
.modal-approval-only .form-set .board-area {padding: 20px 0;}
.modal-approval-only .form-set .board-area dl.add-file-area dt + dd .file-area.in-file {margin-top: 6px;}
.modal-approval-only .form-set .board-area .add-file-area dl {flex-direction:column;}
.modal-approval-only .form-set .board-area .add-file-area dl dt {
  width: 100%;
  display: flex;
}

/* 관련문서 영역 */
.approval-detail-view .panel-list.referencedoc dd {
  display: flex;
  align-items: center;
}
.approval-detail-view .panel-list .btn-area:has(i.ico-uni-popup) {top: calc(50% - 12px);}
.approval-detail-view .panel-list .btn-area a i.ico-uni-popup {
  display: flex;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  font-size: 0;
  color: transparent;
  content: '';
  background: url('../images/ico-new-window.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.approval-detail-view .panel-list .btn-area a input[type=file] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.approval-detail-view .panel-list .btn-area .a dl.add-file-area dt .btn-area a i.ico-uni-camera {
  display: flex;
  width: 100%;
  height: 100%;
  content: '';
  background: url(../images/ico-camera.svg) 50% 50% no-repeat;
  background-size: 22px;
}
.approval-detail-view dl.panel-list.add-file-area dt,
.approval-detail-view dl.panel-list.referencedoc dt,
.approval-detail-view dl.panel-list.opinion-area dt,
.approval-detail-view dl.panel-list.process dt {
  border-radius: 20px;
}
.approval-detail-view:not(.write) dl.panel-list.add-file-area:has(:not(dd)),
.approval-detail-view:not(.write) dl.panel-list.referencedoc:has(:not(dd)),
.approval-detail-view:not(.write) dl.panel-list.opinion-area:has(:not(dd)),
.approval-detail-view:not(.write) dl.panel-list.process:has(:not(dd)) {
  padding-bottom: 8px;
}
.approval-detail-view dl.panel-list.add-file-area.no-cont dd,
.approval-detail-view dl.panel-list.add-file-area dd:empty,
.approval-detail-view dl.panel-list.referencedoc dd:empty,
.approval-detail-view dl.panel-list.opinion-area dd:empty,
.approval-detail-view dl.panel-list.process dd:empty {
  padding-bottom: 0;
}
.approval-detail-view dl.panel-list.referencedoc {padding-bottom: 16px;}
.approval-detail-view dl.panel-list.referencedoc .btn-area {
  position: absolute;
  top: 16px;
  right: 20px;
}
.approval-detail-view dl.panel-list.referencedoc .btn-area a {
  display: inline-block;
  position: relative;
  width: 24px;
  height: 24px;
  line-height: 24px;
}
.approval-detail-view dl.panel-list.referencedoc dd {
  align-items: center;
  flex-direction: row;
  position: relative;
  height: 45px;
  padding: 0 12px;
  line-height: 45px;
  background-color: #F9F9FD;
  box-sizing: border-box;
  margin: 0 20px;
}
.approval-detail-view dl.panel-list.referencedoc dt + dd:nth-child(2):last-child {
  border-radius: 8px;
}
.approval-detail-view dl.panel-list.referencedoc dt + dd {
  border-radius: 8px 8px 0 0;
}
.approval-detail-view dl.panel-list.referencedoc dd:last-child {
  border-radius: 0 0 8px 8px;
}
.approval-detail-view dl.panel-list.referencedoc dd .add-ref-name {
  overflow: hidden;
  display: inline-block;
  position: relative;
  width: 100%;
  height: 38px;
  text-align: left;
  vertical-align: top;
  line-height: 40px;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: "Pretendard-Medium";
}
.approval-detail-view dl.panel-list.referencedoc dd .add-ref-name:first-child {border-radius: 8px 8px 0 0;}
.approval-detail-view dl.panel-list.referencedoc dd .add-ref-name:last-child {border-radius: 0 0 8px 8px;}
.approval-detail-view dl.panel-list.referencedoc dd .add-ref-name:only-child {border-radius: 8px;}
.approval-detail-view dl.panel-list.referencedoc dd .btn-area {
  position: inherit;
  top: inherit;
  right: inherit;
  margin-left: auto;
}
.approval-detail-view dl.panel-list.referencedoc dd .btn-area a {opacity: .4;}
.approval-detail-view dl.panel-list.referencedoc .btn-area a i {
  display: inline-flex;
  width: 100%;
  height: 100%;
}
.approval-detail-view dl.panel-list.referencedoc dd .btn-area a i.ico-uni-close::before {
  display: flex;
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-close.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.approval-detail-view .panel-list.referencedoc .btn-area a i.ico-uni-popup::before {
  display: flex;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  font-size: 0;
  color: transparent;
  content: '';
  background: url('../images/ico-new-window.svg') 50% 50% no-repeat;
  background-size: 20px;
  opacity: .4;
}
.approval-detail-view .panel-list.referencedoc .btn-area a i.ico-uni-file::before {
  display: flex;
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-file.svg') 50% 50% no-repeat;
  background-size: 16px;
  font-size: 0;
}

/* 조건별 결재선 추가 */
/* .apvln-by-cond 일단 삭제 */
/* .approval-detail-view .panel-list.slt-user .user-line.apvln-by-cond > a:first-child {width: calc(100% - 64px);} */
.approval-detail-view .panel-list.slt-user .user-line.in-btn-2 > a:first-child {width: calc(100% - 58px);}
.approval-detail-view .panel-list.slt-user dd .btn-area i.ico-uni-pen {
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  top: 3px;
  width: 24px;
  height: 24px;
}
.approval-detail-view .panel-list.slt-user dd .btn-area i.ico-uni-pen::before {font-size: 59px;}


/* 옵션별 설명 추가 */
.approval-detail-view .panel-list.slt-user .user-line.acl-line > a:first-child {width: calc(100% - 80px);}
.approval-detail-view .panel-list.slt-user .line-desc {
  display: none;
  position: absolute;
  top: 14px;
  right: 20px;
  padding: 0 8px;
  line-height: 24px;
  font-size: 12px;
  color: #FF6225;
  background-color: rgba(255,98,37,.08);
}
.approval-detail-view .panel-list.slt-user .acl-line .line-desc.acl {display: block;}

/* default 버튼 제거 */
.approval-detail-view .panel-list .user-line.no-del .btn-area a:last-child {pointer-events: none;}
.approval-detail-view .panel-list .user-line.no-del .btn-area a:last-child i {display: none;}


/* 품의내용 상세 */
.approval-detail-view .top-panel {
  margin-top: 16px;
  border: 1px dashed #bbb;
  border-radius: 20px;
  overflow: hidden;
  background-color: #fff;
}
.approval-detail-view.write .top-panel {margin-top: 0;}
.approval-detail-view .panel-list.toggle-button-area.on dt {
  border-bottom: 1px solid #eee;
}
.approval-detail-view .panel-list.toggle-button-area .bo-t dt {
  border-bottom: 0;
}
.approval-detail-view .top-panel.on .panel-list.toggle-button-area dt {
  border-bottom: 0;
}
.approval-detail-view .action-area i.ico-uni-arrow-up,
.approval-detail-view .action-area.top-panel-on i.ico-uni-arrow-down,
.approval-detail-view .panel-list i.ico-uni-arrow-up,
.approval-detail-view .panel-list.cont-on i.ico-uni-arrow-down,
.approval-detail-view .panel-list.in-slt.on i.ico-uni-arrow-down {
  display: none;
}
.approval-detail-view .action-area i.ico-uni-arrow-down,
.approval-detail-view .action-area.top-panel-on i.ico-uni-arrow-up,
.approval-detail-view .panel-list i.ico-uni-arrow-down,
.approval-detail-view .panel-list.cont-on i.ico-uni-arrow-up,
.approval-detail-view .panel-list.in-slt.on i.ico-uni-arrow-up {
  display: inline-block;
}
/* 추가 */
.approval-detail-view .panel-list.detail-basic,
.approval-detail-view .panel-list.add-cont-area {
  background-color: #fff;
  border-radius: 20px;
  border: 1px dashed #bbb;
  margin: 14px 0;
  overflow: hidden;
}
.approval-detail-view .panel-list.add-cont-area dt {
  height: 50px;
  line-height: 50px;
  padding: 0 20px;
}
.approval-detail-view .panel-list.add-cont-area dt .btn-area {
  position: absolute;
  top: calc(50% - 12px);
  right: 20px;
}
.approval-detail-view .panel-list.detail-basic .basic-view {
  overflow: auto;
  border: 1px solid #eee;
}
.approval-detail-view .panel-list.detail-basic .detail-preview.tbl-area {margin: 0;}
.approval-detail-view .panel-list.detail-basic .detail-preview.tbl-area table {border-top: 1px solid #999;}
.approval-detail-view .panel-list.detail-basic .detail-preview.tbl-area table th,
.approval-detail-view .panel-list.detail-basic .detail-preview.tbl-area table td {
  border-color: #ddd;
  padding: 10px;
}
.basic-view .doc-top {margin: 20px 20px 20px 50px;}
.basic-view .doc-view {
  position: relative;
  width: 752px;
  font-size: 14px;
}
.basic-view .doc-view.down-size {width: 100%;}
.basic-view .doc-view .tbl-area table th,
.basic-view .doc-view .tbl-area table td {vertical-align: middle;}
.basic-view .doc-view.down-size .tbl-area table th,
.basic-view .doc-view.down-size .tbl-area table td {
  word-break: break-all;
}
.tbl-basic .tbl-area table th.empty,
.tbl-basic .tbl-area table td.empty {
  background-image: linear-gradient(to top left,white 50%,#eee,white 51%);
}
.basic-view .doc-view .btn-area,
.basic-view .col-2nd-top .btn-area {
  position: absolute;
  top: -6px;
  left: 10px;
  opacity: 0.3;
}
.basic-view .doc-view .btn-area:active,
.basic-view .col-2nd-top .btn-area:active {
  opacity: 1;
}
.basic-view .doc-view .btn-area i,
.basic-view .col-2nd-top .btn-area i {
  font-size: 34px;
  cursor: pointer;
}
.basic-view .doc-view .btn-area i.ico-uni-upsize-f,
.basic-view .doc-view.down-size .btn-area i.ico-uni-downsize-f {
  display: none;
}
.basic-view .doc-view.down-size .btn-area i.ico-uni-upsize-f,
.basic-view .doc-view .btn-area i.ico-uni-downsize-f {
  display: block;
}
.basic-view .doc-top p {
  width: 100%;
  color: #888;
}
.basic-view .doc-view.down-size .doc-top p {width: inherit;}
.doc-view table tr {height: 40px;}
.doc-view table th .comp-user + span,
.doc-view table td .comp-user + span {padding-left: 3px;}
.doc-view table td .progress-draft,
.doc-view table td .progress-retr,
.doc-view table td .progress-rej,
.doc-view table td .progress-agree,
.doc-view table td .progress-fin,
.doc-view table td .progress-arbitrary {
  display: block;
  width: 34px;
  height: 34px;
  margin: 0 auto;
  text-align: center;
  line-height: 34px;
  font-size: 12px;
  color: #fff;
  border-radius: 20px;
}
.doc-view table td .progress-draft.in-img,
.doc-view table td .progress-retr.in-img,
.doc-view table td .progress-rej.in-img,
.doc-view table td .progress-agree.in-img,
.doc-view table td .progress-fin.in-img,
.doc-view table td .progress-arbitrary.in-img {background-color: transparent;}
.doc-view table td .progress-draft.in-img img,
.doc-view table td .progress-retr.in-img img,
.doc-view table td .progress-rej.in-img img,
.doc-view table td .progress-agree.in-img img,
.doc-view table td .progress-fin.in-img img,
.doc-view table td .progress-arbitrary.in-img img {
  width: auto;
  max-width: 34px;
  height: auto;
  max-height: 34px;
  border-radius: 0;
}
.doc-view table td .progress-draft + span,
.doc-view table td .progress-retr + span,
.doc-view table td .progress-rej + span,
.doc-view table td .progress-agree + span,
.doc-view table td .progress-fin + span,
.doc-view table td .progress-arbitrary + span {
  display: inline-block;
  margin-top: 3px;
}
.doc-view table td .progress-draft {background-color: #f395a5;}
.doc-view table td .progress-draft + span {color: #f395a5;}
.doc-view table td .progress-retr {background-color: #8398B5;}
.doc-view table td .progress-retr + span {color: #8398B5;}
.doc-view table td .progress-rej {background-color: #FF6225;}
.doc-view table td .progress-rej + span {color: #FF6225;}
.doc-view table td .progress-agree {background-color: #00c0b5;}
.doc-view table td .progress-agree + span {color: #00c0b5;}
.doc-view table td .progress-fin {background-color: #ff7e00;}
.doc-view table td .progress-fin + span {color: #ff7e00;}
.doc-view table td .progress-arbitrary {background-color: #bd967e;}
.doc-view table td .progress-arbitrary + span {color: #bd967e;}
.doc-view .add-content .add-content-in {overflow: auto;}
.doc-view .add-content .add-content-in img {max-width: 100%;}
.doc-view .add-content .add-content-in textarea {border: 0;}
.doc-view .add-template {border: 0;}
.doc-view table td.add-template {text-align: left;}
.content-area .doc-view .tbl-area table td.add-template {padding: 8px;}
.approval-detail-view .panel-list dt .badge-num {
  font-family: "Pretendard-SemiBold";
  padding-left: 4px;
  font-size: 17px;
  color: #FF6225;
  position: initial;
}

/* 버튼영역 상단으로 분리 버전 */
.approval-detail-view .panel-list .doc-size-btn {
  overflow: hidden;
  height: 40px;
  padding: 0 20px;
  line-height: 40px;
  background-color: #eee;
}
.approval-detail-view .panel-list .doc-size-btn > span {float: left;}
.approval-detail-view .panel-list .doc-size-btn .btn-area {
  position: static;
  float: right;
  margin-right: -8px;
}
.approval-detail-view .panel-list .doc-size-btn .btn-area i {
  line-height: 40px;
  font-size: 34px;
  cursor: pointer;
}
.approval-detail-view .btn-area.txt-btn .process {
  margind-left : -1rem;
}

  /* 추가내용 스타일 추가 */
.doc-view .tbl-basic .tbl-area table th {
  color: #555;
  background-color: rgba(34,34,34,.03);
}
.doc-view .tbl-basic.tbl-th-left .tbl-area table th {padding-left: 20px;}
.doc-view .doc-top + .tbl-basic .tbl-area:first-child,
.doc-view .tbl-basic .tbl-area table tr .add-content {padding-top: 20px;}
.doc-view .doc-top + .tbl-basic > .tbl-area:first-child {padding-top: 10px;}
.doc-view .tbl-basic .tbl-area table th,
.doc-view .tbl-basic .tbl-area table td {
  padding: 0;
  font-size: 13px;
  border: 1px solid #e5e5e5;
}
.doc-view .tbl-basic .tbl-area table .inp,
.doc-view .tbl-basic .tbl-area table .slt,
.doc-view .tbl-basic .tbl-area table .mobi-select {
  font-size: 13px;
}
.doc-view .tbl-basic .tbl-area table .txt-left {padding: 0 8px;}
.doc-view .tbl-basic.in-tbl-explain > .tbl-area table td {padding: 3px 8px;}
.doc-view .in-tbl-explain .tbl-explain {margin-top: 3px;}

/* 양식작성, 수정 내 스타일 추가 */
.tbl-col-2 {width: 50%;}
.tbl-col-3 {width: 33.33333333%;}
.tbl-col-4 {width: 25%;}
.add-form .add-write-op td {height: inherit;}
.add-form .add-write-op .op-group {
  display: table !important;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
.add-form .add-write-op .op-group .op-tt {
  display: table-cell;
  width: 100px;
  padding: 0 5px;
  vertical-align: middle;
  border-right: 1px solid #eee;
  background-color: rgba(34,34,34,.03);
  box-sizing: border-box;
}
.add-form .add-write-op .op-group .cont-area {
  display: table-cell;
  text-align: left;
  vertical-align: middle;
  padding: 0.2rem 0.5rem;
}
.add-form .add-write-op .op-group .cont-area .tbl-explain {
  margin: 0.2rem 0 0;
  font-size: 0.75rem;
}
.add-form .add-write-op .op-group .period-area {border: 1px dashed #ddd;}
.add-form .add-write-op .op-group .red-star + * .period-area {border: 1px dashed rgba(255,37,58,.5);}
.add-form .add-write-op .op-group .period-area input {
  height: 1.9rem;
  border: 0;
}

/* 에디터 내부 초기화 */
.tbl-basic .tbl-area table tr .in-editor {font-family: sans-serif;}
.tbl-basic .tbl-area table tr .in-editor * {
  height: inherit;
  margin: inherit;
  padding: inherit;
  list-style: inherit;
  font-family: sans-serif;
}
.tbl-basic .tbl-area table tr .in-editor dl * {border: inherit;}
.tbl-basic .tbl-area table tr .in-editor ul {list-style-type: disc;}
.tbl-basic .tbl-area table tr .in-editor ol {list-style-type: decimal;}
.tbl-basic .tbl-area table tr .in-editor pre {
  font-size: inherit;
  color: inherit;
}
.tbl-basic .tbl-area table tr .in-editor *::before {display: none;}
.tbl-basic .tbl-area table .in-editor th,
.tbl-basic .tbl-area table .in-editor td {
  height: inherit;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  border: 1px solid;
  background-color: inherit;
}
.tbl-basic .tbl-area table .in-editor .doc-template th,
.tbl-basic .tbl-area table .in-editor .doc-template td {
  padding: 0;
  border: 0;
}
.tbl-basic .tbl-area table .in-editor .doc-template span {
  padding: 0;
  font-family: 'Pretendard-Regular',Malgun Gothic,sans-serif;
}

/* 결재 작성 */
.approval-detail-view .panel-list .btn-area .btn-slt-line {
  width: inherit;
  height: inherit;
  padding: 0 0.5rem;
  font-size: 0.75rem;
  background-color: rgba(34,34,34,.1);
}
.approval-detail-view .panel-list .btn-area .btn-slt-line2 {
  width: inherit;
  height: inherit;
  padding: 0 0.5rem;
  font-size: 0.75rem;
  color: #ff8b00;
  border: 1px solid #ff8b00;
}
/* 버튼 추가 */
.approval-detail-view .panel-list .btn-area.txt-btn a {
  width: inherit;
  height: inherit;
  font-size: 14px;
  font-family: 'Pretendard-Medium';
  color: #0E5CE9;
}
.approval-detail-view .panel-list .btn-area.txt-btn a::after {
  display: inline-block;
  font-family: "unifont";
  content: '\e803';
  margin: 0 0 0 3px;
  font-weight: 600;
  color: #0E5CE9;
}
.approval-detail-view .panel-list .btn-area.txt-btn-del a {
  display: inline-block;
  position: relative;
  width: inherit;
  height: inherit;
  line-height: 19px;
  color: #555;
  font-size: 14px;
}
.approval-detail-view dl dd .comment-list .btn-area.txt-btn-del {
  top: 16px;
  right: 16px;
}
.btn-max-w84 {
  max-width: 84px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 52px;
  font-family: "Pretendard-Bold";
  font-size: 18px;
  border-radius: 12px;
  box-sizing: border-box;
}
.btn-red-line {
  color: #FF253A;
  background-color: #fff;
  border: 1px solid #FF253A;
}
.approval-detail-view .panel-list.slt-user dd,
.approval-detail-view .panel-list.line-1 dd {padding: 0;}
.approval-detail-view .panel-list.slt-user .user-line {
  position: relative;
  padding: 0 16px;
  height: 50px;
  line-height: 50px;
  box-sizing: border-box;
}
.approval-detail-view .panel-list.slt-user .user-line.on {background-color: #fffde8;}
.approval-detail-view .panel-list.slt-user .user-line.required {background-color: rgba(255,240,0,.1);}
.approval-detail-view .panel-list.slt-user .user-line.default {background-color: #fffdf3;}
.approval-detail-view .panel-list.slt-user .user-line.bg-grn {background-color: #e9fbee;}
.approval-detail-view .panel-list.slt-user .user-line.bg-blu {background-color: #e2f5ff;}
.approval-detail-view .panel-list.slt-user .user-line.add-btn-on {
  height: inherit;
  padding: 0.7rem 1.2rem;
  line-height: inherit;
}
.approval-detail-view .panel-list.slt-user .user-line + .user-line {border-top: 1px solid #eee;}
.approval-detail-view .panel-list.slt-user .user-line > a:first-child {
  overflow: hidden;
  display: inline-block;
  width: calc(100% - 5.8rem);
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.approval-detail-view .panel-list.slt-user .user-line.user-drafter a {width: calc(100% - 20px);}
.approval-detail-view .panel-list.slt-user dd span {font-family: 'Pretendard-Medium';}
.approval-detail-view .panel-list.slt-user dd span:first-child {
  display: inline-block;
  width: 67px;
  text-align: left;
}
.approval-detail-view .panel-list.slt-user dd span.basic {color: #555;}
.approval-detail-view .panel-list.slt-user dd span.approval {color: #ff8b00;}
.approval-detail-view .panel-list.slt-user dd span.agree,
.approval-detail-view .panel-list.slt-user dd span.receive {color: #00c0b5;}
.approval-detail-view .panel-list.slt-user dd .team-name {
  overflow: hidden;
  vertical-align: top;
  color: #999;
}
.approval-detail-view .panel-list.slt-user dd span + span {margin-left: 3px;}
.approval-detail-view .panel-list.slt-user dd .btn-area {
  display: flex;
  top: calc(50% - 0.8rem);
  /* top: 0; */
  right: 1.2rem;
}
.approval-detail-view .panel-list.slt-user .user-line.add-btn-on .btn-area {top: 0.7rem;}
.approval-detail-view .panel-list.slt-user dd .btn-area i{display: inline-block;}
.approval-detail-view .panel-list.slt-user dd .add-btn-area {
  display: none;
  padding: 0.2rem 0;
}
.approval-detail-view .panel-list.slt-user .user-line.add-btn-on .add-btn-area {display: block;}

/* user-line v2 */
.approval-detail-view .panel-list.slt-user .user-line.user-info > a:first-child {width: 100%;}
.approval-detail-view .panel-list.slt-user .user-line.user-info a span:first-child {display: none;}
.approval-detail-view .panel-list.slt-user .user-line.user-info a .team-name {max-width: 187px;}

.approval-detail-view .panel-list.slt-user dd .add-btn-area a {
  display: inline-block;
  padding: 0 0.5rem;
  height: 1.45rem;
  line-height: 1.45rem;
  font-size: 0.75rem;
  background-color: #eee;
}
.approval-detail-view .panel-list.slt-user dd .add-btn-area a + a {margin-left: 0.2rem;}
.approval-detail-view .panel-list.line-1 > dd {overflow: hidden;}
.approval-detail-view .panel-list dd .bo-t {
  padding-top: 1rem;
  border-top: 1px solid #eee;
}
.approval-detail-view .panel-list .write-area {
  display: inline-block;
  width: 100%;
  padding: 6px 0;
}
.approval-detail-view .panel-list .write-area .add-explain {
  margin-top: 8px;
  font-size: 14px;
  color: #888;
}
.approval-detail-view .panel-list.line-1 dl {
  float: left;
  position: relative;
  width: calc(100% - 40px);
  padding: 0 20px 16px;
}
.approval-detail-view .panel-list.line-1 dl + dl {border-top: 1px solid #f6f6f8;}
.approval-detail-view .panel-list.line-1 dl dt {color: #777;}
.approval-detail-view .panel-list.line-1 dl.in-write-pop {padding-bottom: 1.2rem;}
.approval-detail-view .panel-list.line-1 dl.in-write-pop dt {padding-bottom: 0.5rem;}
.approval-detail-view .panel-list.line-1 dl.in-write-pop dd textarea {
  overflow: hidden;
  display: -webkit-box;
  padding-right: 2.6rem;
  word-wrap: break-word;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.approval-detail-view .panel-list.line-1 dl.in-write-pop dd {position: relative;}
.approval-detail-view .panel-list.line-1 dl.in-write-pop dd > i {
  position: absolute;
  top: 0;
  right: 0;
  width: 2.6rem;
  height: 4.2rem;
  line-height: 4.2rem;
  font-size: 1.4rem;
  color: #222;
  background-color: rgba(255,248,213,.3);
}
.approval-detail-view .panel-list .write-area .period-area {
  width: calc(100% - 3.5rem);
  margin-top: -0.2rem;
}
.approval-detail-view .panel-list .write-area dt,
.approval-detail-view .panel-list .write-area dd {
  float: left;
}
.approval-detail-view .panel-list .write-area dt,
.approval-detail-view .panel-list .in-textarea dt {
  width: 100%;
  line-height: 40px;
  font-family: 'Pretendard-SemiBold';
}
.approval-detail-view .panel-list .in-textarea dd h3 {
  font-size: 16px;
  font-weight: normal;
  padding: 20px 0;
  font-family: 'Pretendard-Medium';
  width: 100%;
}
.approval-detail-view .panel-list .write-area dd {
  position: relative;
  height: 40px;
  padding: 0 10px;
  border-radius: 4px;
  background-color: rgba(233, 234, 239, .3);
  box-sizing: border-box;
  line-height: 40px;
}
.approval-detail-view .panel-list .write-area.dd-wid-100 dt {display: none;}
.approval-detail-view .panel-list .write-area dd {
  width: 100%;
}
.approval-detail-view .panel-list .write-area.dd-wid-100 dd {
  overflow: auto;
  width: calc(100vw - 38px);
}
.approval-detail-view .panel-list .write-area .inp {
  width: calc(100% + 20px);
  margin-left: -10px;
  box-sizing: border-box;
}
.approval-detail-view .panel-list .write-area .period-area .inp {width: calc(100% - 30px);}
.approval-detail-view .panel-list .write-area.cal-area.in-dd dd .inp.add-date {width: 55%;}
.approval-detail-view .panel-list .write-area.cal-area.in-dd dd:has(.inp.add-date)::after {right: calc(45% + 10px);}
.approval-detail-view .panel-list .slt-area {width: 100%;}
.approval-detail-view .panel-list.in-slt .slt {width: calc(100vw - 38px);}
.approval-detail-view .panel-list .slt-noti {
  margin: 11px 8px 0;
  font-size: 14px;
  color: #777;
}
.approval-detail-view .panel-list .guide-in-link {
  margin: 0.7rem 0.5rem 0;
  font-size: 0.85rem;
  color: #ff8b00;
}
.approval-detail-view .panel-list .guide-in-link a {text-decoration: underline;}
.panel-list dl.in-write-pop-r dd {position: relative;}
.panel-list dl.in-write-pop-r dd > i {
  position: absolute;
  top: 0;
  right: 0;
  width: 2.6rem;
  height: 4.2rem;
  line-height: 4.2rem;
  font-size: 1.4rem;
  color: #ff8b00;
  background-color: rgba(255,139,0,.05);
}
.panel-list dl.in-write-pop-r dd textarea {
  overflow: hidden;
  display: -webkit-box;
  padding-right: 2.6rem;
  word-wrap: break-word;
  white-space: normal;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

/* 상세 테이블 */
.approval-detail-view .panel-list.detail-tbl .tbl + .tbl {margin-top: 1.2rem;}
.approval-detail-view .panel-list.detail-tbl .tbl.list + .tbl.list {margin-top: -1px;}
.approval-detail-view .panel-list.detail-tbl .tbl table {
  width: 100%;
  background-color: #fff;
}
.approval-detail-view .panel-list.detail-tbl .tbl caption {
  display: block;
  text-align: left;
  line-height: 2.8rem;
  font-size: 0.95rem;
  color: #222;
}
.approval-detail-view .panel-list.detail-tbl .tbl tr:first-child th,
.approval-detail-view .panel-list.detail-tbl .tbl tr:first-child td {
  border-top:1px solid #222;
}
.approval-detail-view .panel-list.detail-tbl .tbl th {
  width: 35%;
  height: 2.8rem;
  text-align: center;
  line-height: 2.8rem;
  font-weight: normal;
  font-size: 0.85rem;
  color: #777;
  border-right:1px solid #ddd;
  border-bottom:1px solid #ddd;
}
.approval-detail-view .panel-list.detail-tbl .tbl td {
  width: 65%;
  padding:0 1.2rem;
  font-size: 0.85rem;
  border-bottom:1px solid #ddd;
}
.approval-detail-view .panel-list.detail-tbl .tbl.total td {
  font-family: 'Pretendard-Medium';
  text-align: right;
}
.approval-detail-view .panel-list.detail-tbl .tbl.total th.total,
.approval-detail-view .panel-list.detail-tbl .tbl.total td.total{
  background-color:#fffdf3;
}
.approval-detail-view .panel-list.detail-tbl .tbl.total th.total {color: #222;}
.approval-detail-view .panel-list.detail-tbl .tbl.total td.total {color: #ff253a;}
.approval-detail-view .panel-list.detail-tbl .tbl td a.detail {
  text-decoration: underline;
  color: #ff253a;
}
.approval-detail-view .panel-list.detail-tbl .tbl.file td {text-align: right;}
.approval-detail-view .panel-list.detail-tbl .tbl.file td a {color:#2f79a6;}

/* - 양식 정보 영역 추가 - */
.approval-detail-view .comp-file-info {
  position: relative;
  margin-bottom: 16px;
  line-height: 22px;
}
.approval-detail-view .comp-file-info .btn-modal {
  display: block;
  padding: 13px;
  font-family: 'Pretendard-SemiBold';
  color: #ff8b00;
}
.approval-detail-view .comp-file-info-area {
  overflow: hidden;
  position: relative;
  line-height: 20px;
  padding: 0;
}
.approval-detail-view .comp-file-info.on .comp-file-info-area {height: inherit;}
.approval-detail-view .comp-file-info.on .comp-file-info-area::after {display: none;}
.approval-detail-view .comp-file-info-area dl:first-child {padding: 0;}
.approval-detail-view .comp-file-info-area dl {padding: 0;}
.approval-detail-view .comp-file-info-area dl + dl {margin-top: 16px;}
.approval-detail-view .comp-file-info-area dl dt {
  margin-bottom: 2px;
  font-family: 'Pretendard-SemiBold';
}
.approval-detail-view .comp-file-info-area .comp-file-down {
  padding: 12px;
  border-bottom: 1px dashed #ddd;
}
.approval-detail-view .comp-file-info-area .comp-file-down dl {
  display: flex;
  align-items: center;
}
.approval-detail-view .comp-file-info-area .comp-file-down dt {margin: 0;}
.approval-detail-view .comp-file-info-area .comp-file-down dd {margin-left: auto;}
.approval-detail-view .comp-file-info-area .comp-file-down .btn-area {
  display: flex;
  align-items: center;
  justify-content: center;
}
.approval-detail-view .comp-file-info-area .comp-file-down .btn-area span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  margin: 0 10px;
  font-size: 18px;
  border-radius: 50%;
  background-color: rgba(153,153,153,.1);
}
.approval-detail-view .comp-file-info-area .comp-file-down .btn-area span.btn-download {
  color: #ff8b00;
  background-color: rgba(255,139,0,.1);
}
.approval-detail-view .comp-file-info-area .comp-file-down .btn-area .btn-search::before {
  font-family: "unifont";
  font-weight: bold;
  content: '\e832';
}
.approval-detail-view .comp-file-info-area .comp-file-down .btn-area .btn-download::before {
  font-family: "unifont";
  font-weight: bold;
  content: '\e851';
}
.approval-detail-view .comp-file-info-area .template-explain {
  padding: 16px 20px;
  border: 1px solid rgba(14, 92, 233, 0.25);
  border-radius: 20px;
  background-color: #ECF2FE;
  box-sizing: border-box;
  overflow: hidden;
}
.approval-detail-view .comp-file-info.on .comp-file-info-area .template-explain {
  height: inherit;
}
.approval-detail-view .comp-file-info-area .template-explain dl + dl {display: none;}
.approval-detail-view .comp-file-info-area .template-explain dl:first-child dd {
  position: relative;
  font-family: 'Pretendard-SemiBold';
  z-index: 1;
  font-size: 17px;
  line-height: 20px;
}
.approval-detail-view .comp-file-info-area .template-explain dl + dl dd pre {
  overflow: hidden;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 16px;
}
.approval-detail-view .comp-file-info.on .comp-file-info-area .template-explain dl + dl dd pre {
  overflow: inherit;
  white-space: pre-line;
  text-overflow: inherit;
  font-size: 16px;
}
.approval-detail-view .comp-file-info .btn-toggle {
  position: absolute;
  top: 15px;
  right: 21px;
  padding: 0;
  z-index: 1;
  width: 24px;
  height: 24px;
  background: url('../images/ico-arrow.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.approval-detail-view .comp-file-info.on:not(:has(.comp-file-down)) .btn-toggle {
  position: absolute;
  top: 15px;
  right: 21px;
  padding: 0;
  z-index: 1;
  width: 24px;
  height: 24px;
  background: url('../images/ico-arrow.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.approval-detail-view .comp-file-info.in-file-area .btn-toggle {
  top: calc(15px + 50px);
  width: 20px;
  height: 20px;
  right: 23px;
}
.approval-detail-view .comp-file-info.on .btn-toggle {
  width: 20px;
  height: 20px;
  background: url('../images/ico-arrow.svg') 50% 50% no-repeat;
  transform: rotate(180deg);
}
/* - 문서 목록 선택 (공통) - */
.search-doc .doc-list li {
  position: relative;
  padding: 0.6rem 1.2rem;
}
.search-doc .doc-list li.on {background-color: #fff8d5;}
.search-doc .doc-list li .category-name {
  margin-bottom: 0.2rem;
  font-size: 0.8rem;
  color: #999;
}

/* - 첨부문서 목록 팝업 - */
.upload-ref .ref-list li {
  position: relative;
  padding: 56px 20px 17px;
  line-height: 22px;
  background-color: #fff;
  cursor: pointer;
  border-radius: 20px;
  font-size: 14px;
}
.upload-ref .ref-list li + li {margin-top: 12px;}
.upload-ref .ref-list li *:first-child {
  position: absolute;
  top: 20px;
  left: 20px;
  height: 26px;
  padding: 0 8px;
  line-height: 26px;
  font-size: 14px;
  color: #222;
  border: 0;
  border-radius: 8px;
  background-color: rgba(255, 139, 0, .08);
}
.upload-ref .ref-list li .list-num,
.upload-ref .ref-list li .list-date {
  color: #888;
}
.upload-ref .ref-list li .list-tt {
  overflow: hidden;
  width: 100%;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 17px;
  font-family: 'Pretendard-SemiBold';
}

/* - 경조금 규정 팝업 - */
.cac-rule .cac-list li {
  position: relative;
  padding: 20px;
  line-height: 22px;
  background-color: #fff;
  border-radius: 20px;
}
.cac-rule .cac-list li + li {margin-top: 12px;}
.cac-rule .cac-list li .list-tt {
  width: 100%;
  margin-bottom: 8px;
  font-family: 'Pretendard-Medium';
}
.cac-rule .cac-list li dl {
  padding: 0;
  font-size: 14px;
}
.cac-rule .cac-list li dl dt {width: 67rem;}
.cac-rule .cac-list li dl dd {width: calc(100% - 78rem);}
.cac-rule .cac-list li dl.total-cost dd {
  font-family: 'Pretendard-SemiBold';
  color: #FF6225;
}

/* - 개인 결재선 관리 팝업 - */
.set-approval-line .approval-line-list li {
  position: relative;
  padding: 20px;
  line-height: 22px;
  background-color: #fff;
  cursor: pointer;
  border-radius: 20px;
}
.set-approval-line .approval-line-list li + li {margin-top: 12px;}
.set-approval-line .approval-line-list li .badge-area {
  position: absolute;
  top: 0;
  left: 0;
}
.set-approval-line .approval-line-list li .badge-area p {
  float: left;
  height: 22px;
  padding: 0 6px;
  font-size: 12px;
  line-height: 22px;
  color: #777;
  border: 1px solid #999;
}
.set-approval-line .approval-line-list li .badge-area p + p {margin-left: -1px;}
.set-approval-line .approval-line-list li .list-tt {
  overflow: hidden;
  width: 100%;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: 'Pretendard-SemiBold';
  font-size: 17px;
}
.set-approval-line .approval-line-list li .list-date {
  font-size: 12px;
  color: #888;
}
.set-approval-line .approval-line-list li .current-user {
  overflow: inherit;
  height: inherit;
  white-space: inherit;
  margin-top: 8px;
  line-height: inherit;
  color: #888;
  font-size: 14px;
}

/* - 의견글 팝업 내 추가 - */
.pop-cont-area .set-comment-noti {margin-top: 11px;}
.pop-cont-area .set-comment-noti .checkbox-area .check-label {display: inline-block;}
.pop-cont-area .set-comment-noti > .checkbox-area .check-label {margin: 0 0.5rem 0 0;}
.set-comment-noti .noti-user {
  overflow: auto;
  margin-top: 11px;
  border: 1px solid #ddd;
}
.pop-cont-area dl.panel-list.add-file-area > dt {
  padding-top: 5px;
}
.set-comment-noti .noti-user ul {padding: 0.6rem 0.6rem 0.6rem 1.75rem}
.set-comment-noti .noti-user ul + ul {border-top: 1px solid #eee;}
.set-comment-noti .noti-user ul li.check-all {
  margin: -0.6rem -0.6rem 0.6rem -1.75rem;
  padding: 0.5rem 0.7rem;
  background-color: #fafafa;
}
.set-comment-noti .noti-user ul li + li {margin-top: 0.6rem;}
.set-comment-noti .noti-user ul li.check-all .check-label {font-family: 'Pretendard-SemiBold';}

/* - 개인 제증명 발급 추가 - */
.my-certificate-issue .board-top .top-noti-area {
  height: 3.1rem;
  padding: 0 1.2rem;
  line-height: 3.1rem;
  color: #999;
  background-color: rgba(255,255,255,.5);
  border-bottom: 1px dashed #ddd;
  box-sizing: border-box;
}
.my-certificate-issue .board-top .top-noti-area::before {
  display: inline-block;
  font-family: "unifont";
  content: '\e807';
  margin: -1vw 1.5vw 0 0.5vw;
  vertical-align: middle;
  font-weight: bold;
  font-size: 5.5vw;
  color: #bbb;
}
.my-certificate-issue .certificate-list li {
  position: relative;
  margin: 0.6rem 0;
  padding: 1.2rem 1.5rem;
  background-color: #fff;
  box-shadow: 0 1px 20px rgba(0,0,0,.05);
}
.my-certificate-issue .certificate-list li + li {margin-top: 0.6rem;}
.my-certificate-issue .certificate-list .certificate-name {
  overflow: hidden;
  position: relative;
  max-width: 80%;
  padding-left: 1.2rem;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: 'Pretendard-Medium';
  font-size: 0.95rem;
}
.my-certificate-issue .certificate-list .in-unissued .certificate-name {max-width: 100%;}
.my-certificate-issue .certificate-list .certificate-name::before {
  display: block;
  position: absolute;
  top: 0.12rem;
  left: -0.12rem;
  width: 1.2rem;
  height: 1.2rem;
  content: '';
  background: url('../images/ico-certificate-mark.png') 0 0 no-repeat;
  background-size: 100%;
}
.my-certificate-issue .certificate-list .certificate-date {
  margin-top: 0.75rem;
  line-height: 1.4rem;
  font-size: 0.85rem;
}
.my-certificate-issue .certificate-list .certificate-date p.unissued {color: #999;}
.my-certificate-issue .certificate-list .certificate-date p span {margin-right: 0.25rem;}
.my-certificate-issue .certificate-list .btn-area {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  position: absolute;
  top: calc(50% - 2.4rem);
  right: 1.2rem;
}
.my-certificate-issue .certificate-list .in-unissued .btn-area {display: none;}
.my-certificate-issue .certificate-list .btn-area a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background-color: #eee;
}
.my-certificate-issue .certificate-list .btn-area a i {
  vertical-align: middle;
  font-size: 1.2rem;
}
.my-certificate-issue .certificate-list .btn-area a i::before {font-weight: bold;}


/* --- 계약관리 --- */
.econ .my-summary {background-color: #fff;}
.econ .my-summary h3 {
  padding: 1.2rem 0;
  text-align: center;
  font-family: 'Pretendard-Medium';
  font-weight: normal;
  font-size: 1.25rem;
  background-color: rgba(229,65,96,.1);
}
.econ .my-summary h3 span {
  display: block;
  font-size: 1.2rem;
}
.econ .my-summary ul {padding: 6.4rem 0 1.4rem;}
.econ .my-summary ul li {
  position: relative;
  margin: 1rem 2.4rem;
  font-size: 1.5rem;
}
.econ .my-summary ul li::before {
  display: inline-block;
  content: '-';
  margin-right: 0.7rem;
}
.econ .my-summary ul li.list-tt {
  position: relative;
  margin: 0;
  padding-bottom: 1.9rem;
  text-align: center;
  font-family: 'Pretendard-Medium';
  font-size: 1.25rem;
  border-bottom: 1px dashed #ddd;
}
.econ .my-summary ul li.list-tt::before {
  position: absolute;
  top: -4.2rem;
  left: 0;
  display: inline-block;
  width: 100%;
  text-align: center;
  font-family: 'unifont';
  content: '\e870';
  font-size: 3.75rem;
  color: #e54160;
}
.econ .my-summary ul li.list-tt + li {margin-top: 1.9rem;}
.econ .my-summary ul li span + span {
  position: absolute;
  top: 0;
  right: 0;
  font-family: 'Pretendard-SemiBold';
}
.econ .my-summary ul li.list-tt span {
  display: block;
  margin-left: 0;
  font-family: 'Pretendard-Regular';
  font-size: 1.2rem;
}

/* 목록 */
.board-list.econ-ing-list li .cont-area .board-num {display: none;}
.board-list.econ-ing-list li .cont-area .board-tt {
  overflow: hidden;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.board-list.econ-ing-list li .cont-area .board-status {
  position: absolute;
  bottom: 0;
  right: 0;
}
.board-list.econ-ing-list li .cont-area .board-status.c1 {color: #e54160;}
.board-list.econ-ing-list li .cont-area .board-status.c2 {color: #3d9eeb;}
.board-list.econ-ing-list li .cont-area .write-date {position: inherit;}


/* --- 매출계약관리 --- */
.salescon .tab-area + .my-summary {margin-top: 0.125rem;}
.salescon .my-summary {background-color: #fff;}
.salescon .my-summary h3 {
  padding: 1.2rem 0;
  text-align: center;
  font-family: 'Pretendard-Medium';
  font-weight: normal;
  font-size: 1.25rem;
  background-color: rgba(0,192,181,.1);
}
.salescon .my-summary h3 span {
  display: block;
  font-size: 1.2rem;
}
.salescon .my-summary ul {padding: 6.4rem 0 1.4rem;}
.salescon .my-summary ul li {
  position: relative;
  margin: 1rem 2.4rem;
  font-size: 1.5rem;
}
.salescon .my-summary ul li::before {
  display: inline-block;
  content: '-';
  margin-right: 0.7rem;
}
.salescon .my-summary ul li.list-tt {
  position: relative;
  margin: 0;
  padding-bottom: 1.9rem;
  text-align: center;
  font-family: 'Pretendard-Medium';
  font-size: 1.25rem;
  border-bottom: 1px dashed #ddd;
}
.salescon .my-summary ul li.total-line {color: #ff253a;}
.salescon .my-summary ul li.list-tt::before {
  position: absolute;
  top: -4.2rem;
  left: 0;
  display: inline-block;
  width: 100%;
  text-align: center;
  font-family: 'unifont';
  content: '\e8b3';
  font-size: 3.75rem;
  color: #00c0b5;
}
.salescon .my-summary ul li.list-tt.plan::before {content: '\e8b3';}
.salescon .my-summary ul li.list-tt.sales::before {content: '\e89c';}
.salescon .my-summary ul li.list-tt + li {margin-top: 1.9rem;}
.salescon .my-summary ul li span + span {
  position: absolute;
  top: 0;
  right: 0;
  font-family: 'Pretendard-SemiBold';
}
.salescon .my-summary ul li.list-tt span {
  display: block;
  margin-left: 0;
  font-family: 'Pretendard-Regular';
  font-size: 1.2rem;
}


/* --- 휴가처리 --- */
.avs .set-period {
  margin-bottom: 0.6rem;
  padding: 1.4rem 1.9rem;
  text-align: center;
  background-color: #fff;
}
.avs .set-period .slt-box {
  overflow: hidden;
  height: 2.8rem;
  line-height: 2.8rem;
  font-size: 1.05rem;
  border: 1px solid #222;
  box-sizing: border-box;
}
.avs .set-period .slt-box > * {
  float: left;
  width: 50%;
}
.avs .set-period .slt-box .slt-tt {
  text-align: center;
  font-family: 'Pretendard-Medium';
}
.avs .set-period .slt-box .slt-area::after {
  right: 0.5rem;
  font-size: 1.75rem;
}
.avs .set-period .slt-box .slt-area {
  border-left: 1px solid #ddd;
  box-sizing: border-box;
}
.avs .set-period .slt-box .slt-area .slt,
.avs .set-period .slt-box .slt-area .mobi-select {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0 1.75rem;
  line-height: inherit;
  font-size: 1.15rem;
  border: 0;
  background-color: transparent;
}

/* 사용 연도 선택 - v2 추가 */
.avs .set-period .slt-box.v2 {
  overflow: inherit;
  display: inline-block;
  position: relative;
  width: 100%;
  height: inherit;
  margin-bottom: 0.2rem;
  line-height: inherit;
  border: 0;
}
.avs .set-period .slt-box.v2 .slt-tt {text-align: left;}
.avs .set-period .slt-box.v2 .slt-area {
  position: absolute;
  top: -0.125rem;
  right: 0;
  width: inherit;
  text-align: right;
  border: 0;
}
.avs .set-period .slt-box.v2 .slt-area::after {display: none;}
.avs .set-period .slt-box.v2 .slt-area span {
  display: inline-block;
  padding: 0.125rem 0.6rem;
  font-size: 0.95rem;
  color: #bbb;
  border: 1px solid #eee;
  border-radius: 1.2rem;
  background-color: #fff;
  box-sizing: border-box;
}
.avs .set-period .slt-box.v2 .slt-area span.on {
  color: #fff;
  border: 1px solid #1ac6ed;
  background-color: #1ac6ed;
}
.avs .set-period .slt-box.v2 .slt-area span + span {margin-left: 0.125rem;}

/* 등록폼 내 추가 */
.avs .set-period.register {
  margin: 0;
  padding: 0;
}
.avs .set-period.register .slt-box.v2 {position: inherit;}
.avs .set-period.register .slt-box.v2 .slt-area span {
  padding: 0.125rem 0.35rem;
  font-size: 0.85rem;
}

.avs .set-period p {
  height: 2.8rem;
  margin-top: 0.6rem;
  line-height: 2.8rem;
  font-family: 'Pretendard-Medium';
  font-size: 1.05rem;
  background-color: rgba(26,198,237,.05);
}
.avs .set-period p span {
  position: relative;
  display: inline-block;
  margin-left: 1.4rem;
  font-family: 'Pretendard-Medium';
}
.avs .set-period p span::before {
  position: absolute;
  top: 0;
  left: -2rem;
  display: inline-block;
  font-family: 'unifont';
  content: '\e806';
  font-size: 1.7rem;
}
.avs .set-period .line-2 {
  height: inherit;
  padding: 0.6rem;
  line-height: 1.7rem;
  font-size: 0.95rem;
}
/* .avs .set-period .line-2 > span {display: block;} */
.avs .set-period .line-2 span {margin-left: inherit;}
.avs .set-period .line-2 span::before {display: none;}
.avs .set-period .line-2 span .cont-tt {
  display: inline-block;
  /* width: 4.5rem; */
  height: 1.25rem;
  margin-right: 0.7rem;
  padding: 0 0.5rem;
  line-height: 1.25rem;
  font-family: 'Pretendard-Regular';
  font-size: 0.75rem;
  color: #1ac6ed;
  background-color: #fff;
  border-radius: 1.9rem;
  box-sizing: border-box;
}
.avs .set-period .line-2 span.avs-list-op .cont-tt {color: #22ab52;}
.avs .set-period + .my-summary {
  margin-top: 0;
  line-height: 2.8rem;
  font-size: 0.985rem;
  background-color: #fff;
}
.avs .set-period + .my-summary ul {padding: 0.6rem 1.9rem;}
.avs .set-period + .my-summary ul + ul {border-top: 1px dashed #eee;}
.avs .set-period + .my-summary li {
  position: relative;
  line-height: 2.7rem;
}
.avs .set-period + .my-summary li > * {vertical-align: middle;}
.avs .set-period + .my-summary li .badge-list {
  display: inline-block;
  height: 1.25rem;
  margin-right: 0.6rem;
  padding: 0 0.5rem;
  line-height: 1.25rem;
  font-size: 0.75rem;
  color: #1ac6ed;
  border: 1px solid #1ac6ed;
  border-radius: 1.9rem;
}
.avs .set-period + .my-summary li .badge-list.avs-add {
  color: #aaa;
  border: 1px solid #aaa;
}
.avs .set-period + .my-summary li .badge-list.avs-op {
  color: #22ab52;
  border: 1px solid #22ab52;
}
.avs .set-period + .my-summary .list-num {
  position: absolute;
  top: 0;
  right: 0;
  font-family: 'Pretendard-Medium';
}
.avs .set-period + .my-summary a.list-num {text-decoration: underline;}
.avs .set-period + .my-summary + .btn-area button {font-size: 1.05rem;}

/* 휴가 다중 신청 */
.avs .board-area .add-period-area {
  position: relative;
  /* margin: 0.125rem 0; */
  border-top: 0.125rem solid #e5e5e5;
  border-bottom: 0.125rem solid #e5e5e5;
  background-color: #fff;
}
.avs .board-area .add-period-area + .add-period-area {margin-top: -0.125rem;}
.avs .board-area .add-period-area dl {background-color: rgba(26,198,237,.05);}
.avs .board-area .add-period-area dl + dl {
  margin-top: 0;
  border-top: 1px solid #eee;
}
.avs .board-area .add-period-area .btn-area {
  display: flex;
  position: absolute;
  top: 0.9rem;
  right: 1.5rem;
  z-index: 10;
}
.avs .board-area .add-period-area .btn-area .btn-add,
.avs .board-area .add-period-area .btn-area .btn-del {
  display: inline-block;
}
.avs .board-area .add-period-area .btn-area .btn-add::before,
.avs .board-area .add-period-area .btn-area .btn-del::before {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  font-family: 'unifont';
  font-weight: normal;
  font-size: 1.85rem;
  color: #222;
}
.avs .board-area .add-period-area .btn-area .btn-add::before {content: '\e89e';}
.avs .board-area .add-period-area .btn-area .btn-del::before {
  content: '\e8a0';
  color: #ff253a;
}

/* 휴가 현황 */
.avs .board-top .set-area {
  overflow: hidden;
  height: 3.1rem;
  line-height: 3.1rem;
  border-bottom: 1px solid #eee;
  background-color: #fff;
}
.avs .board-top .set-area dl {
  float: left;
  width: 50%;
  margin: 0;
  padding: 0;
  background-color: inherit;
}
.avs .board-top .set-area dl dt,
.avs .board-top .set-area dl dd {
  width: 50%;
  padding: 0;
  text-align: center;
  border-left: 1px solid #eee;
  box-sizing: border-box;
}
.avs .board-top .set-area dl:first-child dt {border: 0;}
.avs .board-top .set-area dl dt {
  color: inherit;
  background-color: rgba(26,198,237,.05);
}
.avs .board-top .set-area .count-area dd {color: #777;}
.avs .board-top .set-area .count-area dd .point {
  font-family: 'Pretendard-Medium';
  color: #ff253a;
}
.avs .board-top .set-area dl dd .slt,
.avs .board-top .set-area dl dd .mobi-select {
  width: 100%;
  border: 0;
}

/* 캘린더 옵션 목록 */
.tab-result.board-list li {
  position: relative;
  min-height: 90px;
  margin-top: 12px;
  border-radius: 20px;
  box-sizing: border-box;
}
.tab-result.board-list li:first-child {margin-top: 0;}
.tab-result.board-list.cal-list {margin-top: 12px;}
.tab-result.board-list.cal-list:only-child {margin-top: 0;}
.tab-result.board-list.cal-list li {
  position: relative;
  padding: 20px 20px 20px 24px;
}

.avs .tab-result.board-list li {
  position: relative;
  margin-top: 0.6rem;
}
.avs .tab-result.board-list.cal-list li {
  position: relative;
  margin-top: 0.125rem;
  padding: 0.7rem 1.2rem;
}
.avs .tab-result.board-list li .total-date {display: inline-block;}
.avs .tab-result.board-list li .total-date span {font-family: 'Pretendard-Medium';}
.avs .tab-result.board-list li .total-date .badge {
  font-family: inherit;
  margin-left: 0.5rem;
  color: #607d8b;
}
.avs .tab-result.board-list li.cancel .total-date span {
  text-decoration: line-through;
  color: #999;
}
.avs .tab-result.board-list li.cancel .total-date .badge-cancel {
  margin-right: 0.5rem;
  font-family: inherit;
  text-decoration: none;
  color: #ff253a;
}
.avs .tab-result.board-list li .total-num {
  margin-left: 0.2rem;
  color: #ff253a;
}
.avs .tab-result.board-list li .avs-label {
  overflow: hidden;
  display: inline-block;
  width: 5.6rem;
  margin-right: 0.2rem;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  vertical-align: text-top;
}
.avs .tab-result.board-list.cal-list li .avs-label {width: 7rem;}
.avs .tab-result.board-list li .avs-label .avs-c-swatch {
  display: inline-block;
  margin: -0.2rem 0.5rem 0 0;
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 50%;
  background-color: #eee;
}
.avs .tab-result.board-list li .bott-area {margin-top: 1rem;}
.avs .tab-result.board-list li .bott-area.narrow {margin-top: 0.5rem;}
.avs .tab-result.board-list li .bott-area p {
  display: inline-block;
  font-size: 0.85rem;
  color: #999;
}
.avs .tab-result.board-list li .bott-area p + p {margin-left: 0.7rem;}
.avs .tab-result.board-list li .bott-area .dept-name,
.avs .tab-result.board-list li .bott-area .user-name {
  overflow: hidden;
  display: inline-block;
  width: 7rem;
  margin: 0;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.avs .tab-result.board-list li button {
  position: absolute;
  bottom: 1rem;
  right: 1.2rem;
  height: 1.6rem;
  padding: 0 0.5rem;
  line-height: 1.6rem;
  font-size: 0.8rem;
  border: 1px solid #999;
  border-radius: 1.6rem;
}
.avs .tab-result.board-list li button.left {
  left: 1.2rem;
  right: inherit;
}
.avs .tab-result.board-list.cal-list li button {bottom: 0.5rem;}
.avs .tab-result.board-list.cal-list li .bott-area.narrow button {bottom: 0.7rem;}

/* 직원별 현황 */
.avs .board-area .board-list.user-list li {padding: 0;}
.avs .board-area .board-list.user-list li > a {padding: 1.2rem;}
.avs .board-area .board-list.user-list li > a::after {display: none;}
.avs .board-area .board-list.user-list li .user-info {font-family: 'Pretendard-Medium';}
.avs .board-area .board-list.user-list li .period-area {
  overflow: hidden;
  width: inherit;
  max-width: inherit;
  height: inherit;
  margin: 0.7rem 0;
  padding: 0.2rem 0.6rem;
  line-height: inherit;
  font-size: 0.85rem;
  border: 0;
  background-color: rgba(26,198,237,.08);
}
.avs .board-area .board-list.user-list li .period-area .period {
  float: right;
  color: #555;
}
.avs .board-area .board-list.user-list li .bott-area {
  overflow: hidden;
  margin-top: 0.2rem;
}
.avs .board-area .board-list.user-list li .user-info + .bott-area {margin-top: 0.5rem;}
.avs .board-area .board-list.user-list li .bott-area p {
  position: relative;
  float: left;
  width: calc(50% - 1.2rem);
}
.avs .board-area .board-list.user-list li .bott-area p + p {margin-left: 2.4rem;}
.avs .board-area .board-list.user-list li .bott-area p span:first-child {
  position: relative;
  padding-left: 0.5rem;
  color: #999;
}
.avs .board-area .board-list.user-list li .bott-area p span:first-child::before {
  position: absolute;
  top: 0.6rem;
  left: 0;
  content: '';
  width: 0.2rem;
  height: 0.2rem;
  border-radius: 50%;
  background-color: #ddd;
}
.avs .board-area .board-list.user-list li .bott-area p .total-num {
  position: absolute;
  top: 0;
  right: 0;
  font-family: 'Pretendard-Medium';
  color: #ff253a;
}

/* 휴가 상세내역 */
.avs .user-detail .tbl-area {margin-top: 0;}
.avs .user-detail .tbl-area + .tbl-area {margin-top: 1.2rem;}
.avs .user-detail .tbl-area .tbl-tt {
  padding-bottom: 0.7rem;
  text-align: left;
  font-family: 'Pretendard-Medium';
}
.avs .user-detail .tbl-area .tbl-tt::before {
  display: inline-block;
  content: '';
  width: 0.6rem;
  height: 0.6rem;
  margin-right: 0.5rem;
  border: 1px solid #1ac6ed;
  border-radius: 50%;
  box-sizing: border-box;
}
.avs .user-detail .detail-list {
  margin-top: 0.7rem;
  padding-top: 0.5rem;
  border-top: 1px solid #f5f5f5;
}
.avs .user-detail .detail-list li {
  position: relative;
  margin-top: 0.2rem;
  padding: 0.7rem 1.2rem;
  background-color: rgba(26,198,237,.03);
}
.avs .user-detail .detail-list .total-date {
  display: inline-block;
  width: 100%;
}
.avs .user-detail .detail-list .total-date span {font-family: 'Pretendard-Medium';}
.avs .user-detail .detail-list .total-date .badge {
  font-family: inherit;
  margin-left: 0.5rem;
  color: #607d8b;
}
.avs .user-detail .detail-list .total-num {
  margin-left: 0.2rem;
  color: #ff253a;
}
.avs .user-detail .detail-list .avs-label {
  overflow: hidden;
  display: inline-block;
  width: 6.1rem;
  margin-right: 0.2rem;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  vertical-align: text-top;
}
.avs .user-detail .detail-list .avs-label {width: 7rem;}

/* 연차 사용 촉진 */
.avs .board-list.promote-list li {margin-top: 0.6rem;}
.avs .board-list.promote-list li p {line-height: 1.75rem;}
.avs .board-list.promote-list li p > span:first-child {
  display: inline-block;
  width: 6.1rem;
}
.avs .board-list.promote-list li p .op-tt {color: #999;}
.avs .board-list.promote-list li p .op-tt + span {
  display: inline-block;
  width: calc(100% - 6.1rem);
  vertical-align: top;
}
.avs .board-list.promote-list li .bott-area {
  position: relative;
  margin: 1rem -1.2rem -1.2rem;
  padding: 0.7rem 1.2rem;
  border-top: 1px solid #eee;
}
.avs .board-list.promote-list li .bott-area p {
  display: inline-block;
  font-size: 0.85rem;
  color: #999;
}
.avs .board-list.promote-list li .bott-area p .op-tt {width: 7.5rem;}
.avs .board-list.promote-list li .bott-area p .op-tt + span {color: #222;}
.avs .board-list.promote-list li .bott-area button {
  position: absolute;
  top: 0.7rem;
  right: 1.2rem;
  height: 1.75rem;
  padding: 0 0.6rem;
  line-height: 1.75rem;
  font-size: 0.85rem;
  border: 1px solid #999;
  border-radius: 1.75rem;
}

/* 연차 촉진 문서용 추가 */
.doc_html {
  width: 100%;
  background-color: #f8f8f8;
}
#__html {
  background-color: #ffffff;
  margin: 0;
  padding: 50px;
  width: 845px;
}
.add-template-in #__html {
  width: 100%;
  box-sizing: border-box;
}
#__html div {
  font-size: 12px;
  font-style: normal;
  letter-spacing: 0px;
  line-height: 150%;
}
#__html td {
  border: 0;
  font-size: 12px;
  font-style: normal;
  letter-spacing: 0px;
  color: black;
  line-height: 150%;
}
#__html .lineTable {
  border-collapse: collapse;
  border: 1px solid black !important;
}
#__html .lineTable td {border: 1px solid black;}
#__html .lineTable .noborder {border: 0px !important;}
.tbl-area .doc_html table:not(.in-editor table) {border-top: 0;}


/* --- 근태관리 --- */
/* 출/퇴근 */
.commute-time-area {padding-bottom: 3.2rem;}
.commute-time-area .map-area {
  width: 100%;
  height: 20rem;
  background-color: #000;
}
.commute-time-area .my-ip {background-color: #fff;}
.commute-time-area .my-ip p {
  height: 3.1rem;
  padding: 0 1.2rem;
  line-height: 3.1rem;
  text-align: center;
  background-color: #fff;
}
.commute-time-area .my-ip p span {font-family: 'Pretendard-Medium';}
.commute-time-area .my-ip p .op-ip {
  margin-left: 0.5rem;
  color: #ff6225;
}
.commute-time-area .place-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1.2rem;
}
.commute-time-area .place-list .li-tt p {
  margin: 0.5rem 0;
  font-family: 'Pretendard-Medium';
  font-size: 1rem;
}
.commute-time-area .place-list li:not(.li-tt) p {
  display: flex;
  position: relative;
  width: 100%;
  height: 3.1rem;
  padding: 0 1rem 0 2.5rem;
  vertical-align: top;
  line-height: 3.1rem;
  font-size: 0.875rem;
  color: #888;
  border: 1px solid rgba(228, 229, 234, .7);
  border-radius: 0.75rem;
  background-color: #fff;
  box-sizing: border-box;
}
.commute-time-area .place-list li:not(.li-tt).on p {
  color: #222;
  border-color: #ff6225;
  background-color: #ffefe9;
}
.commute-time-area .place-list li:not(.li-tt) p::before {
  position: absolute;
  top: calc(50% - 0.25rem);
  left: 1rem;
  width: 0.8rem;
  height: 0.525rem;
  content: '';
  background: url('../images/ico-check.svg') 0 0 no-repeat;
  background-size: 100%;
  opacity: .2;
}
.commute-time-area .place-list li:not(.li-tt).on p::before {opacity: 1;}
.commute-time-area .place-list li:not(.li-tt) p .li-op {
  display: inline-block;
  min-width: 2rem;
  font-family: 'Pretendard-Medium';
}
.commute-time-area .place-list li:not(.li-tt) .op-ip {margin-left: auto;}

/* 현황 */
.commute-time-area.detail-view .user-info {
  display: flex;
  height: 3.5rem;
  padding: 0 1.2rem;
  line-height: 3.5rem;
  background-color: #fff;
}
.commute-time-area.detail-view .user-info .user-name {
  overflow: hidden;
  max-width: calc(64% - 1.2rem);
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.commute-time-area.detail-view .user-info .user-name span {font-family: 'Pretendard-Medium';}
.commute-time-area.detail-view .user-info .user-name span + span {margin-left: 0.2rem;}
.commute-time-area.detail-view .user-info .user-group {
  overflow: hidden;
  max-width: calc(36% - 1.2rem);
  margin-left: auto;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #888;
}
.commute-time-area.detail-view .time-table {
  margin: 0.6rem 0;
  padding: 1.5rem 1.2rem;
  background-color: #fff;
  box-shadow: 0 1px 20px rgba(0,0,0,.05);
}
.commute-time-area.detail-view .time-table h3 {
  font-family: 'Pretendard-Medium';
  font-weight: normal;
  font-size: 0.95rem;
}
.commute-time-area.detail-view .time-table .tbl-tt {
  display: flex;
  align-items: baseline;
  margin-bottom: 0.75rem;
  font-size: 0.85rem;
}
.commute-time-area.detail-view .time-table .tbl-tt .schedule,
.commute-time-area.detail-view .time-table .tbl-tt .time-total {
  margin-left: auto;
}
.commute-time-area.detail-view .time-table .tbl-tt .schedule {color: #888;}
.commute-time-area.detail-view .time-table .tbl-tt .time-total {color: #ff6225;}
.commute-time-area.detail-view .time-table .tbl-tt .today {
  font-family: 'Pretendard-Medium';
  font-size: 0.95rem;
}
.commute-time-area.detail-view .time-table .tbl-tt p .op-tt {margin-right: 0.5rem;}
.commute-time-area.detail-view .time-table .tbl-area {
  overflow: hidden;
  margin: 0 -0.25rem;
  border: 1px solid #ddd;
  border-radius: 0.5rem;
}
.commute-time-area.detail-view .time-table table {border: 0;}
.commute-time-area.detail-view .time-table table th,
.commute-time-area.detail-view .time-table table td {
  padding: 0.65rem 0;
  text-align: center;
  font-size: 0.8rem;
  color: #222;
}
.commute-time-area.detail-view .time-table table tbody tr:last-child th,
.commute-time-area.detail-view .time-table table tbody tr:last-child td {
  border-bottom: 0;
}
.commute-time-area.detail-view .time-table table th {
  color: #777;
  background-color: rgba(10,42,90,.03);
}
/* .commute-time-area.detail-view .time-table.today table tr:first-child th {border-right: 0;} */
.commute-time-area.detail-view .time-table.this-week table thead th {border-bottom: 0;}
.commute-time-area.detail-view .time-table.today table th,
.commute-time-area.detail-view .time-table.today table td {
  border-right: 0;
}
.commute-time-area.detail-view .time-table.this-week table tbody td {
  padding: 0;
  font-size: 0.75rem;
}
.commute-time-area.detail-view .time-table.this-week table td .time-box {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  padding: 0.5rem 0;
}
.commute-time-area.detail-view .time-table.this-week table th.today {background-color: #ccf5ff;}
.commute-time-area.detail-view .time-table.this-week table td.today {background-color: #daf8ff;}
.commute-time-area.detail-view .time-table.this-week table th.day-off {background-color: #d1ffd2;}
.commute-time-area.detail-view .time-table.this-week table td.day-off {background-color: #ddffdd;}
.commute-time-area.detail-view .time-table.this-week table td .time-box span {
  display: block;
  height: 1rem;
}
.commute-time-area.detail-view .time-table.this-week table td.day-off .time-box span {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  height: 2.1rem;
  /* color: #bbb; */
}

.select-box .select-area .select-name {
  overflow: hidden;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: 'Pretendard-SemiBold';
  color: #0e5cdf;
}

.select-box .select-area i.unicon {
  position: relative;
  right: -0.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  padding: 0.15rem;
  font-size: 1rem;
  border-radius: 50%;
}

.select-box .select-area i.unicon::before {
  position: relative;
  top: -1px;
  font-weight: bold;
}
.calendar-item .reservation-info p {
  color: #888 !important;
}
.btn-area.float.bott-tab-bar {bottom: 86px;}
.btn-area.float {
  position: fixed;
  right: 12px;
  bottom: 86px;
}

/* --- 탭바 --- */
.tab-bar.bottom {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 66px;
  text-align: center;
  background-color: #fff;
  box-sizing: border-box;
  z-index: 15;
  box-shadow: 0 -1px 40px rgba(0,8,22,.16);
}
.tab-bar.bottom ul {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.tab-bar.bottom ul li {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20%;
  height: 100%;
}
.tab-bar.bottom ul li .btn-li {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: relative;
  width: 100%;
  height: 100%;
  font-family: 'Pretendard-Medium';
  font-size: 12px;
}
.tab-bar.bottom ul li .btn-li i {
  width: 74px;
  height: 30px;
  margin-bottom: 5px;
}
.tab-bar.bottom ul li .btn-li i {
  position: relative;
  width: 100%;
  height: 30px;
  margin-bottom: 2px;
}
.tab-bar.bottom ul li .btn-li i::before {
  display: block;
  width: 100%;
  height: 100%;
  content: '';
}
.tab-bar.bottom ul li .btn-company i::before {
  background: url('../images/ico-network.svg') 50% 50% no-repeat;
  background-size: auto 24px;
}
.tab-bar.bottom ul li .btn-my-home i::before {
  background: url('../images/ico-home.svg') 50% 50% no-repeat;
  background-size: auto 24px;
}
.tab-bar.bottom ul li .btn-service-all i::before {
  background: url('../images/ico-dots-color.svg') 50% 50% no-repeat;
  background-size: auto 24px;
}
.tab-bar.bottom ul li .btn-home.approval i::before {
  background: url('../images/ico-service-approval.svg') 50% 50% no-repeat;
  background-size: auto 25px;
}
.tab-bar.bottom ul li .btn-home.community i::before {
  background: url('../images/ico-service-community.svg') 50% 50% no-repeat;
  background-size: auto 22px;
}
.tab-bar.bottom ul li .btn-li.reservation i::before {
  background: url('../images/ico-reservation-calendar.svg')50% 50% no-repeat;
  background-size: auto 25px;
}
.tab-bar.bottom ul li .btn-menu-all i::before {
  background: url('../images/ico-menu.svg') 50% 50% no-repeat;
  background-size: auto 18px;
}
.tab-bar.bottom ul li .btn-noti.new i::after {
  position: absolute;
  top: 0;
  left: calc(50% + 2px);
  content: '';
  width: 6px;
  height: 6px;
  border: 2px solid #fff;
  border-radius: 50%;
  background-color: #FF6225;
}

/* BS 검색 옵션 */
.form-set .btn-category ul {
  display: flex;
  align-items: center;
}
.form-set .btn-category ul li {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  height: 40px;
  margin: 0;
  border: 1px solid rgba(0, 143, 213, 0.3);
  box-sizing: border-box;
}
.form-set .btn-category ul li.on {
  font-family: 'Pretendard-SemiBold';
  color: rgba(0, 143, 213, 1);
  background-color: rgba(0, 143, 213, 0.08);
}
.form-set .btn-category ul li:first-child {border-radius: 4px 0 0 4px;}
.form-set .btn-category ul li:last-child {border-radius: 0 4px 4px 0;}
.form-set .btn-category ul li:not(:last-child) {border-right: 0;}
.form-set .btn-category ul li + li {margin-left: -1px;}


/* 상단 필터 영역 2 */
.filter-area {margin-bottom: 12px;}
.filter-area .filter-bar .total-num {
  overflow: hidden;
  position: relative;
  padding: 12px 20px;
  line-height: 24px;
  font-family: 'Pretendard-SemiBold';
  border: 1px solid rgba(14, 92, 233, 0.25);
  border-radius: 20px;
  background-color: rgba(14, 92, 233, 0.08);
}
.filter-area .filter-bar .total-num::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
  background-color: #fff;
  z-index: -1;
}
.filter-area .filter-bar .total-num.btn-on-off::after {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: calc(50% - 10px);
  right: 20px;
  left: auto;
  width: 20px;
  height: 20px;
  content: '';
  background: url('../images/ico-arrow.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.filter-area .filter-bar.on .total-num.btn-on-off::after {transform: rotateZ(180deg);}
.filter-area .filter-bar .total-num span {
  margin-left: 4px;
  font-family: 'Pretendard-Bold';
  color: rgba(255, 98, 37, 1);
}
.filter-area .filter-bar .filter-box {
  display: none;
  position: relative;
  padding: 20px;
  border: 1px solid rgba(14, 92, 233, 0.25);
  border-radius: 20px;
  background-color: #fff;
}
.filter-area .filter-bar.on .filter-box {
  display: block;
  margin-top: 6px;
}
.filter-area .filter-bar .filter-box .search-box.flex-box {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.filter-area .filter-bar .filter-box .search-box + .search-box {margin-top: 8px;}
.filter-area .filter-bar .filter-box .slt-area,
.filter-area .filter-bar .filter-box .inp-area,
.filter-area .filter-bar .filter-box .inp-area input {
  width: 100%;
}
.filter-area .filter-bar .filter-box .inp-area.inp-date {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-sizing: border-box;
}
.filter-area .filter-bar .filter-box .inp-area.inp-date input {
  width: 105px;
  border: 0;
}
.filter-area .filter-bar .filter-box .inp-area .ico-uni-search {
  position: absolute;
  top: calc(50% - 14px);
  right: 6px;
  width: 28px;
  height: 28px;
}
.filter-area .filter-bar .filter-box .inp-area .ico-uni-search::before {
  display: flex;
  width: 100%;
  height: 100%;
  content: '';
  background: url('../images/ico-search.svg') 50% 50% no-repeat;
  background-size: 18px;
}
.filter-area .filter-bar .filter-box .search-box.flex-box .slt-area {flex: 0 0 130px;}
.filter-box .flex-box > .slt-area:first-child {
  width: 130px;
}
.filter-box .flex-box > .equipname-area {
  flex: 1 !important;
}
/* 자원예약 상세 */
.res-detail-container {
  padding: 12px 12px 0px 12px !important;
  background-color: #F1F1F5;
}
.res-detail-container .board-area dl {
  padding: 12px 20px;
  margin-top: 0;
}
.res-detail-container .board-area dl:first-child {
  border-radius: 12px 12px 0 0;
}
.res-detail-container .board-area dl:last-of-type {
  border-radius: 0 0 12px 12px;
  border-bottom: none;
}
.res-detail-container .btn-area.fixed {
  padding: 15px;
  background: #F1F1F5;
}

/* --- 커뮤니티 --- */
/* 열람자 팝업 */
.popup-viewer .md-text-center {display: none;}

/* 자원예약 추가 */
.commute .commute-c-swatch {
  display: inline-block;
  margin: -3px 8px 0 0;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background-color: #eee;
}
.select-box.commute {
  margin: 0 auto;
}
.select-box .select-area {
  display: flex;
  align-items: center;
  height: 36px;
  padding: 0 16px;
  border: 1px solid rgba(14, 92, 223, 1);
  border-radius: 12px;
  background-color: #fff;
}
.select-box .select-area i.unicon {
  position: relative;
  right: -6px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  padding: 3px;
  font-size: 16px;
  border-radius: 50%;
}
.select-box .select-area i.unicon::before {
  position: absolute;
  top: calc(50% - 5px);
  right: 4px;
  width: 12px;
  height: 12px;
  content: '';
  background: url('../images/btn-ico-arrow-bl.svg') 50% 50% no-repeat;
  background-size: auto 12px;
  transform: rotateZ(-90deg);
  transform-origin: center;
  pointer-events: none;
}
.resource-reservation .tab-result.board-list.cal-list .total-date {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 6px;
}
.resource-reservation .tab-result.board-list.cal-list .total-date *:last-child {color: #888;}
.resource-reservation-list .tab-result.board-list.cal-list li {
  min-height: inherit;
  line-height: 24px;
}
.board-area .resource-reservation-detail {
  overflow: hidden;
  border-radius: 20px;
}
.board-area .resource-reservation-detail dl {padding: 12px 20px;}

/* 자원예약 등록 */
body .red-star + * .mobi-select-inp-10,
body .red-star + * .mobi-select-inp-20,
body .red-star + * .inp-40 {
  border: 1px solid #ddd;
}
body .red-star + * .mobi-select-inp-20,
body .red-star + * .inp-40 {
  text-align: left;
}
body .mobi-select-inp-20 {width: auto;}
/* body .mbsc-control.mbsc-control-ev.mobi-select-inp-20 {text-align: left;} */
.form-set input {margin-top: 0;}
.form-set input[type=checkbox] {
  padding: 0;
  pointer-events: none;
}
.form-set .mobi-select-inp-10 {
  width: 20%;
  text-align: center;
}
.form-set .form-data .mobi-select.readonly-20px {
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* width: 20%; */
  width: 100%;
  height: 40px;
  padding: 0 10px;
  text-align: left;
  font-size: inherit;
  border: 0;
  border-radius: 4px;
  background-color: rgba(233,234,239,.2);
  box-sizing: border-box;
}
.community .form-set dd.row {align-items: center;}
.community .form-set .cal-area {
  position: relative;
}
.community .form-set .cal-area .inp-40 {
  width: 100%;
  padding: 0 40px 0 10px;
  text-align: left;
}
.community .form-set .reservation-btn-area {
  position: absolute;
  top: -42px;
  right: 0;
}
.community .form-set .reservation-btn-area .btn-slt-line2 {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 12px;
  line-height: 36px;
  font-family: "Pretendard-Bold";
  font-size: 15px;
  color: #333;
  border: 1px solid #333;
  border-radius: 12px;
  background-color: transparent;
  box-sizing: border-box;
}
.community .form-set .reservation-btn-area + span {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  padding: 12px;
  border-radius: 4px;
  background-color: rgba(233,234,239,.2);
  box-sizing: border-box;
}
.community .form-set .reservation-btn-area + span:empty {display: none;}

/* 사용자 검색 */
.form-slt-user .panel-list.slt-user {padding: 0 20px 16px;}
.form-slt-user .panel-list.slt-user dt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  width: 100%;
  height: inherit;
  min-height: 52px;
  padding: 0;
  line-height: 1;
  font-family: 'Pretendard-SemiBold';
  font-size: 17px;
  color: #222;
  background: transparent;
}
.form-slt-user .panel-list.slt-user dt .btn-area {
  position: inherit;
  top: inherit;
  right: inherit;
  margin-left: auto;
}
.form-slt-user .panel-list.slt-user dt .btn-area a {
  display: inline-block;
  width: 24px;
  height: 24px;
  margin: 0;
  line-height: 24px;
}
.form-slt-user .panel-list.slt-user dt .btn-area a i {
  display: inline-flex;
  width: 100%;
  height: 100%;
}
.form-slt-user .panel-list.slt-user dt .btn-area a i.ico-uni-popup {
  display: flex;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  font-size: 0;
  color: transparent;
  content: '';
  background: url('../images/ico-new-window.svg') 50% 50% no-repeat;
  background-size: 20px;
}
.form-slt-user .panel-list.slt-user dd {
  margin: 0;
  border-radius: 20px;
}
.form-slt-user .panel-list.slt-user dd .user-line {
  display: flex;
  align-items: center;
  height: 52px;
  padding: 0 12px 0 20px;
}
.form-slt-user .panel-list.slt-user dd .user-line + .user-line {border-top: 1px solid #eee;}
.form-slt-user .panel-list.slt-user dd .user-line > a {
  overflow: hidden;
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.form-slt-user .panel-list.slt-user dd .user-line a .team-name {color: inherit;}
.form-slt-user .panel-list.slt-user dd .user-line a span {margin: 0;}
.form-slt-user .panel-list.slt-user dd .user-line .btn-area {
  flex: none;
  position: inherit;
  top: inherit;
  right: inherit;
  margin-left: auto;
}
.form-slt-user .panel-list.slt-user dd .user-line .btn-area a {
  width: inherit;
  height: inherit;
  line-height: inherit;
  margin: 0;
  padding: 8px;
  opacity: .4;
}
.form-slt-user .panel-list.slt-user dd .user-line .btn-area i {
  display: flex;
  width: 16px;
  height: 16px;
}
.form-slt-user .panel-list.slt-user dd .user-line .btn-area i::before {
  display: flex;
  width: 100%;
  height: 100%;
  content: '';
}
.form-slt-user .panel-list.slt-user dd .user-line .btn-area i.ico-uni-arrow-up::before {
  background: url('../images/btn-ico-arrow.svg') 50% 50% no-repeat;
  background-size: 9px auto;
  transform: rotateZ(90deg);
}
.form-slt-user .panel-list.slt-user dd .user-line .btn-area i.ico-uni-arrow-down::before {
  background: url('../images/btn-ico-arrow.svg') calc(50% - 1px) 50% no-repeat;
  background-size: 9px auto;
  transform: rotateZ(-90deg);
}
.form-slt-user .panel-list.slt-user dd .user-line .btn-area i.ico-uni-close::before {
  background: url('../images/btn-ico-close.svg') 50% 50% no-repeat;
  background-size: 11px auto;
}
.form-set .btn-blue {
  background-color: rgba(14,92,233,1);
  border-radius: 12px;
  width: 73%;
  margin: 0;
}

/* ---  세금계산서 --- */
.receipt-in.receipt-etax {
  overflow: auto;
  padding: 0.5rem;
}
.receipt-etax .tbl-invoice {
  position: relative;
  width: 650px;
  margin: 0 auto;
  border: 2px solid #2f5496;
}
.receipt-etax .tbl-invoice::after {
  position: absolute;
  top: 0;
  right: calc(-0.5rem - 2px);
  width: 0.5rem;
  height: 100%;
  content: '';
}
.receipt-etax table {border: 0;}
.receipt-etax table,
.receipt-etax table tbody,
.receipt-etax table tr,
.receipt-etax table th,
.receipt-etax table td {margin: 0;padding: 0;}
.receipt-etax .tbl-invoice table th,
.receipt-etax .tbl-invoice table td {
  height: 21px;
  text-align: center;
  font-size: 12px;
  border-left: 1px solid #999;
  border-bottom: 1px solid #999;
  background-color: inherit;
}
.receipt-etax .tbl-invoice table th.txt-left,
.receipt-etax .tbl-invoice table td.txt-left {
  padding-left: 5px;
}
.receipt-etax .tbl-invoice table th.txt-right,
.receipt-etax .tbl-invoice table td.txt-right {
  padding-right: 5px;
}
.receipt-etax .tbl-invoice table th {border-right: 1px solid #999;}
.receipt-etax .tbl-invoice table th:last-child {border-right: 0;}
.receipt-etax .tbl-invoice .tbl-last tr td:last-child,
.receipt-etax .tbl-invoice .tbl-last tr:last-child td {border-bottom: 0;}
.receipt-etax .tbl-invoice table th.provider,
.receipt-etax .tbl-invoice table td.provider {
  height: 21px;
  font-size: 12px;
  border-left: 1px solid #f77573;
  border-bottom: 1px solid #f77573;
}
.receipt-etax .tbl-invoice table th.provider {
  color: #d04b50;
  border-right: 1px solid #f77573;
  background-color: #fff6f7;
}
.receipt-etax .tbl-invoice table th.provider.tt {background-color: #ffdbde;}
.receipt-etax .tbl-invoice table th.receiver,
.receipt-etax .tbl-invoice table td.receiver {
  height: 21px;
  font-size: 12px;
  border-left: 1px solid #5b9adf;
  border-bottom: 1px solid #5b9adf;
}
.receipt-etax .tbl-invoice table th.receiver {
  color: #4279AD;
  border-right: 1px solid #5b9adf;
  background-color: #f7f7ff;
}
.receipt-etax .tbl-invoice table th.receiver.tt {background-color: #c6dbf7;}
.receipt-etax .tbl-invoice .invoice-tt-area {background-color: #eee;}
.tbl-invoice .invoice-tt-area .invoice-tt {
  font-size: 24px;
  border-bottom: 1px solid #f77573;
}
.tbl-invoice .invoice-tt-area tr:last-child td {border-bottom: 1px solid #5b9adf;}


/* --- 하단 --- */
.footer {
  /* margin: 2.6rem 0; */
  padding: 1.4rem 0 2.6rem;
  text-align: center;
}
.home .footer {margin: 2.6rem 0;}

/* --- 효과 --- */
@-webkit-keyframes shake {
  0%, 100% {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  }
  10%, 30%, 50%, 70%, 90% {
  -webkit-transform: translateX(-10px);
  transform: translateX(-10px);
  }
  20%, 40%, 60%, 80% {
  -webkit-transform: translateX(10px);
  transform: translateX(10px);
  }
}
@keyframes shake {
  0%, 100% {
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  }
  10%, 30%, 50%, 70%, 90% {
  -webkit-transform: translateX(-10px);
  -ms-transform: translateX(-10px);
  transform: translateX(-10px);
  }
  20%, 40%, 60%, 80% {
  -webkit-transform: translateX(10px);
  -ms-transform: translateX(10px);
  transform: translateX(10px);
  }
}
.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}

@-webkit-keyframes opacity {
  0%, 100% {opacity: 0;}
  50% {opacity: 1;}
}
@keyframes opacity {
  0%, 100% {opacity: 0;}
  50% {opacity: 1;}
}
.opacity {
  -webkit-animation-name: opacity;
  animation-name: opacity;
}

@-webkit-keyframes animate-line {
  0%, 100% {top: 0%;}
  50% {top: 100%;}
}
@keyframes animate-line {
  0%, 100% {top: 0%;}
  50% {top: 100%;}
}
.animate-line {
  -webkit-animation-name: animate-line;
  animation-name: animate-line;
}


/* --- etc --- */
.block {display: block !important;}
.in-block {display: inline-block !important;}
.pre-wrap {white-space: pre-wrap !important;}
.none {display: none !important;}
.wid-100 {width: 100% !important;}
.wid-95 {width: 95% !important;}
.wid-90 {width: 90% !important;}
.wid-85 {width: 85% !important;}
.wid-80 {width: 80% !important;}
.wid-75 {width: 75% !important;}
.wid-70 {width: 70% !important;}
.wid-65 {width: 65% !important;}
.wid-60 {width: 60% !important;}
.wid-55 {width: 55% !important;}
.wid-50 {width: 50% !important;}
.wid-45 {width: 45% !important;}
.wid-40 {width: 40% !important;}
.wid-35 {width: 35% !important;}
.wid-32 {width: 32% !important;}
.wid-30 {width: 30% !important;}
.wid-25 {width: 25% !important;}
.wid-20 {width: 20% !important;}
.wid-15 {width: 15% !important;}
.wid-10 {width: 10% !important;}
.mt3 {margin-top: 0.7rem !important;}
.mt0 {margin-top: 0 !important;}
.align-l,
.txt-left {text-align: left !important;}
.align-r,
.txt-right {text-align: right !important;}
.align-c,
.txt-cen {text-align: center !important;}
.align-top {vertical-align: top !important;}
.m5 {margin: 1.2rem !important;}
.pb0 {padding-bottom: 0 !important;}
.pb20 {padding-bottom: 4.8rem !important;}
.pt6-pb6 {padding: 0.5rem 0 !important;}
.b {font-family: 'Pretendard-Medium' !important;}
.point {font-family: 'Pretendard-SemiBold' !important;}
.c-222 {color: #222 !important;}
.c-555 {color: #555 !important;}
.c-999 {color: #999 !important;}
.c-aaa {color: #aaa !important;}
.point-yel {color: #ffe400 !important;}
.uni-red {color: #ff253a !important;}
.uni-org1 {color: #e54160 !important;}
.uni-org2 {color: #ff8b00 !important;}
.uni-yel {color: #fed410 !important;}
.uni-grn {color: #51b300 !important;}
.uni-tur {color: #00c0b5 !important;}
.uni-sky {color: #1ac6ed !important;}
.uni-blu {color: #008fd5 !important;}
a.uni-red {color: #ff253a !important;}
.bg-uni-red {background-color: #ffe9eb !important;}
.bg-w {background-color: #fff !important;}
.bo0 {border: 0 !important;}
.red-star {position: relative;}
.red-star::after {
  position: relative;
  top: -2px;
  right: -4px;
  display: inline-block;
  content: '*';
  font-size: 18px;
  line-height: 0;
  color: #FF6225;
}
.tbl-area table th .red-star::after,
.tbl-area table td .red-star::after {
  line-height: inherit;
}
.cont-box-w {
  padding: 1.2rem;
  background-color: #fff;
}

/* 설명박스 추가 */
.noti-box {
  padding: 1rem 1.2rem;
  line-height: 1.5rem;
}
.pes .noti-box.c1 {background-color: rgba(0,143,213,.05);}
.approval .noti-box.c1 {background-color: rgba(255,139,0,.05);}
.econ .noti-box.c1 {background-color: rgba(229,65,96,.05);}
.pds .noti-box.c1 {background-color: rgba(81,179,0,.05);}
.tax .noti-box.c1,
.salescon .noti-box.c1 {background-color: rgba(0,192,181,.05);}
.avs .noti-box.c1 {background-color: rgba(26,198,237,.05);}
.community .noti-box.c1 {background-color: rgba(109,195,74,.05);}
.noti-box p {
  padding-left: 0.65rem;
  text-indent: -0.65rem;
}

/* 주의 메세지 추가 */
.list-message-red {
  padding: 0.8rem 1.4rem 0.8rem 1.9rem;
  line-height: 1.4rem;
  text-indent: -0.65rem;
  font-size: 0.85rem;
  /* color: #ff253a; */
  /* background-color: rgba(255,37,58,.05); */
  background-color: #ffe9eb;
  box-sizing: border-box;
}

/* 알림 영역 */
.set-noti-area {background-color: #fff;}
.set-noti {padding: 0.7rem 1.2rem;}
.pes .set-noti {background-color: rgba(0,143,213,.05);}
.approval .set-noti {background-color: rgba(255,139,0,.05);}
.econ .set-noti {background-color: rgba(229,65,96,.05);}
.pds .set-noti {background-color: rgba(81,179,0,.05);}
.tax .set-noti,
.salescon .set-noti {background-color: rgba(0,192,181,.05);}
.avs .set-noti {background-color: rgba(26,198,237,.05);}
.community .set-noti {background-color: rgba(109,195,74,.05);}

/* 안내 메세지 */
.status-message {
  height: 2.4rem;
  margin-bottom: 1.2rem;
  padding-left: 1.2rem;
  line-height: 2.4rem;
}
.status-message.save,
.status-message.pes {
  color: #008fd5;
  border: 1px solid rgba(0,143,213,.3);
  background-color: rgba(0,143,213,.05);
}
.status-message.approval {
  color: #ff8b00;
  border: 1px solid rgba(255,139,0,.3);
  background-color: rgba(255,139,0,.05);
}
.status-message.econ {
  color: #e54160;
  border: 1px solid rgba(229,65,96,.3);
  background-color: rgba(229,65,96,.05);
}
.status-message.pds {
  color: #51b300;
  border: 1px solid rgba(81,179,0,.3);
  background-color: rgba(81,179,0,.05);
}
.status-message.tax,
.status-message.salescon {
  color: #00c0b5;
  border: 1px solid rgba(0,192,181,.3);
  background-color: rgba(0,192,181,.05);
}
.status-message.avs {
  color: #1ac6ed;
  border: 1px solid rgba(26,198,237,.3);
  background-color: rgba(26,198,237,.05);
}
.status-message.community {
  color: #1ac6ed;
  border: 1px solid rgba(109,195,74,.3);
  background-color: rgba(109,195,74,.05);
}
.status-message.red {
  color: #ff253a;
  border: 1px solid rgba(255,37,58,.3);
  background-color: rgba(255,37,58,.05);
}

/* 부트스트랩 대용 안내 메세지 */
.alert-message {
  position: fixed;
  bottom: 0;
  left: 0;
  width: calc(100% - 4.8rem);
  margin: 1.2rem;
  padding: 0.7rem 1.2rem;
  z-index: 1200;
  border-radius: 0.2rem;
  background-color: #fff;
}
.alert-message.red {
  color: #ff253a;
  border: 1px solid #ff253a;
}
.alert-message.blu {
  color: #008fd5;
  border: 1px solid #008fd5;
}
.alert-message.org1 {
  color: #e54160;
  border: 1px solid #e54160;
}
.alert-message.org2 {
  color: #ff8b00;
  border: 1px solid #ff8b00;
}


/* --- loading --- */
.loading-area .overlay-bg,
.loading-area .loading-area-in {
  opacity: 1;
  z-index: 100000;
}
.loading-area .overlay-bg {
  background: rgba(255,255,255,.8);
  transition: 0s;
}
.loading-area.first-load .overlay-bg {background: rgba(255,255,255,1);}
.loading-area-in {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.loading-area.first-load .loading-area-in {top: -1.9rem;}
.loader {
	-webkit-filter: url("#mixing");
	filter: url("#mixing");
  position: absolute;
  top:0;
  left:0;
  bottom:0;
  right:0;
}
.loader .side-dot {
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	width: 3.5rem;
	height: 3.5rem;
	border-radius: 50%;
	background-color: #008fd5;
}
.loader .side-dot:nth-child(1) {
	animation: side-dot-left-anim cubic-bezier(0.770, 0.000, 0.175, 1.000) 2s infinite;
}
.loader .side-dot:nth-child(2) {
	animation: side-dot-right-anim cubic-bezier(0.770, 0.000, 0.175, 1.000) 2s infinite;
}
@keyframes side-dot-left-anim {
  0% {transform:scale(1.0) translate(0, 0);}
  33% {transform:scale(0.5, 0.5) translate(200%, 0);}
  66% {transform:scale(0.85) translate(0, 0);}
  100% {transform:scale(1.0) translate(0, 0);}
}
@keyframes side-dot-right-anim {
  0% {transform:scale(1.0) translate(0, 0);}
  33% {transform:scale(0.5, 0.5) translate(-200%, 0);}
  66% {transform:scale(0.85) translate(0, 0);}
  100% {transform:scale(1.0) translate(0, 0);}
}
@keyframes logo-symbol {
  0% {transform:scale(1.0); opacity:1;}
  20% {transform:scale(1.0); opacity:0;}
  40% {transform:scale(0.5); opacity:0;}
  66% {transform:scale(0.8); opacity:1;}
  100% {transform:scale(1.0); opacity:1;}
}
.loader .logo-symbol {
  position: absolute;
  height: 3.5rem;
  width: 3.5rem;
  left: calc(50% - 1.75rem);
  top: calc(50% - 1.75rem);
	animation: logo-symbol cubic-bezier(0.770, 0.000, 0.175, 1.000) 2s infinite;
  fill: #fff;
}
.loader .logo-symbol svg {
  height: 100%;
  width: 100%;
}
.loader .percent {
  position: absolute;
  left: 0;
  top: calc(50% + 2.6rem);
  width: 100%;
  text-align: center;
  letter-spacing: 0.02em;
  font-family: 'Pretendard-SemiBold';
  font-size: 1.2rem;
  color: #ff253a;
}
.loader .typo {
  position: absolute;
  left: 0;
  top: calc(50% + 2.6rem);
  width: 100%;
  text-align: center;
  letter-spacing: 0.02em;
  font-family: 'Pretendard-SemiBold';
  font-size: 1.05rem;
  color: #ff253a;
}
@keyframes type {
  from { width: 0; }
}
@-webkit-keyframes type {
  from { width: 0; }
}
@-moz-keyframes type {
  from { width: 0; }
}
.loader .typo span {
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  font-family: 'Pretendard-Medium';
}


/* --- toggle --- */
.toggle-area {
  position: absolute;
  top: 1rem;
  right: 2.6rem;
  width: 2.6rem;
}
.btn-toggle {
  overflow: hidden;
  display: inline-block;
  width: 45px;
  height: 20px;
  padding: 2px;
  vertical-align: middle;
  border-radius: 20px;
  background-color: #ccc;
  cursor: pointer;
}
.btn-toggle.checked {background-color: #2ecc71;}
.btn-toggle input {
  position: absolute;
  visibility: hidden;
}
.btn-toggle span {
  position: relative;
  left: 0;
  display: block;
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 1.2rem;
  background-color: #fff;
  -webkit-transition: left 200ms ease-out;
  -moz-transition: left 200ms ease-out;
  -o-transition: left 200ms ease-out;
  transition: left 200ms ease-out;
}
.btn-toggle :checked + span {left: calc(100% - 1.2rem);}


/* --- 스타일 보정 --- */
.m-main-container .home .home::before {display: none;}
.mbsc-scroller-wheel-line.mbsc-selected,
.mbsc-selected {
  color: rgba(14, 92, 233, 1) !important;
}
.mbsc-scroller-wheel-group-cont.mbsc-ios {
  background-color: #fff !important;
}
.mbsc-popup-content.mbsc-ios {
  background-color: #fff !important;
}
.mbsc-popup-buttons-bottom.mbsc-ios,
.mbsc-popup-header.mbsc-ios {
  display: flex !important;
  padding: 0rem 1.25rem !important;
  background-color: #fff !important;
  gap: 12px !important;
}
.mbsc-popup-buttons-bottom .mbsc-ios.mbsc-button,
.mbsc-popup-header .mbsc-ios.mbsc-button {
  height: 3rem !important;
  margin: 0 !important;
  border-width: 1px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
}
.mbsc-scroller-wheel-overlay-bottom.mbsc-ios,
.mbsc-scroller-wheel-overlay-top.mbsc-ios {
  background: linear-gradient(to bottom, rgba(255,255,255,0.9), rgba(255,255,255,0)) !important;
}
.mbsc-scroller-wheel-overlay-bottom.mbsc-ios {
  background: linear-gradient(to top, rgba(255,255,255,0.9), rgba(255,255,255,0)) !important;
}
.mbsc-scroller-wheel-line.mbsc-ios {
  background-color: rgba(135, 206, 250, 0.1) !important;
  border-color: rgba(135, 206, 250, 0.3) !important;
}
.mbsc-popup-buttons-bottom.mbsc-ios {
  display: flex !important;
  flex-direction: row-reverse !important;
  background-color: #fff !important;
  border-top: 1px solid #f1f1f5 !important;
}
/* 모비스크롤 모달 스타일 변경 */
.dw-modal .dwwr {
  overflow: auto;
  padding: 1.4rem 1.2rem 1.2rem;
  border: 0.2rem solid #222;
  box-sizing: border-box;
}
.mbsc-wdg.dw-modal .mbsc-wdg-c {
  padding: 0 0 1.4rem 0;
  text-align: center;
  font-family: 'Pretendard-Medium';
  font-size: 1.2rem;
}
.dw-modal .md-dialog {width: inherit !important;}
.dw-modal h3.md-text-center {
  margin: 0 !important;
  padding-bottom: 1rem;
  font-family: 'Pretendard-Medium';
  font-size: 1.2rem !important;
}
.dw-modal p.md-text-center {
  font-size: 0.95rem;
  word-break: break-all;
}
.mbsc-mobiscroll.dw-modal .dwb {
  height: inherit;
  padding: 0.5rem 1.2rem;
  line-height: inherit;
  font-size: 0.95rem;
  color: #555;
  border: 1px solid #555;
}
.mbsc-mobiscroll.dw-modal .dwbc {text-align: center;}
.mbsc-mobiscroll.dw-modal .dwbw {
  display: inline-block;
  float: none;
}
.mbsc-mobiscroll.dw-modal .dwbw + .dwbw {margin-left: 0.5rem;}

/* 모비스크롤 버튼 스타일 추가 */
.mbsc-wdg .mbsc-w-p .unicloud_sheet_popup.img-slt-btn {margin-bottom: -1.4rem;}
.mbsc-wdg .mbsc-w-p .unicloud_sheet_popup.img-slt-btn .mbsc-form {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
.img-slt-btn .mbsc-unico .mbsc-btn-flat {
  width: calc(50% - 0.5rem);
  margin: 0;
  padding-top: 3.8rem;
  font-family: 'Pretendard-Medium';
  color: #222;
  border: 3px solid #e5e5e5;
  border-radius: 0.2rem;
  box-sizing: border-box;
}
.img-slt-btn .mbsc-unico .mbsc-btn-flat::before {
  position: absolute;
  top: 0.5rem;
  left: 0;
  width: 100%;
  font-family: 'unifont';
  color: #008fd5;
}
.img-slt-btn .mbsc-unico .mbsc-btn-flat::before {
  font-size: 3rem;
  content: '\e89a';
}
.img-slt-btn .mbsc-unico .mbsc-btn-flat + .mbsc-btn-flat::before {
  top: 0.8rem;
  font-size: 2.6rem;
  content: '\e849';
}

/* 날짜/시간 선택 추가 */
.m-avs-user-promote .mbsc-mobiscroll.unicloud-promote-popup .dwwr {
  /*width: calc(100% - 1rem);*/
  background-color: #fff;
}
.m-avs-user-promote .mbsc-mobiscroll.unicloud-promote-popup .mbsc-wdg-c {padding: 0;}
.m-avs-user-promote .mbsc-mobiscroll.unicloud-promote-popup h3.md-text-center {
  padding-bottom: 0.7rem;
  text-align: center;
  font-family: 'Pretendard-Medium';
  font-size: 1.2rem;
  border-bottom: 1px solid #222;
}
.m-avs-user-promote .mbsc-mobiscroll.unicloud-promote-popup .board-area {
  margin: 1rem 0 2rem;
  padding: 0;
}
.m-avs-user-promote .mbsc-mobiscroll.unicloud-promote-popup .board-area dl {
  padding: 0.5rem 0;
  text-align: left;
  font-size: 0.95rem;
}
.m-avs-user-promote .mbsc-mobiscroll.unicloud-promote-popup .board-area dl dt {
  width: 100%;
  margin-bottom: 0.5rem;
  color: #1ac6ed;
  box-sizing: border-box;
}
.m-avs-user-promote .mbsc-mobiscroll.unicloud-promote-popup .board-area dl dd {
  width: 100%;
  box-sizing: border-box;
}
.m-avs-user-promote .mbsc-mobiscroll #unicloud_promote_popup .dw-inline .dw {width: 100%;}
.m-avs-user-promote .mbsc-mobiscroll #unicloud_promote_popup .dw-persp .dwwr {
  width: 100%;
  min-width: inherit;
  padding: 0.5em;
}
.m-avs-user-promote .mbsc-mobiscroll #unicloud_promote_popup .dw-persp .dwhl {width: 100%;}
.m-avs-user-promote .mbsc-mobiscroll #unicloud_promote_popup .dw-persp .dwwc {max-width: inherit !important;}
.m-avs-user-promote .mbsc-mobiscroll #unicloud_promote_popup .dwfl {
  min-width: 33.333333% !important;
  padding: 0 0.25em;
}
.m-avs-user-promote .mbsc-mobiscroll #unicloud_promote_popup .dw-li {font-size: 1rem;}
.m-avs-user-promote .mbsc-unico .dwwol {border-color: #1ac6ed;}

.more-area {
  position: relative;
  overflow: hidden;
  text-align: center;
  margin-bottom: 80px;
}

.dashboard-area .btn-area.link .btn-link {
  height: auto;
  min-height: 60px;
  padding: 12px 20px 12px 80px;
  font-size: 16px;
  background-color: #fff;
  color: #333;
  box-shadow: 0 1px 20px rgba(0, 0, 0, .08);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  text-decoration: none;
  margin: 0 0.5rem 0.5rem 0.5rem;
  border-radius: 1.25rem;
}

.dashboard-area .btn-area.link .btn-link.network::before {
  display: inline-block;
  position: absolute;
  top: auto;
  left: 30px;
  width: 38px;
  height: 33px;
  content: '';
  background: url(../images/ico-network.svg) 0 0 no-repeat;
}

.dashboard-area .btn-area.link .btn-link.reservation-calendar::before {
  display: inline-block;
  position: absolute;
  top: auto;
  left: 30px;
  width: 38px;
  height: 33px;
  content: '';
  background: url(../images/ico-reservation-calendar.svg) 0 0 no-repeat;
}

.calendar-item .commute-c-swatch {
  display: inline-block;
  margin: -0.2rem 0.5rem 0 0;
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 50%;
  background-color: #eee;
}

.calendar-item .reservation-info {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.calendar-item. reservation-user {
  text-align: right;
  white-space: nowrap;
}

/* --- 미디어쿼리 --- */
@media (max-width: 345px) {
  .uni-board .board-detail li.detail-tt {padding-bottom: 52px;}
  .uni-board .board-detail li.detail-tt .write-date {margin-top: 0;}
}
