* {
  padding: 0;
  margin: 0;
  font-family: Source Han Sans SC;
}
a {
    text-decoration: none;
}
/* ==========================================================================
   新增：首页 Banner 渐隐 + 从大变小缩放动画
   ========================================================================== */
.home_banner_swiper .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* 核心：缩放动画过渡时间，与 JS 里的 speed 保持一致 */
    transition: transform 1.2s ease-out !important; 
    /* 默认状态：稍微放大（例如 1.08 倍） */
    transform: scale(1.08) !important; 
}

/* 当滑块变为激活状态（当前显示）时，图片恢复正常大小（1倍），形成从大变小的视觉差 */
.home_banner_swiper .swiper-slide-active img {
    transform: scale(1) !important;
}
.head_container {
    max-width: 1520px;
    margin: 0 auto;
    padding: 26px 0;
}
.head_content {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.head_img {
    display: flex;
    align-items: center;
}
.head_menu {
    display: flex;
    gap: 66px;
    align-items: center;
}
.head_menu_left {
    display: flex;
    gap: 66px;
    align-items: center;
}
.head_menu_left a {
    font-size: 14px;
    text-decoration: none;
    color: #999;
    font-weight: 500;
    cursor: pointer;
    transition: all .3s ease;
}
.head_menu_left .active,
.head_menu_left .active a,
.head_menu_left a:hover {
    color: #0261AD;
}
.head_menu_translate p {
    font-size: 14px;
    color: #333;
    font-weight: 500;
}
/* ==========================================================================
   新增：PC端二级下拉菜单样式
   ========================================================================== */
/* 取消ul默认列表样式 */
.head_menu_left {
    list-style: none;
    display: flex;
    gap: 66px;
    align-items: center;
}

/* 一级菜单项定位上下文 */
.nav_item {
    position: relative;
    padding: 10px 0; /* 扩大鼠标移入的有效判定区域，防止下拉菜单断开 */
}

.nav_item > a {
    font-size: 14px;
    text-decoration: none;
    color: #999;
    font-weight: 500;
    cursor: pointer;
    transition: all .3s ease;
    display: block;
}

/* 二级下拉菜单容器基础状态（隐藏） */
.sub_menu {
    display: none;
    position: absolute;
    top: 100%; /* 出现在一级菜单的正下方 */
    left: 50%;
    transform: translateX(-50%) translateY(10px); /* 居中并稍微下移，用于动画 */
    background-color: #FFFFFF;
    min-width: 140px; /* 菜单最小宽度 */
    list-style: none;
    padding: 10px 0;
    margin: 0;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.1);
    border-radius: 6px;
    
    /* 核心动画：隐藏状态 */
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
    z-index: 999;
}
.sub_menu_item {
    color: #666 !important;
}
.sub_menu .active {
    color: #0261AD !important;
}
/* 鼠标悬浮一级菜单时，显示二级菜单 */
.nav_item:hover .sub_menu {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0); /* 恢复位置，实现向上的淡入效果 */
}

/* 二级菜单列表项样式 */
.sub_menu li {
    width: 100%;
}

.sub_menu li a {
    display: block;
    padding: 10px 20px;
    color: #666;
    font-size: 13px;
    text-decoration: none;
    text-align: center;
    white-space: nowrap; /* 限制文字不换行 */
    transition: all 0.2s ease;
}

/* 二级菜单悬浮与高亮状态 */
.sub_menu li a:hover,
.sub_menu li a.active {
    background-color: #f4f7f6;
    color: #0261AD; /* 悬浮时变蓝 */
}


/* ==========================================================================
   移动端兼容处理：当屏幕小于 992px 时，强制关闭 PC 端的浮动下拉
   ========================================================================== */
@media (max-width: 992px) {
    .head_menu_left {
        display: none !important; /* 确保PC端结构的ul在移动端彻底隐藏 */
    }
}
/* 默认电脑端显示，移动端隐藏 */
.pc_menu { display: flex; }
.m_menu_btn, .m_menu_wrap { display: none; }

