@charset "UTF-8";
/* 테이블*/
.is-pinned {
    --t-is-br: var(--yellow-200); /* 테이블 body is-pinned border */
    --t-is-bg: var(--yellow-100); /* 테이블 body is-pinned bg */
    --t-is-s-br: var(--yellow-300); /* 테이블 body is-pinned sorting border */
    --t-is-s-bg: var(--yellow-200); /* 테이블 body is-pinned sorting bg */
}
.is-selected {
    --t-is-br: var(--teal-200) !important; /* 테이블 body is-selected border */
    --t-is-bg: var(--teal-100) !important; /* 테이블 body is-selected bg */
    --t-is-s-br: var(--teal-300) !important; /* 테이블 body is-selected sorting border */
    --t-is-s-bg: var(--teal-200) !important; /* 테이블 body is-selected sorting bg */
}
.is-pressed {
    --t-is-br: var(--blue-200); /* 테이블 body is-pressed border */
    --t-is-bg: var(--blue-100); /* 테이블 body is-pressed bg */
    --t-is-s-br: var(--blue-300); /* 테이블 body is-pressed sorting border */
    --t-is-s-bg: var(--blue-200); /* 테이블 body is-pressed sorting bg */
}
.is-white {
    --t-is-br: var(--t-b-br); /* 테이블 body is-white border */
    --t-is-bg: var(--white); /* 테이블 body is-white bg */
    --t-is-s-br: var(--white); /* 테이블 body is-white sorting border */
    --t-is-s-bg: var(--white); /* 테이블 body is-white sorting bg */
}
.table .cell-red {
    --t-h-cell-br: var(--red-200); /* 테이블 thead cell-red border */
    --t-h-cell-bg: var(--red-100); /* 테이블 thead cell-red bg */
    --t-h-s-cell-br: var(--red-300); /* 테이블 thead cell-red border */
    --t-h-s-cell-bg: var(--red-200); /* 테이블 thead cell-red bg */
    --t-h-s-i: var(--red-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--red-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--red-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--red-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--red-200); /* 테이블 body cell-red border */
    --t-b-cell-bg: var(--red-100); /* 테이블 body cell-red bg */
    --t-b-s-cell-br: var(--red-300); /* 테이블 body sorting cell-red border */
    --t-b-s-cell-bg: var(--red-200); /* 테이블 body sorting cell-red bg */
}
.table .cell-orange {
    --t-h-cell-br: var(--orange-200); /* 테이블 thead cell-orange border */
    --t-h-cell-bg: var(--orange-100); /* 테이블 thead cell-orange bg */
    --t-h-s-cell-br: var(--orange-300); /* 테이블 thead cell-orange border */
    --t-h-s-cell-bg: var(--orange-200); /* 테이블 thead cell-orange bg */
    --t-h-s-i: var(--orange-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--orange-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--orange-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--orange-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--orange-200); /* 테이블 body cell-orange border */
    --t-b-cell-bg: var(--orange-100); /* 테이블 body cell-orange bg */
    --t-b-s-cell-br: var(--orange-300); /* 테이블 body sorting cell-orange border */
    --t-b-s-cell-bg: var(--orange-200); /* 테이블 body sorting cell-orange bg */
}
.table .cell-amber {
    --t-h-cell-br: var(--amber-200); /* 테이블 thead cell-amber border */
    --t-h-cell-bg: var(--amber-100); /* 테이블 thead cell-amber bg */
    --t-h-s-cell-br: var(--amber-300); /* 테이블 thead cell-amber border */
    --t-h-s-cell-bg: var(--amber-200); /* 테이블 thead cell-amber bg */
    --t-h-s-i: var(--amber-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--amber-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--amber-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--amber-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--amber-200); /* 테이블 body cell-amber border */
    --t-b-cell-bg: var(--amber-100); /* 테이블 body cell-amber bg */
    --t-b-s-cell-br: var(--amber-300); /* 테이블 body sorting cell-amber border */
    --t-b-s-cell-bg: var(--amber-200); /* 테이블 body sorting cell-amber bg */
}
.table .cell-yellow {
    --t-h-cell-br: var(--yellow-200); /* 테이블 thead cell-yellow border */
    --t-h-cell-bg: var(--yellow-100); /* 테이블 thead cell-yellow bg */
    --t-h-s-cell-br: var(--yellow-300); /* 테이블 thead cell-yellow border */
    --t-h-s-cell-bg: var(--yellow-200); /* 테이블 thead cell-yellow bg */
    --t-h-s-i: var(--yellow-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--yellow-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--yellow-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--yellow-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--yellow-200); /* 테이블 body cell-yellow border */
    --t-b-cell-bg: var(--yellow-100); /* 테이블 body cell-yellow bg */
    --t-b-s-cell-br: var(--yellow-300); /* 테이블 body sorting cell-yellow border */
    --t-b-s-cell-bg: var(--yellow-200); /* 테이블 body sorting cell-yellow bg */
}
.table .cell-lime {
    --t-h-cell-br: var(--lime-200); /* 테이블 thead cell-lime border */
    --t-h-cell-bg: var(--lime-100); /* 테이블 thead cell-lime bg */
    --t-h-s-cell-br: var(--lime-300); /* 테이블 thead cell-lime border */
    --t-h-s-cell-bg: var(--lime-200); /* 테이블 thead cell-lime bg */
    --t-h-s-i: var(--lime-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--lime-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--lime-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--lime-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--lime-200); /* 테이블 body cell-lime border */
    --t-b-cell-bg: var(--lime-100); /* 테이블 body cell-lime bg */
    --t-b-s-cell-br: var(--lime-300); /* 테이블 body sorting cell-lime border */
    --t-b-s-cell-bg: var(--lime-200); /* 테이블 body sorting cell-lime bg */
}
.table .cell-green {
    --t-h-cell-br: var(--green-200); /* 테이블 thead cell-green border */
    --t-h-cell-bg: var(--green-100); /* 테이블 thead cell-green bg */
    --t-h-s-cell-br: var(--green-300); /* 테이블 thead cell-green border */
    --t-h-s-cell-bg: var(--green-200); /* 테이블 thead cell-green bg */
    --t-h-s-i: var(--green-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--green-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--green-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--green-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--green-200); /* 테이블 body cell-green border */
    --t-b-cell-bg: var(--green-100); /* 테이블 body cell-green bg */
    --t-b-s-cell-br: var(--green-300); /* 테이블 body sorting cell-green border */
    --t-b-s-cell-bg: var(--green-200); /* 테이블 body sorting cell-green bg */
}
.table .cell-emerald {
    --t-h-cell-br: var(--emerald-200); /* 테이블 thead cell-emerald border */
    --t-h-cell-bg: var(--emerald-100); /* 테이블 thead cell-emerald bg */
    --t-h-s-cell-br: var(--emerald-300); /* 테이블 thead cell-emerald border */
    --t-h-s-cell-bg: var(--emerald-200); /* 테이블 thead cell-emerald bg */
    --t-h-s-i: var(--emerald-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--emerald-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--emerald-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--emerald-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--emerald-200); /* 테이블 body cell-emerald border */
    --t-b-cell-bg: var(--emerald-100); /* 테이블 body cell-emerald bg */
    --t-b-s-cell-br: var(--emerald-300); /* 테이블 body sorting cell-emerald border */
    --t-b-s-cell-bg: var(--emerald-200); /* 테이블 body sorting cell-emerald bg */
}
.table .cell-teal {
    --t-h-cell-br: var(--teal-200); /* 테이블 thead cell-teal border */
    --t-h-cell-bg: var(--teal-100); /* 테이블 thead cell-teal bg */
    --t-h-s-cell-br: var(--teal-300); /* 테이블 thead cell-teal border */
    --t-h-s-cell-bg: var(--teal-200); /* 테이블 thead cell-teal bg */
    --t-h-s-i: var(--teal-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--teal-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--teal-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--teal-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--teal-200); /* 테이블 body cell-teal border */
    --t-b-cell-bg: var(--teal-100); /* 테이블 body cell-teal bg */
    --t-b-s-cell-br: var(--teal-300); /* 테이블 body sorting cell-teal border */
    --t-b-s-cell-bg: var(--teal-200); /* 테이블 body sorting cell-teal bg */
}
.table .cell-cyan {
    --t-h-cell-br: var(--cyan-200); /* 테이블 thead cell-cyan border */
    --t-h-cell-bg: var(--cyan-100); /* 테이블 thead cell-cyan bg */
    --t-h-s-cell-br: var(--cyan-300); /* 테이블 thead cell-cyan border */
    --t-h-s-cell-bg: var(--cyan-200); /* 테이블 thead cell-cyan bg */
    --t-h-s-i: var(--cyan-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--cyan-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--cyan-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--cyan-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--cyan-200); /* 테이블 body cell-cyan border */
    --t-b-cell-bg: var(--cyan-100); /* 테이블 body cell-cyan bg */
    --t-b-s-cell-br: var(--cyan-300); /* 테이블 body sorting cell-cyan border */
    --t-b-s-cell-bg: var(--cyan-200); /* 테이블 body sorting cell-cyan bg */
}
.table .cell-sky {
    --t-h-cell-br: var(--sky-200); /* 테이블 thead cell-sky border */
    --t-h-cell-bg: var(--sky-100); /* 테이블 thead cell-sky bg */
    --t-h-s-cell-br: var(--sky-300); /* 테이블 thead cell-sky border */
    --t-h-s-cell-bg: var(--sky-200); /* 테이블 thead cell-sky bg */
    --t-h-s-i: var(--sky-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--sky-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--sky-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--sky-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--sky-200); /* 테이블 body cell-sky border */
    --t-b-cell-bg: var(--sky-100); /* 테이블 body cell-sky bg */
    --t-b-s-cell-br: var(--sky-300); /* 테이블 body sorting cell-sky border */
    --t-b-s-cell-bg: var(--sky-200); /* 테이블 body sorting cell-sky bg */
}
.table .cell-blue {
    --t-h-cell-br: var(--blue-200); /* 테이블 thead cell-blue border */
    --t-h-cell-bg: var(--blue-100); /* 테이블 thead cell-blue bg */
    --t-h-s-cell-br: var(--blue-300); /* 테이블 thead cell-blue border */
    --t-h-s-cell-bg: var(--blue-200); /* 테이블 thead cell-blue bg */
    --t-h-s-i: var(--blue-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--blue-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--blue-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--blue-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--blue-200); /* 테이블 body cell-blue border */
    --t-b-cell-bg: var(--blue-100); /* 테이블 body cell-blue bg */
    --t-b-s-cell-br: var(--blue-300); /* 테이블 body sorting cell-blue border */
    --t-b-s-cell-bg: var(--blue-200); /* 테이블 body sorting cell-blue bg */
}
.table .cell-indigo {
    --t-h-cell-br: var(--indigo-200); /* 테이블 thead cell-indigo border */
    --t-h-cell-bg: var(--indigo-100); /* 테이블 thead cell-indigo bg */
    --t-h-s-cell-br: var(--indigo-300); /* 테이블 thead cell-indigo border */
    --t-h-s-cell-bg: var(--indigo-200); /* 테이블 thead cell-indigo bg */
    --t-h-s-i: var(--indigo-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--indigo-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--indigo-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--indigo-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--indigo-200); /* 테이블 body cell-indigo border */
    --t-b-cell-bg: var(--indigo-100); /* 테이블 body cell-indigo bg */
    --t-b-s-cell-br: var(--indigo-300); /* 테이블 body sorting cell-indigo border */
    --t-b-s-cell-bg: var(--indigo-200); /* 테이블 body sorting cell-indigo bg */
}
.table .cell-violet {
    --t-h-cell-br: var(--violet-200); /* 테이블 thead cell-violet border */
    --t-h-cell-bg: var(--violet-100); /* 테이블 thead cell-violet bg */
    --t-h-s-cell-br: var(--violet-300); /* 테이블 thead cell-violet border */
    --t-h-s-cell-bg: var(--violet-200); /* 테이블 thead cell-violet bg */
    --t-h-s-i: var(--violet-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--violet-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--violet-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--violet-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--violet-200); /* 테이블 body cell-violet border */
    --t-b-cell-bg: var(--violet-100); /* 테이블 body cell-violet bg */
    --t-b-s-cell-br: var(--violet-300); /* 테이블 body sorting cell-violet border */
    --t-b-s-cell-bg: var(--violet-200); /* 테이블 body sorting cell-violet bg */
}
.table .cell-purple {
    --t-h-cell-br: var(--purple-200); /* 테이블 thead cell-purple border */
    --t-h-cell-bg: var(--purple-100); /* 테이블 thead cell-purple bg */
    --t-h-s-cell-br: var(--purple-300); /* 테이블 thead cell-purple border */
    --t-h-s-cell-bg: var(--purple-200); /* 테이블 thead cell-purple bg */
    --t-h-s-i: var(--purple-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--purple-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--purple-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--purple-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--purple-200); /* 테이블 body cell-purple border */
    --t-b-cell-bg: var(--purple-100); /* 테이블 body cell-purple bg */
    --t-b-s-cell-br: var(--purple-300); /* 테이블 body sorting cell-purple border */
    --t-b-s-cell-bg: var(--purple-200); /* 테이블 body sorting cell-purple bg */
}
.table .cell-fuchsia {
    --t-h-cell-br: var(--fuchsia-200); /* 테이블 thead cell-fuchsia border */
    --t-h-cell-bg: var(--fuchsia-100); /* 테이블 thead cell-fuchsia bg */
    --t-h-s-cell-br: var(--fuchsia-300); /* 테이블 thead cell-fuchsia border */
    --t-h-s-cell-bg: var(--fuchsia-200); /* 테이블 thead cell-fuchsia bg */
    --t-h-s-i: var(--fuchsia-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--fuchsia-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--fuchsia-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--fuchsia-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--fuchsia-200); /* 테이블 body cell-fuchsia border */
    --t-b-cell-bg: var(--fuchsia-100); /* 테이블 body cell-fuchsia bg */
    --t-b-s-cell-br: var(--fuchsia-300); /* 테이블 body sorting cell-fuchsia border */
    --t-b-s-cell-bg: var(--fuchsia-200); /* 테이블 body sorting cell-fuchsia bg */
}
.table .cell-pink {
    --t-h-cell-br: var(--pink-200); /* 테이블 thead cell-pink border */
    --t-h-cell-bg: var(--pink-100); /* 테이블 thead cell-pink bg */
    --t-h-s-cell-br: var(--pink-300); /* 테이블 thead cell-pink border */
    --t-h-s-cell-bg: var(--pink-200); /* 테이블 thead cell-pink bg */
    --t-h-s-i: var(--pink-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--pink-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--pink-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--pink-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--pink-200); /* 테이블 body cell-pink border */
    --t-b-cell-bg: var(--pink-100); /* 테이블 body cell-pink bg */
    --t-b-s-cell-br: var(--pink-300); /* 테이블 body sorting cell-pink border */
    --t-b-s-cell-bg: var(--pink-200); /* 테이블 body sorting cell-pink bg */
}
.table .cell-rose {
    --t-h-cell-br: var(--rose-200); /* 테이블 thead cell-rose border */
    --t-h-cell-bg: var(--rose-100); /* 테이블 thead cell-rose bg */
    --t-h-s-cell-br: var(--rose-300); /* 테이블 thead cell-rose border */
    --t-h-s-cell-bg: var(--rose-200); /* 테이블 thead cell-rose bg */
    --t-h-s-i: var(--rose-400); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--rose-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--rose-600); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--rose-700); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--rose-200); /* 테이블 body cell-rose border */
    --t-b-cell-bg: var(--rose-100); /* 테이블 body cell-rose bg */
    --t-b-s-cell-br: var(--rose-300); /* 테이블 body sorting cell-rose border */
    --t-b-s-cell-bg: var(--rose-200); /* 테이블 body sorting cell-rose bg */
}
.table .cell-thick-red {
    --t-h-cell-br: var(--red-600); /* 테이블 thead cell-thick-red border */
    --t-h-cell-bg: var(--red-500); /* 테이블 thead cell-thick-red bg */
    --t-h-s-cell-br: var(--red-700); /* 테이블 thead cell-red border */
    --t-h-s-cell-bg: var(--red-600); /* 테이블 thead cell-red bg */
    --t-h-s-i: var(--red-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--red-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--red-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--red-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--red-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--red-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--red-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--red-600); /* 테이블 body cell-thick-red border */
    --t-b-cell-bg: var(--red-500); /* 테이블 body cell-thick-red bg */
    --t-b-s-cell-br: var(--red-700); /* 테이블 body sorting cell-thick-red border */
    --t-b-s-cell-bg: var(--red-600); /* 테이블 body sorting cell-thick-red bg */
}
.table .cell-thick-orange {
    --t-h-cell-br: var(--orange-600); /* 테이블 thead cell-thick-orange border */
    --t-h-cell-bg: var(--orange-500); /* 테이블 thead cell-thick-orange bg */
    --t-h-s-cell-br: var(--orange-700); /* 테이블 thead cell-orange border */
    --t-h-s-cell-bg: var(--orange-600); /* 테이블 thead cell-orange bg */
    --t-h-s-i: var(--orange-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--orange-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--orange-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--orange-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--orange-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--orange-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--orange-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--orange-600); /* 테이블 body cell-thick-orange border */
    --t-b-cell-bg: var(--orange-500); /* 테이블 body cell-thick-orange bg */
    --t-b-s-cell-br: var(--orange-700); /* 테이블 body sorting cell-thick-orange border */
    --t-b-s-cell-bg: var(--orange-600); /* 테이블 body sorting cell-thick-orange bg */
}
.table .cell-thick-amber {
    --t-h-cell-br: var(--amber-600); /* 테이블 thead cell-thick-amber border */
    --t-h-cell-bg: var(--amber-500); /* 테이블 thead cell-thick-amber bg */
    --t-h-s-cell-br: var(--amber-700); /* 테이블 thead cell-amber border */
    --t-h-s-cell-bg: var(--amber-600); /* 테이블 thead cell-amber bg */
    --t-h-s-i: var(--amber-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--amber-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--amber-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--amber-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--amber-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--amber-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--amber-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--amber-600); /* 테이블 body cell-thick-amber border */
    --t-b-cell-bg: var(--amber-500); /* 테이블 body cell-thick-amber bg */
    --t-b-s-cell-br: var(--amber-700); /* 테이블 body sorting cell-thick-amber border */
    --t-b-s-cell-bg: var(--amber-600); /* 테이블 body sorting cell-thick-amber bg */
}
.table .cell-thick-yellow {
    --t-h-cell-br: var(--yellow-600); /* 테이블 thead cell-thick-yellow border */
    --t-h-cell-bg: var(--yellow-500); /* 테이블 thead cell-thick-yellow bg */
    --t-h-s-cell-br: var(--yellow-700); /* 테이블 thead cell-yellow border */
    --t-h-s-cell-bg: var(--yellow-600); /* 테이블 thead cell-yellow bg */
    --t-h-s-i: var(--yellow-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--yellow-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--yellow-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--yellow-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--yellow-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--yellow-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--yellow-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--yellow-600); /* 테이블 body cell-thick-yellow border */
    --t-b-cell-bg: var(--yellow-500); /* 테이블 body cell-thick-yellow bg */
    --t-b-s-cell-br: var(--yellow-700); /* 테이블 body sorting cell-thick-yellow border */
    --t-b-s-cell-bg: var(--yellow-600); /* 테이블 body sorting cell-thick-yellow bg */
}
.table .cell-thick-lime {
    --t-h-cell-br: var(--lime-600); /* 테이블 thead cell-thick-lime border */
    --t-h-cell-bg: var(--lime-500); /* 테이블 thead cell-thick-lime bg */
    --t-h-s-cell-br: var(--lime-700); /* 테이블 thead cell-lime border */
    --t-h-s-cell-bg: var(--lime-600); /* 테이블 thead cell-lime bg */
    --t-h-s-i: var(--lime-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--lime-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--lime-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--lime-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--lime-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--lime-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--lime-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--lime-600); /* 테이블 body cell-thick-lime border */
    --t-b-cell-bg: var(--lime-500); /* 테이블 body cell-thick-lime bg */
    --t-b-s-cell-br: var(--lime-700); /* 테이블 body sorting cell-thick-lime border */
    --t-b-s-cell-bg: var(--lime-600); /* 테이블 body sorting cell-thick-lime bg */
}
.table .cell-thick-green {
    --t-h-cell-br: var(--green-600); /* 테이블 thead cell-thick-green border */
    --t-h-cell-bg: var(--green-500); /* 테이블 thead cell-thick-green bg */
    --t-h-s-cell-br: var(--green-700); /* 테이블 thead cell-green border */
    --t-h-s-cell-bg: var(--green-600); /* 테이블 thead cell-green bg */
    --t-h-s-i: var(--green-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--green-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--green-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--green-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--green-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--green-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--green-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--green-600); /* 테이블 body cell-thick-green border */
    --t-b-cell-bg: var(--green-500); /* 테이블 body cell-thick-green bg */
    --t-b-s-cell-br: var(--green-700); /* 테이블 body sorting cell-thick-green border */
    --t-b-s-cell-bg: var(--green-600); /* 테이블 body sorting cell-thick-green bg */
}
.table .cell-thick-emerald {
    --t-h-cell-br: var(--emerald-600); /* 테이블 thead cell-thick-emerald border */
    --t-h-cell-bg: var(--emerald-500); /* 테이블 thead cell-thick-emerald bg */
    --t-h-s-cell-br: var(--emerald-700); /* 테이블 thead cell-emerald border */
    --t-h-s-cell-bg: var(--emerald-600); /* 테이블 thead cell-emerald bg */
    --t-h-s-i: var(--emerald-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--emerald-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--emerald-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--emerald-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--emerald-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--emerald-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--emerald-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--emerald-600); /* 테이블 body cell-thick-emerald border */
    --t-b-cell-bg: var(--emerald-500); /* 테이블 body cell-thick-emerald bg */
    --t-b-s-cell-br: var(--emerald-700); /* 테이블 body sorting cell-thick-emerald border */
    --t-b-s-cell-bg: var(--emerald-600); /* 테이블 body sorting cell-thick-emerald bg */
}
.table .cell-thick-teal {
    --t-h-cell-br: var(--teal-600); /* 테이블 thead cell-thick-teal border */
    --t-h-cell-bg: var(--teal-500); /* 테이블 thead cell-thick-teal bg */
    --t-h-s-cell-br: var(--teal-700); /* 테이블 thead cell-teal border */
    --t-h-s-cell-bg: var(--teal-600); /* 테이블 thead cell-teal bg */
    --t-h-s-i: var(--teal-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--teal-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--teal-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--teal-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--teal-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--teal-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--teal-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--teal-600); /* 테이블 body cell-thick-teal border */
    --t-b-cell-bg: var(--teal-500); /* 테이블 body cell-thick-teal bg */
    --t-b-s-cell-br: var(--teal-700); /* 테이블 body sorting cell-thick-teal border */
    --t-b-s-cell-bg: var(--teal-600); /* 테이블 body sorting cell-thick-teal bg */
}
.table .cell-thick-cyan {
    --t-h-cell-br: var(--cyan-600); /* 테이블 thead cell-thick-cyan border */
    --t-h-cell-bg: var(--cyan-500); /* 테이블 thead cell-thick-cyan bg */
    --t-h-s-cell-br: var(--cyan-700); /* 테이블 thead cell-cyan border */
    --t-h-s-cell-bg: var(--cyan-600); /* 테이블 thead cell-cyan bg */
    --t-h-s-i: var(--cyan-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--cyan-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--cyan-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--cyan-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--cyan-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--cyan-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--cyan-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--cyan-600); /* 테이블 body cell-thick-cyan border */
    --t-b-cell-bg: var(--cyan-500); /* 테이블 body cell-thick-cyan bg */
    --t-b-s-cell-br: var(--cyan-700); /* 테이블 body sorting cell-thick-cyan border */
    --t-b-s-cell-bg: var(--cyan-600); /* 테이블 body sorting cell-thick-cyan bg */
}
.table .cell-thick-sky {
    --t-h-cell-br: var(--sky-600); /* 테이블 thead cell-thick-sky border */
    --t-h-cell-bg: var(--sky-500); /* 테이블 thead cell-thick-sky bg */
    --t-h-s-cell-br: var(--sky-700); /* 테이블 thead cell-sky border */
    --t-h-s-cell-bg: var(--sky-600); /* 테이블 thead cell-sky bg */
    --t-h-s-i: var(--sky-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--sky-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--sky-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--sky-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--sky-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--sky-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--sky-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--sky-600); /* 테이블 body cell-thick-sky border */
    --t-b-cell-bg: var(--sky-500); /* 테이블 body cell-thick-sky bg */
    --t-b-s-cell-br: var(--sky-700); /* 테이블 body sorting cell-thick-sky border */
    --t-b-s-cell-bg: var(--sky-600); /* 테이블 body sorting cell-thick-sky bg */
}
.table .cell-thick-blue {
    --t-h-cell-br: var(--blue-600); /* 테이블 thead cell-thick-blue border */
    --t-h-cell-bg: var(--blue-500); /* 테이블 thead cell-thick-blue bg */
    --t-h-s-cell-br: var(--blue-700); /* 테이블 thead cell-blue border */
    --t-h-s-cell-bg: var(--blue-600); /* 테이블 thead cell-blue bg */
    --t-h-s-i: var(--blue-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--blue-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--blue-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--blue-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--blue-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--blue-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--blue-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--blue-600); /* 테이블 body cell-thick-blue border */
    --t-b-cell-bg: var(--blue-500); /* 테이블 body cell-thick-blue bg */
    --t-b-s-cell-br: var(--blue-700); /* 테이블 body sorting cell-thick-blue border */
    --t-b-s-cell-bg: var(--blue-600); /* 테이블 body sorting cell-thick-blue bg */
}
.table .cell-thick-indigo {
    --t-h-cell-br: var(--indigo-600); /* 테이블 thead cell-thick-indigo border */
    --t-h-cell-bg: var(--indigo-500); /* 테이블 thead cell-thick-indigo bg */
    --t-h-s-cell-br: var(--indigo-700); /* 테이블 thead cell-indigo border */
    --t-h-s-cell-bg: var(--indigo-600); /* 테이블 thead cell-indigo bg */
    --t-h-s-i: var(--indigo-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--indigo-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--indigo-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--indigo-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--indigo-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--indigo-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--indigo-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--indigo-600); /* 테이블 body cell-thick-indigo border */
    --t-b-cell-bg: var(--indigo-500); /* 테이블 body cell-thick-indigo bg */
    --t-b-s-cell-br: var(--indigo-700); /* 테이블 body sorting cell-thick-indigo border */
    --t-b-s-cell-bg: var(--indigo-600); /* 테이블 body sorting cell-thick-indigo bg */
}
.table .cell-thick-violet {
    --t-h-cell-br: var(--violet-600); /* 테이블 thead cell-thick-violet border */
    --t-h-cell-bg: var(--violet-500); /* 테이블 thead cell-thick-violet bg */
    --t-h-s-cell-br: var(--violet-700); /* 테이블 thead cell-violet border */
    --t-h-s-cell-bg: var(--violet-600); /* 테이블 thead cell-violet bg */
    --t-h-s-i: var(--violet-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--violet-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--violet-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--violet-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--violet-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--violet-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--violet-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--violet-600); /* 테이블 body cell-thick-violet border */
    --t-b-cell-bg: var(--violet-500); /* 테이블 body cell-thick-violet bg */
    --t-b-s-cell-br: var(--violet-700); /* 테이블 body sorting cell-thick-violet border */
    --t-b-s-cell-bg: var(--violet-600); /* 테이블 body sorting cell-thick-violet bg */
}
.table .cell-thick-purple {
    --t-h-cell-br: var(--purple-600); /* 테이블 thead cell-thick-purple border */
    --t-h-cell-bg: var(--purple-500); /* 테이블 thead cell-thick-purple bg */
    --t-h-s-cell-br: var(--purple-700); /* 테이블 thead cell-purple border */
    --t-h-s-cell-bg: var(--purple-600); /* 테이블 thead cell-purple bg */
    --t-h-s-i: var(--purple-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--purple-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--purple-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--purple-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--purple-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--purple-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--purple-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--purple-600); /* 테이블 body cell-thick-purple border */
    --t-b-cell-bg: var(--purple-500); /* 테이블 body cell-thick-purple bg */
    --t-b-s-cell-br: var(--purple-700); /* 테이블 body sorting cell-thick-purple border */
    --t-b-s-cell-bg: var(--purple-600); /* 테이블 body sorting cell-thick-purple bg */
}
.table .cell-thick-fuchsia {
    --t-h-cell-br: var(--fuchsia-600); /* 테이블 thead cell-thick-fuchsia border */
    --t-h-cell-bg: var(--fuchsia-500); /* 테이블 thead cell-thick-fuchsia bg */
    --t-h-s-cell-br: var(--fuchsia-700); /* 테이블 thead cell-fuchsia border */
    --t-h-s-cell-bg: var(--fuchsia-600); /* 테이블 thead cell-fuchsia bg */
    --t-h-s-i: var(--fuchsia-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--fuchsia-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--fuchsia-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--fuchsia-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--fuchsia-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--fuchsia-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--fuchsia-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--fuchsia-600); /* 테이블 body cell-thick-fuchsia border */
    --t-b-cell-bg: var(--fuchsia-500); /* 테이블 body cell-thick-fuchsia bg */
    --t-b-s-cell-br: var(--fuchsia-700); /* 테이블 body sorting cell-thick-fuchsia border */
    --t-b-s-cell-bg: var(--fuchsia-600); /* 테이블 body sorting cell-thick-fuchsia bg */
}
.table .cell-thick-pink {
    --t-h-cell-br: var(--pink-600); /* 테이블 thead cell-thick-pink border */
    --t-h-cell-bg: var(--pink-500); /* 테이블 thead cell-thick-pink bg */
    --t-h-s-cell-br: var(--pink-700); /* 테이블 thead cell-pink border */
    --t-h-s-cell-bg: var(--pink-600); /* 테이블 thead cell-pink bg */
    --t-h-s-i: var(--pink-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--pink-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--pink-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--pink-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--pink-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--pink-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--pink-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--pink-600); /* 테이블 body cell-thick-pink border */
    --t-b-cell-bg: var(--pink-500); /* 테이블 body cell-thick-pink bg */
    --t-b-s-cell-br: var(--pink-700); /* 테이블 body sorting cell-thick-pink border */
    --t-b-s-cell-bg: var(--pink-600); /* 테이블 body sorting cell-thick-pink bg */
}
.table .cell-thick-rose {
    --t-h-cell-br: var(--rose-600); /* 테이블 thead cell-thick-rose border */
    --t-h-cell-bg: var(--rose-500); /* 테이블 thead cell-thick-rose bg */
    --t-h-s-cell-br: var(--rose-700); /* 테이블 thead cell-rose border */
    --t-h-s-cell-bg: var(--rose-600); /* 테이블 thead cell-rose bg */
    --t-h-s-i: var(--rose-300); /* 테이블 thead sort icon */
    --t-h-s-i-h: var(--rose-200); /* 테이블 thead sort icon hover */
    --t-h-s-i-a: var(--rose-100); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h: var(--white); /* 테이블 thead sort icon active hover */
    --t-h-s-i-: var(--rose-400); /* 테이블 thead sort icon */
    --t-h-s-i-h-: var(--rose-500); /* 테이블 thead sort icon hover */
    --t-h-s-i-a-: var(--rose-500); /* 테이블 thead sort icon active */
    --t-h-s-i-a-h-: var(--rose-600); /* 테이블 thead sort icon active hover */
    --t-b-cell-br: var(--rose-600); /* 테이블 body cell-thick-rose border */
    --t-b-cell-bg: var(--rose-500); /* 테이블 body cell-thick-rose bg */
    --t-b-s-cell-br: var(--rose-700); /* 테이블 body sorting cell-thick-rose border */
    --t-b-s-cell-bg: var(--rose-600); /* 테이블 body sorting cell-thick-rose bg */
}

