.simple-tree {
    position: relative;
    width: auto;
    max-width: 800px;
    margin: 20px 0;
    overflow-x: auto;
}

.tree-node {
    position: relative;
    margin-bottom: 15px;
    padding-left: 30px;
    width: auto;
}

    .tree-node:before {
        content: "";
        position: absolute;
        left: 5px;
        top: 0px;
        bottom: 0;
        border-left: 1px solid #DDD;
    }

    .tree-node:last-child:before {
        height: 16px;
    }

    .tree-node:after {
        content: "";
        position: absolute;
        left: 5px;
        top: 16px;
        width: 25px;
        height: 0px;
        border-bottom: 1px solid #ddd;
        background-color: #DDD;
    }

.tree-root {
    padding-left: 0;
}

    .tree-root:before,
    .tree-root:after {
        display: none;
    }

.tree-label {
    display: block;
    padding: 8px 12px;
    border-radius: 3px;
    background-color: #fff;
    border: 1px solid #ddd;
    font-size: 12px;
    width: auto;
    min-width: 200px;
    max-width: 600px;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0px 0px 5px 0px;
}

    .tree-label:hover {
        background-color: #f8f9fa;
    }

.tree-classname {
    font-weight: bold;
    display: inline-block;
}

.tree-namespace {
    font-size: 12px;
    color: #666;
    margin-left: 8px;
    display: inline-block;
}

.tree-button {
    border-color: #3498db;
    background-color: #f0f8ff;
}

.class-link {
    text-decoration: none;
    color: #000000 !important; /* 검정색으로 변경 */
}

    .class-link:hover {
        text-decoration: underline;
        color: #000000; /* hover 상태에서도 검정색 유지 */
    }