/* ========== 全局重置与公共样式（完整，兼容所有浏览器） ========== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Microsoft YaHei", "Heiti SC", sans-serif;
}

ul, li {
    list-style: none;
}

a {
    text-decoration: none;
    color: inherit;
}

/*img {*/
/*    max-width: 100%;*/
/*    height: auto;*/
/*    display: block;*/
/*}*/

textarea, input, button {
    outline: none;
    font-family: inherit;
}

/* 公共容器（80%宽度，居中，适配所有模块） */
.top-container, .head-container, .advantage-container,
.help-video-container, .application-container, .partner-container,
.news-container, .join-us-container, .footer-container {
    width: 80%;
    margin: 0 auto;
}

.partner-container{background:url('/skin/images/panter_bg.png'); background-repeat: no-repeat; height:auto; overflow:hidden; height:690px;background-size:100%}
/* 公共蓝色横线（所有模块底部，统一样式） */
.section-line {
    width: 100%;
    height: 2px;
    background-color: #014ea0;
    margin-top: 50px;
    clear: both;
}

/* 公共标题样式（40px，居中，统一所有模块标题） */
.section-title {
    font-size: 40px;
    text-align: center;
    margin-bottom: 20px;
    color: #333;
    font-weight: 600;
}

.indexsection-title {
    font-size: 30px;
    text-align: center;
    margin-bottom: 20px;
    color: #333;
    font-weight: 600;
}

/* 公共简介样式（灰色，居中，统一所有模块简介） */
.section-desc {
    text-align: center;
    color: #666;
    margin-bottom: 80px;
    line-height: 1.8;
    font-size: 16px;
}

.hz-section-desc {
    text-align: center;
    color: #666;
    margin-bottom: 10vh;
    line-height: 1.8;
    font-size: 16px;
}


/* ========== Header - Top 部分（完整样式，z-index高于head） ========== */
.top-bar {
    background-color: #014ea0;
    height: 36px;
    position: relative;
    z-index: 100; /* 高于head部分（z-index:99） */
    width: 100%;
}

.top-container {
    height: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.top-menu {
    display: flex;
    height: 100%;
}

.top-menu-item {
    color: #fff;
    display: flex;
    align-items: center;
    padding: 0 18px;
    height: 100%;
    cursor: pointer;
    position: relative;
    transition: background-color 0.3s ease;
}

.top-menu-item:hover {
    background-color: #0066cc; /* 滑过背景变蓝，文字保持白色 */
}

.top-icon {
    width: auto;
    height: auto;
    margin-right: 6px;
    opacity: 1;
}

.top-menu-text {
    font-size: 14px;
}

/* 产品搜索弹出框（完整样式，hover显示，无重叠） */
.search-popup {
    position: absolute;
    top: 36px;
    right: 0;
    background-color: #fff;
    padding: 12px;
    border-radius: 3px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    display: none;
    z-index: 101;
    width: 280px;
}

.search-input {
    width: 200px;
    padding: 6px 10px;
    border: 1px solid #ccc;
    border-radius: 3px;
    margin-right: 8px;
    font-size: 14px;
}

.search-btn {
    padding: 6px 10px;
    background-color: #014ea0;
    color: #fff;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.3s ease;
}

.search-btn:hover {
    background-color: #0066cc;
}

.search-item:hover .search-popup {
    display: flex;
    align-items: center;
}

/* 语言下拉菜单（优化灵敏性，hover展开流畅，无间隙卡顿） */
.language-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    color: #333;
    border-radius: 3px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    display: none;
    opacity: 0;
    visibility: hidden; /* 新增：配合opacity实现平滑过渡，避免瞬间隐藏 */
    transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out; /* 新增：过渡效果 */
    white-space: nowrap;
    z-index: 101;
    width: 120px;
    margin-top: -1px; /* 新增：填补父项与下拉菜单的微小间隙，避免鼠标滑过中断 */
    padding-top: 5px; /* 新增：扩大顶部可触发区域，提升容错率 */
    padding-bottom: 5px;
}

.language-option {
    padding: 10px 15px;
    white-space: nowrap;
    font-size: 14px;
    transition: background-color 0.3s ease, color 0.3s ease;
    text-align: center;
    cursor: pointer; /* 新增：明确鼠标指针样式，提升交互感知 */
}

.language-option:hover {
    background-color: #014ea0;
    color: #fff;
}

/* 优化父项hover状态：同时控制下拉菜单的显示/隐藏，增加延迟容错 */
.language-item {
    position: relative; /* 确保下拉菜单定位基准稳定 */
}

.language-item:hover .language-dropdown {
    display: block;
    opacity: 1;
    visibility: visible; /* 新增：配合opacity显示，实现平滑过渡 */
}

/* 新增：给语言下拉菜单添加伪元素，填补父项下方间隙，进一步提升灵敏性 */
.language-dropdown::before {
    content: "";
    position: absolute;
    top: -10px; /* 向上延伸10px，覆盖父项与下拉菜单的间隙 */
    left: 0;
    width: 100%;
    height: 10px;
    background-color: transparent; /* 透明不可见，仅用于捕获鼠标事件 */
}

/* 辅助优化：提升下拉菜单鼠标事件捕获优先级，避免灵敏性受干扰 */
.language-dropdown {
    pointer-events: auto; /* 明确开启鼠标事件捕获 */
}

.language-item {
    pointer-events: auto; /* 确保父项始终响应鼠标事件 */
}

/* ========== Header - Head 部分（完整样式，响应式，二级下拉） ========== */
.head-bar {
    background-color: #fff;
    height: 90px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    position: relative;
    z-index: 99; /* 低于top部分（z-index:100） */
    width: 100%;
}

.head-container {
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Logo 样式（宽度20%，居右10%，完整布局） */
.logo {
    width: 10%;
    margin-right: 10%; /* 居右10%，符合需求 */
    display: flex;
    align-items: center;
}

.logo-img {
    height: 60px;
    width: auto;
}

/* 桌面端导航（完整样式，二级下拉缓慢显示） */
.desktop-nav {
    width: 80%;
    display: block;
}

.nav-menu {
    display: flex;
    justify-content: space-around;
    align-items: center;
    height: 100%;
}

.nav-item {
    position: relative;
    font-size: 0.8rem;
    color: #333;
    padding: 0;
    line-height: 90px;
    height: 90px;
    cursor: pointer;
}

.nav-link {
    padding: 10px 10px;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: #014ea0;
}

/* 二级下拉菜单（多行1列，隐藏，hover缓慢显示，白色背景，圆角3px） */
.submenu {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    border-radius: 3px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    white-space: nowrap;
    z-index: 99;
    width: 230px;
}


.submenu-item {
    /* 清理重复的padding，合并为一行更规范 */
    padding: 5px 20px;
    line-height: 30px;
    font-size: 0.7rem;
    text-align: left;
    /* 英文换行核心属性（完整适配方案） */
    word-wrap: break-word;        /* 允许长单词内换行 */
    word-break: break-all;        /* 强制英文任意字符处换行（适配长单词/URL） */
    overflow-wrap: break-word;    /* CSS3标准写法，兼容新版浏览器 */
    white-space: normal;          /* 恢复默认换行规则（防止被其他样式覆盖） */
    transition: background-color 0.3s ease;
}

.submenu-link {
    display: block;
         word-wrap: break-word;
    padding: 5px 0;
    transition: color 0.3s ease;
}

.submenu-item:hover {
    background-color: #f5f9ff;
}

.submenu-link:hover {
    color: #014ea0;
}

.has-submenu:hover .submenu {
    display: block;
    opacity: 1;
}

/* 移动端三横线按钮（默认隐藏，768px以下显示，完整样式） */
.mobile-menu-btn {
    width: 30px;
    height: 20px;
    display: none;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
    position: absolute;
    right: 5%;
    top: 50%;
    transform: translateY(-50%);
    z-index: 102;
}

.menu-line {
    width: 100%;
    height: 3px;
    background-color: #333;
    border-radius: 2px;
    transition: all 0.3s ease;
}

/* 移动端弹出菜单（默认隐藏，点击显示，完整样式，无重叠） */
.mobile-menu-popup {
    position: fixed;
    top: 0;
    right: 0;
    width: 80%;
    max-width: 320px;
    height: 100vh;
    background-color: #fff;
    box-shadow: -2px 0 10px rgba(0,0,0,0.2);
    z-index: 200;
    transform: translateX(100%);
    transition: transform 0.3s ease-in-out;
    padding: 25px;
    overflow-y: auto;
}

.mobile-menu-popup.active {
    transform: translateX(0);
}

.mobile-menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 35px;
    font-size: 18px;
    font-weight: 600;
    color: #333;
    padding-bottom: 15px;
    border-bottom: 1px solid #eee;
}

.mobile-menu-close {
    font-size: 26px;
    cursor: pointer;
    color: #666;
    transition: color 0.3s ease;
}

.mobile-menu-close:hover {
    color: #ff4444;
}

.mobile-nav-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 16px;
    color: #333;
    transition: color 0.3s ease;
}

.mobile-nav-link:hover {
    color: #014ea0;
}

.submenu-toggle {
    font-size: 18px;
    color: #666;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mobile-submenu {
    display: none;
    padding-left: 20px;
    border-left: 2px solid #014ea0;
    margin: 10px 0 20px 0;
}

.mobile-submenu.active {
    display: block;
}

.mobile-submenu-item {
    padding: 12px 0;
    border-bottom: 1px solid #f5f5f5;
}

.mobile-submenu-link {
    font-size: 14px;
    color: #666;
    transition: color 0.3s ease;
}

.mobile-submenu-link:hover {
    color: #014ea0;
}

/* ========== Banner 部分（完整轮播样式，无箭头，圆点切换） ========== */
.banner {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.banner-swiper {
    width: 100%;
    height: auto;
}

.banner-slide {
    width: 100%;
}

.banner-img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* 隐藏Swiper默认左右箭头（强制隐藏，符合需求） */
.swiper-button-prev, .swiper-button-next {
    display: none !important;
}

/* 轮播分页圆点（完整样式，可点击，蓝色主题） */
.banner-pagination {
    bottom: 50px !important;
}

.swiper-pagination-bullet {
    background-color: rgba(255,255,255,0.8) !important;
    opacity: 1 !important;
    width: 12px !important;
    height: 12px !important;
    margin: 0 6px !important;
}

.swiper-pagination-bullet-active {
    background-color: #014ea0 !important;
    width: 30px !important;
    border-radius: 6px !important;
    transition: all 0.3s ease;
}

/* ========== Advantage 部分（完整样式，数字滚动，响应式分行） ========== */
.advantage {
    padding: 60px 0;
    background-color: #f9f9f9;
}

.advantage-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.advantage-col {
    flex: 1;
    text-align: center;
    padding: 0 15px;
}

.advantage .col-title {
    font-size: 30px;
    color: #333;
    font-weight: 600;
    margin-right: 20px;
}

.col-data {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px 0;
}

.data-left {
    font-size: 3.2rem;
    color: #004d9e;
    margin-right: 0;
    font-weight: normal;
}

.data-right {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 1rem;
    color: #666;
}

.data-icon {
    margin-bottom: 12px;
    width: 45px;
    height: 45px;
    object-fit: contain;
}

.data-text {
    font-weight: 500;
}

/* ========== Help-video 部分（完整样式，左右浮动，上下结构） ========== */
.help-video {
    padding: 60px 0;
}

.help-video-container {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.video-left {
    width: 48%;
}


/* 新增：视频容器（相对定位，为播放按钮提供定位基准） */
.video-wrapper {
    position: relative;
    width: 100%;
    height: auto;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.video-wrapper video{z-index}

/* 新增：自定义播放按钮（居中叠加，圆形蓝色主题） */
.video-play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: rgba(1, 78, 160, 0.8); /* 主题蓝半透明 */
    color: #fff;
    font-size: 30px;
    border: none;
    cursor: pointer;
    z-index: 10; /* 确保在视频上方 */
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 8px; /* 微调三角形图标居中 */
}

/* 播放按钮hover效果：加深颜色，放大轻微 */
.video-play-btn:hover {
    background-color: rgba(1, 78, 160, 1); /* 纯主题蓝 */
    transform: translate(-50%, -50%) scale(1.05);
}

.help-video-player {
    width: 100%;
    height: auto;
    border-radius: 5px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

/* 视频播放时，隐藏自定义播放按钮（通过JS添加类名控制） */
.video-wrapper .video-play-btn.hidden {
    display: none;
}



.video-right {
    width: 48%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 20px;
}

.video-title {
    font-size: 26px;
    margin-bottom: 25px;
    color: #333;
    font-weight: 600;
}

.video-desc {
    font-size: 16px;
    color: #666;
    line-height: 1.8;
    margin-bottom: 35px;
    text-align: justify;
}

.video-more {
    display: flex;
    align-items: center;
    cursor: pointer;
    width: fit-content;
}

.more-icon {
    width: auto;
    height: auto;
    margin-right: 10px;
}

.more-text {
    color: #014ea0;
    font-size: 16px;
    font-weight: 500;
    transition: color 0.3s ease;
}

.video-more:hover .more-text {
    color: #0066cc;
}

/* ========== Application 部分（完整样式，2行5列，文字居中白色） ========== */
.application {
    padding: 60px 0;
    /*background-color: #f9f9f9;*/
}

.application-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.application-item {
    width: 19%;
    margin-bottom: 35px;
    position: relative;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.app-img {
    width: 100%;
    height: auto;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.application-item:hover .app-img {
    transform: scale(1.05);
}

.item-text {
    position: absolute;
    bottom: 40px;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 20px;
    color: #fff;
    font-weight: 600;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5);
}

.item-line {
    position: absolute;
    bottom: 15px;
    left: 0%;
    right: 20%;
    height: 1px;
    background-color: #fff;
    opacity: 0.8;
}

.line-bold {
    width: 5%;
    height: 3px;
    background-color: #fff;
    margin: 0 auto;
    transform: translateY(-1px);
    border-radius: 1px;
}

/* ========== Partner 部分（完整样式，3列3行3列，图片适配） ========== */
.partner {
    padding: 0;
}

.partner-row {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.partner-col {
    width: 32%;
    /*background-color: #f9f9f9;*/
    padding: 20px;
    margin-bottom: 140px;
    /*border-radius: 5px;*/
    
    /*box-shadow: 0 2px 8px rgba(0,0,0,0.1);*/
}

.partner-col-title {
 font-size: 20px;
    margin-bottom: 25px;
    padding: 12px 15px; /* 统一内边距，提升美观度 */
    font-weight: 600;
    position: relative; /* 为五百强横线提供定位基准 */
}


/* 1. 行业龙头标题：独立背景图片 + 白色文字 */
.title-industry {
    /* 核心：独立背景图片配置（替换为你的背景图路径） */
    background: url("../images/hylt_bg.png") no-repeat center center;
    background-size: cover; /* 背景图覆盖标题区域 */
    color: #fff; /* 白色文字 */
    border-radius: 5px; /* 与卡片风格统一 */
    position: relative;
    text-align: right;
    z-index: 1;
    width: 50%;
    margin: 0 auto;
}

/* 背景图遮罩（可选，避免背景图过亮导致文字看不清） */
.title-industry::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.4); /* 黑色半透明遮罩 */
    border-radius: 5px;
    z-index: -1;
}

/* 2. 重点企业标题：独立背景图片 + 白色文字（与行业龙头样式统一，仅替换背景图） */
.title-key {
    /* 核心：独立背景图片配置（替换为你的背景图路径） */
    background: url("../images/zdqy_bg.png") no-repeat center center;
    background-size: cover; /* 背景图覆盖标题区域 */
    color: #fff; /* 白色文字 */
    border-radius: 5px; /* 与卡片风格统一 */
    position: relative;
    text-align: left;
    z-index: 1;
    width: 50%;
    margin: 0 auto;
}

/* 背景图遮罩（可选，避免背景图过亮导致文字看不清） */
.title-key::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.4); /* 黑色半透明遮罩 */
    border-radius: 5px;
    z-index: -1;
}

/* 3. 五百强标题：蓝色字 + 下方短横线 + 横线中间加粗小长方形 */
.title-fortune {
    color: #014ea0; /* 核心：蓝色文字（与项目主题色统一） */
    text-align: center; /* 文字居中，横线也居中 */
    padding-bottom: 15px; /* 预留横线空间 */
}

/* 下方短横线（基础横线） */
.title-fortune::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80px; /* 短横线宽度 */
    height: 1px; /* 横线高度 */
    background-color: #ccc; /* 横线默认颜色 */
}

