.toc__wrapepr {
    background-color: var(--ultraDark30);
    padding: 52px 0;
}

.toc__container {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
}

.toc__container > * + * {
    margin-top: 24px;
}

.toc__container > ul {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
}

.toc__container > ul > li + li {
    margin-left: 9px;
}

.toc__container > ul a {
    color: var(--textMain) !important;
    padding-right: 12px !important;
    padding-left: 12px !important;
    white-space: nowrap;
}

.toc__container > ul > li {
    opacity: 0.4;
    flex-shrink: 0;
}

.toc__container > ul > li:hover {
    opacity: 1;
}

.toc__container > ul > li a:hover {
    background-color: white;
    color: black !important;
}
.toc__container_addPage > ul > li {
    opacity: 0.75;
}

.toc__container_addPage ul {
    overflow-x: auto;
    overflow-y: hidden;
}
.toc__container_addPage ul a {
    color: var(--neturalGray10) !important;
}

.toc__container_addPage ul::-webkit-scrollbar {
    height: 9px;
}
.toc__container_addPage ul::-webkit-scrollbar-track {
}
.toc__container_addPage ul::-webkit-scrollbar-thumb {
    background-color: var(--accent10);
    border-radius: 20px;
}
@media (max-width: 1340px) {
    .toc__container {
        overflow-x: auto;
        overflow-y: hidden;
        margin-top: 0;
        padding: 8px 0 0 12%;
        margin-left: -12%;
        margin-right: -7%;
        -webkit-overflow-scrolling: touch;
    }
}
