/* 重置默认样式 */

* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}



body {

    font-family: Arial, sans-serif;

    line-height: 1.6;

}



/* 顶部导航栏样式 */

header {

    background: white;

    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);

    position: fixed;

    width: 100%;

    top: 0;

    z-index: 1000;

    border-top: 10px solid #79BDB0;

    /* 添加顶部绿色横线 */

}



.header-container {

    max-width: 1470px;

    margin: 0 auto;

    display: flex;

    justify-content: space-between;

    align-items: center;

}



.logo img {

    height: 100px;

    /* 调整logo大小 */

}



nav ul {

    display: flex;

    list-style: none;

}



nav ul li {

    margin: 0 20px;

}



nav ul li a {

    text-decoration: none;

    color: #666;

    font-size: 16px;

    text-transform: uppercase;

    transition: color 0.3s ease;

}



nav ul li a:hover {

    color: #79BDB0;

}



.language-select {

    margin-left: 20px;

}



.language-select a {

    color: #79BDB0;

    text-decoration: none;

    font-size: 14px;

    text-transform: uppercase;

}



/* 主横幅区域样式 */

.hero {

    margin-top: 70px;

    position: relative;

    width: 100%;

    overflow: hidden;

}



.hero-slider {

    width: 100%;

    height: 650px;

    position: relative;

}



.hero-slide {

    width: 100%;

    height: 100%;

    position: absolute;

    top: 0;

    left: 0;

    opacity: 0;

    transition: opacity 0.5s ease;

}



.hero-slide.active {

    opacity: 1;

}



.hero-slide img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.slide-content {

    position: absolute;

    bottom: 0;

    left: 0;

    right: 0;

    background-color: rgba(121, 189, 176, 0.8);

    /* #79BDB0 with 80% opacity */

    padding: 20px 12.5%;

    color: #fff;

}



.slide-content h2 {

    font-size: 2em;

    /* 从之前的2.5em调整为2em */

    margin-bottom: 0.5em;

    font-weight: 500;

    /* 添加适当的字重 */

}



.slide-content p {

    font-size: 1.2em;

    margin-bottom: 0;

}



.slider-dots {

    position: absolute;

    bottom: 20px;

    left: 50%;

    transform: translateX(-50%);

    display: flex;

    gap: 10px;

    z-index: 2;

}



.dot {

    width: 12px;

    height: 12px;

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.5);

    cursor: pointer;

    transition: background 0.3s ease;

}



.dot.active {

    background: #fff;

}



/* 响应式调整 */

@media (max-width: 768px) {

    .hero-slider {

        height: 60vh;

        min-height: 300px;

    }

}



.hero-content {

    max-width: 100%;

    position: relative;

}



.hero-text {

    position: absolute;

    left: 10%;

    top: 50%;

    transform: translateY(-50%);

    z-index: 2;

    color: #fff;

    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);

}



.hero-text h1 {

    font-size: 48px;

    margin-bottom: 20px;

}



.hero-text p {

    font-size: 24px;

    line-height: 1.5;

}



.hero-image {

    width: 100%;

}



.hero-image img {

    width: 100%;

    height: auto;

    display: block;

}



/* 响应式调整 */

@media (max-width: 768px) {

    .hero-text {

        left: 5%;

        text-align: left;

    }



    .hero-text h1 {

        font-size: 32px;

    }



    .hero-text p {

        font-size: 18px;

    }

}



.hero-content {

    max-width: 1470px;

    margin: 0 auto;

    display: flex;

    align-items: center;

}



.hero-text {

    flex: 1;

    padding: 0 30px;

}



.hero-text h1 {

    font-size: 36px;

    /* 调整标题大小 */

    color: #333;

    margin-bottom: 10px;

}



.hero-text p {

    color: #666;

    font-size: 16px;

    line-height: 1.8;

}



.hero-image {

    flex: 2;

}



.hero-image img {

    width: 100%;

    max-width: 800px;

}



/* 展会信息区域样式 */

.exhibitions {

    padding: 30px 0;

    background: #fff;

}



.exhibition-container {

    max-width: 1470px;

    margin: 0 auto;

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 30px;

}



.exhibition-card {

    background: #fff;

    border: 1px solid #eee;

    border-radius: 5px;

    overflow: hidden;

    transition: transform 0.3s ease, box-shadow 0.3s ease;

}



.exhibition-card:hover {

    transform: translateY(-5px);

    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);

}



.exhibition-card img {

    width: 100%;

    height: 200px;

    object-fit: cover;

    border-bottom: 1px solid #eee;

}



.exhibition-info {

    padding: 20px;

}



.exhibition-info h3 {

    font-size: 18px;

    color: #333;

    margin-bottom: 15px;

    font-weight: 600;

}



