@import url(./base.css);
/******************header*******************/
header{
    padding: 0% 10%;
    background-color: #eeeeee26;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height:100px;
    box-shadow: 0 0 5px rgba(0,0,0,.2);
    position: fixed;
    width: 100%;
    z-index: 999;
    color: #fff;
    backdrop-filter: blur(3px);
    border-bottom: 1px solid #fff;
}
header::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: translateY(-100%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.8) 100%);
    z-index: 997;
    pointer-events: none;
    transition: all 0.53s ease-in-out; /* 修正1：拼写错误 & 指定过渡属性 */
    will-change: height; /* 可选：优化动画性能 */
}
/**产品下拉**/
.menu_down_pro {
    /* display: none; */
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 2;
    width: 100%;
    border-radius: 5px;
}

header .menu ul.menu-0>li:has(.menu_down_pro){position: static}
.sub_wrap2 {
    display: flex;
    display: -ms-flexbox;
    display: -webkit-flex;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -webkit-justify-content: space-between;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
}
.menu_down_pro_con {
    width: 1200px;
    margin: 0 auto;
    background: #fff;
}
.menu_down_pro_bars {
    width: 338px;
    border-right: 1px solid #DFDFDF;
    padding: 27px 0;
}
.menu_down_pro_tabs {
    width: calc(100% - 338px);
}
.menu_down_pro_bars .item {
    display: flex;
    display: -ms-flexbox;
    display: -webkit-flex;
    align-items: center;
    -webkit-align-items: center;
    -ms-align-items: center;
    height: 40px;
    color: #444;
    padding: 0 30px;
}
.menu_down_pro_bars .item .icon {
    width: 18px;
    font-size: 14px;
}
.menu_down_pro_bars .item .tt {
    width: calc(100% - 18px);
}
.menu_down_pro_tabs_l a {
    width: 48%;
    line-height: 30px;
    color: #444;
}
.menu_down_pro_bars .item:hover {
    color: #fff;
    background: var(--color-primary);
}
.menu_down_pro_tabs_item a{color: #666;transition: 0.5s all;font-size: 14px;}
.menu_down_pro_tabs_item a:hover{color: var(--color-primary);transform: translateX(-5px)}
.menu_down_pro_tabs_l {
    width: 451px;
    border-right: 1px solid #DFDFDF;
    padding: 27px 40px;
    display: flex;
    display: -ms-flexbox;
    display: -webkit-flex;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -webkit-justify-content: space-between;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
}
.menu_down_pro_tabs_r {
    width: 411px;
    padding: 40px 30px 20px;
}
.menu_down_pro_tabs_r a .pic {
    overflow: hidden;
    margin-bottom: 14px;
}
.menu_down_pro_tabs_r a .pic img {
    width: 100%;
}
.menu_down_pro_tabs_r a .tt_box {
    display: flex;
    display: -ms-flexbox;
    display: -webkit-flex;
    align-items: center;
    -webkit-align-items: center;
    -ms-align-items: center;
}
 .menu-0>li>a:after{
     content: "";
     display: block;
     position: absolute;
     left: 50%;
     bottom: 0px;
     width: 0px;
     height: 0px;
     border-left-width: 15px;
     border-right-width: 15px;
     border-top-width: 0px;
     border-bottom-width: 13px;
     transform: translate(-50%, 0px);
     opacity: 0;
     border-style: solid;
     border-color: transparent transparent rgb(255, 255, 255);
     transition: 0.5s;
 }

.menu-0>li:hover a:after, .menu-0>li.active a:after{
    opacity:1;
}

header.scrolled::after{
    height: 100%;
    transform: translateY(0%);
    z-index: 997;
}
header.scrolled .menu{
    color:#000
}
header.scrolled .other{
    color:#000
}
header.scrolled .searchbox i{
    color:#000
}
header.scrolled .menu ul:not(.menu-0){
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.8) 100%);
}
header .logo{font-size: 24px; font-weight: bold;z-index: 998;}
header .menu{align-self: stretch;font-size: 16px;text-transform: capitalize;z-index: 998;}
header .other,header .searchbox{z-index: 998;}
header .menu ul.menu-0{display: flex;align-items: center;gap: 20px;height: 100%;}
header .menu ul.menu-0>li{padding: 0% 10px;display: flex;position: relative;align-items: center;align-items: center;height: 100%;width: max-content}
header .menu ul.menu-0>li>a{height: 100%;display: flex;justify-content: center;align-items: center;position: relative}
header .menu ul:not(.menu-0){visibility: hidden;position: absolute;opacity: 0;top: 100%;left: 50%;transform: translate(-50%,10px);background-color: #eeeeee8a;width: max-content;transition: 0.5s ease-in-out;}
header .menu ul.menu-0>li:hover .dropdown-menu-1{visibility: visible;transform: translate(-50%,0px);opacity: 1;}
header .menu ul.menu-0>li .menu_down_pro{visibility: hidden;opacity: 0;transition: 0.5s all;}
header .menu ul.menu-0>li:hover .menu_down_pro{visibility: visible;opacity: 1;}
header .menu ul.dropdown-menu-1>li{padding: 5px 20px;border-bottom: 1px solid #999;}
header .menu ul.dropdown-menu-1>li:hover{background-color: #fff;color: #333;}

.searchbox .input-group{position: fixed;left: 0;right: 0;top: 0;bottom: 0;height:100vh;background: #000000b5;z-index: 9999;display: flex; /* 需要这个才能生效justify-content/align-items */justify-content: center;align-items: center;overflow: auto; /* 允许遮罩层内部滚动 */}
#search-keyword{height: 40px;padding-left: 0;padding-right: 0;background: 0 0;border-bottom: 1px solid #e4e4e4;box-sizing: border-box;margin: 0;border-radius: 0;font: inherit;overflow: visible;-webkit-appearance: none;width:50%;vertical-align: middle;color: #fff;font-size: 36px;transition: .2s ease-in-out;transition-property: color, background-color, border-color, box-shadow;}

input{
    background-color: transparent !important;
    transition: background-color 5000s ease-in-out 0s !important; /* 延长过渡时间对抗浏览器默认 */

}
/******************banner*******************/
.banner .pic{
    width: 100%;
    overflow: hidden;
}
.banner .pic img{
    transition: all 0.5s ease-in-out;
}
.banner img{
    width: 100%;
}
.banner{
    position: relative;
}
.banner .pic .wenzi{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: #fff;
    font-size: 68px;
    text-align: center;
    width: max-content;
}
.banner .pic .wenzi a{
    width: 170px;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000;
    margin: 20px auto;
    font-size: 18px;
    color: #fff;
}
.banner .wenzi h5{
    position: relative;
    padding-right: 30px;
}
.banner .wenzi h5::after{
    content: "";
    position: absolute;
    top: 4px;
    left: 85%;
    transform: translateX(-50%);
    width: 1px;
    height: 15px;
    background-color: #eee;
}

.warp{
    max-width: 1440px;
    margin: 0 auto;
}

.index-about{
    margin-top: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 60px;
}
.index-about .l{width: 45%;}
.index-about .l h3{font-size: 18px; color: #cc3333}

.index-about .l h2{font-size: 44px;color: #333;line-height: 1.1;margin: 20px 0 30px;font-family: '苹方';font-weight: bold;    text-transform: unset;}
.index-about .l  .desc{font-size: 17px;color: #666;text-indent: 2em;line-height: 2;}
.index-about .l  .desc a{ color: #cc3333;}
.index-about .other{margin-top: 40px;}
.index-about .other dl{display: flex;justify-content: flex-start;align-items: center;gap: 24px;margin-bottom: 40px;}
.index-about .other dt{width: 100px;flex-shrink: 0;}
.index-about .other dt img{width: 100%;}
.index-about .other dd h3{font-size: 25px;color: #000;font-weight: 500;}
.index-about .other dd p{font-size: 16px;color: #666;}

.index-category{margin: 80px 0;}
.index-category .tit{ font-size: 60px;color: 000;text-align: center;margin-bottom: 40px;}
.index-category .tit h3{font-size: 30px;margin-top: 20px;}
.index-category .swiper-category h2{font-size: 28px;text-transform: capitalize;text-align: center;padding: 10px 0;}



.form {margin-top: 80px;height: 589px;position: relative;overflow: auto;}
.form .bg{position: absolute;width: 100%;height: 100%;background: var(--bgurl) no-repeat center / cover;background-attachment: fixed; /* 确保背景固定 */}
.form .formbox {transition: .2s all;position: absolute;top: 50%;right: 20%;transform: translate(10%, -50%);width: 520px;height: 359px;background-color: #fff;padding: 50px;background: rgb(255 255 255 / 60%);backdrop-filter: blur(10px);}
.form .formbox h3 {font-size: 36px;font-weight: 400;font-family: 'Butler Bold';}
.form .formbox .input {position: relative;margin-top: 30px;}
.form .formbox input {width: 100%;height: 42px;border: none;background: none;padding: 0 20px;outline: none;border: 1px solid var(--color-primary);border-radius: 30px;}
.form .formbox button {position: absolute;top: 0;right: 0;width: 164px;height: 42px;background:linear-gradient(to bottom ,var(--color-primary) , #fff) ;color: #fff;border-radius: 30px;text-transform: uppercase;border: none;}
.form .title {font-size: 48px;font-weight: 400;margin-bottom: 30px;}
.formbox:focus-within {transform: translate(50%, -50%) scale(1.1);}

.index-merit{margin:80px;}
.swiper-merit img{display: block;margin: 0 auto 20px;}
.swiper-merit {text-align: center;}
.swiper-merit h2{font-size: 16px;text-transform: uppercase;}
.swiper-merit h3{font-size: 14px;text-transform: unset;color: #333;}



.index-news{margin: 80px 0;}
.index-news .tit{ font-size: 60px;color: 000;text-align: center;margin-bottom: 70px;}
.index-news .swiper-news h2{color: #999;}
.index-news .date{color: #999;}
.index-news .swiper-slide img{border-bottom: 10px solid #fff;transition: 0.5s all;}
.index-news .swiper-slide:hover img{border-bottom: 10px solid var(--color-primary);}
.index-news .swiper-slide:hover h2{color: var(--color-primary);}
.index-news .swiper-slide:hover .date{color: var(--color-primary);}

.index .more{  display: block;  width: 170px;  height: 70px;  display: flex;  justify-content: center;  align-items: center;  border: 3px solid var(--color-primary);  margin: 20px auto;  font-size: 18px;   color: #000;}
.index .more h5{ position: relative; padding-right: 30px;}
.index .more h5::after{    content: "";    position: absolute;    top: 11%;    left: 85%;    transform: translateX(-50%);    width: 1px;    height: 20px;    background-color: #666;}
.index .more:hover{background-color: var(--color-primary);color: #fff;border-color:#fff ;}
.index .more:hover h5::after{background-color: #fff;}


footer{  background-color: #333333; color: #fff; padding: 127px 10% 0px; }
footer .t{  display: flex;  justify-content: space-between; align-items:flex-start;}
footer dd  i{ display: inline-block; padding: 4px;}
footer dt{font-size: 20px;color: #fff;text-transform: capitalize;margin-bottom: 30px}
footer dd{font-size: 16px;color: #999;line-height: 2;text-transform: capitalize;}
footer .b{border-top: 1px solid #999;padding: 20px;margin-top: 100px;text-align: center;}

/******************产品列表页面*******************/
.list-product{background-color:#f3f3f3;}
.tab-content .pic img { width: 100%; object-fit: cover; height: 100%;mix-blend-mode: multiply;}
.tab-content{position: relative;  display: none;}
.tab-contents .flags  {position: absolute;top: 0;left: 0;display: flex;gap: 10px; padding: 20px; z-index: 100;color: #fff;}
.tab-content{position: absolute;inset: 0; opacity: 1;padding-bottom: var(--ratio);height: 0;transition: 0.5s ease-in;background: #eee;}
.tab-content.active {position: relative;    z-index: 1;display: block}


/******************侧边栏*******************/
.leftsearch .form-control,
.leftsearch .input-group-text {  border-radius: 1.5rem; background-color: #fff}
.leftsearch  #search-keyword{  display: block; width: 100%;padding: 0.375rem 0.75rem;font-size: 14px;font-weight: 400;line-height: 1.5;color:#333;background-color: #fff;background-clip: padding-box;border: 1px solid  #999;border-right: none;-webkit-appearance: none;-moz-appearance: none;appearance: none;border-radius: 0.375rem;transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;border-top-right-radius: 0;border-bottom-right-radius: 0;}
.leftsearch .input-group-text{display: flex;align-items: center;padding: 0.375rem 0.75rem;font-size: 1rem;font-weight: 400;line-height: 1.5;color: #333;text-align: center;white-space: nowrap;background-color: #eee;border: 1px solid #999;border-radius: 0.375rem;border-top-left-radius: 0;border-bottom-left-radius: 0;}

.leftborder{border: 1px solid var(--cprimary);}
.leftsidetitle{position: relative;}
.leftsidetitle .title{ position: relative; z-index: 2; line-height: 3.25rem;font-size: 1rem;}
.leftsidetitle .title span{ display: inline-block; margin:0 0;font-size:1rem; font-family: var(--titlefamily); font-weight: 600;}
.leftsidecategorylist ul li{position: relative;border-bottom: 1px solid var(--cprimary);}
.leftsidecategorylist ul li a{ padding: 0.5rem 1rem; line-height: 2rem; display: block;}
.leftsidecategorylist ul li a i{ float: right;line-height: 2rem; }
.leftsidenewslist ul li a{ padding: 0.25rem 1rem; line-height: 2rem; display: block;}
.leftsidekeywordslist ul li{ margin: 0.25rem 0;}
.leftsidekeywordslist ul li a{display: block;text-align: center;font-size: 14px;color:var(--lightWords);line-height: 2rem;border: 1px dashed var(--cprimary);}
.leftsidekeywordslist ul li a:hover {color:var(--hongse); border-color: var(--hongse);}
.leftsidecontactlist{ line-height: 2rem;}

.menuTree ul{}
.menuTree li{line-height:3rem;color:var(--lvse); display:block;position:relative;}
.menuTree li:after{ position:absolute;content: "";display: block;height:1px;width:100%;border-bottom: 1px dashed var(--footerwords);left: 0; top: 2.9375rem;}
.menuTree li a{font-size: 16px;line-height:3rem;height:3rem;overflow:hidden; position:relative;color:var(--color-grey );white-space:nowrap;text-overflow:ellipsis;word-break:break-all;border-bottom:1px dashed var(--color-bg);padding:0 0.25rem;}
.menuTree li a::before{ display: inline-block;content: ""; height: 1rem; width: 1rem; border: 1px solid var(--color-grey ); margin-right: 0.75rem;}
.menuTree ul li a.active::before{ background-color: var(--color-text );}
.menuTree ul ul a{font-size: 12px;color: #666}
.menuTree li i{ display:block; float:right; color:var(--color-grey ); font-size:24px; width: 20px; height: 45px; line-height: 45px; text-align: center; font-style: normal; position: absolute; top: 0; right: -3px; cursor: pointer;}
.menuTree li.parent>i.parent::after{content: "+"; display: block;}
.menuTree li.parent.expanded>i.parent::after{content: "-"; display: block;}
.menuTree ul li ul li a{line-height:3rem;height:3rem;overflow:hidden;color:var(--color-grey );white-space:nowrap;text-overflow:ellipsis;word-break: break-all; display:block;padding:0 0.25rem 0 2rem;}
.menuTree ul li ul li a:hover,.menuTree ul li a.active{color:var(--color-grey );/*text-decoration:underline;*/}
.menuTree ul li ul li ul li a{padding:0 0.25rem 0 3rem;}
.menuTree ul li ul li ul li ul li a{padding:0 0.25rem 0 3rem;}

/******************关于我们页面*******************/
.page-about .block1 h3{font-size: 44px;line-height: 1.2;margin-bottom: 10px;color: #333;}
.page-about .block1  a{display: inline-block;width: 200px;height: 50px;display: inline-flex;justify-content: center;align-items: center;border: 1px solid #333333;border-radius: 50px;}
.page-about .block1  a:first-of-type{margin-right: 20px;}
.page-about .block1  a:first-of-type{background-color:#121c27;color: #fff;}
.page-about .block1  a:hover{background-color: var(--color-primary);color: #fff;border-color:#fff ;}

.page-about .block1 .desc p{margin-bottom: 20px;color: #666666;}
.page-about .block1 .content{margin-bottom: 20px;color: #666666;padding-right: 30%;}
.page-about .block1 .tit {font-size: 24px;color: #333;}
.page-about .swiper-button-next{width: 42px;height: 23px;color: red;bottom: 5px;top: auto;    left: 100px; right: auto;}
.page-about .swiper-button-prev{width: 42px;height: 23px;color: red;bottom: 5px;top: auto;}
.page-about .swiper-button-prev i ,.swiper-button-next i{font-size: 24px;color: #999;}
.page-about .swiper-button-next::after,.swiper-button-prev::after{display: none;}

.block1>div:first-of-type{position: relative;overflow: hidden;}
.block1>div:first-of-type::after{animation:scalc infinite 5s ; z-index: -1; content: '';  width: 600px;height:600px;position: absolute; border-radius: 50%;border:1px solid #999; position: absolute;top: -20%;right: -20%;}
.block1>div:first-of-type::before{animation:scalc infinite 5s ;z-index: -1;  content: ''; width: 400px;height:400px;position: absolute; border-radius: 50%;border:1px solid #999; position: absolute;top: -20%;right: -20%;}
.page-about .bgpic {height: 100vh; background-attachment: fixed;}
.page-about .block4 .r{padding-right: 14%;}
.page-about .block4 dd{font-size: 24px;color: #333;padding: 10px 0;border-bottom: 1px solid #999;margin-bottom: 30px;line-height: 2;}
.page-about .block4 .tit{font-size: 44px;color: #000;margin-bottom: 30px;}
@keyframes scalc {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.25);
    }
    100% {
        transform: scale(1);
    }
}

/******************新闻详情页面*******************/
.show-article .blog-title h3{font-size: 44px;line-height: 1.2;margin-bottom: 10px;color: #333}
/******************产品详情页面*******************/

.zoomContainer { z-index: 99999;}
.product__wrapper {display: flex;align-items: flex-start;gap: 30px;}

/* 容器整体布局 */
.product__details__pic {width: 50%;max-width: 700px;position: relative;}

/* 主图 Swiper */
.productImageSwiper { overflow: hidden; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);}
.productImageSwiper .swiper-slide img {width: 100%;height: auto;transition: transform 0.3s ease-in-out;}
.productImageSwiper .swiper-slide img:hover { transform: scale(1.05);}
.productImageSwiper img {cursor: zoom-in;}
/* 缩略图 Swiper */
.thumbnailSwiper {padding: 10px 2px;}
.thumbnailSwiper .swiper-slide {width: 100px;height: 140px;overflow: hidden;cursor: pointer;transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;}
.thumbnailSwiper .swiper-slide img {width: 100%;height: 100%;object-fit: cover;}
.thumbnailSwiper .swiper-slide-thumb-active {transform: scale(1.01);box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);border: 2px solid var(--color-primary);}

/* Swiper 按钮样式 */
.show-pruduct .swiper-button-next,
.show-pruduct .swiper-button-prev {color: var(--color-primary);border-radius: 50%;width: 36px;height: 36px;display: flex;align-items: center;justify-content: center;transition: background 0.3s ease-in-out;}
.show-pruduct .swiper-button-next:hover,
.show-pruduct .swiper-button-prev:hover {background: var(--color-primary);color: #fff;}
.show-pruduct [thumbsSlider] {padding: 10px;overflow: hidden;position: relative;margin-top:10px;}
/* 隐藏无效的按钮 */
.show-pruduct .swiper-button-disabled {opacity: 0.3;cursor: not-allowed;}
.producttitle,.productcolor{border-bottom: 1px solid #eee;}
.productcolor .title{ font-size: 1.125rem;}
.producttitle .modelno{ font-size: 1.875rem; line-height: 120%;}
.producttitle .title{ font-size: 1.875rem; line-height: 120%;}
.producttitle .subtitle{ font-size: 1.875rem; line-height: 120%;}
.productcolor .productcolorlist ul li{ border-radius: 50%; padding: 0.125rem; border: 1px solid var(--white);}
.productcolor .productcolorlist ul li.active{ border-color: var(--words);}
.productcolor .productcolorlist ul li a{   width: 30px;height: 30px; border-radius: 50%; overflow: hidden; line-height: 1.5; display: block; display: block;   text-indent: -9999px}
.product-button button{ background-color: var(--lanse); line-height: 3rem; color: var(--white); border-radius: 0.5rem; font-weight: bold; border: none; overflow: hidden;}
.product-button button:after{content:""; z-index: 1; background-color: var(--hongse);width:0; position: absolute; top: 0; left:0; height: 100%;-webkit-transition:.3s;-moz-transition:.3s;transition:.3s;}
.product-button button:hover:after{width:100% }

.show-product .publish_time{background: #eee;padding: 4px;border-left: 6px solid #999;color: #999;}
.productcolor {margin-top: 20px;}
.productcolorlist a{transition: 0.5s all;display:block;outline: none;}
.productcolorlist a:focus {box-shadow:0px 0px 0px 3px #fff, 0px 0px 0px 5px var(--color); }
.show-product .tab-content{position:relative;opacity:1;transition:all 0.3s ease-in-out;}
.show-product .product__details__tab img{display: inline-block;}
.product__details__tab .title{font-size: 20px;line-height: 120%;padding: 10px 0;color: #999;border-bottom: 1px solid #eee;}
/**新闻列表**/
.list-article .pic{position: relative;height: 0;overflow: hidden;}
.list-article .pic img{width: 100%;height: 100%;object-fit: cover;display: block;position: absolute;left: 0;transition: 0.5s all; animation: scaleImg  forwards 10s;}
.description {line-height: 2;}
.list-article .picturebox .more{margin-top: 10px;background-color: rgba(29, 29, 29, .05);color: #676767;backdrop-filter: blur(9px);-webkit-backdrop-filter: blur(9px);border: 1px solid #dfdfdf;padding: 7px 15px;border-radius: 20px;vertical-align: middle;font-size: 14px;display: inline-block;border-color: rgb(206, 206, 206);transition: all 0.3s ease-in-out;}
.list-article .picturebox:hover .more{background-color: var(--color-primary);color: #fff;}

/**新闻详情**/
.showtitle {font-size: 36px;line-height: 1.2;margin-bottom: 10px;}
.showsubtitle {font-size: 16px;line-height: 1.2;margin-bottom: 10px; border-bottom: 1px dashed #eee; padding-bottom: 10px;}
.shangxia{border-top:1px #eee dotted;border-bottom:1px #eee dotted;padding:.5rem 0}
.likearticle .likearticlelist ul li {line-height: 30px;margin-bottom: 5px;padding-bottom: 5px;}
.show p{font-size: 16px;line-height: 2;color: #666;text-indent: 2em;margin-bottom: 20px;}

/** weihzi.html **/
.weihzhibg {background: #f3f3f3;}
.weihzhibg li {padding: 0 10px; position: relative;}
.weihzhibg li::after{position: absolute;content: '';width: 80%; height: 2px;background-color:#f3f3f3;left: 50%;bottom: -20px; transform: translateX(-50%);visibility: hidden;}
.weihzhibg li.active::after{background-color: #999;visibility: visible;}
.weihzhibg li a{display: block;line-height: 2rem;}
.weihzhibg li:not(:last-of-type)::before{content: "";position: absolute;top: 50%;right: 0;width: 2px;height: 13px;background-color: #ddd;z-index: -1;transform: translateY(-50%);}

/*****************list-image.html*******************/
.list-image #main .pic{position: relative;height: 0;overflow: hidden;}
.list-image #main .pic img{width: 100%;height: 100%;object-fit: cover;display: block;position: absolute;left: 0;transition: 0.5s all;}
.list-image #main .pic::after{position: absolute ; content: '';width: 100%;height: 100%;background-color: rgba(0,0,0,.2);top: 0;left: 0;pointer-events: none;visibility: hidden;}
.list-image #main .pic::before {position: absolute;content:"\e627";width: 100%;height: 100%;background-color: rgba(0, 0, 0, .2);top: 0;left: 0;z-index: 99;display: flex  ;justify-content: center;align-items: center;font-size: 60px;color: #fff;visibility: hidden;}
.list-image #main .pic:hover::after,.list-image #main .pic:hover::before{visibility: visible;}
.list-image #main .pic:hover img{transform: scale(1.05);transition: all .3s;}
/*****************list.html*******************/
.list #main .pic{position: relative;height: 0;overflow: hidden;}
.list #main .pic img{width: 100%;height: 100%;object-fit: cover;display: block;position: absolute;left: 0;transition: 0.5s all;}
.list #main .pic::after{position: absolute ; content: '';width: 100%;height: 100%;background-color: rgba(0,0,0,.2);top: 0;left: 0;pointer-events: none;visibility: hidden;}
.list #main .pic::before {position: absolute;content:"\e627";width: 100%;height: 100%;background-color: rgba(0, 0, 0, .2);top: 0;left: 0;z-index: 99;display: flex  ;justify-content: center;align-items: center;font-size: 60px;color: #fff;visibility: hidden;}
.list #main .pic:hover::after,.list-image #main .pic:hover::before{visibility: visible;}
.list #main .pic:hover img{transform: scale(1.05);transition: all .3s;}

/** 联系我们 **/
.map-con .map {  height: 600px;   z-index: 1;}
.messagetitle h3{font-size: 32px;}
.messagetitle p{font-size: 16px;color: #666;}
.messagebox  .form-group label {display: none;margin-bottom: 5px;}
.messagebox  .form-group input,.messagebox  .form-group textarea{width: 100%;padding: 10px;border: 1px solid #ddd;outline: none;transition: all .3s;}
.messagebox  .w-1\/2 {   width: 49%;}
.submitbtn{background-color: var(--color-primary);color: #fff;}
.submitbtn:hover{opacity: 0.8;}

/** list-video.html **/
.videobox .video{position: relative;height: 0;overflow: hidden;}
.videobox video{width: 100%;height: 100%;object-fit: cover;display: block;position: absolute;left: 0;transition: 0.5s all;}
.videobox:hover video{transform: scale(1.05);transition: all .3s;}
.videobox:hover .more {background:var(--color-primary); color: #fff;}


#fromModel {pointer-events: none; /* 禁止交互 */}
#fromModel .absolute.inset-0{visibility: hidden;transform: translateX(-100%);transition: 0.5s all;    }
#fromModel.showmodel .absolute.inset-0{visibility: visible;transform: translateX(0%)}
#fromModel #frm{transform: translateX(100%);transition: 0.5s all}
#fromModel.showmodel #frm{transform: translateX(0%);transition: 0.5s all}
.product-item:hover .tab-content{transition: 1s all}
.product-item:hover .tab-content.active{visibility: hidden;opacity: 0;display: none}
.product-item:hover .tab-content:last-of-type{position: relative;visibility: visible;opacity: 1;display: block}

@media screen and (max-width: 768px) {
    .warp{width: 95%;}
    body{padding-top: 60px;--swiper-navigation-size: 14px;--swiper-theme-color: #fff;}
    header{height: auto;top: 0;}
    .banner h3{font-size: 18px;}
    .banner .pic .wenzi a{width: 100px;height: 30px;font-size: 12px;}
    .banner .wenzi h5{padding-right: 22px;}
    .index-about{margin-top: 40px;flex-direction: column;}
    .index-about .l h3{font-size: 24px;}
    .index-about .l{width: 100%;}
    .index-about .l h2{font-size: 22px;}
    .index-about .other dt img{width: 75px;margin: 0 auto;}
    .index-about{gap: 20px;}
    .index-about .other dd h3{font-size: 20px;}
    .index-about .other dd p{font-size: 12px;}
    .index-category{margin: 40px 0;}
    .index-category .tit{font-size: 24px;}
    .index-category .tit h3{font-size: 16px;}
    .index-category .swiper-category h2{font-size: 20px;}
    .form{margin: 0;}
    .index-merit{margin: 20px 0; }
    .index-news{margin-top: 40px;}
    .index-news .tit{font-size: 24px;margin-bottom: 40px;}
    .index .more{width: 100px;height: 40px;line-height: 2;font-size: 14px;margin-top: 20px;}
    .form .formbox{    top: 50%; left: 50%;  transform:translate(-50%,-50%) scale(0.7);}
    .swiper-merit h2{font-size: 14px; line-height: 1.5;}
    footer{padding: 20px 10px; }
    footer dl:not(:last-of-type){display: none;}
    footer .b{margin-top: 20px;}
    .weihzhibg li::after{bottom: -2px;}
    .list-image .txt a{font-size: 12px;}
    .show-product .thumbnailSwiper .swiper-slide{height: 60px;}
    .show-product .producttitle .title{font-size: 24px;margin-bottom: 10px;}


    .page-about .block1 h3{font-size: 20px;}
    .page-about .block1 a{width: 100px;height: 30px;}
    .page-about .block1 .content{padding-right: 0;}
    .page-about .bgpic{height: 30vh;background-size: 100%;background-attachment: unset;}
    .page-about .block4 .r{padding-right:1.25rem;}
    .page-about .block4 .tit{font-size: 24px;}
    .page-about .block4 dd{font-size: 16px;}
    .list-article .picturebox .more{padding: 3px 10px;}
    .showtitle{font-size: 20px;}

    .page-contact p{margin-bottom: 10px;}
}