@charset "utf-8";
:root {--brown:#0c5e6f; --white:#ffffff; --black:#000; --grey_3:#333333; --grey_6:#666666; --grey_9:#999999;--grey_c:#cccccc;--grey_e:#dedede;--grey_f5:#f5f6f7; --grey_d9:#d9d9d9; --swiper-theme-color: #978b57;--y:#ffc220;}
html, 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;font-size: 15px;font-family:Arial, Microsoft Yahei;line-height: 1.8; font-weight:400;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block}
html, body {color: var(--grey_3);}
body {background: #ffffff; overflow-x: hidden;}
ul, ol, li {list-style: none; line-height:0;}
*{-webkit-transition: background .5s ease;-moz-transition: background .5s ease;-ms-transition: background .5s ease;-o-transition: all .5s ease;transition: background .5s ease;box-sizing: border-box;}

a {color: var(--black);text-decoration: none;display: inline-block;}
a:hover {color: var(--brown);text-decoration: none;-webkit-transition: background .3s ease;-moz-transition: background .3s ease;-ms-transition: background .3s ease;-o-transition: background .3s ease;transition: background .3s ease;}
img {border: 0; display: block;list-style: 0;}
.h2{ font-size:24px; line-height:24px; font-weight: 600;}
.h3{ font-size:20px; line-height:20px; font-weight:bold;}
.h3-24{ font-size:24px; line-height:24px; font-weight:500;}
.h3-30{ font-size:30px; line-height:30px; font-weight:500;}
.h4{ font-size:18px; line-height:18px; font-weight:500;}
.black{color:  var(--black);}
.family500{ font-weight:500;}
.title-em{ width: 100%; max-width: 1000px; margin: 10px 0 20px 0; display: block; line-height: 1.4;}

::selection{background:var(--brown);color:#ffffff;}
::-moz-selection{background:var(--brown);color:#ffffff;}
.siyuan, .siyuan a{ color:#333333;}
b, em, i {font-style: normal}
h1, h2, h3, h4, h5 {font-weight: normal}
input::-moz-placeholder, textarea::-moz-placeholder { color:var(--grey_9); }
input:-ms-input-placeholder, textarea:-ms-input-placeholder {color:var(--grey_9);}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color:var(--grey_9);}
input:focus{background: none;}

.imgbig {-webkit-transition: all .5s ease;-moz-transition: all .5s ease;-ms-transition: all .5s ease;-o-transition: all .5s ease;transition: all .5s ease;display: block !important}
.imgbig:hover {transform: scale(1.1);-webkit-transform: scale(1.1);-moz-transform: scale(1.1);-ms-transform: scale(1.1)}
.imgbigout {display: block;overflow: hidden}
.clear:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0}
.clear {zoom: 1}
.left {float: left}
.right {float: right}
.center{text-align: center;}
.hide {display: none}
.show{ display:block!important;}
.lazy {background: url(/static/default/web/img/ajax-loading.gif) 50% 50% no-repeat}
li.lazy { height:100%;background: none 50% 50% no-repeat;}
.container{ width:92%; height: 100%; max-width:1600px; margin:0 auto;}
.tran {transition: all .3s ease}
.tran5 {transition: all .5s ease}
.m-t-10{margin-top: 10px;}
.m-t-20{margin-top: 20px;}
.m-t-30{margin-top: 30px;}
.m-t-40{margin-top: 40px;}
.m-t-50{margin-top: 50px;}
.m-t-60{margin-top: 60px;}
.m-t-100{margin-top: 100px;}
.b-r-5{border-radius: 5px;}
.flex{ display: flex;}
.flex-column{display: flex;justify-content: center; flex-direction: column;}
.page-wrap{width: max-content;}
.page-margin{ margin-top:100px; margin-bottom:100px;}
.page-padding{ padding:100px 0;}
.margin-top50{ margin-top:50px;}
.margin-top100{ margin-top:100px;}
.margin-top146{margin-top: 0;}
.margin-bottom80{ margin-bottom:80px;}
.h2-title{font-size: 24px; line-height: 1.4; font-weight: 500; color: var(--black);}
.p-bottom p{ margin-bottom:10px;}
.line-clamp-1{display: -webkit-box;-webkit-line-clamp:1;-webkit-box-orient: vertical;overflow: hidden;}
.line-clamp-2{display: -webkit-box;-webkit-line-clamp:2;-webkit-box-orient: vertical;overflow: hidden;}
.line-clamp-3{display: -webkit-box;-webkit-line-clamp:3;-webkit-box-orient: vertical;overflow: hidden;}
.line-clamp-4{display: -webkit-box;-webkit-line-clamp:4;-webkit-box-orient: vertical;overflow: hidden;}
.back2top {display: block;width: 43px;height: 43px;background: url(/static/default/web/images/back2top.png) no-repeat;position: fixed;right: 3.5%;bottom: 15%;opacity: .33;z-index: 99}
.back2top:hover {opacity: 1}
/*.pager {width: 100%;color: #666666;line-height: 30px;padding: 30px 0 30px 0;font-size: 16px;text-align: center;}
.pager li{ display:inline-block;}
.pager .page-item a{text-decoration: none;line-height: 40px;display: inline-block; height:40px; text-align:center;margin: 0 2px;font-size: 14px; background:#f5f5f5; padding:0 15px; border-radius: 5px;}
.pager .page-item a:hover{background:var(--grey_9); color:var(--white);}
.pager .on, .pager .active span{display: inline-block; background:var(--grey_9); color:var(--white); padding:0 15px;height:40px; line-height:40px; text-align:center;margin: 0 5px;    border-radius: 5px;}*/
.aboutus a, .equipment-main .equipment-text a, .page-new-detail .new-detail-text a{ color:#34c9e4; text-decoration:underline;}
.page-contact .page-contact-content a:hover, .aboutus a:hover, .equipment-main .equipment-text a:hover, .page-new-detail .new-detail-text a:hover{color:var(--brown);}

/*.pager a, .pager span {text-decoration: none;height: 26px;line-height: 26px;display: inline-block;margin: 0 10px;font-size: 16px}
.pager a:hover {color: #0f0b09;opacity: 1}
.pager a:active {color: #0f0b09}
.pager span.now {color: #0f0b09}
.pager span.disabled {color: #0f0b09}*/
.current:first-child, .pager .p1:last-child {display: none}
a.more-button{ width:250px; height:42px; line-height:42px; font-size:16px;padding:0 20px 0 40px; border-radius: 5px; display: block; background: var(--grey_9); color:#ffffff;transition: all .3s ease; text-decoration:none;}
a.more-button .icon-swap-right:before{ font-size:24px;color:#ffffff;}
a.more-button:hover{padding:0 50px;background:var(--grey_6); color:#ffffff;box-shadow:0px 4px 10px #aaaaaa;transition: all .3s ease}
input,textarea,select,a:focus, button {outline: none;}

.swiper-container {width: 100%;height: 100%;}
.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}

/*.animated {position: fixed; z-index:99;top: 0;left: 0;right: 0;transition: all .2s ease-in-out;}
.animated.slideDown {top: -80px; box-shadow:none;}
.animated.slideUp {top: 0;box-shadow:0px 0px 20px #dddddd;}*/

0% {opacity: 0;-webkit-transform: translate3d(0,50%,0);transform: translate3d(0,50%,0);}
100% {opacity: 1;-webkit-transform: none;transform: none;}

.title-name{ margin-bottom:24px;}
.name-cn{ text-align:center; font-size:30px; color:var(--grey_3);}
.name-describe{ color:#999999; text-align:center; margin-top:10px;}
/*结构为
.css{width, height, margin, padding, color, font-size, background}
*/
/*分页*/
.pager {text-align: center; margin-top: 30px;}
.pager ul {display: flex; flex-wrap: wrap; justify-content: center}
.pager ul li {display: inline-block;}
.pager ul li a {padding: 5px 10px; margin: 15px 5px 0 5px; border: var(--grey_c) solid 1px; display: inline-block; line-height: 1.2; border-radius: 6px;}
.pager ul li a:hover {border: var(--brown) solid 1px; color: var(--brown);}
.pager ul .active a {border: var(--brown) solid 1px; display: inline-block; background-color: var(--brown);; color: #fff;}
.pager ul a:not([href]):not([class]):hover {border: var(--brown) solid 1px;}
.pager ul .active a:hover {color: var(--white); border: var(--brown);}

.header{ width: 100%; padding-top: 30px;/* position: fixed; z-index: 9; top: 0; */background: var(--white);}
.header .topbar{ width: 100%;  height: 46px; background: var(--brown); color: var(--white);box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.4); position: relative;z-index: 2; }
.header .text{ width:max-content; height: 100%; line-height: 46px; position: relative; font-size: 14px;}
.header .text span{margin-left: 10px;}
.header .email a, .header .phone a{color: var(--white);}
.header .email a:hover{text-decoration: underline;}
.header .phone{padding-left: 30px;}
.header .search{    font-size: 24px;padding: 6px;color: var(--grey_3);background: none;border: 0;margin: auto 0;margin-left: auto;cursor: pointer;display: flex;align-items: center; display: none;}
.header .search:before, .header .language:before{left: 10px;}
.header .language{margin-left: 10px;cursor: pointer;  padding: 0 16px; position: relative;}
.header .language .choose{width: 100%;padding: 10px 0px; position: absolute; top: 45px; left: 0; display: none; background: var(--white);box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);}
.header .language .choose a{width: 100%; line-height: 2;text-align: center;}
.header .language .choose a:hover{background: var(--brown); color: var(--white);}
.header .language .choose .c-span{width: 100%; margin-left: 0; line-height: 2; font-weight: bold;text-align: center;display: block; color: var(--brown);cursor: default;}
.header .language:hover .choose{display: block;}

.header .search-wrap{ width: 50%;max-width: 690px; padding: 0 20px; margin-left: auto; display: flex;align-items: center;}
.header .products-search{width: 100%;height: 48px; padding: 3px;background: var(--grey_f5); border: 1px solid #dddddd;border-radius: 25px;}
.header .products-search .input{    width: 100%;height: 40px;padding:5px 20px;border: none !important;font-size: 14px;background: none;}
.header .products-search .submit{width: 70px;height: 40px;line-height: 1;border: none;font-size: 15px;background: var(--y); color: var(--white); cursor: pointer;border-radius: 20px;}
.header .products-search .submit:hover{ background:var(--brown); color:var(--white);}
.header .search-show .input, .header-nav .search-show .submit{ margin-top:0; transition:all .5s ease .2s;opacity:1;}
.header .products-search .products-search-con{ width:94%; max-width:1200px; margin:0 auto; margin-top:100px;}
.header .products-search .products-search-con form{display: grid;grid-template-columns: 8fr 2fr;}
.header .products-search .products-search-keyword{ width:94%; max-width:1200px; margin:0 auto; margin-top:24px; font-size:16px; color:var(--white);}
.header .close-buttom{position: fixed; right: 20px; top: 20px;position: fixed;z-index: 9; font-size: 50px; color: var(--white); background: none; border: 0;display: none; cursor: pointer;}
.header .close-buttom:hover{color:var(--brown);transform:rotate(90deg);}

.header .top-icon-wrap{width: max-content; margin-left: auto;display: flex;align-items: center;}
.header .top-icon{width: max-content;display: flex; align-items: center;}
.header .top-icon > a{display: flex; align-items: center; margin-left:20px;}
.header .top-icon > a:first-child{margin-left: 0;}
.header .top-icon i{font-size: 28px;}
.header .top-language{background: var(--grey_f5); padding: 0px 15px; margin-left: 20px; border-radius: 18px; font-size: 13px; display:  flex; align-items: center;}
.header .top-language i{font-size: 18px;}
.header .top-language a{padding: 0 5px; font-size: 13px;}

.navbar{ width: 100%; height: 93px;}
.navbar .menu-button{font-size: 24px; padding:6px;color: var(--grey_3); background: none; border: 0; margin: auto 0; margin-left: auto;cursor:pointer; display:none;border-radius: 5px;}
.navbar .logo{line-height: 0; margin-left: 15px;}
.navbar .logo a{box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.6);}
.navbar .menu-button:hover{ color: var(--brown);}
.header .menu-close { position: fixed;z-index: 999;top: 0; right: 20px;cursor: pointer;display: none;  font-size: 40px;}
.header .menu-close:hover{color:var(--brown);transform:rotate(90deg);}
.navbar .logo-img{width:max-content; height: 100%;margin-left: 30px;display: flex; align-items: center; line-height: 0;}
.navbar-nav{width:100%;background-image: linear-gradient(80deg, #05596a, #3f7f8d);}
.navbar-nav .yyui_menu1{ height: 100%;    padding-left: 220px; display: flex; }
.navbar-nav ul a{height: 100%; padding: 18px 30px; font-size: 16px; line-height: 1; color: var(--white);display: flex;align-items: center;}
.navbar-nav ul a i{margin-left: 5px;font-size: 10px;}
.navbar-nav ul a:hover{ background: var(--brown); color: var(--white);}
.navbar-nav ul li.top-icon{display: none;}

.banner{}
.banner .banner-wrap{width: 100%;overflow: hidden;position: relative;}
.banner .banner-content{width: 100%; height: 100%; position: absolute; top: 0; left: 0; display: flex; align-items: center;}
.banner .banner-text{margin-left: 8%; color: var(--white); font-size: 40px;}
.banner span{display: block; text-shadow: 0px 5px 15px rgba(0, 0, 0, 0.8);}
.banner .title-1{font-size: 42px; line-height: 1; font-weight: bold; }
.banner .title-2{font-size: 36px; line-height: 1.4; }
.banner .banner-img img{width: 100%}
.banner .banner-img .small-img{display: none;}
.banner-more{width: max-content; padding:6px 6px 6px 30px; color: var(--white); font-weight: bold; font-size: 12px; line-height: 1; background: var(--brown); border-radius: 20px; display: flex; align-items: center;}
.banner-more i{width: 28px; height: 28px;border-radius: 50%; margin-left: 20px; background: var(--y); font-size: 15px; display: block; display: flex;display: flex;align-items: center; justify-content: center;}
.banner-more:hover{background: var(--y); color: var(--white);}
.banner .banner-wrap:nth-child(2) .banner-text {margin-left: auto; margin-right: 8%;text-align: right;}
.banner .banner-wrap:nth-child(2) .page-wrap{margin-left: auto;}


.index-product{}
.index-product-overflow{overflow: hidden; position: relative;}
.product .product-content{}
.product .product-content ul{justify-content: space-between;}
.product .product-content ul li{}
.product .product-content a{ width: 100%; height: 100%;}
.product .product-img{ width: 100%; overflow: hidden;line-height: 0;}
.product .product-name{ margin:14px 10px; font-size: 18px; font-weight: 500; text-align: center;}

.message{height:515px; background-image: url("/static/default/web/images/messages.jpg"); background-size: cover; background-position: center;color: var(--white);}
.message-wrap{width: 64%; height: 100%; padding: 10px 5%; background: rgba(0,0,0,50%); display: flex; flex-direction: column; justify-content: center;}
.message .message-content{ width: 100%; max-width: 816px;}
.message ul{display: grid; grid-template-columns:1fr 1fr; grid-gap:8px;}
.message ul li{ position: relative;}
.message .li-columns{    grid-column-start: 1;grid-column-end: 3;}
.message ul li span{position: absolute; right: 12px; bottom: 10px; color:#ff0000;}
.message input, .message textarea{ width: 100%;padding: 8px 10px; font-size: 14px; background: var(--white); color: var(--grey_6); border: 0;}
.message textarea{height: 112px;}
.message button{width:100%; max-width: 500px; padding: 15px 0; text-align: center;background: var(--brown);color: var(--white);border: 0;cursor: pointer;    border-radius: 5px;}
.message button:hover{background: var(--y);}
.message i{margin-left: 10px;}
.message a{color: var(--white); text-decoration: underline; font-weight: 600;}
.message a:hover{color: var(--brown);}

.index-about{}
.index-about .about-left{width: 50%;max-width: 790px;}
.index-about .about-img{ width: 100%;position: relative; overflow: hidden;line-height: 0;}
.index-about .about-img img{height: 100%; width: auto;}
.index-about .about-smallimg{margin-top: 5px;}
.index-about .about-smallimg ul{display: grid; grid-template-columns:1fr 1fr 1fr 1fr; grid-gap:5px;}
.index-about .about-smallimg img{width: 100%; height: auto;}
.index-about .img-text{position: absolute; right: 20px; bottom: 20px; text-align: right; color: var(--white); z-index: 2;}
.index-about .img-text:before{content: ""; position: absolute; width: 30px; height: 2px; background: var(--white); right: 0; top: -20px;}
.index-about .img-text span{font-size: 18px; font-weight: 500; display: block;}
.index-about .about-content{ width: calc(100% - 790px);}
.index-about .content-text{ width: 90%; max-width: 650px; margin: 0 auto;}
.index-about .about-em{ width: 100%; margin-top: 10px; margin-bottom: 50px; font-size: 18px; line-height: 1.4; font-weight: 500; position: relative; display: block;}
.index-about .about-em:after{content: ""; position: absolute; width: 40px; height: 3px; background: var(--brown); left: 0; bottom: -30px;}
.index-about .about-content p{ margin-top: 20px;}
.index-about .about-content a.a-more{ width: max-content; font-size: 16px; font-weight: bold; color: var(--brown); text-decoration: underline; display: block; margin-top: 50px;}
.index-about .about-content a.a-more:hover{color: #6874a8}

.news{}
.news .news-content{ width: 100%; text-align: left; overflow: hidden;}
.news .news-content ul li{ width: 100%;}
.news .news-img{ width: 100%;  line-height: 0;}
.news .news-img a{ width: 100%;overflow: hidden;}
.news .news-img a img{width: 100%; height: auto;}
.news .news-name{ width: 100%; margin-top: 10px; font-size: 16px; font-weight: 600;}
.news .news-name a{width: 100%; line-height: 1.3;}
.news .news-describe{ width: 100%; margin-top: 10px; line-height: 22px; font-size: 14px;}
.news .news-time{ width: 100%; margin-top: 10px; display: block; position: relative;font-size: 14px;padding-bottom: 15px; border-bottom: 1px solid #e6e6e6;}
.news .news-time:before{ position: absolute; left: 0; font-size: 14px;}
.index-news .news-time{padding-bottom: 0; border-bottom: 0;}
.index-news{border-top: 1px solid var(--grey_e); padding-top: 30px; margin-top: 40px;}

.more-all{ margin-top: 30px; text-align: center;}
.more-jiantuo-left{ width: 50px; height: 50px;text-align: center; background: var(--y); display: flex;flex-direction: column;justify-content: center; color: var(--white);font-size: 18px; position: absolute;top: 26%;z-index: 2;left: 10px; border-radius: 50%;display: none;}
.more-jiantuo-right{width: 50px;height: 50px; right: 50px; text-align: center;background: var(--y); display: flex; flex-direction: column;justify-content: center;color: var(--white);font-size: 18px;position: absolute;top: 26%;z-index: 2;right: 10px;border-radius: 50%; display: none;}
.more-jiantuo-left:hover, .more-jiantuo-right:hover{background: var(--brown); cursor: pointer;}
.more-relative:hover .more-jiantuo-left, .more-relative:hover .more-jiantuo-right{display: flex!important;}

.newsletter{height:120px; padding: 10px 4%;  background-image: linear-gradient(80deg, #05596a, #3f7f8d); display: flex;}
.newsletter .newsletter-text{width: 50%; max-width: 600px; color: var(--white); font-size: 14px;    display: flex; flex-direction: column;justify-content: center;}
.newsletter .newsletter-text p{line-height: 1.4;}
.newsletter .newsletter-from{width: 50%; max-width: 450px; margin-left: auto;display: flex; align-items: center;}
.newsletter .newsletter-con{width: 100%; height: 38px; padding: 3px; background: var(--white); border-radius: 19px;}
.newsletter .newsletter-con input {width: 100%;height: 32px;padding: 0px 20px;border: none !important;font-size: 14px;background: none;}
.newsletter .newsletter-con button {width: 52px; height: 32px; line-height: 1;border: none;font-size: 14px;background: var(--y);color: var(--white);cursor: pointer;border-radius: 16px;}
.newsletter .newsletter-con button:hover{background: var(--brown);}

.footer{ width: 100%;}
.footer .footer-content{padding:50px 0 30px 0; justify-content: space-between;}
.footer .footer-about{max-width: 420px;}
.footer .footer-h3{font-size: 16px;font-weight: bold;color: var(--black);}
.footer .footer-mt{margin-top: 20px; }
.footer .footer-mt p{line-height: 30px;font-size: 14px;}
.footer .footer-describe{ line-height: 24px;}
.footer .footer-describe p{font-size: 14px;}
.footer .footer-contact{width: 30%; max-width: 350px;}
.footer .footer-product{max-width: 300px;}
.footer .footer-product-mb{margin-bottom: 20px;}
.footer .footer-product dd{ line-height: 30px;}
.footer .footer-product dd a{font-size: 14px;}
.footer .footer-download{width: 244px; height: 226px; position: relative; overflow: hidden;}
.footer .footer-download a{ align-items: center;}
.footer .footer-download span{ width: 80%; font-size: 20px; font-weight: 500; line-height: 1.5; text-align: center;color: var(--white); position: absolute; z-index: 2;    display: flex;flex-direction: column;    text-shadow: 0px 2px 5px rgba(0, 0, 0, 1);}
.footer .footer-download span i{font-size: 24px;}
.footer .footer-download a:hover:before{content: ""; position: absolute; height: 100%; width: 100%; background: rgb(5,88,105,0.7); z-index: 2;}
.footer .footer-download a:hover img {transform: scale(1.1);-webkit-transform: scale(1.1);-moz-transform: scale(1.1);-ms-transform: scale(1.1)}

.footer .footer-copyright{padding: 20px 0; border-top: 1px solid var(--grey_e);}
.footer .footer-logo{padding-left: 15px;}
.footer .footer-menu{ width: 100%;}
.footer .footer-menu a{font-weight: 500; position: relative; margin-right: 10px; padding-right: 10px; font-size: 14px;}
.footer .footer-menu a::after{content: ""; position: absolute; right: 0; top: 8px; height: 10px; width: 1px; background: var(--grey_9);}
.footer .footer-menu a:last-child:after{display: none;}
.footer .footer-copyright-text{ width: 100%; font-size: 14px;}
.footer .footer-copyright-text a{margin-left: 20px;}
.footer a:hover{ text-decoration: underline;}

.page-banner{}
.page-title{margin-top: 30px; font-size: 30px; line-height: 30px; font-weight: bold;}
.page-describe{ width: 100%; max-width: 1200px;margin-top: 10px; display: block;font-size: 16px; line-height: 24px;}
.page-location{height: 50px;}
.page-location li{font-size: 12px; height:50px; line-height: 50px; float: left;}
.page-location li:after {margin-left: 10px;padding-right: 10px;content: "/";}
.page-location li:last-child:after { display: none;}
.page-left{ width: 300px; overflow: hidden;}
.page-left .categories{ width:  100%;}
.page-left .categories-title{font-size: 18px; font-weight: 500; color: var(--black);}
.page-left .categories-list{margin-top: 40px;}
.page-left .categories-list li{ padding-bottom: 18px; margin-bottom: 18px;font-size: 16px; border-bottom: 1px solid #e6e6e6; justify-content: space-between; font-weight: 500;}
.page-left .categories-list li a{line-height: 1;}
.page-left .categories-list li i{ font-size: 12px; margin-right: 10px;}

.page-message{ width: 100%; margin-top: 50px;}
.page-message .message-title{font-size: 18px; font-weight: 500; color: var(--black);}
.page-message .message-con{ margin-top: 15px; padding:10px 20px; background: var(--grey_f5); }
.page-message li{margin: 8px 0;position: relative;}
.page-message input, .page-message textarea{ width: 100%;padding:4px 8px; font-size: 14px; background: var(--white); color: var(--grey_6); border: 0;}
.page-message textarea{height: 112px;}
.page-message button{width:100%; max-width: 500px; padding: 15px 0; text-align: center;background: var(--brown);color: var(--white);border: 0;cursor: pointer;    border-radius: 8px;}
.page-message button i{margin-left: 10px;}
.page-message button:hover{background: var(--black);}
.page-message ul li span{position: absolute; right: 12px; bottom: 5px; color:#ff0000;}


.page-news{ width: 100%; margin-top: 50px;}
.page-news .news-main{justify-content: space-between;}
.page-news .news-all{width: calc(100% - 350px);}
.page-news .news-all ul.news-item{display: grid; grid-template-columns: 1fr 1fr 1fr;grid-gap: 33px;}
.page-news .news-all ul.news-item li{display: flex;flex-direction: column;justify-content: space-between;}

.page-detail{width: calc(100% - 350px);}
.news-detail{}
.news-detail .detail-title{font-size: 30px; line-height:  30px; font-weight: 600;text-align: center;color:  var(--black);}
.news-detail .detail-info{ width: 100%; margin-top: 20px; color: var(--grey_9); text-align: center;}
.news-detail .detail-info span{margin-right: 30px;}
.news-detail .detail-info span:last-child{margin-right: 0;}
.news-detail .detail-content{margin-top: 30px;}
.news-detail .detail-content img{width: 100%; max-width: max-content; height: auto;}
.news-detail .detail-content li{line-height: 24px; margin-bottom: 10px;}
.news-detail .detail-content h2{font-size: 20px;font-weight: 600;margin-bottom: 15px; color: var(--black);}
.news-detail .detail-content h3{font-size: 18px;font-weight: 600;margin-bottom: 15px;color: var(--black);}
.news-detail .detail-content em{font-weight: 600;}
.news-detail .detail-content p, .news-detail .detail-content ul, .news-detail .detail-content img{margin-bottom: 15px;}
.content-tag{margin-top: 30px;flex-wrap: wrap;}
.content-tag span{margin-right: 10px;}
.content-tag a{margin-right: 20px; text-decoration: underline;}
.news-detail .prenext {margin-top: 50px;}
.news-detail .prenext span{width: 100%;margin-top: 10px;display: block;color: var(--black);}
.news-detail .prenext a{text-decoration: underline;font-weight: 500;}
.news-detail .prenext a:hover{ color: var(--brown);}
.addthis_inline_share_toolbox {margin-top: 20px;}
.news-grid{display: grid;grid-template-columns: 1fr 1fr 1fr 1fr;grid-gap: 30px;margin-top: 30px;}

.yyui_menu1{ position:relative;}
.yyui_menu1 li ul { width:max-content; padding:10px 20px 20px 25px; position:absolute; background:#ffffff; display:none; z-index:9; top:49px;border-radius: 5px;box-shadow: 0px 5px 20px rgb(0 0 0 / 10%);}
.yyui_menu1 li ul li { width:100%; height:32px; position:relative;}
.yyui_menu1 li ul li a{ width:100%; height:32px; line-height:32px; padding: 0!important;color:#333; font-weight:400!important; background: none!important}
.yyui_menu1 li ul li a:hover{ color: var(--brown)!important;}
.yyui_menu1 .two{ left: 285px;top: 0;width: 340px;padding: 0 0 10px 0;}
.yyui_menu1 .two-span{position: absolute; font-size:10px; right:16px;}

/*swiper-bundle.css*/
.swiper-container {margin-left: auto;margin-right: auto; position: relative;list-style: none;z-index: 1;}
.swiper-container-vertical > .swiper-wrapper {flex-direction: column;}
.swiper-wrapper {position: relative;width: 100%;height: 100%;z-index: 1;display: flex;transition-property: transform;box-sizing: content-box;}
.swiper-slide {flex-shrink: 0;width: 100%;position: relative;transition-property: transform;cursor: grab;}
.swiper-slide:active{cursor:grabbing;}
.swiper-pagination.swiper-pagination-hidden {opacity: 0;}
.swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets {bottom: -60px;left: 0;width: 100%;}
.swiper-pagination-bullets-dynamic {overflow: hidden;font-size: 0;}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {transform: scale(0.33);position: relative;}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {transform: scale(1);}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {transform: scale(1);}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {transform: scale(0.66);}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {transform: scale(0.33);}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {transform: scale(0.66);}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {transform: scale(0.33);}
.swiper-pagination-bullet {width: 10px;height: 10px;display: inline-block;border-radius: 50%;background: #000;opacity: 0.2;}
button.swiper-pagination-bullet {border: none;margin: 0;padding: 0;box-shadow: none;-webkit-appearance: none;appearance: none;}
.swiper-pagination-clickable .swiper-pagination-bullet {cursor: pointer;}
.swiper-pagination-bullet:only-child {display: none !important;}
.swiper-pagination-bullet-active {opacity: 1;background:var(--swiper-theme-color);}
.swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 4px;}

.icon-state{position: relative;}
.icon-state:hover .icon-span{display: flex!important;}

.about{}
.about .about-title{color: var(--black); font-size: 30px; line-height: 1; font-weight: bold;}
.about .about-subtitle{font-size: 18px; line-height: 1.1; font-weight: 500; color: var(--black);}
.about .about-main{margin-top: 30px; display:  flex;}
.about .about-right{width: calc(100% - 640px);}
.about .about-text{ width: 90%; height: 100%;}
.about .about-text p{margin-bottom: 10px;}

.company-data{ padding: 40px 0;border-bottom: 1px solid var(--grey_e);}
.company-data ul {    grid-template-columns: auto auto auto auto auto;display: grid;justify-content:space-evenly;grid-gap: 30px 0;}
.company-data li {width: max-content;float: left;}
.company-data li .data-text{ width:100%; text-align: left;}
.company-data li .data-text .data-number{ font-size:40px; font-weight:600; color:var(--grey_3); line-height:40px;}
.company-data li .data-text .data-fuhao{ margin-left:10px; font-size:14px; font-weight:600; color:var(--grey_6);line-height:14px;} 
.company-data li .data-name{ width:100%; margin-top:5px; display:block; text-align: left; font-size:16px; color:var(--grey_3);line-height:16px;} 

.certificate{}
.certificate .certificate-content{ width: 100%; overflow: hidden;}
.certificate .certificate-content ul{}
.certificate .certificate-content ul li{ max-width: 350px;}
.certificate .certificate-content .certificate-img{ width: 100%; line-height: 0;}
.certificate .certificate-content .certificate-img a{overflow: hidden;}
.certificate .certificate-content .certificate-img img{width: 100%; height: auto;}
.certificate .certificate-content .certificate-title{margin-top: 10px; font-size: 16px; line-height: 1.4; font-weight: 500;}
.certificate .more-jiantuo-right, .certificate .more-jiantuo-left {top: 39%;}

.factory{ padding-top: 40px; border-top: 1px solid var(--grey_e);}
.factory .factory-content{ width: 100%; text-align: left; overflow: hidden;}
.factory .factory-content ul li{ width: 100%;}
.factory .factory-img{ width: 100%; line-height: 0;overflow: hidden;}
.factory .factory-img img{ width: 100%; height: auto;}
.factory .factory-name{ width: 100%; padding: 10px 0; font-size: 16px; text-align: center;background: var(--grey_f5);}
.factory .more-jiantuo-right, .factory .more-jiantuo-left{top: 35%;}

.contact{width: 100%; margin-top: 40px;}
.contact-wrap{display: grid;grid-template-columns: 1fr 1fr 1fr; grid-gap: 20px;}
.contact-wrap .contact-con{ padding: 8% 10%; border:1px solid var(--grey_e);}
.contact-wrap .contact-con h2{font-size: 22px; font-weight: bold;}
.contact-wrap .contact-text{margin-top: 20px;}
.contact-wrap .contact-text p{font-size: 17px;}
.contact-wrap .contact-a{width: max-content; padding: 7px 20px; font-size: 17px; line-height: 1; background: var(--grey_f5); border-radius: 20px; display: flex;align-items: center;}
.contact-wrap .contact-a:not(:last-child){margin-right: 10px;}
.contact-wrap .contact-a i{margin-right: 10px; font-size: 25px;}
.contact-wrap .contact-a:hover{background: var(--brown); color: var(--white);}

.contact-main{margin-top: 40px; padding-top: 40px; border-top: 1px solid var(--grey_e);align-items: center;}
.contact-message{width: 45%;}
.contact-message .message-title{font-size: 24px; line-height: 1; font-weight: 500; color: var(--black);}
.contact-message .message-con{ margin-top: 15px;}
.contact-message ul{display: grid;grid-template-columns: 1fr 1fr; grid-gap: 8px;}
.contact-message .li-columns {grid-column-start: 1; grid-column-end: 3;}
.contact-message input, .contact-message textarea{ width: 100%;padding: 6px 10px; color: var(--grey_6); border: 1px solid var(--grey_e);}
.contact-message textarea{height: 140px;}
.contact-message button{width:100%;padding: 15px 0; text-align: center;background: var(--brown);color: var(--white);border: 0;cursor: pointer;    border-radius: 8px;}
.contact-message button:hover{background: var(--black);}
.contact-message ul li span{position: absolute; right: 12px; bottom: 10px; color:#ff0000;}
.contact-message i{margin-left: 10px;}

.contact-map{width: 50%; height:450px; margin-left: auto;}
.contact-map .contact-mapcon{width: 100%; height: 100%;}

.service{}
.service .service-main{ display: flex;margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--grey_e);}
.service .service-main:last-child{border-bottom: 0; margin-bottom: 0; padding-bottom: 0;}
.service .service-img{ width: 50%;max-width: max-content; line-height: 0; overflow: hidden;}
.service .service-img img{width: 100%; height: auto;}
.service .service-text{ width:50%; padding: 20px 5%; margin: 0 auto;}
.service .service-text ul{margin-left: 20px;}
.service .service-text li{line-height: 30px; list-style: disc; font-size: 16px;}
.service .service-text p{font-size: 16px;}
.products-container{}
.products-container .grid {width: 100%; position: relative;}
.products-container .grid-item {position: absolute;top: 0;left: 0;width: 30%; -webkit-transition: .3s ease-in-out;-o-transition: .3s ease-in-out;transition: .3s ease-in-out;}
.products-container .grid-item img{width: 100%; height: auto;}

.products{}
.products .products-main{justify-content: space-between;}
.products .products-all{width: calc(100% - 350px);}
.products .products-text{ margin-top: 20px;}
.products .products-text p{padding-bottom: 10px;}
.products .products-text li{line-height: 26px; list-style: disc; margin-left: 18px;}
.products .products-content{}
.products .products-content .index-p-ul{display: grid;grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;grid-gap: 10px;}
.products .index-p-ul2{display: grid;grid-template-columns: 1fr 1fr 1fr 3fr;grid-gap: 10px;}
.products .products-content .grid{margin-top: 40px;display: grid;grid-template-columns: 1fr 1fr 1fr 1fr;grid-gap: 20px;}
.products .products-content ul li{}
.products .products-img{ width: 100%; overflow: hidden;line-height: 0;}
.products .products-img img{width: 100%; height: auto; max-width: 456px;}
.products .products-name{ padding:14px 10px; border-bottom: 1px solid #e6e6e6;}
.products .products-name h3{font-size: 16px; line-height: 1.4; font-weight: 500;}
.products .products-name span{display: block; font-size: 16px; font-weight: bold;margin-top: 10px; color: var(--brown);}
.products .products-content a{ width: 100%; height: 100%;display: flex;flex-direction: column;justify-content: space-between;}
.products .products-content a:hover{position: relative;z-index: 2; color: var(--brown);}
.index-product .more-jiantuo-right, .index-product .more-jiantuo-left{top: 45%;}
.index-product .index-p-imgwrap{width: 100%; position: relative;}
.index-product .index-p-imgwrap a{width: 100%; height: auto;}
.index-product .index-p-imgwrap img{width: 100%; height: auto;}
.index-product .index-p-con{width: 100%; height: 100%; position: absolute; left: 0; top: 0; display: flex;    align-items: center;}
.index-product .index-p-con h2{width: max-content; margin-left: 10%; color: var(--white);}
.index-product .index-p-con span{font-size: 30px; font-weight: bold;display: block; line-height: 1.1;}
.index-product .products-name{border-bottom: 0; padding: 14px 10px 0;}
.index-br{margin-top: 30px; padding-top: 40px; border-top: 1px solid var(--grey_e);}

.waterfall {column-count: 3;column-gap: 1em;}
.waterfall-item {break-inside: avoid; margin-bottom: 1em; line-height: 0; }
.waterfall-item a{width: 100%; height: 100%; position: relative;}
.waterfall-item img {width: 100%;height: auto; display: block; }
.waterfall-item .wrapper-text{width: 100%;height: 0; position: absolute; left: 0; height: 0; background: rgba(0,0,0,50%); color:rgba(255,255,255,0); font-size: 24px; display: flex;justify-content: center;align-items: center; overflow: hidden;-webkit-transition: all .3s ease;-moz-transition: all .3s ease;-ms-transition: all .3s ease;-o-transition: all .3s ease;transition: all .3s ease;}
.waterfall-item a:hover .wrapper-text{ height: 100%;color:rgba(255,255,255,100%);-webkit-transition: all .3s ease;-moz-transition: all .3s ease;-ms-transition: all .3s ease;-o-transition: all .3s ease;transition: all .3s ease;}

.products .products-about{ width: 100%; margin-top: 50px;}
.products .products-about .p-about-title{font-size: 24px; font-weight: 500; color: var(--black);}
.products .products-about .text{ margin-top: 20px;}
.products .products-about .text p{margin-bottom: 10px;}

.products .products-detail{ width: 100%; display: flex; justify-content: space-between;}
.products .products-detail .p-detail-images{ width: 50%;}
.products .products-detail .p-maximg2{display: none;}
.products .products-detail .p-detail-img{width: 100%; border: 1px solid var(--grey_d9);overflow: hidden;}
.products .products-detail .p-detail-img img{width: 100%; height: auto;}
.products .products-detail .p-detail-smallimg{ margin-top: 5px;}
.products .products-detail .p-detail-smallimg ul{display:grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; grid-gap: 2px;}
.products .products-detail .p-detail-smallimg ul li{width: 100%;margin-right: 0;float: left; border: 1px solid var(--grey_d9);border-radius: 3px;overflow: hidden;}
.products .products-detail .p-detail-smallimg ul li img{    width: 100%; height: auto;cursor: pointer;}

.products .products-detail .p-detail-info{ width: 46%;}s
.products .products-detail .p-detail-info .p-detail-text{ margin-top: 40px;}
.products .products-detail .p-detail-info li{margin: 10px 0; line-height: 22px;    display: grid;grid-template-columns: 1fr 4fr;color: var(--black);}
.products .products-detail .p-detail-info li .spanname{font-weight: 600; color: var(--black);}
.products .products-detail .p-detail-info .products-button{ width: 100%; max-width: 300px; padding: 14px 0; margin-top: 20%; text-align: center; font-weight: 500; background: var(--brown); color: var(--white); border: 0; cursor: pointer;border-radius: 8px;}
.products .products-detail .p-detail-info .products-button:hover{background: var(--black);}
.products .p-detail-text{margin-top: 30px;}

.products .products-introduction{margin-top: 40px;}
.products .products-introduction .p-introduction-title{font-size: 24px; font-weight: 500; color: var(--black);}
.products .products-introduction .p-introduction-text{margin-top: 20px;}
.products .products-introduction .p-introduction-text img{    width: 100%;max-width: max-content;}
.products .products-introduction .p-introduction-text li{line-height: 26px; list-style:disc; margin-left: 18px;}

.products .products-introduction table{border-right: 1px solid var(--grey_d9); border-top: 1px solid var(--grey_d9)}
.products .products-introduction table tr td {padding: 5px 6px 5px 16px;border-bottom: 1px solid var(--grey_d9);border-left: 1px solid var(--grey_d9);}
.products .products-introduction table tr td:first-child{background: var(--grey_f5);}

.products .products-content .p-grid{margin-top: 40px;display: grid;grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;grid-gap: 10px;}
.products-related{ margin-top: 100px;}

.privacy-policy{ margin-top: 30px;}
.privacy-policy p{width: 100%; font-size: 16px; margin-bottom: 10px;}

.suspension{ width: 50px; height: 105px; position: fixed; z-index: 2; right: 10px; bottom: 200px; display: flex; flex-direction: column;   justify-content: space-between;}
.suspension span{width: 50px; height: 50px; display: block;text-align: center; cursor: pointer; font-size: 22px;display: flex; flex-direction: column; justify-content: center; border-radius: 50%;}
.suspension .span-message{background: var(--brown); color: var(--white);}
.suspension .span-top{background: var(--grey_c); color: var(--white); }
.suspension .span-top:hover, .suspension .span-message:hover{background: var(--y);}

.side-message{ width: 400px; position: fixed; z-index: 3; right: 10px; bottom: 20px; border-radius: 10px;box-shadow: 0 0px 20px rgb(0 0 0 / 30%); overflow: hidden; background: var(--white); display: none;}
.side-message .side-head{ width: 100%; height: 50px; line-height: 50px;  padding: 0 20px; font-size: 18px; font-weight: 500; display: flex; justify-content: space-between;background: var(--brown); color: var(--white);    box-shadow: 0px 0px 20px rgb(0 0 0 / 20%);position: relative; z-index: 2;}
.side-message .side-text{padding: 20px 0px 20px 20px; line-height: 22px;background: var(--brown);color: var(--white);  }
.side-message .side-text p{line-height: 1.4;}
.side-message .side-content{}
.side-message .side-content .message-con{ margin-top: 0!important; padding:10px 20px 20px 20px;}
.side-message .side-email{ text-align:center; line-height: 22px;}
.side-message .side-email a{font-weight: 500; text-decoration: underline;}
.side-message .side-close{ cursor: pointer;}

.download{}
.download ul{}
.download .grid{display: grid;grid-template-columns: 1fr 1fr 1fr 1fr;grid-gap: 30px;}
.download ul li{width: 100%;}
.download .download-img{ width: 100%; overflow: hidden;line-height: 0;}
.download .download-img img{width: 100%; height: auto;}
.download .download-name{ }
.download .download-name a{width: 100%; min-height:86px; padding: 10px; background: var(--grey_f5);font-size: 16px; font-weight: 500; line-height: 22px;}
.download .download-name a:hover{background: var(--brown); color: var(--white);}

.tag{}
.tag .tag-title{font-size: 36px;font-weight: 600;color: #333;}
.tag .tag-ul{display: flex;flex-wrap: wrap;justify-content: flex-start;grid-gap: 20px 10px;}
.tag .tag-ul li a{padding: 5px 20px; line-height: 1.5; border: 1px solid var(--grey_9); border-radius: 20px;}
.tag .tag-ul li a:hover{background: var(--brown); border:1px solid var(--brown); color: var(--white);}
.tag-list{}
.tag-list .list-ul{ display: grid;grid-template-columns: 1fr 1fr 1fr;grid-gap: 20px;}
.tag-list .list-ul li{width: 100%;padding: 20px;overflow: hidden;border: 1px solid #efefef;}
.tag-list .list-ul li a{width: 100%; font-size: 18px;line-height: 22px;font-weight: 600;}
.tag-list .list-time{width: 100%;display: block;position: relative;font-size: 14px;}
.tag-list .list-time i{margin-right: 5px;font-size: 14px;color: var(--grey_9);}
.tag-list .list-text{width: 100%;line-height: 1.4;}
.page-more{ width: max-content; color: var(--black); font-weight: 500;cursor: pointer;}
.page-more:hover{text-decoration: underline; color: var(--blue);}
.content-wrap{ width: 100%;}
.content-wrap h2{font-size: 24px; line-height: 1.2; font-weight: 500; color: var(--black); margin-bottom: 10px; margin-top: 20px;display: inline-flex;}
.content-wrap h3{font-size: 20px;line-height: 1.2; font-weight: 500; color: var(--black); margin-bottom: 10px;}
.content-wrap img{width: 100%; max-width: max-content; height: auto;}
.content-wrap li{line-height: 1.4; margin-left: 20px;list-style: disc;}
.content-wrap p, .content-wrap li, .content-wrap img{ margin-bottom:10px;}

@media screen and (max-width: 1440px) {
	.index-about .about-left, .index-about .about-content, .about .about-right{width: 50%;}
}

@media screen and (max-width: 1280px) {
	.page-location{margin-top: 25px;border-top: 1px solid var(--grey_e);}
	.navbar .logo{margin-left: 0;}
	.navbar .logo a img{height: 93px;}
	.footer .footer-product{display: none;}
	.header .top-icon-wrap{display: none;}
	.banner {margin-top: 20px;}
	.banner .title-1{font-size: 34px;}
	.banner .title-2, .index-product .index-p-con span{font-size: 26px;}
	.index-about .about-content{width: 50%;}
	.products .products-content .grid, .page-news .news-all ul.news-item{grid-template-columns: 1fr 1fr;}
	.products .products-detail .p-detail-info li{    grid-template-columns: 1fr 3fr;}
	.navbar-nav {width: 100%;height: 100%;position: fixed; right: -100%;top: 0;z-index: 998; transition: all .5s ease;display: none;}
	.navbar .menu-button, .menu-show{ display: block;}
	.menu-show {right: 0; transition: all .3s ease; display: block;        background-image: none;}
	.navbar-nav:after {content:""; width: 100%;height: 100%;background: rgba(0,0,0,.6);top: 0;left: 0;position: fixed;}
	.navbar-nav ul {width: 100%;max-width: 450px;height: 100%;padding: 6% 4% 0;float: right;background: #ffffff;overflow: scroll;z-index: 9;}
	.navbar-nav ul li{border-bottom: 1px solid var(--grey_d9)}
	.navbar-nav ul li.top-icon{margin-top: 20px; border-bottom: 0;display: flex;}
	.navbar-nav ul  li.top-icon a i{margin-left: 0;}
	.navbar-nav ul  li.top-icon .top-language a:hover {color: var(--brown); background:none;}
	.navbar-nav .yyui_menu1{    justify-content: normal;flex-direction: column;padding-left: 4%;}
	.navbar-nav ul a{width: 100%; height: 50px; padding:10px;  color: var(--grey_3);}
	.yyui_menu1 .one {    height: auto!important; top:0; position: relative;display: block!important;box-shadow: none;    padding: 0 0px 0 30px!Important;overflow: hidden!Important;}	
	.navbar-nav ul ul{height: auto; display: block!important;background: none;padding: 0 0px 20px 20px;box-shadow: none;position: relative;top: 0; overflow: hidden;        float: left;}
	.navbar-nav ul li li{border-bottom:0;}
	.navbar-nav ul ul li a{ height: 32px;}
	.footer .footer-about{width: 30%;}
	
}

@media screen and (max-width: 1024px) {
	.page-left, .products .products-detail .p-maximg1{display: none;}
	.products .products-all, .service .service-img, .service .service-text, .page-news .news-all, .page-detail{width: 100%;}
	.products .products-detail .p-maximg2, .contact .contact-main{display: block;}
	.banner ul{    text-align: center;}
	.banner ul li em{margin-bottom: 0; overflow: hidden;}
	.message .message-content{ margin: 0 auto;}
	.index-about .about-left{width: 40%;}
	.index-about .about-content, .about .about-right{width: 60%;}
	.index-about .about-content a.a-more{margin-top: 10px;}
	.products .products-content .p-grid, .news-grid{    grid-gap: 10px;grid-template-columns: 1fr 1fr 1fr;}
	.contact .contact-message{margin-top: 50px;}
	.company-data ul{    grid-template-columns: auto auto auto;}
	.certificate .certificate-content ul li{ width: 30%;}
	.products .products-content .index-p-ul{grid-template-columns: 1fr 1fr 1fr;grid-gap: 10px;}
	.newsletter{ display: block;height: auto;padding: 20px 6%;}
	.newsletter .newsletter-text{width: 100%; max-width: 100%;}
	.newsletter .newsletter-from{margin-left: 0;margin-top: 20px;width: 100%;max-width: 100%;}
	.products .index-p-ul2{grid-template-columns: 1fr 1fr 1fr;}
	.index-product .index-p-imgwrap{ grid-column-start: 1; margin-top: 20px;grid-column-end: 4;}
	.message-wrap{width: 100%;}
	.contact-wrap{grid-template-columns: 1fr;}
	.contact-wrap .contact-con{padding: 30px;}
	.contact-main{display: block;}
	.contact-message{width: 100%;}
	.contact-map{width: 100%; max-width: 100%; margin-left: 0;margin-top: 40px;padding-top: 40px; border-top: 1px solid var(--grey_e);}
	.download .grid{grid-template-columns: 1fr 1fr 1fr;}
	.waterfall {column-count: 2;}
	.header .search{display: flex; margin-left: auto;}
	.navbar .menu-button{margin-left: 10px;}
	.header .search-wrap{    width: 100%;max-width: 100%;position: fixed;top: 0;left: 0;z-index: 8;padding: 100px 20px 40px 20px;background: rgba(0, 0, 0, 80%);display: flex;align-items: flex-start; overflow: hidden; display: none;}
	.header .search-show{display: block;transition:all .3s ease;}
}

@media screen and (max-width: 768px) {
	.footer .footer-about, .footer .footer-menu, .m-text{display: none;}
	.footer .footer-contact{width: 60%;}
	.index-about .about-img, .index-about .about-content, .about .about-right, .about .about-text, .products .products-detail .p-detail-images, .products .products-detail .p-detail-info{width: 100%; max-width: 100%;}
	.index-about-all, .about .about-main, .products .products-detail{flex-direction: column;}
	.index-about .about-img img{width: 100%; height: auto;}
	.index-about .content-text{width: 100%;max-width: 100%; padding: 30px 0 0 0;}
	.header .email a, .header .phone a{ padding: 0 16px; }
	.header .email a:hover, .header .phone a:hover{background: #7b6b25;}
	.header .phone{ padding: 0; margin-left: 10px;}
	.m-banner-1{ display: none;}
	.m-banner-2{ display:block;}
	.banner{height: 500px;}
	.about .about-right{margin-top: 20px;}
	.news-grid, .products .products-content .p-grid, .company-data ul{ grid-template-columns: 1fr 1fr;}
	.download .grid{margin-top: 30px;grid-template-columns: 1fr 1fr;grid-gap: 10px;}
	.products .products-detail .p-detail-info{margin-top: 20px;}
	.company-data li:last-child{grid-column-start: 1; grid-column-end: 3;}
	.company-data li .data-text .data-number{font-size: 30px;}
	.banner ul li .title{font-size: 48px;}
	.message ul{grid-gap: 10px 10px;}
	.products .products-name h3{font-size: 15px;}
	.products .products-name span{font-size: 17px;}
	.index-about .about-left{width: 100%;}
	.banner{height: auto;}
	.banner .title-2, .index-product .index-p-con span{font-size: 20px;}
	.banner .title-1{font-size: 30px;}
	.index-product .index-p-con span{font-size: 26px;}
	.banner .big-img{display: none;}
	.banner .banner-img .small-img{display: block;}
	.download .grid{grid-template-columns: 1fr 1fr;}
	.service .service-main{display: block;}
	.service .service-text{padding:  20px 0 0 0;}
	.products .products-detail .p-detail-info .products-button{margin-top: 40px;}
}

@media screen and (max-width: 640px) {
	html, 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, .news .news-describe, .footer .footer-mt p, .page-describe, .products .products-introduction .p-introduction-text li, .news-detail .detail-content li, .products .products-text li{line-height: 1.3;}
	.h2{    font-size: 24px;line-height: 20px;}
	.margin-top146{margin-top: 116px;}
	.products .products-content, .message .message-content, .swiper-container, .footer .footer-download, .more-all, .footer .footer-mt, .certificate .certificate-content, .factory .factory-content, .products .products-detail .p-detail-info .p-detail-text, .products .products-detail .p-detail-info .products-button{margin-top: 20px;}
	.header .topbar{    height: 36px;}
	.header .text{    line-height: 36px;}
	.navbar, .navbar .logo img{height: 70px;}
	.navbar .logo-img img{height: 50px; width: auto;}
	.about .about-title{font-size: 26px;}
	.navbar .logo-img{margin-left: 20px;}
	.banner ul li .title{font-size: 24px;}
	.banner ul li:nth-child(2n) .container {text-align: center;}
	.banner .banner-span2{    bottom: 20px!important;}
	.banner .flex-column{ margin-bottom: 250px;}
	.page-padding{padding: 50px 0;}
	.message{height: auto;}
	.margin-top100{margin-top: 50px;}
	.more-jiantuo-left{width: 40px; height: 40px;}
	.more-jiantuo-right{width: 40px; height: 40px;}
	.index-product .more-jiantuo-right, .index-product .more-jiantuo-left, .more-jiantuo-right, .more-jiantuo-left, .factory .more-jiantuo-right, .factory .more-jiantuo-left{top:35%;;}
	.footer .footer-content{flex-direction: column;}
	.footer .footer-contact{ width: 100%;}
	.footer .footer-content, .company-data{margin-top: 0px;    padding: 30px 0 30px 0;}
	.message input, .message textarea{    padding: 6px 12px;}
	.products .index-p-ul2{grid-template-columns: 1fr 1fr;}
	.index-product .index-p-ul2 li:nth-child(3){display: none;}
	.index-product .index-p-imgwrap{grid-column-end:3}
	.message-wrap {width: 100%;padding: 30px 5%;}
	.navbar .logo a img{height: 70px;}
	.navbar .logo-img img{height: 40px;}
	.header{padding-top: 20px;}
	.banner .title-1{font-size: 24px;}
	.banner .title-2{font-size: 18px;}
	.index-product .index-p-con span{font-size: 20px;}
	.banner-more{padding: 4px 4px 4px 20px;}
	.certificate .certificate-content .certificate-title, .factory .factory-name{font-size: 14px;}
	.page-title{font-size: 24px;}
	.h2-title{font-size: 20px;}
	.download .download-name a{padding: 20px 0;min-height:auto;}
	.pager ul li a{font-size: 13px; margin: 15px 2px 0 2px;}
	.news-detail .detail-title{font-size: 22px;line-height: 1.4;text-align: left;}
	.waterfall-item .wrapper-text{background: none;height: 100%;color: rgba(255, 255, 255, 100%);display: block;margin: 40px 0 0 40px;text-shadow: 0px 5px 20px rgba(0, 0, 0, 0.6); width: max-content;height: max-content;}
	
	.certificate .certificate-content ul li {width: 40%;}
	.products, .products .products-about, .margin-top100, .service, .page-news, .news-detail .prenext, .contact, .contact .contact-message, .google-map, .download{     margin-top: 30px;}
	.products .products-content .grid, .page-news .news-all ul.news-item{grid-gap: 10px;}
	.news-detail .detail-info span{margin-right: 10px;}
	.google-map{height: 300px; }
	.suspension span{width: 40px; height: 40px;font-size: 20px;}
	.suspension{    width: 40px; height: 90px;}
	.header .close-buttom{font-size: 30px;}
	.products .products-content .index-p-ul{grid-template-columns: 1fr 1fr;grid-gap: 10px;}
	.products .products-introduction table tr td {padding: 4px;}
}
@media screen and (max-width: 500px) {
	 .waterfall { column-count: 1; }
	.download .grid{ grid-template-columns: 1fr;}
	
}