/* 横线中间加粗小长方形（核心亮点） */
.title-fortune::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 20px; /* 加粗小长方形宽度 */
    height: 3px; /* 加粗小长方形高度（比横线粗） */
    background-color: #014ea0; /* 与文字同色，蓝色 */
    border-radius: 1px; /* 轻微圆角，提升美观度 */
}

.partner-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.partner-img {
    width: 31%;
    height: auto;
    object-fit: contain;
    margin-bottom: auto;
    /*border: 1px solid #eee;*/
    padding: 10px;
    border-radius: 3px;
    /*background-color: #fff;*/
    transition: box-shadow 0.3s ease;
}

.partner-img:hover {
    /*box-shadow: 0 2px 8px rgba(0,0,0,0.15);*/
}

/* ========== News 部分（完整样式，1行4列，日期右上角白色） ========== */
.news {
    padding: 60px 0;
    background-color: #fff;
}

.news-row {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.news-col {
    width: 23%;
    background-color: #fff;
    padding: 15px;
    border-radius: 5px;
    /*box-shadow: 0 2px 8px rgba(0,0,0,0.1);*/
    /*transition: box-shadow 0.3s ease;*/
}

.news-col:hover {
    box-shadow: 0 5px 15px rgba(0,0,0,0.15);
}

.news-img-box {
    position: relative;
    margin-bottom: 18px;
    border-radius: 5px;
    overflow: hidden;
}

.news-img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.news-col:hover .news-img {
    transform: scale(1.05);
}

.news-date {
    position: absolute;
    bottom: 10px;
    right: 10px;
    background-color: rgba(1,78,160,0.9);
    color: #fff;
    padding: 5px 10px;
    border-radius: 3px;
    font-size: 14px;
}

.news-title {
    font-size: 20px;
    margin-bottom: 12px;
    color: #333;
    line-height: 1.4;
    font-weight: 600;
    height: 56px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.news-brief {
    font-size: 14px;
    color: #666;
    line-height: 1.2;
    margin-bottom: 18px;
    height: auto;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.news-more {
    display: flex;
    align-items: center;
    width: fit-content;
}

.news-more .more-text {
    font-size: 14px;
    color: #666;
    font-weight: normal;
    transition: color 0.3s ease;
}

.news-more:hover .more-text {
    color: #014ea0;
}

/* ========== Join-us 部分（完整样式，背景图片，居中白色60px文字） ========== */
.join-us {
    width: 100%;
    height: 90px;
    background: url("../images/join-bg.png") no-repeat center center;
    background-size: cover;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.join-us::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    z-index: 1;
}

.join-us-container {
    position: relative;
    z-index: 2;
    width: 80%;
    margin: 0 auto;
}

.join-content {
    display: flex;
    align-items: center;
    justify-content: center;
}

.join-icon {
    width: 55px;
    height: 55px;
    margin-right: 25px;
    object-fit: contain;
}

.join-text {
    font-size: 30px;
    color: #fff;
    font-weight: normal;
    text-shadow: 0 2px 8px rgba(0,0,0,0.5);
}

/* ========== Footer 部分（完整样式，深色背景，两行布局） ========== */
footer {
    background-color: #262525;
    padding: 60px 0 30px 0;
    color: #fff;
    width: 100%;
}

.footer-top {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

.footer-left {
    width: 40%;
}

.footer-logo-box {
    display: flex;
    align-items: center;
    margin-bottom: 35px;
}

.footer-logo {
    width: 120px;
    height: auto;
    margin-right: 25px;
}

.footer-slogan {
    background-color: #fff;
    color: #333;
    padding: 8px 25px;
    border-radius: 5px;
    position: relative;
    font-size: 14px;
    font-weight: 500;
}

.slogan-arrow {
    position: absolute;
    left: -10px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 10px solid #fff;
}

.footer-form {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.form-input {
    padding: 12px 15px;
    border-radius: 5px;
    border: none;
    font-size: 14px;
    color: #333;
}

.form-textarea {
    padding: 12px 15px;
    border-radius: 5px;
    border: none;
    resize: none;
    font-size: 14px;
    color: #333;
}

.form-btn {
    padding: 12px;
    background-color: #014ea0;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.form-btn:hover {
    background-color: #0066cc;
}

.footer-right {
    width: 55%;
    display: flex;
    justify-content: space-between;
}

.footer-col {
    width: 20%;
}

.footer-col-title {
    font-size: 14px;
    margin-bottom: 25px;
    padding-bottom: 12px;
    border-bottom: 1px solid #666;
    font-weight: 600;
}

.footer-col-list {
    margin-top: 15px;
}

.footer-list-item {
    margin-bottom: 12px;
    color: #ccc;
    font-size: 12px;
}

.footer-list-link {
    transition: color 0.3s ease;
}

.footer-list-link:hover {
    color: #014ea0;
}

.contact-col {
    width: 30%;
}

.contact-item {
    display: flex;
    align-items: center;
    margin-bottom: 18px;
    color: #ccc;
    font-size: 14px;
}

.contact-icon {
    width: 18px;
    height: 18px;
    margin-right: 12px;
}

.contact-qrcode {
    width: 90px;
    height: 90px;
    border: 2px solid #fff;
    border-radius: 5px;
    margin-top: 10px;
}

.footer-bottom {
    text-align: center;
    padding-top: 25px;
    border-top: 1px solid #444;
}

.copyright-text {
    font-size: 14px;
    color: #ccc;
    line-height: 1.8;
}
@media (max-width: 1200px){
    
 .top-container, .head-container, .advantage-container,
.help-video-container, .application-container, .partner-container,
.news-container, .join-us-container, .footer-container {
    width: 100%;
    margin: 0 auto;
}
.data-icon {
    margin-bottom: 12px;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}
.advantage-col {
    flex: 1;
    text-align: center;
    padding: 0;
}
.data-right {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: .8rem;
    color: #666;
}

        .nav-item {
    position: relative;
    font-size: 1rem;
    color: #333;
    padding: 0;
    line-height: 90px;
    height: 90px;
    cursor: pointer;
}
.nav-link {
    padding: 10px 5px;
    transition: color 0.3s ease;
}
    
}
@media (max-width: 992px){ 
    .nav-item {
    position: relative;
    font-size: .8rem;
    color: #333;
    padding: 0;
    line-height: 90px;
    height: 90px;
    cursor: pointer;
}
.col-title {
    font-size: 30px;
    color: #333;
    font-weight: 600;
    margin-right: 20px;
}

.data-right {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: .7rem;
    color: #666;
}


.data-left {
    font-size: 3rem;
    color: #004d9e;
    margin-right: 0;
    font-weight: normal;
}
.nav-link {
    padding: 10px 5px;
    transition: color 0.3s ease;
}
}
/* ========== 响应式布局（768px以下移动端，完整适配，无漏洞） ========== */
@media (max-width: 768px) {
    /* 公共容器改为90%宽度，适配移动端 */
    .top-container, .head-container, .advantage-container,
    .help-video-container, .application-container, .partner-container,
    .news-container, .join-us-container, .footer-container {
        width: 90%;
    }
.data-right {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: .8rem;
    color: #666;
}


.top-icon {
    max-width: 100%;
    height: auto;
    margin-right: 6px;
    opacity: 1;
}

    /* 公共样式适配移动端 */
    .section-title {
        font-size: 30px;
    }
    
        .indexsection-title {
        font-size: 30px;
    }

    .section-desc {
        font-size: 14px;
        margin-bottom: 30px;
    }
       .hz-section-desc {
        font-size: 14px;
        margin-bottom: 30px;
    }

    .section-line {
        margin-top: 35px;
    }

    /* Header - Top 部分移动端适配 */
    .top-menu-item {
        padding: 0 5px;
    }

    .top-menu-text {
        font-size: .6rem;
    }

    .search-popup {
        width: 220px;
        padding: 10px;
    }

    .search-input {
        width: 150px;
        font-size: 12px;
    }

    .search-btn {
        padding: 6px 10px;
        font-size: 12px;
    }

    /* Header - Head 部分移动端适配 */
    .head-bar {
        height: 70px;
    }

    .logo {
        width: 60%;
        margin-right: 0;
    }

    .logo-img {
        height: 45px;
    }

    .desktop-nav {
        display: none; /* 隐藏桌面端导航 */
    }

    .mobile-menu-btn {
        display: flex; /* 显示移动端三横线按钮 */
    }

/* Advantage 部分移动端适配（终极修复：col-title彻底独占一行，无任何干扰） */
.advantage {
    padding: 40px 0;
}

.advantage-row {
    flex-direction: row;
    flex-wrap: wrap; /* 允许子元素换行，为col-title独占一行提供基础 */
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
}

/* 1. 核心优势：彻底独占一行，同时兼容flex布局和清除浮动，无任何干扰 */
.advantage-col.col-title {
    /* flex布局专属属性：强制独占一行 */
    flex-basis: 100%; /* 占据flex容器的全部宽度 */
    flex-grow: 1; /* 自动填充剩余宽度，确保无留白 */
    flex-shrink: 0; /* 禁止收缩，确保宽度不被挤压 */
    /* 浮动清除相关：彻底杜绝浮动干扰，兼容非flex场景 */
    clear: both; /* 核心：清除左右两侧所有浮动 */
    float: none; /* 明确取消任何浮动属性 */
    display: block; /* 强化块级元素特性 */
    /* 样式优化：确保居中、无偏移 */
    font-size: 30px;
    margin: 0 0 30px 0; /* 仅底部留间距，左右无多余间距 */
    text-align: center; /* 居中对齐 */
    padding: 0; /* 取消左右内边距，避免偏移 */
}

/* 2. 第2、3列：并列显示，各占约50%宽度，形成独立一行 */
.advantage-col.col-data:nth-child(2),
.advantage-col.col-data:nth-child(3) {
    width: calc(50% - 6px);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 25px;
}

/* 3. 第4、5列：并列显示，与2/3列布局对齐，形成独立一行 */
.advantage-col.col-data:nth-child(4),
.advantage-col.col-data:nth-child(5) {
    width: calc(50% - 6px);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0;
}

/* 数字、图标样式适配，保持视觉一致性 */
.data-left {
    font-size: 40px;
    margin-right: 12px;
}

.data-right {
    font-size: .8rem;
}

.data-icon {
    width: 35px;
    height: 35px;
}

/* Partner 部分 移动端标题样式适配 */
.partner-col-title {
    font-size: 20px;
    margin-bottom: 20px;
    padding: 10px 12px;
}

.partner-container{ no-repeat; height:auto; background:none; overflow:hidden; }

/* 五百强标题移动端适配（调整横线和长方形大小） */
.title-fortune::after {
    width: 60px; /* 移动端横线稍短 */
}

.title-fortune::before {
    width: 15px; /* 移动端小长方形稍窄 */
    height: 2px; /* 移动端小长方形稍细 */
}

    /* Help-video 部分移动端适配 */
    .help-video {
        padding: 40px 0;
    }

    .video-left, .video-right {
        width: 100%;
        margin-bottom: 30px;
    }

    .video-right {
        padding: 0;
    }

    .video-title {
        font-size: 22px;
        margin-bottom: 20px;
    }

    .video-desc {
        font-size: 14px;
        margin-bottom: 25px;
    }

    /* Application 部分移动端适配 */
    .application {
        padding: 40px 0;
    }

    .application-item {
        width: 48%;
        margin-bottom: 25px;
    }

    .app-img {
        height: 150px;
    }

    .item-text {
        font-size: 22px;
    }

    /* Partner 部分移动端适配 */
    .partner {
        padding: 40px 0;
    }

    .partner-col {
        width: 100%;
        margin-bottom: auto;
    }

    .partner-img {
        height: auto;
    }

    /* News 部分移动端适配 */
    .news {
        padding: 40px 0;
    }

    .news-col {
        width: 100%;
        margin-bottom: 30px;
    }

    .news-img {
        height: 200px;
    }

    .news-title {
        font-size: 18px;
        height: auto;
        -webkit-line-clamp: unset;
    }

    .news-brief {
        font-size: 14px;
        height: auto;
        -webkit-line-clamp: unset;
    }

    /* Join-us 部分移动端适配 */
    .join-us {
        height: 70px;
    }

    .join-icon {
        width: 35px;
        height: 35px;
        margin-right: 15px;
    }

    .join-text {
        font-size: 30px;
    }

    /* Footer 部分移动端适配 */
    footer {
        padding: 40px 0 20px 0;
    }

    .footer-top {
        flex-direction: column;
        margin-bottom: 35px;
    }

    .footer-left, .footer-right {
        width: 100%;
        margin-bottom: 35px;
    }

    .footer-logo {
        width: 100px;
        margin-right: 15px;
    }

    .footer-slogan {
        font-size: 14px;
        padding: 6px 20px;
    }

    .footer-right {
        flex-wrap: wrap;
    }

    .footer-col {
        width: 48%;
        margin-bottom: 30px;
    }

    .contact-col {
        width: 48%;
    }

    .copyright-text {
        font-size: 12px;
    }
}

/* 小屏移动端额外适配（480px以下） */
@media (max-width: 480px) {
 
/* 小屏移动端（480px以下）：Advantage列独占一行，避免拥挤 */
.advantage-col.col-data:nth-child(2),
.advantage-col.col-data:nth-child(3),
.advantage-col.col-data:nth-child(4),
.advantage-col.col-data:nth-child(5) {
    width: 100%; /* 独占一行 */
    margin-bottom: 25px;
}

/* 最后一列取消底部间距，保持布局整洁 */
.advantage-col.col-data:nth-child(5) {
    margin-bottom: 0;
}

    .application-item {
        width: 48%;
    }

    .join-text {
        font-size: 24px;
    }
}


.container-90 {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
}
/* ========== 1. pagebanner 通栏banner模块 ========== */
.pagebanner {
    width: 100%;
    position: relative;
}

.pagebanner-bg {
    /* 通栏背景（替换为实际banner背景图） */
    background: url("../images/pagebanner-product.jpg") no-repeat center center;
    background-size: cover;
    padding: 80px 0 0 0;
    position: relative;
}
/* banner底部透明黑色遮罩（当前位置区域背景） */
.pagebanner-bg::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60px;
    background-color: rgba(0, 0, 0, 0.5); /* 透明黑色 */
}
/*工程案例banner*/
.casebanner-bg {
    /* 通栏背景（替换为实际banner背景图） */
    background: url("../images/bannr-case.jpg") no-repeat center center;
    background-size: cover;
    padding: 80px 0 0 0;
    position: relative;
}
/* 工程案例banner底部透明黑色遮罩（当前位置区域背景） */
.casebanner-bg::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60px;
    background-color: rgba(0, 0, 0, 0.5); /* 透明黑色 */
}
/*质量保障banner*/
.zlbanner-bg {
    /* 通栏背景（替换为实际banner背景图） */
    background: url("../images/bannr-zlbz.jpg") no-repeat center center;
    background-size: cover;
    padding: 80px 0 0 0;
    position: relative;
}
/* 质量保障banner底部透明黑色遮罩（当前位置区域背景） */
.zlbanner-bg::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60px;
    background-color: rgba(0, 0, 0, 0.5); /* 透明黑色 */
}
/*服务支持banner*/
.fwzcbanner-bg {
    /* 通栏背景（替换为实际banner背景图） */
    background: url("../images/banner-fwzc.jpg") no-repeat center center;
    background-size: cover;
    padding: 80px 0 0 0;
    position: relative;
}
/* 服务支持banner底部透明黑色遮罩（当前位置区域背景） */
.fwzcbanner-bg::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60px;
    background-color: rgba(0, 0, 0, 0.5); /* 透明黑色 */
}
/*关于我们banner*/
.aboutbanner-bg {
    /* 通栏背景（替换为实际banner背景图） */
    background: url("../images/bannr-about.jpg") no-repeat center center;
    background-size: cover;
    padding: 80px 0 0 0;
    position: relative;
}
/* 关于我们banner底部透明黑色遮罩（当前位置区域背景） */
.aboutbanner-bg::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60px;
    background-color: rgba(0, 0, 0, 0.5); /* 透明黑色 */
}
/*新闻中心banner*/
.newsbanner-bg {
    /* 通栏背景（替换为实际banner背景图） */
    background: url("../images/banner-news.jpg") no-repeat center center;
    background-size: cover;
    padding: 80px 0 0 0;
    position: relative;
}
/* 新闻中心banner底部透明黑色遮罩（当前位置区域背景） */
.newsbanner-bg::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60px;
    background-color: rgba(0, 0, 0, 0.5); /* 透明黑色 */
}
/*联系我们banner*/
.contactbanner-bg {
    /* 通栏背景（替换为实际banner背景图） */
    background: url("../images/bannr-contact.jpg") no-repeat center center;
    background-size: cover;
    padding: 80px 0 0 0;
    position: relative;
}
/* 新闻中心banner底部透明黑色遮罩（当前位置区域背景） */
.contactbanner-bg::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60px;
    background-color: rgba(0, 0, 0, 0.5); /* 透明黑色 */
}

