th.period { width: 230px; } 
th.name { width: 100px; } 
th.metric { width: 100px; } 
th.rate { width: 160px; } 
th.memo { width: 200px; } 
th.tool { width: 100px; } 

/* 수수료율 관리 테이블 */
.tool_wrap { display: flex; flex-direction: column; gap: 5px; align-items: center; } 

/* 모달 */
.modal_area .input_wrap button { flex: 1; } 
.modal_area .input_wrap span { flex: 1; text-align: center; padding: 10px 15px; font-size: 16px; font-weight: 300; border: 1px solid var(--borderColor); border-radius: 5px; color: #666; } 

.modal#modal-log .modal_area {
    max-width: 1000px;
}
.modal_body:has(.table_scroll) {
    max-height: 90vh;
    overflow-y: auto;
}

/* 모달 내부 테이블 스크롤 */
.modal#modal-fee .table_wrap { 
    /* max-height: 200px;  */
}



/* 모달 border 예외 처리 */
.table_wrap table tbody tr:nth-last-child(2) td[rowspan] { border-bottom: none; } 

/* 적용요율 */
.table_wrap table.rate tr th { padding: 10px 0; background-color: #f1f1f1; } 
.table_wrap table.rate tr td { padding: 3px 0; } 
.table_wrap table.rate tr:last-child td { padding: 0; } 

/* ===========================
   리스트 내 구간별 요율 영역
   (.full-rate 안 div 레이아웃)
   =========================== */

.full-rate {
    width: 100%;
    overflow: hidden;
}
.full-rate_wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
}
.full-rate-grid {
    width: max-content;
    min-width: 100%;
    display: flex;
    flex-direction: column;
    background-color: #f9fafb;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
    overflow: hidden;
}

.full-rate-row {
    display: flex;
    align-items: stretch;
}

.full-rate-row--header {
    background-color: #111827;
    color: #f9fafb;
    font-weight: 600;
}

.full-rate-cell {
    padding: 6px 8px;
    font-size: 12px;
    text-align: center;
    border-right: 1px solid #e5e7eb;
}

.full-rate-row:last-child .full-rate-cell {
    border-bottom: none;
}

.full-rate-cell:last-child {
    border-right: none;
}

.full-rate-cell--label,
.full-rate-cell--index {
    flex: 0 0 100px;
    font-weight: 600;
}

.full-rate-row--header .full-rate-cell--label {
    background-color: #111827;
    display: flex;
    align-items: center;
    justify-content: center;
}

.full-rate-row:not(.full-rate-row--header) .full-rate-cell--index {
    background-color: #e5e7eb;
    color: #111827;
}

.full-rate-cell--header,
.full-rate-cell--value {
    flex: 1 1 0;
    white-space: nowrap;
    display: flex;
    align-items: center;
    justify-content: center;
}

.full-rate-row:nth-child(2n+1):not(.full-rate-row--header) {
    background-color: #ffffff;
}

.full-rate-row:nth-child(2n):not(.full-rate-row--header) {
    background-color: #eff6ff;
}

.full-rate-cell--header input,
.full-rate-cell--header select {
    color: #ffffff;
    font-weight: 400;
}

.full-rate-cell--header input,
.full-rate-cell--header select,
.full-rate-cell--label input,
.full-rate-cell--label select {
    border: solid .5px #e5e7eb;
    border-radius: 4px;
    padding: 2px 4px;
    outline: none;
    background-color: #ffffff;
    color: #111827;
    margin-block: .5px;
    min-width: 80px;
}
.toggle_wrap {
    display: none;
}
#modal-fee .modal_area {
    height: 90dvh;
    max-height: 90dvh;
}
#modal-fee .modal_body {
    max-height: 100%;
    height: calc(100% - 56px);
}
#modal-fee .modal_body  form {
    max-height: 100%;
}
#modal-fee .toggle_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 30px;
    margin-bottom: 15px;
}

#modal-fee .toggle_btn img {
    width: 25px;
    transition: transform 0.3s ease;
}

#modal-fee .toggle_btn.active img {
    transform: rotate(180deg);
}
#modal-fee .table_scroll {
    max-height: unset;
    padding-bottom: 100px;
}
#modal-fee .modal_area .modal_btn_wrap {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 15px 0;
    background: #fff;
    border: 1px solid var(--borderColor);
}