/* 企业荣誉板块 - 核心CSS实现：图片自适应+自动滚动 */
.honor-viewport {
    width: 100%;
    overflow: hidden; /* 隐藏超出视口内容，形成滚动视口 */
    position: relative;
    margin: 0 auto;
}
/* 切换按钮基础样式 */
.honor-btn {
    position: absolute; /* 固定在容器两侧 */
    top: 50%; /* 垂直居中 */
    transform: translateY(-50%); /* 精确垂直居中 */
    z-index: 10; /* 确保按钮在列表上方，不被遮挡 */
    width: 48px;
    height: 48px;
    border-radius: 50%; /* 圆形按钮 */
    background-color: rgba(255, 255, 255, 0.9);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* 轻微阴影增强立体感 */
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease; /* 动画过渡效果 */
}

/* 左按钮定位 */
.honor-prev {
    left: 10px; /* 距离左侧10px */
}

/* 右按钮定位 */
.honor-next {
    right: 10px; /* 距离右侧10px */
}

/* 按钮 hover 效果（增强交互反馈） */
.honor-btn:hover {
    background-color: #fff;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
    transform: translateY(-50%) scale(1.1); /* 轻微放大 */
}
/* 滚动列表：通过CSS动画实现自动横向滚动 */
.honor-list {
    display: flex; /* 横向排列图片项 */
    list-style: none;
    margin: 0;
    padding: 20px 0;
    gap: 20px; /* 图片之间的间距 */
    /* 关键：动画控制滚动（需根据实际项数调整动画时长） */
    animation: scroll 100s linear infinite; /* 20秒一圈，匀速，无限循环 */
}
/* 鼠标悬停暂停滚动（提升交互） */
.honor-viewport:hover .honor-list {
    animation-play-state: paused; /* 暂停动画 */
}
/* 单个荣誉项：固定宽度，避免收缩 */
.honor-list li {
    flex-shrink: 0; /* 禁止项目收缩，保证宽度一致 */
    width: 280px; /* 固定每个项的宽度（可根据需求调整） */
}
/* 图片容器：统一高度，确保布局整齐 */
.honor-list figure {
    width: 100%;
    height: 350px; /* 保持原高度需求 */
    margin: 0;
    padding: 0;
    display: flex; /* 图片居中 */
    align-items: center; /* 垂直居中 */
    justify-content: center; /* 水平居中 */
    background-color: #fff; /* 空白背景，避免无图时突兀 */
}
/* 核心：图片自适应显示全（不拉伸、不裁剪） */
.honor-list img {
    width: auto !important; /* 宽度自适应，不强制拉伸 */
    height: 100% !important; /* 高度占满容器（350px） */
    max-width: 100% !important; /* 防止图片过宽超出容器 */
    object-fit: contain !important; /* 保持比例，完整显示图片（无裁剪） */
    display: block;
}
/* 图片标题：溢出处理 */
.honor-list p {
    text-align: center;
    margin: 10px 0 0;
    padding: 0 5px;
    white-space: nowrap; /* 禁止标题换行 */
    overflow: hidden; /* 隐藏超出部分 */
    text-overflow: ellipsis; /* 超出显示省略号 */
    color: #333;
}
/* CSS动画：实现横向滚动（关键帧） */
@keyframes scroll {
    0% {
        transform: translateX(0); /* 起始位置：无偏移 */
    }
    100% {
        /* 结束位置：向左滚动“原列表宽度”（实现无缝循环） */
        /* 注意：需确保列表包含“原列表+复制列表”，否则会出现空白 */
        transform: translateX(-50%); /* 50%对应“原列表占总列表的一半” */
    }
}

/* 品牌文化板块图片自适应 */
.about-sec1 .left img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    display: block;
}

/* 专利成果板块样式 */
.info-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.content-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    gap: 20px;
    padding: 20px;
}
.service-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.service-item {
    padding: 5px 7px;
    border-bottom: 1px solid #eee;
}
.service-item:last-child {
    border-bottom: none;
}
.service-link {
    text-decoration: none;
    color: #333;
    display: block;
}
.service-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* 响应式调整（移动端适配） */
@media (max-width: 768px) {
    /* 移动端荣誉项宽度缩小 */
    .honor-list li {
        width: 220px;
    }
    /* 移动端图片容器高度降低 */
    .honor-list figure {
        height: 280px;
    }
    /* 移动端滚动速度调整（保持视觉一致） */
    .honor-list {
        animation-duration: 15s; /* 缩短时长，加快滚动速度 */
    }
    /* 容器左右留白，避免内容贴边 */
    .w1240 {
        padding: 0 15px;
    }
}
.about-sec5 {
/*     padding: 60px 0; */
    background-color: #fff;
    position: relative; /* 关键：作为按钮的定位父级（不滚动） */
}

.about-tit {
    text-align: center;
/*     margin-bottom: 40px; */
}

.about-tit h2 {
    font-size: 32px;
    color: #333;
    display: inline-block;
    padding-bottom: 10px;
/*     border-bottom: 3px solid #0066cc; */
}

/* 外层容器（固定宽度，不滚动） */
.w1240 {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative; /* 按钮相对于此容器定位 */
}

/* 滚动视口（仅内容滚动，不影响按钮） */
.honor-viewport {
    width: 100%;
    overflow-x: auto; /* 仅内容横向滚动 */
    overflow-y: hidden;
  /*   padding: 40px 0;  *//* 上下留白，避免按钮遮挡内容 */
}

/* 核心：按钮完全固定（基于w1240容器定位） */
.honor-btn {
    position: absolute; /* 相对于外层w1240容器定位 */
    top: 50%; /* 垂直居中（相对于容器高度） */
    transform: translateY(-50%); /* 精确居中 */
    z-index: 20; /* 确保在所有内容上方 */
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.3);
    border: none;
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    /* 禁止按钮被滚动影响 */
    pointer-events: auto;
    user-select: none;
}

/* 左按钮固定在容器左侧 */
.honor-prev {
    left: 0; /* 贴紧外层容器左侧 */
}

/* 右按钮固定在容器右侧 */
.honor-next {
    right: 0; /* 贴紧外层容器右侧 */
}

/* 按钮图标 */
.honor-btn svg {
    width: 24px;
    height: 24px;
}

.honor-btn svg path {
    stroke: #fff;
}

.honor-btn:hover {
    background-color: #f0f0f0;
}

/* 荣誉列表（仅内容滚动） */
.honor-list {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 25px;
    width: max-content; /* 内容宽度自适应，允许滚动 */
}

/* 单个荣誉项 */
.honor-list li {
    width: 280px;
    flex-shrink: 0;
}

.honor-list figure {
    width: 100%;
    height: 350px;
    margin: 0;
    padding: 15px;
    background: white;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.honor-list img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.honor-list p {
    text-align: center;
    margin: 15px 0 0;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.honor-list li:hover p{ color: #0000ff;} 
/* 隐藏滚动条 */
.honor-viewport::-webkit-scrollbar {
    display: none;
}

/* 移动端适配 */
@media (max-width: 768px) {
    .honor-list li {
        width: 220px;
    }
    .honor-list figure {
        height: 280px;
    }
    .honor-btn {
        width: 40px;
        height: 40px;
    }
    .w1240 {
        padding: 0 10px;
    }
}