.pagebanner-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
    position: relative;
    z-index: 10;
}

.pagebanner-content {
    margin-bottom: 80px;
}

.pagebanner-title {
    font-size: 40px;
    color: #fff;
    margin-bottom: 15px;
    font-weight: 600;
}

.pagebanner-desc {
    font-size: 16px;
    color: #fff;
    line-height: 1.6;
}

.pagebanner-position {
    display: flex;
    align-items: center;
    padding: 18px 0;
}

.position-icon {
    width: 18px;
    height: 18px;
    margin-right: 10px;
    filter: brightness(100); /* 确保图标为白色（若原图非白色） */
}

.position-text {
    font-size: 14px;
    color: #fff;
}

/* ========== 2. catelog 产品分类导航模块 ========== */
.catelog {
    width: 100%;
    margin-top: 50px; /* 顶部距离banner 100px */
}

.catelog-bg {
    width: 100%;
}

.catelog-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
    height: auto;
    line-height: auto;
    position: relative;
}

.catelog-list {
    display: flex;
    flex-wrap: wrap;
    gap: 40px; /* 分类之间间距 */
}

.catelog-item {
    float: left; /* 左右浮动布局 */
    margin-right: 30px; /* 右侧间距（兼容浮动） */
}

/* 去除最后一个项的右侧间距 */
.catelog-item:last-child {
    margin-right: 0;
}

.catelog-item a {
    font-size: 16px;
    color: #333;
    transition: all 0.3s ease;
    display: inline-block;
    padding-bottom: 10px;
    position: relative;
}

/* 激活状态：文字蓝色+加粗 */
.catelog-item.active a,
.catelog-item a:hover {
    color: #014ea0;
    font-weight: 700;
}

/* 激活状态：下方加粗蓝色横线 */
.catelog-item.active a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -13px;
    width: 100%;
    height: 3px; /* 加粗横线 */
    background-color: #014ea0;
    border-radius: 1px;
}

/* 底部灰色横线（默认） */
.catelog-line {
    width: 100%;
    height: 1px;
    background-color: #e0e0e0; /* 灰色横线 */
    margin-top: 10px;
    clear: both; /* 清除浮动，确保横线铺满 */
}

/* ========== 3. cateclass 当前栏目分类名称模块 ========== */
.cateclass {
    width: 100%;
    margin-top: 60px;
}

.cateclass-bg {
    width: 100%;
}

.cateclass-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
}

.cateclass-name {
    font-size: 2rem;
    color: #014ea0;
    font-weight: 700;
}

/* ========== 4. productlist 产品列表模块 ========== */
.productlist {
    width: 100%;
    margin-top: 60px;
}

.productlist-bg {
    width: 100%;
}

.productlist-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
}

.product-grid {
    width: 100%;
    overflow: hidden; /* 清除浮动 */
    margin-bottom: 40px;
}

.product-item {
    width: calc(25% - 15px); /* 4列布局，右间距20px，计算后每列宽度 */
    float: left;
    margin-right: 20px; /* 右间距20px */
    margin-bottom: 30px;
    background-color: #f5f5f5; /* 灰色背景 */
    border-radius: 8px;
    padding: 20px;
}

/* 每4列去除右侧间距 */
.product-item:nth-child(4n) {
    margin-right: 0;
}

.product-img-wrapper {
    background-color: #fff; /* 图片白色背景 */
    border: 1px solid #e0e0e0; /* 灰色实线边框 */
    border-radius: 10px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
    overflow: hidden;
    height: 200px; /* 固定图片容器高度，确保垂直居中 */
}

.product-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain; /* 保持图片比例，垂直居中 */
}

.product-title {
    font-size: 20px;
    color: #014ea0;
    margin-bottom: 10px;
    font-weight: 600;
}

.product-desc {
    font-size: 14px;
    color: #666; /* 灰色 */
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* 限制3行显示 */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 底部6px高度蓝色横线 */
.productlist-bottom-line {
    width: 100%;
    height: 6px;
    background-color: #014ea0;
    border-radius: 3px;
}

/* ========== 5. contactintro 联系我们文字介绍模块 ========== */
.contactintro {
    width: 100%;
    margin: 50px auto; /* 顶部距离产品列表 100px */
}

.contactintro-bg {
    width: 100%;
}

.contactintro-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
    text-align: center; /* 按钮居中，文字可选居中 */
}

.contactintro-text {
    font-size: 14px;
    line-height: 180%; /* 行高180% */
    color: #333;
    margin-bottom: 40px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: justify;
}

.contact-btn {
    font-size: 18px;
    color: #fff;
    background-color: #014ea0;
    border: none;
    padding: 12px 40px;
    border-radius: 999px; /* 左右半圆（全圆角） */
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.contact-btn:hover {
    background-color: #0066cc;
}

/* ========== 移动端自适应布局（@media (max-width: 768px)） ========== */
@media (max-width: 768px) {
    /* 1. pagebanner 移动端适配 */
    .pagebanner-bg {
        padding: 80px 0 0 0;
    }

    .pagebanner-title {
        font-size: 30px;
    }

    .pagebanner-desc {
        font-size: 14px;
    }

    .pagebanner-bg::after {
        height: 50px;
    }

    /* 2. catelog 移动端适配 */
    .catelog {
        margin-top: 60px;
    }

    .catelog-item {
        float: none;
        display: inline-block;
        margin-right: 20px;
        margin-bottom: 15px;
    }

    .catelog-list {
        gap: 20px;
    }

    /* 3. cateclass 移动端适配 */
    .cateclass-name {
        font-size: 30px;
    }

    /* 4. productlist 移动端适配（改为2列布局，最后一列无间距） */
    .product-item {
        width: calc(50% - 10px);
        margin-right: 20px;
    }

    .product-item:nth-child(2n) {
        margin-right: 0;
    }

    .product-item:nth-child(4n) {
        margin-right: 20px;
    }

    .product-img-wrapper {
        height: 150px;
    }

    /* 5. contactintro 移动端适配 */
    .contactintro {
        margin-top: 60px;
    }

    .contact-btn {
        padding: 10px 30px;
        font-size: 16px;
    }
}

/* 小屏移动端（@media (max-width: 480px)） */
@media (max-width: 480px) {
    /* 产品列表改为1列布局 */
    .product-item {
        width: 100%;
        margin-right: 0;
    }

    .product-item:nth-child(2n),
    .product-item:nth-child(4n) {
        margin-right: 0;
    }

    .cateclass-name {
        font-size: 24px;
    }
    
}
    
 
 /* ========== 4. productdetail 产品详情模块（核心样式） ========== */
.productdetail {
    width: 100%;
    margin-top: 60px;
}

.productdetail-bg {
    width: 100%;
}

.productdetail-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
    overflow: hidden; /* 清除子元素浮动带来的高度塌陷 */
}

/* 主体左右浮动布局 */
.productdetail-left {
    width: 20%; /* 左侧宽度20% */
    float: left;
    background-color: #f5f5f5; /* 灰色背景 */
    border-radius: 3px;
    padding: 25px 20px;
}

.productdetail-right {
    width: 78%; /* 右侧宽度78%（预留2%间距） */
    float: right;
}

/* 左侧标题：20px 加粗 */
.productdetail-left-title {
    font-size: 20px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e0e0e0;
}

/* 左侧产品列表：圆点+标题形式 */
.productdetail-left-list {
    width: 100%;
}

.productdetail-left-item {
    font-size: 16px;
    color: #333; /* 默认深灰色 */
    margin-bottom: 15px;
    padding-left: 20px;
    position: relative;
    cursor: pointer;
    transition: color 0.3s ease;
}

/* 列表圆点（默认深灰色） */
.productdetail-left-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #333; /* 默认深灰色圆点 */
}

/* 当前产品：圆点+标题 蓝色 */
.productdetail-left-item.active,
.productdetail-left-item:hover {
    color: #014ea0; /* 蓝色文字 */
}

.productdetail-left-item.active::before,
.productdetail-left-item:hover::before {
    background-color: #014ea0; /* 蓝色圆点 */
}

/* 右侧：第一行左右浮动布局（各50%） */
.product-info-top {
    width: 100%;
    overflow: hidden; /* 清除子元素浮动 */
    margin-bottom: 30px; /* 与下方详情内容间距30px */
}

.product-info-img {
    width: 50%;
    float: left;
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 3px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 300px;
}

.detail-product-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.product-info-text {
    width: 50%;
    float: right;
    padding: 20px 30px;
    position: relative;
    height: 300px;
    display: flex;
    flex-direction: column;
}

/* 右侧产品标题：30px 蓝色 */
.detail-product-title {
    font-size: 30px;
    color: #014ea0;
    font-weight: 700;
    margin-bottom: 20px;
}

/* 右侧描述文字 */
.detail-product-desc {
    font-size: 14px;
    color: #666;
    margin-bottom: auto; /* 推动按钮到底部 */
}

/* 联系我们：绿色 14px */
.detail-contact-link {
    color: #00a854; /* 绿色 */
    font-size: 14px;
    text-decoration: none;
    font-weight: 500;
}

.detail-contact-link:hover {
    color: #008844;
}

/* 资料下载按钮：长方形+两侧半圆形+右侧小图标 */
.detail-download-btn {
    font-size: 16px;
    color: #fff;
    background-color: #014ea0; /* 蓝色背景 */
    border: none;
    padding: 12px 30px;
    border-radius: 999px; /* 两侧半圆形 */
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px; /* 文字与图标间距 */
    width: fit-content;
    margin-top: 30px; /* 距离文字底部30px */
    transition: background-color 0.3s ease;
}

.detail-download-btn:hover {
    background-color: #0066cc;
}

/* 按钮图标：位于按钮右侧半圈区域 */
.btn-icon {
    width: 32px;
    height: 32px;
   /* 确保图标为白色 */
}

/* 产品详情内容（距离顶部30px） */
.productdetail-content {
    width: 100%;
    margin-top: 30px; /* 距离顶部30px */
    margin-bottom: 30px;
}

/* 蓝色横线（同产品中心样式） */
.productdetail-line {
    width: 100%;
    height: 6px;
    background-color: #014ea0;
    border-radius: 3px;
    margin-bottom: 40px;
    clear: both;
}

/* safechoose 安全产品选择 */
.safechoose {
    width: 100%;
    text-align: center; /* 按钮居中，标题靠左 */
}

/* 安全产品选择标题：靠左对齐 */
.safechoose-title {
    font-size: 18px;
    color: #333;
    font-weight: 600;
    text-align: left;
    margin-bottom: 25px;
}

/* safechoose 按钮：同Contact-btn样式 */
.safechoose-btn {
    font-size: 18px;
    color: #fff;
    background-color: #014ea0;
    border: none;
    padding: 12px 40px;
    border-radius: 999px; /* 左右半圆 */
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.safechoose-btn:hover {
    background-color: #0066cc;
}

/* ========== 移动端自适应布局（@media (max-width: 768px)） ========== */
@media (max-width: 768px) {
    /* 产品详情：左右浮动改为垂直排列 */
    .productdetail-left,
    .productdetail-right {
        width: 100%;
        float: none;
    }

    .productdetail-left {
        margin-bottom: 30px;
    }

    /* 右侧第一行：双列改为垂直排列 */
    .product-info-img,
    .product-info-text {
        width: 100%;
        float: none;
        height: auto;
    }

    .product-info-img {
        margin-bottom: 20px;
        height: 250px;
    }

    /* 字体适配缩小 */
    .productdetail-left-title {
        font-size: 18px;
    }

    .detail-product-title {
        font-size: 24px;
    }

    .safechoose-title {
        font-size: 16px;
    }

    .detail-download-btn,
    .safechoose-btn {
        padding: 10px 30px;
        font-size: 16px;
    }
}

/* 小屏移动端（@media (max-width: 480px)） */
@media (max-width: 480px) {
    .product-info-img {
        height: 200px;
    }

    .detail-product-title {
        font-size: 20px;
    }

    .detail-download-btn,
    .safechoose-btn {
        padding: 10px 20px;
        font-size: 14px;
    }
}

/* ========== 全局通用补充（服务支持页面） ========== */
.service-support {
    width: 100%;
    margin-top: 60px;
    margin-bottom: 80px;
}

.service-support-bg {
    width: 100%;
}

.service-support-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
}