/* 当屏幕小于 992px 时（进入移动端视图） */
@media (max-width: 992px) {
    .pc_menu { display: none; } /* 隐藏PC端 */
    
    /* 显示移动端汉堡按钮 */
    .m_menu_btn { 
        display: block; 
        width: 30px; 
        height: 24px; 
        cursor: pointer;
    }
    .m_menu_btn span { display: block; height: 3px; background: #333; margin-bottom: 5px; }
    
    /* 移动端下拉菜单基础样式 */
    .m_menu_wrap {
        display: none; /* 默认隐藏，靠JS控制显示 */
        position: absolute;
        top: 60px; /* 根据导航高度调整 */
        left: 0;
        width: 100%;
        background: #fff;
        box-shadow: 0 5px 5px rgba(0,0,0,0.1);
    }
    .m_menu_wrap.open { display: block; } /* 点击后展开 */
    .m_menu_links a { display: block; padding: 12px 20px; border-bottom: 1px solid #eee; }
    .m_menu_links a.active { color: #ff0000; font-weight: bold; }
}

.section {
    max-width: 1520px;
    margin: 0 auto;
    padding: 70px 0;
}

.home_company_section {
    min-height: 990px;
    display: flex;
    align-items: center;
    background-image: url(/skin/images/company.jpg);/* 新增以下两行 */
    background-repeat: no-repeat;  /* 禁止图片重复 */
    background-size: cover;        /* 把背景图像扩展至足够大，以使背景图像完全覆盖背景区域 */
    background-position: center;   /* 让图片居中对齐，保证缩放时核心内容不偏移 */
}
.home_company {
    max-width: 1520px;
    margin: 0 auto;
}
.hoem_company_info {
    width: 40%;
}
.hoem_company_info h1 {
    font-size: 34px;
    color: #0261AD;
    margin-bottom: 38px;
}
.hoem_company_info p {
    color: #666666;
    font-size: 18px;
    text-indent: 2em;
    line-height: 45px;
}
.hoem_company_info a {
    border: 2px solid #0261AD;
    border-radius: 10px;
    font-size: 18px;
    color: #0261AD;
    padding: 6px 20px;
    margin-top: 200px;
    display: inline-block;
    transition: all .3s ease;
    cursor: pointer;
}
.hoem_company_info a:hover {
    background-color: #0261AD;
    color: #FFF;
}
.home_title h2{
    font-size: 26px;
    color: #0261AD;
}
.home_title h3 {
    font-size: 16px;
    color: #666;
    font-weight: Regular;
}
.corp_list {
    display: flex;
    gap: 32px;
    margin-top: 54px;
}
.corp_item {
    width: calc((100% - 96px) / 4);
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 26px 35px;
    background: #FFFFFF;
    box-shadow: 0px 1px 15px 0px rgba(153,153,153,0.3);
    gap: 12px;
    transition: all .3s ease;
    border-radius: 15px;
}
.corp_item:hover {
    box-shadow: 0px 1px 15px 0px #005fa7;
}
.corp_title {
    font-size: 20px;
    color: #333;
}
.corp_remark {
    font-size: 16px;
    text-align: center;
    color: #999;
}



.home_title_container {
    display: flex;
    justify-content: space-between;
}

.news_cat {
    display: flex;
    gap: 20px;
}
.news_fit {
    background: #0261AD;
    color: #FFF;
    border-radius: 10px;
    border: 2px solid #0261AD;
    padding: 8px 24px;
    text-decoration: none;
    transition: all .3s ease;
}
.news_fit:hover {
    background: #FFF;
    border: 2px solid #0261AD;
    color: #0261AD;
}
.news_border {
    background: #FFF;
    border: 2px solid #0261AD;
    color: #0261AD;
    border-radius: 10px;
    padding: 8px 24px;
    text-decoration: none;
    transition: all .3s ease;
}
.news_border:hover {
    background: #0261AD;
    color: #FFF;
    border-radius: 10px;
    border: 2px solid #0261AD;
}
.news_list {
    display: flex;
    gap: 34px;
    margin-top: 65px;
}
.news_item {
    width: calc((100% - 68px) / 3);
    background: #FFFFFF;
    box-shadow: 0px 1px 15px 0px rgba(153,153,153,0.3);
    border-radius: 15px;
    padding: 30px;
    transition: all .3s ease;
}
.news_item:hover {
    box-shadow: 0px 1px 15px 0px #0261ad;
}
.news_date {
    font-size: 24px;
    color: #999;
    font-weight: bold;
}
.news_item h3 {
    font-size: 22px;
    color: #333;
    margin-top: 40px;
    margin-bottom: 30px;
}

.news_remark {
    font-size: 16px;
    color: #999;
    margin-top: 20px;
}
.news_item hr {
    border: 1px solid #CCC;
}
.news_more {
    font-size: 16px;
    color: #333;
    display: flex;
    margin-top: 40px;
    align-items: center;
}
.news_more p {
    margin-left: -10px;
    margin-right: 10px;
}
.news_more img {
    object-fit: contain;
}
.news_circle {
    opacity: 0.3;
    border-radius: 50px;
    width: 34px;
    height: 34px;
    background: #0261AD;
}


.home_sample_list {
    margin-top: 65px;
    display: flex;
    width: 100%;
    height: 400px;
    overflow: hidden;
    gap: 36px;
}

.home_sample_item {
    position: relative;
    height: 100%;
    cursor: pointer;
    
    flex: 1; 
    
    transition: flex 0.5s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.3s ease;
    
    border-radius: 8px;
    overflow: hidden;
}

.home_sample_item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.home_sample_list .home_sample_item.active {
    flex: 2; 
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15); 
}

.home_sample_list:hover .home_sample_item {
    flex: 1;
    box-shadow: none;
}

.home_sample_list .home_sample_item:hover {
    flex: 2 !important; 
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}


.home_product_container {
    background-image: url("../images/产品展示背景.jpg");
    background-repeat: no-repeat;  /* 1. 核心：设置图片不重复 */
    background-size: cover;        /* 2. 核心：等比例缩放图片直到完全覆盖容器 */
    background-position: center;   /* 3. 辅助：让背景图在容器中居中对齐 */
}
/* 外层总包裹 */
.product-sync-wrapper {
    width: 100%;
    margin: 0 auto;
    position: relative;
}

/* 主产品项布局 */
.home_product_item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 40px 0;
}
.product_info {
    width: 30%;
}
.product_info h2 {
    font-size: 36px;
    margin-bottom: 20px;
    color: #333;
}
.product_info p {
    font-size: 16px;
    line-height: 1.8;
    color: #666;
    margin-bottom: 30px;
}
.product_img {
    width: 65%;
}
.product_img img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* 下方控制区域 */
.product-control-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 30px;
    padding-top: 20px;
}

