.inherited-table-container {
    margin-top: 16px;
    width: 100%; /* 전체 너비 사용 */
    /* overflow-x: auto; 제거 - 이게 문제였음! */
}

.inherited-table {
    width: 100%;
    border-collapse: collapse;
    background-color: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    table-layout: fixed; /* 고정 레이아웃으로 변경 */
}

    .inherited-table th,
    .inherited-table td {
        padding: 12px 16px;
        text-align: left;
        border-bottom: 1px solid #eee;
        vertical-align: top;
        /* 텍스트 오버플로우 처리 */
        max-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .inherited-table th {
        background-color: #f9fafb;
        font-weight: 600;
        color: #333;
        font-size: 12px;
        white-space: nowrap; /* 헤더는 항상 한 줄로 */
    }

    .inherited-table td {
        font-size: 12px;
        color: #555;
    }

        /* 컬럼별 너비 제어 */
        .inherited-table th:first-child,
        .inherited-table td:first-child {
            width: 15%;
        }

        .inherited-table th:nth-child(2),
        .inherited-table td:nth-child(2) {
            width: 20%;
        }

        .inherited-table th:nth-child(3),
        .inherited-table td:nth-child(3) {
            width: 65%;
        }

    .inherited-table a {
        color: #0078d4;
        text-decoration: none;
    }

        .inherited-table a:hover {
            text-decoration: underline;
        }

/* 반응형 미디어 쿼리 */
@media (max-width: 768px) {
    .inherited-table th,
    .inherited-table td {
        padding: 10px 12px; /* 패딩 줄이기 */
        font-size: 11px;
    }

        /* 태블릿에서 컬럼 너비 조정 */
        .inherited-table th:first-child,
        .inherited-table td:first-child {
            width: 18%;
        }

        .inherited-table th:nth-child(2),
        .inherited-table td:nth-child(2) {
            width: 22%;
        }

        .inherited-table th:nth-child(3),
        .inherited-table td:nth-child(3) {
            width: 60%;
        }
}

@media (max-width: 480px) {
    .inherited-table th,
    .inherited-table td {
        padding: 8px 10px; /* 더 작은 패딩 */
        font-size: 10px;
    }

        /* 모바일에서 컬럼 너비 조정 */
        .inherited-table th:first-child,
        .inherited-table td:first-child {
            width: 20%;
        }

        .inherited-table th:nth-child(2),
        .inherited-table td:nth-child(2) {
            width: 25%;
        }

        .inherited-table th:nth-child(3),
        .inherited-table td:nth-child(3) {
            width: 55%;
        }
}

/* 매우 작은 화면 */
@media (max-width: 320px) {
    .inherited-table th,
    .inherited-table td {
        padding: 6px 8px;
        font-size: 9px;
    }
}

/* 툴팁 기능 (긴 텍스트용) */
.inherited-tooltip {
    position: relative;
    cursor: help;
}

    .inherited-tooltip:hover::after {
        content: attr(data-tooltip);
        position: absolute;
        bottom: 100%;
        left: 50%;
        transform: translateX(-50%);
        background: #333;
        color: white;
        padding: 5px 10px;
        border-radius: 4px;
        font-size: 11px;
        white-space: nowrap;
        z-index: 1000;
        margin-bottom: 5px;
        pointer-events: none;
        max-width: 300px;
        white-space: normal;
        word-wrap: break-word;
    }

    .inherited-tooltip:hover::before {
        content: '';
        position: absolute;
        bottom: 100%;
        left: 50%;
        transform: translateX(-50%);
        border: 5px solid transparent;
        border-top-color: #333;
        margin-bottom: -5px;
        pointer-events: none;
    }

/* 마지막 행의 border-bottom 제거 */
.inherited-table tr:last-child th,
.inherited-table tr:last-child td {
    border-bottom: none;
}

/* 호버 효과 추가 */
.inherited-table tbody tr:hover {
    background-color: #f8f9fa;
}

/* 링크가 있는 셀의 전체 영역 클릭 가능하게 */
.inherited-table td.clickable-cell {
    padding: 0;
}

    .inherited-table td.clickable-cell a {
        display: block;
        padding: 12px 16px;
        color: inherit;
        text-decoration: none;
    }

        .inherited-table td.clickable-cell a:hover {
            background-color: #f0f8ff;
            text-decoration: none;
        }