/* 服务模块通用标题：40px 加粗 黑色 */
.service-title {
    font-size: 40px;
    font-weight: 700;
    color: #333;
    text-align: left;
    margin-bottom: 40px;
    line-height: 1.2;
}

/* 服务模块副标题 */
.service-subtitle {
    font-size: 18px;
    font-weight: 500;
    color: #666;
    margin-left: 15px;
}

/* 服务模块底部6px蓝色横线 */
.service-bottom-line {
    width: 100%;
    height: 6px;
    background-color: #014ea0;
    border-radius: 3px;
    margin: 60px 0;
}

/* ========== 4.1 售前服务样式 ========== */
.pre-sales-grid {
    width: 100%;
    overflow: hidden; /* 清除浮动 */
    display: flex;
    gap: 20px;
}

.pre-sales-item {
    width: calc(33.333% - 13.333px);
    float: left;
    background-color: #014ea0;
    border-radius: 10px;
    padding: 40px 30px;
    color: #fff;
    position: relative;
}

.pre-sales-item-title {
    font-size: 30px;
    color: #fff;
    margin-bottom: 20px;
    font-weight: 600;
    height: 100px;
    display: flex;
      align-items: center; 
}

.pre-sales-item-desc {
    font-size: 16px;
    color: #fff;
    line-height: 1.2;
       height: 100px;
    margin-bottom: 40px;
}

.pre-sales-item-img {
    width: 100%;
    height: auto;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    display: block;
}

/* ========== 4.2 售中服务样式 ========== */
.service-in-sales {
    margin-top: 60px;
}

.in-sales-content {
    width: 100%;
    overflow: hidden; /* 清除浮动 */
    display: flex;
    align-items: center;
    gap: 40px;
}

.in-sales-img {
    width: 50%;
    float: left;
}

.in-sales-img-item {
    width: 100%;
    height: auto;
    border-radius: 30px;
    display: block;
}

.in-sales-text {
    width: 50%;
    float: right;
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.in-sales-item {
    display: flex;
    align-items: center;
    gap: 15px;
    width: 100%;
}

/* 售中项目标题：蓝色半圆长方形 */
.in-sales-item-title {
    font-size: 20px;
    color: #fff;
    background-color: #014ea0;
    padding: 8px 25px;
    border-radius: 999px;
    white-space: nowrap;
}

.in-sales-item-desc {
    font-size: 14px;
    color: #fff;
    /*background-color: rgba(1, 78, 160, 0.1);*/
    padding: 10px 20px;
    color: #014ea0;
    border-radius: 5px;
    flex: 1;
}

/* ========== 4.3 售后服务样式 ========== */
.service-after-sales {
    margin-top: 60px;
}

.after-sales-grid {
    width: 100%;
    overflow: hidden; /* 清除浮动 */
    display: flex;
    gap: 15px;
}

.after-sales-item {
    width: 20%; /* 5列布局 */
    float: left;
    text-align: center;
    padding: 20px 10px;
}

.after-sales-item-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 20px;
    display: block;
}

.after-sales-item-title {
    font-size: 20px;
    color: #333;
    margin-bottom: 15px;
    font-weight: 600;
}

.after-sales-item-desc {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
}

/* ========== 4.4 资料下载样式 ========== */
.service-download {
    margin-top: 60px;
}

.download-container {
    width: 100%;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    padding: 30px;
}

/* 下载列表头部 */
.download-header {
    width: 100%;
    display: flex;
    margin-bottom: 25px;
    border-bottom: 2px solid #f5f5f5;
    padding-bottom: 15px;
}

.download-col {
    display: flex;
    align-items: center;
    justify-content: center;
}

.download-col-name {
    width: 70%;
    justify-content: flex-start;
    padding-left: 20px;
}

.download-col-time {
    width: 20%;
}

.download-col-op {
    width: 10%;
}

.download-header-text {
    font-size: 30px;
    font-weight: 700;
    color: #333;
}

/* 下载列表内容 */
.download-list {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-bottom: 30px;
}

.download-item {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 15px 0;
    border-bottom: 1px solid #f5f5f5;
}

.file-icon, .op-icon {
    max-width: 100%;
    height: auto;
    margin-right: 10px;
    display: inline-block;
}

.file-name {
    font-size: 16px;
    color: #333;
}

.file-time {
    font-size: 16px;
    color: #666;
}

.op-text {
    font-size: 16px;
    color: #014ea0;
    cursor: pointer;
}

.op-text:hover {
    text-decoration: underline;
}

/* 分页条 */
.download-pagination {
    width: 100%;
    text-align: center;
}

.page-btn {
    display: inline-block;
    padding: 8px 15px;
    margin: 0 5px;
    background-color: #f5f5f5;
    color: #333;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.page-btn.current {
    background-color: #014ea0;
    color: #fff;
    font-weight: 600;
}

.page-btn:hover:not(.current) {
    background-color: #e0e0e0;
    color: #014ea0;
}

/* ========== 移动端自适应布局（@media (max-width: 768px)） ========== */
@media (max-width: 768px) {
    /* 通用服务标题适配 */
    .service-title {
        font-size: 30px;
    }

    .service-subtitle {
        font-size: 16px;
    }

    /* 售前服务：3列改为1列 */
    .pre-sales-grid {
        flex-direction: column;
        gap: 25px;
    }

    .pre-sales-item {
        width: 100%;
        float: none;
    }

    /* 售中服务：左右浮动改为垂直排列 */
    .in-sales-content {
        flex-direction: column;
        gap: 25px;
    }

    .in-sales-img, .in-sales-text {
        width: 100%;
        float: none;
    }

    /* 售后服务：5列改为2列 */
    .after-sales-grid {
        flex-wrap: wrap;
        gap: 20px;
    }

    .after-sales-item {
        width: calc(50% - 10px);
        float: none;
    }

    /* 资料下载：3列表头字体缩小，布局适配 */
    .download-header-text {
        font-size: 20px;
    }

    .download-col-name {
        padding-left: 10px;
    }

    .file-name, .file-time, .op-text {
        font-size: 14px;
    }

    .file-icon, .op-icon {
        width: 20px;
        height: 20px;
    }
}

/* 小屏移动端（@media (max-width: 480px)） */
@media (max-width: 480px) {
    .service-title {
        font-size: 24px;
    }

    /* 售后服务：2列改为1列 */
    .after-sales-item {
        width: 100%;
    }

    /* 资料下载：表头隐藏多余内容，分页条简化 */
    .download-header-text {
        font-size: 16px;
    }

    .page-btn {
        padding: 6px 10px;
        margin: 0 3px;
        font-size: 14px;
    }

    .download-container {
        padding: 20px 15px;
    }
}



/* ========== 4. project-case 工程案例模块（核心样式） ========== */
.project-case {
    width: 100%;
    margin-top: 60px;
    margin-bottom: 80px;
}

.project-case-bg {
    width: 100%;
}

.project-case-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
}

/* 案例列表网格：2列1行，每页3行2列 */
.project-case-grid {
    width: 100%;
    overflow: hidden; /* 清除子元素浮动带来的高度塌陷 */
    display: flex;
    flex-wrap: wrap;
    gap: 25px; /* 案例项之间间距 */
    margin-bottom: 40px;
}

/* 案例项：2列布局，每列宽度自适应，灰色背景+1px实线边框 */
.project-case-item {
    width: calc(50% - 12.5px); /* 2列均分，扣除间距 */
    float: left;
    background-color: #f5f5f5; /* 灰色背景 */
    border: 1px solid #e0e0e0; /* 1px实线边框 */
    border-radius: 5px; /* 整体轻微圆角，与图片圆角呼应 */
    padding: 20px;
    display: flex;
    align-items: center; /* 内部左右元素垂直居中 */
    gap: 20px; /* 内部图片与文字间距 */
}

/* 案例内部图片：左浮动，5px圆角 */
.case-item-img {
    width: 40%;
    float: left;
}

.case-img {
    width: 100%;
    height: auto;
    border-radius: 5px; /* 图片5px圆角 */
    display: block; /* 去除图片底部默认间隙 */
}

/* 案例内部文字：右浮动，垂直居中 */
.case-item-text {
    width: 60%;
    float: right;
    display: flex;
    flex-direction: column;
    justify-content: center; /* 垂直居中对齐 */
    height: 100%;
}

/* 案例标题 */
.case-item-title {
    font-size: 18px;
    color: #333;
    font-weight: 600;
    margin-bottom: 30px; /* 标题距下方查看详情30px */
    line-height: 1.4;
}

/* 查看详情：图标+文字 */
.case-item-detail {
    display: flex;
    align-items: center;
    text-decoration: none;
    width: fit-content;
}

.detail-icon {
    width: auto;
    height: auto;
    margin-right: 8px;
    filter: brightness(0.8); /* 调整图标颜色，与文字协调 */
}

.project-case-item .detail-text {
        font-size: 14px;
    color: #333;
    line-height: 180%!important;
    margin-bottom: 0;
}

.detail-text {
    font-size: 14px;
    color: #014ea0; /* 主题蓝色，保持风格统一 */
    transition: color 0.3s ease;
}

.case-item-detail:hover .detail-text {
    color: #0066cc;
    text-decoration: underline;
}

/* 案例列表底部分页条 */
.project-case-pagination {
    width: 100%;
    text-align: center; /* 分页条居中 */
}

/* 分页按钮样式（与资料下载分页条统一，保持风格一致） */
.page-btn {
    display: inline-block;
    padding: 8px 15px;
    margin: 0 5px;
    background-color: #f5f5f5;
    color: #333;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.page-btn.current {
    background-color: #014ea0;
    color: #fff;
    font-weight: 600;
}

.page-btn:hover:not(.current) {
    background-color: #e0e0e0;
    color: #014ea0;
}

/* ========== 移动端自适应布局（@media (max-width: 768px)） ========== */
@media (max-width: 768px) {
    /* 案例列表：2列改为1列 */
    .project-case-grid {
        flex-direction: column;
        gap: 20px;
    }

    .project-case-item {
        width: 100%;
        float: none;
        flex-direction: column; /* 内部图文改为垂直排列 */
        align-items: flex-start;
    }

    .case-item-img, .case-item-text {
        width: 100%;
        float: none;
    }

    /* 字体与间距适配 */
    .case-item-title {
        font-size: 16px;
        margin-bottom: 20px;
    }

    .detail-text {
        font-size: 13px;
    }

    .page-btn {
        padding: 6px 12px;
        margin: 0 3px;
        font-size: 14px;
    }
}

/* 小屏移动端（@media (max-width: 480px)） */
@media (max-width: 480px) {
    .project-case-item {
        padding: 15px;
        gap: 15px;
    }

    .case-item-title {
        font-size: 14px;
    }

    .page-btn {
        padding: 5px 10px;
        font-size: 12px;
    }
}

/* ========== 4. news-center 新闻中心模块（核心样式） ========== */
/* ========== 4. news-center 新闻中心模块（优化后样式） ========== */
.news-center {
    width: 100%;
    margin-top: 0;
    margin-bottom: 80px;
}

.news-center-bg {
    width: 100%;
}

.news-center-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
}

/* 新闻列表：2行3列布局，添加边框容器 */
.news-grid {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    /* 隐藏外层溢出，避免竖线超出 */
    overflow: hidden;
    margin-bottom: 40px;
}

/* 新闻项：3列均分，添加右侧竖线+底边横线 */
.news-item {
    width: calc(33.333% - 1px); /* 扣除竖线宽度，避免布局溢出 */
    display: flex;
    flex-direction: column;
    padding: 30px 20px 20px; /* 内边距，与边框区分开 */
    /* 右侧竖线 + 底边横线 */
    border-right: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
}

/* 第3n条新闻：去除右侧竖线 */
.news-item:nth-child(3n) {
    border-right: none;
}

/* 新闻标题 */
.news-title {
    font-size: 14px;
    color: #333;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 5px; /* 标题与日期间距缩小 */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 新闻日期：标题下一行单独显示 */
.listnews-date {
    font-size: 14px;
    color: #666;
    margin-bottom: 20px;
    display: block; /* 强制换行，单独占一行 */
}

/* 新闻图片容器 */
.news-img {
    width: 100%;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid #f0f0f0;
     height: 230px!important;
    margin: 0;
     display: flex;         /* 开启Flex布局 */
            justify-content: center;/* 水平居中 */
            align-items: center;   /* 垂直居中（核心） */
            overflow: hidden;      /* 防止极端情况图片溢出，可选 */
}

.news-img img {
    max-width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    margin: 0 auto;
    text-align: center;
    transition: transform 0.3s ease;
}

.news-img:hover img {
    transform: scale(1.03);
}

/* 新闻列表底部分页条 */
.news-pagination {
    width: 100%;
    text-align: center;
}

.page-btn {
    display: inline-block;
    padding: 8px 15px;
    margin: 0 5px;
    background-color: #f5f5f5;
    color: #333;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.page-btn.current {
    background-color: #014ea0;
    color: #fff;
    font-weight: 600;
}

.page-btn:hover:not(.current) {
    background-color: #e0e0e0;
    color: #014ea0;
}

/* ========== 移动端自适应布局 ========== */
@media (max-width: 768px) {
    .news-grid {
        gap: 0;
    }
    .news-item {
        width: calc(50% - 1px); /* 2列布局，扣除竖线宽度 */
        padding: 0 15px 15px;
    }
    /* 移动端2列：第2n条去除右侧竖线 */
    .news-item:nth-child(3n) {
        border-right: 1px solid #e0e0e0;
    }
    .news-item:nth-child(2n) {
        border-right: none;
    }

    .news-title {
        font-size: 15px;
    }
    .listnews-date {
        font-size: 13px;
    }

    .page-btn {
        padding: 6px 12px;
        margin: 0 3px;
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .news-item {
        width: 100%;
        border-right: none; /* 1列布局，无右侧竖线 */
    }
    .news-title {
        font-size: 14px;
    }
    .page-btn {
        padding: 5px 10px;
        font-size: 12px;
    }
}



/* ========== 4. news-detail 新闻详情模块 ========== */
/* ========== 4. news-detail 新闻详情模块（优化后） ========== */
.news-detail {
    width: 100%;
    margin-bottom: 80px;
}

/* 新增：通栏灰色背景的头部区域 */
.news-detail-header {
    width: 100%;
    background-color: #f5f5f5; /* 灰色背景 */
    padding: 20px 0;
    margin-bottom: 30px;
}
.news-detail-header-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
}

/* 当前位置 */
.detail-breadcrumb {
    font-size: 14px;
    color: #666;
    margin-bottom: 10px;
}

/* 时间+类型 */
.detail-meta {
    font-size: 14px;
    color: #014ea0; /* 蓝色文字 */
    margin-bottom: 15px;
}
.detail-date {
    margin-right: 5px;
}

/* 新闻标题 */
.detail-title {
    font-size: 24px;
    color: #333;
    font-weight: 700;
    line-height: 1.4;
}

/* 主体区域（背景白色） */
.news-detail-bg {
    width: 100%;
    background-color: #fff; /* 白色背景 */
}
.news-detail-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
    padding: 30px 0;
}