/* 箭头定位修正 */
.nav-buttons {
    display: flex;
    gap: 15px;
    margin-right: 40px;
}
.product-prev img, .product-next img {
    width: 12px;
    height: auto;
}
.product-prev, .product-next {
    cursor: pointer;
    position: static; /* 取消 swiper 默认的绝对定位 */
    margin: 0;
    width: 40px;
    height: 40px;
    background: #f5f5f5;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.product-prev:after, .product-next:after {
    font-size: 16px; /* 缩小箭头 */
    color: #333;
}

/* 型号导航样式 */
.product-thumbs-swiper {
    overflow: hidden;
}
.product-thumbs-swiper .swiper-slide {
    width: auto; /* 关键：让型号标签宽度由文字决定 */
    margin-right: 30px;
    cursor: pointer;
}
.model-tag {
    font-size: 18px;
    color: #999;
    padding: 5px 0;
    transition: all 0.3s;
}
/* 核心：被激活的型号高亮样式 */
.product-thumbs-swiper .swiper-slide-thumb-active .model-tag,
.product-thumbs-swiper .model-tag:hover{
    color: #005fa7;
    font-weight: bold;
    border-bottom: 2px solid #005fa7;
}





/*关于我们*/
.about_container {
    display: flex;
    gap: 5%;
}
.about_info {
    width: 45%;
}
.about_img {
    width: 50%;
}
.about_img img {
    width: 100%;
}

.about_info h1 {
    font-size: 34px;
    color: #0261AD;
}
.about_info h3 {
    font-size: 24px;
    color: #666;
}
.about_info p {
    font-size: 18px;
    color: #666;
    text-indent: 2em;
    line-height: 38px;
    margin-top: 18px;
}

/*banner*/
.banner_container {
    width: 100%;
    position: relative;
}
.banner_container img {
    width: 100%;
}
.banner_content {
    display: flex;
    flex-direction: column;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.banner_content h1,
.banner_content h2 {
    font-size: 44px;
    color: #FFF;
    text-align: center;
}
.banner_content h3 {
    font-size: 24px;
    color: #FFF;
    text-align: center;
}

/*产品中心*/

.product_container {
    display: flex;
    gap: 2%;
}
.product_center,
.product_contact_us {
    border-radius: 10px;
    overflow: hidden;
}
.product_contact_us {
    margin-top: 30px;
}
.product_left {
    width: 300px;
    position: -webkit-sticky; /* 兼容 Safari 浏览器 */
    position: sticky;
    top: 20px;
    z-index: 99;
}
.product_title {
    background-color: #0161ad;
    color: #FFF;
    font-size: 22px;
    padding: 15px;
}
.product_ul {
    padding: 10px 20px;
    background: #FFF;
}
.product_ul li {
    font-size: 15px;
    cursor: pointer;
    padding: 18px 0;
    border-bottom: 1px solid #ebebeb;
}
.product_ul li a {
    display: flex;
    align-items: center;
}
.product_ul li a svg {
    margin-right: 8px;
    fill: #999;
}
.product_ul li:hover a {
    color: #0161ad;
}
.product_ul li:hover svg {
    fill: #0161ad;
}
.prdocut_contact_us_content {
    background: #FFF;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.prdocut_contact_us_content svg {
    fill: #0161ad;
    margin-right: 8px;
}
.prdocut_contact_us_content span {
    font-size: 14px;
    color: #333;
}
.prdocut_contact_us_content_item {
    display: flex;
    border: 1px solid #ebebeb;
    padding: 15px 10px;
    align-items: center;
}
.product_right {
    flex: 1;
    padding: 20px;
    background: #fff;
}
.product_detail_right {
    flex: 1;
}
.product_list {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
}
.product_item {
    width: calc((100% - 48px) / 3);
    background: #f7f8fc;
}
.product_item_img {
    padding: 20px;
}
.product_item_img img {
    width: 100%;
    transition: all .3s ease;
}
.product_item_text {
    padding: 20px;
}
.product_item_text h2 {
    font-size: 22px;
    text-align: center;
    font-weight: 500;
}
.product_item:hover .product_item_img img {
    transform: scale(1.1);
}


/* ==========================================================================
   产品详情页通用及 PC 端样式
   ========================================================================== */
*, *::before, *::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: #333;
    background-color: #fff;
}

.product_detail_container, .product_detail_other {
    max-width: 1200px;
    margin: 20px auto;
    padding: 30px 20px;
    background: #FFF;
}
.product_detail_container {
    margin-top: 0px;
}

/* 头部布局 */
.pd_head {
    display: table;
    width: 100%;
    margin-bottom: 40px;
}

.pd_head_left, .pd_head_right {
    display: table-cell;
    vertical-align: top;
    width: 50%;
}

