@font-face {

    font-family: "Noto Sans SC";

    src: url("../font/font3/Noto Sans SC.woff2") format("woff2"),

        url("../font/font3/Noto Sans SC.woff") format("woff"),

        url("../font/font3/Noto Sans SC.ttf") format("truetype");

    font-weight: 400;

    font-style: normal;

    font-display: swap;

}



body,

p,

h1,

h2,

h3,

h4,

h5,

h6,

ul,

li,

figure,

figcaption {

    margin: 0;

    padding: 0;

    font-style: normal;

    font-family: "Noto Sans SC", "Microsoft YaHei", Arial, sans-serif;

    color: #333;

    font-size: 14px;

    font-weight: normal;

}



body {

    overflow-x: hidden;

    background-color: #fff;

}



label {

    max-width: inherit

}



:root {

    --color-primary: #cbad76;

}



.h-100 {

    height: 100%;

}



tr,

td,

dd,

dl,

dt {

    margin: 0;

    padding: 0

}



img {

    border: none;

    vertical-align: middle;

}



a {

    text-decoration: none;

    color: #999;

}



a:hover {

    text-decoration: none;

}



ul,

li {

    list-style: none

}



input {

    outline: none;

}



.clearfix:after {

    content: ".";

    display: block;

    height: 0;

    clear: both;

    visibility: hidden;

}



.fl {

    float: left;

}



.fr {

    float: right;

}





.banner {

    position: relative;

}



.banner .mySwiper .swiper-slide {

    height: 450px;

    position: relative;

    overflow: hidden;

}



.banner .mySwiper .swiper-slide .items {

    /* background-size: cover;

    background-position: center center;

    background-repeat: no-repeat; */

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    z-index: 0;

}


.banner .mySwiper .swiper-slide .items img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.pcImage{
    display: block;
}
.moblieImage{
    display: none;
}
.banner .mySwiper .swiper-slide .swiperBox {

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: flex-start;

}



.banner .shuzi {

    position: absolute;

    bottom: 10px;

    width: 100%;

    z-index: 22;

    text-align: right;

    pointer-events: none;

}



.banner .shuzi span {

    font-size: 14px;

    color: #fff;

    font-weight: 200;

}



.swiperBox h2 {

    margin-bottom: 10px;

    display: flex;

    align-items: center;

    gap: 35px;

    margin-top: 30px;

}



.swiperBox h2 span {

    font-size: 15px;

    color: #fff;

    font-weight: 200;

}



.swiperBox p {

    font-size: 18px;

    color: #fff;

}



.swiperBox .line {

    width: 160px;

    height: 1px;

    background-color: #fff;

    animation: lineScale 2s ease-in-out infinite alternate;

}



@keyframes lineScale {

    from {

        width: 0;

    }



    to {

        width: 160px;

    }

}



.banner .swiper-pagination-bullet {

    background: transparent;

    border: 1px solid #fff;

    opacity: 1;

    border-radius: 30px;

    width: 14px;

    height: 14px;

    margin: 0 10px !important;

}



.banner .swiper-pagination-bullet-active {

    background-color: #fff

}



.banner .swiper-button-next:after,

.banner .swiper-button-prev:after {

    font-size: 36px;

    color: rgba(255, 255, 255, 0.5)

}



.banner .swiper-button-next:hover,

.banner .swiper-button-prev:hover {

    color: rgba(255, 255, 255, 1)

}



.banner .swiper-slide.swiper-slide-active .scaleBg {

    -webkit-animation: scale-bg 6s linear forwards;

    animation: scale-bg 6s linear forwards;

}





@keyframes scale-bg {

    from {

        -webkit-transform: scale(1.2);

        transform: scale(1.2);

    }



    to {

        -webkit-transform: scale(1);

        transform: scale(1);

    }

}



@-webkit-keyframes scale-bg {

    from {

        -webkit-transform: scale(1.2);

        transform: scale(1.2);

    }



    to {

        -webkit-transform: scale(1);

        transform: scale(1);

    }

}



.button-container {

    display: flex;

    gap: 40px;

    align-items: center;

    margin-top: 20px;

}



/* 基础链接按钮样式 */

.custom-btn {

    display: inline-block;

    padding: 8px 20px;

    font-size: 14px;

    text-align: center;

    cursor: pointer;

    transition: all 0.3s ease;

    color: #ffffff;

    border: 1px solid #ffffff;

}



/* 第一个按钮：白底黑字，带hover效果 */

.custom-btn:hover {

    background-color: #ffffff;

    color: #333333;

}



/* 头部 */

.header {

    position: fixed;

    width: 100%;

    top: 0;

    z-index: 66;

    box-sizing: border-box;

    transition: all 0.3s ease-in-out;

    -webkit-transition: all 0.3s ease-in-out;

}



.header.headerShow {

    background-color: #fff;

    box-shadow: 0px 0px 11px 6px rgba(0, 0, 0, 0.03);

}



.header.headerShow .language .value svg,

.header.headerShow .nav li a {

    color: #333;

}



.header.headerShow .language i {

    background-image: url(../images/jiantou.png);

}



.header .headerflex {

    display: flex;

    align-items: center;

    justify-content: space-between;

}



.header .navflex {

    display: flex;

    align-items: center;

}



.header h1 img {

    margin: 17px 0;

    height: 34px;

}



.nav>ul>li.active>a,

.nav>ul>li>a:active,

.nav>ul>li>a:hover {

    color: var(--color-primary) !important;

}



.nav li {

    float: left;

    display: block;

    position: relative;

}



.nav li a {

    display: block;

    position: relative;

    font-size: 18px;

    color: #fff;

}



.nav>ul>li>a {

    margin-right: 20px;

}