.exhibition-info p {

    color: #666;

    margin: 8px 0;

    font-size: 14px;

    line-height: 1.6;

}



/* 响应式调整 */

@media (max-width: 1024px) {

    .exhibition-container {

        grid-template-columns: repeat(2, 1fr);

    }

}



@media (max-width: 768px) {

    .exhibition-container {

        grid-template-columns: 1fr;

    }

}



/* 公司介绍区域样式 */

.company-intro {

    padding: 50px 0;

    background: #f9f9f9;

}



.intro-container {

    max-width: 1470px;

    margin: 0 auto;

    display: flex;

    gap: 30px;

}



.intro-image {

    flex: 1;

}



.intro-image img {

    width: 100%;

    height: 255px;

}



.intro-text {

    flex: 1;

    padding: 10px 0;

}



.intro-slider {

    position: relative;

    width: 100%;

    overflow: hidden;

}



.intro-slide {

    display: none;

}



.intro-slide.active {

    display: block;

}



.intro-slide {

    position: relative;

    overflow: hidden;

    /* 确保放大效果不会溢出容器 */

}



.intro-slide img {

    width: 100%;

    height: 253px;

    display: block;

    transition: transform 0.3s ease;

    /* 添加平滑过渡效果 */

}



.intro-slide:hover img {

    transform: scale(1.1);

    /* 鼠标悬停时图片放大1.1倍 */

}



/* 确保文字在图片放大时保持不变 */

.intro-slide .intro-text {

    position: relative;

    z-index: 2;

    /* 确保文字始终在图片上层 */

}



.intro-nav {

    position: absolute;

    top: 50%;

    left: 0;

    right: 0;

    transform: translateY(-50%);

    display: flex;

    justify-content: space-between;

    padding: 0 20px;

}



.intro-nav button {

    background: rgba(121, 189, 176, 0.8);

    border: none;

    color: white;

    padding: 10px 15px;

    cursor: pointer;

    font-size: 18px;

    border-radius: 4px;

    transition: background-color 0.3s;

}



.intro-nav button:hover {

    background: rgba(121, 189, 176, 1);

}



.intro-slider-dots {

    bottom: 20px;

    left: 0;

    right: 0;

    text-align: center;

    z-index: 2;

}



.intro-dot {

    display: inline-block;

    width: 10px;

    height: 10px;

    margin: 0 5px;

    background: #ddd;

    border-radius: 50%;

    cursor: pointer;

    transition: background-color 0.3s;

}



.intro-dot.active {

    background: #79BDB0;

}



/* 产品类型选择区域样式 */

.machine-types {

    padding: 50px 0;

    background: #fff;

}



.machine-types h2,

.history-content h2,

.e-catalog h2,

.news-section h2,

.video-section h2 {

    font-size: 24px;

    color: #333;

    text-align: center;

    margin-bottom: 40px;

    text-transform: uppercase;

}



.machine-grid {

    max-width: 1470px;

    margin: 0 auto;

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

    gap: 30px;

}



.machine-card {

    border: 1px solid #ccc;

    transition: transform 0.3s ease, background-color 0.3s ease;

    /* 添加背景色过渡效果 */

    background: #eee;

    height: 132px;

    cursor: pointer;

}



.machine-card:hover {

    transform: translateY(-5px);

    background-color: #79BDB0;

    /* 悬停时改变背景色 */

}



.machine-card img {

    float: left;

}



.machine-card h3 {

    width: 55%;

    font-size: 16px;

    font-weight: 400;

    color: #333;

    float: right;

    margin-top: 10%;

    transition: color 0.3s ease;

    /* 添加文字颜色过渡效果 */

}



.machine-card:hover h3 {

    color: #fff;

    /* 悬停时改变文字颜色为白色 */

}



.machine-card:hover {

    transform: translateY(-5px);

}



.machine-card img {

    float: left;

}



/* 页脚样式 */

footer {

    background: #1a1a1a;

    color: #999;

    /* 调整文字颜色 */

    padding: 40px 0 20px;

}



.footer-container {

    max-width: 1470px;

    margin: 0 auto;

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

}



.footer-logo img {

    height: 60px;

    margin-bottom: 10px;

}



.footer-info {

    margin-bottom: 20px;

}



.footer-contact {

    margin-bottom: 20px;

}



.footer-contact p {

    margin: 5px 0;

}



.footer-links {

    display: flex;

    justify-content: space-between;

    width: 200px;

    float: right;

}



.footer-nav {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 10px;

}



.footer-nav a {

    color: #999;

    text-decoration: none;

    margin-left: 30px;

    transition: color 0.3s ease;

    padding: 5px 0;

}



.footer-nav a:hover {

    color: #79BDB0;

}



@media (max-width: 768px) {

    .footer-container {

        flex-direction: column;

        gap: 20px;

    }

    

    .footer-nav {

        grid-template-columns: 1fr;

    }

}