.table {
    border-style: solid;
    border-width: 0;
    border-top-width: 1px;
    border-top-color: var(--table-t-br);
    border-bottom-width: 1px;
    border-bottom-color: var(--table-b-br);
    background-color: var(--white);
}
.table table {
    position: relative;
    table-layout: fixed;
    border-spacing: 0;
    font-size: var(--font-size);
}
.table :is(th, td) {
    border-collapse: collapse;
    word-break: keep-all;
    overflow-wrap: anywhere;
    border-style: solid;
    border-color: var(--t-h-br);
    border-width: 0px;
    z-index: 1;
}
.table :is(th, td)::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    --bg-opacity: 1;
    background-color: rgba(var(--white-rgb), var(--bg-opacity));
    z-index: -1;
}
.table thead {
    position: relative;
}
.table thead::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    --bg-opacity: .3;
    background-color: rgba(var(--slate-500-rgb), var(--bg-opacity));

    z-index: 5;
}
.table thead th {
    position: relative;
    padding: 4px 8px;
    color: var(--t-h-text);
    font-weight: 500;
    height: 36px;
    text-align: center;
    border-width: 0;
    border-top-color: var(--t-h-br);
    background-color: var(--t-h-bg);
}
.table thead th::before {
    border-color: var(--t-b-br);
    --bg-opacity: 0;
}
.table tbody tr {
    background-color: var(--white);
}
.table tbody :is(th, td) {
    position: relative;
    width: auto;
    padding: 4px 8px 5px 8px;
    height: 33px;
    text-align: center;
    color: var(--t-b-text);
    border-style: solid;
    border-color: var(--t-b-br);
    border-width: 0px;
    background-color: var(--white);
}
.table tbody :is(th, td)::before {
    border-bottom-color: var(--t-b-br);
}
.table tr:first-child :is(th, td) {
    border-top-width: 0px !important;
}
/*
.table tbody tr:last-child :is(th, td) {
    border-bottom-width: 0 !important;
}
.table tbody tr:last-child :is(th, td) {
    height: 36px;
    padding: 4px 8px;
}
.table tbody tr:last-child :is(th, td)::before {
    border-bottom-width: 0px !important;
}
*/
.table tbody tr :is(th, td) .cate {
    white-space: nowrap;
    font-weight: 500;
    color: var(--primary-600);
}
.table tbody tr :is(th, td) .subject {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
}
.table tbody tr :is(th, td) .subject span:hover {
    color: var(--primary-600);
}
.table tbody tr :is(th, td) .subject .new {
    color: var(--red-600);
    font-size: 13px;
    font-weight: 700;
}
.table tfoot {
    position: relative;
}
.table tfoot :is(th, td) {
    position: relative;
    padding: 4px 8px;
    height: 32px;
    font-weight: 500;
    color: var(--t-f-text);
    text-align: center;
    border-style: solid;
    border-color: var(--t-f-t-br);
    background-color: var(--t-f-bg);
}
.table tfoot :is(th, td)::before {
    top: -1px;
    border-top-width: 1px;
    border-top-style: solid;
    border-bottom-width: 0px;
    --bg-opacity: 0;
    border-color: var(--t-f-br);
}
.table tfoot tr.is-thick :is(th, td) {
    color: var(--t-f-tk-text);
    background-color: var(--t-f-tk-bg);
}