.nav a.hov {

    color: var(--color-primary);

    position: relative;

    z-index: 10;

}







.language {

    display: flex;

    align-items: center;

    cursor: pointer;

    position: relative;

}



.language i {

    background-image: url(../images/jiantou1.png);

    background-repeat: no-repeat;

    background-position: center center;

    width: 20px;

    height: 20px;

    display: inline-block;

    background-size: contain;

    margin-left: 10px;

}



.language .value svg {

    color: #fff;

}



.language .option {

    position: absolute;

    left: 50%;

    top: 130%;

    -webkit-transform: translateX(-50%);

    -ms-transform: translateX(-50%);

    transform: translateX(-50%);

    width: 100px;

    background-color: #fff;

    opacity: 0;

    visibility: hidden;

    -webkit-transition: 0.25s;

    -ms-transition: 0.25s;

    transition: 0.25s;

    box-shadow: 0px 0px 11px 6px rgba(0, 0, 0, 0.03);

}



.language .option:before {

    content: "";

    border-left: 7px transparent solid;

    border-right: 7px transparent solid;

    border-bottom: 7px #fff solid;

    position: absolute;

    left: 45px;

    top: -6px;

}



.language .option li {

    border-bottom: 1px solid rgba(255, 255, 255, 0.4);

}



.language .option li:last-child {

    border: 0;

}



.language .option a {

    color: #333;

    line-height: 40px;

    text-align: center;

    display: block;

    font-size: 16px;

}



.language .option a:hover {

    color: var(--color-primary);

}



.language:hover .option {

    opacity: 1;

    visibility: visible;

}



.headerRight {

    display: flex;

    align-items: center;

    justify-items: center;

    gap: 20px;

}



/*moblie*/

.black {

    position: fixed;

    width: 100%;

    height: 100%;

    left: 0px;

    top: 0px;

    background-color: #000;

    opacity: 0.5;

    display: none;

    z-index: 900;

}



.black.menuOpen {

    display: block;

}



.nav {

    display: none;

}

.header.headerShow .menuBtn .line{

    background-color: var(--color-primary);

}

.menuBtn {

    transition: 400ms 300ms;

    width: 30px;

    height: 52px;

    position: relative;

    overflow: hidden;

    display: block;

    cursor: pointer;

    margin-left: 20px;

}



.menuBtn .line {

    transition: 300ms;

    width: 30px;

    height: 2px;

    background: #fff;

    position: absolute;

    left: 50%;

    margin-left: -14px;

}



.menuBtn .line1 {

    top: 14px;

}



.menuBtn .line2 {

    top: 24px;

    transition: 300ms 100ms;

}



.menuBtn .line3 {

    top: 34px;

}



.menuBtnShow {

    transition: 400ms 300ms;

    background-color: var(--color-primary);

}



.menuBtnShow .line {

    background-color: #fff;

}



.menuBox {

    z-index: 9999;

    background: #fff;

    position: fixed;

    right: -100%;

    top: 0px;

    width: 340px;

    height: 100%;

    overflow-x: hidden;

    overflow-y: auto;

    transition: 400ms;

    -webkit-overflow-scrolling: touch;

}



.menuBoxShow {

    right: 0px;

}



.navMobile dd {

    display: block;

    width: 100%;

}



.navMobile dd p a {

    text-transform: uppercase;

    font-size: 16px;

    background: url(../images/m_ico1.png) no-repeat scroll 95% center;

}



.navMobile dd a {

    display: block;

    padding: 10px 34px 10px 18px;

    line-height: 1.4;

    font-size: 14px;

    color: #8d8d8d;

    border-bottom: 1px solid #eaeaea;

    -webkit-transition: 0s;

    -moz-transition: 0s;

    -o-transition: 0s;

    transition: 0s;

}



.navMobile dd a:hover,

.navMobile dd p a.cur {

    background: none var(--color-primary);

    color: #fff;

}



.navMobile dd a.cur {

    background: url(../images/m_ico2.png) no-repeat scroll 95% center #80abde;

}



.navMobile dd.dlin1 p a.cur {

    background: none #707070;

}



.navMobile dd .msubnav {

    background-color: #fff;

    display: none;

}



.navMobile dd .msubnav a {

    color: #8d8d8d;

    position: relative;

    padding-left: 36px;

    background: url(../images/l.png) no-repeat scroll 18px center #e6e6e6;

}



/* 头部 end */

/* 模块容器 - 核心自适应布局 */

.company-intro {

    display: flex;

    align-items: center;

    justify-content: space-between;



    gap: 20px;

    flex-wrap: wrap;

}



/* 左侧文字区域 */

.intro-text {

    width: 100%;

}



.section-title-tag {

    display: flex;

    align-items: center;

    color: var(--color-primary);

    margin-bottom: 20px;

    font-size: 14px;

}



.section-title-tag::before {

    content: '';

    display: inline-block;

    width: 28px;

    height: 3px;

    background-image: url(../images/fgj.png);

    background-repeat: no-repeat;

    background-size: 100% 100%;

    background-position: center center;

    margin-right: 10px;

}



.intro-text h2 {

    font-size: 20px;

    color: #000;

    margin-bottom: 20px;

    line-height: 1.3;

}



.intro-text p {

    font-size: 16px;

    color: #666;

    line-height: 2;

    margin-bottom: 40px;

}



/* 了解更多按钮 */

.btn-learn-more {

    display: inline-block;

    padding: 8px 25px;

    border: 1px solid #44210a;

    color: #44210a;

    text-decoration: none;

    font-size: 14px;

    transition: all 0.3s ease;

    position: relative;

}



.btn-learn-more:hover {

    background-color: #44210a;

    color: #fff;

}