.pd_head_left {
    padding-right: 30px;
}

/* 图片区域 */
.main_img {
    width: 100%;
    border: 1px solid #eee;
    margin-bottom: 15px;
}
.main_img img {
    width: 100%;
    height: auto;
    display: block;
}
.thumb_list {
    font-size: 0;
}
.thumb_item {
    display: inline-block;
    width: 22%;
    margin-right: 4%;
    border: 1px solid #eee;
    cursor: pointer;
}
.thumb_item:last-child {
    margin-right: 0;
}
.thumb_item img {
    width: 100%;
    height: auto;
    display: block;
}

/* 右侧文本区域 */
.pd_head_right h1 {
    font-size: 24px;
    margin-top: 0;
    margin-bottom: 15px;
    color: #111;
}
.pd_summary {
    color: #666;
    line-height: 1.6;
    margin-bottom: 25px;
    font-size: 14px;
}

.pd_head_ ul {
    list-style: none;
    padding: 0;
    margin: 0 0 30px 0;
    border-top: 1px dashed #eee;
}
.pd_head_ ul li {
    padding: 12px 0;
    border-bottom: 1px dashed #eee;
}
.pd_head_ ul li div {
    display: table;
    width: 100%;
}
.pd_head_ ul li div p {
    display: table-cell;
    margin: 0;
}
.pd_head_ ul li div p:first-child {
    width: 80px;
    color: #999;
}

/* 按钮组 */
.pd_actions a {
    display: inline-block;
    padding: 10px 25px;
    margin-right: 15px;
    text-decoration: none;
    border-radius: 4px;
    font-size: 14px;
}
.btn_msg {
    background-color: #0056b3;
    color: #fff;
}
.btn_back {
    border: 1px solid #ccc;
    color: #666;
}

/* 产品描述区 */
.product_title {
    font-size: 18px;
    font-weight: bold;
    border-left: 4px solid #0056b3;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.pd_description {
    line-height: 1.8;
    color: #333;
    margin-top: 15px;
}
.pd_description img {
    max-width: 100%;
    height: auto;
}
.pd_description table .firstRow {
    background-color: #f2f2f2; /* 这里换成你想要的背景颜色，比如浅灰色 */
    color: #333; /* 表头文字颜色 */
    font-weight: bold; /* 表头文字加粗 */
}
.pd_description strong {
    color: #0161ad;
    font-size: 18px;
}
.pd_description p,
.pd_description td {
    font-size: 14px;
    line-height: 2;
}
.pd_description td {
    padding: 8px;
}


.pd_tags {
    margin-top: 20px;
    background: #EFEFEF;
    display: flex;
    align-items: center;
    padding: 10px;
}
.pd_tags h5 {
    font-size: 14px;
    color: #333;
}
.pd_tags p {
    display: inline-block;
    margin: 0;
    color: #888;
}

/* 相关推荐列表 */
.pd_other_list {
    display: table;
    width: 100%;
    table-layout: fixed;
    margin-bottom: 40px;
    margin-top: 15px;
}
.other_item {
    display: table-cell;
    padding: 0 10px;
    text-align: center;
}
.other_item a {
    text-decoration: none;
    color: #333;
}
.other_item img {
    width: 100%;
    border: 1px solid #eee;
    margin-bottom: 8px;
}

/* 留言表单 */
.pd_contact_us {
    margin: 0 auto;
}
.pd_contact_us h4 {
    margin-top: 0;
    font-size: 18px;
    border-bottom: 1px solid rgba(0,0,0,.1);
    font-size: 28px;
    text-align: center;
    padding-bottom: 8px;
    margin-bottom: 8px;
}
.pd_contact_us p {
    font-size: 16px;
    margin-top: 32px;
    text-align: center;
}
.pd_contact_us form {
    margin-top: 30px;
}
.form_group {
    margin-bottom: 15px;
}
.form_group input[type="text"], .form_group textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    outline: none;
    font-size: 14px;
}
.form_group textarea {
    resize: vertical;
}
.verify_code {
    position: relative;
}
.verify_code input {
    width: 60% !important;
}
.verify_code img {
    position: absolute;
    right: 0;
    top: 0;
    height: 38px;
    cursor: pointer;
}
.pd_contact_us button {
    background: #333;
    color: #fff;
    border: none;
    padding: 12px 30px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    width: 100%;
}
.pd_contact_us button:hover {
    background: #0056b3;
}


/*案例*/
.case_title {
    font-size: 32px;
    color: #005fa7;
    text-align: center;
}
.case_container {
    background: #FFF;
    padding-bottom: 20px;
}
.case_list {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    background: #FFF;
    padding: 20px;
}
.case_item {
    background: #f2f2f2;
    padding: 10px;
    padding-bottom: 20px;
    width: calc((100% - 48px) / 3);
}
.case_img {
    width: 100%;
    overflow: hidden;
}
.case_img img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    transition: all .3s ease;
}
.case_item:hover .case_img img {
    transform: scale(1.1);
}

.case_text {
    text-align: center;
    font-size: 16px;
}