.table tfoot :is(th, td).cell-thick {
    color: var(--t-f-t-text);
    border-color: var(--t-f-t-br);
    background-color: var(--t-f-t-bg);
}
.table tfoot :is(th, td).cell-thick::before {
    border-color: var(--t-f-t-br);
}
.table tfoot tr.is-thick :is(th, td).cell-thick {
    color: var(--t-f-t-tk-text);
    background-color: var(--t-f-t-tk-bg);
}

.table tfoot tr :is(th, td)[class*="cell-"]::after {
    background-color: var(--t-f-t-br);
}
.table tfoot tr.is-thick :is(th, td)[class*="cell-"]::after {
    background-color: var(--t-f-t-tk-br);
}


.table-line {
    border-right-width: 1px !important;
    border-right-color: var(--table-br);
    border-left-width: 1px !important;
    border-left-color: var(--table-br) !important;
}

.table-line :is(th, td) {
    border-width: 0px 1px 0px 1px !important;
}

.table-line :is(th, td):first-child {
    border-left-width: 0px !important;
}
.table-line :is(th, td):last-child {
    border-right-width: 0px !important;
}
.table-line :is(th, td).r-line:last-child {
    border-right-width: 1px !important;
}
.table-line :is(th, td).r-line:last-child::after {
    display: block;
}