/* 右侧图片区域 */

.intro-image {

    width: 100%;

    position: relative;

}



.intro-image img {

    width: 100%;

    display: block;

    margin: 0 auto;

}







/* 小屏幕适配：改为上下排列 */

@media (max-width: 1200px) {

    .company-intro {

        flex-direction: column;

    }



    .intro-image {

        order: -1;

        /* 图片在上方 */

    }



}



.padding120 {

    padding: 40px 0;

}



/* 数据模块容器 */

.stats-section-index {

    padding: 26px 40px;

    background-image: url(../images/gb.jpg);

}



.stats-section {

    display: flex;

    justify-content: space-around;

    align-items: center;



    /* 可替换成你的背景纹理 */

    background-size: cover;

    background-position: center;

    flex-wrap: wrap;

    gap: 20px;

}



/* 单个数据项 */

.stats-section-index .stat-item {

    padding: clamp(20px, 4vw, 40px);

}



.stat-item {

    text-align: center;

    flex: 1 1 180px;



    position: relative;

}



/* 中间带边框的项 */



.stats-section-index .stat-item::after {

    content: '';

    display: block;

    width: 100%;

    height: 100%;

    position: absolute;

    top: 0;

    left: 0;

    background-image: url(../images/kuang.png);

    background-repeat: no-repeat;

    background-size: 100% 100%;

    background-position: center center;

    opacity: 0;

    visibility: hidden;

    transition: all 0.3s ease;

    -webkit-transition: all 0.3s ease;

}



.stat-item:hover::after {

    opacity: 1;

    visibility: visible;

}



/* 数字样式 */

.stat-number {

    font-size: 22px;

    font-weight: bold;

    color: #333;

    margin-bottom: 10px;

    transition: all 0.3s ease;

    -webkit-transition: all 0.3s ease;

    font-family: Arial, Helvetica, sans-serif;

}



/* 中间项的数字颜色 */

.stats-section-about .stat-item .stat-number,