/* 主体：左侧正文 + 右侧推荐新闻 */
.news-detail-main {
    display: flex;
    gap: 40px;
}

/* 左侧正文区域 */
.news-detail-content {
    width: 70%;
}




/* 正文内容 */
.detail-text {
    font-size: 18px!important;
    font-weight: normal;
    color: #333;
    line-height: 180%!important;
    margin-bottom: 40px;
 
}

.detail-text span{
    font-size: 1rem!important;
    font-weight: normal!important;
    color: #333;
    line-height: 150%!important;
 
}
.detail-text p {
       margin-bottom: 20px;
      text-indent:2em;
    font-size:1rem!important;
    font-weight:normal;
    line-height:150%!important;
}

.detail-text img{max-width:100%!important; height:auto}
.detail-text p:last-child {
    margin-bottom: 0;
}

/* LOGO展示区域 */
.detail-logo-group {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 40px;
}
.logo-item {
    width: calc(33.333% - 13.333px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background-color: #f5f5f5;
    border-radius: 5px;
}
.logo-item img {
    max-width: 100%;
    max-height: 100px;
}

/* 上下篇导航 */
.detail-nav {
    border-top: 1px solid #e0e0e0;
    padding-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.nav-prev, .nav-next {
    font-size: 14px;
}
.nav-prev span, .nav-next span {
    color: #666;
    margin-right: 10px;
}
.nav-prev a, .nav-next a {
    color: #014ea0;
    text-decoration: none;
}
.nav-prev a:hover, .nav-next a:hover {
    text-decoration: underline;
}

/* 右侧推荐新闻区域（标题前加圆点） */
.news-detail-sidebar {
    width: 30%;
    background-color: #f9f9f9;
    padding: 20px;
    border-radius: 5px;
}
.sidebar-title {
    font-size: 18px;
    color: #333;
    font-weight: 600;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #014ea0;
}
.sidebar-list {
    list-style: none;
}
.sidebar-list li {
    margin-bottom: 15px;
    padding-left: 20px;
    position: relative;
}
/* 推荐新闻标题前的圆点 */
.sidebar-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #014ea0; /* 蓝色圆点 */
}
.sidebar-list li a {
    font-size: 14px;
    color: #333;
    text-decoration: none;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.sidebar-list li a:hover {
    color: #014ea0;
}

/* ========== 移动端自适应布局 ========== */
@media (max-width: 768px) {
    .news-detail-header {
        padding: 15px 0;
    }
    .detail-title {
        font-size: 20px;
    }
    
    .news-detail-main {
        flex-direction: column;
        gap: 30px;
    }
    .news-detail-content, .news-detail-sidebar {
        width: 100%;
    }

    .logo-item {
        width: calc(50% - 10px);
    }

    .detail-text {
        font-size: 15px;
    }
    
       .detail-text img{
        max-width: 100%;
        height: auto;
    }
}

@media (max-width: 480px) {
    .detail-title {
        font-size: 18px;
    }
    .logo-item {
        width: 100%;
    }

    .sidebar-title {
        font-size: 16px;
    }
}



/* ========== 4. contact-us 联系我们模块 ========== */
.contact-us {
    width: 100%;
    margin-top: 40px;
    margin-bottom: 80px;
}

.contact-us-bg {
    width: 100%;
}

.contact-us-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
}

/* 地图+联系信息区域 */
.contact-map-section {
    position: relative;
    height: 400px;
    margin-bottom: 30px;
}

/* 地图容器 */
.contact-map {
    width: 100%;
    height: 100%;
    border-radius: 5px;
    overflow: hidden;
}

/* 悬浮联系信息卡片 */
.contact-info-card {
    position: absolute;
    top: 10vh;
    right: 15vw;
    background-color: #fff;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    width: 300px;
}
.card-title {
    font-size: 16px;
    color: #333;
    font-weight: 600;
    margin-bottom: 15px;
}
.card-phone {
    font-size: 18px;
    color: #014ea0;
    font-weight: 700;
    margin-bottom: 10px;
}
.card-post {
    font-size: 14px;
    color: #666;
    font-weight: 400;
    margin-left: 5px;
}
.card-email, .card-address {
    font-size: 14px;
    color: #666;
    margin-bottom: 8px;
}
.card-address {
    margin-bottom: 0;
}

/* 分割线 */
.contact-divider {
    width: 100%;
    height: 1px;
    background-color: #e0e0e0;
    margin: 30px 0;
}

/* 在线留言区域 */
.contact-form-section {
    margin-bottom: 30px;
}
.form-title {
    font-size: 20px;
    color: #333;
    font-weight: 600;
    margin-bottom: 20px;
}
.contact-form {
    width: 100%;
}
.form-row {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}
.form-input {
    flex: 1;
    padding: 12px 15px;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    font-size: 14px;
    color: #333;
}
.form-input::placeholder {
    color: #999;
}
.form-textarea {
    width: 100%;
    height: 150px;
    padding: 12px 15px;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    font-size: 14px;
    color: #333;
    resize: none;
    margin-bottom: 15px;
}
.form-textarea::placeholder {
    color: #999;
}
.form-note {
    font-size: 14px;
    color: #666;
    margin-bottom: 20px;
}
.form-submit {
    background-color: #014ea0;
    color: #fff;
    border: none;
    padding: 12px 30px;
    border-radius:23px;
    font-size: 16px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}
.form-submit:hover {
    background-color: #0066cc;
}

/* 加入我们区域 */
.contact-join-section {
    margin-bottom: 30px;
}
.join-title {
    font-size: 20px;
    color: #333;
    font-weight: 600;
    margin-bottom: 20px;
}
.join-content {
    display: flex;
    gap: 30px;
}
.join-img {
    width: 40%;
}
.join-img img {
    width: 100%;
    height: auto;
    border-radius: 5px;
    display: block;
}
.join-info {
    width: 60%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.info-item {
    font-size: 14px;
    color: #333;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
}
.info-label {
    font-size: 16px;
    color: #333;
    font-weight: 600;
}
.info-icon {
    width: 16px;
    height: 16px;
    margin-right: 10px;
    background-size: contain;
    background-repeat: no-repeat;
}
.contact-user {
    background-image: url("../images/contacter.png");
}
.phone-icon {
    background-image: url("../images/phone.png");
}
.email-icon {
    background-image: url("../images/email.png");
}
.address-icon {
    background-image: url("../images/address.png");
}
.join-btn {
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    color: #014ea0;
    text-decoration: none;
    margin-top: 10px;
}
.btn-icon {
    width: 41px;
    height: 32px;
    margin-right: 8px;
    background-image: url("../images/icon-arrow.png");
    background-size: contain;
    background-repeat: no-repeat;
}
.btn-text:hover {
    text-decoration: underline;
}

/* ========== 移动端自适应布局 ========== */
@media (max-width: 768px) {
    .contact-map-section {
        height: 300px;
    }
    .contact-info-card {
        width: 250px;
        padding: 15px;
        top: 15px;
        right: 15px;
    }
    .card-title {
        font-size: 15px;
    }
    .card-phone {
        font-size: 16px;
    }

    .form-row {
        flex-direction: column;
        gap: 15px;
    }

    .join-content {
        flex-direction: column;
        gap: 20px;
    }
    .join-img, .join-info {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .contact-map-section {
        height: 250px;
    }
    .contact-info-card {
        width: 200px;
        padding: 10px;
    }
    .card-title {
        font-size: 14px;
        margin-bottom: 10px;
    }
    .card-phone {
        font-size: 14px;
    }
    .card-email, .card-address {
        font-size: 12px;
    }

    .form-title, .join-title {
        font-size: 18px;
    }
    .form-submit {
        width: 100%;
    }
}


/* ========== 4. about-us 关于我们模块 ========== */
.about-us {
    width: 100%;
    margin-top: 60px;
    margin-bottom: 80px;
}

.about-us-bg {
    width: 100%;
}

.about-us-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
}

/* 公司简介+视频封面区域 */
.about-intro-section {
    display: flex;
    gap: 40px;
    align-items: center;
}

/* 左侧文字内容 */
.intro-text {
    width: 55%;
}

.intro-title {
    font-size: 28px;
    color: #333;
    font-weight: 700;
    margin-bottom: 15px;
}

.company-name {
    font-size: 20px;
    color: #014ea0; /* 蓝色公司名，与参考图一致 */
    font-weight: 600;
    margin-bottom: 20px;
}

.intro-desc, .intro-detail, .intro-mission {
    font-size: 16px;
    color: #333;
    line-height: 1.8;
    margin-bottom: 20px;
}

.intro-mission {
    margin-bottom: 0;
}

/* 右侧视频封面 */
.intro-video {
    width: 45%;
    position: relative;
    border-radius: 5px;
    overflow: hidden;
}

.video-cover {
    width: 100%;
    height: auto;
    display: block;
}

/* 播放按钮 */
.play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.play-btn:hover {
    background-color: #fff;
    transform: translate(-50%, -50%) scale(1.05);
}

.play-icon {
    display: inline-block;
    width: 0;
    height: 0;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 30px solid #014ea0; /* 蓝色播放三角 */
    margin-left: 5px; /* 三角居中微调 */
}

/* ========== 移动端自适应布局 ========== */
@media (max-width: 768px) {
    .about-intro-section {
        flex-direction: column;
        gap: 30px;
    }

    .intro-text, .intro-video {
        width: 100%;
    }

    .intro-title {
        font-size: 24px;
    }

    .company-name {
        font-size: 18px;
    }

    .intro-desc, .intro-detail, .intro-mission {
        font-size: 15px;
    }

    .play-btn {
        width: 60px;
        height: 60px;
    }

    .play-icon {
        border-top: 15px solid transparent;
        border-bottom: 15px solid transparent;
        border-left: 25px solid #014ea0;
    }
}

@media (max-width: 480px) {
    .intro-title {
        font-size: 20px;
    }

    .company-name {
        font-size: 16px;
    }

    .intro-desc, .intro-detail, .intro-mission {
        font-size: 14px;
    }

    .play-btn {
        width: 50px;
        height: 50px;
    }

    .play-icon {
        border-top: 12px solid transparent;
        border-bottom: 12px solid transparent;
        border-left: 20px solid #014ea0;
    }
}

/* ========== 新增：核心介绍区域（文字+视频下方） ========== */
.about-core-intro {
    width: 100%;
    margin-top: 40px; /* 与上方视频/文字区域拉开间距 */
    padding-top: 20px;
    border-top: 1px solid #e0e0e0; /* 可选：添加分割线，区分上下区域 */
}

.core-intro-text, .core-mission-text {
    font-size: 16px;
    color: #333;
    line-height: 1.8;
    margin-bottom: 15px;
}

.core-mission-text {
    margin-bottom: 0;
}

/* 移动端适配 */
@media (max-width: 768px) {
    .core-intro-text, .core-mission-text {
        font-size: 15px;
    }
}

@media (max-width: 480px) {
    .core-intro-text, .core-mission-text {
        font-size: 14px;
    }
}


/* ========== 核心优势数字滚动模块 ========== */
.about-advantage {
    width: 100%;
    margin-top: 50px;
}

/* 核心优势标题 */
.advantage-title {
    font-size: 24px;
    color: #333;
    font-weight: 600;
    margin-bottom: 30px;
}

/* 优势列表容器 */
.advantage-list {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 15px;
}

/* 单个优势项（左右浮动布局） */
.advantage-item {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1; /* 四列均分 */
}

/* 数字区域 */
.num-wrap {
    display: flex;
    align-items: baseline;
}
.num {
    font-size: 60px;
    color: #014ea0; /* 蓝色数字 */
    font-weight: 700;
}
.num-plus, .num-percent {
    font-size: 60px;
    color: #014ea0;
    font-weight: 700;
    margin-left: 5px;
}

/* 描述区域（上下结构） */
.desc-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}
.desc-img {
    width: 40px; /* 图标尺寸可调整 */
    height: 40px;
    object-fit: contain;
}
.desc-text {
    font-size: 20px;
    color: #333;
    text-align: center;
}

/* 底部蓝色横线 */
.advantage-line {
    width: 100%;
    height: 2px;
    background-color: #014ea0; /* 蓝色横线 */
}

/* ========== 移动端适配 ========== */
@media (max-width: 768px) {
    /* 核心优势标题单行 */
    .advantage-title {
        font-size: 20px;
        text-align: center;
    }
    /* 1/2列一行，3/4列一行 */
    .advantage-list {
        /*flex-wrap: wrap;*/
        display: block;
    }
    .advantage-item {
        width: 50%; /* 两列均分 */
        margin-bottom: 20px;
        float: left;
        justify-content: center; /* 居中显示 */
    }
    /* 数字字号缩小 */
    .num, .num-plus, .num-percent {
        font-size: 40px;
    }
    .desc-text {
        font-size: 18px;
    }
    .desc-img {
        width: 35px;
        height: 35px;
    }
}

@media (max-width: 480px) {
    .num, .num-plus, .num-percent {
        font-size: 30px;
    }
    .desc-text {
        font-size: 16px;
    }
    .desc-img {
        width: 30px;
        height: 30px;
    }
}




/* 核心竞争力模块容器 */
/* 核心竞争力模块容器 */
/* 全局盒模型重置：解决不同浏览器尺寸计算差异 */
/** {*/
/*  margin: 0;*/
/*  padding: 0;*/
/*  box-sizing: border-box;*/
/*  -webkit-box-sizing: border-box;*/
/*  -moz-box-sizing: border-box;*/
/*}*/

@media screen and (max-width: 2239px) {

.competitive-container {
    width: 100vw;
    margin: 0 auto;
    /* 修复：背景图居中+自适应，避免弧线错位 */
    background: url('/skin/images/main5.png') no-repeat center center;
    background-size: contain;
    -webkit-background-size: contain;
    /*max-width: 1440px;*/
    position: relative;
    /* 修复：用clamp适配高度，避免缩放时高度异常 */
    min-height: clamp(600px, 80vh, 770px); 
}    
    
.item-solution {
    top: calc(7vh - 10px)!important;
    left: calc(32vw - 550px)!important; /* 替换6vw，避免缩放错位 */
    text-align: right;
}

.item-rd {
    top: calc(6vh - 10px);
    right: calc(31vw - 550px)!important; /* 替换10vw，避免缩放错位 */
    text-align: left;
}

.item-manufacture {
    bottom: calc(19vh - 10px)!important;
    left: calc(34vw - 580px)!important; /* 替换13%，基于中心定位 */
    text-align: right;
}

.item-market {
    bottom: calc(24vh - 10px)!important;
    right: calc(33vw - 580px)!important;
    text-align: left;
}

}

@media screen and (max-width: 1919px) {

.competitive-container {
    width: 100vw;
    margin: 0 auto;
    /* 修复：背景图居中+自适应，避免弧线错位 */
    background: url('/skin/images/main5.png') no-repeat center center;
    background-size: contain;
    -webkit-background-size: contain;
    /*max-width: 1440px;*/
    position: relative;
    /* 修复：用clamp适配高度，避免缩放时高度异常 */
    min-height: clamp(600px, 80vh, 770px); 
}    
    
.item-solution {
    top: calc(7vh - 10px);
    left: calc(38vw - 550px)!important; /* 替换6vw，避免缩放错位 */
    text-align: right;
}

.item-rd {
    top: calc(6vh - 10px);
    right: calc(38vw - 550px)!important; /* 替换10vw，避免缩放错位 */
    text-align: left;
}

.item-manufacture {
    bottom: calc(28vh - 10px);
    left: calc(41vw - 580px)!important; /* 替换13%，基于中心定位 */
    text-align: right;
}

.item-market {
    bottom: calc(24vh - 10px)!important;
    right: calc(42vw - 580px)!important;
    text-align: left;
}

}

@media screen and (max-width: 1919px) and (min-width: 1440px) {
 .competitive-container {
    width: 100vw;
    margin: 0 auto;
    /* 修复：背景图居中+自适应，避免弧线错位 */
    background: url('/skin/images/main5.png') no-repeat center center;
    background-size: contain;
    -webkit-background-size: contain;
    /*max-width: 1440px;*/
    position: relative;
    /* 修复：用clamp适配高度，避免缩放时高度异常 */
    min-height: clamp(600px, 80vh, 770px); 
}    
    
.item-solution {
    top: calc(7vh - 10px);
    left: calc(38vw - 550px)!important; /* 替换6vw，避免缩放错位 */
    text-align: right;
}

.item-rd {
    top: calc(6vh - 10px);
    right: calc(38vw - 550px)!important; /* 替换10vw，避免缩放错位 */
    text-align: left;
}

.item-manufacture {
    bottom: calc(28vh - 10px);
    left: calc(41vw - 580px)!important; /* 替换13%，基于中心定位 */
    text-align: right;
}

.item-market {
    bottom: calc(24vh - 10px)!important;
    right: calc(42vw - 580px)!important;
    text-align: left;
}
}
@media screen and (max-width: 1679px) {
    .competitive-container {
    width: 100vw;
    margin: 0 auto;
    /* 修复：背景图居中+自适应，避免弧线错位 */
    background: url('/skin/images/main5.png') no-repeat center center;
    background-size: contain;
    -webkit-background-size: contain;
    /*max-width: 1440px;*/
    position: relative;
    /* 修复：用clamp适配高度，避免缩放时高度异常 */
    min-height: clamp(600px, 80vh, 770px); 
}    
    
.item-solution {
    top: calc(7vh - 10px)!important;
    left: calc(38vw - 550px)!important; /* 替换6vw，避免缩放错位 */
    text-align: right;
}

.item-rd {
    top: calc(6vh - 10px)!important;
    right: calc(38vw - 550px)!important; /* 替换10vw，避免缩放错位 */
    text-align: left;
}

.item-manufacture {
    bottom: calc(28vh - 10px)!important;
    left: calc(41vw - 580px)!important; /* 替换13%，基于中心定位 */
    text-align: right;
}

.item-market {
    bottom: calc(24vh - 10px)!important;
    right: calc(42vw - 580px)!important;
    text-align: left;
}
}
@media screen and (max-width: 1599px) {
    .competitive-container {
    width: 100vw;
    margin: 0 auto;
    /* 修复：背景图居中+自适应，避免弧线错位 */
    background: url('/skin/images/main5.png') no-repeat center center;
    background-size: contain;
    -webkit-background-size: contain;
    /*max-width: 1440px;*/
    position: relative;
    /* 修复：用clamp适配高度，避免缩放时高度异常 */
    min-height: clamp(600px, 80vh, 770px); 
}    
    
.item-solution {
    top: calc(7vh - 10px)!important;
    left: calc(47vw - 550px)!important; /* 替换6vw，避免缩放错位 */
    text-align: right;
}

.item-rd {
    top: calc(6vh - 10px)!important;
    right: calc(46vw - 550px)!important; /* 替换10vw，避免缩放错位 */
    text-align: left;
}

.item-manufacture {
    bottom: calc(28vh - 10px)!important;
    left: calc(52vw - 580px)!important; /* 替换13%，基于中心定位 */
    text-align: right;
}

.item-market {
    bottom: calc(26vh - 10px)!important;
    right: calc(53vw - 580px)!important;
    text-align: left;
}
}
@media screen and (max-width: 1439px) {
    .competitive-container {
    width: 100vw;
    margin: 0 auto;
    /* 修复：背景图居中+自适应，避免弧线错位 */
    background: url('/skin/images/main5.png') no-repeat center center;
    background-size: contain;
    -webkit-background-size: contain;
    /*max-width: 1440px;*/
    position: relative;
    /* 修复：用clamp适配高度，避免缩放时高度异常 */
    min-height: clamp(600px, 80vh, 770px); 
}    
    
.item-solution {
    top: calc(7vh - 10px)!important;
    left: calc(53vw - 550px)!important; /* 替换6vw，避免缩放错位 */
    text-align: right;
}

.item-rd {
    top: calc(6vh - 10px)!important;
    right: calc(52vw - 550px)!important; /* 替换10vw，避免缩放错位 */
    text-align: left;
}

.item-manufacture {
    bottom: calc(23vh - 10px)!important;
    left: calc(57vw - 580px)!important; /* 替换13%，基于中心定位 */
    text-align: right;
}

.item-market {
    bottom: calc(23vh - 10px)!important;
    right: calc(57vw - 580px)!important;
    text-align: left;
}
}
@media screen and (max-width: 1279px) {
    .competitive-container {
    width: 100vw;
    margin: 0 auto;
    /* 修复：背景图居中+自适应，避免弧线错位 */
    background: url('/skin/images/main5.png') no-repeat center center!important;
    background-size: contain;
    -webkit-background-size: contain;
    /*max-width: 1440px;*/
    position: relative;
    /* 修复：用clamp适配高度，避免缩放时高度异常 */
    min-height: clamp(600px, 80vh, 770px); 
}    
    .item-service .competitive-item-header {
    flex-direction: column!important;
    gap: 10px;
    justify-content: center;
}
.item-solution {
    top: calc(32vh - 10px)!important;
    left: calc(12vw - 550px)!important; /* 替换6vw，避免缩放错位 */
    text-align: right;
}

.item-rd {
    top: calc(6vh - 10px)!important;
    right: calc(8vw - 550px)!important; /* 替换10vw，避免缩放错位 */
    text-align: left;
}

.item-manufacture {
    bottom: calc(3vh - 10px)!important;
    left: calc(15vw - 580px)!important; /* 替换13%，基于中心定位 */
    text-align: right;
}

.item-market {
    bottom: calc(38vh - 10px)!important;
    right: calc(15vw - 580px)!important;
    text-align: left;
}

.item-service {
    bottom: calc(47vh - 10px)!important;
     right: calc(33vw - 580px)!important;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    text-align: center;
}
.item-service .competitive-item-title {
    font-size: 20px;
    color: #014ea0;
    font-weight: 600;
    margin: 0;
    text-align: center; /* 修复：标题居中，避免右对齐错位 */
}


 
.item-rd .item-desc {
    font-size: .6rem!important;
    color: #666;
    line-height: 1.8;
    padding: 0 2vw 0 0; /* 修复：替换1.5vw，固定内边距 */
    margin: 0;
}
.item-manufacture .item-desc {
    font-size: .6rem!important;
    color: #666;
    line-height: 1.8;
    padding: 0 2vw 0 0; /* 修复：替换1.5vw，固定内边距 */
    margin: 0;
}
.item-market .item-desc {
    font-size: .6rem!important;
    color: #666;
    line-height: 1.8;
    padding: 0 2vw 0 0; /* 修复：替换1.5vw，固定内边距 */
    margin: 0;
}
.item-service .item-desc {
    font-size: .6rem!important;
    color: #666;
    line-height: 1.8;
    padding: 0 2vw 0 0; /* 修复：替换1.5vw，固定内边距 */
    margin: 0;
}
.item-solution .item-desc {
    font-size: .6rem!important;
    color: #666;
    line-height: 1.8;
    padding: 0 2vw 0 0; /* 修复：替换1.5vw，固定内边距 */
    margin: 0;
}



}

@media screen and (device-pixel-ratio: 1.3333),
       screen and (device-pixel-ratio: 1.333),
       screen and (device-pixel-ratio: 1.33) {
  /* 75% 缩放时生效的样式 */
  .competitive-container {
    width: 100vw;
    margin: 0 auto;
    /* 修复：背景图居中+自适应，避免弧线错位 */
    background: url('/skin/images/main5.png') no-repeat center center;
    background-size: contain;
    -webkit-background-size: contain;
    /*max-width: 1440px;*/
    position: relative;
    /* 修复：用clamp适配高度，避免缩放时高度异常 */
    min-height: clamp(600px, 80vh, 770px); 
}    
    
.item-solution {
    top: calc(7vh - 10px);
    left: calc(38vw - 550px)!important; /* 替换6vw，避免缩放错位 */
    text-align: right;
}

.item-rd {
    top: calc(6vh - 10px);
    right: calc(38vw - 550px)!important; /* 替换10vw，避免缩放错位 */
    text-align: left;
}

.item-manufacture {
    bottom: calc(28vh - 10px);
    left: calc(41vw - 580px)!important; /* 替换13%，基于中心定位 */
    text-align: right;
}

.item-market {
    bottom: calc(24vh - 10px)!important;
    right: calc(42vw - 580px)!important;
    text-align: left;
}
 
}
.about-competitive {
    width: 100%;
    margin-top: 60px;
    padding: 40px 0;
    position: relative;
}
.competitive-container {
    width: 100%;
    margin: 0 auto;
    /* 修复：背景图居中+自适应，避免弧线错位 */
    background: url('/skin-en/images/main5.png') no-repeat center center;
    background-size: contain;
    -webkit-background-size: contain;
    max-width: 1440px;
    position: relative;
    /* 修复：用clamp适配高度，避免缩放时高度异常 */
    min-height: clamp(600px, 80vh, 770px); 
}
/* 标题 */
.competitive-title {
    font-size: 32px;
    color: #333;
    font-weight: 700;
    text-align: center;
    margin-bottom: 80px;
    /* 修复：优化字体渲染，兼容不同浏览器 */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
/* 中心区域：5大理由 */
.competitive-center {
    position: absolute;
    top: 50%;
    left: 50%;
    /* 修复：添加浏览器前缀，兼容老版本浏览器 */
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 300px;
    height: 300px;
    z-index: 2;
}
.center-circle {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    position: relative;
    overflow: hidden;
    display: flex;
    -webkit-display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
    /* 外层虚线圆环 */
    box-shadow: 0 0 0 25px rgba(1, 78, 160, 0.1),
                0 0 0 50px rgba(1, 78, 160, 0.05);
}
.center-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-object-fit: cover;
    opacity: 0.7;
}
.center-num {
    font-size: 90px;
    font-weight: 700;
    line-height: 1;
    z-index: 1;
}
.center-text {
    font-size: 36px;
    font-weight: 600;
    margin-left: 10px;
    z-index: 1;
}
.center-desc {
    font-size: 20px;
    margin-top: 15px;
    z-index: 1;
    text-align: center;
}
/* 竞争力项通用样式 */
.competitive-item {
    position: absolute;
    width: 370px;
    z-index: 1;
    /* 修复：防止文字换行导致布局崩裂 */
    word-wrap: break-word;
}
/* 项头：标题+图标（浮动布局） */
.competitive-item .competitive-item-header {
    display: flex;
    -webkit-display: flex;
    justify-content: space-between;
    align-items: center; /* 修复：强制垂直居中，避免图标错位 */
    margin-bottom: 0px;
    gap: 10px; 
    /* 修复：禁止换行，保持标题+图标一行 */
    flex-wrap: nowrap;
}
.competitive-item .competitive-item-title {
    font-size: 30px;
    color: #014ea0; 
    font-weight: 600;
    margin: 0; 
    /* 修复：文字不换行，稳定宽度 */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.competitive-item .competitive-item-icon {
    width: 57px;
    height: 57px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    /*background-color: #014ea0;*/
    display: flex;
    -webkit-display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0; /* 防止图标被压缩 */
    margin: 0; 
}
/* 针对不同项的微调（可选，如需更紧凑） */
/* 一站式解决方案/生产制造（标题左+图标右） */
.item-solution .competitive-item-header,
.item-manufacture .competitive-item-header {
    gap: 5px; /* 极致紧凑，间距5px */
}
/* 研发能力/市场反响（图标左+标题右） */
.item-rd .competitive-item-header,
.item-market .competitive-item-header {
    gap: 5px; /* 极致紧凑，间距5px */
}
/* 售后服务（图标上+标题下） */
.item-service .competitive-item-header {
    flex-direction: column;
    gap: 5px; 
    justify-content: center;
}
/* 移动端适配同步调整 */
@media (max-width: 768px) {
    .competitive-item-header {
        gap: 8px;
    }
    .item-solution .competitive-item-header,
    .item-manufacture .competitive-item-header,
    .item-rd .competitive-item-header,
    .item-market .competitive-item-header {
        gap: 3px;
    }
    .item-service .competitive-item-header {
        gap: 3px;
    }
}

.competitive-item-icon img {
    /* 修复：图标按比例缩放，避免变形 */
    width: 100%;
    height: auto;
    object-fit: contain;
    -webkit-object-fit: contain;
}
/* 项描述 */
.item-desc {
    font-size: 16px;
    color: #666; 
    line-height: 1.8;
}

/* 各项目位置+对齐方式：修复用calc替代vw/百分比，基于中心定位更稳定 */
/* 1. 一站式解决方案（左上方）- 标题左、图标右；简介右对齐 */
.item-solution {
    top: calc(7vh - 10px);
    left: calc(50vw - 550px); /* 替换6vw，避免缩放错位 */
    text-align: right;
}

.item-solution .competitive-item-title {
    font-size: 20px;
    color: #014ea0;
    font-weight: 600;
    margin: 0;
    text-align: right;
}

.item-solution .competitive-item-header {
    display: flex;
    -webkit-display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px; /* 修复：替换1vw，用固定值避免缩放错位 */
    cursor: pointer;
    padding: 5px 0;
}

.item-solution .item-desc {
    font-size: .8rem;
    color: #666;
    line-height: 1.2;
    padding: 0 4vw 0 0; /* 修复：替换1.5vw，固定内边距 */
    margin: 0;
}
/* 2. 研发能力（右上方）- 图标左、标题右；简介左对齐 */
.item-rd {
    top: calc(7vh - 10px);
    right: calc(50vw - 550px); /* 替换10vw，避免缩放错位 */
    text-align: left;
}

.item-rd .competitive-item-title {
    font-size: 20px;
    color: #014ea0;
    font-weight: 600;
    margin: 0;
    text-align: right;
}

.item-rd .competitive-item-header {
    display: flex;
    -webkit-display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px; /* 修复：替换1vw，固定值 */
    cursor: pointer;
    padding: 10px 0;
}

.item-rd .item-desc {
   font-size: .8rem;
    color: #666;
    line-height: 1.2;
    padding: 0 0 0 4vw; /* 修复：替换3.5vw，固定内边距 */
    margin: 0;
}

/* 3. 生产制造（左下方）- 标题左、图标右；简介右对齐 */
.item-manufacture {
    bottom: calc(24vh - 10px);
    left: calc(55vw - 580px); /* 替换13%，基于中心定位 */
    text-align: right;
}

.item-manufacture .competitive-item-title {
    font-size: 20px;
    color: #014ea0;
    font-weight: 600;
    margin: 0;
    text-align: right;
}

.item-manufacture .competitive-item-header {
    display: flex;
    -webkit-display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px; /* 修复：替换1vw，固定值 */
    cursor: pointer;
    padding: 10px 0;
}

.item-manufacture .item-desc {
   font-size: .8rem;
    color: #666;
    line-height: 1.2;
    padding: 0 0 0 3vw; /* 修复：替换3.5vw，固定内边距 */
    margin: 0;
}
/* 4. 市场反响（右下方）- 图标左、标题右；简介左对齐 */
.item-market {
    bottom: calc(22vh - 10px);
    right: calc(55vw - 580px); /* 替换13%，基于中心定位 */
    text-align: left;
}

.item-market .competitive-item-title {
    font-size: 20px;
    color: #014ea0;
    font-weight: 600;
    margin: 0;
    text-align: right;
}

.item-market .competitive-item-header {
    display: flex;
    -webkit-display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px; /* 修复：替换1vw，固定值 */
    cursor: pointer;
    padding: 10px 0;
}

.item-market .item-desc {
   font-size: .8rem;
    color: #666;
    line-height: 1.2;
    padding: 0 0 0; /* 修复：替换3.5vw，固定内边距 */
    margin: 0;
}


/* 5. 售后服务（底部中间）- 图标上、标题下；简介居中 */
.item-service {
    bottom: calc(14vh - 10px);
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    text-align: center;
}
.item-service .competitive-item-header {
    flex-direction: column;
    gap: 10px;
    justify-content: center;
}
.item-service .competitive-item-title {
    font-size: 20px;
    color: #014ea0;
    font-weight: 600;
    margin: 0;
    text-align: center; /* 修复：标题居中，避免右对齐错位 */
}

.item-service .item-desc {
   font-size: .8rem;
    color: #666;
    line-height: 1.2;
    padding: 0; /* 修复：替换3.5vw，固定内边距 */
    margin: 0;
}

/* 移动端自适应（简化为垂直排列）：修复布局逻辑，统一样式 */
@media (max-width: 1200px) {
    .competitive-container {
        min-height: auto;
        display: flex;
        -webkit-display: flex;
        flex-direction: column;
        gap: 40px;
        background: none; /* 修复：小屏幕隐藏背景图，避免弧线错位 */
        padding: 20px;
    }
    .competitive-center {
        position: relative;
        top: 0;
        left: 0;
        -webkit-transform: none;
        transform: none;
        margin: 0 auto 40px;
    }
    .competitive-item {
        position: relative;
        width: 100%;
        max-width: 380px;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
        text-align: left !important;
        margin: 0 auto 30px; /* 修复：居中显示，统一间距 */
    }
    .item-service .competitive-item-header {
        flex-direction: row;
        -webkit-flex-direction: row;
        justify-content: space-between;
    }
    /* 修复：移动端统一标题对齐方式 */
    .competitive-item .competitive-item-title {
        text-align: left !important;
    }
    /* 修复：移动端内边距重置 */
    .item-solution .item-desc,
    .item-rd .item-desc {
        padding: 0 !important;
    }
}

@media (max-width: 768px) {
    .competitive-title {
        font-size: 26px;
        margin-bottom: 50px;
    }
    .center-circle {
        width: 220px;
        height: 220px;
        box-shadow: 0 0 0 15px rgba(1, 78, 160, 0.1),
                    0 0 0 30px rgba(1, 78, 160, 0.05);
    }
    .center-num {
        font-size: 60px;
    }
    .center-text {
        font-size: 28px;
    }
    .center-desc {
        font-size: 16px;
    }
    .competitive-item-title {
        font-size: 24px;
    }
    .competitive-item-icon {
        width: 40px;
        height: 40px;
    }
    .competitive-item-icon img {
        width: 22px;
        height: 22px;
    }
}

/* ========== 工厂环境模块 ========== */
.factory-environment {
    width: 100%;
    margin-top: 1vh;
    padding: 40px 0;
}
.factory-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
}
.factory-title {
    font-size: 32px;
    color: #333;
    font-weight: 700;
    margin-bottom: 40px;
    text-align: center;
}
.factory-wrap {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}
.factory-img-box {
    width: 55%;
    position: relative;
}
.img-slider {
    width: 100%;
    height: 350px;
    overflow: hidden;
    position: relative;
    border-radius: 5px;
    border-radius: 5px;
    /* 新增：开启flex布局，让内部元素水平+垂直居中 */
    display: flex;
    justify-content: center; /* 水平居中 */
    align-items: center;     /* 垂直居中 */
}
.slider-wrapper {
    width: 100%;
    height: 100%;
}
.slider-img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: none;
}
.slider-img.active {
    display: block;
}
.slider-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
	border: none;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.8);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    transition: background-color 0.3s ease;
}
.slider-btn:hover {
    background-color: #fff;
}
.prev-btn {
    left: 20px;
}
.next-btn {
    right: 20px;
}
.arrow-icon {
    display: inline-block;
    width: 15px;
    height: 15px;
    border-top: 3px solid #014ea0;
}
.left-arrow {
    border-left: 3px solid #014ea0;
    transform: rotate(-45deg);
}
.right-arrow {
    border-right: 3px solid #014ea0;
    transform: rotate(45deg);
}
.factory-list-box {
    width: 45%;
}
.factory-list-item {
    margin-bottom: 10px;
}
.item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    padding: 10px 0;
}
.item-title {
    font-size: 20px;
    color: #014ea0;
    font-weight: 600;
    margin: 0;
}
.arrow-up {
    display: inline-block;
    width: 16px;
	height: 16px;
    border-top: 3px solid #014ea0;
    border-right: 3px solid #014ea0;
    transform: rotate(45deg);
    transition: transform 0.3s ease;
}
.item-header.active .arrow-up {
    transform: rotate(135deg);
}
.item-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}
.item-desc {
    font-size: 14px;
    color: #666;
    line-height: 1.8;
    padding: 0 0 15px 0;
    margin: 0;
}
.item-line {
    width: 100%;
    height: 1px;
    background-color: #e0e0e0;
}
.factory-bottom-line {
    width: 100%;
    height: 2px;
    background-color: #014ea0;
    margin-top: 30px;
}
/* ========== 移动端自适应 ========== */
@media (max-width: 768px) {
    .factory-wrap {
        flex-direction: column;
        gap: 30px;
    }
    .factory-img-box, .factory-list-box {
        width: 100%;
    }
    .img-slider {
        height: 300px;
    }
    .factory-title {
        font-size: 26px;
    }
    .item-title {
        font-size: 18px;
    }
    .item-desc {
        font-size: 14px;
    }
    .slider-btn {
        width: 40px;
        height: 40px;
    }
    .arrow-icon {
        width: 16px;
        height: 16px;
    }
}
@media (max-width: 480px) {
    .img-slider {
        height: 250px;
    }
    .factory-title {
        font-size: 22px;
    }
    .slider-btn {
        width: 35px;
        height: 35px;
    }
}



