@import url('https://font.elice.io/css?family=Elice+DX+Neolli');

:root {

	--text: #465a77;

  --font-family: "Pretendard", sans-serif;
  --second-family: "Recipekorea", sans-serif;
  --third-family: "Inter", "Noto Sans KR", sans-serif;
  --font3: "GmarketSans", sans-serif;

  --box-shadow : 0 0.25rem 1.375rem 0 rgba(98, 161, 197, 0.25);
}


/* common */
* { margin: 0; padding: 0; outline: none; box-sizing: border-box;}
body {margin: 0; padding: 0; -ms-overflow-style: none; scrollbar-width: none; }
body::-webkit-scrollbar {display: none;}
html { scroll-behavior: smooth; }
html, body {font: 400 16px/1.3 'Pretendard', 'Inter', sans-serif;  color: #000000; width: 100%; position: relative;}
ul, li {list-style: none;}
a {text-decoration: none; color: inherit; -webkit-tap-highlight-color: transparent;}
img {max-width: 100%;}
button { font-family: inherit; border: none; background-color: transparent; outline: 0;  cursor: pointer; }
input,textarea,button,select {font-family: inherit;}
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after,
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {display: none;}

body.hidden { overflow: hidden;}
body.hidden2 { overflow: hidden;}
body::before { content: "";  position: fixed;  left: 0;  top: 0;  width: 100%;  height: 100%; background-color: rgba(0,0,0,0.25); z-index: 99;  transition: all 0.4s ease; opacity: 0; pointer-events: none;cursor: pointer;}
body.hidden::before { opacity: 1;  pointer-events: auto;}

.pc {display: block;}
.tablet {display: none !important;}
.mobile { display: none !important;}
.sound_only {display: none !important;}


/* layout */  
.wrap { width: 100%; position: relative; background: #f4fbff;}
.container { display: flex; gap: 2.625rem; padding: 3.5rem 1.875rem 10rem;}
  
  
/* left menu */
.left_menu { width: 260px; display: flex; flex-direction: column;}
.left_menu .logobox { width: 90%; max-width: 246px; margin: 0 auto; display: flex; align-items: center; justify-content: center;}
.left_menu .memberbox { background:#115ca1; border-radius: 1rem; width: 100%; padding: 1.125rem 0.875rem 0.875rem; margin-bottom: 2.5rem; margin-top: 5.883rem;}
.left_menu .memberbox .infoitem { display: flex; flex-direction: column;  gap: 0.313rem;}
.left_menu .memberbox .infoitem + .infoitem { margin-top: 1.5rem;}
.left_menu .memberbox .infoitem .tit { font-weight: 500; font-size: 0.875rem; color: #fff;}
.left_menu .memberbox .infoitem .tit .link { display: flex; align-items: center; gap: 0.375rem;}
.left_menu .memberbox .infoitem .tit .icon { font-size: 0.9em;}
.left_menu .memberbox .infoitem .descbox { position: relative; display: flex;align-items: center; flex-wrap: wrap; gap: 0 0.5rem;}
.left_menu .memberbox .infoitem .descbox .desc_txt { font-family: var(--font-family); font-weight: 300; font-size: 1.125rem; line-height: 130%; color: #fff;}
.left_menu .memberbox .infoitem .descbox .desc_txt .bold { font-size: 1.25rem; font-weight: 700;}
.left_menu .memberbox .infoitem .descbox .desc_txt .mypoint { font-size: 1.375rem;}
.left_menu .memberbox .infoitem .descbox .logout_btn { font-family: var(--font-family); font-weight: 400; font-size: 0.875rem; text-decoration: underline;text-underline-offset: 2px; color: #fff;}
.left_menu .memberbox .member_btn { background: #237bff; border-radius: 0.75rem; width: 100%; height: 3rem; display: flex; align-items: center; justify-content: center; margin-top: 0.938rem; font-family: var(--font-family); font-weight: 700; font-size: 1.125rem; color: #fff;}
.left_menu .memberbox.ver2 { background: #fff; box-shadow: 0 0.25rem 0.563rem 0 rgba(98, 161, 197, 0.25); padding: 1.438rem 0.625rem 0.813rem; margin-top: 1.883rem;}
.left_menu .memberbox .infoitem .msg { font-weight: 400; font-size: 1.125rem; text-align: center; color: var(--text);}
.left_menu .memberbox .infoitem .msg .bold { font-weight: 700;}
.left_menu .memberbox.ver2 .member_btn {margin-top: 1.25rem;}
.left_menu .navbox { display: flex; flex-direction: column; gap: 2.5rem;}
.left_menu .navbox > .navitem { position: relative; width: 100%;}
.left_menu .navbox > .navitem .nav_tit { font-weight: 500; font-size: 1rem; color: #465a7769; padding: 0 1rem; margin-bottom: 0.875rem;}
.left_menu .navbox > .navitem .navlist { display: flex; flex-direction: column; gap: 0;}
.left_menu .navbox > .navitem .navlist > li { position: relative; width: 100%;}
.left_menu .navbox > .navitem .navlist > li .navlink { width: 100%; display: flex; align-items: center; gap: 0.875rem; border-radius: 0.75rem; padding: 0.75rem 1rem;  transition: all 0.4s ease;}
.left_menu .navbox > .navitem .navlist > li .navlink .icon { width: 24px; aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center;}
.left_menu .navbox > .navitem .navlist > li .navlink .icon svg {max-width: 100%; aspect-ratio: 1 / 1; transition: all 0.4s ease;}
.left_menu .navbox > .navitem .navlist > li .navlink .icon svg path.color { transition: all 0.4s ease;}
.left_menu .navbox > .navitem .navlist > li .navlink .icon svg path.color2 { transition: all 0.4s ease;}
.left_menu .navbox > .navitem .navlist > li .navlink .icon svg path:not(.color) {fill: transparent;}
.left_menu .navbox > .navitem .navlist > li .navlink .txt { font-weight: 600; font-size: 1.252rem; color: rgba(70, 90, 119, 0.7); transition: all 0.4s ease;}

.left_menu .navbox > .navitem .navlist > li.point .navlink .icon svg path.color { fill: #f4754d;}
.left_menu .navbox > .navitem .navlist > li.point .navlink .icon svg path.color2 { stroke: #f4754d;}
.left_menu .navbox > .navitem .navlist > li.point .navlink .txt { color: #f4754d;}

.left_menu .navbox > .navitem .navlist > li:hover .navlink .icon svg path.color { fill: #000;}
.left_menu .navbox > .navitem .navlist > li:hover .navlink .icon svg path.color2 { stroke: #000;}
.left_menu .navbox > .navitem .navlist > li:hover .navlink .txt { color: #000;}

.left_menu .navbox > .navitem .navlist > li.active .navlink { background: rgba(53, 155, 250, 0.91);}
.left_menu .navbox > .navitem .navlist > li.active .navlink .icon svg path.color {fill: #fff;}
.left_menu .navbox > .navitem .navlist > li.active .navlink .icon svg path.color2 {stroke: #fff;}
.left_menu .navbox > .navitem .navlist > li.active .navlink .txt { color: #fff;}

.header {display: none;}


/* page content */
.page_content { position: relative; width: calc(100% - 260px - 2.625rem); }
.page_content .page_inner {position: relative;  background: #fff; box-shadow: 0 0.25rem 1.375rem rgba(98, 161, 197, 0.25); border-radius: 1rem; min-height: 90vh;}
.common_wrap .page_content .page_inner{padding: 1.875rem ;}
.page_content .page_inner.no_bg {background-color: transparent; box-shadow: none;}
.page_content .page_inner .sample {width: 100%;}


/* footer */
.footer { background: #d4e5ef;}
.footer .f_inner { display: flex; align-items: center; justify-content: space-between; gap:1.25rem; padding: 1.625rem 0; width: 90%; max-width: 1400px; margin: 0 auto;}
.footer .f_logo { width: 90%; max-width: 246px; display: flex; align-items: center; justify-content: center;}
.footer .f_info { flex:1; font-family: var(--third-family); font-weight: 600; font-size: 0.75rem; line-height: 1.3; letter-spacing: -0.02em; text-align: center; color: #6f7c90;}
.footer .f_info .bar{display: inline-block; vertical-align: middle;}
.footer .f_side { display: flex; flex-direction: column; align-items: center; gap: 0.438rem;}
.footer .f_side .f_nav { display: flex; align-items: center; justify-content: center; gap: 0.688rem;}
.footer .f_side .f_nav .link { font-family: var(--third-family); font-weight: 800; font-size: 0.875rem; line-height: 1.3; letter-spacing: -0.02em; color: #6f7c90;}
.footer .f_side .f_nav .bar { font-family: var(--third-family); font-weight: 400; font-size: 0.75rem; line-height: 1.3; letter-spacing: -0.02em; color: #6f7c90;}
.footer .f_side .f_copy { font-family: var(--third-family); font-weight: 600; font-size: 0.75rem; line-height: 1.3; letter-spacing: -0.02em; text-align: center; color: #7c899c;}

.bottom_navbox {display: none;}

.channel_btn { position: fixed; right: 1rem; bottom: 0; z-index: 100; cursor: pointer; display: flex; align-items: center; justify-content: center; width: 10.75rem;}


/* page common */
#container_title {display: none;}

.input_wrap {position: relative;}
.formbox { border-radius: 1.25rem; background: #fff; box-shadow: var(--box-shadow); padding: 2.125rem 1.875rem 1.875rem; display: flex; flex-direction: column; gap: 1.875rem;}
.form_titbox { display: flex; align-items: center; gap: 0.375rem;}
.form_titbox .tit { font-weight: 700; font-size: 1.25rem; color: var(--text);}
.form_titbox .desc { font-weight: 700; font-size: 0.875rem; color: rgba(70, 90, 119, 0.49);}
.inputbox { display: flex; flex-direction: column; }
.inputbox .input_label { display: block; padding: 0 0.75rem; font-weight: 700; font-size: 1rem; color: var(--text); margin-bottom: 0.625rem;}
.inputbox .input_label.big { font-size: 1.25rem;}
.inputbox .input_label.tooltip_flex { display: flex;}
.inputbox .input_label .required_txt { font-weight: 700; font-size: 0.875rem; color: rgba(255, 0, 0, 0.49);}
.inputbox .input_label.spaceBetween { display: flex; justify-content: space-between; align-items: center;}
.inputbox .input_label.spaceBetween .rightxt { font-weight: 500; font-size: 1rem; color: var(--text); flex: 1; text-align: right;}
.inputbox .input_text { display: block; font-weight: 600;  font-size: 0.938rem;  line-height: 1.3; color: #333333; padding: 0.625rem 0.75rem; background: #e0f0ff; border-radius: 0.5rem; width: 100%; height: 40px; border: 1px solid transparent; box-shadow: none; background-image: none !important;  transition: all 0.4s ease;}
.inputbox textarea.input_text { height: 162px;}
.inputbox textarea.input_text.small {height: 90px;}
.inputbox .input_text::placeholder {color: #91b0cd;}
.inputbox .input_text:focus { border-color: #558ab7  !important; box-shadow: none;}
.inputbox .input_text:disabled { background: #f2f2f2; color: #9e9e9e;}
.input_desc { font-weight: 500; font-size: 0.813rem; color: rgba(70, 90, 119, 0.72); margin-top: 0.625rem;}

.input_check { appearance: none; position: relative; width: 20px; aspect-ratio: 1 / 1; background: #fff; border: 1px solid rgba(0, 0, 0, 0.3); border-radius: 0.25rem; transition: all 0.4s ease; cursor: pointer;}
.input_check::before { content: ""; background: url(../img/icon_chk.png) no-repeat center / contain; width: 10px; aspect-ratio: 1 / 1; position: absolute; left: 50%;  top: 50%; transform: translate(-50%, -50%); transition: all 0.4s ease; opacity: 0;}
.input_check:hover {border-color: #2685f5;}
.input_check:active {border-color: #2685f5; background: #6bc1ff;}
.input_check:checked {border-color: #2685f5; background: #6bc1ff;}
.input_check:checked::before {opacity: 1;}
.input_check:active:checked::before {background-image: url(../img/icon_chk2.png) }

.select_txt { border: 2px solid var(--text); border-radius: 0.438rem; padding: 0 1.25rem; width: 100%; height: 40px; font-weight: 700; font-size: 0.938rem; line-height: 1.3; color: var(--text); appearance: none;  background: url(../img/icon_select.png) no-repeat right 1.25rem center / 1.125rem auto #fff; cursor: pointer;}
.select_txt:disabled { background-color: #f2f2f2; border-color: #9e9e9e; color: #9e9e9e; opacity: 1;}

.selectbox { display: flex; gap: 2.5rem;}
.selectbox .selectitem { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem;}
.selectbox .selectitem .input_radio { position: relative; appearance: none; width: 16px; aspect-ratio: 1 / 1; border: 1px solid #e9e9e9; border-radius: 50%; background: #fff; transition: all 0.4s ease; cursor: pointer;}
.selectbox .selectitem:hover .input_radio {border-color: #69a5ff;}
.selectbox .selectitem .input_radio:focus { background: #237bff; border-color: #d0e6ff;}
.selectbox .selectitem .input_radio:checked,
.selectbox .selectitem:hover .input_radio:checked {background: #237bff; border-color: #237bff;}
.selectbox .selectitem .input_radio:checked:focus { background: #276dd8;  border-color: #276dd8;}
.selectbox .selectitem .input_radio::before { content: ""; position: absolute; left: 50%; top: 50%; width: 6px; aspect-ratio: 1 / 1; transform: translate(-50%, -50%); background: #fff; border-radius: 50%; opacity: 0; transition: all 0.4s ease;}
.selectbox .selectitem .input_radio:checked::before {opacity: 1;}
.selectbox .selectitem .label_radio { font-weight: 700; font-size: 0.938rem;  line-height: 130%; text-align: center; color: #828ea0; transition: all 0.4s ease; cursor: pointer;}
.selectbox .selectitem:hover .label_radio { color: var(--text);}
.selectbox .selectitem .input_radio:checked + .label_radio {color: var(--text);}
.selectbox .selectitem:hover .input_radio:checked + .label_radio {color: #66768d;}
.selectbox .selectitem .input_radio:checked:focus + .label_radio {color: #919dae;}

.file_btn { position: relative; display: flex;}
.file_btn .input_file { display: none;}
.file_btn .label_file { font-weight: 800; font-size: 0.875rem; line-height: 1; text-align: center; color: #fff; background: #237bff; border-radius: 0.5rem; padding: 0.375rem 1.325rem; height: 30px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer;}
.file_imgbox { position: relative; display: flex; gap: 0.75rem; overflow: auto; padding: 0.25rem 0.25rem 1.25rem;}
.file_imgbox::-webkit-scrollbar { height: 6px; cursor: pointer; }
.file_imgbox::-webkit-scrollbar-thumb { background: #9fd1ff; border-radius: 3px;}
.file_imgbox::-webkit-scrollbar-track { background: #fff;}
.file_imgbox .imgitem { position: relative; box-shadow: 0 0.125rem 0.375rem 0 rgba(33, 108, 150, 0.25); background: #fff; border-radius: 0.438rem; width: 144px; min-width: 144px; height: 140px; overflow: hidden;}
.file_imgbox .imgitem .btn_del { background: url(../img/icon_file_del.png) no-repeat center / contain; width: 1.319rem; aspect-ratio: 1 / 1; position: absolute; top: 8px; right: 10px; cursor: pointer;}

.form_btnbox { display: flex;justify-content: center;align-items: center; gap: 0.625rem; margin-top: 1.875rem; padding: 0 2.25rem;}
.form_btnbox .btn{box-shadow: 0 0.25rem 0.75rem 0 rgba(33, 108, 150, 0.2); border-radius: 1.25rem; width: 50%; height: 48px; display: flex; align-items: center; justify-content: center; border: none; font-weight: 700; font-size: 1.125rem; line-height: 1.3; text-align: center; cursor: pointer;}
.form_btnbox .btn.btn_typeA{ background: #237bff;color: #fff;}
.form_btnbox .btn.btn_typeB{ background: #fff; color: #237bff;}

.typebox { display: flex; flex-wrap: wrap; gap: 0.75rem;}
.typebox .typeitem { position: relative; border-radius: 0.5rem; width: calc((100% - 0.75rem) / 2); min-height: 90px; box-shadow: 0 2px 6px 0 rgba(33, 108, 150, 0.25);  background: #fff; cursor: pointer;}
.typebox .typeitem .input_radio { appearance: none; width: 16px; aspect-ratio: 1 / 1; display: block; border-radius: 100%; background: #fff; box-shadow: inset 0 1px 0.375rem 0 rgba(100, 171, 255, 0.25); cursor: pointer; position: absolute; left: 0.75rem; top: 0.625rem; transition: all 0.4s ease;}
.typebox .typeitem .input_radio::before { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 8px; aspect-ratio: 1 / 1; border-radius: 50%; background: #b6d1fa; transition: all 0.4s ease;}
.typebox .typeitem .input_radio:checked {background: #237bff;}
.typebox .typeitem .input_radio:checked::before{background: #fff;}
.typebox .typeitem .label_radio { display: flex; flex-direction: column; cursor: pointer; padding: 0.5rem 0.75rem 0.938rem; padding-left: calc(16px + 1.55rem);}
.typebox .typeitem .label_radio .tit {font-weight: 800; font-size: 1rem; color: var(--text);margin-bottom: 0.5rem;}
.typebox .typeitem .label_radio .desc {font-weight: 400;font-size: 0.875rem; color: var(--text); word-break: keep-all;}
.typebox .typeitem .label_radio .desc .bold { font-weight: 700;}

.guide_box { background: #ecf1f4; border-radius: 0.5rem; width: 100%; padding: 0.875rem 0.938rem;}
.guide_box .guide_tit { font-weight: 700; font-size: 0.813rem; color: var(--text);  margin-bottom: 0.438rem;}
.guide_box .guide_list { display: flex; flex-direction: column; gap: 0.125rem;}
.guide_box .guide_list > .txt { font-weight: 400; font-size: 0.813rem; color: var(--text); position: relative; padding-left: 1em;}
.guide_box .guide_list > .txt::before { content: "•"; position: absolute; left: 0; top: 0;}

.tooltip_flex { position: relative; display: flex; align-items: center; gap: 0.375rem;}
.tooltip_box { position: relative;}
.tooltip_box .tooltip_btn { background: url(../img/icon_tooltip.png) no-repeat center / contain; width: 1.125rem; aspect-ratio: 1 / 1; cursor: pointer; transition: all 0.4s;}
.tooltip_box.on .tooltip_btn { background-image: url(../img/icon_tooltip_on.png);}
.tooltip_box .tooltip_cont { position: absolute; left: calc(100% + 0.75rem); top: 50%; transform: translateY(-50%); min-width: 135px; max-width:400px; font-size: 0.75rem; font-weight: 700; line-height: 1.3; color: #fff; padding: 0.625rem; border-radius: 0.25rem; box-shadow: var(--box-shadow); background: #456596; pointer-events: none; opacity: 0;; transition: all 0.4s;}
.tooltip_box.on .tooltip_cont { pointer-events: auto; opacity: 1;}
.tooltip_box .tooltip_cont::before { content: ""; background: url(../img/tooltip_bg.png) no-repeat left center / cover; position: absolute; left: -0.5rem; top: 0; width: 0.75rem; height: 100%;}
.tooltip_box .tooltip_cont .txt { white-space: nowrap;}

.uncompleted_box { width: fit-content; max-width: 100%; border-radius: 1.25rem; background: #fff; box-shadow: var(--box-shadow); padding: 1.375rem 1.125rem 1.125rem;}
.uncompleted_box .uncompleted_tit {font-weight: 700; font-size: 1.625rem; color: var(--text); margin-bottom: 1.25rem;}
.uncompleted_orders { display: flex; flex-wrap: wrap; gap: 1.063rem;}
.uncompleted_orders > .item { width: 208px; border-radius: 0.5rem; background: #fff; padding: 0.875rem 1rem; box-shadow: 0 0.125rem 0.375rem 0 rgba(33, 108, 150, 0.25);}
.uncompleted_orders > .item .status { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.375rem;}
.uncompleted_orders > .item .status .txt { flex: 1; font-weight: 700; font-size: 1rem; color: var(--text); word-break: keep-all;}
.uncompleted_orders > .item .status .new { font-family: var(--second-family); background: #237bff; border-radius: 0.25rem; width: 45px; height: 20px; font-weight: 500; font-size: 0.75rem; line-height: 1; color: #fff; display: flex; align-items: center; justify-content: center;}
.uncompleted_orders > .item .percent { font-weight: 700; font-size: 1.625rem; color: var(--text); margin-bottom: 0.375rem;}
.uncompleted_orders > .item .percent .color {color: #237bff;}
.uncompleted_orders > .item .key { font-weight: 400; font-size: 1.25rem; color: var(--text); min-height: 2.6em;}
.uncompleted_orders > .item .btn { margin-top: 0.5rem; position: relative;}
.uncompleted_orders > .item .btn .btn_apply { border-radius: 0.25rem; width: 100%; height: 34px; background: #237bff; font-weight: 400; font-size: 1rem; color: #fff;}
.uncompleted_orders > .item .btn .btn_apply .bold { font-weight: 700;}

.page_titbox { display: flex; align-items: center; gap: 0.125rem; margin-bottom: 1.125rem;} 
.page_titbox img { width: 1.875rem;}
.page_titbox .txt { font-weight: 800; font-size: 1.438rem; color: var(--text);}
.page_titbox .link { display: flex; align-items: center; gap: 0.75rem; }
.page_titbox.detail_ver { gap: 0.75rem;}
.page_titbox.detail_ver img {opacity: 0.45;}
.page_titbox.detail_ver .txt { font-size: 1.5rem; font-weight: 700; color: #a3acbb;}
 .page_titbox.detail_ver > .title { font-weight: 800; font-size: 2rem;  color: var(--text); margin-left: 0.75rem;}

.common_modal { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 100; background: rgba(0, 0, 0, 0.3); transition: all 0.4s ease; pointer-events: none; opacity: 0;}
.common_modal.show { pointer-events: auto; opacity: 1;}
.common_modal .modal_box { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 90%; max-width: 444px; background: #fff; border-radius: 0.875rem; padding: 2rem 1rem; transition: all 0.4s ease; opacity: 0; margin-top: 100px;}
.common_modal.show .modal_box { opacity: 1; margin-top: 0;}
.common_modal .modal_box.big {max-width: 478px;}
.common_modal .modal_box .modal_txtbox { display: flex; flex-direction: column; align-items: center; gap: 0.625rem; text-align: center;}
.common_modal .modal_box .modal_txtbox .modal_tit { font-weight: 700; font-size: 1.875rem; text-align: center; color: var(--text);}
.common_modal .modal_box .modal_txtbox .modal_desc { font-weight: 400; font-size: 1.125rem; text-align: center; color: var(--text);}
.common_modal .modal_box .modal_btnbox {display: flex; align-items: center; justify-content: center; gap: 0.625rem; margin-top: 2.125rem;}
.common_modal .modal_box .modal_btnbox .btn { border-radius: 0.938rem; width: 184px; height: 50px; font-weight: 600; font-size: 1.375rem; text-align: center;align-items: center; justify-content: center; padding: 0; display: flex; align-items: center; justify-content: center; border: 1px solid #237bff;}
.common_modal .modal_box .modal_btnbox .btn_typeA { background: #237bff; color: #fff;}
.common_modal .modal_box .modal_btnbox .btn_typeB { background: #fff; color: #237bff;}
.common_modal .modal_box .modal_btnbox .btn_typeC { color: #fff; background: #f33a11;  border-color: #f33a11;}
.common_modal .modal_box .modal_btnbox .go_main { max-width: 160px; margin: 0 auto;}

.container .tbl_wrap { border-radius: 1.25rem; background: #fff;box-shadow: var(--box-shadow); width: 100%; padding: 0.5rem;}
.container .tbl_wrap .tbl_titbox { display: flex; align-items: center; gap: 1.313rem; margin-bottom: 1.25rem;}
.container .tbl_wrap .tbl_titbox > .tit { font-weight: 700; font-size: 1.625rem; color: var(--text);}
.container .tbl_wrap .tbl_titbox > .filter_btn { display: flex; align-items: center; gap: 0.563rem;}
.container .tbl_wrap .tbl_titbox > .filter_btn .icon { background: url(../img/icon_filter.png) no-repeat center / contain; width: 0.875rem; aspect-ratio: 1 / 1; display: block;}
.container .tbl_wrap .tbl_titbox > .filter_btn .txt { font-weight: 700; font-size: 1rem; color: var(--text);}
.container .tbl_wrap .tbl { width: 100%; border-collapse: collapse; font-weight: 400; font-size: 1rem; color: var(--text); table-layout: fixed;}
.container .tbl_wrap .tbl col.date { width:90px;}
.container .tbl_wrap .tbl col.order { width: 110px;}
.container .tbl_wrap .tbl col.name { width: calc(100% - 90px - 110px - 100px - 120px);}
.container .tbl_wrap .tbl col.status { width: 100px;}
.container .tbl_wrap .tbl col.manage { width: 120px;}
.container .tbl_wrap .tbl thead tr th { font-weight: 600; font-size: 1rem; text-align: center; color: #4371b6;}
.container .tbl_wrap .tbl thead tr th .tit { position: relative; background: rgba(134, 197, 255, 0.48); height: 36px; display: flex; align-items: center; justify-content: center;}
.container .tbl_wrap .tbl thead tr th:nth-child(1) .tit { border-radius: 0.875rem 0 0 0.875rem;}
.container .tbl_wrap .tbl thead tr th:last-child .tit { border-radius: 0 0.875rem 0.875rem 0;}
.container .tbl_wrap .tbl.bar thead tr th .tit::after { content: ""; width: 2px; height: 1rem; background: rgba(70, 90, 119, 0.46); position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.container .tbl_wrap .tbl.bar thead tr th:last-child .tit::after {display: none;}
.container .tbl_wrap .tbl tbody tr td { height: 55px; text-align: center; }
.container .tbl_wrap .tbl tbody tr td.name { text-align: left; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 0.625rem;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge { font-weight: 700; font-size: 1rem; text-align: center; border-radius: 0.375rem; padding: 0.75rem 0.875rem; height: 30px; display: inline-flex; align-items: center; justify-content: center;  white-space: nowrap; margin: 0 auto;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge[data-title="요청중"] { color: #da9f08; background: #ffeeb0;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge[data-title="진행중"] { background: #c2ffc1; color: #1dae4e;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge[data-title="완료"] { color: #3b8ae5; background: #e0f4ff;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge[data-title="요청사항작성"] { background: #f4f4f4; color: #8c8c8c;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge[data-title="원고 진행중"] { color: #da9f08; background: #ffeeb0;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge[data-title="원고검수필요"] { background: #ffe3dd; color: #ff5252;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge[data-title="발행요청"] { background: #c2ffc1; color: #1dae4e;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge[data-title="발행완료"] { color: #3b8ae5; background: #e0f4ff;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge[data-title="작성필요"] { background: #ffe3dd; color: #ff5252;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge[data-title="작성완료"] { color: #da9f08; background: #ffeeb0;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge[data-title="충전완료"] { color: #3b8ae5; background: #e0f4ff;}
.container .tbl_wrap .tbl tbody tr td.status .status_badge[data-title="결제오류"] { color: #fd7373; background: #ffe3dd;}
.container .tbl_wrap .tbl tbody tr td.manage .btn_confirm { border: 2px solid #237bff; border-radius: 0.5rem; width: 95px; height: 35px; font-weight: 700; font-size: 1rem; line-height: 1; text-align: center; color: #237bff; display: flex;  align-items: center; justify-content: center; white-space: nowrap; margin: 0 auto; transition: all 0.4s ease;}
.container .tbl_wrap .tbl tbody tr td.manage .btn_confirm:hover { background: #237bff; color: #fff;}

.pagenation { display: flex; justify-content: center; align-items: center; gap: 1.25rem; margin: 1.5rem 0 1rem;}
.pagenation .page { font-weight: 600; font-size: 1rem; line-height: 1;  text-align: center; color: rgba(70, 90, 119, 0.5); display: flex; align-items: center; justify-content: center;}
.pagenation .page.active { color: var(--text);}
.pagenation .page.page_btn { display: none;}
.pagenation .page.first_btn { margin-right: -0.625rem;}
.pagenation .page.end_btn { margin-left: -0.625rem;}
.pagenation .page .link{display: inline-block;}

.tbl_btnbox { display: flex; justify-content: center; align-items: center; gap: 1.25rem; margin-top: 1.875rem;}
.tbl_btnbox .btn { font-weight: 800; font-size: 1.125rem; text-align: center; border-radius: 100px; height: 45px;}
.tbl_btnbox .btn.disabled { opacity: 0.4;pointer-events: none;}
.tbl_btnbox .btn.btn_typeA { width: 254px; box-shadow: 0 0.125rem 0.375rem 0 rgba(33, 108, 150, 0.25); background: #237bff; color: #fff;}
.tbl_btnbox .btn.btn_typeB { width: 116px; box-shadow: 0 0.25rem 0.75rem 0 rgba(33, 108, 150, 0.2); background: #fff; color: #237bff;}
.tbl_btnbox .btn .small {font-weight: 400;}

.tab_wrap {position: relative;}
.tab_navbox { display: flex; gap: 0.625rem;}
.tab_navbox .tab_nav { cursor: pointer; border-radius: 0.438rem; width: 50%; height: 40px; box-shadow: 0 0.125rem 0.375rem 0 rgba(33, 108, 150, 0.25); background: #fff; font-weight: 700; font-size: 0.938rem; text-align: center; color: var(--text); display: flex; align-items: center; justify-content: center;}
.tab_navbox.tab3 .tab_nav {width: 33.333%;}
.tab_navbox.tab4 .tab_nav {width: 25%;}
.tab_navbox.tab5 .tab_nav {width: 20%;}
.tab_navbox .tab_nav.on { background: #237bff; color: #fff;}
.tab_contbox { position: relative;}
.tab_contbox .tab_cont { display: none; /*animation: 1.2s ease 0s fadeIn;*/}
.tab_contbox .tab_cont.on {display: block;}

/* @keyframes fadeIn {
	0% {opacity:0}
	100% {opacity:1;}
} */