.table-line :is(th, td)::after {
    content: "";
    position: absolute;
    top: 0;
    right: -1px;
    width: 1px;
    height: 100%;
    background-color: var(--t-b-br);
}
.table-line thead th::after {
    background-color: var(--t-h-br);
}
.table-line tbody tr :is(th, td),
.table-line tbody tr:hover :is(th, td) {
    border-color: var(--t-b-br);
}
.table-line tfoot :is(th, td)::after {
    background-color: var(--t-f-br);
}

.table-list thead th.sorting {
    padding-right: 20px;
}
.table-list thead th.sorting::before {
    --bg-opacity: 0;
}
.table-list thead th:is(.asc,.desc).sorting,
.table-list thead th:not(:has(.sort)).sorting {
    background-color: var(--t-h-s-bg);
}
.table-list thead th:is(.asc,.desc).sorting::before,
.table-list thead th:not(:has(.sort)).sorting::before {
    --bg-opacity: var(--t-h-s-bg-op);
}
.table-list thead th .sort {
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    cursor: pointer;
    width: 16px;
    height: 100%;
    line-height: 12px;
    overflow: hidden;
}
.table-list thead th.sorting .sort:before,
.table-list thead th.sorting .sort:after {
    position: absolute;
    left: -4px;
    font-family: "Material Icons Round";
    font-weight: 400;
    color: var(--slate-400);
    font-size: var(--i-middle);
    text-rendering: auto;
    vertical-align: middle;
    height: 8px;
    line-height: 8px;
    transition: all 0.3s ease;
}
.table-list thead th.sorting .sort:before {
    top: 50%;
    content: "\e5c5";
}
.table-list thead th.sorting .sort:after {
    bottom: 50%;
    content: "\e5c7";
}
.table-list thead th.sorting .sort:hover:before,
.table-list thead th.sorting .sort:hover:after {
    color: var(--slate-500);
}
.table-list thead th.sorting.desc:not(.asc) .sort:after,
.table-list thead th.sorting.asc:not(.desc) .sort:before {
    color: var(--primary-500);
}
.table-list thead th.sorting.desc:not(.asc) .sort:hover:after,
.table-list thead th.sorting.asc:not(.desc) .sort:hover:before {
    color: var(--primary-600);
}
.table-list tbody tr:hover,
.table-list tfoot tr:hover {
    cursor: pointer;
}
.table-list tbody tr:hover :is(th, td) {
    color: var(--t-b-h-text);
}
.table-list tbody tr :is(th, td)::before,
.table-list tbody tr:hover :is(th, td)::before {
    background-color: rgba(var(--white-rgb), var(--bg-opacity));
}

.table-list tbody :is(th, td)::before {
    --bg-opacity: 1;
}
.table tbody :is(th, td):is([class*="cell-"])::before {
    --bg-opacity: .75;
}


.table-list tbody tr:not([class*="is-"]):nth-child(odd) :is(th, td)[class*="cell-"]::before {
    --bg-opacity: .75;
}
.table-list tbody tr:not([class*="is-"]):nth-child(odd):hover :is(th, td)::before {
    --bg-opacity: .7;
}
.table-list tbody tr:not([class*="is-"]):nth-child(even) :is(th, td)::before {
    --bg-opacity: .65;
}
.table-list tbody tr:not([class*="is-"]):nth-child(even):hover :is(th, td)::before {
    --bg-opacity: .6;
}
/*
.table-list tbody tr:not([class*="is-"]):nth-child(odd) :is(th, td).sorting::before {
    --bg-opacity: .75;
}
.table-list tbody tr:not([class*="is-"]):nth-child(odd):hover :is(th, td).sorting::before {
    --bg-opacity: .7;
}
.table-list tbody tr:not([class*="is-"]):nth-child(even) :is(th, td).sorting::before {
    --bg-opacity: .65;
}
.table-list tbody tr:not([class*="is-"]):nth-child(even):hover :is(th, td).sorting::before {
    --bg-opacity: .6;
}
*/
.table-list tbody tr.is-pinned:nth-child(odd) :is(th, td)::before {
    --bg-opacity: .55;
}
.table-list tbody tr.is-pinned:nth-child(odd):hover :is(th, td)::before {
    --bg-opacity: .5;
}
.table-list tbody tr.is-pinned:nth-child(even) :is(th, td)::before {
    --bg-opacity: .45;
}
.table-list tbody tr.is-pinned:nth-child(even):hover :is(th, td)::before {
    --bg-opacity: .4;
}

.table-list tbody tr.is-pinned:nth-child(odd) :is(th, td).sorting::before {
    --bg-opacity: .55;
}
.table-list tbody tr.is-pinned:nth-child(odd):hover :is(th, td).sorting::before {
    --bg-opacity: .5;
}
.table-list tbody tr.is-pinned:nth-child(even) :is(th, td).sorting::before {
    --bg-opacity: .45;
}
.table-list tbody tr.is-pinned:nth-child(even):hover :is(th, td).sorting::before {
    --bg-opacity: .4;
}

.table-list tbody tr.is-selected:nth-child(odd) :is(th, td)::before,
.table-list tbody tr.is-selected:nth-child(even) :is(th, td)::before {
    --bg-opacity: .55;
}
.table-list tbody tr.is-selected:nth-child(odd):hover :is(th, td)::before,
.table-list tbody tr.is-selected:nth-child(even):hover :is(th, td)::before {
    --bg-opacity: .5;
}

.table-list tbody tr.is-selected:nth-child(odd) :is(th, td).sorting::before,
.table-list tbody tr.is-selected:nth-child(even) :is(th, td).sorting::before {
    --bg-opacity: .45;
}
.table-list tbody tr.is-selected:nth-child(odd):hover :is(th, td).sorting::before,
.table-list tbody tr.is-selected:nth-child(even):hover :is(th, td).sorting::before {
    --bg-opacity: .4;
}

.table-list tbody tr.is-pressed:nth-child(odd) :is(th, td)::before,
.table-list tbody tr.is-pressed:nth-child(even) :is(th, td)::before {
    --bg-opacity: .55;
}
.table-list tbody tr.is-pressed:nth-child(odd):hover :is(th, td)::before,
.table-list tbody tr.is-pressed:nth-child(even):hover :is(th, td)::before {
    --bg-opacity: .5;
}

.table-list tbody tr.is-pressed:nth-child(odd) :is(th, td).sorting::before,
.table-list tbody tr.is-pressed:nth-child(even) :is(th, td).sorting::before {
    --bg-opacity: .45;
}
.table-list tbody tr.is-pressed:nth-child(odd):hover :is(th, td).sorting::before,
.table-list tbody tr.is-pressed:nth-child(even):hover :is(th, td).sorting::before {
    --bg-opacity: .4;
}


.table-list tbody tr :is(th, td).is-edit::before {
    --bg-opacity: 0 !important;
}

