/*---------------(导航栏----------------------------------------------*/
.hd{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1200px;
    margin: 0 auto;
}
/* 1. 图片不超出屏幕 */
.logo img {
    width: 160px;
    height: auto;
    display: block;
}

/* 2. 所有盒子不溢出 */
* {
    box-sizing: border-box;
    max-width: 100%;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Microsoft Yahei", sans-serif;
}
/* 导航栏 */
header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    box-shadow: 0 1px 5px rgba(0,0,0,0.1);
    position: fixed; /* 为下拉菜单定位做准备 */
    top: 0;
    width: 1200px;
    margin: 0 auto;
    z-index: 9999;
}
nav {
    display: flex;
    justify-content: center;
}
/* 导航项容器 - 新增 */
.nav-item {
    position: relative;
}
nav a{
    display: inline-block;  /*支持上下内边距 padding，同行排列*/
    padding: 30px 25px;     /*上下内边距 30px，左右 25px*/
    text-decoration: none;
    color: #333;
    background: #fff;
    font-size: 15px;
    white-space: nowrap;
    font-size: clamp(1px, 2vw, 20px);
}
nav a:hover {
    background-color: #005ea8;
    color: white;
}
/* 下拉菜单样式 - 新增 */
.dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    display: none; /* 默认隐藏 */
    flex-direction: column;
    z-index: 999;
    width: 200px; /* 下拉菜单宽度 */
}
.dropdown a {
    padding: 15px 25px;
    border-bottom: 1px solid #f0f0f0;
    white-space: nowrap;
}
/* 悬停显示下拉菜单 - 新增 */
.nav-item:hover .dropdown {
    display: flex;
}
.contact {
    background-color: #005ea8;
    color: white;
    width: 160px;
    padding: 15px 20px;
    align-items: center;
}
.contact .icon {
    margin-right: 10px;
    font-size: 18px;
}

/*-----------------导航栏)--------------------------*/
.lb{
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}
/* 轮播外层 */
.slider {
    margin-top: 100px;
    width: 1200px;
    height: 660px;
    position: relative;
    overflow: hidden;
}

/* 图片容器 */
.slider-wrap {
    width: 100%;
    height: 100%;
    position: relative;
}

/* 每一张图 */
.slider-item {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition: opacity 1s ease; /* 平滑淡入淡出 */
}

/* 显示当前图 */
.slider-item.active {
    opacity: 1;
    z-index: 1;
}

.slider-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

/* 小圆点 */
.dots {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 9;
}

.dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    cursor: pointer;
}

.dot.active {
    background: #005ea8;
}
/* 整个关于我们模块容器 */
.about-section {
    width: 1200px;
    margin: 0 auto;
    padding: 80px 50px;
    background-color: #f9f9f9; /* 浅灰色背景，和原图一致 */
    text-align: center;
}

/* 标题样式 */
.about-title {
    font-size: 36px;
    color: #333;
    margin-bottom: 15px;
    font-weight: normal;
}

/* 副标题/描述文字 */
.about-desc {
    font-size: 14px;
    color: #999;
    margin-bottom: 60px;
    line-height: 1.6;
}

/* 图标菜单容器 - 核心布局 */
.about-menu {
    display: flex;
    justify-content: center; /* 水平居中 */
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
}

/* 单个菜单项 */
.menu-item {
    display: flex;
    flex-direction: column; /* 图标在上，文字在下 */
    align-items: center;
    width: 200px; /* 每个项固定宽度 */
    position: relative; /* 用于做分割线 */
}

/* 分割线 - 每个项右边加竖线（最后一个不加） */
.menu-item:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 20%;
    height: 60%;
    width: 1px;
    background-color: #e0e0e0; /* 浅灰色分割线 */
}

/* 图标样式 */
.menu-icon {
    font-size: 60px; /* 图标大小 */
    color: #666;
    margin-bottom: 20px;

}

/* 文字样式 */
.menu-text{
    font-size: 16px;
    color: #333;
    text-decoration: none;
}
.menu-text:hover {
    background: #005ea8;
    color: #fff;
}
/* 整个模块容器 */
.company-section {
    width: 1200px;
    padding: 80px 50px;
    margin: 0 auto;
    background-color: #f0f0f0;
    /* 背景的斜向线条效果，用伪元素实现 */
    position: relative;
    overflow: hidden;
}