.copyright {

    text-align: center;

    padding-top: 20px;

    border-top: 1px solid #333;

    margin-top: 30px;

    font-size: 12px;

    color: #666;

}



/* 响应式设计 */

@media (max-width: 768px) {

    .header-container {

        flex-direction: column;

        text-align: center;

    }



    nav ul {

        flex-direction: column;

        margin: 20px 0;

    }



    nav ul li {

        margin: 10px 0;

    }



    .hero-content {

        flex-direction: column;

        text-align: center;

    }



    .exhibition-container {

        flex-direction: column;

    }



    .intro-container {

        flex-direction: column;

    }



    .footer-links {

        flex-direction: column;

        text-align: center;

    }



    .footer-nav a {

        display: block;

        margin: 10px 0;

    }

}





/* 页面标题区域样式 */

.page-header {

    background-size: cover;

    background-position: center;

    height: 300px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: white;

    padding: 60px 0;

    text-align: center;

    position: relative;

    margin-top: 120px;

}



.page-header h1 {

    font-size: 48px;

    text-transform: uppercase;

}



.breadcrumb_box {

    background: #79BDB0;

    width: 100%;

    position: absolute;

    bottom: 0;

}



.breadcrumb {

    font-size: 14px;

    color: #fff;

    display: inline-block;

    width: 1470px;

    height: 40px;

    line-height: 40px;

    text-align: left;

}



.breadcrumb a {

    color: #fff;

    text-decoration: none;

    transition: color 0.3s ease;

}



.breadcrumb a:hover {

    color: #fff;

}



.breadcrumb .separator {

    margin: 0 10px;

    color: rgba(255, 255, 255, 0.7);

}



/* 电子目录区域样式 */

.e-catalog {

    padding: 50px 0;

}



.catalog-grid {

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

    gap: 30px;

    max-width: 1470px;

    margin: 0 auto;

    padding: 0;

}



.catalog-item {

    text-align: center;

    padding: 20px;

    border: 1px solid #eee;

    border-radius: 5px;

    transition: transform 0.3s ease;

}



.catalog-item:hover {

    transform: translateY(-5px);

    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);

}



.download-btn {

    display: inline-block;

    padding: 10px 20px;

    background: #1a1a1a;

    color: white;

    text-decoration: none;

    border-radius: 5px;

    margin-top: 15px;

    transition: background 0.3s ease;

}



.download-btn:hover {

    background: #333;

}



/* 公司历史样式 */

.company-history {

    padding: 50px 0;

    background: #f9f9f9;

}



.history-content {

    max-width: 1470px;

    margin: 0 auto;

    padding: 0;

}



.history-content p,

.history-content span {

    max-width: 1470px;

    text-wrap: auto !important;

}



/* 响应式调整 */

@media (max-width: 768px) {

    .timeline::before {

        left: 20px;

    }



    .timeline-item {

        flex-direction: column;

        align-items: flex-start;

        padding-left: 40px;

    }



    .timeline-item .year {

        margin-bottom: 10px;

    }



    .catalog-grid {

        grid-template-columns: 1fr;

    }

}





/* 联系表单页面样式 */



.contact-form-section {

    padding: 50px 0;

}



.form-intro {

    text-align: center;

    margin-bottom: 30px;

}



.contact-content {

    display: flex;

    gap: 30px;

    max-width: 1470px;

    margin: 0 auto;

    padding: 0;

}



.contact-info {

    flex: 1;

    padding: 20px;

    background: #f5f5f5;

    border-radius: 5px;

}



.contact-info p {

    margin-top: 10px;

}



.form-container {

    width: 65%;

    background: #fff;

    padding: 30px;

    border-radius: 8px;

    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);

}



.form-group {

    margin-bottom: 20px;

}



.form-group label {

    display: block;

    margin-bottom: 8px;

    color: #333;

}



.form-group input,

.form-group textarea {

    width: 100%;

    padding: 10px;

    border: 1px solid #ddd;

    border-radius: 4px;

    transition: border-color 0.3s ease;

}



.form-group input:focus,

.form-group textarea:focus {

    border-color: #79BDB0;

    outline: none;

}



.form-group textarea {

    height: 150px;

    resize: vertical;

}



.form-buttons {

    display: flex;

    gap: 15px;

}



.form-buttons button {

    padding: 10px 30px;

    border: none;

    border-radius: 4px;

    cursor: pointer;

    transition: background-color 0.3s ease;

}



.form-buttons button[type="submit"] {

    background: #79BDB0;

    color: white;

}



.form-buttons button[type="reset"] {

    background: #f5f5f5;

    color: #333;

}



.form-buttons button:hover {

    opacity: 0.9;

}