.table-list tbody tr.is-pinned:nth-child(odd) :is(th, td)[class*="cell-"]::before {
    --bg-opacity: .55;
}
.table-list tbody tr.is-pinned:nth-child(odd):hover :is(th, td)[class*="cell-"]::before {
    --bg-opacity: .5;
}
.table-list tbody tr.is-pinned:nth-child(even) :is(th, td)[class*="cell-"]::before {
    --bg-opacity: .45;
}
.table-list tbody tr.is-pinned:nth-child(even):hover :is(th, td)[class*="cell-"]::before {
    --bg-opacity: .4;
}
/*
.table-list tbody tr.is-pinned:nth-child(odd) :is(th, td).sorting[class*="cell-"]::before {
    --bg-opacity: .55;
}
.table-list tbody tr.is-pinned:nth-child(odd):hover :is(th, td).sorting[class*="cell-"]::before {
    --bg-opacity: .5;
}
.table-list tbody tr.is-pinned:nth-child(even) :is(th, td).sorting[class*="cell-"]::before {
    --bg-opacity: .45;
}
.table-list tbody tr.is-pinned:nth-child(even):hover :is(th, td).sorting[class*="cell-"]::before {
    --bg-opacity: .4;
}
.table-list tbody tr.is-selected:nth-child(odd) :is(th, td)[class*="cell-"]::before,
.table-list tbody tr.is-selected:nth-child(even) :is(th, td)[class*="cell-"]::before {
    --bg-opacity: .35;
}
.table-list tbody tr.is-selected:nth-child(odd):hover :is(th, td)[class*="cell-"]::before,
.table-list tbody tr.is-selected:nth-child(even):hover :is(th, td)[class*="cell-"]::before {
    --bg-opacity: .3;
}

.table-list tbody tr.is-selected:nth-child(odd) :is(th, td).sorting[class*="cell-"]::before,
.table-list tbody tr.is-selected:nth-child(even) :is(th, td).sorting[class*="cell-"]::before {
    --bg-opacity: .25;
}
.table-list tbody tr.is-selected:nth-child(odd):hover :is(th, td).sorting[class*="cell-"]::before,
.table-list tbody tr.is-selected:nth-child(even):hover :is(th, td).sorting[class*="cell-"]::before {
    --bg-opacity: .2;
}

.table-list tbody tr.is-pressed:nth-child(odd) :is(th, td)[class*="cell-"]::before,
.table-list tbody tr.is-pressed:nth-child(even) :is(th, td)[class*="cell-"]::before {
    --bg-opacity: .15;
}
.table-list tbody tr.is-pressed:nth-child(odd):hover :is(th, td)[class*="cell-"]::before,
.table-list tbody tr.is-pressed:nth-child(even):hover :is(th, td)[class*="cell-"]::before {
    --bg-opacity: .1;
}

.table-list tbody tr.is-pressed:nth-child(odd) :is(th, td).sorting[class*="cell-"]::before,
.table-list tbody tr.is-pressed:nth-child(even) :is(th, td).sorting[class*="cell-"]::before {
    --bg-opacity: .05;
}
.table-list tbody tr.is-pressed:nth-child(odd):hover :is(th, td).sorting[class*="cell-"]::before,
.table-list tbody tr.is-pressed:nth-child(even):hover :is(th, td).sorting[class*="cell-"]::before {
    --bg-opacity: 0;
}
*/
.table tbody tr :is(th, td) {
    background-color: var(--t-b-bg);
}
.table-list tbody tr:hover :is(th, td) {
    background-color: var(--t-b-h-bg);
}
/*
.table-list tbody tr :is(th, td).sorting,
.table-list tbody tr:hover :is(th, td).sorting {
    background-color: var(--t-b-s-bg);
}
.table-list tbody tr :is(th, td).sorting::before,
.table-list tbody tr:hover :is(th, td).sorting::before {
    border-color: var(--t-b-s-br);
}
.table-line tbody tr :is(th, td).sorting::before,
.table-line tbody tr:hover :is(th, td).sorting::before {
    left: -1px;
    width: calc(100% + 1px);
    border-left-width: 1px;
    border-left-style: solid;
}
*/
.table tbody tr[class*="is-"] :is(th, td),
.table-list tbody tr[class*="is-"]:hover :is(th, td) {
    background-color: var(--t-is-bg);
}
.table tbody tr[class*="is-"] :is(th, td)::before,
.table-list tbody tr[class*="is-"]:hover :is(th, td)::before {
    border-color: var(--t-is-br);
}
/*
.table-list tbody tr[class*="is-"] :is(th, td).sorting,
.table-list tbody tr[class*="is-"]:hover :is(th, td).sorting {
    background-color: var(--t-is-s-bg);
}
.table-list tbody tr[class*="is-"] :is(th, td).sorting::before,
.table-list tbody tr[class*="is-"]:hover :is(th, td).sorting::before {
    border-color: var(--t-is-s-br);
}
*/
.table-list tbody tr[class*="is-"] :is(th, td)::after {
    background-color: var(--t-is-br);
}
.table-list tbody tr[class*="is-"] :is(th, td).sorting::after {
    background-color: var(--t-is-s-br);
}


.table tbody tr:not([class*="is-"]) :is(th, td)[class*="cell-thick-"]::before,
.table-list tbody tr:not([class*="is-"]):nth-child(odd) :is(th, td)[class*="cell-thick-"]::before {
    --bg-opacity: .3;
}
.table-list tbody tr:not([class*="is-"]):nth-child(odd):hover :is(th, td)[class*="cell-thick-"]::before {
    --bg-opacity: .28;
}
.table-list tbody tr:not([class*="is-"]):nth-child(even) :is(th, td)[class*="cell-thick-"]::before {
    --bg-opacity: .26;
}
.table-list tbody tr:not([class*="is-"]):nth-child(even):hover :is(th, td)[class*="cell-thick-"]::before {
    --bg-opacity: .24;
}
/*
.table-list tbody tr:not([class*="is-"]):nth-child(odd) :is(th, td)[class*="cell-thick-"].sorting::before {
    --bg-opacity: .3;
}
.table-list tbody tr:not([class*="is-"]):nth-child(odd):hover :is(th, td)[class*="cell-thick-"].sorting::before {
    --bg-opacity: .28;
}
.table-list tbody tr:not([class*="is-"]):nth-child(even) :is(th, td)[class*="cell-thick-"].sorting::before {
    --bg-opacity: .26;
}
.table-list tbody tr:not([class*="is-"]):nth-child(even):hover :is(th, td)[class*="cell-thick-"].sorting::before {
    --bg-opacity: .24;
}
*/
.table-list tbody tr.is-pinned:nth-child(odd) :is(th, td)[class*="cell-thick-"]::before {
    --bg-opacity: .22;
}
.table-list tbody tr.is-pinned:nth-child(odd):hover :is(th, td)[class*="cell-thick-"]::before {
    --bg-opacity: .2;
}
.table-list tbody tr.is-pinned:nth-child(even) :is(th, td)[class*="cell-thick-"]::before {
    --bg-opacity: .18;
}
.table-list tbody tr.is-pinned:nth-child(even):hover :is(th, td)[class*="cell-thick-"]::before {
    --bg-opacity: .16;
}
/*
.table-list tbody tr.is-pinned:nth-child(odd) :is(th, td)[class*="cell-thick-"].sorting::before {
    --bg-opacity: .22;
}
.table-list tbody tr.is-pinned:nth-child(odd):hover :is(th, td)[class*="cell-thick-"].sorting::before {
    --bg-opacity: .2;
}
.table-list tbody tr.is-pinned:nth-child(even) :is(th, td)[class*="cell-thick-"].sorting::before {
    --bg-opacity: .18;
}
.table-list tbody tr.is-pinned:nth-child(even):hover :is(th, td)[class*="cell-thick-"].sorting::before {
    --bg-opacity: .16;
}
*/
.table-list tbody tr.is-selected:nth-child(odd) :is(th, td)[class*="cell-thick-"]::before,
.table-list tbody tr.is-selected:nth-child(even) :is(th, td)[class*="cell-thick-"]::before {
    --bg-opacity: .14;
}
.table-list tbody tr.is-selected:nth-child(odd):hover :is(th, td)[class*="cell-thick-"]::before,
.table-list tbody tr.is-selected:nth-child(even):hover :is(th, td)[class*="cell-thick-"]::before {
    --bg-opacity: .12;
}
/*
.table-list tbody tr.is-selected:nth-child(odd) :is(th, td)[class*="cell-thick-"].sorting::before,
.table-list tbody tr.is-selected:nth-child(even) :is(th, td)[class*="cell-thick-"].sorting::before {
    --bg-opacity: .10;
}
.table-list tbody tr.is-selected:nth-child(odd):hover :is(th, td)[class*="cell-thick-"].sorting::before,
.table-list tbody tr.is-selected:nth-child(even):hover :is(th, td)[class*="cell-thick-"].sorting::before {
    --bg-opacity: .08;
}
*/

.table-list tbody tr.is-pressed:nth-child(odd) :is(th, td)[class*="cell-thick-"]::before,
.table-list tbody tr.is-pressed:nth-child(even) :is(th, td)[class*="cell-thick-"]::before {
    --bg-opacity: .06;
}
.table-list tbody tr.is-pressed:nth-child(odd):hover :is(th, td)[class*="cell-thick-"]::before,
.table-list tbody tr.is-pressed:nth-child(even):hover :is(th, td)[class*="cell-thick-"]::before {
    --bg-opacity: .04;
}
/*
.table-list tbody tr.is-pressed:nth-child(odd) :is(th, td)[class*="cell-thick-"].sorting::before,
.table-list tbody tr.is-pressed:nth-child(even) :is(th, td)[class*="cell-thick-"].sorting::before {
    --bg-opacity: .02;
}
.table-list tbody tr.is-pressed:nth-child(odd):hover :is(th, td)[class*="cell-thick-"].sorting::before,
.table-list tbody tr.is-pressed:nth-child(even):hover :is(th, td)[class*="cell-thick-"].sorting::before {
    --bg-opacity: 0;
}
*/
.table-scroll {
    display: inline-block !important;
    width: 100%;
    overflow: auto;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    -webkit-overflow-scrolling:touch;
}
.table-scroll :is(th, td).sticky {
    --sticky-left: 0px;
    left: var(--sticky-left);
    position: sticky;
    z-index: 3;
}
.table-scroll :is(th, td).r-sticky {
    --sticky-right: 0px;
    right: var(--sticky-right);
    position: sticky;
    border-left-width: 1px !important;
    z-index: 3;
}
.table-scroll :is(th, td).r-sticky::after {
    left: -1px;
}
.table-scroll :is(th, td).is-line::after {
    z-index:2;
}
.table-scroll thead.head-sticky {
    position: sticky;
    inset-block-start: 0;
    box-shadow: var(--t-shadow);
    z-index:6;
}
.table-scroll thead th.is-line::after {
    background-color: var(--t-h-line) !important;
}
.table-scroll thead th[class*="cell-thick"].is-line::after {
    background-color: var(--t-h-tk-line) !important;
}
.table-scroll tbody :is(th, td).is-line::after {
    background-color: var(--t-b-line) !important;
}
.table-scroll tbody :is(th, td)[class*="cell-thick"].is-line::after {
    background-color: var(--t-b-tk-line) !important;
}
.table-scroll tfoot.foot-sticky {
    position: sticky;
    inset-block-end: 0;
    box-shadow: var(--f-shadow);
    z-index: 5;
}
.table-scroll tfoot.foot-sticky::before {
    content: "";
    position: absolute;
    left: 0;
    top: -1px;
    width: 100%;
    height: 1px;
    background-color: var(--t-f-s-br);
    z-index: 6;
}
.table-scroll tfoot :is(th, td).is-line::after {
    background-color: var(--t-f-line) !important;
}
.table-scroll tfoot :is(th, td)[class*="cell-thick"].is-line::after {
    background-color: var(--t-f-tk-line) !important;
}

.table thead th[class*="cell-"]::before {
    --bg-opacity: var(--t-h-bg-op);
}
.table-list thead th[class*="cell-"].sorting:not(.asc,.desc) {
    background-color: var(--t-h-bg);
}

.table-line thead th[class*="cell-"].sorting:not(.asc,.desc)::after {
    background-color: var(--t-h-br);
}

.table-list:not(.table-line):not(.table-scroll) thead th:is(.asc,.desc).sorting {
    background-color: var(--t-h-bg);
}

.table-list:not(.table-line):not(.table-scroll) thead th:is(.asc,.desc).sorting::before {
    border-color: var(--t-b-br);
    --bg-opacity: var(--t-h-bg-op);
}

.table-list.table-line thead th.sorting .sort::before
.table-list.table-line thead th.sorting .sort::after
.table-list.table-scroll thead th.sorting .sort::before
.table-list.table-scroll thead th.sorting .sort::after {
    color: var(--slate-400);
}

.table-line.table-list.table-scroll :is(th, td):not(.r-sticky):last-child::after {
    display: none;
}