/* 背景装饰线条 */
.company-section::before,
.company-section::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(
            135deg,
            transparent,
            transparent 10px,
            rgba(255,255,255,0.3) 10px,
            rgba(255,255,255,0.3) 20px
    );
    opacity: 0.3;
    z-index: 0;
}

/* 内容容器：左右布局 */
.company-container {
    display: flex;
    align-items: center;
    max-width: 1400px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

/* 左侧文字卡片 */
.text-card {
    background-color: #fff;
    padding: 40px;
    width: 50%;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    position: relative;
    left: 20px;
}

/* 标题样式 */
.text-card h1 {
    color: #3684c9;
    font-size: 32px;
    margin-bottom: 8px;
}

.text-card .en-title {
    color: #3684c9;
    font-size: 14px;
    margin-bottom: 25px;
    opacity: 0.8;
}

/* 正文描述 */
.text-card p {
    color: #555;
    font-size: 15px;
    line-height: 1.8;
    margin-bottom: 30px;
}

/* 了解详情按钮 */
.detail-btn {
    display: block;
    margin-left: auto;
    padding: 8px 20px;
    border: 1px solid #3684c9;
    background-color: #fff;
    color: #3684c9;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.detail-btn:hover {
    background-color: #3684c9;
    color: #fff;
}

/* 右侧图片 */
.image-card {
    width: 55%;
    height: 450px;
    position: relative;
    right: 20px;
}

.image-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* 产品展示模块容器 */
.product-section {
    width: 1200px;
    padding: 80px 50px;
    margin: 0 auto;
    background-color: #f9f9f9;
    text-align: center;
}

/* 标题样式 */
.product-title {
    font-size: 36px;
    color: #333;
    margin-bottom: 15px;
    font-weight: normal;
}

/* 副标题/描述文字 */
.product-desc {
    font-size: 14px;
    color: #999;
    margin-bottom: 50px;
    line-height: 1.6;
}

/* 产品卡片容器 - 核心布局 */
.product-list {
    display: flex;
    justify-content: center; /* 水平居中 */
    gap: 20px; /* 卡片之间的间距 */
    flex-wrap: wrap; /* 适配小屏幕自动换行 */
    max-width: 1400px;
    margin: 0 auto;
}

/* 单个产品卡片 */
.product-card {
    width: 320px; /* 卡片宽度，和原图匹配 */
    background-color: #fff;
    border: 1px solid #e0e0e0; /* 浅灰色边框 */
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
}

/* 产品系列标题栏 */
.card-header {
    width: 100%;
    background-color: #f5f5f5;
    padding: 15px 0;
    border-bottom: 1px solid #e0e0e0;
}

.card-header h3 {
    font-size: 20px;
    color: #333;
    font-weight: normal;
}

/* 产品图片区域 */
.card-img {
    width: 100%;
    height: 300px; /* 图片区域高度 */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.card-img img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain; /* 保证图片不变形 */
}

/* 了解详细按钮 */
.card-btn {
    margin: 20px 0;
    padding: 6px 15px;
    border: 1px solid #333;
    background-color: #fff;
    color: #333;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.card-btn:hover {
    background-color: #333;
    color: #fff;
}
/* 公司动态模块容器 */
.news-section {
    width: 1200px;
    padding: 80px 50px;
    margin: 0 auto;
    background-color: #f9f9f9;
}

/* 标题样式 */
.news-title {
    font-size: 36px;
    color: #333;
    text-align: center;
    margin-bottom: 50px;
    font-weight: normal;
}

/* 核心布局：左侧大图+右侧列表 */
.news-container {
    display: flex;
    max-width: 1200px;
    margin: 0 auto;
    gap: 20px; /* 左右区域间距 */
}

/* 左侧重点新闻卡片 */
.news-main {
    display: flex;
    width: 50%;
}

/* 左侧新闻图片 */
.news-img {
    width: 45%;
}
.news-img img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 图片不变形 */
}