/*新闻列表*/
.newslist_container {
    display: flex;
    gap: 1.5%;
}
.newslist_left {
    width: 80%;
    background: #FFF;
    padding: 20px;
}
.newslist_right {
    width: 25.5%;
    background: #FFF;
}
.newslist_right h3 {
    font-size: 22px;
}
.newslist_list {
    display: flex;
    flex-direction: column;
}
.newslist_item {
    margin-bottom: 30px;
}
.newslist_item:hover .newslist_img img{
    transform: scale(1.1);
}
.newslist_item:hover .newslist_content h2 a {
    color: #005fa7;
}
.newslist_item hr {
    display-radio: 1;
    height: auto;
    border-top-style: solid;
    border-top-width: 1px;
    transition: all .3s ease;
    border-top-color: rgba(221,221,221,1);
}
.newslist_item:hover hr {
    border-top-color: #005fa7;
}
.newslist_item_content {
    display: flex;
    padding-bottom: 30px;
}

.newslist_img {
    width: 40%;
    overflow: hidden;
}
.newslist_img img {
    width: 100%;
    transition: all .3s ease;
}
.newslist_right h3 {
    padding: 5%;
    padding-bottom: 0px;
}
.newslist_related {
    display: flex;
    flex-direction: column;
    padding: 5%;
}
.nr_item {
    width: 100%;
    border-bottom: 1px solid rgba(221,221,221,1);
    margin-bottom: 10px;
    padding-bottom: 15px;
}
.nr_item:hover .nr_text a {
    color: #005fa7;
}
.nr_text a{
    font-size: 14px;
    transition: all .3s ease;
}
.nr_item_img {
    overflow: hidden;
    width: 100%;
}
.nr_item_img img {
    width: 100%;
    transition: all .3s ease;
}
.nr_item:hover .nr_item_img img {
    transform: scale(1.1);
}

.newslist_content {
    padding-left: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.newslist_content h2 {
    font-size: 22px;
    font-weight: 500;
}
.newslist_content h2 a {
    transition: all .3s ease;
}
.news_list_remark {
    margin-top: 10px;
    margin-bottom: 3%;
    font-size: 16px;
    color: #999;
    line-height: 1.5;
}

.news_list_date {
    display: flex;
    font-size: 14px;
    justify-content: space-between;
    color: #999;
}


/*新闻*/
.news_container {
    display: flex;
    gap: 1.5%;
}
.newslist_left {
    padding: 60px 25px;
}
.newslist_left h1 {
    border-top: 3px solid #f5f5f5;
    padding-top: 40px;
    font-size: 30px;
    text-align: center;
}
.news_public {
    font-size: 12px;
    text-align: center;
    color: #999;
    padding: 15px 0;
    margin-top: 25px;
    border: 1px solid #f5f5f5;
    border-left: 0;
    border-right: 0;
}
.keywords {
    padding: 15px 0;
    margin-top: 25px;
    border: 1px dashed #f5f5f5;
    border-left: 0;
    border-right: 0;
}
.keywords P {
    color: #333;
    font-weight: 600;
}
.preAndNext {
    margin-top: 30px;
    display: flex;
    justify-content: space-between;
    font-size: 14px;
}
.pre_next {
    color: #ABABAB;
}
.article {
    font-weight: 600;
}
.pre, .next {
    display: flex;
    gap: 8px;
}





.contact_container h1,
.contact_container h2{
    text-align: center;
    font-size: 38px;
}
.contact_container h1 {
    
}
.contact_content {
    display: flex;
    gap: 5%;
    margin-top: 60px;
}
.contact_left {
    width: 30%;
}
.contact_right {
    flex: 1;
}
.contact_content ul {
    display: flex;
    flex-direction: column;
}
.contact_content ul li {
    display: flex;
    border-bottom: 1px solid rgba(235,235,235,1);
    padding: 25px 15px;
    gap: 20px;
}
.contact_content ul li svg {
    fill: #005fa7;
    margin-left: 10px;
}
.contact_content ul li p {
    font-size: 16px;
    line-height: 1.5;
}
.contact_right_remark {
    color: #333;
    font-size: 24px;
    text-align: center;
}
.contact_form {
    margin-top: 30px;
}
.contact_form_item {
    display: flex;
    gap: 20px;
    margin-bottom: 24px;
}
.contact_form_item input,
.contact_form_item textarea {
    padding: 15px;
    flex: 1;
    border: 1px solid rgba(235, 235, 235, 1);
    border-radius: 50px;
}
.contact_form_item button {
    width: 100%;
    background: #005fa7;
    border: 1px solid #005fa7;
    color: #FFF;
    padding: 10px 0;
    border-radius: 50px;
}


.contact_form input[type="text"]:focus,
.contact_form input[type="input"]:focus,
.contact_form textarea:focus {
    border-color: #007bff; /* 聚焦时的科技蓝边框颜色 */
    background-color: #fff;
    /* 增加一个淡蓝色的呼吸外发光阴影，更具高级感 */
    box-shadow: 0 0 8px rgba(0, 123, 255, 0.25), inset 0 1px 3px rgba(0, 0, 0, 0.05);
}





































/* ==========================================================================
   新增：荣誉证书模块样式（PC端默认）
   ========================================================================== */
.cert_section {
    padding-top: 20px; /* 紧跟关于我们，适当微调上方间距 */
}
.cert_list {
    display: flex;
    justify-content: space-between;
    gap: 30px; /* 证书之间的间距 */
    margin-top: 30px;
}
.cert_item {
    flex: 1;
    background: #FFF;
    border: 1px solid #eee;
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.05);
    text-align: center;
    transition: all 0.3s ease;
}
.cert_item:hover .cert_img_box img {
    transform: scale(1.1);
}
.cert_img_box {
    width: 100%;
    height: 320px; /* 固定图片容器高度，防止证书图片原图比例不一致导致排版错乱 */
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fafafa;
}
.cert_img_box img {
    max-width: 100%;
    max-height: 100%;
    transition: all .3s ease;
    object-fit: contain; /* 保证证书按原比例完整显示，不被裁剪 */
    display: block;
}
.cert_item p {
    margin-top: 15px;
    font-size: 16px;
    color: #444;
    font-weight: 500;
}