.table-line :is(th, td)[class*="cell-"]::before {
    left: -1px;
    width: calc(100% + 1px);
    border-left-width: 1px;
    border-left-style: solid;
}

.table thead th[class*="cell-"] {
    background-color: var(--t-h-cell-bg);
}
.table:not(.table-list) thead th[class*="cell-thick-"],
.table-line thead th[class*="cell-thick-"] {
    color: var(--t-h-thick-text);
}
.table thead th[class*="cell-"]::before {
    border-color: var(--t-h-cell-br);
}
.table-line thead th.sorting:not(.asc, .desc)[class*="cell-"]::before {
    border-color: var(--t-b-br);
}
.table-line thead th:is(.asc, .desc)[class*="cell-"]::before {
    border-color: var(--t-h-s-cell-br);
}
.table-line thead th[class*="cell-"]::after {
    background-color: var(--t-h-cell-br);
}
.table-list thead th:is(.asc, .desc)[class*="cell-"] {
    background-color: var(--t-h-s-cell-bg);
}
.table-list thead th:is(.asc, .desc)[class*="cell-"]::before {
    border-color: var(--t-h-s-cell-br);
}
.table-list thead th:is(.asc, .desc)[class*="cell-"]::after {
    background-color: var(--t-h-s-cell-br);
}
.table-list thead th:is(.asc, .desc)[class*="cell-"] .sort::before,
.table-list thead th:is(.asc, .desc)[class*="cell-"] .sort::after {
    color: var(--t-h-s-i);
}
.table-list thead th:is(.asc, .desc)[class*="cell-"] .sort:hover::before,
.table-list thead th:is(.asc, .desc)[class*="cell-"] .sort:hover::after {
    color: var(--t-h-s-i-h);
}
.table-list thead th.asc:not(.desc)[class*="cell-"] .sort::before,
.table-list thead th.desc:not(.asc)[class*="cell-"] .sort::after {
    color: var(--t-h-s-i-a);
}
.table-list thead th.asc:not(.desc)[class*="cell-"] .sort:hover::before,
.table-list thead th.desc:not(.asc)[class*="cell-"] .sort:hover::after {
    color: var(--t-h-s-i-a-h);
}

.table-list:not(.table-line) thead th:is(.asc, .desc)[class*="cell-thick-"] .sort::before,
.table-list:not(.table-line) thead th:is(.asc, .desc)[class*="cell-thick-"] .sort::after {
    color: var(--t-h-s-i-);
}
.table-list:not(.table-line) thead th:is(.asc, .desc)[class*="cell-thick-"] .sort:hover::before,
.table-list:not(.table-line) thead th:is(.asc, .desc)[class*="cell-thick-"] .sort:hover::after {
    color: var(--t-h-s-i-h-);
}
.table-list:not(.table-line) thead th.asc:not(.desc)[class*="cell-thick-"] .sort::before,
.table-list:not(.table-line) thead th.desc:not(.asc)[class*="cell-thick-"] .sort::after {
    color: var(--t-h-s-i-a-);
}
.table-list:not(.table-line) thead th.asc:not(.desc)[class*="cell-thick-"] .sort:hover::before,
.table-list:not(.table-line) thead th.desc:not(.asc)[class*="cell-thick-"] .sort:hover::after {
    color: var(--t-h-s-i-a-h-);
}

.table tbody tr :is(th, td)[class*="cell-"],
.table-list tbody tr:hover :is(th, td)[class*="cell-"] {
    background-color: var(--t-b-cell-bg);
}
.table tbody tr :is(th, td)[class*="cell-thick-"],
.table-list tbody tr:hover :is(th, td)[class*="cell-thick-"] {
    color: var(--t-b-tk-text);
}
.table-line tbody tr :is(th, td)[class*="cell-"],
.table-line tbody tr:hover :is(th, td)[class*="cell-"] {
    border-color: var(--t-b-cell-br);
}
.table tbody tr :is(th, td)[class*="cell-"]::before,
.table-list tbody tr:hover :is(th, td)[class*="cell-"]::before {
    border-color: var(--t-b-cell-br);
}
.table-line tbody tr :is(th, td)[class*="cell-"]::after,
.table-line tbody tr:hover :is(th, td)[class*="cell-"]::after {
    background-color: var(--t-b-cell-br);
}
/*
.table-list tbody tr :is(th, td).sorting[class*="cell-"],
.table-list tbody tr:hover :is(th, td).sorting[class*="cell-"] {
    background-color: var(--t-b-s-cell-bg);
}
.table-line tbody tr :is(th, td).sorting[class*="cell-"],
.table-line tbody tr:hover :is(th, td).sorting[class*="cell-"] {
    border-color: var(--t-b-s-cell-br);
}
.table-list tbody tr :is(th, td).sorting[class*="cell-"]::before,
.table-list tbody tr:hover :is(th, td).sorting[class*="cell-"]::before {
    border-color: var(--t-b-s-cell-br);
}
.table-line tbody tr :is(th, td).sorting[class*="cell-"]::after,
.table-line tbody tr:hover :is(th, td).sorting[class*="cell-"]::after {
    background-color: var(--t-b-s-cell-br);
}
*/

.board-list thead th {
    height: 42px;
}
/*
.board-list tbody tr :is(th, td).sorting {
    background-color: var(--white);
}
.board-list tbody tr:nth-child(even) :is(th, td).sorting {
    background-color: var(--t-b-bg);
}
.board-list tbody tr:hover :is(th, td).sorting,
.board-list tbody tr:nth-child(even):hover :is(th, td).sorting{
    background-color: var(--t-b-h-bg);
}
.board-list tbody tr[class*="is-"] :is(th, td).sorting,
.board-list tbody tr[class*="is-"]:hover :is(th, td).sorting {
    background-color: var(--t-is-bg);
}
.board-list tbody tr[class*="is-"] :is(th, td).sorting::before,
.board-list tbody tr[class*="is-"]:hover :is(th, td).sorting::before {
    border-color: var(--t-is-br);
}
.board-list tbody tr.is-pressed:nth-child(odd) :is(th, td).sorting::before,
.board-list tbody tr.is-pressed:nth-child(even) :is(th, td).sorting::before {
    --bg-opacity: .5;
}
.board-list tbody tr.is-pressed:nth-child(odd):hover :is(th, td).sorting::before,
.board-list tbody tr.is-pressed:nth-child(even):hover :is(th, td).sorting::before {
    --bg-opacity: .5;
}
*/

.accordion-list {
    display:flex;
    flex-direction: column;
    width:100%;
    border-top: 1px solid var(--slate-500);
}
.accordion-list .accordion-item {
    border-top: 0;
}
.accordion-item {
    display:flex;
    flex-direction: column;
    width:100%;
    border-top: 1px solid var(--slate-300);
    border-bottom: 1px solid var(--slate-300);
    overflow: hidden;
}
.accordion-item .title {
    display:flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    min-height: 41px;
    padding: 8px 12px;
    width: 100%;
}
.accordion-item .title:hover {
    --bg-opacity: .55;
    background-color: rgba(var(--slate-100-rgb), var(--bg-opacity));
}
.accordion-item .title .subject {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    width: 100%;
    overflow: hidden;
}
.accordion-item .title .subject span {
    cursor: pointer;
    padding: 2px 0;
}
.accordion-item .title .subject span:hover {
    color:var(--primary-600);
}
.accordion-item .title .icon {
    width: var(--i-small);
    height: var(--i-small);
    line-height: var(--i-small);
    transition: 0.2s ease-in;
    cursor: pointer;
}
.accordion-item .title .icon::before {
    content: "\e313";
    line-height: var(--i-small);
    font-size: var(--i-small);
    color: var(--slate-400);
}
.accordion-item .title:hover .icon::before {
    color:var(--slate-500);
}
.accordion-item .accordion-content {
    display:grid;
    grid-template-rows:0fr;
    padding: 0 12px 0 12px;
    overflow:hidden;
    transition:grid-template-rows 300ms ease;
}
.accordion-item .accordion-content .accordion-inner {
    min-height:0;
    overflow: hidden;
}
.accordion-item .accordion-content.open {
    grid-template-rows:1fr;
    padding:12px;
}
.accordion-item .accordion-content img {
    margin: 8px 0;
    width: auto;
    height: auto;
    max-width: 100%;
}
.accordion-item.current .title:hover {
    background-color: var(--white);
}
.accordion-item.current .title .subject span {
    color: var(--slate-800);
    font-weight: 500;
    white-space: normal;
}
.accordion-item.current .title .icon::before {
    color: var(--primary-600);
    content: "\e316";
}
.accordion-item.box-item.invalid {
    background-color:transparent !important;
    border-radius:var(--c-radius,8px);
    box-sizing:border-box;
}
.accordion-item.box-item.invalid:hover,
.accordion-item.box-item.invalid:focus,
.accordion-item.box-item.invalid:focus-within {
    background-color:transparent !important;
    box-shadow: none !important;
}
.accordionbox-list {
    display:flex;
    flex-direction: column;
    gap: 10px;
    width:100%;
}
.accordion-item.box-item {
    border-radius: var(--c-radius);
    border: 1px solid var(--slate-300);
}
.accordion-item.box-item:hover {
    border-color: var(--slate-400);
}
.accordion-item.box-item.current {
    border-color: var(--slate-400);
}
.faq-list {
    width:100%;
    border-top: 1px solid var(--table-t-br);
}
.faq-list.is-scroll {
    border-bottom: 1px solid var(--table-b-br);
}
.faq-list > ul {
    position:relative;
    display:flex;
    flex-direction: column;
    width:100%;
}
.faq-list > ul > li {
    display:flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
}
.faq-list li .question-view {
    position: relative;
    display:flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    min-height: 33px;
    width: 100%;
    padding: 4px 12px 5px 12px;
    background-color: var(--white);
    z-index: 1;
}
.faq-list > ul > li .question-view::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: var(--t-b-br);
    --br-opacity: 1;
    background-color: rgba(var(--white-rgb), var(--bg-opacity));
    z-index: -1;
}
.faq-list > ul > li:not([class*="is-"]):nth-child(odd):hover .question-view::before {
    --bg-opacity: .7;
}
.faq-list > ul > li:not([class*="is-"]):nth-child(even) .question-view {
    background-color: var(--t-b-bg);
}
.faq-list > ul > li:not([class*="is-"]):nth-child(even) .question-view::before {
    --bg-opacity: .65;
}
.faq-list > ul > li:not([class*="is-"]):nth-child(even):hover .question-view::before {
    --bg-opacity: .6;
}
.faq-list > ul > li:not([class*="is-"]):hover .question-view {
    background-color: var(--t-b-h-bg);
}
.faq-list > ul > li.is-pinned:nth-child(odd) .question-view::before {
    --bg-opacity: .55;
}
.faq-list > ul > li.is-pinned:nth-child(odd):hover .question-view::before {
    --bg-opacity: .5;
}
.faq-list > ul > li.is-pinned:nth-child(even) .question-view::before {
    --bg-opacity: .45;
}
.faq-list > ul > li.is-pinned:nth-child(even):hover .question-view::before {
    --bg-opacity: .4;
}
.faq-list > ul > li.is-selected:nth-child(odd) .question-view::before,
.faq-list > ul > li.is-selected:nth-child(even) .question-view::before {
    --bg-opacity: .55;
}
.faq-list > ul > li.is-selected:nth-child(odd):hover .question-view::before,
.faq-list > ul > li.is-selected:nth-child(even):hover .question-view::before {
    --bg-opacity: .5;
}

