.fit_tlb_tr div.last {
    flex-grow: 1
}

.fit_tlb {
    border-radius: 5px;
    position: relative;
    text-align: center;
    overflow: auto;
    clear: both;
    width: 100%;
    font-size: 13px;
    box-sizing: border-box;
    border-left: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    background-color: #f7f7f7;
}

.fit_tlb.dragging .fit_tlb_tr {
    cursor: initial;
}

.fixed_side {
    position: sticky;
}

.fit_tlb_tr {
    line-height: 20px;
    display: inline-flex;
    min-width: 100%;
}

.fit_tlb_head > .fit_tlb_tr,
.fit_tlb_head > .fit_tlb_tr_grp > .fit_tlb_tr:not(:first-child) {
    line-height: 20px;
}

.fit_tlb_head > .fit_tlb_tr:hover > div[onclick*="sortList"],
.fit_tlb_head > .fit_tlb_tr_grp > .fit_tlb_tr:hover > div[onclick*="sortList"] {
    cursor: pointer;
}

.fit_tlb_head .fit_tlb_tr {
    height: 24px;
}

.fit_tlb_body .fit_tlb_tr, .fit_tlb_footer .fit_tlb_tr {
    height: 23px;
}

.fit_tlb_tr > div {
    box-sizing: border-box;
    padding: 1px 5px;
}

.fit_tlb_tr > div[data-name=chk] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.fit_tlb_tr input[type=text],.fit_tlb_tr input[type=number]  {
    color: #58524c;
    background-color: #fff;
    border: 1px solid #a5a5a5;
    border-radius: 3px;
    position: relative;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    height: 11px;
    padding: 3px;
    -ms-flex-align: center;
    align-items: center;
    font-size: 11px;
    outline: none;
    margin: 1px 0;
}

.fit_tlb_tr select {
    width: 100%;
    color: #58524c;
    background-color: #fff;
    border: 1px solid #a5a5a5;
    border-radius: 3px;
    height: 19px;
    font-size: 11px;
    outline: none;
    margin: 1px 0;
}

.fit_tlb_head {
    color:#212529;
    position: sticky;
    top: 0;
    z-index: 8;
}

.fit_tlb_head   > .fit_tlb_tr div[fix],
.fit_tlb_footer > .fit_tlb_tr div[fix]
{
    z-index: 9;
}

.fit_tlb_head   .fit_tlb_tr_grp > .fit_tlb_tr div[span],
.fit_tlb_footer .fit_tlb_tr_grp > .fit_tlb_tr div[span] {
    z-index: 10;
}

.fit_tlb_head   .fit_tlb_tr_grp > .fit_tlb_tr div[fix],
.fit_tlb_footer .fit_tlb_tr_grp > .fit_tlb_tr div[fix] {
    z-index: 11;
}

.fit_tlb_head   .fit_tlb_tr_grp > .fit_tlb_tr div[span][fix],
.fit_tlb_footer .fit_tlb_tr_grp > .fit_tlb_tr div[span][fix] {
    z-index: 12;
}

.fit_tlb_head:empty {
    border-top: 2px solid #495057;
}