.required-note {

    color: #666;

    margin-bottom: 20px;

    font-size: 14px;

}



/* 视频页面样式 */



.video-section {

    padding: 50px 0;

}



.video-filter {

    text-align: center;

    margin-bottom: 30px;

}



.video-filter select {

    padding: 10px;

    min-width: 300px;

    border: 1px solid #ddd;

    border-radius: 4px;

}



.video-grid {

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

    gap: 30px;

    max-width: 1470px;

    margin: 0 auto;

    padding: 0;

}



.video-item {

    border: 1px solid #eee;

    border-radius: 5px;

    overflow: hidden;

    transition: transform 0.3s ease;

}



.video-item:hover {

    transform: translateY(-5px);

    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);

}



.video-thumbnail img {

    width: 100%;

    height: auto;

}



.video-item h3 {

    padding: 15px;

    margin: 0;

    font-size: 16px;

}



/* 新闻页面样式 */



.exhibition-section {

    padding: 50px 0;

    background: #f9f9f9;

}



.exhibition-slider {

    max-width: 1470px;

    margin: 0 auto;

    padding: 0;

}



.slider-dots {

    text-align: center;

    margin-top: 20px;

}



.dot {

    display: inline-block;

    width: 10px;

    height: 10px;

    background: #ccc;

    border-radius: 50%;

    margin: 0 5px;

    cursor: pointer;

}



.dot.active {

    background: #1a1a1a;

}



.news-section {

    padding: 50px 0;

}



.news-grid {

    display: grid;

    grid-template-columns: 1fr;

    gap: 30px;

    padding: 0;

    width: 1470px;

    margin: 0 auto;

}



.news-item {

    display: block;

    /* 将a标签改为块级元素 */

    text-decoration: none;

    /* 移除下划线 */

    color: inherit;

    /* 继承父元素的文字颜色 */

    background: #fff;

    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);

    transition: transform 0.3s ease;

}



.news-item article {

    display: flex;

    /* 保持左右布局 */

}



.news-item:hover {

    transform: translateY(-5px);

}



.news-item img {

    width: 300px;

    object-fit: cover;

}



.news-item .news-content {

    flex: 1;

    padding: 20px;

}



.news-item h3 {

    font-size: 18px;

    color: #333;

    margin-bottom: 10px;

    transition: color 0.3s ease;

}



.news-item:hover h3 {

    color: #79BDB0;

}



.news-item p {

    color: #666;

    font-size: 14px;

    line-height: 1.6;

}



/* 响应式调整 */

@media (max-width: 768px) {

    .contact-content {

        flex-direction: column;

    }



    .video-filter select {

        width: 100%;

        min-width: auto;

    }



    .form-buttons {

        flex-direction: column;

    }



    .form-buttons button {

        width: 100%;

    }

}



.product-list {

    padding: 20px 0;

    max-width: 1470px;

    margin: 0 auto;

}



.product-grid {

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

    gap: 20px;

    margin-top: 20px;

}



.product-card {

    background: #fff;

    border-radius: 8px;

    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);

    overflow: hidden;

    transition: transform 0.3s ease;

    max-width: 278px;

}



.product-card:hover {

    transform: translateY(-5px);

}



.product-card a {

    text-decoration: none;

}



.product-card img {

    width: 100%;

    height: 200px;

    object-fit: cover;

}



.product-card h3 {

    font-size: 18px;

    color: #333;

    padding: 15px 15px 0;

    margin: 0;

}



.product-card p {

    font-size: 14px;

    color: #666;

    padding: 10px 15px 15px;

    margin: 0;

    line-height: 1.5;

}



@media (max-width: 768px) {

    .product-grid {

        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

    }

}



/* 分页 */

.pagination {

    display: flex;

    justify-content: center;

    align-items: center;

    margin: 30px 0;

    gap: 3px;

}



.pagination a {

    display: inline-block;

    padding: 6px 10px;

    color: #666;

    text-decoration: none;

    border: 1px solid #ddd;

    font-size: 13px;

    min-width: 32px;

    text-align: center;

    transition: all 0.3s ease;

}



.pagination a:hover,

.pagination a.active {

    color: #fff;

    background: #79BDB0;

    border-color: #79BDB0;

}



.pagination .page-info {

    margin-left: 8px;

    color: #999;

    font-size: 13px;

}



/* 文章导航样式 */

.article-nav {

    margin-top: 30px;

    padding-top: 20px;

    border-top: 1px solid #eee;

}



.prev-article,

.next-article {

    margin: 10px 0;

    font-size: 14px;

    color: #666;

}



.nav-label {

    color: #333;

    margin-right: 10px;

}



.article-nav a {

    color: #666;

    text-decoration: none;

    transition: color 0.3s ease;

}



.article-nav a:hover {

    color: #BA0511;

    text-decoration: underline;

}