.faq-list > ul > li.is-pressed:nth-child(odd) .question-view::before,
.faq-list > ul > li.is-pressed:nth-child(even) .question-view::before {
    --bg-opacity: .55;
}
.faq-list > ul > li.is-pressed:nth-child(odd):hover .question-view::before,
.faq-list > ul > li.is-pressed:nth-child(even):hover .question-view::before {
    --bg-opacity: .5;
}
.faq-list > ul > li.is-pinned .question-view {
    background-color: var(--t-is-bg);
}
.faq-list > ul > li.is-pinned .question-view::before {
    border-bottom-color: var(--t-is-br);
}
.faq-list > ul > li.is-selected .question-view {
    background-color: var(--t-is-bg);
}
.faq-list > ul > li.is-selected .question-view::before {
    border-bottom-color: var(--t-is-br);
}
.faq-list li .question {
    display:flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    width: 100%;
}
.faq-list li .qa {
    font-weight:700;
    font-size: 20px;
    line-height: 1;
    color:var(--slate-500);
}
.faq-list li .cate {
    white-space: nowrap;
    font-weight: 500;
    color: var(--primary-600);
}
.faq-list li .subject {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    width: 100%;
    overflow: hidden;
}
.faq-list li .subject span {
    cursor: pointer;
    padding: 6px 0;
    line-height: 20px;
}
.faq-list li .subject span:hover {
    color:var(--slate-900);
}
.faq-list li .question-view .icon {
    width: var(--i-small);
    height: var(--i-small);
    line-height: var(--i-small);
    transition: 0.2s ease-in;
    cursor: pointer;
}
.faq-list li .question-view .icon::before {
    content: "\e313";
    line-height: var(--i-small);
    font-size: var(--i-small);
    color: var(--slate-400);
}
.faq-list li:hover .question-view .icon::before  {
    color:var(--slate-500);
}
.faq-list li .answer-view {
    width: 100%;
    border-bottom: 1px solid var(--t-b-br);
}
.faq-list li .answer-subject {
    display:flex;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
}
.faq-list li .answer-subject .subject {
    color: var(--slate-700);
}
.faq-list li .answer-wrap {
    display:flex;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
    padding:12px;
}
.faq-list li .answer-wrap .answer {
    position:relative;
    flex-direction: column;
    display: flex;
    gap: 12px;
    width: 100%;
}
.faq-list li .answer-view .answer-content img {
    margin: 8px 0;
    width: auto;
    height: auto;
    max-width: 100%;
}
.faq-list li .answer .link-list li:first-child {
    border-top: 1px solid var(--slate-300);
}

.faq-list > ul > li.is-pressed .question-view {
    background-color: var(--t-is-bg);
}
.faq-list > ul > li.is-pressed .question-view::before {
    border-bottom-color: var(--t-is-br);
}
.faq-list li.is-pressed .question-view .q {
    color: var(--primary);
}
.faq-list li.is-pressed .answer-view .a {
    color: var(--red-400);
}
.faq-list li.is-pressed .question-view .subject span {
    font-weight: 500;
    white-space: normal;
}
.faq-list li.is-pressed .question-view .icon::before {
    color: var(--primary-600);
    content: "\e316";
}
.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    width: 100%;
    text-align: center;
}
.pagination span {
    display: inline-block;
    cursor: pointer;
    padding: 0 8px;
    min-width: 32px;
    height: 32px;
    font-size: var(--font-size);
    line-height: 30px;
    color: var(--slate-700);
    text-decoration: none !important;
    border-radius: 4px;
    border: solid 1px var(--white);
    transition: all 0.3s ease;
}
.pagination span.i-left {
    margin-right: 6px
}
.pagination span.i-right {
    margin-left: 6px
}
.pagination span.icon {
    min-width: var(--i-small);
    padding: 0;
}
.pagination span.icon::before {
    color: var(--slate-400);
    font-size: var(--i-small);
    line-height: 30px;
}
.pagination span.icon:hover {
    border-color: var(--white);
}
.pagination span:hover {
    color: var(--primary-600);
}
.pagination span:hover::before {
    color: var(--primary-600);
}
.pagination span[aria-disabled="true"] {
    cursor: not-allowed;
    border-color: var(--white);
}
.pagination span[aria-disabled="true"]::before {
    color: var(--slate-300);
}
.pagination span.current {
    color: var(--white) !important;
    border-color: var(--primary-600);
    font-weight: 700;
    display: inline-block;
    background-color: var(--primary-500);
}
.table-form .th-width {
    min-width: var(--th-width);
    width: var(--th-width) !important;
}
.table-form th label {
    display: inline-block;
    font-weight: 500;
}
.table-form tbody th {
    text-align: left !important;
    /*
    width: var(--th-width);
    min-width: var(--th-width);
    */
    word-break: keep-all;
    color: var(--slate-700);
    font-weight: 700;
    border-color: var(--slate-200);
}
.table-form tbody th::before {
    border-bottom-color: var(--slate-200);
    background-color: var(--slate-50) !important;
}
.table-form tbody td::before {
    border-bottom-color: var(--slate-200);
}
.table-form > table:last-of-type tbody tr:last-child :is(th, td)::before {
    border-bottom-width: 0;
}
.table-form tbody th label em::before {
    display: none;
}
.table-form tbody td {
    text-align: left !important;
    border-right: 0;
    padding: 6px 8px;
    border-color: var(--slate-200) !important;
}
.table-form tbody td .form-file {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    gap: 8px;
    position: relative;
    width: 100%;
}
.table-form tbody td .file-upload {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}
.table-form tbody td .file-upload .file-input-textbox[type="text"] {
    float: left;
    width: calc(100% - 80px);
    height: 32px;
    overflow: hidden;
    text-overflow: ellipsis;
    border-right-width: 0;
    border-radius: 4px 0 0 4px !important;
    background-color: var(--white);
}
.table-form tbody td .file-upload .file-input-div {
    position: absolute;
    padding: 0;
    height: 32px;
    right: 0;
    left: 0;
}
.table-form tbody td .file-upload .file-input-div .btn {
    position: absolute;
    right: 0;
    width: 80px !important;
    border-radius: 0 4px 4px 0 !important;
}
.table-form tbody td .file-upload .file-input-div .file-input-hidden {
    position: relative;
    left: 0;
    opacity: 0;
    padding: 0 0 0 4px;
    cursor: pointer;
}
.table-form tbody td .form-file .upload-total-delete {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.table-form tbody td .form-file .upload-total-delete .total {
    padding: 0;
    color: var(--slate-700);
}
.table-form tbody td .form-file .upload-total-delete .total .current {
    color: var(--primary-600);
    font-weight: 700;
}
.table-form tbody td .text {
    word-break: break-all;
    white-space: nowrap;
    font-size: var(--font-size);
    color: var(--slate-600);
    line-height: 18px;
    padding: 0;
}
.table-form.table-search {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 8px;
    border-bottom: 1px solid var(--slate-300);
}
.table-form.table-search th {
    padding: 8px 8px 0 8px !important;
    border-width: 0px !important;
}
.table-form.table-search td {
    padding: 8px 8px 0 8px !important;
    border-width: 0px !important;
}
.table-form.table-search tr:last-child th, .table-form.table-search tr:last-child td {
    padding-bottom: 8px !important;
}
.table-form.table-search > button {
    margin: 8px 8px 8px 0;
}

.table-form.form-basic {
    border-top-width: 0px !important;
}
.table-form.form-basic tbody tr :is(th, td) {
    padding: 0px 0px 8px 0px;
    background-color: var(--white);
}
.table-form.form-basic tbody th::before {
    border-bottom-width: 0px;
    background-color: transparent !important;
}
.table-form.form-basic tr:not(.tr-nodata) :is(th, td)::before {
    border-bottom-width: 0px;
}
.table-form.form-basic tbody tr:last-child :is(th, td) {
    padding: 0px 0px 0px 0px;
}
.file-list {
    display: flex;
    align-items: normal;
    justify-content: flex-start;
    flex-direction: column;
    gap: 4px;
    width: 100%;
}
.file-list ul {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    align-content: stretch;
    gap: 4px;
    width: 100%;
}
.file-list ul li {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-direction: column-reverse;
    gap: 4px;
    padding: 2px 4px;
    color: var(--slate-800);
    border-radius: 4px;
    border: 1px solid var(--slate-300);
}
.file-list li:hover {
    border-color: var(--slate-400);
}
.file-list .file-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    gap: 4px;
    min-height: 32px;
    width: 100%;
}
.file-list .file-info .file-name {
    flex: 1;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.file-list .icon-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
}
.file-list .icon-wrap .icon {
    position: relative;
    display: inline-block;
    width: var(--i-small);
    height: var(--i-small);
    overflow: hidden;
    font-style: normal;
    text-align: center;
    outline: none;
}
.file-list .icon-wrap .icon::before {
    position: absolute;
    top: 0;
    left: 0;
    content: "\e226";
    color: var(--slate-400);
    font-size: var(--i-small);
    line-height: var(--i-small);
    transform: rotate(45deg);
}
.file-list .file-info .btn-group {
    display: flex;
    align-items: center;
    gap: 8px !important;
    width: auto;
    margin: 0px !important;
}
.file-list .file-info .btn-group .btn:hover {
    background-color: transparent;
}
.file-list.image-file ul {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.file-list.image-file ul li {
    flex-direction: column;
    gap: 8px;
    padding: 8px;
}
.file-list.image-file ul li .thumb {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    width: 100%;
    min-height: 158px;
    border-radius: 4px;
    background-color: var(--slate-100);
}
.file-list.image-file ul li .thumb img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 150px;
}
.file-list.image-file ul li .icon-wrap {
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 1;
}
.file-list.image-file ul li .file-info {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    gap: 8px;
}
.file-list.image-file ul li .file-info .file-name {
    display: inline-block;
    padding: 0 8px;
    width: 100%;
    line-height: 1.3;
}
.file-list.image-file ul li .file-info .btn-group {
    width: 100%;
    justify-content: flex-end;
}
.file-list.image-file ul li.is-error .thumb {
    text-align: center;
    border-radius: 0;
    border-bottom: 1px solid var(--red-500);
    background-color: var(--red-50);
}
.file-list .is-error {
    border: 1px solid var(--red-500);
    background-color: var(--red-50);
}
.file-list div.is-error {
    padding: 0px 4px 0px 12px;
    border-radius: 4px;
}
.file-list .is-error:hover {
    border: 1px solid var(--red-500);
    background-color: var(--red-50);
}
.file-list .is-error .file-hint-invalid {
    position: relative;
    padding: 0 0 8px 0;
    color: var(--red-600);
}
.file-list .is-error .icon-wrap .icon::before {
    content: "\e000";
    color: var(--red-600);
    transform: rotate(0deg);
}
.file-list .is-upload {
    border: 1px solid var(--primary-500);
    background-color: var(--primary-50);
}
.file-list .is-upload:hover {
    border: 1px solid var(--primary-600);
    background-color: var(--primary-50);
}
.file-list .is-upload .icon-wrap .icon::before {
    content: "\e86c";
    color: var(--primary-600);
    transform: rotate(0deg);
}
.file-list.image-file ul li.is-upload .thumb {
    background-color: var(--white);
}
.file-list .is-deleted,
.file-list .is-deleted:hover {
    opacity: 0.65;
}
.file-list .is-deleted .file-info .file-name {
    text-decoration:line-through;
}
.file-list .is-deleted .file-info .i-cancel::before {
    content: "\e5ca";
}
.file-list.image-file ul li.is-error .file-hint-invalid {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    width: 100%;
    min-height: 158px;
    text-align: center;
    border-bottom: 1px solid var(--red-500);
}
.file-list.image-file ul li.is-error .file-hint-invalid::before {
    display: none;
}
@media all and (min-width: 1600px) {
    .file-list.image-file ul {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
.board-view {
    display: flex;
    flex-direction: column;
    width: 100%;
}
.board-view .board-head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 12px 0;
}
.board-view .board-category {
    color: var(--primary-600);
    font-weight: 500;
    font-size: 16px;
}
.board-view .board-subject {
    color: var(--slate-700);
    font-weight: 500;
    font-size: 24px;
}
.board-view .board-info {
    padding: 12px;
    font-size: var(--font-size);
    border-bottom: 1px solid var(--slate-200);
}
.board-view .board-info ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 32px;
}
.board-view .board-info li {
    display: flex;
    align-items: center;
    gap: 8px;
}
.board-view .board-info li em {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
    color: var(--slate-900);
}
.board-view .board-info li em::before {
    content: "";
    display: inline-block;
    width: 4px;
    height: 2px;
    background-color: var(--primary-600);
}
.board-view .board-info em::after {
    content: "";
    width: 1px;
    height: 8px;
    background-color: var(--slate-300);
}
.link-list {
    width: 100%;
}
.link-list ul {
    display: flex;
    align-items: normal;
    justify-content: flex-start;
    flex-direction: column;
    width: 100%;
}
.link-list ul li {
    padding: 8px 0;
    border-bottom: 1px solid var(--slate-200);
}
.link-list ul li div {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    padding: 0 12px;
}
.link-list ul li div i,
.link-list ul li div i::before {
    width: var(--i-small);
    height: var(--i-small);
    line-height: var(--i-small);
    font-size: var(--i-small);
    color: var(--slate-400);
}
.link-list ul li div span {
    color: var(--slate-800);
    cursor: pointer;
}
.link-list ul li div span:hover {
    color: var(--primary-600);
}
.link-list ul li div em {
    white-space: nowrap;
    color: var(--slate-500);
    font-size: var(--font-size);
}
.board-view .board-content {
    padding: 12px;
    font-size: var(--font-size);
}
.board-view .board-content img {
    margin: 8px 0;
    width: auto;
    height: auto;
    max-width: 100%;
}
.board-view .file-list {
    margin-bottom: 12px;
}
.board-view .board-prev-next {
    display: flex;
    flex-direction: column;
    width: 100%;
    border-top: 1px solid var(--slate-300);
}
.board-view .board-prev-next .list {
    padding: 8px 12px;
    border-bottom: 1px solid var(--slate-200);
}
.board-view .board-prev-next .list span {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
}
.board-view .board-prev-next i,
.board-view .board-prev-next i::before {
    height: var(--i-small);
    color: var(--slate-400);
    font-size: var(--i-small);
    line-height: var(--i-small);
}
.board-view .board-prev-next em {
    height: 20px;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    font-size: var(--font-size);
    cursor: pointer;
}
.board-view .board-prev-next .list em:hover {
    color: var(--primary-600);
}
.transfer-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
}
.transfer-wrap .transfer-list {
    display: flex;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}
