@charset "utf-8";
* {margin: 0px;padding: 0px;box-sizing: border-box;font-family: "Poppins-Light","Arial","Microsoft YaHei",sans-serif;
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
html,body{padding: 0;margin: 0;height: 100%;width: 100%;}
body {
background: #f8f8f8;
  font-size:14px; color:#111;line-height: 1.85;

}
iframe{border: none;}
hr{border: none;height: 1px;margin: 0;padding: 0;background-color: #e0e0e0;}

a{text-decoration: none; outline: none;cursor:pointer;color: #111;
transition: 450ms;
-webkit-transition: 450ms;

}


a:hover{ color:#ff6600;}
img{border:none;
transition: 450ms;
-webkit-transition: 450ms;
vertical-align: bottom;
}
.pic{overflow: hidden;
transition: 450ms;
-webkit-transition: 450ms;
}
.poa{position: absolute;}
.por{position: relative;}
a:hover .pic img,.pic:hover img,.index5 .item:hover .pic img{transform: scale(1.09);}

i, em, cite{font-style: normal;}
ul,li{ list-style: none; margin: 0; padding: 0;}
* input {vertical-align: middle;float:left;outline:none;border:none;}
h1, h2, h3, h4, h5, h6 {margin: 0; padding: 0;font-family: 'Poppins-Medium';font-weight: 500;}
.wrap{ margin: 0 auto;}


.wrap{width: 100%;padding: 0 5%;}
.wrap2{width: 1425px;margin: 0 auto;}


.wrap.artcon{width: 1360px;padding: 40px 0;word-wrap: break-word;word-break: keep-all;}
.vmax-box-cn .wrap.artcon p{line-break: anywhere;}

.fl{float: left;}
.fr{float: right;}
.clear:before,.clear:after,.select-list:before,.select-list:after,.select-list ul:before,.select-list ul:after{content: '';display: table; clear: both;line-height: 0;}
.hidden{display:none;}
.visible{display:block;}
.txtcenter{text-align: center;}

/* 不需要平均占比，改成间隔一样 */
/* .epd-menu-li-min li{width: 142px;}
.epd-menu-li-3 li{width: 33.33%;}
.epd-menu-li-4 li{width: 25%;}
.epd-menu-li-5 li{width: 20%;}
.epd-menu-li-6 li{width: 16.66%;}
.epd-menu-li-7 li{width: 14.28%;}
.epd-menu-li-8 li{width: 12.5%;} */

.vmax-box-cn .en{display: none;}
.vmax-box-en .cn{display: none;}

.flex,.page-menu2 ul{display: flex;flex-wrap: wrap;}
.page-menu2 h2{font-size: 35px;font-family: 'Poppins-SemiBold';font-weight: bold;text-align: center;line-height: 5;}
.page-menu2 ul{flex-direction: row; justify-content: center; align-items: center;}
.page-menu2 ul li{position: relative;transition: 400ms;-webkit-transition: 400ms;}
.page-menu2 ul li a{font-size: 14px;padding: 0 2em;display: block;line-height: 45px;}
.page-menu2 ul li:after{position: absolute;content: '';width: 0;height: 4px;left: 0;bottom: -4px;background-color: #ff6600;transition: 400ms;-webkit-transition: 400ms;}
.page-menu2 ul li.current:after,.page-menu ul li:hover:after{width: 100%;}
.page-menu2 ul li.current a,.page-menu2 ul li:hover a{color:#ff6600;}
.page-menu2{border-bottom: 1px solid #eee;margin-bottom: 90px}


.tit h1{font-size: 35px;font-family: 'Poppins-SemiBold';font-weight: bold;color: #111}
.tit h4{color: #555;font-size: 16px;}
.tit span{color: #aaa;}
.w10{width: 10%}
.w20{width: 20%}
.w25{width: 25%}
.w30{width: 30%}
.w40{width: 40%}
.w50{width: 50%}
.w60{width: 60%}
.w70{width: 70%}
.w80{width: 80%}
.w90{width: 90%}
.w100{width: 100%}
.h100{height: 100%;}

.pt10{padding-top: 10px;}
.pt20{padding-top: 20px;}
.pt30{padding-top: 30px;}
.pt40{padding-top: 40px;}
.pt50{padding-top: 50px;}
.pt60{padding-top: 60px;}
.pt70{padding-top: 70px;}
.pt80{padding-top: 80px;}
.pt90{padding-top: 90px;}
.pt100{padding-top: 100px;}

.pb10{padding-bottom: 10px;}
.pb20{padding-bottom: 20px;}
.pb30{padding-bottom: 30px;}
.pb40{padding-bottom: 40px;}
.pb50{padding-bottom: 50px;}
.pb60{padding-bottom: 60px;}
.pb70{padding-bottom: 70px;}
.pb80{padding-bottom: 80px;}
.pb90{padding-bottom: 90px;}
.pb100{padding-bottom: 100px;}

.pl10{padding-left: 10px;}
.pl20{padding-left: 20px;}
.pl30{padding-left: 30px;}
.pl40{padding-left: 40px;}
.pl50{padding-left: 50px;}
.pl60{padding-left: 60px;}
.pl70{padding-left: 70px;}
.pl80{padding-left: 80px;}
.pl90{padding-left: 90px;}
.pl100{padding-left: 100px;}

.pr10{padding-right: 10px;}
.pr20{padding-right: 20px;}
.pr30{padding-right: 30px;}
.pr40{padding-right: 40px;}
.pr50{padding-right: 50px;}
.pr60{padding-right: 60px;}
.pr70{padding-right: 70px;}
.pr80{padding-right: 80px;}
.pr90{padding-right: 90px;}
.pr100{padding-right: 100px;}


.mt10{margin-top: 10px;}
.mt20{margin-top: 20px;}
.mt30{margin-top: 30px;}
.mt40{margin-top: 40px;}
.mt50{margin-top: 50px;}
.mt60{margin-top: 60px;}
.mt70{margin-top: 70px;}
.mt80{margin-top: 80px;}
.mt90{margin-top: 90px;}
.mt100{margin-top: 100px;}

.mb10{margin-bottom: 10px;}
.mb20{margin-bottom: 20px;}
.mb30{margin-bottom: 30px;}
.mb40{margin-bottom: 40px;}
.mb50{margin-bottom: 50px;}
.mb60{margin-bottom: 60px;}
.mb70{margin-bottom: 70px;}
.mb80{margin-bottom: 80px;}
.mb90{margin-bottom: 90px;}
.mb100{margin-bottom: 100px;}

.ml10{margin-left: 10px;}
.ml20{margin-left: 20px;}
.ml30{margin-left: 30px;}
.ml40{margin-left: 40px;}
.ml50{margin-left: 50px;}
.ml60{margin-left: 60px;}
.ml70{margin-left: 70px;}
.ml80{margin-left: 80px;}
.ml90{margin-left: 90px;}
.ml100{margin-left: 100px;}

.mlr{margin:  auto;}
.mr10{margin-right: 10px;}
.mr20{margin-right: 20px;}
.mr30{margin-right: 30px;}
.mr40{margin-right: 40px;}
.mr50{margin-right: 50px;}
.mr60{margin-right: 60px;}
.mr70{margin-right: 70px;}
.mr80{margin-right: 80px;}
.mr90{margin-right: 90px;}
.mr100{margin-right: 100px;}


.wrap img,.col2 img{max-width: 100%}

.swiper-container,.swiper-wrapper {
      width: 100%;
      height: 100%;
    }
.bannertxt{position: absolute;top: 50%;left: 0;right: 0;margin: auto;text-align: center;color: #fff;z-index: 899;transform: translateY(-50%);}
.bannertxt h1{font-size: 50px;font-family: 'Poppins-SemiBold';font-weight: bold;}

.bannertxt h4{font-size: 25px}
.bannertxt .more,.bannertxt3 .more{display: inline-block;margin-top: 2em;}
.bannertxt .more a,.bannertxt3 .more a{display: inline-block;border-radius: 50px;border: 1px solid rgba(255,255,255,.5);color: #fff;padding: .5em 2em;}
.bannertxt .more a:hover,.bannertxt3 .more a:hover{background-color: #fff;color: #000}


    .index_banner .swiper-slide {
      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
      overflow: hidden;
      position: relative;
    }

    .index_banner .swiper-slide img{object-fit: cover;width: 100%;height: 100%;}

     


.swiper-slide h3{font-size: 18px}
.list2 img{width: 100%}
.list2 h3{padding: 20px}
.more1 {}




/*--------------------header---------------------*/
.menu{float: left;}

.menu .nav-item{margin-right: 35px; font-size:12px;padding: 0 5px;}


.submenu{display: none;width: 100%;background-color: #fafafa;position:absolute;top: 60px;left: 0;right: 0;
padding: 60px 0 40px;box-shadow: 0 15px 15px rgba(0,0,0,.1);z-index: 9998;}
.menu > ul,.tabsmenu,.tab-container .content ul{display: flex;display: flex;flex-direction: row;align-items: center;flex-wrap: wrap;}
.tab-product{padding-top: 30px;}
.tab-container .content ul li{width: 14%;padding: .7em}
.tab-container .content:nth-child(6) ul li{width: 14%}
.tab-container .content ul li h3{font-size: 14px;padding: 0;text-align: center;margin: 1em 0;
    font-family: "Poppins-Light";
display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
     -webkit-line-clamp: 1;
}
.tabsmenu{font-size: 14px;}
.tabsmenu li{padding: 0 1em;text-align: center;}
.tabsmenu li.active a{color: #ff6600;}
.menu > ul > li > a{color: #fff;line-height: 100px;}
.menu > ul > li.current > a,.menu > ul > li:hover > a{color: #ff6600 !important}
.tab-container{}
.tab-container .content{display: none;text-align: center;}
.tab-container .content .pic{width: 100%;height: 130px;padding: 15px;
position: relative;
}
.tab-container .content .pic img{max-width: 90%;max-height: 90%;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);}

.s1 ul,.s2 ul{display: flex;width: 100%}
.s1 ul li,.s2 ul li{width: 15%;text-align: center;}
.s1 ul li a,.s2 ul li a{display: block;line-height: 30px;}
.location{text-align: left;padding-top: 100px;position: relative;line-height: 50px;color: #999;}
.location a{color: #999;margin: 0 5px;}
.location a:hover{color: #ff6600;}

.header.white,.header.light{background-color: #fff;}
.header.white .menu > ul > li > a,.header.pos .menu > ul > li > a,.header.light .menu > ul > li > a{color: #333;}
.header-top{position: relative;min-width:1260px;background: #272727;color: #9c9c9c;line-height: 46px;text-align: right;}
.header-top span{float: left;display: block; }
.header-top a{margin-right: 10px;color: #fff;}
.header-top a:hover{color: #ff6600;}
.header{padding: 0 5%;height: 100px;
position: absolute;left: 0;right: 0;top: 0;width: 100%;z-index: 9999;transition: 400ms;-webkit-transition: 400ms;
}



.header.light{position: relative;}
.header.pos{position: fixed;top: 0;left: 0;background: #f8f8f8;border-bottom: 1px solid #e1e2e4;}


.logo{float: right;line-height: 100px;max-width: 100px}

.logo a{display: block;position: relative;}
.logo img{max-width: 100%;margin-bottom: 41.5px}


.head-right{float: right;padding-top: 22px}

.search-keyword{padding: 0 10px;width: 150px;height: 28px;line-height: 28px;border: 1px #eee solid;color: #999;}
.head-member .member-login a,.head-member .member-exit a{border: 1px solid rgba(255,255,255,.3);color: #fff;border-radius: 5px;padding: 0 1.6em;
  line-height: 25px;display: inline-block;margin-left: 5px;}

.head-member .member-login a:hover,.head-member .member-exit a:hover{border-color: #ff6600;background-color: #ff6600;color: #fff;}
.head-member .member-login a.cn,.head-member .member-login a.en,.head-member .member-exit a.cn,.head-member .member-exit a.en{padding: 0;border: none;line-height: 0;float: right;overflow: hidden;height: 25px;transform: translateY(4px);}
.member-exit{color: #ccc;}
.head-member .member-login a.cn:hover,.head-member .member-login a.en:hover,.head-member .member-exit a.cn:hover,.head-member .member-exit a.en:hover{border-color: #ff6600;}
.head-member .member-login a.search_open,.head-member .member-exit a.search_open{border-radius: 55px;padding: 0 .5em;line-height: 25px;font-size: 20px;border: none;transform: translateY(3px);}





.member-exit{display: none;line-height: 30px;}

.member-exit a{margin-left: 10px;color: #888;}
.member-exit a:hover{color: #229a52;}
.head-member.current .member-exit{display: block;}
.head-member.current .member-login{display: none;}

.header.white .head-member .member-login a,.header.pos .head-member .member-login a,.header.light .head-member .member-login a{color: #333;border-color: rgba(0,0,0,.1)}
.header.white .head-member .member-login a:hover,.header.pos .head-member .member-login a:hover,.header.light .head-member .member-login a:hover{color: #fff;border-color: #ff6600;background-color: #ff6600;}

.header.white .head-member .member-exit a,.header.pos .head-member .member-exit a,.header.light .head-member .member-exit a{color: #333;border-color: rgba(0,0,0,.1)}
.header.white .head-member .member-exit a:hover,.header.pos .head-member .member-exit a:hover,.header.light .head-member .member-exit a:hover{color: #fff;border-color: #ff6600;background-color: #ff6600;}

.member-manage{position: relative;float: left;height: 48px;min-width: 200px;margin-top: -9px;}

.member-manage .member-cz{position: absolute;width: 100%;height: 0;transition-duration: 350ms;overflow: hidden;}
.member-manage:hover .member-cz{height: 241px;}
.member-manage span{margin-left: 20px;width: 48px;height: 48px;border-radius: 50%;overflow: hidden;display: inline-block;float: right;}
.member-manage span img{width: 48px;}
.member-manage .member-uesr{height: 48px;}
.member-manage .member-uesr p{display: inline-block;max-width: 200px;overflow: hidden;white-space: nowrap;
  text-overflow: ellipsis;font-family: 'Poppins-SemiBold';font-weight: bold;}
.header .head-member .member-exit .member-manage a{margin: 0;border: none;display: block;padding: 0 10px;line-height: 48px;border-radius: 0;}
.header .head-member .member-exit .member-manage:hover .member-uesr{color: #000;background: #fff;}

.header .head-member .member-exit .member-manage ul{background: #f0f0f0;padding: 0 10px 10px;border-top: 16px solid #fff;}
.header .head-member .member-exit .member-manage ul li{border-bottom: 1px solid #e0e0e0;}
.header .head-member .member-exit .member-manage ul li a{color: #000;background: #f0f0f0;line-height: 42px;display: block;border-radius: 0;}
.header .head-member .member-exit .member-manage ul li a:hover{color: #000;background: #fff;font-family: 'Poppins-SemiBold';font-weight: bold;}
.header .head-member .member-exit .member-manage ul li a i{margin-top: 11.5px;width: 20px;height: 20px;display: block;float: right;background: #e82828;color: #fff;line-height: 20px;text-align: center;border-radius: 50%;}

.header .head-member .member-exit .member-manage ul li.pointnum{line-height: 42px;height: 43px;padding: 0 20px;background: #fff;margin-left: -10px;margin-right: -10px;}
.header .head-member .member-exit .member-manage ul li.pointnum div{float: left;color: #000;}
.header .head-member .member-exit .member-manage ul li.pointnum div em{margin-left: 5px;font-size: 14px;color: #ff6600;font-family: 'Poppins-SemiBold';font-weight: bold;}
.header .head-member .member-exit .member-manage ul li .signday{float: right;margin-top: 8.5px;height: 25px;line-height: 25px;color: #fff !important;background: #03af39;padding: 0 10px;border-radius: 25px;font-family: 'Poppins-Light';font-weight: normal;}
.header .head-member .member-exit .member-manage ul li .signday:hover{background: #ff6600;}

.header .head-member .member-exit .member-manage ul li .signday.signed{background: #ddd !important;}

.submenu .tabsmenu{padding: 0 0 0 50px;border-bottom: 1px solid #e3e4e6;}
.submenu .tabsmenu li{margin: 0 50px 0 0;}
.submenu .tabsmenu a{line-height: 35px;display: block;font-size: 14px;}

.submore-menu,.submore-menu h2{text-align: left;}
.submenu .tabsmenu,.submore-menu .tab-container .content ul{justify-content: left;text-align: left;}
.submenu-title{padding: 0 50px;font-size: 30px;line-height: 1.4;padding-bottom: 20px}



.submenu{background: linear-gradient(
    to bottom, 
    transparent 40px, 
    #fff 40px
  );}
.submore-menu .tab-container{padding: 0 50px;overflow-y: auto;max-height: calc(100vh - 334px);}
.submore-menu .tab-container h2{font-size: 25px;padding: 30px 0 20px;}
.submore-menu .tab-container .content{padding-bottom: 30px;}
.submore-menu .tab-container .content ul{width: 100%;display: grid;grid-template-columns: repeat(5, 1fr);gap: 20px;}
.submore-menu .tab-container .content ul li{width: 100%;}
.submore-menu .tab-container .content .pic{margin-right: 10px;width: 50px;height: 50px;padding: 0;float: left;}
.submore-menu .tab-container .content ul li{line-height: 1.2;margin: 0;padding: 0;height: 50px;}
.submore-menu .tab-container .content ul li h4{margin: 15px 0 0;color: #000;font-family: 'Poppins-SemiBold';font-weight: bold;}
.submore-menu .tab-container .content ul li p{font-size: 12px;color: #aaa;}
.submore-menu .tab-container .content ul li:hover h4,.submore-menu .tab-container .content ul li:hover p{color: #ff6600;}
/*--------------------index---------------------*/

.glass-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10; /* 确保覆盖在文字/视频之上 */
    pointer-events: none; /* 不阻挡鼠标交互 */
    
    /* 毛玻璃核心样式 */
    background: rgba(0, 0, 0, 0.5); /* 稍微变暗 */
    backdrop-filter: blur(10px);    /* 强力模糊背景 */
    -webkit-backdrop-filter: blur(10px); /* Safari 兼容 */
    
    opacity: 0; /* 初始不可见 */
    transition: opacity 100ms; /* JS实时控制，禁用CSS过渡 */
    will-change: opacity;   /* 性能优化 */
}
.indexsection {
    transform-origin: center center; 
    will-change: transform, opacity; 
    transition: transform 0s, opacity 0s; 
}
.nav-dots {position: fixed;width: 30px;right: 30px;top: 50%;transform: translateY(-50%);z-index: 999; list-style: none;}
.nav-dot-item {width: 4px;height: 4px;background-color: rgba(255, 255, 255, 0.7);border-radius: 2px;margin: 15px 0;cursor: pointer;transition: all 0.3s;}
.nav-dots-black .nav-dot-item{background-color: rgba(0, 0, 0, 0.7);}
.nav-dot-item.active {width: 30px;background-color: #ff6600;}
.nav-dot-item:hover {background-color: #fff;}

/* 视频背景样式：覆盖全屏、水平居中 */
.index-bg-video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%; /* 宽度超出隐藏 */
    min-height: 100%; /* 高度为 100% */
    width: auto;
    height: auto;
    z-index: 0; /* 确保视频在底层 */
    transform: translate(-50%, -50%); /* 水平垂直居中 */
    object-fit: cover; /* 确保视频覆盖整个容器 */
}
.section1-txt{position: absolute;z-index: 1;right: 15%;top: 50%;height: 220px;margin-top: -110px;}
.section2-qianming{position: absolute;z-index: 1;right: 8%;bottom: 10%;height: 70px;}
#section3{background: #eef0ef;}
#section3 .wrap{height: calc(100vh - 428px);padding-top: 130px;position: relative;}
#section3 .wrap .section3-text{height: 85%;margin: 0 auto;display: block;max-height: 487px;position: relative;top: 50%;margin-top: -10%;}
.section3-qianming{position: absolute;top: 130px;left: 10%;height: 70px;}
#section3 .scrolling-row-container{margin: 0;height: 214px;}
#section3 .scrolling-content li{margin: 0;width: 214px;height: 214px;}
#section3 .scrolling-content li:hover{filter: grayscale(0%);}
#section3 .scrolling-content li .card-text{opacity: 0;}
#section3 .scrolling-content li:hover .card-text{opacity: 1;}
.index-bg-image {
    position: absolute;
    top: 50%;
    left: 50%;
    /* 宽高最少100%，确保全屏覆盖 */
    min-width: 100%;
    max-width: 1920px;
    width: auto;
    height: auto;
    z-index: 0;
    /* 垂直水平居中 */
    transform: translate(-50%, -50%); 
    /* object-fit: cover 确保在小屏上，图片不会按原尺寸显示，而是覆盖容器 */
    object-fit: cover; 
}

/* 文字内容容器：使用 Flex 布局实现垂直居中和水平对齐 */
.section-text-container {
    position: relative;
    z-index: 1; /* 确保内容在图片之上 */
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center; /* 垂直居中对齐 */
    width: 1400px;
    margin: 0 auto;
}
.indexsection .section-text-container{width: 85%;}

/* 内容包裹器：有设置宽度（例如，最大宽度 1200px）*/
.section-text-container .index-text-box{line-height: 1.5;}
.section-text-container .index-text-box h2{font-size: 40px;font-family: 'Poppins-SemiBold';font-weight: bold;color: #ff6600;}
.section-text-container .index-text-box h2 span{font-size: 40px;}
.section-text-container .index-text-box h3 span{font-size: 40px;}
.section-text-container .index-text-box h3{font-size: 40px;font-family: 'Poppins-SemiBold';font-weight: bold;color: #333;margin-bottom: 35px;}
.section-text-container .index-text-box p{font-size: 16px;color: #808080;line-height: 1.8;}
#section5 .section-text-container .index-text-box h3,#section5 .section-text-container .index-text-box p{color: #fff;}
.section-text-container .index-text-box img{margin-top: 45px;height: 17px;}
.section-text-container.text-left .index-text-box img{display: block;}
.section-text-container .index-text-box img.index-text-logo{height: 30px;margin-top: 30px;}

#section4 .section-text-container{width: 500px;}
#section4 .section-text-container .index-text-box{width: 490px;text-align: center;margin-top: -60%;}
.vmax-box-en #section4 .section-text-container{width: 800px;}
.vmax-box-en #section4 .section-text-container .index-text-box{width: 710px;margin-top: -32%;}
#section4 .section-text-container .index-text-box p{font-size: 24px;line-height: 50px;}
#section4 .section-text-container .index-text-box p img{margin: 13.5px 15px 0 0;height: 23px;}
#section4 .section-text-container .index-text-box .text-right img{margin: 15px 0 0 0;height: 17px;}
#section4 .section4-pro{height: 290px;position: absolute;right: 0;bottom: 10%;}
.vmax-box-en #section4 .section4-pro{right: 20%;}
/* 文本定位：5/7 屏靠右 */
.text-right {
    justify-content: flex-end; /* 文本容器靠右对齐 */
    text-align: right; /* 容器内的文本靠右对齐 */
}

/* 文本定位：6 屏靠左 */
.text-left {
    justify-content: flex-start; /* 文本容器靠左对齐 */
    text-align: left; /* 容器内的文本靠左对齐 */
}


.section8-deng{position: absolute;top: 20%;left: 10%;}
#section8 .section-text-container{width: 400px;}
.vmax-box-en #section8 .section-text-container{width: 500px;}
.section9-deng{position: absolute;top: 0;left: 5%;min-height: 820px;height: 93%;}
#section9 .index-text-box{position: absolute;right: 10%;top: 50%;margin-top: -140px;}

/* Section 10 风琴效果容器 */
#section10 .accordion-box {
    display: flex;
    width: 100%;
    height: 100%; /* 继承 section 的 100vh 高度 */
    overflow: hidden;
    background-color: #000; /* 黑色背景兜底 */
}

/* 单个风琴项 */
#section10 .accordion-item {
    position: relative;
    height: 100%;
    /* 默认状态：所有项平分宽度 (25%) */
    width: 25%; 
    /* 使用 flex-grow 和 width 过渡来实现平滑动画 */
    transition: width 0.5s ease-in-out;
    overflow: hidden;
    cursor: pointer;
    
    /* 背景图片设置 */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

}

#section10 .accordion-item:last-child {
    border-right: none;
}

/* ------------------------------------------------
   交互逻辑：利用 CSS 兄弟选择器实现宽度变化
   目标：展开项 44%，其余项自动填满剩余空间 (约18.6%)
   ------------------------------------------------ */

/* 当鼠标悬停在容器上时，所有项先变为收缩状态 (剩余宽度的平均值) */
#section10 .accordion-box:hover .accordion-item {
    width: 18.66%; /* (100% - 44%) / 3 ≈ 18.66% */
}

/* 只有当前被悬停的那个项变为展开状态 (44%) */
#section10 .accordion-box .accordion-item:hover {
    width: 44%;
}

/* ------------------------------------------------
   文字内容样式 (左下角)
   ------------------------------------------------ */
#section10 .acc-content {
    position: absolute;
    bottom: 60px;
    left: 40px;
    z-index: 2;
    color: #fff;
    opacity: 0.9;
    transition: opacity 0.3s ease, transform 0.3s ease;
    /* 稍微防止文字在快速切换时闪烁 */
    white-space: nowrap; 
}

/* 悬停时文字更亮一点，可选增加位移效果 */
#section10 .accordion-item:hover .acc-content {
    opacity: 1;
}

#section10 .acc-content h3 {
    font-size: 24px;
    letter-spacing: 5px;
}

#section10 .acc-content p {
    font-size: 12px;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.7);
}
.vmax-box-en #section10 .acc-content h3{letter-spacing: 0;}
/* 底部黑色渐变遮罩，确保文字在浅色背景上也清晰可见 */
#section10 .accordion-item::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40%; /* 遮罩占据底部 40% 高度 */
    background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
    pointer-events: none; /* 确保不影响点击 */
    z-index: 1;
}

/*-------------------- about ---------------------*/
.about-content{overflow: hidden;position: relative;}
.about-content img{min-width: 100%;left: 50%;transform: translateX(-50%);position: relative;}
#about-box4{background: #f6f7f9;}

#about-box1 .section-text-container{width: 550px;}
#about-box1 .section-text-container .index-text-box{width: 550px;text-align: center;margin-top: -50%;}
.vmax-box-en #about-box1 .section-text-container{width: 850px;}
.vmax-box-en #about-box1 .section-text-container .index-text-box{width: 850px;margin-top: -30%;}
#about-box1 .section-text-container .index-text-box p{font-size: 28px;line-height: 70px;}
.vmax-box-en #about-box1 .section-text-container .index-text-box p{letter-spacing: 0;}
#about-box1 .section-text-container .index-text-box p img{margin: 23.5px 15px 0 0;height: 25px;}
#about-box1 .section-text-container .index-text-box p:nth-child(3){color: #fff;font-family: 'Poppins-SemiBold';font-weight: bold;}
#about-box1 .section-text-container .index-text-box .text-right img{margin: 15px 0 0 0;height: 17px;}
#about-box1 .about1-pro{height: 10px;position: absolute;left: 50%;margin-left: -82px;bottom: 5%;}

#about-box2{background: #f8f8f8;}
#about-box2 .section-text-container{align-items: end;padding-bottom: 90px;}
#about-box2 .section-text-container .index-text-box{width: 750px;}
#about-box2 .section-text-container .index-text-box img{height: 25px;margin: 0 0 50px;}
#about-box2 .section-text-container .index-text-box h4{font-size: 16px;color: #000;font-family: 'Poppins-Light';font-weight: normal;letter-spacing: 0;padding-bottom: 25px;}
#about-box2 .section-text-container .index-text-box p{font-size: 14px;color: #666;padding-bottom: 20px;letter-spacing: 0;}

#about-box5 .section-text-container{display: block;padding: 135px 0 0;width: 1560px;}
#about-box5 .section-text-container .index-text-box{width: 100%;}
#about-box5 .section-text-container .index-text-box h3{font-size: 35px;font-family: 'Poppins-Light';font-weight: normal;margin: 0;}
#about-box5 .section-text-container .index-text-box p{font-size: 20px;color: #000;}
#about-box5 .section-text-container .index-text-box span{font-size: 35px;color: #ff6600;margin-left: 10px;}

.about-box5-logo {
    position: absolute;
    z-index: 1;
    right: 0;
    bottom: 30%;
    height: 220px;
}


/* 页面主容器 */
.about-wrapper {
  padding: 110px 0 0;
  width: 1560px;
    display: flex;
    flex-direction: column;
    gap: 30px;

}

/* 卡片通用样式 */
.about-card {
    padding: 30px 40px;
    border-radius: 15px;
    background-color: #fff;
    line-height: 1.6;
    height: 100%; /* 确保在 flex 或 grid 中能拉伸 */
    box-sizing: border-box;
}

/* --- 上部内容区域布局 (1:2.5 比例) --- */
.top-section {
    display: grid;
    /* 核心：设置两列，比例约为 1 份和 2.5 份 */
    grid-template-columns: 1fr 2.5fr; 
    gap: 30px;
}

/* 品牌定位 (橙色卡片) */
.brand-positioning {
    background-color: #ff6600; /* 橙色背景 */
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    justify-content: space-between;
}
.brand-positioning .content-text {
    font-size: 18px;
    line-height: 1.8;
    color: #fff;
}

/* 右侧 DNA 和 愿景/使命容器 */
.right-top-content {
    display: flex;
    background: #fff;
    padding-bottom: 30px;
    border-radius: 15px;
}

/* 品牌DNA */
.brand-dna {
    padding-left: 80px;
  width: 70%;
    display: grid;
    grid-template-areas: 
        "title title"
        "value slogan";
}
.brand-dna .title-main {
    grid-area: title;
}
.brand-dna .dna-group:nth-child(2) { /* 价值观 */
    grid-area: value;
}
.brand-dna .dna-group:nth-child(3) { /* 口号 */
    grid-area: slogan;
}


/* 品牌愿景使命 */
.brand-mission {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.brand-mission p {
    font-size: 14px;
}

/* --- 下部内容区域布局 (1:1 比例) --- */
.bottom-section {
    display: grid;
    /* 核心：设置两列，比例为 1 份和 1 份 */
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

/* 产品力创新体验 */
.product-innovation {
    /* 内部布局：主标题，内容分两列 */
}
.product-innovation .innovation-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px 30px;
}
.innovation-group.design {
    grid-column: 1 / 3; /* 懂感设计跨越两列 */
}

/* 信任状系统 (浅灰色卡片) */
.trust-system {
    background-color: #e6e6e6; /* 浅灰色背景 */
    padding: 0; /* 移除卡片内边距，让内部内容和图片自己控制 */
}

.trust-content {
    height: 100%;
}
.text-and-image {
    display: grid;
    /* 内部划分：文字部分和图片部分 */
    grid-template-columns: 1.2fr 1fr; 
    height: 100%;
}
.text-block {
    padding: 30px 30px 30px 60px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.text-block p {
    font-size: 16px;
    margin-top: 30px;
    line-height: 1.5;
}

/* 图片区域 */
.image-block {
    height: 100%; /* 占据父容器的高度 */
    overflow: hidden;
}
.person-img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 保持图片比例同时覆盖整个区域 */
    display: block;
}

/* --- 统一文字和颜色样式 --- */
.title-main {
    font-size: 30px;
    margin-top: 0;
    margin-bottom: 25px;
}

.about-card .title-main {
    padding-bottom: 15px;
    color: #000;
    position: relative;
}
.about-card.brand-positioning .title-main {
    color: #fff;
}
.about-card .title-main::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 5px;
    height: 3px;
    width: 58px;
    background: #ff6600;
    transition-duration: 350ms;
}

.title-sub {
    font-size: 22px;
    color: #ff6600;
    margin-top: 15px;
    margin-bottom: 10px;
}
.vmax-box-cn .title-sub{letter-spacing: 3px;}
.about-card p {
    font-size: 16px;
    color: #999;
    margin: 5px 0;
}



/*--------------------product---------------------*/


.pro-search{padding: 70px 0 ;}
/*--.pro-search.fixed{position: fixed;top: 62px;left: 0;width: 100%;z-index: 99;background: #f8f8f8;}---*/
.select-list{padding: 1em 0;border-bottom: 1px solid #eee;}
.pro-search h3{float: left;width: 7%;display: block;text-align: center;}
.pro-search h3 span{font-family: 'Poppins-Light';font-weight: normal;color: #222;display: block;}
.pro-search ul{float: left;width: 93%;}
.pro-search ul li{float: left;text-align: center;}
.pro-search ul li label{position: relative;display: block;overflow: hidden;border-radius: 50px;min-height: 33px}
.vmax-box-en .select-box0,.vmax-box-en .select-box1{}
.vmax-box-en .select-box0 h3,.vmax-box-en .select-box1 h3{}

.pro-search ul li input{display: none;}
.pro-search ul li .pro-icon-p0{position: absolute;top: 0;left: 0;width: 100%;display: block;cursor: pointer;}
.pro-search ul li i.pro-icon-pp-0{background: url(../images/pro_icon_pp1.jpg) no-repeat center center #fafafa;}
.pro-search ul li i.pro-icon-pp-1{background: url(../images/pro_icon_pp2.jpg) no-repeat center center #fafafa;}
.pro-search ul li i.pro-icon-pp-2{background: url(../images/pro_icon_pp3.jpg) no-repeat center center #fafafa;}
.pro-search ul li i.pro-icon-pp-4{background: url(../images/pro_icon_pp4.jpg) no-repeat center center #fafafa;}
.pro-search ul li i.pro-icon-pp-5{background: url(../images/pro_icon_pp5.jpg) no-repeat center center #fafafa;}
.pro-search ul li i.pro-icon-pp-6{background: url(../images/pro_icon_pp6.jpg) no-repeat center center #fafafa;}
.pro-search ul li i.pro-icon-pp-3{background: url(../images/pro_icon_pp7.jpg) no-repeat center center #fafafa;}
.pro-search ul li i.pro-icon-pp-7{background: url(../images/gongniu.jpg) no-repeat center center #fafafa;}
.pro-search ul li i.pro-icon-pp-8{background: url(../images/dongcheng.png) no-repeat center center #fafafa;background-size: 80%;}
.pro-search ul li i.pro-icon-pp-9{background: url(../images/jedver.png) no-repeat center center #fafafa;background-size: 80%;}
.pro-search ul li i.pro-icon-pp-10{background: url(../images/pro_icon_pp13.jpg?) no-repeat center center #fafafa;background-size: cover;}
.pro-search ul li i.pro-icon-pp-11{background: url(../images/hkk.png?) no-repeat center center #fafafa;background-size: 58%;}
.pro-search ul li i.pro-icon-pp-12{background: url(../images/dola.jpg?) no-repeat center center #fafafa;background-size: 75%;}
.select-box0 ul li:nth-child(8){display: none;}

.pro-search ul li.cur label i.pro-icon-pp-0{background: url(../images/pro_icon_pp1_on.jpg) no-repeat center center #ff6600;}
.pro-search ul li.cur label i.pro-icon-pp-1{background: url(../images/pro_icon_pp2_on.jpg) no-repeat center center #ff6600;}
.pro-search ul li.cur label i.pro-icon-pp-2{background: url(../images/pro_icon_pp3_on.jpg) no-repeat center center #ff6600;}
.pro-search ul li.cur label i.pro-icon-pp-4{background: url(../images/pro_icon_pp4_on.jpg) no-repeat center center #ff6600;}
.pro-search ul li.cur label i.pro-icon-pp-5{background: url(../images/pro_icon_pp5_on.jpg) no-repeat center center #ff6600;}
.pro-search ul li.cur label i.pro-icon-pp-6{background: url(../images/pro_icon_pp6_on.jpg) no-repeat center center #ff6600;}
.pro-search ul li.cur label i.pro-icon-pp-3{background: url(../images/pro_icon_pp7_on.jpg) no-repeat center center #ff6600;}
.pro-search ul li.cur label i.pro-icon-pp-7{background: url(../images/gongniu_on.jpg) no-repeat center center #ff6600;}
.pro-search ul li.cur label i.pro-icon-pp-8{background: url(../images/dongcheng_on.png) no-repeat center center #ff6600;background-size: 80%;}
.pro-search ul li.cur label i.pro-icon-pp-9{background: url(../images/jedver_on.png) no-repeat center center #ff6600;background-size: 80%;}
.pro-search ul li.cur label i.pro-icon-pp-10{background: url(../images/pro_icon_pp13_on.jpg) no-repeat center center #ff6600;background-size: cover;}
.pro-search ul li.cur label i.pro-icon-pp-11{background: url(../images/hkk_on.png) no-repeat center center #ff6600;background-size: 58%;}
.pro-search ul li.cur label i.pro-icon-pp-12{background: url(../images/dola_on.jpg?t=20250616) no-repeat center center #ff6600;background-size: 75%;}

.pro-search ul li label:hover{border: 1px solid #ff6600}
.pro-search ul li.cur label{background: #ff6600;color: #fff;border: none;}

.select-list li a{transition: all .3s; color: #222;display: block;padding: .2em 1.3em;border-radius: 50px;}
.select-list li:hover >a,.select-list li.on >a,.page-menu li:hover > a,.page-menu li.current >a{background: #ff6600; color: #fff;}

.select-box3 h3{margin-top: 0;}
.select-box3 li a{margin-top: 0;}
/* .select-box0{display: none;} */
/*.select-box1{display: none;}*/
.select-box3 li,.select-box4 li{float: none;}
.select-box3 h3{}
.select-box3 >ul li,.select-box4 >ul li{display: inline-block;}
.select-box3 >ul >li{display: none;}
.select-box3 >ul >li.on{display: list-item;}
.select-box3 >ul >li >a,.select-box4 >ul >li >a{display: none;}
.select-box3 >ul >li,.select-box4 >ul >li{width: 100%;}
.select-box3 >ul >li >ul,.select-box4 >ul >li >ul{width: 100%;}
.select-box3 >ul >li >ul >li{}
.select-box3 ul ul ul,.select-box4 ul ul ul{display: none;}
.select-box4 >ul >li >ul >li >a{display: none;}
.select-box4 >ul >li >ul >li{width: 100%;}
.select-box4 >ul >li >ul >li >ul{width: 100%;}
.select-box0 >ul > li{width: 8%;}


.vmax-box-en .select-box3 h3 .en,.vmax-box-en .select-box4 h3 .en,.vmax-box-cn .select-box3 h3 .cn,.vmax-box-en .select-box4 h3 .cn{
  display: block;
}
.vmax-box-en .select-box3 h3 .cn,.vmax-box-en .select-box4 h3 .cn,.vmax-box-cn .select-box3 h3 .en,.vmax-box-cn .select-box4 h3 .en{
  display: none;
}

.view-switch-main{display: flex; justify-content: flex-end;margin: 0 5% 40px;padding: 30px 5px;}
.view-switch-controls {
    display: flex;
    align-items: center;
    gap: 20px; /* 按钮之间的间距 */
}

/* 切换按钮基础样式 */
.switch-btn {
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
    border: none;
    background: none;
    cursor: pointer;
    font-size: 14px;
    color: #999; /* 默认颜色为灰色 */
    transition: color 0.3s;
}

/* Large 视图的圆点图标 */
.switch-btn .icon-dot {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    margin-left: 5px;
    background-color: #999;
    display: inline-block;
}

/* Small 视图的网格图标容器 */
.switch-btn .icon-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 两列网格布局 */
    grid-gap: 2px; /* 小点之间的间距 */
    width: 18px;
    height: 18px;
    margin-left: 5px;
}

/* Small 视图的网格中的每个小点 */
.switch-btn .icon-grid > span {
    width: 100%;
    height: 100%;
    background-color: #999; /* 默认灰色点 */
    border-radius: 50%; /* 圆形小点 */
    transition: background-color 0.3s;
}


/* --- 状态样式 --- */

/* 默认 Large 激活状态的样式 (Small 处于非激活状态) */
#largeViewBtn.active {
    color: #333; /* Large 激活时文字为黑色 */
}
#largeViewBtn.active .icon-dot {
    background-color: #333; /* Large 激活时圆点为黑色 */
}


/* Small 按钮未激活时的样式（默认加载或Large被激活时） */
#smallViewBtn {
    color: #999;
}
#smallViewBtn .icon-grid > span {
    background-color: #999; /* 默认灰色点 */
}


/* 激活状态：Small 按钮激活时的样式 */
#smallViewBtn.active {
    color: #000; /* 激活时文字为黑色 */
}
#smallViewBtn.active .icon-grid > span {
    background-color: #000; /* 激活时网格点为黑色 */
}

.product-list ul{display: grid;grid-template-columns: repeat(4, 1fr);gap: 10px;}
.product-list.small-8 ul{grid-template-columns: repeat(8, 1fr);gap: 5px;}
.product-list li{padding-bottom: 40px;}
.product-list.small-8 li{padding-bottom: 25px;}
.product-list li:nth-child(4n){margin-right: 0;}
.product-list li a{display: block;}
.product-list li span{display: flex;height: calc((90vw - 30px)/4*1.24); overflow: hidden;padding: 100px 90px;text-align: center;justify-content: center;align-items: center;background: #ededed;}
.product-list.small-8 li span{padding-bottom: 25px;height: calc((90vw - 35px)/8*1.24);padding: 50px 40px;}
.product-list li img{max-width: 100%;max-height: 100%;}
.product-list li p{padding: 10px 0;display: block;color: #000;font-size: 14px;line-height: 20px;}
.product-list li p i{display: block;color: #aaa;font-size: 12px;white-space: nowrap; /* 防止文本换行 */overflow: hidden;text-overflow: ellipsis;}

.product-list li a:hover span{border: 1px solid #ff6600;}
.product-list li a:hover img{transform: scale(1.15);}



.page-list{padding: 100px 0;text-align: center;}
.page-list li{margin: 0 5px;display: inline-block;}
.page-list li a{width: 30px;height: 30px;font-size: 14px;color: #ff6600;display: block;line-height: 30px;transition-duration: 350ms;border: 1px solid #ff6600;}
.page-list li.thisclass a,.page-list li:hover a{background: #ff6600;color: #fff;}


/*----- product-content -----*/
.video-container {width: 100%;max-width: 100%;overflow: hidden;}
.video-container video {display: block;width: 100%;height: auto;}

/* 整体布局容器 */
.product-viewer-section {
    display: flex;
    /* 确保内容从左到右排列 */
    justify-content: flex-start; 
    align-items: flex-start; /* 顶部对齐 */
    padding: 100px 0;
    background-color: #f7f7f7; 
    width: 100%; /* 确保占据全部宽度 */
    box-sizing: border-box;
}

/* 左侧信息和颜色选择 (40% 宽度) */
.product-info {
    flex-basis: 45%; 
    max-width: 45%; 
    padding: 60px 20px 60px 0;
    box-sizing: border-box;
}

/* 右侧 Swiper 轮播图区域 (60% 宽度) */
.product-image-slider {
    /* 10份中的6份 */
    flex-basis: 55%; 
    max-width: 55%; 
    height: 0;
    padding-top: 35%;
    position: relative;
    box-sizing: border-box;
}
.product-image-box{position: absolute;width: 100%;height: 100%;top: 0;left: 0;overflow: hidden;}

/* 标题和文字样式 (保持不变) */
.product-title {
    font-size: 30px;
    font-family: 'Poppins-Medium';font-weight: 500;
    color: #999;
}

.product-series {
    font-size: 30px;
    font-family: 'Poppins-Medium';font-weight: 500;
    margin-bottom: 200px;
}

/* 颜色选择器样式 (保持不变) */
.color-selector {
    display: flex;
    gap: 10px;
}

.color-block {
    outline: 1px solid #dcdddd; 
    width: 50px;
    height: 50px;
    cursor: pointer;
    box-sizing: border-box;
    transition-duration: 350ms;
}

/* 激活状态的样式：使用边框突出显示 */
.color-block.active {
    outline: 1px solid #333; 
    outline-offset: 1px;
}


/* Swiper 样式调整 (保持不变) */
.product-image-box .myImageSwiper ,.product-image-box .myColorSwiper {
    width: 100%;
    height: 100% !important;
    position: relative;
}
.product-image-box .swiper-container-autoheight .swiper-slide{height: 100% !important;}
.myImageSwiper .swiper-slide{display: flex;justify-content: center;align-items: center;}

.myImageSwiper img {
    max-width: 100%;
    max-height: 100%;
}
.pro-table-box {
    margin: 60px 0 20px;
    line-height: 30px;
}

.custom-pro-table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #eee;
    text-align: center;
}

.custom-pro-table thead tr {
    background-color: #FF6600; /* 橙色背景 */
    color: #ffffff;
}

.custom-pro-table th {
    padding: 15px 10px;
    font-weight: 500;
    font-size: 16px;
}

.custom-pro-table td {
    padding: 12px 10px;
    border-bottom: 1px solid #eee;
    color: #333;
    font-size: 16px;
}
.custom-pro-table td a{padding: 0 15px;background: #f60;color: #fff;line-height: 30px;display: inline-block;border-radius: 3px;}
.custom-pro-table td a.on{background: #f00;}
/* 导航按钮样式 (保持不变) */
.product-viewer-section .color-next,
.product-viewer-section .color-prev {
    width: 60px;
    height: 60px;
    z-index: 10;
    background: #d0d0d0;
    border-radius: 1px;
    transition-duration: 350ms;
    opacity: 0;
}
.product-viewer-section .product-image-slider:hover .color-next,.product-viewer-section .product-image-slider:hover .color-prev{opacity: 0.8;}
.product-viewer-section .color-prev{left: 10px;}
.product-viewer-section .color-next{right: 10px;}
.product-viewer-section .color-next:hover,
.product-viewer-section .color-prev:hover {
    background: #f60;
    opacity: 1;
}
.product-viewer-section .swiper-button-next:after, .product-viewer-section .swiper-button-prev:after{font-size: 20px;color: #fff;}

.pro-con-cover{display: none;}
/* 导航条基础样式 */
.product-nav {
    height: 60px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    background: #f8f8f8;
    width: 100%; /* 默认宽度 */
    z-index: 50; /* 确保在内容之上 */
    border-bottom: 1px solid #eee;
}

/* 粘性导航 FIXED 状态 (关键) */
.product-nav.is-fixed {

    position: fixed;
    top: 100px; /* 紧贴在 header (100px) 下方 */
    /* 必须在 JS 中动态设置宽度，以适应屏幕变化 */
}

.product-nav .nav-item {
    text-decoration: none;
    color: #333;
    padding: 0 20px;
    margin-right: 15px;
    position: relative;
    line-height: 60px;
    transition: color 0.3s;
    display: inline-block;
}

/* 导航激活/悬停状态 */
.product-nav .nav-item:hover,
.product-nav .nav-item.active {
    color: #f60; /* 选中时文字变色 */
}

/* 导航激活状态的下划线 */
.product-nav .nav-item::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;transform: translateX(-50%);
    height: 3px;
    width: 0;
    background-color: #f60;transition-duration: 350ms;
}
.product-nav .nav-item.active::after {
    width: 100%;
}

/* 4. 内容区块样式 (用于截图中的标题和段落) */
.content-section {
  color: #000;
}
.section-design{padding: 60px 0;border-bottom: 1px solid #e3e4e6;}
.section-design h2{font-size: 30px;}
.section-design h2::after{margin-top: 25px;content: '';display: block;height: 3px;background: #000;width: 90px;}
.pro-text-content{padding: 30px 0;display: grid;grid-template-columns: 1.5fr 1fr;gap: 50px 16.66%;}
.pro-text-content img{max-width: 100%;}
.pro-text-left{font-size: 16px;}
.pro-text-content h3{color: #f60;font-weight: normal;font-size: 20px;padding-bottom: 10px;text-align: left;}
.pro-text-content .pro-img-right{display: flex;align-items: flex-end;}
.pro-text-content .pro-img-right img{height: 28px;}
.pro-text-content .pro-text-left li{padding-left: 15px;position: relative;}
.pro-text-content .pro-text-left li::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -2.5px;
    height: 5px;
    width: 5px;
    border-radius: 50%;
    background-color: #f60;transition-duration: 350ms;
}
.pro-text-content .pro-text-left img{height: 60px;margin-top: 8px;}
.pro-text-content .pro-text-right img{width: 100%;max-height: 400px;margin-top: 8px;}
.procanshu-lit{text-align: center;}
.pro-text-content .pro-text-right ul{display: flex;gap: 10px;margin-top: 8px;}
.color-block2{
    width: 60px;
    height: 60px;
    cursor: pointer;
    box-sizing: border-box;
    transition-duration: 350ms;
    border: 1px solid #dcdddd;
}

.section-params{padding: 60px 0;}
.section-params h2{font-size: 25px;}

.section-details {
    width: 100%;
    position: relative;
    overflow: hidden;
}
.section-details img {width: 100%;}


.section-parts{background: #e4e4e4;padding: 60px 0 80px;}
/* 标题部分 */
.accessories-header {
    margin-bottom: 50px;
}

.accessories-header h2{
    font-size: 25px;
}

.accessories-header p{
    font-size: 18px;
}

/* 配件列表 Flex 容器 */
.accessories-list {
    display: flex;
    justify-content: center; /* 确保整体列表居中 */
    gap: 20px;
}

/* 配件项样式 */
.accessory-item {
    flex: 1 1 23%; /* 允许项目缩小和扩大，基础宽度约为 1/4 */
    text-align: center;
}

/* 图片容器样式 */
.accessory-item .item-image {
    background-color: #ffffff; /* 图片白色背景 */
    height: 320px; /* 假设固定高度来容纳图片 */
    display: flex;
    justify-content: center;
    align-items: center;
}

.accessory-item .item-image img {
    max-width: 100%;
    max-height: 100%;
    height: auto;
    display: block;
}

/* 型号文字样式 */
.accessory-item .item-model {
    font-size: 14px;
    font-weight: 400;
    color: #000000;
    line-height: 45px;
}


.section-related{padding: 60px 0 80px;}
/* 列表容器：控制可视区域和自定义滚动条 */
.products-scroll-wrapper {
    width: 100%;
}

/* --------------------------------- */
/* 滚动条定制 (仅 WebKit 浏览器有效，如 Chrome, Safari, Edge) */
/* 隐藏默认滚动条 */
.products-scroll-wrapper::-webkit-scrollbar {
    height: 0; /* 隐藏 WebKit 浏览器的主容器滚动条 */
}
.products-list.active-drag {
    cursor: grabbing; /* 鼠标按下时显示“抓取中”的光标 */
    user-select: none; /* 禁用文本选择，优化拖动体验 */
}
/* 实际滚动列表 (使用 flex，让所有项目保持在同一行) */
.products-list {
    display: flex;
    width: 100%; 
    overflow-x: scroll; /* 允许水平滚动 */
    padding-bottom: 60px;
    gap: 20px;
    cursor: grab;
}

/* 整个滚动条的宽度/高度 */
.products-list::-webkit-scrollbar {
    height: 5px; /* 设置滚动条高度为 3px */
}

/* 滚动条背景轨道 */
.products-list::-webkit-scrollbar-track {
    background: #f1f1f1; /* 轨道背景色可以设浅一点 */
}

/* 滚动条上的滑块 */
.products-list::-webkit-scrollbar-thumb {
    background-color: #f60; /* 滑块颜色 */
    border-radius: 3px; /* 圆角效果 */
}
/* 产品项 */
.product-item {
/*    flex: 0 0 calc((1425px - 40px) / 3);
    width: calc((1425px - 40px) / 3);*/
    text-align: center;
    box-sizing: border-box;
    background-color: #ededed; 
}
.product-item a {
    user-select: none;
    -webkit-user-select: none; /* 针对 WebKit 浏览器 */
    -moz-user-select: none; /* 针对 Firefox */
    -ms-user-select: none; /* 针对 IE/Edge */
    -webkit-tap-highlight-color: transparent; /* 移除移动端点击高亮 */
}
.product-item .item-image {
    width: 410px;
    height: calc((1425px - 40px) / 4); /* 假设固定高度 */
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 80px;
}

.product-item .item-image img {
    max-height: 100%;
    max-width: 100%;
}

.product-item .item-model {
    font-size: 16px;
    line-height: 60px;
}


/*-------------------- 设计中心 ---------------------*/
.section-title {
            text-align: center;
            font-size: 35px;
            margin: 40px 0;
            font-family: 'Poppins-SemiBold';font-weight: bold;
        }

/* 容器样式 */
.scrolling-row-container {
    position: relative;
    margin: 0 auto 30px;
    width: 100%; /* 使用百分比使其自适应 */
    height: calc(100vw / 7); /* 增加高度以容纳文字描述 */
    min-height: 200px;
    overflow: hidden;
    box-sizing: border-box;
}

/* ---------------------------------
   第二行（双数行）靠右对齐
--------------------------------- */
/* 关键：将内容推到右侧 */
.scrolling-row-container:nth-child(2n) { 
    display: flex;
    justify-content: flex-end; 
}

/* 滚动内容 UL 样式 */
.scrolling-content {
    position: absolute;
    top: 0;
    left: 0;
    /* 宽度由 JS 设置 */
}

.scrolling-content li {
    float: left;
    list-style: none;
    width: calc(100vw / 7); /* 调整卡片宽度 */
    height: calc(100vw / 7); /* 调整卡片高度 */
    min-width: 200px;
    min-height: 200px;
    box-sizing: border-box;
    /* 为卡片添加右侧间距 */
    margin-right: 30px; 
    cursor: pointer;
    transition: transform 0.2s;
    background: #f0f4f5;
}

.scrolling-content li:hover {

}

/* 卡片内容样式 */
.card-content {
    position: relative;
    flex-direction: column;
    height: 100%;
}

/* 图片区域 */
.card-image {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
}

.card-image img {
    max-width: 100%;
    max-height: 100%;
}

/* 文字描述区域 */
.card-text {
    position: absolute;
    width: 84%;
    left: 8%;
    bottom: 8%;
    text-align: center;
    padding: 5px;
    background: #fff;
    color: #888;
    transition-duration: 350ms;
}
.card-content:hover .card-text{background: #ff6600;color: #fff;}
.card-text .name {
    font-family: 'Poppins-SemiBold';font-weight: bold;
    font-size: 16px;
    color: #333;
}

.card-text .title {
    font-size: 12px;
}


.designer-main-scrolling-row-container {width: 100%;overflow: hidden;position: relative;margin-bottom: 20px;}
.designer-main-scrolling-content {display: flex;list-style: none;padding: 0;margin: 0;position: relative;will-change: transform;}
.designer-main-scrolling-content li { flex: 0 0 auto; margin-right: 20px; }
.designer-main-card-content {transform: scale(0);opacity: 0;transition: transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.6s;position: relative;}.designer-main-card-content.active { transform: scale(1); opacity: 1; }
.designer-main-card-image img { width: calc((100vw - 100px)/6); height: calc((100vw - 100px)/6); object-fit: cover; display: block; }
@media screen and (max-width: 1800px) {
    .designer-main-card-image img{width: calc((100vw - 80px)/5); height: calc((100vw - 80px)/5);}
}
.designer-main-card-text{position: absolute;width: 84%;left: 8%;bottom: 25px;text-align: center;padding: 15px 10px;background: #fff;color: #888;transition-duration: 350ms;}
.designer-main-scrolling-content li:hover .designer-main-card-text{background: #ff6600;color: #fff;}
.designer-main-card-text .name {font-family: 'Poppins-SemiBold';font-weight: bold;font-size: 16px;color: #333;}
.designer-main-card-text .title {font-size: 12px;}


.design-content{padding: 50px 0 0;display: grid;grid-template-columns: repeat(2, 1fr);gap: 60px;position: relative;}
.design-right{display: flex;flex-direction: column;height: 100%;
    justify-content: space-between;gap: 20px;}
.design-close{border-radius: 50%;border: 3px solid #999;width: 40px;height: 40px;padding: 4px;display: block;position: absolute;right: 0;top: 0;}
.design-close img{width: 100%;}
.design-title h2 {
            font-size: 36px;
            font-family: 'Poppins-SemiBold';font-weight: bold;
            color: #000;
            line-height: 1.45;
        }

        .design-title span {
            font-size: 24px;
            color: #f60; /* 橙红色 */
            font-weight: 400;
        }
.design-content img{max-width: 100%;}
.design-contact-box,.design-content-box2{font-size: 20px;}
.design-contact-box i,.design-contact-box2 i{width: 20px;height: 20px;display: block;background: #ff6600;margin-top: 10px;}
.design-content-box img,.design-content-box2 img{width: 120px;margin-bottom: 10px;}
.design-content-box2 p{line-height: 24px;display: flex;font-size: 14px;}
.design-content-box2 span{width: 12px;height: 10px;display: block;padding: 6px;box-sizing: unset;}
.design-content-box2 span img{width: 12px;margin: 0;display: block;}
/*-------------------- 项目案例 ---------------------*/
.anli-list .wrap{width: 1360px;padding: 0;}
.anli-list ul{display: grid;grid-template-columns: repeat(3, 1fr);gap: 35px;}
.anli-list ul li a{display: block;position: relative;}
.anli-list ul li span{display: block; overflow: hidden;}
.anli-list ul li img{width: 100%;}

.anli-list ul li p{display: block;color: #fff;font-size: 16px;position: absolute;top: 0;width: 100%;height: 100%;background: rgba(255, 102, 0, 0.8);text-align: center;
  align-content: center;align-items: center;opacity: 0;transition-duration: 350ms;}
.anli-list ul li:hover p{opacity: 1;}


/*-------------------- 项目内页 ---------------------*/
.content-title{text-align: center}
.content-title h2{font-size: 30px;line-height: 2.5;}
.content-title span{font-size: 14px;}
.content-con-box,.content-con-box p{font-size: 16px;}

.article-pagelist{margin: 100px 0 50px;padding: 20px 0;border-top: 1px solid #e0e0e0;}
.article-pagelist a{display: block;line-height: 30px;margin: 20px 0;}


/*-------------------- 下载 ---------------------*/
.donwload-list .wrap{width: 1380px;padding: 0;margin: 0 auto;}
.donwload-list ul{display: grid;grid-template-columns: repeat(3, 1fr);gap: 40px;}
/* 修改点 1：设置 li 的固定高度和内边距 */
.donwload-list ul li {
    height: 285px; /* 设置li的高度 */
    padding: 30px 30px; /* 设置上下的内边距，保持总高度 */
    display: flex; /* 确保 li 内的卡片能正确排列 */
    background: #f7f7f7;
    border-radius: 5px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);transition-duration: 350ms;
}
.donwload-list ul li:hover{transform: translateY(-5px);}

/* 修改点 2：将产品卡片设置为 Flex 容器，实现左右布局 */
.donwload-product-card {
    display: flex; 
    flex-direction: row; /* 横向排列 */
    align-items: center; /* 垂直居中对齐 */
    width: 100%; /* 充满 li */
}

/* 新增样式：左侧内容容器，负责容纳文字和按钮 */
.donwload-card-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* 使标题、描述、按钮分布更合理 */
    flex: 1; /* 占据剩余的大部分空间 */
    height: 100%; /* 充满父容器 */
    padding-right: 20px; /* 与图片之间留出间距 */
}

/* 修改点 3：调整卡片描述样式，确保文本溢出时隐藏 */
.donwload-card-description {
    font-size: 10px;
    color: #666;
    line-height: 1.6;
    /* 限制描述行数，适应固定高度 */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3; /* 限制为 3 行，可根据实际内容调整 */
    overflow: hidden;
}

/* 修改点 4：图片容器只占据右侧空间，并固定宽度 */
.donwload-card-image-wrapper {
    overflow: hidden;
    width: 180px; /* 固定图片容器宽度，例如 180px */
    height: 225px; /* 图片高度稍小于 li 的总高 285px - 60px padding */
    margin: 0; /* 移除原来的 margin-bottom */
    flex-shrink: 0; /* 不允许被压缩 */
}

/* 按钮操作容器：确保按钮在底部 */
.donwload-card-actions {
    display: flex;
    gap: 15px;
    margin-top: auto; /* 保持不变，确保在左侧内容的底部 */
}

/* 其他样式保持不变 */
.donwload-card-title {font-size: 18px;font-family: 'Poppins-SemiBold';font-weight: bold;color: #333;margin-top: 0;margin-bottom: 10px;line-height: 1.4;}
.donwload-card-image {width: auto;height: 100%;object-fit: contain; transition: transform 350ms;}

.donwload-card-actions a {padding: 0 12px;background-color: #ddd;color: #666;line-height: 24px;height: 24px;font-size: 10px;border-radius: 5px;}
.donwload-card-actions a:hover {background-color: #ff6600;color: #fff;}

/*-------------------- 全屋 ---------------------*/

/* 页面整体容器和背景设置 */
.lighting-solution-container {
  position: relative;
  text-align: center;
  padding-bottom: 150px;
}
.lighting-solution-container h2{font-size: 30px;;text-align: center;line-height: 6;}
/* 标题样式 */


/* 内容区域布局：使用 Flexbox 实现左右箭头和中间内容对齐 */
.content-wrapper {
  display: flex;
  align-items: center; /* 垂直居中对齐箭头 */
  justify-content: space-between;
  width: 100%;
  gap: 30px;
}

/* 左右箭头样式 */
.arrow {
  font-size: 30px;
  color: #999; /* 箭头颜色 */
  cursor: pointer;
  padding: 0 15px;
  user-select: none; /* 避免选中 */
}

/* 中间展示区域，包含 3D 模型和底部导航 */
.isometric-display {
  flex-grow: 1; /* 占据中间所有可用空间 */
  position: relative;
  /* 实际项目中这里可能需要一个巨大的白色背景或图片 */
  width: calc(100% - 480px);
  background-color: #f7f7f7; /* 模拟图片中的浅灰色/白色背景 */
}

/* 底部导航菜单容器 */
.room-nav {
  position: absolute;
  bottom: 0;
  right: 0;
  display: flex;
  padding: 10px 0;
  background-color: var(--bg-color);
  border-top: 1px solid var(--border-color); /* 模拟底部分隔线 */
}

/* 底部导航项 (A标签) */
.room-nav .nav-item {
  color: #999;
  text-decoration: none;
  font-size: 14px;
  margin: 0 15px;
  line-height: 30px;
  cursor: pointer;
  position: relative;
  transition: color 0.3s;
  display: inline-block;
}

/* 当前选中状态样式 */
.room-nav .nav-item.active ,.room-nav .nav-item:hover{
  color: #000;
}

/* 底部下划线效果 */
.room-nav .nav-item::after ,.room-nav .nav-item::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: -5%;
  height: 3px;
  width: 0;
  background-color: #ff6600;
  transition-duration: 350ms;
}
.room-nav .nav-item.active::after ,.room-nav .nav-item:hover::after {
  width: 110%;
}

/* 右侧产品信息面板 */
.product-info-panel {
  background: #fff;
  width: 450px;
  margin-left: 20px;
  padding: 20px 20px 40px;
  height: 500px; /* 固定高度，使内容超出 */
  display: flex;
  flex-direction: column;
}

.product-info-panel .panel-title {
  font-size: 16px;
  font-family: 'Poppins-SemiBold';font-weight: bold;
  text-align: center;
  margin-top: 0;
  margin-bottom: 10px;
}

/* 产品列表滚动容器 */
.product-list-scroll {
  flex-grow: 1;
  overflow-x: hidden;
  overflow-y: auto; /* 允许垂直滚动 */
  padding-right: 10px; /* 为滚动条留出空间 */
}

/* 产品分组样式 */
.product-group {
  text-align: left;
  padding-right:30px;

}

.product-group:last-child {
  border-bottom: none;
}

.product-group .group-name {
  font-size: 12px;
  color: #000;
  margin-bottom: 5px;
}
.product-group .group-name i{width: calc(100% - 60px);height: 1px;background: #ddd;display: inline-block;float: right;margin-top: 10px;}
.gl-product-item{margin-left: 50px;padding: 5px 0;border-bottom: 1px solid #ddd;}
.gl-product-item a{
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.gl-product-item .product-name {
  font-size: 12px;
  color: #000;
  line-height: 1.2;
}
.gl-product-item .product-name em{display: block;color: #ccc;}

.gl-product-item .product-img {
  height: 85px;
}


.ligthing-page a{text-indent: -9999px;width: 50px;height: 50px;border-radius: 50%;display: block;border: 1px solid #ff6600;position: absolute;top: 50%;margin-top: -25px;}
.ligthing-page a:nth-child(1){background: url(../images/qwleft.png) no-repeat center center;background-size: 30px;left: -60px;}
.ligthing-page a:nth-child(2){background: url(../images/qwright.png) no-repeat center center;background-size: 30px;right: -60px;}
/* --- 滚动条样式定制 --- */

/* 针对 WebKit 浏览器 (Chrome, Safari) */
.product-list-scroll::-webkit-scrollbar {
  width: 6px; /* 滚动条宽度 */
}

.product-list-scroll::-webkit-scrollbar-track {
  background: transparent; /* 轨道背景透明 */
}

.product-list-scroll::-webkit-scrollbar-thumb {
  background-color: #ff6600; /* 滚动图颜色 #ff6600 */
  border-radius: 3px;
}

/* 针对 Firefox 浏览器 (滚动条定制有限) */
.product-list-scroll {
  scrollbar-color: #ff6600 transparent; /* thumb track */
  scrollbar-width: thin;
}


/*-------------------- 文章栏目 ---------------------*/
.page-title{padding: 20px 0 40px;text-align: center;line-height: 2.2;color: #333;}
.page-title h2{font-size: 35px;
    font-family: 'Poppins-SemiBold';font-weight: bold;
    text-align: center;}
.page-title p{font-size: 20px;}


/* 容器布局 */
.event-listing-dynamic {
    max-width: 1400px;
    margin: 0 auto;
    padding: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

.event-card {
    grid-column: span 2;
}

/* 通用内容样式 */
.event-date-box span {
    background-color: #dcdedd;
    color: #333;
    font-size: 12px;
    font-family: 'Poppins-Light';font-weight: normal;
    display: inline-block;
    padding: 5px 20px;
    border-radius: 20px;
    margin-top: 0;
    margin-bottom: 25px;
}

.event-title {
    font-size: 20px;
    font-family: 'Poppins-SemiBold';font-weight: bold;
    color: #000;
    margin-top: 0;
    margin-bottom: 10px;
    line-height: 1.3;
}

.event-description {
    font-size: 14px;
    color: #333;
    line-height: 1.5;
    margin-top: 0;
    margin-bottom: 15px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.view-more {
    font-size: 16px;
    color: #000;
    text-decoration: none;
    font-family: 'Poppins-Light';font-weight: normal;
    padding-bottom: 2px;
    display: inline-block;
}


/* 全宽布局 (1, 2, 5...) */
.event-full-width a{
    padding: 20px 20px;
    display: flex;
    min-height: 200px;
    border-bottom: 1px solid #e0e0e0;
    gap: 30px;
    transition-duration: 350ms;
}
.event-full-width a:hover{transform: translateY(-10px);box-shadow: 0 10px 40px rgba(0,0,0,0.2);}
.event-full-width .event-details {
  padding: 10px;
    display: flex;
    text-align: left;
    flex-direction: column;
    justify-content: space-between;
    width: 50%;
}

.event-full-width .event-image {
    width: 50%;
    overflow: hidden;
}

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

/* 半宽并列布局 (3 和 4) */

.event-listing-dynamic .event-card:nth-child(3),
.event-listing-dynamic .event-card:nth-child(4) {
    grid-column: span 1;
}
.event-listing-dynamic .event-card:nth-child(3) a,
.event-listing-dynamic .event-card:nth-child(4) a{

    /* 核心修正：设置为 Flexbox 容器，并纵向排列 */
    display: flex;
    flex-direction: column;
    
    border-bottom: 1px solid #e0e0e0;
    padding: 0; /* 移除全宽的 padding */
    min-height: auto; /* 重置最小高度 */
}

/* 修正：让图片在上方 */
.event-listing-dynamic .event-card:nth-child(3) .event-image,
.event-listing-dynamic .event-card:nth-child(4) .event-image {
    width: 100%;
    height: 250px;
    overflow: hidden;
    /* 确保图片在 flex-direction: column 下排在上面 */
    order: 1; 
}

/* 修正：让文字区域在下方 */
.event-listing-dynamic .event-card:nth-child(3) .event-details,
.event-listing-dynamic .event-card:nth-child(4) .event-details {
    width: 100%;
    /* 确保文字区域在 flex-direction: column 下排在下面 */
    order: 2; 
    padding: 20px 10px; /* 为半宽卡片文字区域添加垂直内边距 */
    /* 移除全宽布局中的 width: 50% */
}

.event-listing-dynamic .event-card:nth-child(3) .event-image img,
.event-listing-dynamic .event-card:nth-child(4) .event-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/*--------------------footer---------------------*/
.footer-bg{background: url(../images/footerbg.webp) no-repeat center top;background-size: cover;}
/* 订阅区域容器 */
.subscription-section {

    text-align: center;
    color: #fff; /* 白色文字 */
}

/* 英文标题样式 */
.subscribe-title {
    font-size: 40px;
    padding: 160px 0 60px;
    line-height: 1.3;
}

/* 表单容器 */
.email-form {
    display: flex;
    justify-content: center;
}

/* 输入框和按钮的组合容器 */
.input-group {
    width: 100%;
    max-width: 700px;
    height: 75px;
    background-color: rgba(255, 255, 255, 0.1); /* 核心: 半透明的灰色层效果 */
    border-radius: 50px; /* 圆角效果 */
    display: flex;
    align-items: center;
    overflow: hidden; /* 确保子元素在圆角内 */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

/* 邮箱输入框 */
.email-input {
    flex-grow: 1; /* 占据大部分空间 */
    height: 100%;
    padding: 0 30px;
    border: none;
    outline: none;
    background: transparent; /* 透明背景 */
    color: #fff;
    font-size: 18px;
}

/* 提交按钮 */
.submit-button {
    width: 75px; /* 宽度和高度一致，形成圆形区域 */
    height: 100%;
    border: none;
    color: #fff;
    font-size: 24px;
    background: none;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.footer-top{min-width:1260px;  padding: 140px 0 56px;color: #fff;text-align: center;}
.footer-menu ul.footer-ul{display: flex;gap: 5%;}
.footer-menu li.foot-menu-li{text-align:left;width: 25%;}
.footer-menu li.foot-li-remove3{display: none;}
.footer-menu ul.footer-ul ul ul{display: none;}

.footer-menu li i{width: 0;height: 2px;display: block;background: #fff;transition-duration: 350ms;}
.footer-menu li.foot-menu-li a:hover i{width: 100%;}
.footer-menu li a{color: #e05d04;}
.footer-menu li h2{font-size: 18px;line-height: 40px;margin-bottom: 30px;}

.footer-menu ul.footer-ul ul{display: grid;grid-template-columns: repeat(2, 1fr);gap: 5px;}
.footer-menu ul.footer-ul ul li{line-height: 16px;padding-bottom: 15px;}
.footer-menu ul.footer-ul ul a{color: #fff;font-size: 12px;}
.footer-menu ul ul ul{
display: none;
}


.footer-send{float: right;width: 300px;}
.footer-send h2{color: #fff;font-size: 14px;line-height: 37px;text-align: left;}
.footer-send textarea{margin-top: 12px;padding: 10px 5%;width: 90%;height: 70px;background: #2f2f2f;color: #8f8f8f;border: none;outline: none;line-height: 20px;}
.footer-send input{padding: 0 5%;margin-top: 12px;width: 90%;height: 33px;line-height: 33px;background: #2f2f2f;color: #8f8f8f;}
.footer-send input.submit{width: 100%;height: 37px;line-height: 37px;color: #fff;font-family: 'Poppins-SemiBold';font-weight: bold;background: #17a93b;cursor: pointer;}

.footer-icon{padding-top: 80px;}

.footer-bottom{min-width:1260px;color: #fff;line-height: 90px;text-align: center;border-top: 1px solid #353535;}
.footer-bottom p{display: none;}
.footer-bottom a{color: #464646;transition: all .3s;}
.footer-bottom a:hover{color: #ff6600;}
.footer-bottom.cn p.cn,.footer-bottom.en p.en{display: inline-block;}

.social-share-list {
  float: left;
  width: 420px;
  list-style: none;
  padding: 90px 0 0;
  margin: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.social-share-list li {
  margin: 0 15px;
}

.social-share-list li a {
  display: block;
}

.social-share-list li img {
  width: 20px;
  height: 20px;
  object-fit: contain;
}
.footer-share{margin: 35px 0;height: 120px;}
.footer-share .fr img{height: 120px;}

.vmax-box-cn .vmax-member-cn,.vmax-box-en .vmax-member-en{display: block;}
.vmax-box-en .vmax-member-cn,.vmax-box-cn .vmax-member-en{display: none;}

.attention{padding-top: 5px;line-height: 18px;color: #ff6600;background: url(../images/member/attention.png)left 7px no-repeat;text-align: left;padding-left: 20px;display: none;clear: both;padding-bottom: 10px;}



@font-face{
    font-family: Poppins-Light;
    src: url(../font/Poppins-Light.otf);
}
@font-face{
    font-family: Poppins-Medium;
    src: url(../font/Poppins-Medium.otf);
}
@font-face{
    font-family: Poppins-MediumItalic;
    src: url(../font/Poppins-MediumItalic.otf);
}
@font-face{
    font-family: Poppins-SemiBold;
    src: url(../font/Poppins-SemiBold.otf);
}
@font-face{
    font-family: Poppins-SemiBoldItalic;
    src: url(../font/Poppins-SemiBoldItalic.otf);
}

.down{text-align: center;color: #fff;padding: 80px 0}
.downtit{padding-bottom: 4em;font-family: 'Poppins-SemiBold';font-weight: bold;font-size: 16px;}
.downicon{display: block;margin-bottom: 1em}
.downicon img{max-width: 84px}
.dlinks li{display: inline-block;background-color: #fff;border-radius: 50px;clear: both;padding: 0 2em 0 0;margin: 0 1em}
.dlinks li *,.dlinks li{transition: 400ms;}
.dlinks li a{color: #e60012;display: block;line-height: 3;transition: 100ms;}
.dlinks li svg{float: left;padding: .7em;box-sizing: border-box;margin: 0 .5em}
.vmax-box-cn .down .en{display: none;}
.vmax-box-en .down .cn{display: none;}
.dlinks li:hover{background-color: #e60012}
.dlinks li a:hover,.dlinks li:hover a {color: #fff;}
.dlinks li:hover svg path{fill: #fff !important}

.a720{position: absolute;top: 20px;left: 50%;transform: translateX(-47%);border: none;}
.righta,.lefta{width: 78%;height: 100vh;float: left;}
.lefta{position: relative;}
.righta{width: 22%;background-color: #fafafa;padding:  1%}
.righta .rightcon{height: 90%;}
.righta .rightcon p{text-align: center;border-radius: 10px;margin-bottom: 15px;overflow: hidden;background-color: #fff;}

.righta .rightcon img{max-width: 100%}
.tabcon{display: none;}
.tabcon .flex li{width: 25%;vertical-align: middle;padding: 15px}
.tabcon .flex li a{display: block;position: relative;background-color: #000;border-radius: 10px;overflow: hidden;}
.tabcon .flex li a h5{position: absolute;bottom: 0;left: 0;right: 0;padding: 2em;width: 100%;color: #fff;font-size: 16px}
.tabcon .flex li a .pic{opacity: .5;}
.tabcon .flex li a .pic img{width: 100%}
.tabcon .flex li a:hover .pic{opacity: 1;}

.gcbg{min-height: 500px;background-image: url(../images/about5.jpg);background-size: cover;}

.cati{font-size: 20px;}
.cati .icon2{font-size: 2.8rem}
.cati span{display: inline-block;margin-top: 40px;}
.icon194 span:before{content: '\e64d';font-family: "iconfont";font-size: 50px}
.icon195 span:before{content: '\e603';font-family: "iconfont";font-size: 55px}

.app1{
  background-image: url(../images/app1.jpg);
  background-size: cover;height: calc(100vh);
}
.app1 .bannertxt3{left: 50%;transform: translate(0);top: 50px;}
.app1 .bannertxt3 img{width: 600px}
.app1 .down{transform: translate(0);left: 50%;width: 500px;margin: 0;bottom: 50px}


.app2{
  background-image: url(../images/app2.jpg);
  background-size: cover;height: calc(100vh);
}
.app2 .bannertxt3{left: 50%;transform: translate(0);top: 200px;width: 500px;color: #fff;}
.app2 .bannertxt3 h1{font-family: 'Poppins-SemiBold';font-weight: bold;font-size: 35px}
.app2 .bannertxt3 img{width: 600px}
.app2 .down{transform: translate(0);left: 50%;width: 500px;margin: 0;bottom: 50px}


    .tico190:before{content:'\e60d';font-size:2.3rem; }
    .tico191:before{content:'\e61c' }
    .tico192:before{content:'\e836' }
    .tico193:before{content:'\e632' }
    .tico194:before{content:'\e60d';font-size:2.3rem; }
    .tico195:before{content:'\e603' }
    .tico207:before{content:'\e920' }
    .tico208:before{content:'\e61c' }
    .tico209:before{content:'\e6b8' }
    .tico210:before{content:'\e682' }
    .tico211:before{content:'\e628';font-size:3rem }
    .tico212:before{content:'\e674' }
    .tico213:before{content:'\e69a';font-size:2.8rem }
    .tico214:before{content:'\e836' }
    .tico215:before{content:'\e620' }
    .tico216:before{content:'\e603' }
    .tico217:before{content:'\e632' }
    .tico218:before{content:'\e60e' }
    .tico219:before{content:'\e6d9' }
    .tico220:before{content:'\e606' }    
    .tico243:before{content:'\e608' }    
    .tico244:before{content:'\e604' }
    .tit h1.green,.tit h1.green span{color: #ff6600 }


.pro-share-left{width: 240px;float: right;margin-top: 10px;}
.sku-tag{}
.sku-tag a{height: 40px;line-height: 40px;background: #fff;padding: 0 25px;border-radius: 40px;display: inline-block;margin: 0 15px 15px 0;}
.sku-tag a:hover,.sku-tag a.on{background: #03af39;color: #fff;}
.sku-content{display: none;padding: 15px 0;margin: 15px 0 25px;border-top: 1px solid #e5e5e5;border-bottom: 1px solid #e5e5e5;}
.sku-content.cur{display: block;}


.vmax-send-main {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
     display: none; 
}

.vmax-send-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
}

.vmax-send {
    position: relative;
    z-index: 10000;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    
    width: 90%;
    max-width: 400px;
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.vmax-send h2 {
    font-size: 20px;
    color: #333;
    margin-bottom: 20px;
    text-align: center;
}

.vmax-send li {
    list-style: none;
    margin-bottom: 15px;
}

.vmax-send input[type="text"],
.vmax-send textarea {
    width: 100%;
    padding: 10px;
    float: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    font-size: 14px;
    transition: border-color 0.3s;
}

.vmax-send input[type="text"]:focus,
.vmax-send textarea:focus {
    border-color: #03af39;
    outline: none;
}

.vmax-send textarea {
    resize: vertical;
    min-height: 100px;
}

.vmax-send .attention {
    
    color: #e74c3c;
    margin-top: 5px;
    display: none;
}

.vmax-send .submit.foot-submit {
    display: block;
    width: 100%;
    padding: 12px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 16px;
    font-family: 'Poppins-SemiBold';font-weight: bold;
    
    background-color: #03af39;
    color: #fff;
    
    transition: background-color 0.3s;
    margin-top: 10px;
}

.vmax-send .submit.foot-submit:hover {
    background-color: #029a33;
}


/* --- 固定侧边导航栏样式 --- */
.fixed-sidebar {
    position: fixed; /* 固定定位 */
    bottom: 0;
    right: 0;
    width: 35px; /* 侧边栏宽度 */
    background-color: #000; /* 黑色背景 */
    z-index: 1000; /* 确保在其他内容之上 */
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* 导航项通用样式 */
.sidebar-item {
    width: 35px; /* 宽度与侧边栏一致 */
    height: 35px; /* 每个项的高度 */
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: background-color 0.2s; /* 颜色过渡 */
}

/* 鼠标经过颜色为 f60 */
.sidebar-item:hover {
    background-color: #ff6600;
    color: #fff;
}
.sidebar-item:hover span{color: #fff;}
/* EN 文字样式 */
.item-text {
    color: #fff; /* 白色文字 */
    font-size: 16px;
}

/* 图标样式 */
.sidebar-item img {
    width: 15px; 
}
.printopen{display: none;}
/* --- 全屏搜索弹窗样式 --- */
.fullscreen-search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* 黑色透明层 */
    z-index: 99999; /* 确保在最顶层 */
    display: none; /* 默认隐藏 */
    justify-content: center;
    align-items: center;
}

/* 搜索内容容器 - 修改为 Flex 布局 */
.search-content {
    width: 80%;
    max-width: 700px; /* 稍微增加最大宽度以适应按钮 */
    position: relative;
    display: flex; /* 使用 Flex 布局 */
    align-items: stretch; /* 让子元素在高度上拉伸 */
    border-radius: 5px; /* 统一边角 */
    overflow: hidden; /* 确保子元素不会溢出圆角 */
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
}

/* 搜索输入框 */
.search-input {
    flex-grow: 1; /* 输入框占据剩余空间 */
    padding: 15px 20px;
    font-size: 20px;
    border: none; /* 移除边框 */
    outline: none; /* 移除焦点边框 */
    background-color: #fff;
}

/* 搜索按钮容器 */
.search-button-container {
  width: 70px;
    background: url(../images/soushuo.png) no-repeat center center #ff6600;
    background-size: 30px;
    padding: 0 20px; /* 左右内边距 */
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: background-color 0.2s;
}

.search-button-container:hover {
    background-color: #ff6600; /* 鼠标悬停变暗 */
}



/* 容器布局 */
.video-main .wrap {
  margin: 0 auto;
  width: 1400px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 0;
}

/* 左侧导航随屏移动逻辑 */
.video-menu {
    width: 280px;
    position: -webkit-sticky;
    position: sticky;
    /* 顶部导航100px + 20px间距 = 120px */
    top: 120px; 
    flex-shrink: 0;
    background: #fff;
    z-index: 99;
    text-align: center;
}

.video-menu li {
    list-style: none;
    border-bottom: 1px solid #eee;
}

.video-menu li a {
    display: block;
    padding: 15px 20px;
    font-size: 15px;
    color: #333;
    transition: all 0.3s;
}

.video-menu li a:hover,
.video-menu li.current a {
    background-color: #ff6600;
    color: #fff;
}

/* 右侧视频列表排版 */
.video-content{flex: 1;
    margin-left: 40px;}
.video-list {
    flex: 1;
    margin-left: 40px;
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 一行三列 */
    gap: 30px 16px;
}

.video-product-card {
    transition: all 0.3s;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.video-thumb {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 9 / 14.4; /* 锁定视频比例 */
    overflow: hidden;
    background: #000;
}

.video-thumb video {
    width: 100%;
    object-fit: cover;
}


.play-btn {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.2);
    opacity: 0;
    transition: 0.3s;
}

.video-thumb:hover .play-btn {
    opacity: 1;
}

.play-btn i {
    font-size: 40px;
    color: #fff;
}

.video-txt {
    padding: 15px 10px;
    color: #231916;
}

.video-txt h3 {
    font-size: 14px;
    margin-bottom: 8px;
    line-height: 1.4;
    overflow: hidden;
}

.video-txt p {
    font-size: 10px;
    line-height: 1.5;
    margin-bottom: 5px;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* 描述文字最多显示两行 */
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.video-date {
    font-size: 12px;
    color: #898989;
    line-height: 22px;
}
.video-date i{width: 1px;height: 12px;display: inline-block;margin: 0 5px;background: #898989;transform: translateY(2px);}
.video-product-card{transition-duration: 350ms;}
.video-product-card:hover{transform: translateY(-10px);box-shadow: 0 10px 40px rgba(0,0,0,0.2);background: #fff;}

@media (min-width: 1800px) {
    .footer-menu ul.footer-ul{gap: 10%;}
    #about-box2 .section-text-container{padding-bottom: 12%;}
    #about-box2 .index-bg-image{top: 35%;}
}