/* ========== 文化与责任模块 ========== */
.culture-responsibility {
    width: 100%;
    margin-top: 0;
    padding: 20px 0;
}

/* 90%显示区域 */
.culture-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
}

/* 大标题 */
.culture-main-title {
    font-size: 30px;
    color: #333;
    font-weight: 700;
    margin-bottom: 40px;
    text-align: center;
}

/* 小标题（蓝色文字） */
.culture-subtitle {
    font-size: 24px;
    color: #014ea0;
    font-weight: 600;
    margin-bottom: 40px;
    text-align: left;
}

/* 愿景使命价值观区域 */
.vision-grid {
    display: flex;
    gap: 30px;
    margin-bottom: 40px;
}
.vision-item {
    flex: 1;
    text-align: center;
    padding: 20px;
}
.vision-icon {
    width: 185px;
    height: 185px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background-color: #f0f8ff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.vision-icon img {
    width: auto;
    height: auto;
}
.vision-title {
    font-size: 16px;
    color: #333;
    line-height: 1.6;
}

/* 文化基因区域 */
.gene-grid {
    display: flex;
    gap: 30px;
    margin-bottom: 60px;
}
.gene-item {
    flex: 1;
    border-radius: 10px;
    overflow: hidden;
}
.gene-bg {
    width: 100%;
    height: 373px;
    background-size: cover;
    background-position: center;
    position: relative;
}
.gene-corner-icon {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
}
.gene-corner-icon img {
    width: auto;
    height: auto;
}
.gene-text {
    position: absolute;
    bottom: 20px;
    left: 20px;
    color: #fff;
}
.gene-title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px;
}
.gene-desc {
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 5px;
}
.gene-desc:last-child {
    margin-bottom: 0;
}