/* ==========================================================================
   移动端响应式适配
   ========================================================================== */
@media screen and (max-width: 992px) {
    /* 顺便修复一下你原本关于我们模块在Pad/手机端可能会挤压的问题 */
    .about_container {
        flex-direction: column;
        gap: 30px;
    }
    .about_info, .about_img {
        width: 100% !important;
    }
    .contact_content {
        flex-direction: column;
    }
    .contact_left {
        width: 100%;
    }
}

@media screen and (max-width: 768px) {
.product_contact_us{display:none;}
    .cert_list {
        flex-direction: column; /* 手机端由横排变为竖排 */
        gap: 20px;
        padding: 0 15px;
    }
    .cert_item {
        width: 100%;
    }
    .cert_img_box {
        height: 280px; /* 手机端稍微降一下图片容器高度 */
    }
}
/*分页*/
.page_bar {
    margin-top: 20px;
    text-align: center;
}
.page_bar a {
    font-size: 15px;
    margin: 0 8px;
}
.page-num-current {
    color: #005fa7;
}

/* ==================== 底部 Footer 样式 ==================== */

/* 1. 外层大容器背景 */
.site-footer {
    background-color: #005fa7; /* 图片中的经典工业蓝 */
    color: #ffffff;
    padding: 50px 0;
    font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft YaHei", sans-serif;
    font-size: 14px;
}

/* 2. 内部 Flex 水平布局 */
.footer-container {
    max-width: 1520px; /* 页面标准主框宽度，可根据你的项目调整 */
    margin: 0 auto;
    padding: 0 15px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end; /* 底部对齐 */
}
.footer_right {
    display: flex;
    align-items: center;
}
/* 3. 左侧信息栏样式 */
.footer-info {
    flex: 1;
}
.footer-logo img {
    max-height: 40px; /* 控制 Logo 高度 */
    margin-bottom: 20px;
    display: block;
}
.info-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.info-list li {
    margin-bottom: 8px;
    opacity: 0.9; /* 稍微降低文字亮度，贴合工业风 */
    line-height: 1.6;
}

/* 4. 中间导航与版权样式 */
.footer-center {
    text-align: right;
    margin-bottom: 8px; /* 微调与两边对齐线 */
    margin-right: 20px;
}
.footer-nav {
    margin-bottom: 15px;
}
.footer-nav a {
    color: #ffffff;
    text-decoration: none;
    padding: 0 8px;
    border-right: 1px solid rgba(255, 255, 255, 0.6);
}
.footer-nav a:last-child {
    border-right: none; /* 去掉最后一个导航右边的竖线 */
}
.footer-nav a:hover {
    text-decoration: underline;
}
.footer-copyright {
    font-size: 13px;
    padding-right: 8px;
    opacity: 0.8;
}
.footer-copyright a {
    color: #FFF;
}
/* 5. 右侧二维码样式 */
.footer-qrcode {
    flex: 1;
    text-align: right;
}
.footer-qrcode img {
    width: 110px; /* 严格按照比例缩放二维码 */
    height: 110px;
    background: #fff; /* 备用背景白 */
    padding: 5px;
    border-radius: 4px;
    display: inline-block;
}
.footer-qrcode p {
    margin: 10px 0 0 0;
    font-size: 13px;
    text-align: center;
    /* 让文字居中对应二维码的宽度 */
    width: 120px; 
    margin-left: auto; /* 推到最右侧 */
}

/* 6. 响应式适配：手机端自动变成垂直单列 */
@media (max-width: 768px) {
    .footer-container {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 30px;
    }
    .footer-info, .footer-center, .footer-qrcode {
        text-align: center;
    }
    .footer-logo img, .footer-qrcode p {
        margin-left: auto;
        margin-right: auto;
    }
    .footer-nav a {
        display: inline-block;
        margin-bottom: 5px;
    }
}

/* ==========================================================================
   移动端响应式样式 (屏幕小于 768px 自动激活)
   ========================================================================== */