/* 左侧新闻文字内容 */
.news-text {
    width: 55%;
    padding: 15px;
    background-color: #f0f0f0;
}
.news-text h3 {
    font-size: 16px;
    color: #333;
    margin-bottom: 10px;
    font-weight: normal;
}
.news-text .date {
    font-size: 12px;
    color: #999;
    margin-bottom: 15px;
}
.news-text p {
    font-size: 13px;
    color: #666;
    line-height: 1.6;
    margin-bottom: 15px;
}
.news-text .more {
    font-size: 12px;
    color: #e63946; /* 红色MORE */
    text-decoration: none;
}

/* 右侧新闻列表 */
.news-list {
    width: 50%;
    display: flex;
    flex-direction: column;
    gap: 10px; /* 列表项间距 */
}

/* 单个列表项 */
.news-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    border: 1px solid #e0e0e0;
    background-color: #fff;
}
.news-item .title {
    font-size: 14px;
    color: #333;
}
/* 日期样式：大号数字+小号年份 */
.news-item .date-box {
    text-align: right;
}
.news-item .day {
    font-size: 28px;
    color: #999;
    line-height: 1;
}
.news-item .year {
    font-size: 12px;
    color: #999;
}
/*---------------------------------------(页脚---------------------------------*/
/* 页脚容器 - 核心样式 */
.ft{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1200px;
    margin: 0 auto;
}
footer {
    width: 1200px;
    background-color: #222; /* 深灰色背景，和原图一致 */
    color: #ccc; /* 浅灰色文字 */
    padding: 50px 80px 20px;
    margin: 0 auto;
}

/* 页脚内容布局 */
.footer-content {
    display: flex;
    justify-content: space-between; /* 左右分布 */
    align-items: flex-start;
    max-width: 1400px;
    margin: 0 auto;
    padding-bottom: 30px;
    border-bottom: 1px solid #333; /* 分割线 */
}

/* 左侧导航列容器 */
.footer-nav {
    display: flex;
    gap: 100px; /* 列之间的间距，和原图匹配 */
}

/* 单个导航列 */
.nav-column {
    display: flex;
    flex-direction: column;
    gap: 12px; /* 每行文字间距 */
    padding: 0;
    margin: 5px 0;
}

/* 导航列标题 */
.nav-column h4 {
    font-size: 16px;
    color: #fff; /* 白色标题 */
    font-weight: normal;
    margin-bottom: 8px;
}

/* 导航列链接/文字 */
.nav-column a {
    font-size: 14px;
    color: #ccc;
    text-decoration: none; /* 去掉下划线 */
    transition: color 0.2s ease;
}

.nav-column a:hover {
    color: #fff; /* 悬浮变白 */
}

/* 右侧联系信息区域 */
.footer-contact {
    display: flex;
    align-items: center;
    gap: 40px; /* 二维码和文字间距 */
    position: relative;
}

/* 分隔竖线（二维码左侧） */
.footer-contact::before {
    content: "";
    position: absolute;
    left: -20px;
    top: 0;
    height: 100%;
    width: 1px;
    background-color: #333;
}

/* 二维码样式 */
.qrcode {
    text-align: center;
}
.qrcode img {
    width: 120px;
    height: 120px;
    margin-bottom: 5px;
}
.qrcode p {
    font-size: 12px;
    color: #ccc;
}

/* 联系信息文字 */
.contact-text {
    font-size: 14px;
    line-height: 1.8;
}
.contact-text p {
    margin-bottom: 5px;
}

/* 版权信息区域 */
.footer-copyright {
    max-width: 1400px;
    margin: 20px auto 0;
    font-size: 12px;
    color: #999;
    line-height: 1.8;
}
/* 核心修改：版权区链接改为白色 */
.footer-copyright a {
    color: #999; /* 纯白色 */
    text-decoration: none; /* 去掉下划线，可选 */
}
.footer-copyright a:hover {
    color: #eeeeee; /* 悬浮浅白，可选 */
}
/* 底部备案号 */
.footer-beian {
    max-width: 1400px;
    margin: 10px auto 0;
    font-size: 12px;
    color: #999;
    text-align: center;
    padding-bottom: 10px;
}
/* 核心修改：备案号链接改为白色 */
.footer-beian a {
    color: #999; /* 纯白色 */
    text-decoration: none; /* 去掉下划线，可选 */
}
.footer-beian a:hover {
    color: #eeeeee; /* 悬浮浅白，可选 */
}
/*----------------------------------页脚)---------------------------------*/