/* 首页模块命名规范：rat-index-模块英文名称，如：rat-index-about 内页页面外层容器命名规范： 1、通用样式：rat-page，内页外层容器通用样式，使用方法
2、页面样式：rat-page-模块英文名称，如：rat-page-about（关于我们页面） 3、内页模块命名规范：rat-模块英文名称，如：rat-product（产品）、rat-honor（荣誉） 其他命名规范： 1、使用swiper、owl.Carousel等插件时，插件外层容器可用模块名称-container,如rat-product-container 2、使用英文名称为样式命名，不要出现拼音和首字母 3、模块最外层容器命名规范：rat-自定义名称 4、样式命名中单词由符号“-”来连接，如：rat-culture,rat-hot-product 备注：上面所说的模块是网站前台页面中的组成模块，如：首页中包含网站头部、产品、新闻、荣誉、案例、网站底部，其中每个部分视为一个模块。 */ @charset "utf-8"; @font-face {font-family: "Poppins";font-weight: 100;src: url("../fonts/PoppinsThin.otf") format("opentype");} @font-face {font-family: "Poppins";font-weight: 200;src: url("../fonts/PoppinsExtralight.otf") format("opentype");} @font-face {font-family: "Poppins";font-weight: 300;src: url("../fonts/PoppinsLight.otf") format("opentype");} @font-face {font-family: "Poppins";font-weight: normal;src: url("../fonts/PoppinsRegular.otf") format("opentype");} @font-face {font-family: "Poppins";font-weight: 500;src: url("../fonts/PoppinsMedium.otf") format("opentype");} @font-face {font-family: "Poppins";font-weight: 600;src: url("../fonts/PoppinsSemibold.otf") format("opentype");} @font-face {font-family: "Poppins";font-weight: bold;src: url("../fonts/PoppinsBold.otf") format("opentype");} @font-face {font-family: "Poppins";font-weight: 800;src: url("../fonts/PoppinsExtrabold.otf") format("opentype");} @font-face {font-family: "Poppins";font-weight: 900;src: url("../fonts/PoppinsBlack.otf") format("opentype");} @font-face {font-family: "ZillaSlab-Bold";src: url("../fonts/ZillaSlab-Bold.ttf?r=62144307125");src: url("../fonts/ZillaSlab-Bold.ttf") format("truetype");font-weight: normal;font-style: normal;} /* 常用图标共用图 */ @font-face {font-family: "iconfont";src: url('../fonts/iconfont.woff2?t=1749193767741') format('woff2'),url('../fonts/iconfont.woff?t=1749193767741') format('woff'),url('../fonts/iconfont.ttf?t=1749193767741') format('truetype');} .iconfont {font-family: "iconfont" !important;font-size: 16px;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;} .icon-tuihuo:before {content: "\e651";} .icon-weixinpay01:before {content: "\e662";} .icon-gouwu01:before {content: "\e612";} .icon-gouwuche:before {content: "\e69c";} .icon-sheji01:before {content: "\e6a0";} .icon-zhuang01:before {content: "\e631";} .icon-news01:before {content: "\e772";} .icon-jd01:before {content: "\e652";} .icon-shang01:before {content: "\e621";} .icon-shang02:before {content: "\e851";} .icon-shang03:before {content: "\e679";} .icon-shang04:before {content: "\e6a8";} .icon-shang05:before {content: "\e681";} .icon-shang06:before {content: "\e686";} .icon-xia01:before {content: "\e632";} .icon-xia02:before {content: "\e67a";} .icon-xia03:before {content: "\e6c8";} .icon-xia04:before {content: "\e6a1";} .icon-xia05:before {content: "\e683";} .icon-xia06:before {content: "\e687";} .icon-zuo01:before {content: "\e689";} .icon-zuo02:before {content: "\e714";} .icon-zuo03:before {content: "\e64d";} .icon-zuo04:before {content: "\e6d4";} .icon-zuo05:before {content: "\e708";} .icon-zuo06:before {content: "\e64b";} .icon-zuo07:before {content: "\e63c";} .icon-you01:before {content: "\e63a";} .icon-you02:before {content: "\e6c7";} .icon-you03:before {content: "\e6c5";} .icon-you04:before {content: "\e605";} .icon-you05:before {content: "\e688";} .icon-you06:before {content: "\e690";} .icon-baocun01:before {content: "\e677";} .icon-baocun02:before {content: "\e702";} .icon-baocun03:before {content: "\e65c";} .icon-hongwuxing01:before {content: "\e707";} .icon-hongwuxing02:before {content: "\e78f";} .icon-hongwuxing03:before {content: "\e66f";} .icon-liulanqi01:before {content: "\e721";} .icon-liulanqi02:before {content: "\e71e";} .icon-liulanqi03:before {content: "\e947";} .icon-liulanqi04:before {content: "\e946";} .icon-liulanqi05:before {content: "\e638";} .icon-liulanqi06:before {content: "\e620";} .icon-liulanqi07:before {content: "\e67f";} .icon-liulanqi08:before {content: "\e684";} .icon-linkman01:before {content: "\e653";} .icon-linkman02:before {content: "\e656";} .icon-linkman03:before {content: "\e661";} .icon-linkman04:before {content: "\e614";} .icon-linkman05:before {content: "\e62b";} .icon-linkman06:before {content: "\e64e";} .icon-linkman07:before {content: "\ea3f";} .icon-linkman08:before {content: "\e6bb";} .icon-linkman09:before {content: "\e68e";} .icon-company01:before {content: "\ec19";} .icon-company02:before {content: "\e6bd";} .icon-company03:before {content: "\e6b8";} .icon-company04:before {content: "\e975";} .icon-video01:before {content: "\eb29";} .icon-video02:before {content: "\ea3e";} .icon-video03:before {content: "\ea44";} .icon-7tian01:before {content: "\e691";} .icon-7tian02:before {content: "\e6d5";} .icon-7tian03:before {content: "\e619";} .icon-7tian04:before {content: "\e68b";} .icon-15tian01:before {content: "\e678";} .icon-15tian02:before {content: "\e6a9";} .icon-15tian03:before {content: "\e6bf";} .icon-15tian04:before {content: "\ea55";} .icon-hot01:before {content: "\e61a";} .icon-hot02:before {content: "\e625";} .icon-hot03:before {content: "\e626";} .icon-hot04:before {content: "\e657";} .icon-hot05:before {content: "\e6c1";} .icon-hot06:before {content: "\e6ea";} .icon-hot07:before {content: "\e66d";} .icon-hot08:before {content: "\e665";} .icon-facebook01:before {content: "\e87e";} .icon-facebook02:before {content: "\e88d";} .icon-facebook03:before {content: "\e644";} .icon-facebook04:before {content: "\e60c";} .icon-facebook05:before {content: "\e608";} .icon-facebook06:before {content: "\e617";} .icon-linkedin01:before {content: "\e87d";} .icon-linkedin02:before {content: "\e763";} .icon-linkedin03:before {content: "\e666";} .icon-linkedin04:before {content: "\e7ea";} .icon-linkedin05:before {content: "\e8cb";} .icon-instagram:before {content: "\e672";} .icon-xiaohongshu01:before {content: "\e6ad";} .icon-xiaohongshu02:before {content: "\e65a";} .icon-xiaohongshu03:before {content: "\e65b";} .icon-xiaochengxu01:before {content: "\e61c";} .icon-xiaochengxu02:before {content: "\e673";} .icon-xiaochengxu03:before {content: "\e6ba";} .icon-google01:before {content: "\e87a";} .icon-google02:before {content: "\e886";} .icon-google03:before {content: "\e88e";} .icon-google04:before {content: "\e88f";} .icon-google05:before {content: "\e68a";} .icon-alipay01:before {content: "\e655";} .icon-alipay02:before {content: "\e654";} .icon-alipay03:before {content: "\e603";} .icon-alipay04:before {content: "\e68d";} .icon-github02:before {content: "\e628";} .icon-github03:before {content: "\e80c";} .icon-github04:before {content: "\e68f";} .icon-youtube01:before {content: "\e880";} .icon-youtube02:before {content: "\e883";} .icon-youtube03:before {content: "\e853";} .icon-youtube04:before {content: "\ece8";} .icon-pdf01:before {content: "\e69a";} .icon-pdf02:before {content: "\e6eb";} .icon-pdf03:before {content: "\e6ae";} .icon-pdf04:before {content: "\eacd";} .icon-pdf05:before {content: "\e740";} .icon-tmall01:before {content: "\e68c";} .icon-tmall02:before {content: "\e6b3";} .icon-tmall03:before {content: "\e6b0";} .icon-tmall04:before {content: "\e6b7";} .icon-tmall05:before {content: "\e67d";} .icon-tmall06:before {content: "\e633";} .icon-tmall07:before {content: "\e6d2";} .icon-maps01:before {content: "\e637";} .icon-maps02:before {content: "\e624";} .icon-maps03:before {content: "\e62e";} .icon-maps04:before {content: "\e669";} .icon-maps05:before {content: "\e62f";} .icon-maps06:before {content: "\e814";} .icon-honor01:before {content: "\e69b";} .icon-honor02:before {content: "\e69d";} .icon-honor03:before {content: "\e692";} .icon-honor04:before {content: "\e61b";} .icon-honor05:before {content: "\e647";} .icon-honor06:before {content: "\e6b9";} .icon-gift01:before {content: "\e639";} .icon-gift02:before {content: "\e7b6";} .icon-excel01:before {content: "\e667";} .icon-excel02:before {content: "\e7b7";} .icon-excel03:before {content: "\e857";} .icon-excel04:before {content: "\edde";} .icon-excel05:before {content: "\ea45";} .icon-kefu01:before {content: "\e615";} .icon-kefu02:before {content: "\e63f";} .icon-kefu03:before {content: "\e6a3";} .icon-double-zuo:before {content: "\e645";} .icon-double-you:before {content: "\e646";} .icon-double-shang:before {content: "\e6a5";} .icon-double-xia:before {content: "\e6a6";} .icon-skype01:before {content: "\e87f";} .icon-skype02:before {content: "\e882";} .icon-skype03:before {content: "\e7c9";} .icon-skype04:before {content: "\e67c";} .icon-skype05:before {content: "\e826";} .icon-links01:before {content: "\e63d";} .icon-links02:before {content: "\e6be";} .icon-whatsapp01:before {content: "\e8ea";} .icon-whatsapp02:before {content: "\e98b";} .icon-whatsapp03:before {content: "\e7ae";} .icon-whatsapp04:before {content: "\ec2d";} .icon-shoping01:before {content: "\e668";} .icon-shoping02:before {content: "\e601";} .icon-shoping03:before {content: "\e604";} .icon-shoping04:before {content: "\e6c0";} .icon-gongwenbao01:before {content: "\e6b5";} .icon-gongwenbao02:before {content: "\e6c6";} .icon-email01:before {content: "\e63e";} .icon-email02:before {content: "\e908";} .icon-email03:before {content: "\e6af";} .icon-email04:before {content: "\e658";} .icon-email06:before {content: "\e6d1";} .icon-email07:before {content: "\e623";} .icon-email08:before {content: "\e60e";} .icon-email09:before {content: "\e636";} .icon-email10:before {content: "\e6c4";} .icon-email11:before {content: "\e6ff";} .icon-ppt01:before {content: "\e641";} .icon-ppt02:before {content: "\e64f";} .icon-ppt03:before {content: "\e650";} .icon-ppt05:before {content: "\e6c2";} .icon-ppt04:before {content: "\e6a7";} .icon-new01:before {content: "\e846";} .icon-new02:before {content: "\e847";} .icon-new03:before {content: "\e66c";} .icon-new04:before {content: "\e629";} .icon-toutiao01:before {content: "\e622";} .icon-toutiao02:before {content: "\e6cb";} .icon-toutiao03:before {content: "\e6ce";} .icon-qr-code01:before {content: "\e8e0";} .icon-qr-code02:before {content: "\e671";} .icon-qr-code03:before {content: "\e680";} .icon-qr-code04:before {content: "\e642";} .icon-douyin01:before {content: "\e8db";} .icon-douyin02:before {content: "\e6bc";} .icon-douyin03:before {content: "\e6cc";} .icon-douyin04:before {content: "\e6d0";} .icon-mouse01:before {content: "\e6a4";} .icon-mouse02:before {content: "\e62a";} .icon-twitter01:before {content: "\e65d";} .icon-twitter02:before {content: "\e736";} .icon-website01:before {content: "\e64a";} .icon-website02:before {content: "\e61f";} .icon-website03:before {content: "\e649";} .icon-website04:before {content: "\e9ee";} .icon-website05:before {content: "\e6ab";} .icon-website06:before {content: "\e722";} .icon-website07:before {content: "\e635";} .icon-qq01:before {content: "\e606";} .icon-qq02:before {content: "\e64c";} .icon-qq03:before {content: "\e630";} .icon-qq04:before {content: "\e6b4";} .icon-weibo01:before {content: "\e602";} .icon-weibo02:before {content: "\e6b2";} .icon-zhihu01:before {content: "\e659";} .icon-zhihu02:before {content: "\e6c9";} .icon-zhihu03:before {content: "\e618";} .icon-close01:before {content: "\e616";} .icon-close02:before {content: "\e60b";} .icon-taobao01:before {content: "\e65f";} .icon-taobao02:before {content: "\e755";} .icon-taobao03:before {content: "\e786";} .icon-taobao04:before {content: "\e609";} .icon-weixin01:before {content: "\e682";} .icon-weixin02:before {content: "\e607";} .icon-weixin03:before {content: "\e694";} .icon-wordpress01:before {content: "\e8ca";} .icon-wordpress02:before {content: "\e870";} .icon-wordpress03:before {content: "\e73c";} .icon-appale01:before {content: "\e6cd";} .icon-appale02:before {content: "\e704";} .icon-appale03:before {content: "\e60d";} .icon-word01:before {content: "\e858";} .icon-word03:before {content: "\e911";} .icon-word04:before {content: "\e912";} .icon-word05:before {content: "\e627";} .icon-download01:before {content: "\e648";} .icon-download02:before {content: "\e675";} .icon-download03:before {content: "\e67e";} .icon-download04:before {content: "\e60f";} .icon-search01:before {content: "\e600";} .icon-search02:before {content: "\e62c";} .icon-maney01:before {content: "\e66b";} .icon-maney02:before {content: "\e6b6";} .icon-maney03:before {content: "\e6ca";} .icon-maney04:before {content: "\e640";} .icon-maney05:before {content: "\e79f";} .icon-maney06:before {content: "\e611";} .icon-tel01:before {content: "\e818";} .icon-tel02:before {content: "\e7ec";} .icon-tel03:before {content: "\e693";} .icon-tel04:before {content: "\e6df";} .icon-tel05:before {content: "\e6a2";} .icon-tel06:before {content: "\e65e";} .icon-tel07:before {content: "\e66e";} .icon-tel08:before {content: "\e67b";} .icon-fax01:before {content: "\e6c3";} .icon-fax02:before {content: "\e932";} .icon-fax03:before {content: "\e7af";} .icon-fax04:before {content: "\e6b1";} .icon-search01:before {content: "\e62c";} .icon-nav01:before {content: "\e696";} .icon-nav02:before {content: "\e61e";} .icon-nav03:before {content: "\e634";} /* Bootstrap 个性鼠定制修改版 */ *,*::before,*::after {box-sizing: border-box;} @media (prefers-reduced-motion: no-preference) { :root {scroll-behavior: smooth;} } body {margin: 0;font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size: 1rem;font-weight: 400;line-height: 1.5;color: #212529;-webkit-text-size-adjust: 100%;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);} hr {margin: 1rem 0;color: inherit;border: 0;border-top: 1px solid;opacity: 0.25;} h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {margin-top: 0;margin-bottom: 0.5rem;font-weight: 500;line-height: 1.2;} h1, .h1 {font-size: calc(1.375rem + 1.5vw);} @media (min-width: 1200px) { h1, .h1 {font-size: 2.5rem;} } h2, .h2 {font-size: calc(1.325rem + 0.9vw);} @media (min-width: 1200px) { h2, .h2 { font-size: 2rem;} } h3, .h3 {font-size: calc(1.3rem + 0.6vw); } @media (min-width: 1200px) { h3, .h3 { font-size: 1.75rem;} } h4, .h4 { font-size: calc(1.275rem + 0.3vw); } @media (min-width: 1200px) { h4, .h4 { font-size: 1.5rem;} } h5, .h5 {font-size: 1.25rem;} h6, .h6 {font-size: 1rem;} p {margin-top: 0;margin-bottom: 1rem;} .container,.container-fluid,.container-xxl,.container-xl,.container-lg,.container-md,.container-sm {--bs-gutter-y: 0;width: 100%;padding-right: calc(1.5rem * 0.5);padding-left: calc(1.5rem * 0.5);margin-right: auto;margin-left: auto;} @media (min-width: 576px) { .container-sm, .container {max-width: 540px;} } @media (min-width: 768px) { .container-md, .container-sm, .container {max-width: 720px;} } @media (min-width: 992px) { .container-lg, .container-md, .container-sm, .container {max-width: 960px;} } @media (min-width: 1200px) { .container-xl, .container-lg, .container-md, .container-sm, .container {max-width: 1140px;} } @media (min-width: 1400px) { .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {max-width: 1320px;} } /* @media (min-width: 1600px) { .container-xxxl, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {max-width: 1500px;} } */ .row {display: flex;flex-wrap: wrap;margin-top: calc(-1 * 0px);margin-right: calc(-0.5 * 1.5rem);margin-left: calc(-0.5 * 1.5rem);} .row > * {flex-shrink: 0;width: 100%;max-width: 100%;padding-right: calc(1.5rem * 0.5);padding-left: calc(1.5rem * 0.5);margin-top: 0px;} .col {flex: 1 0 0%;} .row-cols-auto > * {flex: 0 0 auto;width: auto;} .row-cols-1 > * {flex: 0 0 auto;width: 100%;} .row-cols-2 > * {flex: 0 0 auto;width: 50%;} .row-cols-3 > * {flex: 0 0 auto;width: 33.3333333333%;} .row-cols-4 > * {flex: 0 0 auto;width: 25%;} .row-cols-5 > * {flex: 0 0 auto;width: 20%;} .row-cols-6 > * {flex: 0 0 auto;width: 16.6666666667%;} .col-auto {flex: 0 0 auto;width: auto;} .col-1 {flex: 0 0 auto;width: 8.33333333%;} .col-2 {flex: 0 0 auto;width: 16.66666667%;} .col-3 {flex: 0 0 auto;width: 25%;} .col-4 {flex: 0 0 auto;width: 33.33333333%;} .col-5 {flex: 0 0 auto;width: 41.66666667%;} .col-6 {flex: 0 0 auto;width: 50%;} .col-7 {flex: 0 0 auto;width: 58.33333333%;} .col-8 {flex: 0 0 auto;width: 66.66666667%;} .col-9 {flex: 0 0 auto;width: 75%;} .col-10 {flex: 0 0 auto;width: 83.33333333%;} .col-11 {flex: 0 0 auto;width: 91.66666667%;} .col-12 {flex: 0 0 auto;width: 100%;} @media (min-width: 576px) { .col-sm {flex: 1 0 0%;} .row-cols-sm-auto > * {flex: 0 0 auto;width: auto;} .row-cols-sm-1 > * {flex: 0 0 auto;width: 100%;} .row-cols-sm-2 > * {flex: 0 0 auto;width: 50%;} .row-cols-sm-3 > * {flex: 0 0 auto;width: 33.3333333333%;} .row-cols-sm-4 > * {flex: 0 0 auto;width: 25%;} .row-cols-sm-5 > * {flex: 0 0 auto;width: 20%;} .row-cols-sm-6 > * {flex: 0 0 auto;width: 16.6666666667%;} .col-sm-auto {flex: 0 0 auto;width: auto;} .col-sm-1 {flex: 0 0 auto;width: 8.33333333%;} .col-sm-2 {flex: 0 0 auto;width: 16.66666667%;} .col-sm-3 {flex: 0 0 auto;width: 25%;} .col-sm-4 {flex: 0 0 auto;width: 33.33333333%;} .col-sm-5 {flex: 0 0 auto;width: 41.66666667%;} .col-sm-6 {flex: 0 0 auto;width: 50%;} .col-sm-7 {flex: 0 0 auto;width: 58.33333333%;} .col-sm-8 {flex: 0 0 auto;width: 66.66666667%;} .col-sm-9 {flex: 0 0 auto;width: 75%;} .col-sm-10 {flex: 0 0 auto;width: 83.33333333%;} .col-sm-11 {flex: 0 0 auto;width: 91.66666667%;} .col-sm-12 {flex: 0 0 auto;width: 100%;} } @media (min-width: 768px) { .col-md {flex: 1 0 0%;} .row-cols-md-auto > * {flex: 0 0 auto;width: auto;} .row-cols-md-1 > * {flex: 0 0 auto;width: 100%;} .row-cols-md-2 > * {flex: 0 0 auto;width: 50%;} .row-cols-md-3 > * {flex: 0 0 auto;width: 33.3333333333%;} .row-cols-md-4 > * {flex: 0 0 auto;width: 25%;} .row-cols-md-5 > * {flex: 0 0 auto;width: 20%;} .row-cols-md-6 > * {flex: 0 0 auto;width: 16.6666666667%;} .col-md-auto {flex: 0 0 auto;width: auto;} .col-md-1 {flex: 0 0 auto;width: 8.33333333%;} .col-md-2 {flex: 0 0 auto;width: 16.66666667%;} .col-md-3 {flex: 0 0 auto;width: 25%;} .col-md-4 {flex: 0 0 auto;width: 33.33333333%;} .col-md-5 {flex: 0 0 auto;width: 41.66666667%;} .col-md-6 {flex: 0 0 auto;width: 50%;} .col-md-7 {flex: 0 0 auto;width: 58.33333333%;} .col-md-8 {flex: 0 0 auto;width: 66.66666667%;} .col-md-9 {flex: 0 0 auto;width: 75%;} .col-md-10 {flex: 0 0 auto;width: 83.33333333%;} .col-md-11 {flex: 0 0 auto;width: 91.66666667%;} .col-md-12 {flex: 0 0 auto;width: 100%;} } @media (min-width: 992px) { .col-lg {flex: 1 0 0%;} .row-cols-lg-auto > * {flex: 0 0 auto;width: auto;} .row-cols-lg-1 > * {flex: 0 0 auto;width: 100%;} .row-cols-lg-2 > * {flex: 0 0 auto;width: 50%;} .row-cols-lg-3 > * {flex: 0 0 auto;width: 33.3333333333%;} .row-cols-lg-4 > * {flex: 0 0 auto;width: 25%;} .row-cols-lg-5 > * {flex: 0 0 auto;width: 20%;} .row-cols-lg-6 > * {flex: 0 0 auto;width: 16.6666666667%;} .col-lg-auto {flex: 0 0 auto;width: auto;} .col-lg-1 {flex: 0 0 auto;width: 8.33333333%;} .col-lg-2 {flex: 0 0 auto;width: 16.66666667%;} .col-lg-3 {flex: 0 0 auto;width: 25%;} .col-lg-4 {flex: 0 0 auto;width: 33.33333333%;} .col-lg-5 {flex: 0 0 auto;width: 41.66666667%;} .col-lg-6 {flex: 0 0 auto;width: 50%;} .col-lg-7 {flex: 0 0 auto;width: 58.33333333%;} .col-lg-8 {flex: 0 0 auto;width: 66.66666667%;} .col-lg-9 {flex: 0 0 auto;width: 75%;} .col-lg-10 {flex: 0 0 auto;width: 83.33333333%;} .col-lg-11 {flex: 0 0 auto;width: 91.66666667%;} .col-lg-12 {flex: 0 0 auto;width: 100%;} } @media (min-width: 1200px) { .col-xl {flex: 1 0 0%;} .row-cols-xl-auto > * {flex: 0 0 auto;width: auto;} .row-cols-xl-1 > * {flex: 0 0 auto;width: 100%;} .row-cols-xl-2 > * {flex: 0 0 auto;width: 50%;} .row-cols-xl-3 > * {flex: 0 0 auto;width: 33.3333333333%;} .row-cols-xl-4 > * {flex: 0 0 auto;width: 25%;} .row-cols-xl-5 > * {flex: 0 0 auto;width: 20%;} .row-cols-xl-6 > * {flex: 0 0 auto;width: 16.6666666667%;} .col-xl-auto {flex: 0 0 auto;width: auto;} .col-xl-1 {flex: 0 0 auto;width: 8.33333333%;} .col-xl-2 {flex: 0 0 auto;width: 16.66666667%;} .col-xl-3 {flex: 0 0 auto;width: 25%;} .col-xl-4 {flex: 0 0 auto;width: 33.33333333%;} .col-xl-5 {flex: 0 0 auto;width: 41.66666667%;} .col-xl-6 {flex: 0 0 auto;width: 50%;} .col-xl-7 {flex: 0 0 auto;width: 58.33333333%;} .col-xl-8 {flex: 0 0 auto;width: 66.66666667%;} .col-xl-9 {flex: 0 0 auto;width: 75%;} .col-xl-10 {flex: 0 0 auto;width: 83.33333333%;} .col-xl-11 {flex: 0 0 auto;width: 91.66666667%;} .col-xl-12 {flex: 0 0 auto;width: 100%;} } @media (min-width: 1400px) { .col-xxl {flex: 1 0 0%;} .row-cols-xxl-auto > * {flex: 0 0 auto;width: auto;} .row-cols-xxl-1 > * {flex: 0 0 auto;width: 100%;} .row-cols-xxl-2 > * {flex: 0 0 auto;width: 50%;} .row-cols-xxl-3 > * {flex: 0 0 auto;width: 33.3333333333%;} .row-cols-xxl-4 > * {flex: 0 0 auto;width: 25%;} .row-cols-xxl-5 > * {flex: 0 0 auto;width: 20%;} .row-cols-xxl-6 > * {flex: 0 0 auto;width: 16.6666666667%;} .col-xxl-auto {flex: 0 0 auto;width: auto;} .col-xxl-1 {flex: 0 0 auto;width: 8.33333333%;} .col-xxl-2 {flex: 0 0 auto;width: 16.66666667%;} .col-xxl-3 {flex: 0 0 auto;width: 25%;} .col-xxl-4 {flex: 0 0 auto;width: 33.33333333%;} .col-xxl-5 {flex: 0 0 auto;width: 41.66666667%;} .col-xxl-6 {flex: 0 0 auto;width: 50%;} .col-xxl-7 {flex: 0 0 auto;width: 58.33333333%;} .col-xxl-8 {flex: 0 0 auto;width: 66.66666667%;} .col-xxl-9 {flex: 0 0 auto;width: 75%;} .col-xxl-10 {flex: 0 0 auto;width: 83.33333333%;} .col-xxl-11 {flex: 0 0 auto;width: 91.66666667%;} .col-xxl-12 {flex: 0 0 auto;width: 100%;} } @media (min-width: 1600px) { .col-xxxl {flex: 1 0 0%;} .row-cols-xxxl-auto > * {flex: 0 0 auto;width: auto;} .row-cols-xxxl-1 > * {flex: 0 0 auto;width: 100%;} .row-cols-xxxl-2 > * {flex: 0 0 auto;width: 50%;} .row-cols-xxxl-3 > * {flex: 0 0 auto;width: 33.3333333333%;} .row-cols-xxxl-4 > * {flex: 0 0 auto;width: 25%;} .row-cols-xxxl-5 > * {flex: 0 0 auto;width: 20%;} .row-cols-xxxl-6 > * {flex: 0 0 auto;width: 16.6666666667%;} .col-xxxl-auto {flex: 0 0 auto;width: auto;} .col-xxxl-1 {flex: 0 0 auto;width: 8.33333333%;} .col-xxxl-2 {flex: 0 0 auto;width: 16.66666667%;} .col-xxxl-3 {flex: 0 0 auto;width: 25%;} .col-xxxl-4 {flex: 0 0 auto;width: 33.33333333%;} .col-xxxl-5 {flex: 0 0 auto;width: 41.66666667%;} .col-xxxl-6 {flex: 0 0 auto;width: 50%;} .col-xxxl-7 {flex: 0 0 auto;width: 58.33333333%;} .col-xxxl-8 {flex: 0 0 auto;width: 66.66666667%;} .col-xxxl-9 {flex: 0 0 auto;width: 75%;} .col-xxxl-10 {flex: 0 0 auto;width: 83.33333333%;} .col-xxxl-11 {flex: 0 0 auto;width: 91.66666667%;} .col-xxxl-12 {flex: 0 0 auto;width: 100%;} } .text-start {text-align: left !important;} .text-end {text-align: right !important;} .text-center {text-align: center !important;} .justify-content-start {justify-content: flex-start !important;} .justify-content-end {justify-content: flex-end !important;} .justify-content-center {justify-content: center !important;} .pagination {display: flex;padding-left: 0;list-style: none;} .page-link {position: relative;display: block;padding: 0.375rem 0.75rem;font-size: 1rem;color: #0d6efd;text-decoration: none;background-color: #fff;border: 1px solid #dee2e6;transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;} @media (prefers-reduced-motion: reduce) { .page-link {transition: none;} } .page-link:hover {z-index: 2;color: #9ec5fe;background-color: #2b3035;border-color: #dee2e6;} .page-link:focus {z-index: 3;color: #0a58ca;background-color: #e9ecef;outline: 0;box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);} .page-link.active, .active > .page-link {z-index: 3;color: #fff;background-color: #0d6efd;border-color: #0d6efd;} .page-link.disabled, .disabled > .page-link {color: rgba(33, 37, 41, 0.75);pointer-events: none;background-color: #e9ecef;border-color: #dee2e6;} .page-item:not(:first-child) .page-link {margin-left: -1px;} .page-item:first-child .page-link {border-top-left-radius: 0.375rem;border-bottom-left-radius: 0.375rem;} .page-item:last-child .page-link {border-top-right-radius: 0.375rem;border-bottom-right-radius: 0.375rem;} .float-start {float: left !important;} .float-end {float: right !important;} .float-none {float: none !important;} @media (min-width: 576px) { .float-sm-start {float: left !important;} .float-sm-end {float: right !important;} .float-sm-none {float: none !important;} } @media (min-width: 768px) { .float-md-start {float: left !important;} .float-md-end {float: right !important;} .float-md-none {float: none !important;} } @media (min-width: 992px) { .float-lg-start {float: left !important;} .float-lg-end {float: right !important;} .float-lg-none {float: none !important;} } @media (min-width: 1200px) { .float-xl-start {float: left !important;} .float-xl-end {float: right !important;} .float-xl-none {float: none !important;} } @media (min-width: 1400px) { .float-xxl-start {float: left !important;} .float-xxl-end {float: right !important;} .float-xxl-none {float: none !important;} } /* 网站共用开发 */ html{overflow-x: hidden;font-size: 16px;} html.active{overflow: hidden;} body {min-width: 320px;color: #1f1f1f;overflow: hidden;font-family:"Poppins","PingFang SC", PingHei, STHeitiSC-Light, "Myriad Set Pro","Lucida Grande", "Helvetica Neue", Helvetica, "microsoft yahei", SimHei,tahoma, Arial, Verdana, sans-serif;} *{word-break:normal !important} li {list-style: none;} i {font-style: normal;} a {color: #1f1f1f; text-decoration: none;} a:focus{text-decoration: none;outline: none;color:#1f1f1f;} a:hover { color: #1f1f1f;text-decoration: none;outline: none;} p,h1,h2,h3,h4,h5,h6,ul,li {margin: 0;padding: 0;} img {border: 0; max-width: 100%; vertical-align: middle;} .pc {display: inline-block !important;} .mobile {display: none !important;} /*位置控制*/ .vertical-align {font-size: 0} .vertical-align:before {display: inline-block;height: 100%;vertical-align: middle;content: ""} .vertical-align-bottom,.vertical-align-middle {display: inline-block;max-width: 100%;font-size: 14px} .vertical-align-middle {vertical-align: middle} .vertical-align-bottom {vertical-align: bottom} @media (max-width: 991px) { .pc {display: none !important;} .mobile {display: inline-flex !important;} } /* animates */ @-webkit-keyframes fadeUp { from {opacity: 0;-webkit-transform: translate3d(0, 40px, 0);transform: translate3d(0, 40px, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} } @keyframes fadeUp { from {opacity: 0;-webkit-transform: translate3d(0, 40px, 0);transform: translate3d(0, 40px, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} } .fadeUp {-webkit-animation-name: fadeUp;animation-name: fadeUp;} @-webkit-keyframes fadeIn { from {opacity: 0;} to {opacity: 1;} } @keyframes fadeIn { from {opacity: 0;} to {opacity: 1;} } .fade {-webkit-animation-name: fadeIn;animation-name: fadeIn;} @-webkit-keyframes fadeDown { from {opacity: 0;-webkit-transform: translate3d(0, -40px, 0);transform: translate3d(0, -40px, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} } @keyframes fadeDown { from {opacity: 0;-webkit-transform: translate3d(0, -40px, 0);transform: translate3d(0, -40px, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} } .fadeDown {-webkit-animation-name: fadeDown;animation-name: fadeDown;} @-webkit-keyframes fadeLeft { from {opacity: 0;-webkit-transform: translate3d(-40px, 0, 0);transform: translate3d(-40px, 0, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} } @keyframes fadeLeft { from {opacity: 0;-webkit-transform: translate3d(-40px, 0, 0);transform: translate3d(-40px, 0, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} } .fadeLeft {-webkit-animation-name: fadeLeft;animation-name: fadeLeft;} @-webkit-keyframes fadeRight { from {opacity: 0;-webkit-transform: translate3d(40px, 0, 0);transform: translate3d(40px, 0, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} } @keyframes fadeRight { from {opacity: 0;-webkit-transform: translate3d(40px, 0, 0);transform: translate3d(40px, 0, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} } .fadeRight {-webkit-animation-name: fadeRight;animation-name: fadeRight;} @-webkit-keyframes zoomIn { 0% {opacity: 0;-webkit-transform: scale3d(.3, .3, .3);transform: scale3d(.3, .3, .3);} 50% {opacity: 1;} } @keyframes zoomIn { 0% {opacity: 0;-webkit-transform: scale3d(.3, .3, .3);transform: scale3d(.3, .3, .3);} 50% {opacity: 1;} } .zoomIn {-webkit-animation-name: zoomIn;animation-name: zoomIn;} /* 文字大小 */ .f14{font-size: 14px;} .f15{font-size: 15px;} .f16{font-size: 16px;} .f17{font-size: 17px;} .f18{font-size: 18px;} .f20{font-size: 1.0416vw;} .f22{font-size: 1.145833vw;} .f24{font-size: 1.25vw;} .f26{font-size: 1.35416vw;} .f28{font-size: 1.4583vw;} .f30{font-size: 1.5625vw;} .f32{font-size: 1.666vw;} .f36{font-size: 1.875vw;} .f38{font-size: 1.979vw;} .f40{font-size: 2.08vw;} .f42{font-size: 2.1875vw;} .f44{font-size: 2.2916vw;} .f46{font-size: 2.396vw;} .f48{font-size: 2.5vw;} .f50{font-size: 2.6vw;} .f54{font-size: 2.8125vw;} .f56{font-size: 2.917vw;} .f60{font-size: 3.125vw;} .f66{font-size: 3.438vw;} .f70{font-size: 3.64583vw;} .f72{font-size: 3.75vw;} .f76{font-size: 3.958vw;} .f80{font-size: 4.16vw;} .f90{font-size: 4.6875vw;} @media (max-width: 1600px) { .f14{font-size: 13px;} .f15{font-size: 14px;} .f16{font-size: 15px;} .f17{font-size: 16px;} .f18{font-size: 17px;} .f20{font-size: 1.2vw;} .f22{font-size: 1.3vw;} .f24{font-size: 1.4vw;} .f26{font-size: 1.5vw;} .f28{font-size: 1.6vw;} .f30{font-size: 1.7vw;} .f32{font-size: 1.8vw;} .f36{font-size: 1.9vw;} .f38{font-size: 2vw;} .f40{font-size: 2.1vw;} .f42{font-size: 2.15vw;} .f44{font-size: 2.2vw;} .f46{font-size: 2.25vw;} html{font-size: 15px;} } @media (max-width: 1460px) { .f14{font-size: 12px;} .f15{font-size: 13px;} .f16{font-size: 14px;} .f17{font-size: 15px;} .f18{font-size: 16px;} .f20{font-size: 1.3vw;} .f22{font-size: 1.4vw;} .f24{font-size: 1.5vw;} .f26{font-size: 1.6vw;} .f28{font-size: 1.7vw;} .f30{font-size: 1.8vw;} .f32{font-size: 1.9vw;} .f36{font-size: 2vw;} .f38{font-size: 2.1vw;} html{font-size: 14px;} } @media (max-width: 1200px) { .f15{font-size: 12.5px;} .f16{font-size: 13px;} .f17{font-size: 14px;} .f18{font-size: 15px;} .f20{font-size: 1.55vw;} .f22{font-size: 1.65vw;} .f24{font-size: 1.7vw;} .f26{font-size: 1.75vw;} .f28{font-size: 1.8vw;} .f30{font-size: 1.85vw;} html{font-size: 13px;} } @media (max-width: 992px) { .f15{font-size: 12.2px;} .f16{font-size: 12.5px;} .f17{font-size: 13px;} .f18{font-size: 14px;} .f20{font-size: 16px;} .f22{font-size: 17px;} .f24{font-size: 17.5px;} .f26{font-size: 18px;} .f28{font-size: 19px;} .f30{font-size: 20px;} .f32{font-size: 21px;} .f36{font-size: 22px;} .f38{font-size: 22.5px;} .f40{font-size: 23px;} .f42{font-size: 23.5px;} .f44{font-size: 24px;} .f46{font-size: 24.2px;} .f48{font-size: 24.5px;} .f50{font-size: 25px;} .f54{font-size: 25.2px;} .f56{font-size: 25.3px;} .f60{font-size: 25.5px;} .f66{font-size: 25.8px;} .f70{font-size: 26px;} .f72{font-size: 26.2px;} .f76{font-size: 26.4px;} .f80{font-size: 26.8px;} .f90{font-size: 28px;} html{font-size: 12px;} } /* 本站自站定义开始 */ .wx-header-main {position: fixed;top: 0px; left: 0px; width: 100%;border-bottom: 1px solid #ffffff22; z-index: 999;transition:all .3s ease; z-index: 999;} .wx-header-bg,.wx-header-main:hover {background-color: #fff; box-shadow: 0px 0px 5px #ccc;} .wx-header-info {padding: 0px; margin: 0px;} .wx-header-logo {padding: 10px 0px; margin: 0px; overflow: hidden; float: left;} .wx-header-logo img {height: 70px;} .wx-header-logo .logob {display: block;} .wx-header-logo .logo {display: none;} .wx-header-nav {padding: 0px; margin: 0px; float: right;} .wx-header-nav li {float: left; font-family: "ZillaSlab-Bold"; font-size: 20px; line-height: 90px; color: #fff; padding: 0px; margin: 0px 0px 0px 60px; position: relative;} .wx-header-nav li a {color: #fff;} .wx-header-nav li::after {content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 0%; height: 2px; opacity: 0; background-color: #fff; padding: 0px; margin: 0px; overflow: hidden;transition:all .5s ease;} .wx-header-nav li.active::after,.wx-header-nav li:hover::after {width: 100%; opacity: 1;} .wx-header-bg .wx-header-nav li a,.wx-header-main:hover .wx-header-nav li a {color: #000;} .wx-header-bg .wx-header-nav li::after,.wx-header-bg .wx-header-nav li::after,.wx-header-main:hover .wx-header-nav li::after,.wx-header-main:hover .wx-header-nav li::after {background-color: #157649;} .wx-header-nav .nav-ul>li>a em{margin-left:5px;} .wx-header-nav .nav-ul>li>ul{position:absolute;left:0px;top:100%;background:#ffffff; min-width:240px;margin:0px;box-shadow:1px 2px 10px rgba(0,0,0,.1)} .wx-header-nav .nav-ul>li>ul li{position:relative;border-bottom: 1px solid #157649; margin: 0px; width: 100%;} .wx-header-nav .nav-ul>li>ul li:after {content:'';position: absolute;top: 0;left: 0;transform: none;width: 0%;height: 100%;background-color: #157649;z-index: -1;transition:all .3s linear} .wx-header-nav .nav-ul>li>ul li:last-child {border-bottom: 0px;} .wx-header-nav .nav-ul>li>ul li:hover:after{width: 100%;} .wx-header-nav .nav-ul>li>ul li:hover>a,.wx-header-nav .nav-ul>li>ul li:hover>em{color:#ffffff;} .wx-header-nav .nav-ul>li>ul li:hover ul{transform:scaleY(1);opacity:1} .wx-header-nav .nav-ul>li>ul a{padding:0px 10px;height:40px;line-height:40px;font-size: 14px; color: #333; display:flex;align-items:center;justify-content:space-between;transition:all .1s linear;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden} .wx-header-nav .nav-ul>li>ul a i {color: #333;} .wx-header-nav .nav-ul>li>ul a+em{position:absolute;right:10px;top:50%;transform:translateY(-50%)} .wx-header-nav .nav-ul>li>ul ul{position:absolute;left:100%;top:0px;transform:scaleY(0);opacity:0;transition:all .3s ease-in-out;background:#444444f9;min-width:180px;margin:0px;box-shadow:1px 2px 10px rgba(0,0,0,.1)} .wx-header-nav .nav-ul ul{list-style:none;padding:0px} .wx-header-main:hover .wx-header-logo .logob,.wx-header-bg .wx-header-logo .logob {display: none;} .wx-header-main:hover .wx-header-logo .logo,.wx-header-bg .wx-header-logo .logo {display: block;} .wx-header-mobilebtn {display: none; float: right; padding: 0px; margin: 15px 5px 0px 0px; overflow: hidden;} .wx-header-mobilebtn i {font-size: 28px;} @media(min-width:1025px){ .nav-ul>li:hover .submenu{transform:scaleY(1);opacity:1} .nav-ul>li .submenu{transform-origin:top;transform:scaleY(0);opacity:0;transition:all .3s ease-in-out} } @media (max-width: 991px) { .wx-header-main {background-color: #fff;} .wx-header-main::after {display: none; content: ''; position: fixed; top: 66px; left: 0px; background-color: #00000099; width: 100%;height: calc(100% - 66px); padding: 0px; margin: 0px; overflow: hidden; z-index: 10;} .wx-header-logo img {height: 45px;} .wx-header-nav {position: fixed; top: 66px; height: calc(100% - 66px); right: -100%; width: 80%;padding: 0px; margin: 0px; overflow: hidden; background-color: #eee; z-index: 99;transition:all .2s linear;} .wx-header-nav li {width: 100%; font-size: 16px; line-height: 1.8; float: initial; padding: 10px 0px; margin: 0px; overflow: hidden;} .wx-header-mobilebtn .icon-nav01 {display: block;} .wx-header-mobilebtn .icon-close01 {display: none;} .wx-header-mobilebtn {display: block;} .wx-header-logo .logob {display: none;} .wx-header-logo .logo {display: block;} .wx-header-nav li a {color: #000; padding: 0px 20px} .wx-header-nav li::after {background-color: #000; display: none;} .wx-header-main.active .wx-header-nav {right: 0px;} .wx-header-main::after {content: '';background-color: #00000099;position: fixed;width: 100%;top: 69px;left: 0px;height: calc(100% - 56px);z-index: -1;display: none;} .wx-header-main.active:after {display: block;} .wx-header-main.active .wx-header-mobilebtn .icon-nav01 {display: none;} .wx-header-main.active .wx-header-mobilebtn .icon-close01 {display: block;} .wx-header-nav .nav-ul>li .icon-xia01{position:absolute;right:5px;top:2px;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;transition:all .1s linear;transform:rotate(-90deg);font-size:14px;color: #333;} .wx-header-nav .nav-ul>li.cur .icon-xia01 { transform: rotate(0); color: #333; } .wx-header-nav .nav-ul>li>ul a {line-height: 35px; height: 35px; color: #333; padding: 0px 30px; font-weight: bold;} .wx-header-nav .nav-ul>li>ul{position:static;box-shadow:none;max-width:100%;background:initial;display:none;padding:0px 5px} .wx-header-nav .nav-ul>li>ul li {border-bottom: 0px; padding: 0px;} .wx-header-nav .nav-ul>li>ul li:hover>a{background:0 0;color:#7e3ac3;} .wx-header-nav .nav-ul>li>ul li:hover:after {display: none;} .wx-header-nav .nav-ul>li>ul li ul a {font-weight: normal; font-size: 13px; padding: 0px;} .wx-header-nav .nav-ul>li>ul .icon-you1{display:none} .wx-header-nav .nav-ul>li>ul ul{position:static;display:block;background:0 0;box-shadow:none;padding:0px 20px; opacity: 1; transform: none;} } /* 首页Banner */ .wx-banner-main {height: 100vh;padding: 0px;margin: 0px;overflow: hidden;} .ban-swiper{width: 100%;height: 100%;} .ban-slide{height: 100%;overflow: hidden;position: relative;} .ban-slide-bj {height: 100%;background: no-repeat center;background-size: cover;overflow: hidden;} .ban-slide-bj img {display: none;width: 100%;} .ban-slide-info {position: absolute;top: 50%;left: 0px;transform: translateY(-50%);width: 100%;padding: 0px;margin: 0px;overflow: hidden;} .ban-slide-txt {width: 100%;max-width: 980px; margin: 0px auto; text-align: center;} .wx-banner-main .swiper-slide .ban-slide-info h3{ color:#fff; font-size:52px; font-family: "ZillaSlab-Bold"; line-height:1.5; margin: 0px 0px 15px; transform:translateY(80px); opacity:0; } .wx-banner-main .swiper-slide .ban-slide-info p{ color:#fff; line-height:1.8; font-family: Arial; font-size:18px; transform:translateY(80px); opacity:0; } .wx-banner-main .swiper-slide.swiper-slide-active .ban-slide-info h3{ transition:all 2s ease .7s; transform:translateY(0); opacity:1; } .wx-banner-main .swiper-slide.swiper-slide-active .ban-slide-info p{ transition:all 2s ease 1s; transform:translateY(0); opacity:1; } .ban-slide-bj{width: 100%; overflow: hidden;} .wx-banner-main .swiper-pagination-bullet{opacity: 1;width:8px;height:8px; margin: 0px 10px !important;background: #ddd;border-radius: 50%;position: relative;} .wx-banner-main>.swiper-pagination-bullets{text-align: center;bottom: 20px;} .wx-banner-main .swiper-pagination-bullet-active {background: #fff;} .wx-banner-main .swiper-pagination-bullet-active::after {border: 1px solid #fff; width: 20px; height: 20px; border-radius: 50%; content: ''; position: absolute; top: -6px; left: -6px;} .ban-video{width: 100%;min-height: 100%;position: absolute;top: 50%;left: 50%;z-index: 2;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);} @media(max-width:991px){ .wx-banner-main {margin-top: 66px; height: initial;} .ban-slide-bj {background: none;} .ban-slide-bj img {display: block;} .ban-video{display: none;} .wx-banner-main .swiper-slide .ban-slide-info h3 {font-size: 36px; line-height: 1; margin-bottom: 15px;} .wx-banner-main .swiper-slide .ban-slide-info p {font-size: 14px;} } /* 首页产品 */ .wx-index-productsmain { padding: 80px 0px; margin: 0px; overflow: hidden; position: relative; } .wx-index-productsmain::after { content: ''; position: absolute; top: 0; left: 0; width: 345px; height: 250px; background-image: url(../images/index-protopleftbg.png); background-repeat: no-repeat; background-size: cover; padding: 0px; margin: 0px; overflow: hidden; z-index: -1; } .wx-index-productsmain::before { content: ''; position: absolute; top: 50%; right: 0; width: 470px; height: 650px; background-image: url(../images/index-prorightbg.png); background-repeat: no-repeat; background-size: cover; padding: 0px; margin: 0px; overflow: hidden; z-index: -1; } .wx-index-productstitle { line-height: 2; text-align: center; padding: 0px; margin: 0px 0px 50px; overflow: hidden; } .wx-index-productstitle h3 { font-size: 48px; font-family: "ZillaSlab-Bold"; color: #157649; padding: 0px; margin: 0px; overflow: hidden; } .wx-index-productstitle p { font-size: 16px; color: #666; padding: 0px; margin: 0px; overflow: hidden; } .wx-index-productslist { padding: 0px; margin: 0px; overflow: hidden; } .wx-index-productsone { padding: 0px; border-radius: 20px; margin: 0px 0px 2%; overflow: hidden; float: left; } .wx-index-productsone a { display: block; position: relative; } .wx-index-productsone img {width: 100%;transition: all 1s;} .wx-index-productsone:nth-child(1) { width: 61%; margin-right: 2%; } .wx-index-productsone:nth-child(2) { width: 37%; float: right; } .wx-index-productsone:nth-child(3) { width: 29.1%; margin-right: 2.4%; } .wx-index-productsone:nth-child(4) { width: 29.1%; } .wx-index-productsone p { position: absolute; bottom: 0px; left: 0px; font-size: 16px; font-weight: bold; line-height: 25px; color: #fff; padding: 20px; margin: 0px; overflow: hidden; } .wx-index-productsone:hover img {transform: scale(1.1);transition: all 0.3s linear;} .wx-index-productsmore { text-align: center; padding: 0px; margin: 30px 0px 0px; overflow: hidden; } .wx-index-productsmore a { display: inline-block; border: 2px solid #157649; color: #157649; border-radius: 50px; font-size: 16px; line-height: 25px; padding: 10px 50px; margin: 0px; overflow: hidden; } .wx-index-productsmore a:hover { background-color: #157649; color: #fff; } .wx-index-advantages { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0px; margin: 30px 0px 0px; overflow: hidden; } .wx-index-advantagesimg { width: 35%; padding: 0px; margin: 0px; overflow: hidden; } .wx-index-advantagesimg img {width: 100%;} .wx-index-advantagesinfo { width: 60%; padding: 0px; margin: 0px; overflow: hidden; } .wx-index-advantagestitle { padding: 0px; margin: 0px 0px 50px; overflow: hidden; } .wx-index-advantagestitle h3 { font-size: 42px; font-weight: normal; font-family: "ZillaSlab-Bold"; color: #157649; padding: 0px; margin: 0px 0px 20px; overflow: hidden; } .wx-index-advantagestitle p { font-size: 16px; line-height: 1.8; font-family: Arial, Helvetica, sans-serif; padding: 0px; margin: 0px; overflow: hidden; } .wx-index-advantageslist { padding: 0px; margin: 0px; overflow: hidden; } .wx-index-advantageslist ul { display: flex; flex-wrap: wrap; justify-content: space-between; } .wx-index-advantageslist li { width: 50%; padding: 0px; margin: 0px 0px 50px; overflow: hidden; } .wx-index-advantagesone { display: inline-flex; flex-wrap: wrap; justify-content: space-between; transform: rotateY(0deg); -webkit-transform: rotateY(0deg); } .wx-index-advantageslist li:hover .wx-index-advantagesone { -webkit-transition: all 1s; -moz-transition: all 1s; transition: all 1s; transform: rotateY(360deg); -webkit-transform: rotateY(360deg); } .wx-index-advantageslist li:nth-last-child(2), .wx-index-advantageslist li:last-child {margin: 0px;} .wx-index-advantageslist li img {width: 50px; margin-right: 20px;} .wx-index-advantageslist li .wx-index-advantagestxt { width: calc(100% - 70px); padding: 0px; margin: 0px; overflow: hidden; } /* 首页公司简介 */ .wx-index-aboutmain { background-color: #eef0f4; padding: 80px 0px; margin: 0px; overflow: hidden; } .wx-index-aboutinfo { width: 47%; padding: 0px; margin: 0px; overflow: hidden; float: left; } .wx-index-aboutinfo h3 {font-size: 48px;font-family: "ZillaSlab-Bold"; color: #157649; font-weight: 600; padding: 0px; margin: 0px 0px 25px; overflow: hidden;} .wx-index-abouttxt { font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: 2; padding: 0px; margin: 0px 0px 30px; overflow: hidden; } .wx-index-aboutlist { padding: 0px; margin: 0px; overflow: hidden; } .wx-index-aboutlist ul { display: grid; column-gap: 50px; grid-template-columns: 1fr 1fr 1fr; } .wx-index-aboutlist li { padding: 0px; margin: 0px; overflow: hidden; } .wx-index-aboutlist li span { font-family: "ZillaSlab-Bold"; font-size: 18px; line-height: 1.8; padding: 0px; margin: 0px; overflow: hidden; } .wx-index-aboutlist li span strong { font-size: 42px; font-weight: 600; margin-right: 5px; } .wx-index-aboutlist li p { font-size: 16px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; padding: 0px; margin: 0px; overflow: hidden; } .wx-index-aboutimg { width: 47%; padding: 0px; margin: 0px; overflow: hidden; float: right; } .wx-index-aboutimg img {width: 100%;} .wx-index-aboutmore { padding: 0px; margin: 50px 0px 0px; overflow: hidden; } .wx-index-aboutmore a { display: inline-block; border: 2px solid #157649; color: #157649; border-radius: 50px; font-size: 16px; line-height: 25px; padding: 10px 50px; margin: 0px; overflow: hidden; } .wx-index-aboutmore a:hover { background-color: #157649; color: #fff; } /* 为什么选择 */ .wx-index-whymain {background-image: url(../images/index-whybg.jpg);background-repeat: no-repeat;background-size: cover;background-position: center;padding: 0px;margin: 0px;overflow: hidden;position: relative;} .wx-index-whymain::after {content: '';background-color: rgba(0, 0, 0, 0.4);width: 50%;position: absolute;top: 0;left: 0px;height: 100%;padding: 0;margin: 0px;overflow: hidden;z-index: 0;} .wx-index-whymain li {width: 100%; padding: 15px 0px; margin: 0px; overflow: hidden; position: relative;} .wx-index-whymain li .list_hover {width: 0; height: 100%; background-color: #157649dd; position: absolute; top: 0; left: 0; z-index: 2; display: block; transition: 600ms; -webkit-transition: 600ms; opacity: 0.85;} .wx-index-whymain li:hover .list_hover {width: calc(50% + 150px);} .wx-index-whyone {width: 50%; color: #fff; padding: 20px 0px; margin: 0px; float: left; position: sticky; z-index: 3;} .wx-index-whyoneimg {width: 75px; height: 75px; text-align: center; margin: 0px 20px 0px 0px; padding: 0px; overflow: hidden; float: left;} .wx-index-whyonetxt {width: calc(100% - 95px); color: #fff; padding: 0px 20px 0px 0px; margin: 0px; overflow: hidden; float: left;} .wx-index-whymain li .wx-index-whyone:after, .wx-index-whymain li .wx-index-whyone:before {content: ""; background: #fff; display: block; top: 50%; position: absolute; visibility: hidden; opacity: 0; transition: 300ms; -webkit-transition: 300ms;} .wx-index-whymain li .wx-index-whyone:before {width: 1px; height: 42px; margin-top: 0; right: -70px;} .wx-index-whymain li .wx-index-whyone:after {width: 42px; height: 1px; right: -120px;} .wx-index-whymain li:hover .wx-index-whyone:after, .wx-index-whymain li:hover .wx-index-whyone:before {transition: 300ms ease-in 600ms; -webkit-transition: 300ms ease-in 600ms; visibility: visible; opacity: 1;} .wx-index-whymain li:hover .wx-index-whyone:before {margin-top: -21px;} .wx-index-whymain li:hover .wx-index-whyone:after {right: -90px;} .wx-index-whyonetxt h3 {font-size: 24px;font-family: "ZillaSlab-Bold"; font-weight: 600; padding: 0px; margin: 0px 0px 15px; overflow: hidden;} .wx-index-whyonetxt p {font-size: 14px; line-height: 1.6; color: #eee; padding: 0px; margin: 0px; overflow: hidden;} .wx-index-whyinfo {position: absolute; top: 50%; left: 0px; transform: translateY(-50%); width: 100%; padding: 0px; margin: 0px; overflow: hidden;} .wx-index-whytitle {width: 300px; padding: 0px; margin: 0px; overflow: hidden; float: right;} .wx-index-whytitle h3 {font-size: 48px;font-family: "ZillaSlab-Bold"; color: #fff; font-weight: 600; padding: 0px; margin: 0px 0px 15px; overflow: hidden;} .wx-index-whytitle p {font-size: 15px; line-height: 1.6; color: #eee; padding: 0px; margin: 0px; overflow: hidden;} /* 底部信息 */ .wx-footer-main { background-color: #222; color: #fff; padding: 0px; margin: 0px; overflow: hidden; } .wx-footer-top { padding: 50px 0px; margin: 0px; overflow: hidden; } .wx-footer-top .container { display: flex; flex-wrap: wrap; justify-content: space-between; } .wx-footer-contact { width: 32%; padding: 0px; margin: 0px; overflow: hidden; } .wx-footer-navigation { width: 20%; padding: 0px; margin: 0px; overflow: hidden; } .wx-footer-products { width: 30%; padding: 0px; margin: 0px; overflow: hidden; } .wx-footer-contact h3,.wx-footer-navigation h3,.wx-footer-products h3 { font-size: 24px; font-family: "ZillaSlab-Bold"; text-transform: uppercase; padding: 0px; margin: 0px 0px 20px; overflow: hidden; } .wx-footer-contact p { font-size: 15px; font-family: Arial, Helvetica, sans-serif; line-height: 1.6; color: #ddd; padding: 0px; margin: 0px 0px 10px; overflow: hidden; display: flex; flex-wrap: wrap; justify-content: space-between; } .wx-footer-contact p i { font-size: 16px; } .wx-footer-contact p span { display: block; width: calc(100% - 25px); padding: 0px; margin: 0px; overflow: hidden; } .wx-footer-products ul { display: grid; grid-column: 30px; grid-template-columns: 1fr 1fr; } .wx-footer-navigation dd,.wx-footer-products li { font-size: 14px; line-height: 30px; color: #ddd; padding: 0px; margin: 0px; overflow: hidden; } .wx-footer-navigation dd a,.wx-footer-products li a { color: #ddd; } .wx-footer-bottom { border-top: 1px solid #ffffff22; padding: 20px 0px; margin: 0px; overflow: hidden; } .wx-footer-copyright { font-size: 14px; line-height: 30px; font-family: Arial, Helvetica, sans-serif; padding: 0px; margin: 0px; overflow: hidden; float: left; } .wx-footer-follow { padding: 0px; margin: 0px; overflow: hidden; float: right; } .wx-footer-follow li{ padding: 0px; margin: 0px; overflow: hidden; float: left; } .wx-footer-follow li i { display: block; background-color: #fff; color: #000; border-radius: 50%; width: 30px; height: 30px; line-height: 30px; text-align: center; padding: 0px; margin: 0px 0px 0px 10px; overflow: hidden; } /* 内页开始 */ .wx-page-banner { background-repeat: no-repeat; background-position: center; background-size: cover; height: 650px; padding: 0px; margin: 0px; overflow: hidden; position: relative; } .wx-page-bannertxt { position: absolute; top: 50%; left: 0px; transform: translateY(-40%); width: 100%; color: #fff; text-align: center; padding: 0px; margin: 0px; overflow: hidden; } .wx-page-bannertxt h1 { font-size: 46px; font-family: "ZillaSlab-Bold"; font-weight: bold; padding: 0px; margin: 0px; overflow: hidden; } .wx-page-bannertxt p { font-size: 16px; line-height: 1.8; padding: 0px; margin: 0px; overflow: hidden; } .wx-page-bannertxt p i {margin-right: 10px; font-size: 18px;} .wx-page-bannertxt p a { color: #fff; } .wx-page-main { padding: 70px 0px; margin: 0px; overflow: hidden; } /* 公司简介 */ .wx-aboutus-info { font-size: 15px; line-height: 2; padding: 0px; margin: 0px 0px 50px; overflow: hidden; } .wx-aboutus-main { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0px; margin: 0px; overflow: hidden; } .wx-aboutus-list { width: 25%; padding: 0px; margin: 0px; overflow: hidden; } .wx-aboutus-list li { border-bottom: 1px solid #eee; padding: 30px 0px; margin: 0px; overflow: hidden; position: relative; } .wx-aboutus-list li::after { content: ''; position: absolute; bottom: 0px; left: 0px; width: 35px; height: 1px; background-color: #157649; padding: 0px; margin: 0px; overflow: hidden; } .wx-aboutus-list li span { color: #157649; font-family: "ZillaSlab-Bold"; font-size: 18px; line-height: 1.8; padding: 0px; margin: 0px; overflow: hidden; } .wx-aboutus-list li span strong { font-size: 42px; font-weight: 600; margin-right: 5px; } .wx-aboutus-list li p { font-size: 16px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; padding: 0px; margin: 0px; overflow: hidden; } .wx-aboutus-img { width: 70%; padding: 0px; margin: 0px; overflow: hidden; } /* 为什么选择我们 */ .wx-why-main { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0px; margin: 0px; overflow: hidden; } .wx-why-info { width: 65%; font-size: 15px; line-height: 2.5; padding: 0px; margin: 0px; overflow: hidden; } .wx-why-img { width: 30%; padding: 0px; margin: 0px; overflow: hidden; } .wx-why-img img { border: 1px solid #157649; } /* 联系我们 */ .wx-contact-title { font-family: "ZillaSlab-Bold"; font-size: 36px; font-weight: bold; line-height: 1.2; color: #000; padding: 0px; margin: 0px 0px 50px; overflow: hidden; } .wx-contact-title span { display: block; font-size: 16px; padding: 0px; margin: 0px; overflow: hidden; } .wx-contact-title p { display: block; font-size: 14px; font-weight: normal; font-family: Arial, Helvetica, sans-serif; padding: 0px; margin: 10px 0px 0px; overflow: hidden; } .wx-contactus-main { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0px; margin: 0px; overflow: hidden; } .wx-contactus-message { width: 48%; padding: 0px; margin: 0px; overflow: hidden; float: left; } .wx-contact-messageinpt,.wx-contact-messagelab { width: 100%; padding: 0px; margin: 0px 0px 15px; overflow: hidden; position: relative; } .wx-contact-messageinpt .name { float: left; color: #888; font-size: 14px; line-height: 36px; position: absolute; left: 20px; top: 50%; margin-top: -18px; } .wx-contact-messageinpt .name span { color: #e52a2a; padding-left: 5px; } .wx-contact-messageinpt input { float: left; width: 100%; color: #666666; font-size: 14px; line-height: 24px; padding: 20px 20px 20px 70px; border: 1px solid #ededed; } .wx-contact-messagelab textarea { float: left; width: 100%; color: #666666; font-size: 14px; font-family: Arial, Helvetica, sans-serif; line-height: 24px; height: 182px; padding: 12px 20px; border: 1px solid #ededed; } .wx-contact-messagebtn { padding: 0px; margin: 30px 0px 0px; overflow: hidden; } .wx-contact-messagebtn button { background-color: #157649; color: #fff; font-size: 16px; line-height: 30px; padding: 10px 50px; margin: 0px; border: 0px; overflow: hidden; } .wx-contactus-info { width: 48%; background-color: #f6f6f6; background-image: url(../images/contact-infobg.png); background-repeat: no-repeat; background-size: 100% auto; background-position: bottom; padding: 3%; margin: 0px; overflow: hidden; } .wx-contactus-info h3 { font-size: 22px; line-height: 2.5; color: #000; border-bottom: 1px solid #ddd; padding: 0px 0px; margin: 0px 0px 30px; overflow: hidden; } .wx-contactus-info p { font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: 1.8; padding: 0px; margin: 0px 0px 5px; overflow: hidden; } .wx-contact-maps { font-size: 14px; line-height: 2; height: 420px; border: 1px solid #ccc; padding: 0px; margin: 50px 0px 0px; overflow: hidden; } .rat-contact-maps .amap-logo, .rat-contact-maps .amap-copyright {display: none !important;} /* 视频展示 */ .wx-video-list { padding: 0px; margin: 0px; overflow: hidden; } .wx-video-list ul { display: grid; column-gap: 30px; grid-template-columns: 1fr 1fr; padding: 0px; margin: 0px; overflow: hidden; } .wx-video-list li { padding: 0px; margin: 0px 0px 30px; overflow: hidden; } .wx-video-one { padding: 0px; margin: 0px; overflow: hidden; } .wx-video-oneimg { padding: 0px; margin: 0px; overflow: hidden; position: relative; } .wx-video-oneimg::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #00000066; padding: 0px; margin: 0px; overflow: hidden; transition: all 1s; z-index: 2; } .wx-video-oneimg i { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 50px; height: 50px; line-height: 50px; text-align: center; border: 1px solid #ffffffee; border-radius: 50%; color: #ffffffee; font-size: 24px; padding: 0px; margin: 0px; overflow: hidden; z-index: 5; } .wx-video-onetxt { font-size: 16px; text-align: center; line-height: 25px; padding: 10px 0px; margin: 0px; overflow: hidden; } .wx-video-oneimg img {width: 100%; transition: all 1s;} .wx-video-one:hover .wx-video-oneimg::after {background-color: #00000099;transition: all 0.3s linear;} .wx-video-one:hover .wx-video-oneimg img {transform: scale(1.1);transition: all 0.3s linear;} .wx-video-one:hover .wx-video-onetxt {color: #157649;} /* 产品展示 */ .wx-products-title { padding: 0px; margin: 0px 0px 30px; overflow: hidden; } .wx-products-title li { border: 1px solid #ccc; border-radius: 30px; font-size: 15px; line-height: 25px; padding: 10px 30px; margin: 0px 15px 15px 0px; overflow: hidden; float: left; } .wx-products-title li.active,.wx-products-title li:hover {border-color: #157649;} .wx-products-title li.active a,.wx-products-title li:hover a {color: #157649;} .wx-products-list { padding: 0px; margin: 0px; overflow: hidden; } .wx-products-list ul { display: grid; column-gap: 20px; grid-template-columns: 1fr 1fr 1fr; } .wx-products-list li { padding: 0px; margin: 0px 0px 20px; overflow: hidden; } .wx-products-one { border: 1px solid #ddd; padding: 0px; margin: 0px; overflow: hidden; } .wx-products-oneimg { padding: 0px; margin: 0px; overflow: hidden; } .wx-products-oneimg img {width: 100%; transition: all 1s;} .wx-products-one:hover .wx-products-oneimg img {transform: scale(1.1);transition: all 0.3s linear;} .wx-products-onetxt { font-size: 16px; text-align: center; line-height: 25px; padding: 15px 0px; margin: 0px; overflow: hidden; } .wx-products-one:hover .wx-products-onetxt {color: #157649;} .wx-products-detailstopinfo { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0px; margin: 50px 0px 0px; overflow: hidden; } .wx-products-detailsimg { width: 45%; border: 1px solid #ccc; text-align: center; padding: 0px; margin: 0px; overflow: hidden; } .wx-products-detailsimg img {width: 100%;} .wx-products-detailssummary { width: 50%; color: #333; padding: 0px; margin: 0px; overflow: hidden; } .wx-products-detailssummary h1 { font-family: "ZillaSlab-Bold"; font-size: 32px; line-height: 1.5; padding: 0px 0px 5px; margin: 0px; overflow: hidden; position: relative; } .wx-products-detailssummary h1::after { content: ''; position: absolute; bottom: 0; left: 0; width: 35px; height: 3px; background-color: #157649; padding: 0px; margin: 0px; overflow: hidden; } .wx-products-detailssummary>div { font-size: 16px; line-height: 1.8; padding: 0px; margin: 20px 0px; overflow: hidden; } .wx-products-detailsoneinfo { padding: 0px; margin: 35px 0px 0px; overflow: hidden; } .wx-products-detailstitle { background-color: #e3eef2; color: #333; border-radius: 5px; font-family: "ZillaSlab-Bold"; font-size: 24px; font-weight: bold; line-height: 1.5; padding: 15px 20px; margin: 0px; overflow: hidden; position: relative; } .wx-products-detailstitle:before { width: 3px; height: 24px; content: ""; display: inline-block; vertical-align: middle; border-radius: 5px; background: #157649; margin: -2px 15px 0 0; } .wx-products-detailsinfo { font-size: 16px; min-height: 60px; text-align: justify; line-height: 2; padding: 20px; margin: 0px; overflow: hidden; } .wx-products-detailsinfo p { margin: 0px; } .wx-products-detailsinfo table tr th {padding: 5px 10px; border-right: 1px solid #000; border-bottom: 1px solid #000;font-weight: bold; color: #333; text-align: center;} .wx-products-detailsinfo table tr td {padding: 5px 10px; width: initial; border-right: 1px solid #000; border-bottom: 1px solid #000;color: #333; text-align: center;} .wx-products-detailsinfo table tr td:last-child,.wx-products-detailsinfo table tr th:last-child {border-right: 0px;} .wx-products-detailsinfo table {border: 1px solid #000; font-size: 14px; border-collapse: collapse; width: 100%; margin-bottom: 10px; overflow: hidden;} .pagelink{display:flex;flex-wrap:wrap;align-items:center;margin:3em 0 0px;width:100%;border-radius:5px;overflow:hidden} .pagelink .pagelink-item{width:50%;background:#e3eef2;color: #333; padding:10px 15px;transition:all .1s linear;display:flex;align-items:center; font-size: 14px; line-height: 1.8;} .pagelink .pagelink-item:hover{background:#157649} .pagelink .pagelink-item:hover .iconfont{background:#FFFFFF;color:#157649} .pagelink .pagelink-item:hover .link{color:#FFFFFF} .pagelink .pagelink-item .iconfont{width:34px;height:34px;background:#157649;color:#FFFFFF;border-radius:3px;display:inline-flex;align-items:center;justify-content:center} .pagelink .pagelink-item .iconfont em{font-size: 20px;font-weight:bold} .pagelink .pagelink-item .link{font-size: 14px;font-weight:bold; margin: 0px; padding: 0px; display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;flex:1} .pagelink .pagelink-item.next{justify-content:flex-end} .pagelink .pagelink-item.prev .link{padding-left:10px} .pagelink .pagelink-item.next .link{text-align:right;padding-right:10px} .wx-page-pagination {text-align: center; margin: 35px 0px 0px; padding: 0px; overflow: hidden;} .pagination .page-item a {display: inline-block;width: 40px;height: 40px;line-height: 34px;text-align: center;font-size: 16px;color: #666;background-color: #f1f1f1;border-radius: 50% !important;margin-right: 10px;transition: all .6s;} .pagination .page-item a.page-link {padding: 2px 0px;} .pagination .page-item a svg {margin-top: 6px;} .pagination .page-item.active a.page-link {background-color:#157649; border: 1px solid #157649; color: #fff;} @media (max-width: 991px) { .wx-index-productsmain,.wx-index-aboutmain,.wx-page-main {padding: 30px 0px;} .wx-index-productstitle {line-height: 1.6; margin-bottom: 25px;} .wx-index-productstitle h3 {font-size: 32px;} .wx-index-productstitle p {font-size: 14px;} .wx-index-productsone:nth-child(1),.wx-index-productsone:nth-child(2) {width: 100%; margin-right: 0px;} .wx-index-productsone:nth-child(3),.wx-index-productsone:nth-child(4) {width: 100%; margin-right: 0px;} .wx-index-advantages {display: block;} .wx-index-advantagesimg,.wx-index-advantagesinfo {width: 100%;} .wx-index-advantagestitle {margin-bottom: 20px;} .wx-index-advantagestitle h3 {font-size: 32px;} .wx-index-advantagestitle p {font-size: 14px;} .wx-index-advantagesone {display: -webkit-box;} .wx-index-advantageslist li {margin-bottom: 10px;} .wx-index-advantageslist li img {width: 40px; margin-right: 10px;} .wx-index-advantageslist li .wx-index-advantagestxt {width: calc(100% - 50px);} .wx-index-advantageslist li .wx-index-advantagestxt h4 {font-size: 16px; margin-bottom: 5px;} .wx-index-advantageslist li .wx-index-advantagestxt p {font-size: 12px;} .wx-index-aboutinfo,.wx-index-aboutimg {width: 100%;} .wx-index-aboutinfo h3 {font-size: 32px; margin-bottom: 10px;} .wx-index-abouttxt {font-size: 14px; line-height: 1.8; margin-bottom: 15px;} .wx-index-aboutlist ul {column-gap: 20px;} .wx-index-aboutlist li {text-align: center;} .wx-index-aboutlist li span strong,.wx-aboutus-list li span strong {font-size: 26px;} .wx-index-aboutlist li p,.wx-aboutus-list li p {font-size: 14px;} .wx-index-aboutmore {margin: 20px 0px;} .wx-index-aboutmore a {width: 100%; text-align: center; font-size: 14px; padding: 5px 35px;} .wx-index-whymain {padding: 30px 0px;} .wx-index-whymain::after {width: 100%;} .wx-index-whymain li .list_hover,.wx-index-whymain li:hover .wx-index-whyone:after, .wx-index-whymain li:hover .wx-index-whyone:before {display: none;} .wx-index-whyinfo {position: inherit; z-index: 5; transform: none; margin-bottom: 30px;} .wx-index-whytitle {width: 100%; text-align: center;} .wx-index-whytitle h3 {font-size: 32px; margin-bottom: 10px;} .wx-index-whytitle p {font-size: 12px;} .wx-index-whyone {width: 100%; padding: 0px 0px 25px;} .wx-index-whymain li {padding: 0px;} .wx-index-whyoneimg {width: 60px; height: 60px; margin-right: 10px;} .wx-index-whyonetxt {width: calc(100% - 70px);padding: 0px;} .wx-index-whyonetxt h3 {font-size: 22px; margin-bottom: 5px;} .wx-index-whyonetxt p {font-size: 12px;} .wx-footer-top {padding: 25px 0px 10px;} .wx-footer-contact {width: 100%;} .wx-footer-bottom {padding: 15px 0px; text-align: center;} .wx-footer-copyright {font-size: 12px; line-height: 1.5; text-align: center; width: 100%;} .wx-page-banner {height: 450px;} .wx-page-bannertxt h1 {font-size: 32px;} .wx-page-bannertxt p {font-size: 14px;} .wx-why-main {display: block;} .wx-why-info,.wx-aboutus-info {width: 100%; font-size: 14px; line-height: 1.6; margin: 0px;} .wx-why-img {width: 100%; margin: 30px 0px 0px;} .wx-aboutus-main {display: block;} .wx-aboutus-list,.wx-aboutus-img {width: 100%;} .wx-aboutus-list ul {display: grid; column-gap: 25px; grid-template-columns: 1fr 1fr 1fr; margin: 15px 0px;} .wx-aboutus-list li {padding: 10px 0px;} .wx-products-title ul {display: flex; flex-wrap: wrap; justify-content: center;} .wx-products-title li {font-size: 13px; padding: 5px 15px; margin: 0px 5px 10px 0px;} .wx-products-list ul {column-gap: 10px;grid-template-columns: 1fr 1fr;} .wx-products-list li {margin-bottom: 10px;} .wx-products-onetxt {font-size: 14px; padding: 8px 0px;} .wx-page-pagination {margin: 20px 0px 0px;} .wx-products-detailstopinfo,.wx-contactus-main {display: block;} .wx-products-detailstopinfo {margin-top: 30px;} .wx-products-detailsimg {width: 100%; margin-bottom: 15px;} .wx-products-detailssummary {width: 100%;} .wx-products-detailssummary h1 {font-size: 24px;} .wx-products-detailssummary>div,.wx-video-onetxt {font-size: 14px; line-height: 1.6;} .wx-products-detailsoneinfo {margin: 0px;} .wx-products-detailstitle {font-size: 18px;padding: 8px 10px;} .wx-products-detailsinfo {font-size: 14px; line-height: 1.6; padding: 20px 0px 0px;} .wx-video-list ul {display: block;} .wx-video-list li {margin-bottom: 10px;} .wx-contact-title {font-size: 32px; margin-bottom: 30px;} .wx-contactus-message {width: 100%; margin-bottom: 30px;} .wx-contactus-info {width: 100%;} .wx-contactus-info h3 {font-size: 18px; margin-bottom: 15px;} .wx-contactus-info p {font-size: 14px;} }