@media screen and (max-width: 768px) {
    /* 头部由两列变为单列上下排列 */
    .pd_head, .pd_head_left, .pd_head_right {
        display: block;
        width: 100%;
    }
    .pd_head_left {
        padding-right: 0;
        margin-bottom: 20px;
    }
    
    /* 调整缩略图间距 */
    .thumb_item {
        width: 23%;
        margin-right: 2.6%;
    }
    
    /* 动作按钮占满屏幕 */
    .pd_actions a {
        display: block;
        text-align: center;
        margin-right: 0;
        margin-bottom: 10px;
    }
    
    /* 相关推荐改平铺或者网格 */
    .pd_other_list, .other_item {
        display: block;
        width: 100%;
        padding: 0;
    }
    .other_item {
        margin-bottom: 20px;
        display: inline-block;
        width: 48%;
    }
    .other_item:nth-child(even) {
        margin-left: 4%;
    }
    
    /* 留言表单满宽 */
    .pd_contact_us {
        padding: 20px 15px;
    }
}
.head_menu_translate,
.head_menu_translate a{
    color: #999;
    font-size: 14px;
}
/* ==========================================================================
   纯增量补丁：完美适配 Pad（iPad/平板）与 Mobile（手机）移动端
   ========================================================================== */

/* --------------------------------------------------------
   一、 针对 1200px 以下屏幕（小屏PC、大平板横屏及通用重置）
   -------------------------------------------------------- */
