.list{overflow:hidden; }
.imagelist .list-box{text-align:center;}
.imagelist .list-box ul:after{display:block; content:''; clear:both;}
.imagelist .list-box ul li{
    width:20%; 
    float:left;
    box-sizing: border-box;
}
/* 横版奖牌（沪友奖牌）- 固定5个一行，每个20% */
.imagelist .list-box ul li.medal-item{
    width:20%;
}
/* 竖版证书（普通荣誉证书）- 根据配置的列数 */
.imagelist .list-box ul li.honor-item{
    width:20%;
}
/* 确保竖版证书在横版奖牌后从新行开始 */
.imagelist .list-box ul li.medal-item + li.honor-item{
    clear: left;
}
.imagelist .list-box ul li a{display:block; transition:.3s;}
.imagelist .list-box ul li a span{display:block; overflow:hidden;}
.imagelist .list-box ul li a span img{display:block; width:100%; 
    transition:.3s;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;}
.imagelist .list-box ul li a:hover span img{transform:scale(1.05);} 
.imagelist .list-box ul li a h4{
    display:block; 
    position: relative;
    padding-bottom:0 !important; 
    overflow:hidden; 
    white-space:nowrap; 
    text-overflow:ellipsis; 
    font-weight:inherit;
    height: 40px; line-height: 40px;
    background-color: #eaeaea;
    color: #000;
    text-align: center; /* 文字居中 */
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
}

.imagelist .list-box ul li:hover a h4{background-color: #1258af; color: #fff;}


.imagelist .list-box ul li a h3{display:block; text-align:center; color:red;}
/* 横版奖牌的图片样式 */
.imagelist .list-box ul li.medal-item a span{
    max-height: 200px; /* 限制横版图片高度 */
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f8f9fa;
    overflow: hidden;
}
.imagelist .list-box ul li.medal-item a span img{
    object-fit: contain; /* 保持横版图片的宽高比 */
    max-height: 200px;
    width: auto;
    max-width: 100%;
    height: auto;
    display: block;
}

@media(min-width:992px){
.imagelist{padding-top:28px; padding-bottom:28px;}
.imagelist .list-box{margin-bottom:18px;}
/* 竖版证书：根据配置的列数 */
.imagelist .list-box ul li.honor-item{width:20%;}
/* 横版奖牌：固定5个一行，每个20% */
.imagelist .list-box ul li.medal-item{width:20%;}
}
@media(max-width:991px){
.imagelist{padding-top:18px; padding-bottom:18px;}
.imagelist .list-box{margin-bottom:8px;}
/* 竖版证书：根据配置的列数 */
.imagelist .list-box ul li.honor-item{width:50%;}
/* 横版奖牌：移动端也保持5个一行，每个20% */
.imagelist .list-box ul li.medal-item{width:20%;}
}
@media(min-width:768px){
.imagelist .list-box ul{margin:0 -8px;}
.imagelist .list-box ul li{padding:8px;}
}
@media(max-width:767px){
.imagelist .list-box ul{margin:0 -4px;}
.imagelist .list-box ul li{padding:4px;}
}