/* 导航栏容器 */
.navbar {
    display: flex;
    background-color: #303030;
    padding: 0;
    width: 100%;
}

/* 导航项样式 */
.nav-item {
    flex: 1;
    text-align: center;
    padding: 15px 0;
    color: #fff;
    font-size: 18px;
    text-decoration: none;
    font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
    position: relative;
}

/* 选中状态 - 上品团队 */
.nav-item.active {
    background-color: #00C08B; /* 绿色背景 */
}

.nav-item.active span {
    color: #fff; /* 保持文字为白色 */
}

/* 响应式调整 */
@media (max-width: 768px) {
    .nav-item {
        font-size: 16px;
        padding: 12px 0;
    }
}

@media (max-width: 480px) {
    .nav-item {
        font-size: 14px;
        padding: 10px 0;
    }
}

.imagelist{overflow:hidden; background:; padding: 40px 0;}
.imagelist .list-box{margin: 0 auto;}
.imagelist .list-box ul{display: block; list-style: none; padding: 0; margin: 0;}
.imagelist .list-box ul li{float: none; width: 100%; break-inside: avoid; margin-bottom: 0; list-style: none;}
.imagelist .list-box ul li.waterfall-item{break-inside: avoid; margin-bottom: 20px;}
.imagelist .list-box ul li a{display:block; transition:.6s; position:relative; overflow:hidden; border-radius: 0; box-shadow: 0 2px 8px rgba(0,0,0,0.1); background: #fff;}
.imagelist .list-box ul li a span{display:block; overflow:hidden;}
.imagelist .list-box ul li a span img{display:block; width:100%; height: auto; transition:.6s; object-fit: cover;}
.imagelist .list-box ul li a:hover span img{transform:scale(1.05);}
.imagelist .list-box ul li a h4{position:absolute; bottom:0; left:0; right:0; z-index:2; background:#00C08B; color:#fff; padding:16px 12px; text-align:center; font-size:15px; transform:translateY(100%); transition:.3s; opacity: 0;}
.imagelist .list-box ul li a:hover h4{transform:translateY(0); opacity: 1;}

@media(min-width:1200px){
.imagelist{padding:40px 0;}
.imagelist .list-box{column-count: 4; column-gap: 24px;}
.imagelist .list-box ul li.waterfall-item{margin-bottom: 24px;}
}

@media(min-width:992px) and (max-width:1199px){
.imagelist{padding:30px 0;}
.imagelist .list-box{column-count: 3; column-gap: 20px;}
.imagelist .list-box ul li.waterfall-item{margin-bottom: 20px;}
}

@media(min-width:768px) and (max-width:991px){
.imagelist{padding:25px 0;}
.imagelist .list-box{column-count: 2; column-gap: 16px;}
.imagelist .list-box ul li.waterfall-item{margin-bottom: 16px;}
}

@media(max-width:767px){
.imagelist{padding:20px 0;}
.imagelist .list-box{column-count: 1; column-gap: 12px;}
.imagelist .list-box ul li.waterfall-item{margin-bottom: 12px;}
.imagelist .list-box ul li a h4{font-size:14px; padding:12px 10px;}
}