@media screen and (max-width: 1200px) {
    /* 全局标准容器限宽，留出两侧间距 */
    .head_container, .section, .home_company, .product_detail_container, .product_detail_other {
        max-width: 100% !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

/* --------------------------------------------------------
   二、 针对 992px 以下屏幕（标准 Pad 平板端适配）
   -------------------------------------------------------- */
@media screen and (max-width: 992px) {
    .main_container {
        padding: 0 28px;
    }
    /* 1. 头部及 PC端 ul 隐藏（强制关闭并兼容你原本的 .pc_menu 逻辑） */
    .head_menu_left {
        display: none !important;
    }
    
    /* 2. 关于我们模块：由左右分立变为上下排列 */
    .about_container {
        flex-direction: column !important;
        gap: 30px !important;
    }
    .about_info, .about_img {
        width: 100% !important;
    }
    
    /* 3. 首页公司介绍模块 */
    .home_company_section {
        min-height: auto !important;
        padding: 60px 0 !important;
    }
    .hoem_company_info {
        width: 100% !important;
    }
    .hoem_company_info a {
        margin-top: 40px !important;
    }
    
    /* 4. 核心优势/特点列表网格降维（4列变2列） */
    .corp_list {
        flex-wrap: wrap !important;
        gap: 20px !important;
    }
    .corp_item {
        width: calc((100% - 20px) / 2) !important;
    }
    
    /* 5. 荣誉证书模块列表降维（3列变横向平铺/Pad自适应） */
    .cert_list {
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 20px !important;
    }
    .cert_item {
        flex: none !important;
        width: calc((100% - 20px) / 2) !important;
    }
    
    /* 6. 首页新闻卡片网格降维（3列变上下排列/或2列） */
    .news_list {
        flex-wrap: wrap !important;
        gap: 20px !important;
    }
    .news_item {
        width: 100% !important;
    }
    
    /* 7. 产品中心（左侧边栏布局）变为上下堆叠 */
    .product_container {
        flex-direction: column !important;
    }
    .product_left {
        width: 100% !important;
        position: static !important; /* 取消粘性定位 */
        margin-bottom: 30px !important;
    }
    
    /* 8. 产品列表网格降维（3列变2列） */
    .product_list {
        gap: 20px !important;
    }
    .product_item {
        width: calc((100% - 20px) / 2) !important;
    }
    
    /* 9. 案例中心列表降维（3列变2列） */
    .case_list {
        gap: 20px !important;
    }
    .case_item {
        width: calc((100% - 20px) / 2) !important;
    }
    
    /* 10. 联系我们页面布局上下堆叠 */
    .contact_content {
        flex-direction: column !important;
        gap: 40px !important;
    }
    .contact_left, .contact_right {
        width: 100% !important;
    }
    
    /* 11. 新闻列表页（左右布局）上下堆叠 */
    .newslist_container {
        flex-direction: column !important;
        gap: 40px !important;
    }
    .newslist_left, .newslist_right {
        width: 100% !important;
    }
    
    /* 12. 首页单品幻灯展示区域调整 */
    .home_product_item {
        flex-direction: column !important;
        text-align: center !important;
    }
    .product_info, .product_img {
        width: 100% !important;
    }
    .product_img {
        margin-top: 30px !important;
    }
    .product-control-bar {
        flex-direction: column !important;
        gap: 20px !important;
    }
    .nav-buttons {
        margin-right: 0 !important;
    }
}

/* ==========================================================================
   新增：移动端（汉堡按钮与菜单遮罩）纯增量动画样式
   ========================================================================== */
@media (max-width: 992px) {
    /* 1. 修正和优化汉堡按钮点击状态下的三条线变叉动画 */
    .m_menu_btn {
        display: flex !important;
        flex-direction: column;
        justify-content: space-between;
        width: 26px !important;
        height: 20px !important;
        position: relative;
        z-index: 1001; /* 保证在遮罩层上方 */
    }
    .m_menu_btn span {
        display: block !important;
        width: 100%;
        height: 2px !important; /* 稍微细一点，更显高级精细 */
        background-color: #333 !important;
        margin-bottom: 0 !important; /* 清除你之前的 margin 干扰 */
        transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    }

    /* 当 JS 触发父级或者自身带有 open 类名时的三条线变换 */
    .m_menu_btn.open span:nth-child(1) {
        transform: translateY(9px) rotate(45deg) !important;
    }
    .m_menu_btn.open span:nth-child(2) {
        opacity: 0 !important;
        transform: translateX(-10px) !important;
    }
    .m_menu_btn.open span:nth-child(3) {
        transform: translateY(-9px) rotate(-45deg) !important;
    }

    /* 2. 移动端抽屉菜单包裹层（重新定义为右侧滑出，体验更好） */
    .m_menu_wrap {
        display: block !important; /* 强制覆盖原本的 display: none */
        position: fixed !important; /* 改为固定定位，防止页面滚动穿透 */
        top: 0 !important;
        right: 0 !important;
        width: 100vw !important; /* 侧边抽屉宽度 */
        height: 100vh !important; /* 满高 */
        background: #ffffff !important;
        box-shadow: -5px 0 25px rgba(0,0,0,0.15) !important;
        z-index: 1000 !important;
        padding: 70px 20px 30px 20px !important; /* 顶部留出关闭按钮空间 */
        
        /* 核心动画状态：默认往右侧隐藏 100% */
        transform: translateX(100%) !important;
        visibility: hidden !important;
        transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), visibility 0.4s !important;
    }

    /* 当展开菜单时（添加了 .open 类名） */
    .m_menu_wrap.open {
        transform: translateX(0) !important; /* 滑入舞台 */
        visibility: visible !important;
    }

    /* 3. 关闭按钮样式调整 */
    .m_menu_close {
        position: absolute !important;
        top: 20px !important;
        right: 20px !important;
        font-size: 30px !important;
        color: #999 !important;
        cursor: pointer !important;
        line-height: 1 !important;
        transition: color 0.3s ease !important;
    }
    .m_menu_close:hover {
        color: #0261AD !important;
    }

    /* 4. 菜单内部链接列表美化 */
    .m_menu_links {
        display: flex !important;
        flex-direction: column !important;
        gap: 5px !important;
    }
    .m_menu_links a {
        display: block !important;
        padding: 14px 15px !important;
        color: #333333 !important;
        font-size: 15px !important;
        text-decoration: none !important;
        border-bottom: 1px solid #f5f5f5 !important; /* 淡淡的底边线 */
        border-radius: 6px !important;
        transition: all 0.2s ease !important;
    }
    
    /* 移动端高亮与悬浮状态（红字改蓝字，契合企业色） */
    .m_menu_links a:hover,
    .m_menu_links a.active {
        color: #0261AD !important; /* 覆盖之前的 color: #ff0000 */
        background-color: #f4f7f6 !important;
        font-weight: 500 !important;
        padding-left: 20px !important; /* 点中时微微右移的交互细节 */
    }
}
/* --------------------------------------------------------
   三、 针对 768px 以下屏幕（精准 Mobile 手机端适配）
   -------------------------------------------------------- */
@media screen and (max-width: 768px) {
    /* 1. 块级内边距整体收缩，防止手机端上下留白过大 */
    .section {
        padding: 40px 0 !important;
    }
    
    /* 2. 网页大标题文字缩放 */
    .banner_content h1, .banner_content h2 {
        font-size: 28px !important;
    }
    .banner_content h3 {
        font-size: 16px !important;
    }
    .hoem_company_info h1 {
        font-size: 26px !important;
        margin-bottom: 20px !important;
    }
    
    /* 3. 公司核心优势改为单列满宽 */
    .corp_item {
        width: 100% !important;
        padding: 20px !important;
    }
    
    /* 4. 荣誉证书改为单列满宽并调小容器高度 */
    .cert_item {
        width: 100% !important;
    }
    .cert_img_box {
        height: 260px !important;
    }
    
    /* 5. 首页手风琴画册效果在手机端改为上下自然堆叠流程 */
    .home_sample_list {
        flex-direction: column !important;
        height: auto !important;
        gap: 15px !important;
    }
    .home_sample_item {
        width: 100% !important;
        height: 200px !important;
        flex: none !important;
    }
    .home_sample_list:hover .home_sample_item,
    .home_sample_list .home_sample_item:hover {
        flex: none !important;
    }
    
    /* 6. 产品中心列表改为纯单列，更适合手机阅读 */
    .product_item {
        width: 100% !important;
    }
    
    /* 7. 案例列表改为纯单列 */
    .case_item {
        width: 100% !important;
    }
    .case_img img {
        height: 180px !important;
    }
    
    /* 8. 新闻列表页内的图文排版改为上下结构 */
    .newslist_item_content {
        flex-direction: column !important;
    }
    .newslist_img {
        width: 100% !important;
        margin-bottom: 15px !important;
    }
    .newslist_content {
        padding-left: 0 !important;
    }
    
    /* 9. 联系我们表单项在手机端强制合并为单列 */
    .contact_form_item {
        flex-direction: column !important;
        gap: 15px !important;
    }
    
    /* 10. 页头移动端多语言栏在遮罩层展开后的排版补丁 */
    .m_menu_links {
        padding: 20px 0 !important;
    }
}