.stats-section-index .stat-item:hover .stat-number {

    /* 渐变文字 */

    background: linear-gradient(90deg, #c06e38 0%, #44210a 80%);

    -webkit-background-clip: text;

    background-clip: text;

    color: transparent;

    -webkit-text-fill-color: transparent;

    /* 棕色 */

}



.stat-unit {

    font-size: 14px;

    color: #333;

    vertical-align: top;

    font-weight: 400;

    margin-left: 10px;

}



/* 描述文字 */

.stat-label {

    font-size: 16px;

    color: #333;

    margin-top: 10px;

}



/* 响应式适配 */

@media (max-width: 768px) {

    .stats-section {

        justify-content: center;

        margin-top: 20px;

    }



    .stat-item {

        flex: 1 1 40%;

        min-width: 140px;

    }

}



@media (max-width: 480px) {

    .stat-item {

        flex: 1 1 100%;

    }



    .stat-item.highlight {

        border: none;

        border-top: 1px solid #d1c7b8;

        border-bottom: 1px solid #d1c7b8;

    }

}



/* 模块通用样式 */

.feature-section {

    margin-top: 40px;

}



.feature-row {

    display: flex;

    align-items: center;

    height: auto;

    margin-bottom: 40px;

    flex-direction: column;

}



/* 上半部分：原料溯源 */

.feature-row-1 .image-col {



    height: 100%;

    flex-shrink: 0;

}



.feature-row-1 .image-col img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.feature-row-1 {

    background: #fff url(../images/vb.jpg);

    background-size: 100% 100%;

    background-position: center;

}





/* 下半部分：工艺设备 */

.feature-row-2 {

    background: #fff url(../images/vb1.jpg);

    background-size: 100% 100%;

    background-position: center;

}



.feature-row .text-col {

    width: 100%;

    padding: 20px;

    box-sizing: border-box;



}



.feature-row .image-col {

    width: 100%;

    height: 100%;

    flex-shrink: 0;

}





.feature-row .image-col img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



/* 标题样式 */

.feature-title {

    font-size: 20px;

    color: #222;

    margin-bottom: 30px;

    position: relative;

}



.feature-title::after {

    content: '';

    position: absolute;

    left: 0;

    bottom: -10px;

    width: 80px;

    height: 2px;

    /* 渐变 */

    background: linear-gradient(90deg, var(--color-primary) 0%, transparent 80%);

}



/* 正文样式 */

.feature-desc {

    font-size: 16px;

    color: #666;

    line-height: 2;

    margin-bottom: 40px;

}



/* 底部标语 */

.feature-tagline {

    font-size: 16px;

    color: var(--color-primary);

    display: flex;

    align-items: center;

}



.feature-tagline::before {

    content: '——';

    margin-right: 10px;

}



.fourthman {

    background-image: url(../images/zxc.jpg);

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

    height: 600px;

}



.craft-banner {



    display: flex;

    flex-direction: column;

    align-items: center;

    text-align: center;

    height: 100%;

    padding-top: 120px;

    box-sizing: border-box;

}



/* 顶部小字标题 */

.craft-banner .banner-subtitle {

    font-size: 18px;

    color: var(--color-primary);

    /* 金色 */

    margin-bottom: 30px;

}



/* 主标题 */

.craft-banner .banner-title {

    font-size: 20px;

    color: #222;

    margin-bottom: 20px;

    font-weight: 500;

    line-height: 1.3;

}



/* 正文描述 */

.craft-banner .banner-desc {

    font-size: 16px;

    color: #70461a;

    /* 深棕色 */

    line-height: 1.8;

    max-width: 1200px;

}



.fiveman {

    background-image: url(../images/formbg.png);

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

}



/* 表单容器 */

.contact-section {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;



}



/* 标题部分 */

.contact-subtitle {

    font-size: 18px;

    color: var(--color-primary);

    /* 金色 */

    margin-bottom: 20px;

}



.contact-title {

    font-size: 20px;

    color: #333;

    margin-bottom: 20px;

    font-weight: 500;
        display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 20px;

}
.contact-title span{
    font-size: 15px;
    color: #666;
}


.contact-tip {

    font-size: 14px;

    color: #333333;

    margin-bottom: 30px;

    line-height: 2;

}



/* 表单样式 */

.contact-form {

    width: 100%;

    max-width: 840px;

}



.contact-form .form-row {

    display: flex;

    gap: clamp(20px, 4vw, 40px);

    margin-bottom: clamp(20px, 4vw, 30px);

}



.contact-form .form-row .form-group {

    flex: 1;

    position: relative;

}



.contact-form .form-row .form-group.full-width {

    flex: 1 1 100%;

}



/* 输入框样式 */

.contact-form .form-row .form-group input,

.contact-form .form-row .form-group textarea {

    width: 100%;

    border: none;

    border-bottom: 1px solid #e6decf;

    background: transparent;

    padding: 12px 0;

    font-size: 14px;

    color: #333;

    outline: none;

    font-family: "Microsoft YaHei";

}



.contact-form .form-row .form-group input::placeholder,

.contact-form .form-row.form-group textarea::placeholder {

    color: #999;

}



.contact-form .form-row .form-group textarea {

    resize: none;

    min-height: 60px;

}



.contact-form .btn-learn-more {

    text-align: center;

}



/* 响应式适配 */

@media (max-width: 768px) {

    .contact-form .form-row {

        flex-direction: column;

        gap: 20px;

    }

}



.footer {

    background-image: url(../images/footerbg.jpg);

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

}



.footer-bottom {

    border-top: 1px solid #ded2be;

    padding: 20px 0;

    text-align: center;

}



.footer-bottom p {

    font-size: 16px;

    color: #d0c9bb;

}



/* 左侧品牌信息 */

.footer-top {

    width: 100%;

    padding: clamp(40px, 8vw, 80px) 0;

    display: flex;

    justify-content: space-between;

    flex-wrap: wrap;

    gap: clamp(30px, 6vw, 60px);

}



.footer-top .footer-brand {

    width: 450px;

}



.footer-top .logo {

    margin-bottom: 20px;

}



.footer-top .logo img {

    height: 64px;

}



.footer-top .brand-desc {

    font-size: 16px;

    color: #999;

    line-height: 1.8;

}



/* 通用列样式 */

.footer-top.footer-column {

    flex: 1 1 150px;

}



.footer-top .footer-column h3 {

    font-size: 18px;

    color: #333;

    margin-bottom: 25px;

}



.footer-top .footer-column ul {

    list-style: none;

}



.footer-top .footer-column ul li {

    margin-bottom: 15px;

}



.footer-top .footer-column ul li a {

    text-decoration: none;

    font-size: 16px;

    color: #999;

    transition: color 0.3s;

}



.footer-top .footer-column ul li a:hover {

    color: var(--color-primary);

}



/* 联系我们列 */

.footer-top .footer-column .contact-item {

    display: flex;

    align-items: center;

    margin-bottom: 20px;

    font-size: 16px;

    color: #999;

}



.footer-top .footer-column .contact-item .icon {

    width: 19px;

    height: 19px;

    margin-right: 10px;

    display: flex;

    align-items: center;

    margin-top: 2px;

}



/* 公司地址列 */

.footer-top .footer-column .address-item {

    display: flex;

    align-items: center;

    margin-bottom: 20px;

    font-size: 16px;

    color: #999;

}



.footer-top .footer-column .address-item .icon {

    width: 19px;

    height: 19px;

    display: flex;

    margin-right: 5px;

    flex-shrink: 0;

    /* color: #c9b07f; */

}



/* 响应式适配 */

@media (max-width: 768px) {

    .footer-top {

        flex-direction: column;

    }



    .footer-top .footer-brand {

        width: 100%;

    }

}



.ziyebanner {

    height: 300px;

    background-repeat: no-repeat;

    background-size: cover;

    background-position: center;

    display: flex;

}



.ziyebanner .ziyebannerbox {

    display: flex;

    align-items: center;

    justify-content: center;

}



.ziyebanner h5 {

    font-size: 24px;

    font-weight: bold;

    color: #fff;

}



.contact {

    background-image: url(../images/cong.jpg);

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

}



.contact-info-section {

    width: 100%;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;

    margin-bottom: 40px;

}



/* 公司标题 */

.company-title {



    font-size: 36px;

    color: #333;

    margin-bottom: clamp(15px, 3vw, 30px);

}



/* 副标题 */

.company-subtitle {

    font-size: 16px;

    color: #333;

    margin-bottom: clamp(40px, 8vw, 80px);

}



/* 信息列表容器 */

.info-list {

    display: flex;

    justify-content: space-around;

    width: 100%;

    max-width: 1200px;

    flex-wrap: wrap;

    gap: clamp(30px, 6vw, 60px);

    margin-top: clamp(40px, 8vw, 80px);

}



/* 单个信息项 */

.info-item {

    flex: 1 1 200px;

    display: flex;

    flex-direction: column;

    align-items: center;

}



/* 图标容器 */

.icon-circle {

    width: clamp(80px, 15vw, 100px);

    height: clamp(80px, 15vw, 100px);

    background-color: #ece8e3;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: clamp(15px, 3vw, 25px);

}



.icon-circle svg {

    width: clamp(30px, 6vw, 35px);

    height: clamp(30px, 6vw, 35px);

    fill: #5c3a21;

}



/* 标签文字 */

.info-label {

    font-size: 16px;

    color: #aaa;

    margin-bottom: 10px;

}



/* 内容文字 */

.info-value {

    font-size: 16px;

    color: #333;

}



.oem .contact-tip {

    text-align: center;

    max-width: 1170px;

    margin: 0 auto;

}



.oem-odm-section {

    display: flex;

    justify-content: center;

    gap: clamp(20px, 4vw, 40px);

    flex-wrap: wrap;

    margin-top: clamp(40px, 5vw, 80px);

    margin-bottom: clamp(40px, 5vw, 120px);

}



/* 单个服务卡片 */

.service-card {

    flex: 1 1 400px;

    max-width: 800px;

    background-color: #fff;

    display: flex;

    flex-direction: column;

}



/* 图片部分 */

.oem-odm-section .service-img {

    overflow: hidden;

    margin: 20px 20px 0 20px;

}



.oem-odm-section .service-img img {

    width: 100%;

    height: clamp(250px, 40vw, 400px);

    object-fit: cover;

    transition: transform 0.3s ease-in-out;

    -webkit-transition: transform 0.3s ease-in-out;

}



.oem-odm-section .service-img:hover img {

    transform: scale(1.1);

}



/* 文字部分 */

.oem-odm-section .service-content {

    padding: clamp(20px, 4vw, 40px);

    text-align: center;

}



.oem-odm-section .service-title {

    font-size: clamp(24px, 5vw, 30px);

    color: #111;

    margin-bottom: clamp(20px, 4vw, 30px);

}



.oem-odm-section .service-desc {

    display: flex;

    align-items: center;

    justify-content: flex-start;

    font-size: clamp(14px, 2.5vw, 16px);

    color: #333;

    line-height: 1.6;

    text-align: left;

}



.oem-odm-section .service-desc::before {

    content: '';

    display: inline-block;

    width: 10px;

    height: 10px;

    border: 1px solid #a0a0a0;

    margin-right: 12px;

    flex-shrink: 0;

}



.services-section {

    width: 100%;

    display: flex;

    justify-content: center;

    flex-wrap: wrap;

    gap: clamp(20px, 4vw, 100px);

    margin-top: clamp(40px, 5vw, 80px);

    margin-bottom: clamp(40px, 5vw, 120px);

}



.services-section .service-card {

    flex: 1 1 150px;

    max-width: 200px;

    background-color: #fff;

    padding: clamp(20px, 4vw, 30px);

    display: flex;

    flex-direction: column;

    align-items: center;

    text-align: center;

    transition: all 0.3s ease;

    cursor: pointer;

    box-sizing: border-box;

}



/* Hover 效果 */

.services-section .service-card:hover {

    transform: translateY(-8px);

    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);

}



