.sidebar-container {
    display: flex;
    align-items: flex-start;
    position: relative; /* sticky 기준 컨테이너는 position: relative */
    width: 100%;
}

    .sidebar-container .sidebar {
        position: sticky;
        top: 20rem; /* 원하는 위치 조절 가능 */
        width: 10rem;
        background-color: #fff;
        padding: 1.2rem;
        border-right: 1px solid #ddd;
        height: auto;
        max-height: calc(100vh - 100px); /* overflow 발생 시 */
        overflow-y: auto;
        z-index: 10;
    }

        .sidebar-container .sidebar ul {
            list-style-type: none;
            padding: 0;
            margin: 0;
        }

            .sidebar-container .sidebar ul li {
                margin: 10px 0;
                position: relative;
                padding-left: 20px;
            }

                .sidebar-container .sidebar ul li::before {
                    content: '';
                    position: absolute;
                    left: 0;
                    top: 50%;
                    transform: translateY(-50%);
                    width: 8px;
                    height: 8px;
                    border-radius: 50%;
                    background-color: #ddd;
                }

                .sidebar-container .sidebar ul li.active::before {
                    background-color: red;
                }

                .sidebar-container .sidebar ul li a {
                    text-decoration: none;
                    color: #000;
                    font-weight: bold;
                }

                    .sidebar-container .sidebar ul li a:hover {
                        color: #007BFF;
                    }

                .sidebar-container .sidebar ul li.active a {
                    color: #000;
                }

    .sidebar-container .content {
        flex: 1;
        padding: 20px;
        margin-left: 2rem;
    }

.section-title {
    position: relative;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #ddd; /* 연한 회색 선 */
    margin-bottom: 1.5rem;
}

    .sidebar-container section {
        margin-bottom: 50px;
    }

    .sidebar-container h2 {
        font-size: 2em;
        margin-top: 0;
        margin-left: 0rem;
    }
    .sidebar-container p {
        font-size: 1.1rem;
        margin-top: 1rem;
        margin-left: 2rem;
    }
@media (max-width: 991.98px) {
        .sidebar-container .sidebar {
            width: 8rem;
            padding: 0rem;
        }

            .sidebar-container .sidebar ul {
                list-style-type: none;
                padding: 0;
                margin: 0;
            }

                .sidebar-container .sidebar ul li {
                    margin: 10px 0;
                    position: relative;
                    padding-left: 20px;
                }

                    .sidebar-container .sidebar ul li::before {
                        content: '';
                        position: absolute;
                        left: 0;
                        top: 50%;
                        transform: translateY(-50%);
                        width: 8px;
                        height: 8px;
                        border-radius: 50%;
                        background-color: #ddd;
                    }

                    .sidebar-container .sidebar ul li.active::before {
                        background-color: red;
                    }

                    .sidebar-container .sidebar ul li a {
                        text-decoration: none;
                        color: #000;
                        font-weight: bold;
                    }

                        .sidebar-container .sidebar ul li a:hover {
                            color: #007BFF;
                        }

                    .sidebar-container .sidebar ul li.active a {
                        color: #000;
                    }

        .sidebar-container .content {
            flex: 1;
            padding: 1rem;
            margin-left: 0rem;
        }

        .sidebar-container section {
            margin-bottom: 1.4rem;
        }

        .sidebar-container h2 {
            font-size: 1.2em;
            margin-top: 0;
            margin-left: 0rem;
        }

        .sidebar-container p {
            font-size: 0.6rem;
            margin-top: 1rem;
            margin-left: 1rem;
        }


}