.transfer-wrap .transfer-list .title {
    font-weight: 500;
    color: var(--slate-800);
}
.transfer-wrap .btn-wrap {
    display: flex;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
}
.transfer-wrap li {
    width: 100%;
    padding: 8px 12px;
    cursor: pointer;
    font-size: var(--font-size);
    border-bottom: 1px solid var(--slate-300);
}
.transfer-wrap li:hover {
    color: var(--slate-800);
    background-color: var(--slate-50);
}
.transfer-wrap li.selected {
    color: var(--slate-800);
    background-color: var(--slate-50);
}
.transfer-wrap li.current {
    position: relative;
    padding-right: 36px;
    color: var(--primary-600);
    background-color: var(--primary-50);
}
.transfer-wrap li.current::after {
    position: absolute;
    top: calc(50% - 10px);
    right: 12px;
    line-height: var(--i-small);
    text-align: center;
    color: var(--primary-600);
    content: "\e86c";
    font-family: "Material Icons Round";
    font-size: var(--i-small);
    text-rendering: auto;
}
.tree {
    position: relative;
    float: left;
    padding: 0 8px;
}
.tree ul {
    position: relative;
    list-style-type: none;
    font-size: var(--font-size);
    margin-left: 0;
    padding-left: 20px;
}
.tree ul li {
    position: relative;
    padding-left: 2px;
}
.tree ul li div {
    display: inline-block;
    padding: 4px 0 4px 4px;
    cursor: pointer;
}
.tree ul li div::before {
    display: block;
    content: " ";
    width: 10px;
    height: 1px;
    position: absolute;
    background-image: linear-gradient(to right, transparent 2px, var(--slate-300) 2px), linear-gradient(to bottom, transparent 2px, var(--slate-300) 2px);
    background-size: 4px 4px;
    top: 12px;
    left: -10px;
}
.tree ul li::after {
    position: absolute;
    top: 4px;
    left: -18px;
    width: 18px;
    height: 18px;
    color: var(--slate-400);
    font-family: 'Material Icons Round';
    font-size: 16px;
    line-height: 16px;
    text-rendering: auto;
    font-weight: 400;
    border-radius: 4px;
    background-position: center;
    border: 1px solid var(--slate-300);
    background-color: var(--white);
    transition: transform 0.2s ease-out;
}
.tree ul li div:hover {
    color: var(--slate-800);
    font-weight: 500;
}
.tree ul li.tree-node ul {
    transition: all .3s ease-in-out;
    overflow: hidden;
}
.tree ul li.tree-node.closed > ul {
    opacity: 0;
    max-height: 0px;
}
.tree ul li.tree-node.open > ul {
    opacity: 1;
    display: block;
}
.tree ul li.tree-node.open::after {
    content: "\e15b";
    color: var(--slate-500);
    border: 1px solid var(--slate-400);
}
.tree ul li.tree-node.current > ul {
    opacity: 1;
    display: block;
}
.tree ul li.current > div {
    color: var(--primary-600);
    font-weight: 700;
}

.tree ul li.tree-node::after {
    content: "\e145";
}
.tree ul li.tree-node.current::after {
    color: var(--white);
    border: 1px solid var(--primary-600) !important;
    background-color: var(--primary-500);
}
.tree ul li.tree-node.closed.current::after {
    content: "\e145";
}
.tree ul li.tree-node.open.current::after {
    content: "\e15b";
    color: var(--white);
}
.tree ul li::before {
    content: "";
    position: absolute;
    top: 0;
    left: -10px;
    width: 1px;
    height: 100%;
    background-image: linear-gradient(to right, transparent 2px, var(--slate-300) 2px), linear-gradient(to bottom, transparent 2px, var(--slate-300) 2px);
    background-size: 4px 4px;
}
.tree ul li:last-child::before {
    height: 12px;
}
.nodata-wrap {
    /* position: relative; */
    position: absolute;
    top: calc(50% + 18px);
    left: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: -100px;
    width: 100%;
    height: 200px;
    cursor: auto;
}
.nodata-wrap.double-head {
    top: calc(50% + 36px);
}
.nodata-wrap i::before {
    left: calc(50% - 36px);
    content: "\e88f";
    line-height: 72px;
    color: var(--slate-300);
    font-family: "Material Icons Round";
    font-size: 72px;
    vertical-align: middle;
}
.nodata-wrap span {
    width: 100%;
    text-align: center;
    color: var(--slate-500);
}
.loading-wrap {
    position: fixed;
    top: 0;
    left: 0;
    display: none;
    width: 100%;
    height: 100%;
    background-color: rgba(var(--white-rgb), .7);
    z-index: 9999;
    transition: all 0.2s ease-in-out;
    cursor: auto;
}
.loading-wrap.is-open {
    display: flex;
}
.loader-wrap {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    padding: 60px 0;
}
.loader-wrap .loader {
    position: relative;
    height: 60px;
    aspect-ratio: 2;
    border-bottom: 2px solid #0000;
    background:
            linear-gradient(90deg,var(--slate-300) 50%,#0000 0)
            -25% 100%/50% 2px repeat-x border-box;
    animation: line 1s linear infinite;
}
.loader-wrap .loader:before {
    content: "";
    position: absolute;
    inset: auto 42.5% 0;
    aspect-ratio: 1;
    border-radius: 50%;
    background-image: linear-gradient(270deg, var(--primary-600), var(--primary-300));
    background-size: 400% 100%;
    animation: jump 1s cubic-bezier(0,900,1,900) infinite, bg 2s infinite;
}
.loader-wrap .text {
    position: relative;
    font-size: var(--font-size);
    color: var(--slate-300);
    letter-spacing: 2px;
}
.loader-wrap .text span {
    position: absolute;
    left: 0;
    top: 0;
    color: transparent;
    letter-spacing: 2px;
    background: linear-gradient(to right, var(--slate-900) 0 0) 0 0 / 0% 100% no-repeat;
    -webkit-background-clip: text;
    background-clip: text;
    animation: text 1.5s infinite;
}

@keyframes text {
    to {
        background-size: 150% 100%;
    }
}
@keyframes line {
    to {background-position: -125% 100%}
}
@keyframes jump {
    0%,2% {bottom: 0%}
    98%,to {bottom:.1%}
}
@-webkit-keyframes bg {
    0% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}
@keyframes bg {
    0% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}
.page-section-body .loader-wrap {
    position: absolute;
    top: calc(50% + 18px);
    left: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: -100px;
    width: 100%;
    height: 200px;
    cursor: auto;
}
.page-section-body .loader-wrap.double-head {
    top: calc(50% + 36px);
}
.info {
    position: relative;
    display: inline-flex;
    align-items: center;
    word-break: break-all;
    white-space: nowrap;
    font-size: var(--font-size);
    color: var(--slate-600);
    line-height: var(--i-small);
}
.help {
    position: relative;
    display: inline-flex;
    align-items: center;
    word-break: break-all;
    white-space: nowrap;
    font-size: var(--font-size);
    color: var(--slate-600);
    line-height: var(--i-small);
    padding: 0 0 0 calc(var(--i-small) + 4px);
}
.help::before {
    content: "\e88f";
    position: absolute;
    top: 0;
    left: 0;
    height: var(--i-small);
    line-height: var(--i-small);
    font-family: "Material Icons Round";
    font-weight: 400;
    color: var(--slate-400);
    font-size: var(--i-small);
    text-rendering: auto;
}
.exam {
    position: relative;
    display: inline-flex;
    align-items: center;
    word-break: break-all;
    white-space: nowrap;
    font-size: var(--font-size);
    color: var(--slate-600);
    line-height: var(--i-small);
    padding: 0 0 0 calc(var(--i-small) + 4px);
}
.exam::before {
    content: "\e8fd";
    position: absolute;
    top: 0;
    left: 0;
    height: var(--i-small);
    line-height: var(--i-small);
    font-family: "Material Icons Round";
    font-weight: 400;
    color: var(--slate-400);
    font-size: var(--i-small);
    text-rendering: auto;
}