/* 社会责任区域 */
.responsibility-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-bottom: 30px;
}
.responsibility-item {
    display: flex;
    align-items: center;
    padding: 20px;
    border: 1px solid #014ea0;
    border-radius: 10px;
    /* 默认渐变背景 */
    background: linear-gradient(90deg, rgba(1,78,160,0.1) 0%, rgba(255,255,255,0) 100%);
    color: #333;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}
/* 鼠标滑过效果：蓝色背景+背景图混合 */
.responsibility-item:hover {
    background-color: rgba(1, 78, 160, 0.8);
    color: #fff;
}
.responsibility-item:hover::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('images/responsibility-bg.png');
    background-size: cover;
    background-position: center;
    opacity: 0.2;
    z-index: 0;
}

/* 社会责任项-左侧（图标+标题+竖线） */
/* 社会责任项-左侧（图标+标题+竖线） */
.responsibility-item .item-left {
    display: flex;
    align-items: center;
    gap: 15px;
    width: 30%;
    position: relative;
    z-index: 1;
}
.responsibility-item .item-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #fff; /* 背景颜色设置为蓝色 */
    display: flex;
    align-items: center;
    justify-content: center;
}
.responsibility-item .item-icon img {
    width: auto;
    height: auto;
}
.responsibility-item .item-title {
    font-size: 18px;
    font-weight: 600;
    color: #000; /* 默认文字颜色 */
}
.responsibility-item:hover .item-title {
    color: #fff; /* 悬停时文字颜色变白 */
}
/* 标题后竖线 */
.responsibility-item .item-line {
    width: 1px;
    height: 20px;
    background-color: #014ea0;
    margin-left: auto; /* 自动调整左边距以适应不同屏幕尺寸 */
}
/* 滑过时光线变白 */
.responsibility-item:hover .item-line {
    background-color: #fff;
}

/* 社会责任项-右侧文字 */
.responsibility-item .item-right {
    font-size: 16px;
    line-height: 1.6;
    width: 70%; /* 修改宽度以适应新的布局 */
    position: relative;
    color:#000;
    z-index: 1;
}
/* 底部说明文字 */
.responsibility-item .responsibility-desc {
    font-size: 20px;
    color: #333;
    line-height: 1.8;
}
/* 高亮文字（蓝色） */
.highlight {
    color: #014ea0;
    font-weight: 600;
}

/* ========== 移动端自适应 ========== */
@media (max-width: 768px) {
    .culture-main-title {
        font-size: 30px;
    }
    .culture-subtitle {
        font-size: 20px;
    }
    .vision-grid {
        flex-direction: column;
        gap: 20px;
    }
    .gene-grid {
        flex-direction: column;
        gap: 20px;
    }
    .responsibility-item {
        flex-direction: column;
        align-items: flex-start;
        padding: 15px;
    }
   .responsibility-item  .item-left {
        width: 30%;
        margin-bottom: 10px;
    }
   .responsibility-item .item-right {
        width: 70%;
    }
}

@media (max-width: 480px) {
    .culture-main-title {
        font-size: 24px;
    }
    .vision-title {
        font-size: 18px;
    }
    .gene-title {
        font-size: 18px;
    }
    .item-title {
        font-size: 16px;
    }
}

 
 
 /* ========== 质量体系模块容器 ========== */
.quality-system {
    width: 100%;
    margin-top: 60px;
    margin-bottom: 80px;
}
.quality-container {
    width: 90%;
    margin: 0 auto;
    max-width: 1440px;
}
.section-title {
    font-size: 28px;
    color: #333;
    font-weight: 700;
    margin-bottom: 40px;
    text-align: left; /* 标题左对齐 */
}