.fit_tlb_head .fit_tlb_tr > div {
    background-color: #abcdff;
    font-weight: 500;
    transition: box-shadow 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-box-shadow 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.fit_tlb_head .fit_tlb_tr > div.-sort-asc {
    position: relative;
    padding-right: 14px;
    background-color: #F2F7FF;
}

.fit_tlb_head .fit_tlb_tr > div.-sort-asc::after {
    top: 50%;
    right: 6px;
    position: absolute;
    content: attr(sort-order) '↑';
    color: #4B7DE2;
    font-size: 10px;
    font-weight: bold;
    transform: translateY(-50%);
}

.fit_tlb_head .fit_tlb_tr > div.-sort-desc {
    position: relative;
    padding-right: 14px;
    background-color: #F2F7FF;
}

.fit_tlb_head .fit_tlb_tr > div.-sort-desc::after {
    top: 50%;
    right: 6px;
    position: absolute;
    content: attr(sort-order) '↓';
    color: #4B7DE2;
    font-size: 10px;
    font-weight: bold;
    transform: translateY(-50%);
}


.fit_tlb_body {
    position: relative;
    min-width: min-content;
    box-sizing : border-box;
    color:#58524c;
}

.fit_tlb_body .fit_tlb_tr_grp > .fit_tlb_tr div[span]:not([style*="display: none"]):not(:last-of-type) {
    border-right: 1px solid #dee2e6;
}

.fit_tlb_body > .fit_tlb_tr div[fix] {
    z-index: 4;
}

.fit_tlb_body .fit_tlb_tr_grp > .fit_tlb_tr div[span] {
    z-index: 5;
}

.fit_tlb_body .fit_tlb_tr_grp > .fit_tlb_tr div[fix] {
    z-index: 6;
}

.fit_tlb_body .fit_tlb_tr_grp > .fit_tlb_tr div[span][fix] {
    z-index: 7;
}

.fit_tlb_body .tr_empty {
    width: 100%;
    height: 100%;
    position: absolute;
    text-align: left;
    box-sizing: border-box;
    background-color: #fff;
}

.fit_tlb_body .tr_empty > span {
    position: sticky;
    top: calc(50% - 11px);
    left: calc(50% - 63px);
}

.fit_tlb_body .fit_tlb_tr {
    cursor: pointer;
    background-color: #fff;
}

.fit_tlb_body .fit_tlb_tr > div {
    background-color: inherit;
    border-bottom: 1px solid #dee2e6;
    word-break: break-all;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fit_tlb_body > .fit_tlb_tr_grp:hover:not(.selected) > .fit_tlb_tr_grp > div {
    background-color: #ededed !important;
}

.fit_tlb_body .fit_tlb_tr:hover:not(.selected) > div {
    background-color: #ededed !important;
}

.fit_tlb_body .fit_tlb_tr:active:is(.selected, :not(.selected)) > div {
    background-color: #e5eeff !important;
}

.fit_tlb_body .fit_tlb_tr.active > div {
    background-color: #e5eeff !important;
}

.fit_tlb_body > div:not([style*="display: none"]):first-of-type {
    border-top: 1px solid #dee2e6;
}

.fit_tlb_footer {
    font-weight: 500;
    color: #212529;
    position: sticky;
    bottom: 0;
    z-index: 8;
}

.fit_tlb_footer:empty {
    border-bottom: 1px solid #dee2e6;
}

.fit_tlb_footer .fit_tlb_tr:has(> .sticky-element) {
    z-index: 6;
}

.fit_tlb_footer .fit_tlb_tr > div {
    background-color: #e0ebff;
    z-index: 5;
}

.fit_tlb_format {
    display: none;
}

.brn {
    border-right: none !important;
}

.selected > div {
    background-color: #cedff9 !important
}

/*  hover active event 방지 이벤트를 적용하지 않을 경우 tr요소에 클래스네임으로 정의해주세요.*/
.fit_tlb_head div[span] {
    height: 48px;
    line-height: 42px;
}

.fit_tlb_body div[span], .fit_tlb_footer div[span] {
    height: 46px;
    line-height: 42px;
}


/* 그룹 그리드 */

/* 헤더 */
.fit_tlb_head >.fit_tlb_tr_grp > .fit_tlb_tr:not(:last-child) > div:not([span]) {
    border-bottom: 1px solid #9d9d9d;
}

.fit_tlb_head > .fit_tlb_tr_grp > .fit_tlb_tr > div[span]:not([fix]) + div:not([span]),
.fit_tlb_head > .fit_tlb_tr_grp > .fit_tlb_tr > div[span][fix]       + div:not([span])[fix],
.fit_tlb_head > .fit_tlb_tr_grp > .fit_tlb_tr > div:not([data-name]):not([fix]) + div:not([span]){
    border-left: 1px solid #9d9d9d;
}

.fit_tlb_head > .fit_tlb_tr_grp > .fit_tlb_tr > div[span]:not([fix]) + div.none + div:not([span]),
.fit_tlb_head > .fit_tlb_tr_grp > .fit_tlb_tr > div:not([data-name]):not([fix]) + div.none + div:not([span]) {
    border-left: 1px solid #9d9d9d;
}

.fit_tlb_head >.fit_tlb_tr_grp .fit_tlb_tr > div:not([span], [style*="display: none"]):not(:last-of-type) {
    border-right: 1px solid #9d9d9d;
}

/* 바디 */
.fit_tlb_body .fit_tlb_tr_grp:has(.fit_tlb_tr:hover:not(.selected)) .fit_tlb_tr:first-child div[span] {
    background-color: #e5eeff !important;
}

.fit_tlb_body .fit_tlb_tr_grp:has(.fit_tlb_tr:active) .fit_tlb_tr:first-child div[span] {
    background-color: #e5eeff !important;
}

.fit_tlb_body >.fit_tlb_tr_grp:first-of-type > .fit_tlb_tr > div {
    border-top: 1px solid #dee2e6;
}

.fit_tlb_body >.fit_tlb_tr_grp > .fit_tlb_tr > div {
    border-bottom: 1px solid #dee2e6;
}

.fit_tlb_body > .fit_tlb_tr_grp > .fit_tlb_tr > div[span]:not([fix]) + div.none + div:not([span]),
.fit_tlb_body > .fit_tlb_tr_grp > .fit_tlb_tr > div:not([data-name]):not([fix]) + div.none + div:not([span]) {
    border-left: 1px solid #dee2e6;
}

.fit_tlb_body >.fit_tlb_tr_grp > .fit_tlb_tr > div:not([span], [style*="display: none"]):not(:last-of-type) {
    border-right: 1px solid #dee2e6;
}

.fit_tlb_body >.fit_tlb_tr_grp > .fit_tlb_tr > div[data-name="chk"] {
    border-right: 1px solid #dee2e6;
}

/* 푸터 */
.fit_tlb_footer >.fit_tlb_tr_grp > .fit_tlb_tr:not(:last-child) > div:not([span]) {
    border-bottom: 1px solid #9d9d9d;
}

.fit_tlb_footer > .fit_tlb_tr_grp > .fit_tlb_tr > div[span]:not([fix]) + div:not([span]),
.fit_tlb_footer > .fit_tlb_tr_grp > .fit_tlb_tr > div[span][fix]       + div:not([span])[fix],
.fit_tlb_footer > .fit_tlb_tr_grp > .fit_tlb_tr > div:not([data-name]):not([fix]) + div:not([span]){
    border-left: 1px solid #9d9d9d;
}

.fit_tlb_footer > .fit_tlb_tr_grp > .fit_tlb_tr > div[span]:not([fix]) + div.none + div:not([span]),
.fit_tlb_footer > .fit_tlb_tr_grp > .fit_tlb_tr > div:not([data-name]):not([fix]) + div.none + div:not([span]) {
    border-left: 1px solid #9d9d9d;
}

.fit_tlb_footer >.fit_tlb_tr_grp .fit_tlb_tr > div:not([span], [style*="display: none"]):not(:last-of-type) {
    border-right: 1px solid #9d9d9d;
}

.fit_tlb_tr_grp:has(.selected) .fit_tlb_tr:first-child div[span] {
    background-color: #cedff9 !important;
}

.fit_tlb_tr_grp.selected > .fit_tlb_tr > div {
    background-color: #cedff9 !important;
}

.fit_tlb_tr_grp > .fit_tlb_tr div[span][last] {
    border-right: 1px solid #dee2e6
}

/******************** 스크롤바 *********************/
.fit_tlb::-webkit-scrollbar-track-piece:vertical:not(:corner-present) {
    border-radius: 0 5px 5px 0;
}

.fit_tlb::-webkit-scrollbar-track-piece:vertical:corner-present {
    border-radius: 0 5px 0 0;
}

.fit_tlb::-webkit-scrollbar-track-piece:horizontal:not(:corner-present) {
    border-radius: 0 0 5px 5px;
}

.fit_tlb::-webkit-scrollbar-track-piece:horizontal:corner-present {
    border-radius: 0 0 0 5px;
}

.fit_tlb::-webkit-scrollbar-thumb {
    border: 2px solid #cfe2ff;
    min-height: 50px;
}

.fit_tlb::-webkit-scrollbar {
    background-color: white;
}

.fit_tlb::-webkit-scrollbar {
    background-color: white;
}

/* intellij 문제로 빨간줄이 나오지만 정상 작동 */
div:has(> .fit_tlb:last-of-type) {
    border-radius: 0 0 5px 0;
    overflow: hidden;
}

.fit_tlb_body > div label:has(:is(input[required], input[readonly])) {
    position: relative;
    display: flex;
}

.fit_tlb_body > div label:has(:is(input[required], input[readonly]))::before {
    height: 17px;
    width: 5px;
    position: absolute;
    top: 2px;
    bottom: 0;
    left: 1px;
    z-index: 2;
    transition: all 0.1s cubic-bezier(0.48, 0.45, 0.69, 0.71);
    border-right-width: 0;
    border-radius: 2px 0 0 2px;
    content: ' ';
}

.fit_tlb_body > div label:has(input[required])::before {
    background-color: #ff6474;
}

.fit_tlb_body > div label:has(input[readonly])::before {
    background-color: #dee2e6;
}