.services-section .icon-wrap {

    width: clamp(40px, 4vw, 60px);

    height: clamp(40px, 4vw, 60px);

    margin-bottom: clamp(15px, 3vw, 20px);

    display: flex;

    align-items: center;

    justify-content: center;

}



.services-section .icon-wrap img {

    width: 100%;

    height: 100%;

}



.services-section .service-title {

    font-size: clamp(16px, 3vw, 18px);

    color: #000;

    font-weight: 500;

}



.factory-section {

    display: grid;

    grid-template-columns: 2fr 1fr;

    gap: clamp(10px, 2vw, 40px);

    margin: clamp(10px, 2vw, 40px) 0;

}



.factory-section1 {

    grid-template-columns: 2fr 1fr;

}



.factory-section2 {

    grid-template-columns: 1fr 2fr;

}



.factory-section .scene-card {

    position: relative;

    overflow: hidden;

}



.factory-section .scene-card img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

    transition: transform 0.4s ease;

}



.factory-section .scene-card:hover img {

    transform: scale(1.05);

}



.factory-section .scene-label {

    position: absolute;

    top: clamp(15px, 3vw, 20px);

    left: clamp(15px, 3vw, 20px);

    font-size: clamp(18px, 3vw, 30px);

    color: #fff;

    font-weight: 500;

}



/* 高度统一 */

.factory-section .scene-line,

.factory-section .scene-showroom {

    height: clamp(300px, 45vw, 580px);

}



/* 移动端适配 */

@media (max-width: 768px) {

    .factory-section {

        grid-template-columns: 1fr;

    }



    .factory-section .scene-line,

    .factory-section .scene-showroom {

        height: clamp(250px, 50vw, 350px);

    }

}



.aboutText {

    background-image: url(../images/formbg.png);

    background-size: contain;

    background-repeat: no-repeat;

    background-position: center;

}



.aboutText .contact-tip {

    max-width: 1110px;

    color: #666;

}



.team-section {

    display: flex;

    align-items: center;

    margin-top: 20px;

    gap: 40px;

    position: relative;

}



.team-section::after {

    content: '';

    position: absolute;

    bottom: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background-color: #fff;

}





.team-section .team-image-wrapper {

    flex: 1;

    position: relative;

    z-index: 1;

    padding-left: 0px;

}



.team-section .team-image {

    width: 100%;

    height: auto;

    display: block;

    object-fit: cover;

}



.team-section .team-content {

    flex: 1;

    min-width: 300px;

    position: relative;

    padding-bottom: 60px;

    padding-top: 60px;

    padding-right: 90px;

    position: relative;

    z-index: 1;

}



.team-section .team-content .team-title {

    font-size: 26px;

    font-weight: 600;

    color: #000;

    margin-bottom: 30px;

}



.team-section .team-content .team-desc {

    font-size: 15px;

    color: #666;

    margin-bottom: 0px;

    line-height: 2;

}



.team-section .team-content .team-slogan {

    font-size: 18px;

    font-weight: 500;

    color: #000;

    margin-top: 30px;

}



