.sidebar-nav {
    background-color: transparent !important;
    /* 使背景透明 */
    /* 或者設定為任何其他顏色，例如 */
    /* background-color: rgba(255, 255, 255, 0.5) !important; 這會是半透明的白色 */
}



.black-bar {
    position: relative;
    display: flex; /* 使用 flexbox 来居中内容 */
    margin-left: 50PX;
    margin-bottom: 50px;
    align-items: center; /* 垂直居中内容 */
    color: #F6CC99; /* 文本颜色 */
    font-size: 25px; /* 字体大小 */
    width: 100%; /* 宽度占满容器 */
    height: 50px; /* 给予足够的高度，以便有空间居中 */
    padding: 10px 0; /* 上下内边距，根据需要调整 */

}
.black-bar span {
    position: relative;
    margin-left: 10%;
    font-size: 25px;
    color: #F6CC99; /* 文本颜色 */
    padding-bottom: 5px; /* 增加文本与底边的间距 */

}

.black-bar span::after {
    content: ''; /* 伪元素必须有内容，这里为空 */
    position: absolute;
    left: 0;
    right: 0;
    bottom: -10px; /* 调整底边线条与文本之间的距离 */
    height: 5pt; /* 线条高度 */
    background-color: #F6CC99; /* 线条颜色 */
    border-radius: 10px; /* 圆角的大小，根据需求调整 */
}

/* .black-bar span {
margin-left: 10%; /* 保持原有設定 */
/* } */
*/ .black-bar::after {
    content: "";
    position: absolute;
    bottom: -5px;
    /* 線條位置調整 */
    left: 10%;
    /* 與 span 的 margin-left 一致 */
    right: 10%;
    /* 設定 right 以保持與左側間距相同，保證寬度一致 */
    height: 5px;
    /* 線條高度 */
    background-color: #F6CC99;
}



.scroll-sidebar{
    overflow: hidden hidden;
}


@media (max-width:500px) {
    .black-bar {
        display: none;
    }
}

@media (min-width:768px) {

    .black-bar {
        display: none;
    }
}