/* ========== 1. 证书资质模块 ========== */
.certificate-section {
    margin-bottom: 80px;
}
.certificate-wrap {
    position: relative;
    height: 450px; /* 适配证书高度 */
    display: flex;
    justify-content: center;
    align-items: center;
}
.certificate-item {
    position: absolute;
    width: 270px;
    text-align: center;
    transition: transform 0.3s ease;
    
 
      margin: 100px auto;
      perspective: 1000px;  /* 透视必备 */
      transform-style: preserve-3d; /* 开启3D空间必备 */
}
.certificate-item:hover {
    transform: translateY(-5px);
}
.cert-img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 5px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
}
.cert-title {
    font-size: 16px;
    color: #333;
    margin-top: 10px;
}
/* 证书层叠位置（还原参考图） */
.item-1 { left: 5%; z-index: 1; }
.item-1  .cert-img{ width: 100%;
      height: 100%;
      background: linear-gradient(135deg, #4287f5, #7b68ee);
      border-radius: 10px;
      color: #fff;
      text-align: center;
      line-height: 200px;
      font-size: 20px;
      /* ✅ 核心修改：把旋转角度直接写在这里，就是默认角度！ */
      transform: rotateX(15deg) rotateY(25deg);}

.item-2 { left: 17%; z-index: 2; }

.item-2  .cert-img{ width: 100%;
      height: 100%;
      background: linear-gradient(135deg, #4287f5, #7b68ee);
      border-radius: 10px;
      color: #fff;
      text-align: center;
      line-height: 200px;
      font-size: 20px;
      /* ✅ 核心修改：把旋转角度直接写在这里，就是默认角度！ */
      transform: rotateX(15deg) rotateY(25deg);}
.item-3 { left: 27%; z-index: 3; }
.item-3  .cert-img{ width: 100%;
      height: 100%;
      background: linear-gradient(135deg, #4287f5, #7b68ee);
      border-radius: 10px;
      color: #fff;
      text-align: center;
      line-height: 200px;
      font-size: 20px;
      /* ✅ 核心修改：把旋转角度直接写在这里，就是默认角度！ */
      transform: rotateX(15deg) rotateY(25deg);}
.item-4 { left: 40%; z-index: 4; /* 中间层，压3和5 */ }
.item-4  .cert-img{ width: 100%;
      height: 100%;
      background: linear-gradient(135deg, #4287f5, #7b68ee);
      border-radius: 10px;
      color: #fff;
      text-align: center;
      line-height: 200px;
      font-size: 20px;
      /* ✅ 核心修改：把旋转角度直接写在这里，就是默认角度！ */
      transform: rotateX(0deg) rotateY(0deg);scale(1.2);}


      
.item-5 { left: 55%; z-index: 3; }
.item-5  .cert-img{ width: 100%;
      height: 100%;
      background: linear-gradient(135deg, #4287f5, #7b68ee);
      border-radius: 10px;
      color: #fff;
      text-align: center;
      line-height: 200px;
      font-size: 20px;
      /* ✅ 核心修改：把旋转角度直接写在这里，就是默认角度！ */
      transform: rotateX(15deg) rotateY(331deg);}
      
      
.item-6 { left: 67%; z-index: 2; }
.item-6  .cert-img{ width: 100%;
      height: 100%;
      background: linear-gradient(135deg, #4287f5, #7b68ee);
      border-radius: 10px;
      color: #fff;
      text-align: center;
      line-height: 200px;
      font-size: 20px;
      /* ✅ 核心修改：把旋转角度直接写在这里，就是默认角度！ */
      transform: rotateX(15deg) rotateY(331deg);}
.item-7 { left: 78%; z-index: 1; }
.item-7  .cert-img{ width: 100%;
      height: 100%;
      background: linear-gradient(135deg, #4287f5, #7b68ee);
      border-radius: 10px;
      color: #fff;
      text-align: center;
      line-height: 200px;
      font-size: 20px;
      /* ✅ 核心修改：把旋转角度直接写在这里，就是默认角度！ */
      transform: rotateX(15deg) rotateY(331deg);}


.item-1:hover,.item-2:hover,.item-3:hover,.item-4:hover,.item-5:hover,.item-6:hover,.item-7:hover {
  transform: rotate3d(0, 1, 0, 360deg);
}      

/* ========== 2. 产品质检流程模块 ========== */
.inspection-section {
    margin-bottom: 80px;
}
.inspection-wrap {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    position: relative;
    padding-top: 40px; /* 给连接线留空间 */
}
/* 流程连接线+箭头 */
.inspection-line {
    position: absolute;
    top: 103px;
    left: 0;
    width: 100%;
    z-index: 222;
    display: flex;
    align-items: center;
}
.line-bar {
    width: calc(100% - 20px); /* 减去箭头宽度 */
    height: 3px;
    background-color: #014ea0;
}
.line-arrow {
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 15px solid #014ea0;
}
/* 流程列 */
.inspection-item {
    width: 24%;
    background: linear-gradient(to bottom, #f0f8ff, #e6f2ff); /* 淡蓝渐变色 */
    border-radius: 10px;
    padding: 20px;
    text-align: center;
    position: relative;
}
.inspection-item .item-title {
    font-size: 18px;
    width: 100%;
    color: #014ea0;
    font-weight: 600;
    margin-bottom: 20px;
}
/* 圆点（外层圆圈+内层点） */
.item-dot {
    width: 15px;
    height: 15px;
    border: 3px solid #014ea0;
    border-radius: 50%;
    background-color: #fff;
    margin: 0 auto 15px;
    position: relative;
    z-index: 2; /* 覆盖连接线 */
}
.item-dot::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: #014ea0;
}
.inspection-item  .item-text2 {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
    margin-bottom: 20px;
    text-shadow:none;
    margin-top:20px;
    
}
.item-img {
    width: 100%;
    height: 150px;
    object-fit: cover;
    border-radius: 10px;
}


/* ========== 3. 质量保证模块 ========== */
.assurance-section {
    margin-bottom: 80px;
}
.assurance-wrap {
    display: flex;
    justify-content: space-between;
    gap: 30px;
}
.assurance-item {
    width: 48%;
    display: flex;
    align-items: center;
}
/* 左侧：长条+圆形图标 */
.item-left {
    display: flex;
    align-items: center;
    position: relative;
}
.left-bar {
    width: 180px;
    height: 50px;
    line-height: 50px;
    color: #fff;
    text-indent: 1em;
    background-color: #014ea0;
    border-radius: 25px 0 0 25px; /* 左半圆 */
}
.left-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2); /* 立体效果 */
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 150px; /* 压在长条右侧 */
}
.left-icon img {
    width: 30px;
    height: 30px;
}
/* 右侧：渐变框+文字 */
.item-right {
    flex: 1;
    background: linear-gradient(to right, #f0f8ff, #fff);
    border: 1px solid #014ea0;
    border-radius: 15px 15px;
    padding: 15px 20px;
}
.right-title {
    font-size: 20px;
    color: #014ea0;
    font-weight: 600;
    margin-bottom: 5px;
}
.right-text {
    font-size: 14px;
    color: #333;
    text-align: center;
}


/* ========== 移动端自适应 ========== */
@media (max-width: 1200px) {
    /* 证书资质：改为垂直排列 */
    .certificate-wrap {
        height: auto;
        flex-direction: column;
        gap: 20px;
    }
    .certificate-item {
        position: relative;
        left: 0;
        z-index: 1;
        width: 80%;
    }
    .cert-img {
        height: 250px;
    }

    /* 产品质检流程：改为2列 */
    .inspection-wrap {
        flex-wrap: wrap;
    }
    .inspection-item {
        width: 48%;
        margin-bottom: 30px;
    }

    /* 质量保证：改为垂直排列 */
    .assurance-wrap {
        flex-direction: column;
    }
    .assurance-item {
        width: 100%;
        margin-bottom: 20px;
    }
}

@media (max-width: 768px) {
    .section-title {
        font-size: 24px;
    }

    /* 产品质检流程：改为1列 */
    .inspection-item {
        width: 100%;
    }

    /* 质量保证：缩短长条宽度 */
    .left-bar {
        width: 80px;
    }
    .left-icon {
        left: 50px;
    }
}

.pagination{display:inline-block;padding-left:0;margin:20px 0;border-radius:4px;}
.pagination>li{display:inline;}
.pagination>li>a,.pagination>li>span{position:relative;float:left;padding:6px 12px;line-height:1.42857;text-decoration:none;color:#337ab7;background-color:#fff;border:1px solid #ddd;margin-left:-1px;}
.pagination>li:first-child>a,.pagination>li:first-child>span{margin-left:0;border-bottom-left-radius:4px;border-top-left-radius:4px;}
.pagination>li:last-child>a,.pagination>li:last-child>span{border-bottom-right-radius:4px;border-top-right-radius:4px;}
.pagination>li>a:focus,.pagination>li>a:hover,.pagination>li>span:focus,.pagination>li>span:hover{z-index:2;color:#23527c;background-color:#eee;border-color:#ddd;}
.pagination>.active>a,.pagination>.active>a:focus,.pagination>.active>a:hover,.pagination>.active>span,.pagination>.active>span:focus,.pagination>.active>span:hover{z-index:3;color:#fff;background-color:#337ab7;border-color:#337ab7;cursor:default;}
       /* 基础容器样式 */
    .hkhtcase {
        width: 90%;
        max-width: 1600px;
        margin: 0 auto;
        font-family: "Microsoft Yahei", sans-serif;
        color: #333;
        box-sizing: border-box;
        padding: 1rem;
    }

    /* 第一行布局：左侧30% 右侧70% */
    .hkhtcase-header {
        display: flex;
        flex-wrap: wrap;
        gap: 1rem;
        margin-bottom: 2rem;
    }
    .hkhtcase-header .title-card {
        width: calc(30% - 0.5rem);
        background-color: #014ea0;
        color: #fff;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 2rem 1rem;
        text-align: center;
        border-radius: 4px;
    }
    .hkhtcase-header .title-card h1 {
        font-size: 2.5rem;
        margin: 0 0 0.5rem 0;
    }
    .hkhtcase-header .title-card p {
        font-size: 1.2rem;
        margin: 0;
        opacity: 0.9;
    }
    .banner-img-container {
        width: calc(70% - 0.5rem);
        height: 300px;
        overflow: hidden;
        position: relative;
        border-radius: 4px;
    }
    .banner-img-container img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

    /* 新增：电推进模块文字区域样式 */
    .gas-module-text {
        margin: 2rem 0;
        padding-bottom: 1rem;
        border-bottom: 2px solid #014ea0;
        width: 95%; /* 底横线长度50% */
    }
    .gas-module-text h2 {
        color: #014ea0;
        font-size: 1.5rem;
        margin: 0 0 0.8rem 0;
    }
    .gas-module-text ul {
        list-style: disc;
        padding-left: 1.5rem;
        margin: 0;
        line-height: 1.8;
    }
    .gas-module-text ul li {
        margin: 0.3rem 0;
        font-size: 1rem;
    }

    /* 新增：一行3列布局样式 */
    .three-col-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1.5rem;
        margin: 2rem 0;
    }
    .col-item {
        display: flex;
        flex-direction: column;
        width: 100%;
    }
    .col-title {
        padding: 0.8rem 1rem;
        color: #fff;
        font-weight: 500;
        width: 100%;
        font-size: 1rem;
        text-align: center;
        margin-bottom: 0.8rem;
        border-radius: 4px 4px 0 0;
    }
    .gray-bg {
        background-color: #999; /* 第一个标题灰色背景 */
    }
    .blue-bg {
        background-color: #014ea0; /* 后两个标题蓝色背景 */
    }
    .col-img-container {
        width: 100%;
        height: 250px;
        overflow: hidden;
        position: relative;
        border-radius: 0 0 4px 4px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
    .col-img-container img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        transition: transform 0.3s ease;
    }
    .col-img-container:hover img {
        transform: scale(1.03);
    }

    /* 原有内容区布局 */
    .hkhtcase-content {
        display: flex;
        flex-wrap: wrap;
        gap: 1.5rem;
        margin: 2rem 0;
    }
    .content-left {
        width: calc(70% - 0.75rem);
        display: flex;
        flex-direction: column;
        gap: 1.5rem;
    }
    .content-left .text-list {
        padding: 1rem;
    
        border-radius: 4px;
    }
    .content-left .text-list ul {
        list-style: disc;
        padding-left: 1.5rem;
        line-height: 1.8;
    }
    .content-left .text-list ul li {
        margin: 0.5rem 0;
    }
    .content-left .text-list ul li strong {
        color: #3f51b5;
    }
    .double-img-group {
        display: flex;
        flex-direction: column;
        gap: 0.8rem;
    }
    .img-pair {
        display: flex;
        gap: 1rem;
    }
    .img-pair .card-img-container {
        width: 50%;
        height: 220px;
        overflow: hidden;
        position: relative;
        border-radius: 4px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
    .double-img-title {
        text-align: center;
        margin: 0;
        padding: 0.5rem 0;
        font-weight: 500;
        color: #333;
        font-size: 0.95rem;
    }
    .content-right {
        width: calc(30% - 0.75rem);
        display: flex;
        flex-direction: column;
        gap: 1.5rem;
    }
    .content-right .card-item {
        display: flex;
        flex-direction: column;
        gap: 0.8rem;
    }
    .card-img-container {
        width: 100%;
        height: 220px;
        overflow: hidden;
        position: relative;
        border-radius: 4px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
    .card-img-container img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        transition: transform 0.3s ease;
    }
    .card-img-container:hover img {
        transform: scale(1.03);
    }
    .content-right .card-item p {
        text-align: center;
        margin: 0;
        font-size: 0.95rem;
        color: #555;
    }

    /* 响应式适配 */
    @media (max-width: 1024px) {
        /* 平板端3列改为2列 */
        .three-col-grid {
            grid-template-columns: repeat(2, 1fr);
        }
        .three-col-grid .col-item:last-child {
            grid-column: 1 / -1; /* 第三个项目占满整行 */
        }
    }
    @media (max-width: 768px) {
        /* 移动端第一行堆叠 */
        .hkhtcase-header .title-card,
        .banner-img-container {
            width: 100%;
        }
        /* 移动端底横线宽度改为100% */
        .gas-module-text {
            width: 100%;
        }
        /* 移动端3列改为1列 */
        .three-col-grid {
            grid-template-columns: 1fr;
        }
        .three-col-grid .col-item:last-child {
            grid-column: auto;
        }
        /* 移动端内容区堆叠 */
        .content-left,
        .content-right {
            width: 100%;
        }
        /* 移动端图片高度适配 */
        .banner-img-container {
            height: 200px;
        }
        .card-img-container,
        .img-pair .card-img-container,
        .col-img-container {
            height: 180px;
        }
        /* 移动端两列图片改为单列 */
        .img-pair {
            flex-direction: column;
        }
        .img-pair .card-img-container {
            width: 100%;
        }
        .hkhtcase-header .title-card h1 {
            font-size: 2rem;
        }
    }
    
    
    
    /*产品参数*/
    
  /* 容器主样式 - 保持原类名detailtable */
        .detailtable {
            max-width: 100%;
            margin: 30px auto;
            padding: 0;
            display: flex;
            gap: 20px;
            flex-wrap: nowrap;
            overflow-x: visible;
            padding-bottom: 15px;
        }

        /* 参数卡片容器 - 合并后的外层 */
        .detailtable  .param-card {
            background-color: #f5f5f5;
            border-radius: 4px;
            flex: 1;
            min-width: 280px;
            display: grid;
            /* 分为两列：标题列+内容列 */
            grid-template-columns: 170px 1fr;
            /* 行间距统一 */
            row-gap: 0;
            padding: 0;
            line-height: 1.8;
        }
        
        .detailtable  .param-card:nth-child(3){display:none}

        /* 标题行样式 - 单独定义类名 */
        .detailtable  .param-label {
            background-color: #6c757d;
            color: #ffffff;
            padding: 0 15px;
            /* 文字居中对齐 */
            display: flex;
            align-items: center;
            white-space: nowrap;
             white-space: normal; /* 允许文字自动换行（替换 nowrap） */
    word-wrap: break-word; /* 兼容长单词/URL换行 */
        }

        /* 内容行样式 - 单独定义类名 */
        .detailtable  .param-value {
            color: #333333;
            padding: 0 15px;
            display: flex;
            align-items: center;
            white-space: nowrap;
        }

        /* 响应式适配：手机端调整 */
        @media (max-width: 768px) {
            .detailtable {
                flex-wrap: wrap;
                gap: 15px 0;
                padding: 0 10px;
            }
            .detailtable  .param-card {
                flex: 0 0 100%;
                min-width: auto;
                grid-template-columns: 100px 1fr;
                row-gap: 6px;
                padding: 10px;
                line-height: 1.6;
            }
            .detailtable .param-label {
                padding: 0 10px;
                font-size: 14px;
            }
           .detailtable  .param-value {
                padding: 0 10px;
                font-size: 14px;
            }
        }
        
        .detailcontent {
            max-width: 100%;
            margin: 30px auto;
            padding: 0;
            /*display: flex;*/
            /*gap: 20px;*/
            flex-wrap: nowrap;
            overflow-x: visible;
         
        }
         .detailcontent p{
           font-size: .8rem;
           line-height:150%;
        }
          @media (max-width: 768px) {
            .detailcontent {
                flex-wrap: wrap;
                gap: 15px 0;
                padding: 0 10px;
            }
            .detailcontent  p {
                flex: 0 0 100%;
                min-width: auto;
                grid-template-columns: 100px 1fr;
                row-gap: 6px;
                padding: 10px;
                line-height: 1.6;
            }
          
        }