.team-section .team-content .logo-watermark {

    position: absolute;

    right: 90px;

    bottom: 0;

    opacity: 0.3;

}



.team-section .team-content .logo-watermark img {

    height: 50px;

    width: auto;

}



/* 移动端适配 */

@media (max-width: 1200px) {

    .team-section {

        flex-direction: column;

        padding: 20px;

        gap: 30px;

    }



    .team-section .team-image-wrapper {

        min-width: 100%;

    }



    .team-section .team-content {

        padding-top: 0;

        padding-right: 0;

    }



    .team-section .team-content .team-image-wrapper {

        padding-bottom: 80px;

    }



    .team-section .team-content .team-title {

        font-size: 24px;

    }







    .team-section .team-content .team-slogan {

        font-size: 16px;

    }



    .team-section .team-content .logo-watermark {

        right: 10px;

    }

}



.concept-container {

    display: grid;

    grid-template-columns: 2fr 1fr;

    gap: 20px;

    margin-top: 20px;

}



.left-column {

    display: flex;

    flex-direction: column;

    gap: 20px;

}



.concept-card {

    position: relative;

    width: 100%;

    overflow: hidden;

    border-radius: 0;

    cursor: pointer;

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

}



.concept-card:hover {

    transform: translateY(-5px);

    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);

}



.concept-card img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

    transition: transform 0.5s ease;

    /* 图片下沉 */

    z-index: 1;

    position: relative;

}



.concept-card:hover img {

    transform: scale(1.05);

}



.concept-overlay {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: linear-gradient(to right, rgba(0, 0, 0, 0.4), transparent 60%);

    display: flex;

    flex-direction: column;

    justify-content: flex-start;

    padding: 40px;

    color: #fff;

    transition: background 0.3s ease;

    /* 核心：文字遮罩置顶 */

    z-index: 9;

}



.concept-card:hover .concept-overlay {

    background: linear-gradient(to right, rgba(0, 0, 0, 0.5), transparent 60%);

}



.concept-title {

    font-size: 28px;

    font-weight: 600;

    margin-bottom: 16px;

    color: #fff;

}



.concept-text {

    font-size: 18px;

    line-height: 1.6;

    color: #fff;

}



.concept-icon {

    position: absolute;

    bottom: 30px;

    left: 30px;

    width: 40px;

    height: 40px;

    stroke: #fff;

    stroke-width: 2;

    fill: none;

    transition: transform 0.3s ease;

    /* 图标也置顶 */

    z-index: 10;

}



.concept-card:hover .concept-icon {

    transform: scale(1.2);

}



/* 卡片高度适配 */

.card-vision,

.card-mission {

    height: 330px;

}



.card-values {

    height: calc(330px * 2 + 20px);

}



/* 移动端适配 */

@media (max-width: 992px) {

    .concept-container {

        grid-template-columns: 1fr;

    }



    .card-values {

        height: 280px;

    }



    .concept-overlay {

        padding: 25px;

    }



    .concept-title {

        font-size: 24px;

    }



    .concept-text {

        font-size: 16px;

    }

}



.develop {

    background-image: url(../images/develop.jpg);

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

   

    position: relative;

    box-sizing: border-box;

    margin-top: 40px;

}



.develop .contact-title {

    color: #ffffff;

}



.timeline-item {

    /* position: absolute; */

    display: flex;

    flex-direction: column;

    max-width: 100%;

    margin-bottom: 20px;

}



.timeline-item .timeline-year {

    font-size: 24px;

    font-weight: 600;

    color: #ffffff;

    margin-bottom: 10px;

    font-family: 'Arial', sans-serif;

}



.timeline-item .timeline-year span {

    font-size: 18px;

    font-weight: 200;

    margin-left: 5px;

}



.timeline-item .timeline-content {

    font-size: 16px;

    font-weight: 200;

    color: #ffffff;

}



/* 每个时间点的位置 */









.timeline-line {

    display: none;

    align-items: center;

    flex-direction: column;

    width: 11px;

    margin-top: 30px;

}



.item-2006 .timeline-line .timeline-line-one {

    height: 248px;

}



.item-2012 .timeline-line .timeline-line-one {

    height: 327px;

}



.item-2018 .timeline-line .timeline-line-one {

    height: 232px;

}



.item-2025 .timeline-line .timeline-line-one {

    height: 143px;

}



.timeline-line .timeline-line-one {

    height: 268px;

    width: 1px;

    background-image: url(../images/line.png);

    background-size: 100% 100%;

    background-position: center;

    background-repeat: no-repeat;

}



.timeline-line .timeline-line-two {

    height: 11px;

    width: 11px;

    background-color: #ffffff;

    border-radius: 50%;

}



/* 产品 */

.product-section {

    margin: 0 auto;

    display: grid;

    grid-template-areas:

        "women men"

        "kids kids";

    gap: 40px;

}



.product-card {

    position: relative;

    overflow: hidden;

    background: #fff;

    display: flex;

    align-items: center;

    color: #333;

}



/* 卡片区域分配 */

.card-women {

    grid-area: women;

    height: 600px;

}



.card-men {

    grid-area: men;

    height: 600px;

}



.card-kids {

    grid-area: kids;

    height: 278px;

}



.card-same .product-info {

    bottom: 60px;

}



.card-kids .product-info {

    top: 50%;

    transform: translateY(-50%);

}



.product-info {

    position: absolute;

    left: 60px;

    z-index: 2;

}



.product-title {

    font-size: 30px;

    font-weight: 600;

    margin-bottom: 12px;

}



.card-same .product-desc {

    max-width: 300px;

}



.product-desc {

    font-size: 16px;

    line-height: 1.6;

    margin-bottom: 30px;



}



.product-buttons {

    display: flex;

    align-items: center;

    gap: 30px;

}



.btn-primary {

    padding: 12px 36px;

    background: #000;

    color: #fff;

    border: none;

    font-size: 15px;

    cursor: pointer;

    transition: background 0.3s ease;

}



.btn-primary:hover {

    background: var(--color-primary);

}



.product-image {

    position: absolute;

    right: 0;

    top: 0;

    height: 100%;

    object-fit: cover;

    z-index: 1;

}



/* 童装卡片特殊背景 */

.card-kids {

    background: #eaeef1;

}



.card-kids .product-image {

    width: 70%;

    right: 0;

}



/* 移动端适配 */

@media (max-width: 1400px) {

    .product-title {

        font-size: 26px;

    }

}



@media (max-width: 992px) {

    .product-section {

        grid-template-areas:

            "women"

            "men"

            "kids";

    }



    .card-women,

    .card-men,

    .card-kids {

        height: 400px;

    }



    .product-info {

        left: 25px;

    }



    .product-title {

        font-size: 22px;

    }



    .product-desc {

        font-size: 14px;

    }



    .product-buttons {

        flex-direction: column;

        align-items: flex-start;

        gap: 15px;

    }



    .btn-primary {

        padding: 10px 30px;

        font-size: 14px;

    }

}



/* .color-card-section {

    max-width: 1200px;

    margin: 0 auto;

} */



.yarn-group {

    margin-bottom: 60px;

}



.last-yarn-group {

    margin-bottom: 100px;

}



.yarn-title {

    font-size: 24px;

    font-weight: 600;

    margin-bottom: 24px;

    color: #222;

}



/* 每一行的容器 */

.color-row {

    display: flex;

    align-items: flex-start;

    margin-bottom: 20px;

    gap: 36px;

}



/* 每个色卡项（图片+色号+右侧空白） */

.color-item {

    display: flex;

    flex-direction: column;

    align-items: center;

    flex: 0 0 auto;

    width: 240px;

}



.color-swatch {

    width: 240px;

    height: 130px;

    object-fit: cover;

    display: block;

}



.color-code {

    font-size: 16px;

    color: #444;

    margin-top: 8px;

    text-align: center;

}



/* 右侧空白占位 */

.empty-space {

    flex: 1;

    height: 80px;

}



/* 响应式适配 */

@media (max-width: 992px) {

    .yarn-title {

        font-size: 18px;

    }



    .color-row {

        flex-wrap: wrap;

    }



    .color-item {

        margin-bottom: 20px;

        flex: 0 0 44%;

    }



    .empty-space {

        display: none;

    }



    .color-swatch {

        width: 100%;

        height:auto;

    }

}



.jiaxue-container .section-row {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 60px;

    gap: 60px;

}



.jiaxue-container .section-row.reverse {

    flex-direction: row-reverse;

}



.jiaxue-container .text-block {

    flex: 1;

}



.jiaxue-container .reverse .text-block {

    padding-left: 80px;

}



.jiaxue-container .image-block {

    flex: 1;

    position: relative;

    overflow: hidden;

}



.jiaxue-container .image-block img {

    width: 100%;

    display: block;

    transition: transform 0.3s ease;

    -webkit-transition: transform 0.3s ease;

}



.jiaxue-container .image-block:hover img {

    transform: scale(1.1);

    transition: transform 0.3s ease;

}



.jiaxue-container .play-btn {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    width: 40px;

    height: 40px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

}



.jiaxue-container .play-btn::after {

    content: "";

    width: 0;

    height: 0;

    border-top: 10px solid transparent;

    border-bottom: 10px solid transparent;

    border-left: 16px solid #ffffff;

    margin-left: 2px;

}



.jiaxue-container .section-title {

    font-size: 30px;

    color: #222;

    margin-bottom: 20px;

    position: relative;

    padding-bottom: 10px;

}



.jiaxue-container .section-title::after {

    content: "";

    position: absolute;

    bottom: 0;

    left: 0;

    width: 80px;

    height: 2px;

    /* 渐变 */

    background: linear-gradient(to right, #ad8d53, transparent);

}



.jiaxue-container .text-list li {

    margin-bottom: 8px;

    color: #666;

    line-height: 2;

    font-size: 18px;

}



@media (max-width: 768px) {



    .jiaxue-container .section-row,

    .jiaxue-container .section-row.reverse {

        flex-direction: column;

    }



    .jiaxue-container .image-block,

    .jiaxue-container .text-block {

        width: 100%;

    }



    .jiaxue-container .reverse .text-block {

        padding-left: 0;

    }

}



.process-section {

    display: flex;

    align-items: flex-end;

    gap: 25px;

}



.process-item {

    flex: 1;

    display: flex;

    flex-direction: column;

    position: relative;

}



.process-number-title {

    margin-bottom: 16px;

}



.process-number {

    font-size: 48px;

    font-weight: 700;

    color: #333;

    line-height: 1;

    font-family: 'Arial', sans-serif;

}



.process-title {

    font-size: 24px;

    color: #333;

    margin-top: 8px;

}



.process-image {

    width: 100%;

    height: 500px;

    object-fit: cover;

    display: block;

}







.productThree {

    background-color: #fff;

}



.productTour {

    margin-bottom: 80px;

    background-color: #fff;

}



/* 响应式适配 */

@media (max-width: 1200px) {

    .process-section {

        flex-wrap: wrap;

    }



    .process-item {

        flex: 1 1 calc(33.333% - 20px);

    }

}



@media (max-width: 768px) {

    .process-section {

        /* flex-direction: column; */

        gap: 40px;

    }



    .process-item {

        flex: 1 1 100%;

    }



    .process-number {

        font-size: 36px;

    }



    .process-title {

        font-size: 18px;

    }

}



.productTwo .contact-section {

    align-items: flex-start;

}





.productTwo-box {

    /* display: flex; */

    align-items: flex-start;

    justify-content: space-between;

    gap: 40px;

    margin: 40px 0 60px;

}



.productTwo-box-left {

    width: 100%;

}



.productTwo-box-right {

    width: 100%;

}



/* 产品信息区域 */

.knitwear-showcase .product-grid {

    display: grid;

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

    gap: 20px;

}



.knitwear-showcase .goods-item {

    background-color: #fff;

    overflow: hidden;

    transition: transform 0.3s ease;

}



.knitwear-showcase .goods-item:hover {

    transform: translateY(-5px);

}



.knitwear-showcase .product-image-container {

    width: 100%;

    aspect-ratio: 1 / 1.2;

    overflow: hidden;

}



.knitwear-showcase .goods-image {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: transform 0.3s ease;

}



.knitwear-showcase .goods-item:hover .goods-image {

    transform: scale(1.05);

}



.knitwear-showcase .goods-text {

    padding: 20px;

}



.knitwear-showcase .goods-name {

    font-size: 24px;

    color: #333;

    margin-bottom: 8px;

    font-weight: 500;

}



.knitwear-showcase .goods-txt {

    font-size: 16px;

    color: #666;

    margin-bottom: 12px;

    line-height: 1.5;

}



.knitwear-showcase .goods-btn {

    font-size: 16px;

    color: #333;

    text-decoration: none;

    display: inline-flex;

    align-items: center;

    transition: color 0.3s ease;

}



.knitwear-showcase .goods-btn::after {

    content: '›';

    margin-left: 5px;

    font-size: 26px;

    margin-top: -4px;

}



.knitwear-showcase .goods-btn:hover {

    color: var(--color-primary)

}



@media (max-width: 992px) {

    .knitwear-showcase .product-grid {

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

    }

}



@media (max-width: 576px) {

    .knitwear-showcase .product-grid {

        grid-template-columns: 1fr;

    }

}



/* daohang */

/* 外层父级 */

.shopLeft-box {

    width: 100%;

    

}

.productTwo-box-left .shopLeft-title{

    font-size: 24px;

    color: #333;

    margin-bottom: 30px;

    font-weight: 500;

}

.shopLeft-box .accordion-nav {

    width: 100%;

}



/* 原nav-item 改为 menu-list */

.shopLeft-box .menu-list {

    margin-bottom: 30px;

    background: #fff;

}



/* 原nav-main 改为 menu-top */

.shopLeft-box .menu-top {

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: 18px 25px;

    font-size: 18px;

    color: #333;

    text-decoration: none;

    transition: background 0.3s;

}

.shopLeft-box .menu-child .act,

.shopLeft-box .menu-top:hover {

    background: #f2f2f2;

}



.shopLeft-box .arrow {

    background-image: url(../images/jhj.png);

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

    width: 14px;

    height: 14px;

}

.shopLeft-box .menu-list.active{

    padding-bottom: 12px;

}

.shopLeft-box .menu-list.active .arrow {

    transform: rotate(180deg);

}



/* 二级下拉容器 */

.shopLeft-box .menu-child {

    max-height: 0;

    overflow: hidden;

    transition: max-height 0.3s ease;

}



/* 二级菜单 */

.shopLeft-box .menu-child a {

    display: block;

    padding: 15px 40px;

    color: #555;

    text-decoration: none;

    font-size: 18px;

    transition: background 0.3s;

    border-bottom: 1px solid #eceaea;

}



.shopLeft-box .menu-child a:hover {

    background: #e9e9e9;

}

.shadow {position:fixed;left:0;top:0;width:100%;height:100%;z-index:1000;display:none;background:rgba(12,17,20,0.6);}

.shadow .videll {width: 960px;height: 553px;z-index:200;position:fixed;left:0;top:0;bottom: 0;right: 0;margin: auto;}

.shadow .videll video {width:100%;height:100%;background-color: #000}

.btn_close {cursor: pointer;position:absolute;right: -16px;top: -20px;z-index:10;display:block;font-size:14px;background:url(../images/btn_close.png) no-repeat center;width:30px;height:30px;background-size:30px;}

/* 新增 */

.file-list {

    display: flex;

    flex-wrap: wrap;

    margin-left: -40px; /* 左侧负边距抵消左边距 */

    margin-bottom: 80px;

    margin-top: 30px;

}



.file-list .download-item {

    display: flex;

    align-items: center;

    width: 22.5%;

    min-width: 220px;

    height: 80px;

    padding: 16px 30px;

    border: 1px solid #d6d6d6;

    border-radius: 4px;

    background-color: #ffffff;

    text-decoration: none;

    color: #1f2937;

    font-size: 18px;

    transition: background-color 0.2s ease;

    box-sizing: border-box;

    margin-left: 40px; /* 项之间间距 */

    margin-bottom: 15px;

}





.file-list .download-item:hover {

    background-color: #f2f2f2;

}



.file-list .download-item .file-icon {

    width: 34px;

    height: 34px;

    flex-shrink: 0;

    background-image: url(../images/pdf.png);

    background-size: contain;

    background-repeat: no-repeat;

    background-position: center;

    margin-right: 25px;

}



.file-list .download-item .file-name {

    white-space: nowrap;

    font-size: 18px;

    color: #333;

}



/* 响应式自适应 */

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

    .file-list .download-item {

        width: 47%;

    }

}

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

    .file-list .download-item {

        width: 100%;

        font-size: 16px;

    }

}

