
        .fix-right-f {
    position: fixed;
    top: calc(50% - 80px);
    right: 0px;
    width: 48px;
    z-index: 5;
}

.foot-b-up {
  width: 48px;
  height: 48px;
  background-color: #333333;
  cursor: pointer;
  z-index: 99;
  position: fixed;
  right: 0px;
  top: -80px;
  transition: all 1.2s ease 0s;
  border-radius: 5px;
}

.foot-b-up:before {
  content: "\e901";
  font-family: 'icomoon_9';
  top: 0px;
  line-height: 48px;
  color: #fff;
  width: 100%;
  height: 100%;
  text-align: center;
  font-size: 18px;
  position: absolute;
}
body [mid=capcha-hd] {
    display: none;
}

.fix-r-b {
    width: 48px;
    height: 48px;
    display: block;
    position: relative;
    background: var(--MainColor);
    border-radius: 5px;
    margin-top: 5px;
    cursor: pointer;
    transition: all 0.6s ease 0s;
}
.fix-r-b::before{
    position: absolute;
    width: 48px;
    line-height: 48px;
    color: #fff;
    font-size: 22px;
    text-align: center;
}
.fix-r-b:hover{
    background: #777;
}
.fly-wt::before{
    content: '\ea93';
    font-family: icomoon2;
}
.fly-em::before{
    content: '\e901';
    font-family: icomoon_35;
}
.fly-up{
    background-color: #20201F;
}
.fly-up::before{
    content: "\e901";
    font-family: 'icomoon_9';
}
.jump-send-cover {
    position: fixed;
    background: rgba(0,0,0,0.7);
    width: 100%;
    height: 100%;
    z-index: 10001;
    overflow: hidden;
    display: none;
    left: 0px;
    top: 0px;
}
#id-jump-send-f {
    width: 700px;
    margin: 0 auto;
    transition: all 0.6s ease 0s;
    margin-top: -800px;
    position: relative;
    background-color: #fff;
}
.jump-send-cet {
    padding: 30px;
}
.jump-send-close {
    position: absolute;
    right: 15px;
    top: 15px;
    width: 35px;
    height: 35px;
    cursor: pointer;
    border-radius: 50%;
}
.jump-send-close:before {
    content: '\e60b';
    width: calc(100% + 1px);
    position: absolute;
    left: 0px;
    top: 0px;
    font-family: icomoon;
    font-size: 25px;
    color: #181717;
    line-height: 35px;
    text-align: center;
}


@media screen and (max-width:980px) {
    .jump-send-close:before {
        font-size: 20px;
        line-height: 25px;
    }
    .jump-send-close {
        right: 10px;
        top: 10px;
        width: 25px;
        height: 25px;
    }
    .jump-send-cover .con-bs-r {
        margin-top: 0px;
    }
    .sem-textarea-sf .semin-send-down{
        display: none;
    }
    .jump-send-f{
        width: 94%!important;
    }
    .jump-send-cover .con-bs-l{
        display: none;
    }
    .fix-r-b::before {
        width: 35px;
        line-height: 35px;
        font-size: 16px;
    }
    .fix-r-b {
        width: 35px;
        height: 35px;
        background-color: rgba(170,204,3,.5);
        border-radius: 2px;
    }
    .fix-right-f {
        top: calc(50% - 80px);
        width: 35px;
    }
    .foot-b-up:before {
    line-height: 35px;
    font-size: 14px;
  }

  .foot-b-up {
    width: 35px;
    height: 35px;
    background-color: #333333;
    right: 0px;
  }
}

@media screen and (max-width:850px) {
    .jump-send-cet .con-sf {
        margin-top: 20px;
    }
    .sem-in-f .sem-in-sf {
    margin-top: 10px;
    }
        .sem-in-f .con-sf {
        margin-top: 20px;
    }
    .sem-in-f .jump-send-cet {
    padding: 10px;
    }
} 
        @font-face {
  font-family: 'icomoon';
  font-display: swap;
  font-style: normal;
  font-weight: 400;
  font-family: "icomoon";
  src:
    url("/font/icomoon.eot?#iefix") format("embedded-opentype"),
    url("/font/icomoon.woff") format("woff"),
    url("/font/icomoon.ttf") format("truetype"),
    url("/font/icomoon.svg#$font") format("svg");
}

@font-face {
    font-family: 'icomoon_35';
font-display: swap;
    font-style: normal;
    font-weight: 400;
src: url("/font/icomoon35.eot?#iefix") format("embedded-opentype"), 
url("/font/icomoon35.woff") format("woff"), 
url("/font/icomoon35.ttf") format("truetype"), 
url("/icomoon35.svg#$font") format("svg");
}

@font-face {
    font-family: 'icomoon_9';
font-display: swap;
    font-style: normal;
    font-weight: 400;
src: url("/font/icomoon_9.eot?#iefix") format("embedded-opentype"), 
url("/font/icomoon_9.woff") format("woff"), 
url("/font/icomoon_9.ttf") format("truetype"), 
url("/icomoon_9.svg#$font") format("svg");
}

@font-face {
  font-family: 'icomoon_seh';
  font-display: swap;
  font-style: normal;
  font-weight: 400;
  src: url("/font/icomoon_seh.eot?#iefix") format("embedded-opentype"),
    url("/font/icomoon_seh.woff") format("woff"),
    url("/font/icomoon_seh.ttf") format("truetype"),
    url("/font/icomoon_seh.svg#$font") format("svg");
}

@font-face {
  font-family: 'icomoon5';
  font-display: swap;
  font-style: normal;
  font-weight: 400;
  src: url("/font/icomoon5.eot?#iefix") format("embedded-opentype"),
    url("/font/icomoon5.woff") format("woff"),
    url("/font/icomoon5.ttf") format("truetype"),
    url("/icomoon5.svg#$font") format("svg");
}

@font-face {
  font-family: 'icomoon2';
  font-display: swap;
  font-style: normal;
  font-weight: 400;
  src: url("/font/icomoon2.eot?#iefix") format("embedded-opentype"),
    url("/font/icomoon2.woff") format("woff"),
    url("/font/icomoon2.ttf") format("truetype"),
    url("/icomoon2.svg#$font") format("svg");
}

@font-face {
  font-family: 'icomoon3';
  font-display: swap;
  font-style: normal;
  font-weight: 400;
  src: url("/font/icomoon3.eot?#iefix") format("embedded-opentype"),
    url("/font/icomoon3.woff") format("woff"),
    url("/font/icomoon3.ttf") format("truetype"),
    url("/icomoon3.svg#$font") format("svg");
}

@font-face {
  font-family: "iconfont"; 
  src: url('//at.alicdn.com/t/c/font_5131214_1t3r888rx7.woff2?t=1773976658034') format('woff2'),
       url('//at.alicdn.com/t/c/font_5131214_1t3r888rx7.woff?t=1773976658034') format('woff'),
       url('//at.alicdn.com/t/c/font_5131214_1t3r888rx7.ttf?t=1773976658034') format('truetype');
}

input:focus, textarea:focus {
  outline: none;
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-facebookfacebook52:before {
  content: "\e60b";
}

.icon-tuite1:before {
  content: "\e90c";
}

.icon-zuozhe:before {
  content: "\e70a";
}

.icon-youjiantou:before {
  content: "\e644";
}

.icon-zuojiantou:before {
  content: "\e647";
}

.icon-shouji:before {
  content: "\e601";
}

.icon-dianhua:before {
  content: "\e6b9";
}

.icon-youjian:before {
  content: "\e62f";
}

.icon-daohang:before {
  content: "\e640";
}

.icon-xiangxiajiantou:before {
  content: "\e60b";
}

.icon-jiantou:before {
  content: "\e65e";
}

.icon-sanjiao:before {
  content: "\e60e";
}

.icon-Youtube-fill:before {
  content: "\e883";
}

.icon-linkin:before {
  content: "\e600";
}

.icon-facebook:before {
  content: "\e66a";
}

.icon-a-icons8-twitter1:before {
  content: "\e604";
}


a {
    text-decoration: none;
}
:root {
    --MainColor: #c22622;
}
.cet{
  max-width: 1380px;
  width: 94%;
  margin:0 auto;
}

.xinzsh{
    display: none;
}

.cusDivfiex {
    padding: 15px 0;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    position: fixed;
    bottom: 0;
    left: 0;
    display: flex;
    justify-content: center;
}

.cueAniu {
    overflow: hidden;
    position: relative;
    transition: all 0.3s;
    font-weight: 500;
    width: fit-content;
    margin-top: 30px;
    cursor: pointer;
    color: #fff;
    background-color: var(--MainColor);
    padding: 8px 25px;
    border-radius: 30px;
}

.cet2{
  max-width: 1600px;
  width: 94%;
  margin:0 auto;
}



.tit_1{
    display: flex;
    justify-content: center;
}

.tit1in{
    display: flex;
    gap: 20px;
}

.titicof{
        width: 17px;
        display: flex;
        align-items: center;
}

.tit1_t{
    color:var(--AssColor);
    font-size: 16px;
}

.tit_2{
    font-size: 38px;
    color: var(--TxtColor);
    font-weight: bold;
    text-align: center;
    margin:0 auto;
    margin-top: 5px;
    max-width: 800px;
    width: 100%;
    text-align: center;

}

.tit_3{
    font-size: 16px;
    text-align: center;
    color: var(--TxtColor3);
    max-width: 800px;
    width: 100%;
    margin:0 auto;
        margin-top: 5px;
}

.img{
  width: 100%;
  display: block;
}

.send-error-2 {
    position: absolute;
    padding: 8px;
    font-size: 12px;
    border: 1px solid #c80000;
    color: #c80000;
    right: 5px;
    bottom: 5px;
    border-radius: 10px;
    display: none;
}

.mobile-header {
    position: fixed;
    left: 0px;
    width: 100%;
    display: none;
    z-index: 1000;
    transition: all 0.6s ease 0s;
    height: 60px;
    top:0px;
    }

.mobile-tool {
    width: 100%;
}

html{
    scroll-behavior: smooth;
}

.mobile-tool-center {
    width: 94%;
    margin: 0 auto;
    height: 100%;
    overflow: hidden;
}

.mobile-logo-f {
    float: left;
    white-space: nowrap;
    width: 45px;
    margin-top: 8px;
}

.mobile-logo-f:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.mob-logo-img {
    float: left;
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    margin-top: 0px;
}

.mobile-menu {
    cursor: pointer;
    float: right;
    width: 30px;
    height: 60px;
    text-align: center;
}

.mobile-menu:before {
    content: '\f0c9';
    display: block;
    font-family: icomoon5;
    font-size: 30px;
    color: #fff;
    line-height: 60px;
    float: left;
}

.mob-contact-btn {
    cursor: pointer;
    float: right;
    width: 30px;
    margin-right: 20px;
    text-align: center;
}

.mob-contact-btn:before {
    content: '\e900';
    display: block;
    font-family: icomoon5;
    font-size: 25px;
    color: #fff;
    line-height: 60px;
    float: left;
}

.mob-search-btn {
    cursor: pointer;
    float: right;
    width: 30px;
    margin-right: 20px;
    text-align: center;
}

.mob-search-btn:before {
    content: '\e900';
    font-family: icomoon_seh;
    display: block;
    font-size: 25px;
    color: #fff;
    line-height: 60px;
    float: left;
}

.mob-search-cover {
    position: fixed;
    right: 0px;
    width: 100%;
    height: 100%;
    background: var(--MainColor);
    z-index: 1001;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: all 0.8s ease 0s;
}

.mob-contact-det-f {
    float: right;
    width: 320px;
    height: 100%;
    background: #fff;
    margin-right: -320px;
    transition: all 0.8s ease 0s;
}

.mob-sr-close {
    position: absolute;
    right: 50px;
    top: 50px;
    width: 50px;
    height: 50px;
    cursor: pointer;
}

.mob-sr-close:before {
    content: '\e60b';
    font-family: icomoon;
    width: 100%;
    text-align: center;
    font-size: 30px;
    color: #fff;
    line-height: 50px;
}

.mob-search {
    position: absolute;
    width: 350px;
    left: calc(50% - 175px);
    top: 50%;
    transform: translate(0, -50%);
}

.mob-srh-form {
    float: left;
    width: 100%;
}

.mob-srh-in {
    float: left;
    width: calc(100% - 70px);
    border: none;
    height: 55px;
    border-radius: 27.5px;
    background: #fff;
    padding-left: 20px;
    font-size: 14px;
}

.srh-btn {
    float: left;
    width: 55px;
    height: 55px;
    margin-top: 0px;
    margin-left: 15px;
    border: none;
    cursor: pointer;
    border-radius: 50%;
    background: #fff;
    position: relative;
}

.srh-btn span {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
}

.srh-btn span:before {
    position: absolute;
    left: 0px;
    top: 0px;
    content: '\e900';
    width: 100%;
    height: 100%;
    font-family: icomoon_seh;
    color: #202020;
    font-size: 20px;
    line-height: 55px;
    text-align: center;
}

.coss-em::before {
    font-family: icomoon_35;
    content: '\e901';
}

.mob-nav-btn, .mob-nav-btn2 {
    float: right;
    width: 30px;
    height: 30px;
    position: relative;
    margin-top: 7px;
    cursor: pointer;
    transition: all 0.6s ease 0s;
}

.mob-nav-btn:before,.mob-nav-btn2::before {
    content: '\e900';
    position: absolute;
    right: 5px;
    top: 3px;
    color: #363636;
    font-size: 18px;
    font-family: icomoon3;
}

.mob-nav-share {
    float: left;
    margin-top: 30px;
    overflow: hidden;
}

.mob-nav-share .fb3-sh {
    background-color: var(--MainColor);
    border-radius: 50%;
    color: #fff;
}

.mob-nav-share .fb3-sh:before {
    color: #fff;
}

.mob-con-cover {
    position: fixed;
    right: 0px;
    width: 100%;
    height: 100%;
    background: var(--MainColor);
    z-index: 1001;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: all 0.8s ease 0s;
}

.mob-con-d {
    float: left;
    margin: 30px 25px;
    width: calc(100% - 50px);
    position: relative;
}

.mob-con-d-close {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 30px;
    height: 30px;
    cursor: pointer;
}

.mob-con-d-close:before {
    content: '\e60b';
    font-family: icomoon;
    width: 100%;
    text-align: center;
    font-size: 22px;
    color: #333;
    line-height: 30px;
}

.con-s-sin {
    float: left;
    width: 100%;
    margin-top: 35px;
}

.cons-s-img {
    float: left;
    width: 30px;
    height: 30px;
    margin-top: 10px;
    position: relative;
}

.cons-s-img::before {
    position: absolute;
    width: 100%;
    line-height: 30px;
    text-align: center;
    color: var(--MainColor);
    font-size: 26px;
}

.cons-s-t {
    float: left;
    margin-left: 4%;
    width: calc(92% - 30px);
    margin-top: 3px;
}

.cons-t-t1 {
    float: left;
    width: 100%;
    color: #000000;
    font-size: 18px;
    font-weight: 600;
}

.cons-t-t2 {
    float: left;
    width: 100%;
    color: #333333;
    font-size: 18px;
    margin-top: 10px;
}

.cons-s-img {
    float: left;
    width: 30px;
    height: 30px;
    margin-top: 10px;
    position: relative;
}

.coss-tel::before {
    content: '\e942';
    font-family: icomoon_35;
}

.mobile-dowshow {
    position: fixed;
    top: 0px;
    width: 100%;
    height: 0px;
    background: #fff;
    transition: all 0.6s ease 0s;
    overflow: hidden;
    z-index: 1001;
}

.mb-down-close {
    position: absolute;
    right: 15px;
    top: 15px;
    width: 30px;
    height: 30px;
}

.mb-down-close:before {
    content: '\e60b';
    display: block;
    font-family: icomoon;
    font-size: 22px;
    color: #1c1c1c;
    line-height: 30px;
    text-align: center;
}

.mob-nav1 {
    float: left;
    width: 100%;
    margin-top: 50px;
}

.mob-nav-s1 {
    float: left;
    width: 100%;
    position: relative;
}

.mob-col-name1 {
    float: left;
    width: 100%;
    position: relative;
    border-bottom: 1px solid #D6D6D6;
}

.mob-col-name1:before {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 0;
    height: 1px;
    background: var(--MainColor);
    transition: all 0.6s ease 0s;
}

.mob-nav-a1 {
    float: left;
    font-size: 14px;
    padding-top: 13px;
    padding-bottom: 10px;
    color: #1c1c1c;
}

.mob-nav2 {
    float: left;
    width: 100%;
    display: none;
    overflow: hidden;
}

.mob-nav-s2 {
    float: left;
    width: 100%;
    border-bottom: 1px solid #D6D6D6;
}

.mob-col-name2 {
    float: left;
    width: 100%;
    position: relative;
}

.mob-nav-a2 {
    float: left;
    margin-left: 6%;
    font-size: 14px;
    padding-top: 10px;
    padding-bottom: 10px;
    transition: all 0s ease 0s;
    color: #1c1c1c;
}

.mob-nav3 {
    float: left;
    width: 100%;
    display: none;
    overflow: hidden;
}

.mob-nav-s3 {
    float: left;
    width: 100%;
    border-bottom: 1px solid #D6D6D6;
}

.mob-nav-a3 {
    float: left;
    margin-left: 9%;
    font-size: 14px;
    padding-top: 10px;
    padding-bottom: 10px;
    transition: all 0s ease 0s;
    color: #1c1c1c;
}

.mob-nav-a3:hover {
    color: var(--MainColor);
}

.fb3-sh:before {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    line-height: 20px;
    text-align: center;
    font-family: icomoon;
    font-size: 12px;
    transition: all 0.2s ease 0s;
    color: var(--MainColor);
            line-height: 25px;
}
.mob_bk2{
    background-color: var(--MainColor);
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 5px;
}
.fb3-sh.facebook:before {
    content: '\e62c';
}

.fb3-sh.linkedin:before {
    content: '\e630';
}

.fb3-sh.youtube:before {
    content: '\e634';
}

.fb3-sh.twitter {
    text-align: center;
    line-height: 25px;
}

.i3msslbtnr{
    width: 38px;
    height: 38px;
    border-radius: 50%;
    color: #fff;
    font-size: 18px;
    text-align: center;
    line-height: 38px;
    transition: all 0.6s ease 0s;
    background: var(--Gradient);
}
.botcusbtn{
    margin-top: 0px;
    z-index: 9;
}
.detmobhd{
    background:var(--MainColor);
}
.lang-box {
    position: absolute;
    right: 0;
    top: 42px;
    z-index: 1000;
    width: 184px;
    padding: 10px 0;
    background: #fff;
    transform: translate3d(0, 10px, 0);
    -webkit-transform: translate3d(0, 10px, 0);
    opacity: 0;
    visibility: hidden;
    transition: all .4s ease 0s;
    box-shadow: 0 0 10px rgba(63, 62, 62, 0.2);
    border-radius: 5px;
}
.lang-box::before {
    content: '';
    position: absolute;
    right: 37px;
    top: -8px;
    overflow: hidden;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #fff;
    border-left: 8px solid transparent;
    display: block;
}
.lang-box ul {
    text-align: left;
    font-size: 0;
    max-height: 60vh;
    overflow-y: scroll;
    max-height: 160px !important;
}
.lang-box ul li {
    display: inline-block;
    box-sizing: border-box;
    width: calc(50% - 20px);
    padding: 5px 0;
    margin: 0 10px;
    border-bottom: 1px solid #f5f5f5;
}
.lang-box ul li a {
    color: #333;
    font-size: 15px;
    display: flex;
    align-items: center;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
}
.lang-box ul li img {
    height: 23px;
    width: 30px;
    object-fit: none;
    vertical-align: middle;
    margin-right: 6px;
    border-radius: 3px;
}
.Engflex{
    position: relative;
}
.Engflex:hover .lang-box {
    opacity: 1;
    visibility: visible;
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
}
@media screen and (max-width:980px) {
    .fly-em{
        display: none;
    }
    .xinzsh {
        display: block;
    }
    .fb3-sh {
        width: 25px;
        height: 25px;
        display: block;
        float: left;
        position: relative;
        margin-left: 10px;
    }
    .fb3-sh:first-child {
        margin-left: 0px;
    }
    .mobile-header{
        display: block;
    }
    .br{
    display:none;
}
.fs-230{
         font-size:115px!important;
    }
.fs-103{
        font-size:50px!important;
    }
.fs-96{
        font-size:48px!important;
    }
    .fs-85{
         font-size:42px!important;
    }
    .fs-80{
         font-size:40px!important;
    }
    .fs-75{
         font-size:38px!important;
    }
.fs-72{
         font-size:37px!important;
    }
      .fs-66{
         font-size:37px!important;
    }
     .fs-62{
         font-size:36px!important;
    }
    .fs-60{
         font-size:35px!important;
    }
.fs-56{
         font-size:30px!important;
    }
     .fs-50{
         font-size:28px!important;
    }
    .fs-48{
         font-size:28px!important;
    }
.fs-46{
         font-size:28px!important;
    }
     .fs-40{
         font-size:28px!important;
    }
     .fs-38{
         font-size:25px!important;
    }
    .fs-36{
         font-size:18px!important;
    }
    .fs-35{
        font-size:18px!important;
   }
.fs-34{
         font-size:18px!important;
    }
    .fs-32{
        font-size:18px!important;
}
    .fs-30{
        font-size:18px!important;
}
.fs-28{
        font-size:17px!important;
}
.fs-27{
        font-size:17px!important;
}
.fs-26{
        font-size:16px!important;
}
.fs-24{
        font-size:16px!important;
    }
.fs-23{
        font-size:16px!important;
    }
.fs-22{
        font-size:16px!important;
    }
.fs-21{
        font-size:15px!important;
    }
    .fs-20{
        font-size:15px!important;
    }
    .fs-18{
        font-size:14px!important;
    }
    .fs-17{
        font-size:14px!important;
    }
     .fs-16{
        font-size:14px!important;
    }
    .fs-15{
        font-size:13px!important;
    }
.fs-14{
    font-size:12px!important;
}
}
 
        @font-face {
    font-family: 'Urbanist';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/urbanist/v18/L0x-DF02iFML4hGCyMqrbS10ig.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Urbanist';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/urbanist/v18/L0x-DF02iFML4hGCyMqlbS0.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}












@font-face {
    font-family: "iconfont"; /* Project id 5204140 */
    src: url('//at.alicdn.com/t/c/font_5204140_91sy2k335o6.woff2?t=1784683705966') format('woff2'),
         url('//at.alicdn.com/t/c/font_5204140_91sy2k335o6.woff?t=1784683705966') format('woff'),
         url('//at.alicdn.com/t/c/font_5204140_91sy2k335o6.ttf?t=1784683705966') format('truetype');
  }
  
  .iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  
  .icon-caret-right:before {
    content: "\e8ec";
  }
  
  .icon-rili:before {
    content: "\e640";
  }
  
  .icon-articleUser:before {
    content: "\e607";
  }
  
  .icon-right:before {
    content: "\e63c";
  }
  
  .icon-facebookfacebook52:before {
    content: "\e60b";
  }
  
  .icon-in:before {
    content: "\e64d";
  }
  
  .icon-youtube-fill:before {
    content: "\e6a7";
  }
  
  .icon-tuite1:before {
    content: "\e90c";
  }
  
  .icon-jiahao:before {
    content: "\e721";
  }
  
  .icon-jianhao:before {
    content: "\e60a";
  }
  
  .icon-Down:before {
    content: "\e954";
  }
  
  .icon-Rightyou:before {
    content: "\e606";
  }
  
  .icon-phone:before {
    content: "\e600";
  }
  
  .icon-zuobiao:before {
    content: "\e66c";
  }
  
  .icon-mail-fill:before {
    content: "\e7d0";
  }
  
  .icon-dengpao:before {
    content: "\e60e";
  }
  
  .icon-gou:before {
    content: "\e608";
  }
  
  .icon-play:before {
    content: "\e664";
  }
  
  .icon-down:before {
    content: "\e615";
  }
  
  .icon-sousuo:before {
    content: "\e628";
  }
  
  .icon-facebook:before {
    content: "\e619";
  }
  
  .icon-linkedin:before {
    content: "\e626";
  }
  
  .icon-custom-phone:before {
    content: "\e634";
  }
  
  .icon-mail:before {
    content: "\e7bd";
  }
  
  .icon-YouTube:before {
    content: "\e712";
  }
  
  .icon-ICON_tuite:before {
    content: "\e603";
  }
  













* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    list-style: none;
    font-family: "Urbanist", sans-serif;
}

i, em {
    font-style: normal;
}

img {
    width: 100%;
    display: block;
    height: auto;
    transition: all 0.3s ease;
}

a {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}




input {
    outline: none;
    border: 0;
    width: 100%;
    padding-left: 12px;
    height: 100%;
    transition: all 0.3s;
    background-color: transparent;
}

textarea {
    outline: none;
    border: 0;
    padding: 12px;
    width: 100%;
    height: 100%;
    transition: all 0.3s;
    background-color: transparent;
}

p {
    line-height: 24px;
    font-size: 16px;
    color: #4D4D4D;
}



/* placeholder 默认状态 */
input::placeholder {
    color: #555;
    opacity: 1;
    transition: .3s;
}

/* 聚焦时 */
input:focus::placeholder {
    opacity: .45;
}


/* placeholder 默认状态 */
textarea::placeholder {
    color: #555;
    opacity: 1;
    transition: .3s;
}

/* 聚焦时 */
textarea:focus::placeholder {
    opacity: .45;
}






.headTop {
    width: 100%;
    height: 48px;
    background-color: rgba(8, 6, 8, 0.9);
}


.headTopJz {
    max-width: 1380px;
    width: 94%;
    margin: 0 auto;
    display: flex;
    justify-content: right;
    height: 100%;

}

.youXi {
    display: flex;
    align-items: center;
    gap: 10px;
}




.headTopJz>div {
    display: flex;
    color: #fff;
    align-items: center;
    height: 100%;
    gap: 50px;
}


.shejiao {
    display: flex;
    align-items: center;
    gap: 10px;
}

.Engflex {
    display: flex;
    align-items: end;
    gap: 10px;
}


.youXi i {
    font-size: 18px;
}

.shejiao i {
    font-size: 18px;
}


.headBottom {
    width: 100%;
    background-color: rgba(8, 6, 8, 0.5);
    height: 72px;
}

.head {
    width: 100%;
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;
}


.headBottomJz {
    max-width: 1380px;
    width: 94%;
    margin: 0 auto;
    height: 100%;
}


.logodiv {
    width: 250px;
    position: relative;
}

.logodivDlex {
    width: 100%;
    height: 120px;
    position: absolute;
    top: -48px;
    background-color: #c22622;
}

.logodivDlex img {
    width: 38%;
}

.logodivDlex {
    display: flex;
    align-items: center;
    justify-content: center;
}

.headBottomJz {
    display: flex;
    justify-content: space-between;

}

.doah {
    display: flex;
    align-items: center;
    color: #fff;
    gap: 80px;
    font-weight: 500;
}

.doahFlex {
    display: flex;
    justify-content: right;
    align-items: center;
    gap: 30px;
    height: 100%;
}


.suoxco {
    color: #fff;
}

.xian {
    width: 1px;
    height: 25px;
    background-color: #686261;
}

.cuxlv {
    padding: 5px 30px;
    background-color: #c22622;
    color: #fff;
}

.cuxlvBian {
    padding: 5px;
    border: 1px solid #bb2622;
    width: fit-content;
    cursor: pointer;
}



.hasDrop{
    display: flex;
    align-items: center;
    height: 41px;
    gap: 12px;
}






.hasDrop {
    position: relative;
}

.dropMenu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 220px;
    padding: 12px 0;
    background: linear-gradient(135deg,
            rgba(255, 255, 255, 0.85),
            rgba(255, 255, 255, 0.6));
    backdrop-filter: blur(14px) saturate(140%);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .12);
    border-radius: 14px;
    opacity: 0;
    transform: translateY(10px);
    pointer-events: none;
    transition: all .25s ease;
    z-index: 999;
}

.dropMenu a {
    padding: 10px 22px;
    font-size: 15px;
    color: #1a1a1a;
    transition: all .25s ease;
    white-space: nowrap;
}

.dropMenu a:hover {
    background: rgba(221, 25, 40, .08);
    color: #d90012;
    padding-left: 28px;
}

.hasDrop:hover .dropMenu {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.hasDrop:hover .doxnIx i {
    transform: rotate(180deg);
}


.suoxco i {
    font-size: 21px;
}

.banner {
    position: relative;
}


.bannerJz {
    max-width: 1380px;
    width: 94%;
    position: absolute;
    left: 50%;
    top: 50%;
    color: #fff;
    transform: translate(-50%, -50%);
}

.bannerJz p {
    color: #fff;
}

.Elect {
    font-size: 55px;
    font-weight: 900;
}

.Elect span {
    color: #c22622;
}

.toYou {
    font-size: 500;
    margin-top: 30px;
    font-size: 27px;
}

.usted li {
    padding-left: 20px;
    position: relative;
    font-weight: 500;
    display: grid;
    gap: 20px;
    margin: 20px 0;
    font-size: 27px;
}

.usted li::after {
    width: 8px;
    height: 8px;
    border-radius: 50px;
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background-color: #fff;
}



.cuxlvBianTOp {
    margin-top: 30px;
}





.foot {
    width: 100%;
    margin: 0 auto;
    padding: 60px 0;
    background-repeat: no-repeat;
    background-image: url(/img/foot.png);
    margin-top: 210px;
    background-size: cover;
}


.footJzx {
    max-width: 1380px;
    width: 94%;
    margin: 0 auto;
    color: #fff;
}

.ified {
    display: grid;
    gap: 20px;
    margin-top: 20px;
}

.ified>li {
    display: flex;
    align-items: center;
    gap: 20px;
}

.ified i {
    font-size: 21px;
}

.Powerwe {
    font-size: 48px;
    font-weight: 700;
}

.footRight {
    width: 500px;
    position: relative;
}

.footRightxunp {
    position: absolute;
    padding: 50px 20px;
    width: 100%;
    background-color: #fff;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    top: -150px;
}

.footJzx {
    display: flex;
    justify-content: space-between;
}

.Experts {
    font-size: 48px;
    font-weight: 700;
    color: #080507;
}

.nain {
    height: 45px;
    border-bottom: 1px solid #f1f1f1;
    position: relative;
}


.nainsdiv {
    display: grid;
    gap: 30px;
    margin-top: 30px;
}

.naintextarea {
    height: 150px;
    border-bottom: 1px solid #f1f1f1;
    position: relative;
}


.foot1 {
    width: 100%;
    padding-top: 120px;
    background-image: url(/img/foot1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.foot1Jz {
    max-width: 1380px;
    width: 94%;
    margin: 0 auto;
    padding-bottom: 60px;
}


.mail {
    width: 36px;
    height: 36px;
    background-color: #c22622;
    display: flex;
    justify-content: center;
    align-items: center;
}

.mail i {
    font-size: 16px;
    color: #fff;
}

.mailflex {
    display: flex;
    /* align-items: center; */
    color: #fff;
    gap: 20px;
}


.footlogoBox>a .mailflex{
    align-items: center;
}
.footlogo {
    width: 174px ;
}




.footlogoBox {
    display: grid;
    gap: 20px;
    width: 23%;
}

.Fenghua {
    line-height: 30px;
    width: calc(100% - 50px);
}

.footlogosdBox {
    display: flex;
    margin-top: 50px;
    justify-content: space-between;
}


.qucick>li>div:nth-child(1) {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 40px;
    position: relative;
    height: 24px;
}

.quck1::after {
    width: 5px;
    height: 26px;
    content: '';
    position: absolute;
    left: -12px;
    top: 0;
    background-color: #c22622;
}

.qucick {
    width: 55%;
    color: #fff;
    display: flex;
    justify-content: space-between;
}

.qucick>li>div:not(:nth-child(-n + 2)) {
    margin-top: 20px;
}


.shejiao1qwe i {
    font-size: 26px;
    color: #fff;
}


.xmlflex{
    padding: 15px 0;
    border-top: 1px solid #292325;
    display: flex;
    justify-content: space-between;
    font-size: 14px ;
    font-weight: 500;
    max-width: 1380px ;
    width: 94% ;
    color: #fff;
    margin: 0 auto;
}


.aboutBner{
    width: 100% ;
    position: relative;
}

.aboutBner::after{
    position: absolute;
    width: 100% ;
    height: 100% ;
    background-color: rgba(0, 0, 0, .30);
    left: 0;
    top: 0;
    content: '';
}

.aboutBnerbox{
    max-width: 1380px ;
    width: 94% ;
    margin: 0 auto;
    z-index: 11;
    height: 100% ;
    position: absolute;
    top: 50%;
    left: 50% ;
    display: flex;
    align-items: center;
    transform: translate(-50% , -50%);
}

.main{
    display: flex;
    align-items: center;
    gap: 8px ;
    margin-top: 10px ;
}

.Howe{
    font-size: 55px ;
    font-weight: 900;
}


.HoweBox{
    color: #fff;
}

.fenye{
    overflow: hidden;
}

.StriFlex{
   display: flex;
   align-items: center;
   gap: 20px ; 
}

.Stri{
    font-size: 28px ;
    color: #080608;
    font-weight: 600;
}

.StriFlexUl{
    display: grid;
    margin-top: 50px ;
    gap: 20px ;
    grid-template-columns: repeat(3 , 1fr);
}


.StriFlexUl li{
    padding: 30px ;
    background-color: #fff;
}
.usewe{
    margin-top: 20px ;
}



.cuxlvBian:hover .cuxlv{
    background-color: #080608;
    color: #fff;
}

.tab-radio {
    position: fixed;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.gleflex {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
    gap: 20px;
    margin-top: 50px;
}

.gleflex > .product-tab {
    position: relative;
    z-index: 2;
    width: 100%;
    padding: 15px 28px;
    border: 0;
    background-color: #080608;
    color: #fff;
    font-family: inherit;
    font-size: 16px;
    font-weight: 500;
    line-height: inherit;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    appearance: none;
    transition:
        color .3s ease,
        background-color .3s ease,
        transform .28s ease,
        box-shadow .28s ease;
}

.gleflex > .product-tab:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(194, 38, 34, .16);
}

.gleflex > .product-tab.is-active {
    background-color: #c22622;
    color: #fff;
}

.productTabs .bothxina > .xiamc {
    display: none;
    opacity: 0;
    transform: translateY(18px);
}

.productTabs .bothxina > .xiamc.active {
    display: block;
    animation: tabFadeUp .45s ease forwards;
}

@media (max-width: 640px) {
    .gleflex {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .gleflex > .product-tab {
        padding: 12px 14px;
        font-size: 14px;
        white-space: normal;
    }
}

.mainDet{
    margin-top: 123px;
}


.site-control{
    display: none;
}

.product-tab{
    cursor: pointer;
}


.selectnav{
    color: #c22622;
}


/* .is-scrolled .logodivDlex{
  height: 108px ;
}

.is-scrolled .logodivDlex img{
    width: 33% ;
} */


.cont *{
    padding: revert;
    margin: revert ;
    list-style: revert;
}

.tab-content *{
    padding: revert;
    margin: revert ;
    list-style: revert;
}




.Submitww:hover{
    background-color: #080608;
    color: #fff;
}




.xmlflex a:hover{
    color: #c22622 ;
}


.KSdRight:hover .Nesdxt{
    color: #c22622 ;
}


.whys li:hover .Hongma{
    color: #c22622 ;
}


.ntegraLi .DownI{
    margin-right: 12px ;
}



.aflex{
    display: flex;
    align-items: center;
    gap: 10px ;
}
.aflexw {
    display: flex;
    justify-content: space-between;
    gap: 20px ;
    align-items: center;
}
.gonxc:hover .dropMenu1 {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto ;
}


.dropMenu1 {
    position: absolute;
    top: 0;
    left: 100%;
    min-width: 220px;
    padding: 12px 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.6));
    backdrop-filter: blur(14px) saturate(140%);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .12);
    border-radius: 14px;
    opacity: 0;
    transform: translateY(10px);
    pointer-events: none;
    transition: all .25s ease;
    z-index: 999;
}.dropMenu1 a {
    padding: 10px 22px;
    font-size: 15px;
    display: block;
    white-space: nowrap;
    color: #1a1a1a;
    transition: all .25s ease;
}


.aflex i{
    margin-top: 5px ;
}


.indexOdjztops1ew{
    margin-top: 130px !important;
}







.is-scrolled .headBottom{
    background-color: transparent;
}
.is-scrolled .headTop{
    background-color: transparent;
}

.head{
    transition: all 0.3s ;
}

.is-scrolled {
    top: -50px ;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.35));
    backdrop-filter: blur(18px) saturate(140%);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

.is-scrolled .logodivDlex{
    height: 72px ;
    top: 0px;
}


.is-scrolled .logodivDlex img{
    width: 25% ;
}

.is-scrolled .doah{
    color: #080608;
}

.is-scrolled .suoxco{
    color: #c22622 ;
}


.earing{
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2; /* 显示两行 */
    line-clamp: 2;
    text-overflow: ellipsis;
} 
        .blogBox {
    max-width: 1380px;
    width: 94%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    margin-top: 110px;
}

.blogBoxRight {
    width: 330px;
}

.blogBoxLeft {
    width: calc(100% - 360px);
}




.boImg {
    width: 440px;
    overflow: hidden;
}

.Canexc {
    width: calc(100% - 460px);
    margin-top: 0;
}

.boLidom>a {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.boLidom:not(:last-child) {
    padding-bottom: 40px;
    border-bottom: 1px solid #e7e7e7;
}

.blogBoxLeftMain>ul {
    display: grid;
    gap: 40px;
}


.seachBox {
    display: flex;
    align-items: center;

}

.seachBox {
    width: 100%;
    height: 54px;
    border: 1px solid #ececec;
}

.inExc {
    width: calc(100% - 55px);
    height: 100%;
}

.souxcb {
    width: 50px;
    height: 50px;
    background-color: #c22622;
    color: #fff;
    display: flex ;
    justify-content: center ;
    align-items: center;
    margin-left: 10px;
    margin: 3px;
}

.souxcb i {
    font-size: 21px;
    color: #fff;
}


.MoreVid {
    font-size: 18px;
    font-weight: 700;
    color: #4D4D4D;
    padding-bottom: 8px;
    border-bottom: 1px solid #e3e3e3;
}


.IdTopul {
    margin-top: 30px;
}

.Topul li {
    padding: 15px 0;
    padding-left: 20px;
    border-bottom: 1px solid #e3e3e3;
}


.yuef {
    font-size: 14px;
    color: #4D4D4D;
    position: relative;
}

.Cnsdk {
    font-weight: 500;
    color: #4D4D4D;
    margin-top: 10px;
}

.yuef::after {
    content: '';
    position: absolute;
    left: -15px;
    top: 50%;
    transform: translateY(-50%);
    width: 7px;
    height: 7px;
    background-color: #c22622;
    border-radius: 50%;
}




.set {
    padding: 30px 20px;
    margin-top: 30px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}


.setText {
    font-size: 18px;
    font-weight: 700;
    color: #4D4D4D;
    text-align: center;
}

.holdeBox {
    margin-top: 20px;
}

.holde {
    margin-bottom: 15px;
    position: relative;
}

.holde {
    width: 100%;
    height: 45px;
    overflow: hidden;
    border-bottom: 1px solid #cac9c9 !important;
}

.essawe textarea {
    width: 100%;
    border-bottom: 1px solid #cac9c9 !important;
    height: 143px;

}



.allP p {
    font-size: 14px;
    color: #555555;
    margin-top: 15px;
} 

/* .holde input:focus{
       background-color: #c22622;
} */


.mainDet {
    width: 100%;
    background-color: #f7f7f7;
    padding: 10px 0;
}

.mainDetjz {
    max-width: 1380px;
    width: 94%;
    margin: 0 auto;
    display: flex;
    color: #4D4D4D;
    align-items: center;
    gap: 8px;
}

.mainDetjz>div:last-child {
    color: #c22622;
}

.boLidom>.boImg {
    position: relative;
}


.Cnswgk {
    font-size: 42px;
    color: #4D4D4D;
    font-weight: 700;
}


.blogBoxLeftMainBox {
    padding: 20px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}


.rilixc {
    display: flex;
    gap: 8px;
    align-items: center;
}


.rilixcFlex {
    display: flex;
    gap: 30px;
    margin-top: 20px;
}

.rilixc i {
    color: #c22622;
    font-size: 18px;
}

.KSdLEdtFlex {
    display: grid;
    gap: 15px ;
    margin-top: 30px;
}
.v1wrev{
    transform: rotate(180deg);
}

.KSdRight1w{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px ;
}

.KSdLEdt {
    display: flex;
    justify-content: space-between;
}

.xiAn {
    width: 1px;
    height: 78px;
    background-color: #ececec;
}




.rev {
    display: flex;
    align-items: center;
    color: #4D4D4D;
}





.Prev {
    margin-left: 8px ;
}

.rev {
    font-size: 16px;
    font-weight: 700;
}


.KSdLEdtFlex a:hover .Next p{
    color: #bb2622;
}

.KSdLEdtFlex a:hover i{
    color: #bb2622;
}

.v1wrev>div{
    font-size: 0;
}


.boULjz {
    max-width: 1380px;
    width: 94%;
    margin: 0 auto;
}

.boixc {
    font-size: 38px;
    font-weight: 700;
    color: #4D4D4D;
}


.boUl1 {
    margin-top: 50px;
}


@media (hover: hover) and (pointer: fine) {

    .boLidom,
    .Topul li,
    .KSdRight,
    .smegg,
    .souxcb {
        transition: transform .28s ease, color .24s ease, background-color .24s ease, border-color .24s ease;
    }

    .boLidom:hover {
        transform: translateY(-5px);
    }

    .boLidom:hover .boImg img {
        transform: scale(1.045);
    }

    .Topul li:hover {
        color: #c22622;
        transform: translateX(4px);
    }

    .smegg:hover,
    .souxcb:hover {
        transform: translateY(-2px);
    }
}



.boImg {
    position: relative;
}


.emjxc {
    font-size: 21px;
    font-weight: 700;
}

.pop {
    margin-top: 20px;
}




.boULjz {
    margin-top: 110px;
}

.cuxlvBianjz {
    margin: 0 auto;
    margin-top: 20px;
}

.cuxlvBianjz>.cuxlv {
    padding: 5px 50px;
}


.liewe {
    margin-top: 50px;
}

.LiflexDisp {
    font-size: 21px;
    font-weight: 700;
    color: #4D4D4D;
}

.jianxcv {
    color: #c22622;
}

.fiPsd p {
    padding: 20px;
}




.LiflexDispActive i {
    color: #ffffff;
}

.fiPsd {
    overflow: hidden;
    height: 0;
    transition: height .3s ease;
}

.liewe ul {
    display: grid;
    gap: 20px;
}

.LiflexDisp {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #f5f5f5;
    padding: 15px 30px;
}

.LiflexDispActive {
    background-color: #bb2622;
    color: #ffffff;
}

/* Blog visual polish — 2026-07 */
.set {
    position: sticky;
    top: 88px;
}

.boLidom {
    position: relative;
    padding: 18px;
    border-radius: 18px;
    background: #fff;
    transition: transform .4s cubic-bezier(.2, .75, .25, 1), box-shadow .4s ease
}



.boLidom>.boImg {
    border-radius: 14px;
    box-shadow: 0 12px 30px rgba(8, 6, 8, .08)
}

.boLidom>.boImg img {
    display: block;
    width: 100%;
    aspect-ratio: 16/10;
    object-fit: cover
}

.seachBox {
    background: #fff;
    transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease
}

.seachBox:focus-within {
    border-color: rgba(194, 38, 34, .7);
    box-shadow: 0 0 0 4px rgba(194, 38, 34, .09), 0 12px 28px rgba(8, 6, 8, .06);
    transform: translateY(-1px)
}

.souxcb {
    cursor: pointer
}

.Topul li {
    position: relative
}

.Topul li::after {
    content: "";
    position: absolute;
    left: 20px;
    right: 100%;
    bottom: -1px;
    height: 1px;
    background: #c22622;
    transition: right .3s ease
}

.Topul li:hover::after {
    right: 0
}

.Topul li:hover .Cnsdk {
    color: #c22622
}

.set {
    border: 1px solid #ededed;
    box-shadow: 0 18px 45px rgba(8, 6, 8, .07)
}

.holde,
.essawe {
    border: 1px solid transparent;
    position: relative;
    transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease
}

.essawe {
    border-radius: 8px
}



.emjxc {
    line-height: 1.4
}



@media (max-width:900px) {
    .blogBoxRight {
        position: static
    }

    .boLidom {
        padding: 14px
    }
}

@media (max-width:640px) {
    .blogBox {
        width: calc(100% - 28px);
        margin-top: 64px
    }

    .boLidom {
        padding: 10px;
        border: 1px solid #ededed;
        box-shadow: 0 10px 30px rgba(8, 6, 8, .06)
    }

    .boLidom::before {
        display: none
    }

    .boLidom>.boImg {
        border-radius: 10px
    }

    .boLidom>.Canexc {
        padding: 0 4px 8px
    }

    .emjxc {
        font-size: 19px
    }

    .pop {
        margin-top: 12px
    }

    .set {
        padding: 24px 16px
    }
}



.blogBox1qwe{
    margin-bottom: 110px ;
} 
        .data-section {
    width: 100%;
    height: 135px;
    display: flex;
    overflow: hidden;
    background: #e5e5e5;
}

.data-item {
    flex: 1;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
}

/* 关键：用背景层做斜切，不裁剪元素本身 */
.data-item::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -55px;
    right: -55px;
    background: var(--bg);
    transform: skewX(339deg);
    z-index: 1;
}

/* 层级，前面的压住后面的，避免缝 */
.data-item-1 {
    --bg: #c22622;
    z-index: 4;
}

.data-item-2 {
    --bg: #8b1c21;
    z-index: 3;
}

.data-item-3 {
    --bg: #cccfcc;
    z-index: 2;
}

.data-item-4 {
    --bg: #e6e6e5;
    z-index: 1;
}

/* 内容 */
.data-content {
    position: relative;
    z-index: 5;
    text-align: left;
}

.data-num {
    line-height: 1;
    color: #fff;
}

.data-num span {
    font-size: 48px;
    font-weight: 700 ;
    margin-left: 2px;
}
.data-num .num{
    font-weight: 700;
    font-size: 72px ;
}

.data-num em {
    font-size: 14px;
    font-style: normal;
    margin-left: 10px;
    vertical-align: middle;
}

.data-text {
    margin-top: 8px;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    color: #fff;
}

/* 第三块数字浅红底 */
.data-item-3 .data-num {
    color: #d32020;
    display: inline-block;
    padding: 4px 4px 0;
}

/* 第四块文字颜色 */
.data-item-4 .data-num {
    color: #d32020;
}

.data-item-3 .data-text {
    color: #333;
}

.data-item-4 .data-text {
    color: #333;
}

/* 手机端 */
@media (max-width: 768px) {
    .data-section {
        height: auto;
        flex-wrap: wrap;
    }

    .data-item {
        flex: 0 0 50%;
        height: 120px;
    }

    .data-item::before {
        left: 0;
        right: 0;
        transform: none;
    }

    .data-num {
        font-size: 36px;
    }

    .data-num span {
        font-size: 24px;
    }
}


.yuanflex {
    display: flex;
    gap: 10px;
    align-items: center;
    font-size: 14px;
    color: #080608;
    padding: 8px 15px;
    background-color: #e6e7e5;
    font-weight: 600;
    width: fit-content;
}

.yuam {
    width: 20px;
    height: 20px;
}

.cove p {
    margin-top: 30px;
}



.abxtienx {
    font-size: 48px;
    margin-top: 20px;
    font-weight: 700;
}

.about {
    max-width: 1380px;
    width: 94%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    margin-top: 110px;
}


.aboutLeft {
    width: 48%;
}

.yuam {
    width: 8px;
    height: 8px;
    background-color: #c22622;
    border-radius: 50%;
}


.aboutRight {
    width: 48%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.aboutRightRight {
    width: 87%;
    position: relative;
}




.anniubof>div {
    width: 75px;
    height: 75px;
    background-color: #c22622;
    color: #fff;
    text-align: center;
    line-height: 75px;
}



.anniubof {
    position: absolute;
    top: 50%;
    left: 50%;
    padding: 8px;
    border: 1px solid #f4d9d8;
    transform: translate(-50%, -50%);
}

.anniubof i {
    font-size: 36px;
}

.imgBox {
    position: relative;
}

.imgBox img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.sideTag {
    position: absolute;
    left: 35px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.sideTag .sobxv {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    transform: rotate(180deg);
    /* 让文字方向更接近你图里的效果 */
    font-size: 55px;
    line-height: 1;
    color: #C22622;
    letter-spacing: 2px;
    font-weight: 700;
}

.sobxv span {
    color: #CDD0CD;
}


.uxkcf {
    font-size: 48px;
    font-weight: 700;
    margin-top: 20px;
    color: #080608;
}

.choss {
    max-width: 1380px;
    width: 94%;
    margin: 110px auto;
}

.chossflex {
    align-items: end;
    display: flex;
    justify-content: space-between;
}

.whul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.whulLidom {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    background: #000;
}

/* 图片基础处理 */
.whulLidom>div:first-child {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.whulLidom>div:first-child img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform .6s ease;
}

/* 默认底部信息层 */
.h1Flex {
    display: flex;
    justify-content: space-between;
    padding: 0 20px;
    height: 90px;
    align-items: center;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    background: linear-gradient(to top,
            rgba(0, 0, 0, 0.75),
            rgba(0, 0, 0, 0.35));
    z-index: 2;
    transition: all .45s ease;
}

/* 图标外层 */
.hexc {
    width: 90px;
    height: 90px;
    position: relative;
    flex-shrink: 0;
}

/* 默认红色图标块 */
.h1wid {
    width: 100%;
    height: 100%;
    position: absolute;
    top: -25px;
    left: 0;
    background-color: #C22622;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all .45s ease;
}

.h1wid img {
    width: 80%;
    display: block;
}

/* 标题 */
.ster {
    font-size: 28px;
    font-weight: 760;
    color: #ffffff;
    width: 70%;
    line-height: 1.25;
}

/* 数字 */
.shuzu {
    font-size: 51px;
    font-weight: 700;
    color: #ffffff;
    opacity: .9;
}

/* hover 详情层 */
.hexcPrx {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    padding: 40px;
    background: linear-gradient(135deg,
            rgba(194, 38, 34, 0.96),
            rgba(140, 18, 15, 0.96));

    opacity: 0;
    transform: translateY(25px);
    visibility: hidden;
    z-index: 3;

    transition: all .5s ease;
}

/* hover 层顶部标题 */
.sterFlex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* hover 状态下的图标块 */
.h1wid1 {
    position: static;
    background-color: #080608;
    top: auto;
}

/* 描述文字 */
.madeP>p {
    color: #ffffff;
    margin-top: 30px;
    font-size: 16px;
    line-height: 1.8;
    opacity: .9;
}

/* 鼠标移入效果 */
.whulLidom:hover>div:first-child img {
    transform: scale(1.08);
}

.whulLidom:hover .h1Flex {
    opacity: 0;
    transform: translateY(100%);
}

.whulLidom:hover .hexcPrx {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
}

/* hover 时内容轻微上浮 */
.whulLidom:hover .sterFlex {
    animation: fadeUp .55s ease forwards;
}

.whulLidom:hover .madeP {
    animation: fadeUp .65s ease forwards;
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(18px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}



.indexOd {
    width: 100%;
    padding: 110px 0;
    background-image: url(/img/index.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.indexOdjz {
    max-width: 1380px;
    width: 94%;
    margin: 0 auto;
}


.ction {
    margin-top: 50px;
}

.ctionUl {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(4, 1fr);

}

.HML {
    text-align: center;
    padding: 15px;
    color: #080608;
    font-weight: 600;
}


.ctionUlLidom {
    background-color: #ffffff;
}

.inboxFlexjz {
    display: flex;
    justify-content: center;
}

.indexOdjztop {
    margin-top: 110px;
}

.seill {
    color: #080608;
    font-size: 48px;
    font-weight: 700;
    text-align: center;
    margin-top: 20px;
}


.gleflex {
    display: grid;
    align-items: center;
    position: relative;
    margin-top: 50px;
    gap: 20px;
    grid-template-columns: repeat(3, 1fr);
}

.gleflex>div {
    text-align: center;
    background-color: #080608;
    color: #fff;
    padding: 15px 0;
    font-size: 28px;
    font-weight: 600;
}


.lifelx {
    display: flex;
    gap: 15px;
    align-items: center;
}


.both {
    padding: 40px 20px;
}

.bothflex {
    width: 48%;
}

.bothRight {
    width: 48%;
}

.both {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.trexc {
    color: #080608;
    font-size: 36px;
    font-weight: 700;
}

.IE5P {
    margin-top: 20px;
}

.high {
    display: grid;
    gap: 30px;
    margin-top: 30px;
    grid-template-columns: repeat(2, 1fr);
}

.lifelx i {
    color: #c22622;
    font-size: 21px;
}

.cuxlvBianTop {
    margin-top: 50px;
}

.bothxina {
    border-bottom: 1px solid #e5e4e4;
    border-right: 1px solid #e5e4e4;
    border-left: 1px solid #e5e4e4;
}





/* tab 每一项 */
.gleflex>div {
    position: relative;
    z-index: 2;
    padding: 14px 28px;
    font-size: 16px;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    transition: color 0.35s ease;
    white-space: nowrap;
}

/* 文字选中 */
.gleflex>div.active {
    color: #fff;
}




@keyframes tabFadeUp {
    from {
        opacity: 0;
        transform: translateY(18px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}



.black {
    width: 100%;
    padding-top: 110px;
    background-image: url(/img/black.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.blackJz {
    width: 1380px;
    width: 94%;
    margin: 0 auto;
    text-align: center;
    color: #fff;
}

.cuxlvBianFlex {
    display: flex;
    justify-content: center;
}

.ide {
    font-size: 48px;
    font-weight: 700;

}

.fuell {
    font-weight: 600;
    margin: 30px 0;
}

.wrappersad {
    -webkit-transition-timing-function: linear !important;
    -moz-transition-timing-function: linear !important;
    -o-transition-timing-function: linear !important;
    transition-timing-function: linear !important;
}

.swiper2 {
    margin-top: 50px;
}

.gkxc {
    width: 75px;
}

.gkxcFLex {
    display: flex;
    gap: 20px;
    align-items: center;
}


.andrc {
    font-size: 16px;
    font-weight: 600;
}

.cuxcv {
    font-size: 14px;
    font-weight: 300;
    margin-top: 20px;
}

.swiper1we {
    margin-top: 50px;
}

.swiper1we .swiper-slide {
    padding: 30px;
    height: auto;
    background-color: #f7f7f7;
    border: 1px solid #e4e4e4;
}

.tonxc {
    margin-top: 20px;
}

.swiperPE {
    position: relative;
}

.pagination1 {
    bottom: -35px !important;
}

.pagination1 .swiper-pagination-bullet-active {
    background-color: #c22622;
    width: 30px;
    border-radius: 15px;
}


.whys {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 50px;
}

.Hongma {
    font-size: 21px;
    font-weight: 600;
    color: #080608;
    margin-top: 20px;
}

.ertifwe {
    margin-top: 20px;
}

.time {
    color: #ffffff;
    width: 86px;
    height: 86px;
    background-color: #c22622;
    text-align: center;
    position: absolute;
    left: 15px;
    top: 0;
    font-size: 14px;
    font-weight: 500;

}

.roduwe {
    overflow: hidden;
}


.nian {
    font-size: 38px;
    font-weight: 500;

}

.boImg {
    position: relative;
} 
        .cusjz {
    max-width: 1380px;
    width: 94%;
    margin: 0 auto;
    margin-top: 110px;
    padding: 85px 60px;
    display: flex;
    position: relative;
    background-color: #ffffff;
    z-index: 11;
    justify-content: space-between;
    border-radius: 50px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}


.redshei {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 30px;
}

.redshei i {
    color: #bb2622;
    font-size: 21px;
}



.cusbiao {
    font-size: 48px;
    font-weight: 700;
    color: #080608;
}


.custitlle p {
    margin-top: 20px;
}

.cusjzLeft {
    width: 40%;
}


.cusInput {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(2, 1fr);
}

.cusjzRight {
    width: 55%;
}

.cusInput>div {
    height: 45px;
    border-bottom: 1px solid #eae9e9;
    position: relative;
}
.cusText{
    position: relative;
}

.cusjzRight>.cusInput {
    margin-bottom: 30px;
}

.cusText textarea{
    height: 215px ;
    border-bottom: 1px solid #eae9e9;

}







.yanz {
    display: flex;
    gap: 40px;
}

.post {
    text-align: center;
    line-height: 45px;
    width: 100px;
    background-color: #fff;
    height: 38px;
}

.code {
    width: 100px;
    background-color: #f0f0f0;
    height: 38px;
    border-radius: 5px;
}

.code input {
    width: 100%;
    height: 100%;
    background-color: #f0f0f0;
    padding-left: 12px;
}

.butww3 {
    cursor: pointer;
    font-size: 14px;
    padding: 0 26px;
    height: 38px;
    border-radius: 6px;
    background-color: #e50012;
    color: #fff;
    text-align: center;
    line-height: 38px;
    transition: all 0.3s ease;
}

.yanz_flex {
    display: flex;
    margin-top: 20px;
}


.butww3:hover {
    background-color: #c90010;
    transform: translateY(-2px);
}





.cusimg {
    width: 100%;
    background-image: url(/img/cusimg.png);
    padding: 140px 0 90px 0;
    margin-top: -108px;
    background-repeat: no-repeat;
    background-size: cover;
}


.cusimgJz {
    max-width: 1380px;
    width: 94%;
    margin: 0 auto;
    margin-top: 20px;
}

.cusimgFlex {
    display: flex;
    gap: 20px;
    color: #ffffff;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    font-weight: 700;
}


.divm {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #ffffff;
    position: relative;

}

.divm::after {
    width: 250px;
    height: 1px;
    background-color: rgba(255, 255, 255, .8);
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}


.divmLeft::after {
    left: auto;
    right: 0;
}


.icnzflexYuan {
    width: 35px;
    height: 35px;
    background-color: #ffffff;
    text-align: center;
    line-height: 35px;
    color: #bb2622;
}

.icnzflexFlex {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 33px;
}

.icnzflex {
    display: flex;
    gap: 20px;
    align-items: center;
    color: #ffffff;
}


.icnzflexwixc {
    width: 30%;
}

.c4sad {
    width: calc(100% - 50px );
}

.icnzflexYuanPid{
    padding: 5px ;
    border: 1px solid #f4d9d8;
} 
        .projz {
    max-width: 1380px;
    width: 94%;
    margin: 0 auto;
}

.ntegraInput {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    height: 52px;
    padding-left: 2px ;
    border: 1px solid #bdbdbd;
}



.ntegraLeft {
    width: 330px;
}

.ntegra {
    margin-top: 135px;
}


.ntegraInputIcon {
    width: 47px ;
    height: 47px ;
    background-color: #c22622;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ntegraInputIcon i{
    font-size: 21px ;
    color: #ffffff;
}

.ntegraInputInput {
    width: calc(100% - 60px);
    height: 100%;

}

.ntegraLi {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
    padding-left: 30px;
    position: relative;
    /* margin-left: 20px ; */
    border-bottom: 1px solid #bdbdbd;
}

.ntegraLi i {
    font-size: 14px;
    margin-right: 5px;
}

.ntegraLi::after {
    width: 5px;
    height: 5px;
    background-color: #e50012;
    position: absolute;
    left: 7px;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    content: '';
}

.ntegraTitle {
    font-size: 18px;
    font-weight: 800;
    color: #333333;
    margin-top: 20px;
    margin-bottom: 20px ;
}

.ntegraLiContent {
    height: 0;
    overflow: hidden;
    /* margin: 20px ; */
    transition: all 0.3s;
}

.uxzc>a:not(:last-child) {
    margin-bottom: 20px;
    display: block;
}

.uxzc {
    font-size: 14px;
    color: #333333;
    margin: 20px 20px 0 20px;
}

.ntegraRight {
    width: calc(100% - 370px);
}

.bolgLiUl2 {
    margin-top: 0;
}


.ntegra {
    display: flex;
    justify-content: space-between;
}


.bolgLiUl {
    display: grid;
    gap: 30px;
    grid-template-columns: repeat(3, 1fr);
}

.earing {
    margin-top: 20px;
}

.ierh {
    margin-top: 20px;
}

.Voaseall1w {
    margin-top: 20px;
}

.Voaseall {
    display: flex;
    align-items: center;
    font-weight: 500;
    color: #555555;
    gap: 20px;
}






.proailtail {
    max-width: 1380px;
    width: 94%;
    margin: 0 auto;
    position: relative;
}



.mySwiperBox {
    display: flex;
    justify-content: space-between;
}

.swiperBoxwe {
    width: 77%;
    overflow: hidden;
}

.mySwiper21qwe {
    width: 100%;
    height: 500px;
}

.mySwiper21qwe img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.mySwiper21qwe .swiper-slide {
    background-color: #fff;
    overflow: hidden;
}

.mySwiper1wexc {
    width: 15%;
    margin: 0 !important;
    height: 390px;
    box-sizing: border-box;
}

.mySwiper1wexc .swiper-slide {
    height: 80px;
    opacity: 0.4;
    cursor: pointer;
    overflow: hidden;
    transition: all .3s;
    background-color: #fff;
}

.mySwiper1wexc .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.mySwiper1wexc .swiper-slide-thumb-active {
    opacity: 1;
}


.ail {
    display: flex;
    width: 53%;
    gap: 20px;
}

.ailRight {
    width: 48%;
}

.proailtail {
    display: flex;
    justify-content: space-between;
}


.ruikxc {
    font-size: 42px;
    font-weight: 700;
    color: #4D4D4D;
    margin-bottom: 30px;
}

.swipernav {
    position: absolute;
    bottom: 26px;
    left: 60px;
}

.swiper-button-prev:after,
.swiper-button-next:after {
    display: none;
}



.buttonOsd i {
    font-size: 30px;
    color: #c22622;
}

.buttonOsd {
    width: 50px !important;
    height: 50px !important;
    border-radius: 50%;
    background-color: #ffffff;
}


.proailtailBox {
    padding: 110px 0;
    background-color: #f5f5f5;
}


.next1 i {
    transform: rotate(180deg);
}




.ullixzc>li {
    display: flex;
    gap: 15px;
    align-items: center;
}

.ullixzc {
    gap: 30px;
    margin-top: 50px;
    display: grid;
    font-weight: 500;
    color: #4F4D4D;
    grid-template-columns: repeat(2, 1fr);
}

.ullixzc i {
    font-size: 20px;
    color: #c22622;
}


  
.DescripFlex {
    display: flex;
    gap: 20px;
    /* border-bottom: 1px solid #a5a5a5; */
}

.DescripFlex>div {
    font-size: 18px;
    font-weight: 700;
    color: #383838;
    /* padding-bottom: 20px; */
    text-align: center;
    height: 45px ;
    line-height: 45px ;
    border: 1px solid #cccccc;
}

.DescripFlex {
   display: grid;
    gap: 30px;
    grid-template-columns: repeat(2 , 1fr);
    cursor: pointer;
}

.DescripFlex .tab {
    position: relative;
}

.DescripFlex .tab.active {
   background-color: #c22622;
   color: #ffffff;
    font-weight: 600;
}

/* .DescripFlex .tab.active::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 100%;
    height: 2px;
    background: #d90012;
} */

/* 内容区域 */
.tab-content {
    display: none;
}

.tab-content.active {
    display: block;
}




.fenye {
    margin-top: 20px;
}


.cusRight1 {
    padding: 40px;
    background-color: #f5f5f5;
    border-radius: 20px;
    margin-top: 110px;
}

.guex {
    font-size: 32px;
    font-weight: 700;
    color: #383838;
}

.naemLiUlsxc {
    margin-top: 30px;
    display: grid;
    gap: 15px;
}

.naemLi {
    display: flex;
    justify-content: space-between;
}

.tailw {
    margin-top: 15px;
}

.namex {
    width: 48%;
    height: 50px;
    background-color: #ffffff;
    border-radius: 5px;
    position: relative;
}

.CarlxcFlex {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.texcLi {
    width: 100%;
    height: 206px;
    background-color: #ffffff;
    position: relative;
}

.tcheLeft {
    width: 35%;
}

.Carlxc {
    font-weight: 500;
    width: 60%;
}


.Topul li {
    padding-left: 0;
    color: #383838;
}

.yanz_flex {
    justify-content: center;
}

.yanz {
    justify-content: center;
}


.TopulLidom li {
    padding-left: 25px;
    position: relative;
}

.TopulLidom li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    background-color: #333333;
    border-radius: 50%;
}


.Moeflextop {
    margin-top: 60px;
}

.Moeflex {
    padding-left: 3px;
}




.prev1{
    left: 0 !important;
} 
        ﻿.site-control,
.tab-radio {
    position: fixed;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

html {
    scroll-behavior: smooth;
}

.navwudLidom,
.suoxco,
.cuxlvBian,
.smegg,
.Voaseall,
.boLidom,
.bolgLi,
.ctionUlLidom,
.Topul li,
.StriFlexUl li,
.icnzflexYuanPid,
.redshei div,
.shejiao div,
.mail,
.mobileMenuBtn,
.searchClose {
    transition: transform .28s ease, color .24s ease, background-color .24s ease, border-color .24s ease, box-shadow .28s ease ;
}

.cuxlvBian:hover,
.cuxlvBian:focus-within,
.smegg:hover,
.suoxco:hover,
.mobileMenuBtn:hover {
    transform: translateY(-2px);
}

.cuxlv {
    display: block;
}

.navwudLidom:hover,
.navwudLidom:focus-within {
    color: #c22622;
}

.hasDrop:focus-within .dropMenu {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.hasDrop:hover .icon-down,
.hasDrop:focus-within .icon-down,
.ntegraItem[open] .DownI,
.Liflex[open] .jianxcv {
    transform: rotate(180deg);
}

.suoxco {
    cursor: pointer;
}

.mobileMenuBtn {
    display: none;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    border: 1px solid rgba(255, 255, 255, .45);
    cursor: pointer;
    z-index: 3;
}

.mobileMenuBtn span {
    width: 20px;
    height: 2px;
    background-color: #fff;
    transition: transform .28s ease, opacity .2s ease;
}

#nav-toggle:checked~.head .mobileMenuBtn span:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
}

#nav-toggle:checked~.head .mobileMenuBtn span:nth-child(2) {
    opacity: 0;
}

#nav-toggle:checked~.head .mobileMenuBtn span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
}

.mobileNavMask,
.searchMask {
    position: fixed;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .28s ease, visibility .28s ease;
}

.mobileNavMask {
    z-index: 1100;
    background: rgba(0, 0, 0, .46);
}

.searchMask {
    z-index: 1200;
    background: rgba(8, 6, 8, .62);
}

.searchPanel {
    position: fixed;
    left: 50%;
    top: 26%;
    z-index: 1201;
    width: min(720px, 92vw);
    padding: 44px;
    background-color: rgba(255, 255, 255, .96);
    box-shadow: 0 28px 80px rgba(0, 0, 0, .22);
    transform: translate(-50%, -28px) scale(.98);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: transform .32s ease, opacity .32s ease, visibility .32s ease;
}

#search-toggle:checked~.searchMask,
#search-toggle:checked~.searchPanel {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

#search-toggle:checked~.searchPanel {
    transform: translate(-50%, 0) scale(1);
}

.searchClose {
    position: absolute;
    right: 18px;
    top: 12px;
    font-size: 36px;
    line-height: 1;
    color: #080608;
    cursor: pointer;
}

.searchClose:hover {
    color: #c22622;
    transform: rotate(90deg);
}

.searchPanelTitle {
    color: #080608;
    font-size: 32px;
    font-weight: 800;
    margin-bottom: 22px;
}

.searchPanelBox {
    height: 58px;
    border: 1px solid #ddd;
    display: flex;
    align-items: center;
    padding-right: 18px;
    transition: border-color .24s ease, box-shadow .24s ease;
}


.searchPanelBox i {
    color: #c22622;
    font-size: 24px;
}

.productTabs {
    margin-top: 50px;
}

.productTabs .gleflex {
    margin-top: 0;
}

.gleflex>label {
    position: relative;
    z-index: 2;
    padding: 14px 28px;
    text-align: center;
    background-color: #080608;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    white-space: nowrap;
    transition: background-color .3s ease, color .3s ease, transform .28s ease;
}

.gleflex>label:hover {
    transform: translateY(-2px);
}

#series-three-phase:checked~.gleflex label[for="series-three-phase"],
#series-single-phase:checked~.gleflex label[for="series-single-phase"],
#series-brake:checked~.gleflex label[for="series-brake"] {
    background-color: #c22622;
    color: #fff;
}

.productTabs .bothxina .xiamc {
    display: none;
    opacity: 0;
    transform: translateY(18px);
}

#series-three-phase:checked~.bothxina .xiamc:nth-child(1),
#series-single-phase:checked~.bothxina .xiamc:nth-child(2),
#series-brake:checked~.bothxina .xiamc:nth-child(3) {
    display: block;
    animation: tabFadeUp .45s ease forwards;
}

.ntegraItem summary,
.Liflex summary {
    list-style: none;
    cursor: pointer;
}

.ntegraItem summary::-webkit-details-marker,
.Liflex summary::-webkit-details-marker {
    display: none;
}

.ntegraItem .DownI,
.Liflex .jianxcv {
    transition: transform .28s ease;
}

.ntegraItem .ntegraLiContent {
    height: 0;
    overflow: hidden;
    transition: height .3s ease;
}

.ntegraItem[open] .ntegraLiContent {
    height: auto;
    animation: detailDrop .3s ease;
}

.Liflex .fiPsd {
    height: 0;
    overflow: hidden;
    transition: height .3s ease;
}

.Liflex[open] .fiPsd {
    height: auto;
    animation: detailDrop .3s ease;
}

.Liflex[open] .LiflexDisp {
    background-color: #bb2622;
    color: #fff;
}

.Liflex[open] .jianxcv {
    color: #fff;
}

@keyframes detailDrop {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (hover: hover) and (pointer: fine) {

    .ctionUlLidom:hover,
    .StriFlexUl li:hover {
        transform: translateY(-6px);
        box-shadow: 0 18px 40px rgba(0, 0, 0, .1);
    }

    .ctionUlLidom:hover img,
    .bolgLi:hover img,
    .boLidom:hover img {
        transform: scale(1.045);
    }


}

@media (max-width: 1100px) {
    .headTopJz>div {
        gap: 22px;
    }

    .doah {
        gap: 36px;
    }
}

@media (max-width: 900px) {
    .mobileMenuBtn {
        display: flex;
    }

    .headBottomJz {
        align-items: center;
    }

    .doahFlex {
        position: fixed;
        top: 0;
        right: -330px;
        z-index: 1101;
        width: min(320px, 86vw);
        height: 100vh;
        padding: 118px 28px 34px;
        display: block;
        background-color: rgba(8, 6, 8, .96);
        box-shadow: -18px 0 48px rgba(0, 0, 0, .2);
        transition: right .32s ease;
    }

    #nav-toggle:checked~.mobileNavMask {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    #nav-toggle:checked~.head .doahFlex {
        right: 0;
    }

    .doah {
        display: grid;
        gap: 18px;
        align-items: start;
    }

    .navwudLidom {
        height: auto;
        min-height: 42px;
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .hasDrop {
        display: block;
    }

    .dropMenu {
        position: static;
        min-width: 100%;
        margin-top: 12px;
        opacity: 1;
        transform: none;
        visibility: visible;
        pointer-events: auto;
        background-color: rgba(255, 255, 255, .08);
        box-shadow: none;
        border-radius: 0;
    }

    .dropMenu a {
        color: #fff;
    }

    .doahFlex .xian {
        display: none;
    }

    .doahFlex .suoxco {
        display: flex;
        width: 42px;
        height: 42px;
        align-items: center;
        justify-content: center;
        margin-top: 24px;
        border: 1px solid rgba(255, 255, 255, .28);
    }

    .searchPanel {
        top: 18%;
        padding: 34px 22px;
    }

    .searchPanelTitle {
        font-size: 26px;
    }

    .gleflex {
        grid-template-columns: 1fr;
    }

    .both {
        display: grid;
        gap: 26px;
    }

    .bothflex,
    .bothRight {
        width: 100%;
    }
}

@media (max-width: 640px) {
    .searchPanelBox {
        height: 52px;
    }

    .gleflex>label {
        white-space: normal;
    }
}

/* Lightweight shared interactions */
.head.is-scrolled {
    box-shadow: 0 10px 30px rgba(8, 6, 8, .12);
}

.headBottom {
    transition: height .25s ease;
}



.backToTop {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 1000;
    width: 46px;
    height: 46px;
    border: 0;
    border-radius: 50%;
    background: #c22622;
    color: #fff;
    font-size: 23px;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(194, 38, 34, .3);
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: opacity .25s ease, visibility .25s ease, transform .25s ease, background-color .2s ease;
}

.backToTop.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.backToTop:hover {
    background: #080608;
    transform: translateY(-3px);
}

.backToTop:focus-visible {
    outline: 3px solid rgba(194, 38, 34, .35);
    outline-offset: 3px;
}

.reveal-item {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .55s ease, transform .55s ease;
}

.reveal-item.is-revealed {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}

/* ==================================================
   Site-wide title hover interactions
   Each component is intentionally written separately
   so it can be maintained without shared selectors.
   ================================================== */

/* Global navigation */
.navwudLidom {
    transition: color .24s ease, text-shadow .24s ease;
}

.navwudLidom:hover {
    color: #e63832;
    text-shadow: 0 0 16px rgba(230, 56, 50, .22);
}

/* Home: hero title */
.Elect {
    transition: color .24s ease, text-shadow .24s ease;
}

.Elect:hover {
    color: #e63832;
    text-shadow: 0 0 20px rgba(230, 56, 50, .25);
}

/* Home: section title */
.seill {
    transition: color .24s ease, text-shadow .24s ease, transform .24s ease;
}

.seill:hover {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

/* Home: production-process card title */
.ster {
    transition: color .24s ease, text-shadow .24s ease, transform .24s ease;
}

.StriFlexUl li:hover .ster {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

.StriFlexUl li:focus-within .ster {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

/* Home: product card title */
.HML {
    transition: color .24s ease, text-shadow .24s ease, transform .24s ease;
}

.ctionUlLidom:hover .HML {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

.ctionUlLidom:focus-within .HML {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

/* Home: product-series title */
.trexc {
    transition: color .24s ease, text-shadow .24s ease, transform .24s ease;
}

.both:hover .trexc {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

.both:focus-within .trexc {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

/* Home and related articles: article title */
.Hongma {
    transition: color .24s ease, text-shadow .24s ease, transform .24s ease;
}

.boLidom:hover .Hongma {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

.boLidom:focus-within .Hongma {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

/* About: page banner title */
.Howe {
    transition: color .24s ease, text-shadow .24s ease;
}

.Howe:hover {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
}

/* About: content title */
.abxtienx {
    transition: color .24s ease, text-shadow .24s ease, transform .24s ease;
}

.abxtienx:hover {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

/* Product list: sidebar title */
.ntegraTitle {
    transition: color .24s ease, text-shadow .24s ease;
}

.ntegraTitle:hover {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
}

/* Product list: category title */
.ntegraLi {
    transition: color .24s ease, background-color .24s ease;
}

.ntegraItem:hover .ntegraLi {
    color: #e63832;
    background-color: rgba(230, 56, 50, .06);
}

/* Product list: category child title */
.uxzc div {
    transition: color .24s ease, transform .24s ease;
}

.uxzc div:hover {
    color: #e63832;
    transform: translateX(4px);
}

/* Product list: product card title */
.earing {
    transition: color .24s ease, text-shadow .24s ease, transform .24s ease;
}

.bolgLi:hover .earing {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

.bolgLi:focus-within .earing {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

/* Product detail: main product title */
.ruikxc {
    transition: color .24s ease, text-shadow .24s ease, transform .24s ease;
}

.ruikxc:hover {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

/* Product detail: contact title */
.guex {
    transition: color .24s ease, text-shadow .24s ease;
}

.guex:hover {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
}

/* Product: FAQ title */
.LiflexDisp {
    transition: color .24s ease, background-color .24s ease;
}

.Liflex:hover .LiflexDisp {
    color: #ffffff;
    background-color: #e63832;
}

/* Blog list: article title */
.emjxc {
    transition: color .24s ease, text-shadow .24s ease, transform .24s ease;
}

.boLidom:hover .emjxc {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

.boLidom:focus-within .emjxc {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

/* Blog detail: main title */
.Cnswgk {
    transition: color .24s ease, text-shadow .24s ease;
}

.Cnswgk:hover {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
}

/* Blog detail: related-section title */
.boixc {
    transition: color .24s ease, text-shadow .24s ease;
}

.boixc:hover {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
}

/* Contact: main title */
.cusbiao {
    transition: color .24s ease, text-shadow .24s ease, transform .24s ease;
}

.cusbiao:hover {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
    transform: translateY(-2px);
}

/* Contact: information title */
.cusimgFlex {
    transition: color .24s ease, text-shadow .24s ease;
}

.cusimgFlex:hover {
    color: #e63832;
    text-shadow: 0 0 18px rgba(230, 56, 50, .22);
}

/* Footer: column title */
.quck1 {
    transition: color .24s ease, text-shadow .24s ease;
}

.quck1:hover {
    color: #e63832;
    text-shadow: 0 0 16px rgba(230, 56, 50, .22);
}

/* ==================================================
   Refined site-wide micro interactions
   Rules stay component-specific for easier maintenance.
   ================================================== */

/* Primary button depth and light sweep */
.cuxlvBian {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.cuxlvBian::before {
    position: absolute;
    top: 0;
    left: -130%;
    width: 70%;
    height: 100%;
    content: "";
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .34), transparent);
    transform: skewX(-20deg);
    transition: left .55s ease;
    pointer-events: none;
}

.cuxlvBian:hover::before {
    left: 150%;
}

.cuxlvBian:active {
    transform: translateY(0) scale(.98);
}

/* View-all button arrow response */
.Voaseall i {
    display: inline-block;
    transition: transform .24s ease;
}

.Voaseall:hover i {
    transform: translateX(5px);
}

.Voaseall:active i {
    transform: translateX(2px);
}

/* Home product card image */
.roduwe {
    overflow: hidden;
}

.roduwe img {
    transition: transform .5s cubic-bezier(.2, .7, .2, 1), filter .35s ease;
}

.ctionUlLidom:hover .roduwe img {
    transform: scale(1.055);
    filter: saturate(1.06) contrast(1.02);
}

/* Product-list card image */
.blogImg {
    overflow: hidden;
}

.blogImg img {
    transition: transform .5s cubic-bezier(.2, .7, .2, 1), filter .35s ease;
}

.bolgLi:hover .blogImg img {
    transform: scale(1.055);
    filter: saturate(1.06) contrast(1.02);
}

/* Blog-list card image */
.boImg {
    overflow: hidden;
}

.boImg img {
    transition: transform .5s cubic-bezier(.2, .7, .2, 1), filter .35s ease;
}

.boLidom:hover .boImg img {
    transform: scale(1.045);
    filter: saturate(1.08) contrast(1.03);
}

/* Navigation underline */
.navwudLidom {
    position: relative;
}

.hasDrop::after {
    position: absolute;
    right: 50%;
    bottom: 8px;
    left: 50%;
    height: 2px;
    content: "";
    background-color: #e63832;
    transition: right .24s ease, left .24s ease;
}

.hasDrop:hover::after {
    right: 0;
    left: 0;
}

/* Dropdown menu link */
.dropMenu a {
    transition: color .2s ease, background-color .2s ease, padding-left .2s ease;
}

.dropMenu a:hover {
    color: #e63832;
    background-color: rgba(230, 56, 50, .06);
    padding-left: 22px;
}

/* Breadcrumb item */
.main div {
    transition: color .2s ease, transform .2s ease;
}

.main div:hover {
    color: #e63832;
    transform: translateY(-1px);
}

/* Product tab */
.gleflex label {
    box-shadow: 0 0 0 rgba(194, 38, 34, 0);
}

.gleflex label:hover {
    box-shadow: 0 10px 24px rgba(194, 38, 34, .16);
}

/* Product category row */
.ntegraLi {
    position: relative;
}

.ntegraLi::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 3px;
    content: "";
    background-color: #e63832;
    transform: scaleY(0);
    transition: transform .24s ease;
}

.ntegraItem:hover .ntegraLi::before {
    transform: scaleY(1);
}

/* FAQ row */
.LiflexDisp {
    box-shadow: 0 0 0 rgba(8, 6, 8, 0);
}

.Liflex:hover .LiflexDisp {
    box-shadow: 0 10px 26px rgba(8, 6, 8, .12);
}

.Liflex:active .LiflexDisp {
    transform: scale(.995);
}

/* Contact text input */
.cusInput input {
    transition: border-color .24s ease, box-shadow .24s ease, transform .24s ease;
}

.cusInput input:hover {
    border-color: rgba(194, 38, 34, .5);
}



/* Contact message field */
.cusText textarea {
    transition: border-color .24s ease, box-shadow .24s ease, transform .24s ease;
}

.cusText textarea:hover {
    border-color: rgba(194, 38, 34, .5);
}


/* Contact information icon */
.icnzflexYuanPid {
    transition: transform .28s ease, box-shadow .28s ease, background-color .28s ease;
}

/* Contact social icon */
.redshei div {
    transition: transform .24s ease, color .24s ease, background-color .24s ease;
}

/* .redshei div:hover {
    color: #ffffff;
    background-color: #e63832;
    transform: translateY(-4px) rotate(4deg);
} */

/* Footer social icon */
.shejiao div {
    transition: transform .24s ease, color .24s ease, background-color .24s ease;
}

.shejiao div:hover {
    color: #ffffff;
    transform: translateY(-4px) rotate(4deg);
}

/* Footer regular link */
.qucick li div {
    transition: color .2s ease, transform .2s ease;
}

.qucick li div:hover {
    color: #e63832;
    transform: translateX(4px);
}

/* Search trigger */
.suoxco i {
    display: inline-block;
    transition: transform .25s ease, color .25s ease;
}

.suoxco:hover i {
    color: #e63832;
    transform: scale(1.12) rotate(-8deg);
}

/* Back-to-top press feedback */
.backToTop:active {
    transform: translateY(1px) scale(.94);
}

/* Accessible focus for links */
a:focus-visible {
    outline: 2px solid #e63832;
    outline-offset: 4px;
}

/* Touch devices should not retain hover movement */
@media (hover: none) {
    .reveal-item {
        transform: none;
    }
}

/* ==================================================
   Video play button interaction
   The centered outer button keeps its original transform.
   Animation is applied to the inner visual layer only.
   ================================================== */

.anniubof {
    overflow: visible;
    background-color: transparent;
    cursor: pointer;
    appearance: none;
    transition: border-color .25s ease, box-shadow .25s ease;
}

.anniubof::before {
    position: absolute;
    inset: 7px;
    content: "";
    border: 1px solid rgba(255, 255, 255, .7);
    pointer-events: none;
    animation: videoPlayPulse 2.2s ease-out infinite;
}

.anniubof::after {
    position: absolute;
    inset: -1px;
    content: "";
    border: 1px solid rgba(194, 38, 34, .28);
    opacity: 0;
    pointer-events: none;
    transition: inset .3s ease, opacity .3s ease;
}

.anniubof span {
    display: block;
    width: 75px;
    height: 75px;
    color: #ffffff;
    line-height: 75px;
    text-align: center;
    background-color: #c22622;
    box-shadow: 0 10px 28px rgba(194, 38, 34, .28);
    transition: transform .3s cubic-bezier(.2, .8, .2, 1), background-color .25s ease, box-shadow .25s ease;
}

.anniubof i {
    display: inline-block;
    transition: transform .3s cubic-bezier(.2, .8, .2, 1);
}

.anniubof:hover {
    border-color: rgba(255, 255, 255, .92);
    box-shadow: 0 0 0 8px rgba(194, 38, 34, .1);
}

.anniubof:hover::after {
    inset: -10px;
    opacity: 1;
}

.anniubof:hover span {
    background-color: #e63832;
    box-shadow: 0 14px 36px rgba(194, 38, 34, .4);
    transform: scale(1.08);
}

.anniubof:hover i {
    transform: translateX(3px) scale(1.06);
}

.anniubof:active span {
    transform: scale(.94);
}

.anniubof:active i {
    transform: translateX(1px) scale(.96);
}

.anniubof:focus-visible {
    border-color: #ffffff;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, .48), 0 0 0 9px rgba(194, 38, 34, .28);
    outline: none;
}

@keyframes videoPlayPulse {
    0% {
        opacity: .75;
        transform: scale(.9);
    }

    70% {
        opacity: 0;
        transform: scale(1.35);
    }

    100% {
        opacity: 0;
        transform: scale(1.35);
    }
}

@media (prefers-reduced-motion: reduce) {
    .anniubof::before {
        animation: none;
    }
}

/* ==================================================
   Swiper autoplay interaction feedback
   ================================================== */

.swiper {
    --swiper-theme-color: #c22622;
}

.swiper-slide {
    transition: filter .3s ease, opacity .3s ease;
}

.swiper.is-autoplay-paused {
    cursor: grab;
}

.swiper.is-autoplay-paused:active {
    cursor: grabbing;
}

.swiper-pagination-bullet {
    transition: width .25s ease, border-radius .25s ease, background-color .25s ease, opacity .25s ease;
}

.swiper-pagination-bullet-active {
    width: 22px;
    border-radius: 8px;
    background-color: #c22622;
}

.swiper-button-prev {
    transition: color .24s ease, background-color .24s ease, transform .24s ease;
}

.swiper-button-prev:hover {
    background-color: #c22622;
    transform: translateX(-3px);
}


.swiper-button-prev:hover i {
    color: #ffffff;
}


.swiper-button-next {
    transition: color .24s ease, background-color .24s ease, transform .24s ease;
}

.swiper-button-next:hover {
    color: #ffffff;
    background-color: #c22622;
    transform: translateX(3px);
}



.swiper-button-next:hover i {
    color: #ffffff;
} 
        @font-face {
font-display: swap;
    font-style: normal;
    font-weight: 400;
font-family: "ico"; 
src: 
url("/font/icomoon_pl.eot?#iefix") format("embedded-opentype"), 
url("/font/icomoon_pl.woff") format("woff"), 
url("/font/icomoon_pl.ttf") format("truetype"), 
url("/font/icomoon_pl.svg#$font") format("svg");
}
.revcommth{
    background-color: rgb(246, 246, 246);
    border-radius: 10px;
    padding:20px;
    color: #132b2c;
margin-top: 30px;
    font-size: 16px;
    margin-bottom: 30px;
}
.revcbg{
    font-size: 42px;
    font-weight: bold;
}
.review-title{
    width:100%;
    color: #000;
    font-size: 14px;
}
.aggrat-val{
    font-size:22px;
font-weight:700;
color:#B61717;
font-style:italic;
}
.aggrating-star-f{
width:160px;
    overflow: hidden;
}
.aggrat-full{
    float: left;
    font-family: ico;
    font-size: 24px;
    color: var(--MainColor);
    width: 30px;
    height: 30px;
}
.aggrat-full:before {
    content: '\e9d9';
}
.agrf-emp:before{
    content: '\e9d7';
}
.aggrat-hs-f{
    float:left;
width: 30px;
    height: 30px;
font-family: ico!important;
    font-size: 24px;
    color: var(--MainColor);
position: relative;
}
.aggrat-hs-emp{
    float: left;
    width: 30px;
    height: 30px;
}
.aggrat-hs-emp:before {
font-family: ico !important;
    content: '\e9d7';
}
.aggrat-hs-full{
    position:absolute;
    width: 13px;
    height: 30px;
overflow:hidden;
}
.aggrat-hs-full:before {
font-family: ico !important;
    content: '\e9d9';
}
.r0tip{
    color:#3E4751;
}
.r0t2{
font-size:12px;
}
.rev-sel-show-f2{
width:100%;
margin-top:15px;
}
.rev-sel-show-f{
width:122px;
    height:25px;
line-height:25px;
font-size:14px;
padding-left:10px;
    border:1px solid #AAAAAA;
position:relative;
background: linear-gradient(#fff,#E4E4E4);
cursor:pointer;
}
.rev-sel-show-f:before{
    content: '';
    position: absolute;
    width: 12px;
    height: 11px;
    right: 10px;
    top: 9px;
    background: url(/new/templates/Web/en/images/prodown.png);
background-size:100%;
background-repeat:no-repeat;
}
.rev-sel-show-f:hover{
    background: #E4E4E4;
}
.rev-sel-all{
    position:absolute;
top:25px;
left:0px;
width:120px;
height:25px;
line-height:25px;
font-size:1.4rem;
padding-left:10px;
    border:1px solid #AAAAAA;
display:none;
z-index:99;
}
.rev-sel-all:hover{
   background:#f8f8f8;
}
.review-f{
    width:100%;	
position:relative;
}
.review-t{
width:100%;
display:none;
}
.rev-s-top1{
    width:100%;
    margin-top:30px;	
    display: flex;
}
.re-readmore-f{
width:100%;
cursor:pointer;
}
.re-readmore-cover{
width:100%;
height:15px;
background: linear-gradient(rgba(255,255,255,0),rgba(255,255,255,1));
}
.re-readmore{
width:calc(100% - 40px);
background:#fff;
position:relative;
font-size:16px;
color:#B61717;
padding:10px 20px;	
}
.re-readmore:hover{
    color:#333;
}
.re-readmore:before{
    content: '';
    position: absolute;
    width: 12px;
    height: 11px;
left:0px;
    top: 15px;
    background: url(/new/templates/Web/en/images/prodown.png);
    background-size: 100%;
    background-repeat: no-repeat;
}
.rev-flag{
    width: 36px!important;
display:block!important;
}
.rev-name-c{
width:calc(100% - 51px);
margin-left:15px;
font-size:16px;
margin-top:9px;
color:#000;
}
.rev-s-top2{
width:100%;
margin-top:12px;
    display: flex;
}
.rev-star-f{
width:100px;
}
.rev-star-s {
    float: left;
    font-family: ico;
    font-size: 14px;
    color: var(--MainColor);
    width: 20px;
    height: 20px;
    position: relative;
}
.review-s-start-text{
width:100px;
font-size:14px;
color:#3E4751;
}
.rev-star-s:before {
    position: absolute;
    content: '\e9d9';
}
.rev-s-top3{
    float:left;
width:100%;
font-size:14px;
color:#3E4751;
margin-top:5px;
}
.review-s{
    width:100%;
    margin-top:20px;	
}
.rev-pass-tip{
    color:#383838;
font-style:italic;
}
.rev-content{
width:100%;
font-size:16px;
line-height:30px;
margin-top:20px;
color:#000;
}
.rev-send-f{
width:100%;
margin-top:40px;
}
.rev-send-txt{
width:100%;
font-size: 16px;
color: #000;
}
.rev-send-star-f{
width:100%;
margin-top:10px;
    overflow: hidden;
}
.rev-send-in-f{
width:100%;
margin-top:20px;
}
.r-s-in-s-f{
width:100%;
}
.r-s-in-s-f2{
width:49%;
margin-top:25px;
    overflow: hidden;
}
.r-s-i-s-txt{
width:100%;
font-size: 16px;
color: #000;
}
.r-s-i-s-txt2{
    float:left;
width:100%;
font-size: 16px;
margin-top:10px;
color: #000;
}
.r-s-i-s-cont{
width:100%;
margin-top:10px;
border:1px solid #DCDCDC;
border-radius:7px;
height:98px;
padding:10px 15px;
outline: none;
font-size: 15px;
    color: #414141;
}
.r-s-i-s-cont:focus{
    border:1px solid #E50012;
}
.r-s-i-s-input:focus{
    border:1px solid #E50012;
}
.res-inff{
display: flex;
}
.r-s-in-s-f2:last-child{
margin-left: 2%;
}
.r-s-i-s-input{
            float:left;
width:100%;
border:1px solid #DCDCDC;
border-radius:7px;
height:40px;
padding:10px 15px;
font-size: 15px;
    color: #414141;
    font-family: Arial,'Roboto',  sans-serif;
margin-top:15px;
}
.r-s-i-s-input:focus{
    border:1px solid #;
}
.r-s-i-s-tip-f{
    float:left;
position:relative;
display:none;
}
.r-s-i-s-tip-arrow{
    position:absolute;
top:14px;
}
/* .r-s-i-s-tip-arrow:before{
    content:'';
    float: left;
    width: 0; 
    height: 0;
    border-width: 8px;
    border-style: solid;
    border-color: transparent #DCDCDC transparent transparent;
}
.r-s-i-s-tip-arrow:after{
    content:'';
    position:absolute;
left:1px;
    width: 0; 
    height: 0;
    border-width: 8px;
    border-style: solid;
    border-color: transparent #fff transparent transparent;
} */
.r-s-i-s-tip{
    float:left;
margin-top:16px;
border:1px solid #DCDCDC;
border-radius:5px;
padding:10px 15px;
}
.r-s-i-s-tip-ico{
    float:left;
    width:25px;
    height:25px;
    position:relative;
    color:#;
font-size:25px;
}
.r-s-i-s-tip-ico:before{
    content:'\ea08';
position:absolute;
font-family: ico;
}
.r-s-i-s-tip-txt{
    float:left;
font-size: 16px;
margin-left:10px;
margin-top:4px;
color:#3E4751;
}
.r-s-but-f{
width:100%;
margin-top:30px;
}
.r-s-but{
width: 100%;
    height: 40px;
line-height: 40px;
border-radius: 20px;
color:#fff;
background:var(--MainColor);
font-size: 16px;
cursor:pointer;
text-align:center;
}
.r-s-but:hover{
    background:#;
}
.rev-send-star-s{
            float:left;
    font-family: ico;
    font-size: 24px;
    color: var(--MainColor);
    width: 30px;
    height: 30px;
    position: relative;
cursor:pointer;
}
.rev-send-star-s:hover{
    color:#132b2c;
}
.emptyheart:before {
    position: absolute;
    content: '\e9d7';
}
.heart:before {
    position: absolute;
    content: '\e9d9';
} 
        .ae-col{
    color: #4a4a4a;
    font-size: 15px;
    line-height: 24px;
    font-weigsht: 400;
}
.rd-p{
    margin:0px;
padding:0px;
}
.et-border{
    float:left;
width:100%;
}
.tp-border-in{
    float:left;
width:100%;
position:relative;
}
.et-rw-tp{
    float:left;
width:100%;
}
.et-rw-pic{
    float:left;
width:100%;
}
.et-pic-smofs{
float:left;
width:calc(100% + 10px);
margin-left:-10px;
}
.et-pic-sm-f{
float:left;
margin-left:10px;
}
.auto-ptl2{
width:calc(50% - 10px);	
}
.auto-ptl3{
width:calc(33.3% - 10px);	
}
.auto-ptl4{
width:calc(25% - 10px);	
}
.ae-tit{
    float:left;
width:100%;
    font-size:25px;
color:#231f20;
font-weight: 900;
display:block;
margin:0px;
padding: 0px;
line-height:35px;
}
.ae-tit-nf{
    font-size:25px;
color:#231f20;
font-weight: 900;
padding: 0px;
}
.ae-mtxt{
    float:left;
width:100%;
margin-top:20px;
}
.mt-nomt{
    margin-top:0px;
}
.ae-mtxt-nt{
    float:left;
width:100%;
}
.col-single h1,.col-single h2,.col-single h3{
display:block;
}
table {

        float:left;
border-spacing: 0px;
border-collapse:collapse;
word-wrap: break-word; 
}
.header-bk-cell td:first-child {
    background: #ecf1f7;
color:#333;
font-weight:bold;
}
.header-bk-cell tr:first-child td{
background: #dae2ed;
color:#333;
font-weight:bold;
}
.header-row-bk-cell tr:first-child td{
background: #dae2ed;
color:#333;
font-weight:bold;
}
.header-col-bk-cell td:first-child {
    background: #ecf1f7;
color:#333;
font-weight:bold;
}
.ae-col{
    float:left;
margin-top:12px;
position:relative;
width:100%;
}
.swiper-container td,th{
padding: 5px 10px;
display: table-cell;
    vertical-align: inherit;
    
    border-spacing: 0;
font-size:14px;
border:none;
min-height:25px;
border-left: 1px solid rgba(0,0,0,.08);
border-bottom: 1px solid rgba(0,0,0,.08);
}
.etr-title{
    float:left;
width:calc(100% - 20px);
}
.etr-title div{
    
}
.et-rw p{
margin:0px;
font-size:15px;
}
.et-rw{
    float:left;
width:100%;
}
.et-border{
    border:none!important;
}
.comb-sin{
    float:left;
height:100px;
border:1px solid #333;
}
.combpic-f{
float:left;
width:100%;
}
.cbp-mt{
    margin-top:25px;
}
.swiper-wrapper{
    float:left;
padding-top:0px;
padding-bottom:0px;
word-break:break-all;
}
.cs-txtbkmain {
    float: left;
    width: 100%;
    border-radius: 15px;
font-size:15px;
background:#f5f5f5
}
.tct-cb-t{
    float:left;
width:100%;
margin-top:0px;
}
.tcb-sin{
    margin-left:30px;
width:calc(100% - 30px);
position:relative;
margin-top:22px;
}
.tcb-sin:first-child{
    margin-top:0px;
}
.tct-h{
    margin-top:25px;
}
.tcb-sin:before{
    content:"";
position:absolute;
width:8px;
height:8px;
  background:#009639;
border-radius:50%;
left:-30px;
top:10px;
}
.et-rw-nomg{
    margin:0px;
}
.ae-col-nomtop{
    margin-top:0px;
}

.col-single{
    float:left;
width:100%;
position:relative;
}
.cs-w1{
    width:calc(100% - 5px);
}
.cs-w2{
    width:calc(50% - 5px);
}
.cs-w3{
    width:calc(100% - 7.5px);
}
.cs-w4{
    width:calc(33.3% - 6.6px);
}
.cs-w5{
    width:calc(66.85% - 5px);
}
.cs-w6{
    width:calc(33.15% - 5px);
}
.cs-w7{
    width:calc(25% - 7.5px);
}
.cs-w8{
    width:calc(100% - 6.6px);
}
.cs-fr{
    float:right;
}
.isf-50{
    width:calc(50% - 5px);
}
.cs-ml{
    margin-left:10px;
}
.cl-img-a-f{
    float:left;
width:100%;
}
.cs-abs-l{
    position:absolute;
height:100%;
width:calc(50% - 5px);
left:calc(50% + 10px);
}
.cs-abs-r{
    position:absolute;
height:100%;
width:calc(50% - 5px);
left:0;
}
.etrw-h100{
    height:100%;
}
.ettf-vc{
    float:none;
    width:100%; 
height:100%; 	
display:flex; 
justify-content:center; 
align-items:center;
}
.abs-c-t{
    float:left;
width:100%;
}
.ae-img{
    float:left;
width:100%;
}
.cs-txtbk1{
    position:absolute;
width:calc(50% - 5px);
min-height:100%;
left:calc(50% + 5px);
background:#f5f5f5;
}
.cs-tpbk-txt{
margin-left:calc(50% + 5px);
}
.cs-txtbk2{
    position:absolute;
height:100%;
background:#f5f5f5;
}
.cs-titpic{
    margin-top:25px;
}
.cs-m10{
    margin-top:10px;
}
.et-tsele{
    float:left;
width:100%;
}
.tsele-padding {
    float: left;
    width: calc(100% - 40px);
    margin: 20px;
}
.ett-sp1{
    width:calc(100% - 40px);
margin:10px 20px 10px 20px;
padding-top:10px;
}
.ett-sp2{
    padding-top:10px;
}
.ett-sp3{
    padding-bottom:10px;
}
.ett-sp4{
    padding:10px 0px 10px 0px;
}
.ae-title-t{
float: left;
background: none;
    width: 100%;
    font-size: 25px;
    color: #231f20;
border-radius: 0px;
position: relative;
}
.tittxtin{
    font-weight: 900;
line-height:35px;

}
.tittxtin div{
    position:relative;
width:fit-content;
    width:-webkit-fit-content;
    width:-moz-fit-content;
}
.ae-title-t h1,
.ae-title-t h2,
.ae-title-t h3,
.ae-title-t h4,
.ae-title-t h15,
.ae-title-t span.tittxtin
{
    margin:0px;
padding:0px;
font-size: 25px;
display:block;
}
.unline-sh{
position:absolute;
bottom:0px;
left:0px;
width:40px;
height:3px;
}
.btit-arrow{
position:absolute;
top:calc(50% - 6px);
left:-20px;
width:0;
    height:0;
    border-width:8px 0 8px 12px;
    border-style:solid;
}
.btit-round1{
position:absolute;
width:5px;
height:5px;
border-radius:50%;
top:calc(50% - 2.5px);
left:-20px;
}
.btit-round2{
    position:absolute;
width:5px;
height:5px;
background:'+bc+';
border-radius:50%;
top:calc(50% - 2.5px);
right:-20px;
}
.ae-cell-rw{
    padding-bottom:10px;
overflow-wrap:break-word;
}
.ae-cell-ssli{
    margin-top:1px;
float:left;
width:100%;
}
.cl-ae-swip{
    float:left;
width:100%;
}
.ae-table{
    width:100%;
float:left;
box-shadow: 0 0 10px rgba(217,217,217,.8);
border-radius:6px;
overflow:hidden;
}
.ae-swwper{
    margin:0;
padding-bottom:10px;
word-break:break-all;
overflow-wrap:break-word;
}
.pic-cell-ss{
    float:left;
width:100%;
}
.ae-td1{
    width:20%;
height:19px;
}
.ae-td2{
    width:80%;
height:19px;
}
.rd-p{
    margin: 0 0 10px;
}
.conde-show-f{
    float:left;
width:100%;
}
.cl-img-single-f{
    float:left;
width:100%;
}
.putbtn-f{
    float:left;
width:100%;
text-align:center;
}
.indep-btn-f{
    float:left;
width:100%;
text-align:center;
padding-top:15px;
padding-bottom:15px;
}
[jsi]{
    display: inline;
    text-decoration:none;
}
.jb-r-btn{
padding:14px 25px;
border-radius:25px;
color:#fff!important;
font-size:18px;
font-weight:700;
background-image: linear-gradient(to right, #61cc2d , #0F9D58);
text-align:center;
cursor:pointer;
}
.jb-r-btn:hover {
    box-shadow: 0 5px 0 0 #e1e1e1, 0 10px 0 0 #f7f7f7;
}
.bk-f-btn{
    padding:15px 15px;
color:#fff!important;
font-size:18px;
font-weight:700;
background:#000;
text-align:center;
cursor:pointer;
}
.bor-f-btn{
    padding:15px 15px;
color:#000!important;
font-size:18px;
font-weight:700;
border:1px solid #000;
text-align:center;
cursor:pointer;
}
.bk-r-btn{
    padding:14px 25px;
border-radius:25px;
color:#fff!important;
font-size:18px;
font-weight:700;
background:#0F9D58;
text-align:center;
cursor:pointer;
}
.ae-btn-ff{
    float:left;
width:100%;
}
.ptb-abs-l{
    float:left;
width: calc(50% - 5px);
}
.ptb-abs-r{
    float:right;
width: calc(50% - 5px);
margin-left:10px;
}
@media screen and (max-width: 1000px) {
.cs-txtbk1{
float:left;
position:relative!important;
min-height:auto!important;
left:auto!important;
margin-left:10px;
}
.cs-txtbk2{
float:left;
position:relative!important;
margin-left:10px!important;
}
.cs-tpbk-txt{
margin-left:0px!important;
}
}
@media screen and (max-width: 760px) {
    .bor-f-btn,.bk-f-btn {
        padding: 10px 10px;
        font-size: 14px;
    }
    .bk-r-btn,.jb-r-btn {
        padding: 10px 20px;
        border-radius: 22px;
        font-size: 14px;
    }
    .putbtn-f{
    margin-top:20px!important;
}
    .auto-ptl3,.auto-ptl4{
    width:100%;
margin-top:15px;
    }
    .txt-pic-th1{
    margin-top:20px;
    }
    .pic-cell-ss{
    width:850px!important;
margin-top:15px;
    }
.pic-cell-hbc{
   width:845px!important;
}
.col-single{
width:100%!important;
margin-left:0px!important;
margin-top:20px;
}
.cs-abs-l,.cs-abs-r{
    position:relative;
float:left;
width:100%!important;
height:auto;
left:0px!important;
margin-top:20px;
}
.cs-txtbk1,.cs-tpbk-txt{
margin-top:15px;
}
.ae-col{
    margin-top:20px;
}
} 
        ﻿@media (max-width: 1200px) {
    p {
        font-size: 15px;
        line-height: 1.7;
    }

    .headTopJz,
    .headBottomJz,
    .bannerJz,
    .about,
    .choss,
    .indexOdjz,
    .blackJz,
    .footJzx,
    .foot1Jz,
    .projz,
    .blogBox,
    .cusjz,
    .cusimgJz,
    .FirstJz,
    .boULjz,
    .mainDetjz,
    .aboutBnerbox {
        width: 92%;
    }

    .doah {
        gap: 34px;
        font-size: 15px;
    }

    .Elect {
        font-size: 48px;
        line-height: 1.08;
    }

    .toYou,
    .usted li {
        font-size: 22px;
    }

    .abxtienx,
    .uxkcf,
    .seill,
    .ide,
    .Powerwe,
    .Experts,
    .cusbiao,
    .Howe {
        font-size: 40px;
        line-height: 1.18;
    }

    .data-num {
        font-size: 40px;
    }

    .ctionUl {
        grid-template-columns: repeat(3, 1fr);
    }

    .whul,
    .whys,
    .StriFlexUl,
    .bolgLiUl {
        gap: 20px;
    }

    .ster {
        font-size: 22px;
    }

    .shuzu {
        font-size: 42px;
    }

    .blogBoxRight,
    .ntegraLeft {
        width: 300px;
    }

    .blogBoxLeft {
        width: calc(100% - 330px);
    }

    .ntegraRight {
        width: calc(100% - 330px);
    }

    .footRight {
        width: 440px;
    }
}

@media (max-width: 900px) {
    .head {
        display: none;
    }

    body {
        overflow-x: hidden;
    }

    p {
        font-size: 14px;
        line-height: 1.65;
    }

    .bannerJz {
        top: 54%;
    }

    .Elect {
        font-size: 34px;
        line-height: 1.12;
    }
    .productTabs {
        margin-top: 25px;
    }
    .toYou {
        margin-top: 18px;
        font-size: 18px;
    }

    .indexOdjztops1ew{
        margin-top: 80px !important ;
    }
    .usted li {
        margin: 12px 0;
        font-size: 15px;
        line-height: 1.45;
        gap: 10px;
    }

    .cuxlv {
        padding: 5px 18px;
        font-size: 14px;
    }

    .abxtienx,
    .uxkcf,
    .seill,
    .ide,
    .Powerwe,
    .Experts,
    .cusbiao,
    .Howe,
    .Cnswgk {
        font-size: 30px;
        line-height: 1.2;
    }

    .yuanflex {
        font-size: 13px;
        padding: 7px 12px;
    }

    .data-section {
        height: auto;
        /* flex-wrap: wrap; */
      display: grid;
      grid-template-columns: repeat(2 , 1fr);
    }

    .data-item {
        flex: 0 0 50%;
        height: 112px;
    }
    .ntegraLeft{
        display: none;
    }
    .data-item::before {
        left: 0;
        right: 0;
        transform: none;
    }

    .data-num {
        font-size: 32px;
    }

    .data-text {
        font-size: 13px;
    }

    .about,
    .choss,
    .indexOdjz,
    .First,
    .boULjz,
    .blogBox,
    .cusjz {
        margin-top: 70px;
    }
    .blogBox1qwe{
        margin-bottom: 60px ;
    }
    .indexOd,
    .black,
    .First {
        padding: 70px 0;
    }

    .about,
    .aboutRight,
    .chossflex,
    .both,
    .footJzx,
    .footlogosdBox,
    .flexdf,
    .ntegra,
    .icnzflexFlex,
    .boLidom,
    .cusjz,
    .KSdLEdtFlex {
        display: block;
    }

    .aboutLeft,
    .aboutRight,
    .bothflex,
    .bothRight,
    .footleft,
    .footRight,
    .footlogoBox,
    .qucick,
    .ntegraLeft,
    .ntegraRight,
    .blogBoxLeft,
    .blogBoxRight,
    .cusjzLeft,
    .cusjzRight,
    .boImg,
    .Canexc,
    .KSdLEdt,
    .icnzflexwixc {
        width: 100%;
    }

    .aboutRight,
    .bothRight,
    .footRight,
    .blogBoxRight,
    .cusjzRight,
    .ntegraRight,
    .boLidom>.Canexc {
        margin-top: 28px;
    }

    .imgBox,
    .sideTag {
        display: none;
    }

    .aboutRightRight,
    .aboutRight1 {
        width: 100%;
    }

    .whul,
    .whys,
    .StriFlexUl,
    .bolgLiUl,
    .high {
        grid-template-columns: 1fr;
    }

    .ctionUl {
        grid-template-columns: repeat(2, 1fr);
    }

    .chossflex>.cuxlvBian,
    .chossflex>div+.cuxlvBian {
        margin-top: 22px;
    }

    .hexcPrx {
        padding: 24px;
    }

    .hexc,
    .h1wid {
        width: 70px;
        height: 70px;
    }

    .ster {
        font-size: 20px;
    }

    .shuzu {
        font-size: 34px;
    }

    .gleflex {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .both {
        padding: 26px 16px;
    }

    .trexc {
        font-size: 26px;
    }

    .swiper1we .swiper-slide {
        padding: 22px;
    }

    .foot {
        margin-top: 70px;
        padding: 54px 0;
    }
    .mainDet{
        margin-top: 60px ;
    }
    .footRightxunp {
        position: static;
        padding: 34px 18px;
        margin-top: 30px;
    }

    .foot1 {
        padding-top: 70px;
    }

    .footlogosdBox,
    .qucick {
        display: grid;
        gap: 30px;
    }

    .qucick {
        grid-template-columns: 1fr 1fr;
    }

    .xmlflex {
        display: grid;
        gap: 8px;
        justify-content: start;
        font-size: 12px;
    }

    .projz,
    .blogBox {
        margin-top: 70px;
    }

    .ntegra {
        margin-top: 70px;
    }

    .blogBox {
        display: block;
    }
    .blogBoxRight{
        display: none;
    }
    .boLidom {
        padding-bottom: 30px;
    }
    .boLidom>a{
        flex-direction: column;
    }
    .Canexc{
        margin-top: 20px ;
    }
    .seachBox,
    .ntegraInput {
        height: 48px;
    }

    .cusjz {
        padding: 46px 24px;
        border-radius: 24px;
    }

    .cusInput {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .yanz,
    .icnzflexFlex {
        gap: 18px;
        flex-wrap: wrap;
    }

    .cusimg {
        margin-top: -40px;
        padding: 110px 0 70px;
    }

    .icnzflexFlex {
        display: grid;
        align-items: start;
        gap: 20px;
    }

    .divm::after {
        width: 90px;
    }

    .aboutBnerbox {
        align-items: end;
        padding-bottom: 54px;
    }

    .swiperzhsu .swiper-slide-active {
        transform: none !important;
    }
}

@media (max-width: 640px) {
    p {
        font-size: 13px;
    }

    .banner>div:first-child img,
    .aboutBner>img {
        height: 420px;
    }

    .Elect {
        font-size: 28px;
    }

    .abxtienx,
    .uxkcf,
    .seill,
    .ide,
    .Powerwe,
    .Experts,
    .cusbiao,
    .Howe,
    .Cnswgk {
        font-size: 25px;
    }

    .toYou,
    .trexc {
        font-size: 20px;
    }

    .data-item {
        flex-basis: 100%;
        height: 96px;
        justify-content: flex-start;
        padding-left: 28px;
    }

    .data-content {
        text-align: left;
    }

    .ctionUl,
    .whys,
    .qucick,
    .StriFlexUl,
    .cusInput,
    .high {
        grid-template-columns: 1fr;
    }

    .HML,
    .Hongma,
    .earing,
    .emjxc,
    .LiflexDisp {
        font-size: 16px;
    }

    .cove p,
    .IE5P,
    .ertifwe,
    .pop,
    .ierh {
        margin-top: 14px;
    }

    .hexcPrx {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        padding: 20px;
    }

    .h1Flex {
        display: none;
    }

    .whulLidom>div:first-child {
        height: 220px;
    }

    .madeP>p {
        margin-top: 16px;
        line-height: 1.6;
    }

    .naintextarea,
    .essawe textarea,
    .cusText textarea {
        height: 120px;
    }

    .cusimgFlex {
        font-size: 18px;
    }

    .divm::after {
        width: 46px;
    }

    .time {
        width: 68px;
        height: 68px;
        font-size: 12px;
    }

    .nian {
        font-size: 28px;
    }
}

@media (max-width: 420px) {

    .bannerJz,
    .about,
    .choss,
    .indexOdjz,
    .blackJz,
    .footJzx,
    .foot1Jz,
    .projz,
    .blogBox,
    .cusjz,
    .cusimgJz,
    .FirstJz,
    .boULjz,
    .mainDetjz,
    .aboutBnerbox {
        width: 90%;
    }

    .Elect {
        font-size: 25px;
    }

    .usted li {
        font-size: 13px;
    }

    .abxtienx,
    .uxkcf,
    .seill,
    .ide,
    .Powerwe,
    .Experts,
    .cusbiao,
    .Howe,
    .Cnswgk {
        font-size: 22px;
    }

    .cuxlv {
        padding: 5px 14px;
        font-size: 13px;
    }

    .cusjz {
        padding: 34px 18px;
    }
}

.section-gap-tight {
    margin-top: 52px;
}

@media (max-width: 768px) {

    .bannerJz,
    .about,
    .choss,
    .indexOdjz,
    .blackJz,
    .footJzx,
    .foot1Jz,
    .projz,
    .blogBox,
    .cusjz,
    .cusimgJz,
    .FirstJz,
    .boULjz,
    .mainDetjz,
    .aboutBnerbox {
        width: 91%;
    }


    .bannerJz {
        top: 51%;
    }

    .Elect {
        font-size: 30px;
        line-height: 1.08;
    }

    .toYou {
        margin-top: 14px;
        font-size: 16px;
    }

    .usted {
        margin-top: 14px;
    }

    .usted li {
        margin: 8px 0;
        font-size: 14px;
    }

    .about,
    .choss,
    .indexOdjz,
    .indexOdjztop,
    .First,
    .boULjz,
    .blogBox,
    .cusjz,
    .projz,
    .ntegra {
        margin-top: 52px;
    }

    .indexOd,
    .black,
    .First {
        padding: 56px 0;
    }

    .ction,
    .whul,
    .whys,
    .swiper1we,
    .swiper2,
    .swiperSdBox1we,
    .swiperzhsu,
    .liewe,
    .boUl1,
    .footlogosdBox {
        margin-top: 30px;
    }

    .abxtienx,
    .uxkcf,
    .seill,
    .ide,
    .Powerwe,
    .Experts,
    .cusbiao,
    .Howe,
    .Cnswgk,
    .boixc {
        font-size: 27px;
        line-height: 1.18;
        margin-top: 14px;
    }

    .aboutRightRight img,
    .aboutRight1 img {
        height: 280px;
        object-fit: cover;
    }

    .ctionUl,
    .whul,
    .whys,
    .StriFlexUl,
    .bolgLiUl,
    .blogBoxLeftMain>ul,
    .liewe ul {
        gap: 16px;
    }

    .ctionUlLidom,
    .bolgLi,
    .StriFlexUl li,
    .swiper1we .swiper-slide,
    .set,
    .blogBoxLeftMainBox {
        border-radius: 10px;
    }

    .HML {
        padding: 12px 10px;
        font-size: 14px;
        line-height: 1.35;
    }

    .both {
        padding: 22px 14px;
    }

    .trexc {
        font-size: 22px;
    }

    .high {
        gap: 14px;
        margin-top: 20px;
    }

    .lifelx {
        align-items: flex-start;
        gap: 10px;
        font-size: 14px;
        line-height: 1.45;
    }

    .gkxc {
        width: 56px;
    }

    .andrc,
    .cuxcv {
        margin-top: 6px;
    }



    .boLidom:not(:last-child) {
        padding-bottom: 24px;
    }

    .emjxc,
    .earing,
    .Hongma,
    .LiflexDisp {
        font-size: 18px;
        line-height: 1.35;
    }

    .LiflexDisp {
        padding: 14px 18px;
    }

    .fiPsd p {
        padding: 14px 18px;
    }

    .foot {
        margin-top: 52px;
        padding: 46px 0;
    }

    .footRightxunp {
        padding: 28px 16px;
    }

    .nainsdiv,
    .holdeBox {
        gap: 18px;
        margin-top: 20px;
    }

    .foot1 {
        padding-top: 52px;
    }

    .mailflex,
    .icnzflex {
        gap: 14px;
        font-size: 14px;
    }

    .cusjz {
        padding: 36px 20px;
        border-radius: 18px;
    }

    .custitlle p {
        margin-top: 14px;
    }

    .redshei {
        margin-top: 22px;
    }

    .cusimg {
        padding: 92px 0 52px;
    }

    .icnzflexFlex {
        margin-top: 24px;
    }
}

@media (max-width: 520px) {

    .bannerJz,
    .about,
    .choss,
    .indexOdjz,
    .blackJz,
    .footJzx,
    .foot1Jz,
    .projz,
    .blogBox,
    .cusjz,
    .cusimgJz,
    .FirstJz,
    .boULjz,
    .mainDetjz,
    .aboutBnerbox {
        width: 92%;
    }


    .Elect {
        font-size: 24px;
        line-height: 1.12;
    }

    .toYou,
    .usted li {
        font-size: 13px;
    }

    .usted li::after {
        top: 9px;
        transform: none;
    }

    .abxtienx,
    .uxkcf,
    .seill,
    .ide,
    .Powerwe,
    .Experts,
    .cusbiao,
    .Howe,
    .Cnswgk,
    .boixc {
        font-size: 23px;
    }



    .data-item {
        height: 88px;
        padding-left: 22px;
    }

    .data-num {
        font-size: 28px;
    }

    .data-text {
        margin-top: 5px;
        font-size: 12px;
    }

    .whulLidom>div:first-child {
        height: 190px;
    }

    .hexcPrx {
        padding: 16px;
    }

    .sterFlex {
        gap: 14px;
    }

    .ster {
        font-size: 17px;
    }

    .shuzu {
        font-size: 28px;
    }

    .hexc,
    .h1wid {
        width: 54px;
        height: 54px;
    }

    .bothxina {
        border: 1px solid #e5e4e4;
    }

    .gleflex>label {
        padding: 12px 14px;
        font-size: 14px;
    }

    .LiflexDisp {
        gap: 18px;
        padding: 12px 14px;
    }

    .footlogo {
        width: 174px;
    }

    .qucick>li>div:nth-child(1) {
        margin-bottom: 20px;
    }

    .yanz {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .yanz .cuxlvBian {
        grid-column: 1 / -1;
    }

    .post,
    .code {
        width: 100%;
    }
}

@media (max-width: 420px) {
    .Elect {
        font-size: 22px;
    }

    .abxtienx,
    .uxkcf,
    .seill,
    .ide,
    .Powerwe,
    .Experts,
    .cusbiao,
    .Howe,
    .Cnswgk,
    .boixc {
        font-size: 21px;
    }

    .about,
    .choss,
    .indexOdjz,
    .indexOdjztop,
    .First,
    .boULjz,
    .blogBox,
    .cusjz,
    .projz,
    .ntegra {
        margin-top: 44px;
    }
}

@media (max-width: 768px) {
    .aboutRightRight img {
        height: 280px;
        object-fit: cover;
    }

    .responsive-test-anchor-about-media {
        display: none;
    }
}

/* Product grids responsive */
@media (max-width: 900px) {
    .bolgLiUl2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .bolgLiUl2 .bolgLi,
    .bolgLiUl2 article,
    .bolgLiUl2 a {
        min-width: 0;
    }

    .bolgLiUl2 .blogImg img {
        height: 180px;
        object-fit: cover;
    }

    .bolgLiUl2 .earing {
        margin-top: 14px;
        font-size: 17px;
        line-height: 1.34;
    }
}

@media (max-width: 640px) {
    .ctionUl {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .ctionUlLidom {
        min-width: 0;
    }

    .ctionUlLidom .roduwe img {
        height: 132px;
        object-fit: cover;
    }

    .HML {
        padding: 10px 8px;
        font-size: 13px;
        line-height: 1.3;
    }
}

/* Product detail responsive */
@media (max-width: 1200px) {
    .proailtail {
        width: 92%;
    }

    .proailtailBox {
        padding: 90px 0;
    }

    .mySwiper21qwe {
        height: 430px;
    }

    .ruikxc {
        font-size: 36px;
        margin-bottom: 22px;
        line-height: 1.16;
    }

    .ullixzc {
        gap: 20px;
        margin-top: 36px;
    }
}

@media (max-width: 900px) {

    .xmlflex>a {
        display: none;
    }
    .cuxlvBian{
        margin-top: 20px ;
    }
    .data-num .num{
        font-size: 26px ;
    }

    .foot1{
        margin-bottom: 67px;
    }

    .proailtail {
        display: block;
        width: 92%;
    }

    .qucick {
        display: none;
    }

    .ail,
    .ailRight {
        width: 100%;
    }

    .ailRight {
        margin-top: 30px;
    }

    .proailtailBox {
        padding: 70px 0;
    }

    .mySwiper21qwe {
        height: 400px;
    }

    .mySwiper1wexc {
        width: 100%;
        height: auto;
    }
    

    .swipernav {
        bottom: 20px;
        left: 52px;
    }

    .ruikxc {
        font-size: 30px;
    }
    .foot1Jz {
        padding-bottom: 20px;
    }

    .DescripFlex {
        gap: 18px;
    }

    .cusRight1 {
        margin-top: 64px;
        padding: 32px 24px;
        border-radius: 16px;
    }

    .guex {
        font-size: 28px;
    }

    .swipernav{
        display: none !important;
    }
    .proailtail .ail{
        flex-direction: column-reverse;
    }

    .blogBoxLeftMainBox{
        padding: 0 ;
        box-shadow: none;
    }
}

@media (max-width: 768px) {
    .proailtail {
        width: 91%;
    }

    .mySwiper21qwe {
        height: 360px;
    }

    .swiperBoxwe {
        width: 76%;
    }


    .buttonOsd {
        width: 42px !important;
        height: 42px !important;
    }

    .buttonOsd i {
        font-size: 24px;
    }

    .ruikxc {
        font-size: 27px;
    }

    .ullixzc {
        gap: 14px;
        margin-top: 26px;
    }

    .DescripFlex>div {
        height: 42px;
        line-height: 42px;
        font-size: 16px;
    }

    .fenye {
        margin-top: 16px;
    }
}

@media (max-width: 640px) {
    .proailtailBox {
        padding: 58px 0;
    }

    .ail {
        gap: 12px;
    }

    .mySwiper21qwe {
        height: 320px;
    }

    .ullixzc {
        grid-template-columns: 1fr;
        gap: 12px;
        margin-top: 22px;
    }

    .DescripFlex {
        gap: 12px;
    }

    .naemLi {
        display: grid;
        gap: 12px;
        grid-template-columns: repeat(1 , 1fr);
    }

    .namex {
        width: 100%;
    }

    .texcLi {
        height: 160px;
    }
}

@media (max-width: 520px) {
 

    .swiperBoxwe {
        width: 100%;
    }

    .mySwiper1wexc {
        display: none;
    }

    .mySwiper21qwe {
        height: 280px;
    }

    .swipernav {
        position: static;
        display: flex;
        justify-content: center;
        gap: 12px;
        margin-top: 14px;
    }

    .swipernav .buttonOsd {
        position: static !important;
        margin: 0 !important;
    }

    .ailRight {
        margin-top: 24px;
    }

    .ruikxc {
        font-size: 24px;
        margin-bottom: 16px;
    }

    .cusRight1 {
        margin-top: 44px;
        padding: 26px 18px;
    }
}

@media (max-width: 420px) {
    .proailtailBox {
        padding: 46px 0;
    }

    .mySwiper21qwe {
        height: 220px;
    }

    .ruikxc,
    .guex {
        font-size: 22px;
    }

    .ullixzc {
        font-size: 13px;
    }

    .DescripFlex {
        gap: 8px;
    }

    .DescripFlex>div {
        height: 38px;
        line-height: 38px;
        font-size: 14px;
    }

    .cusRight1 {
        padding: 22px 14px;
    }
}

/* Product detail refinement */
.proailtail {
    align-items: center;
    gap: clamp(32px, 5vw, 76px);
}

.proailtail .ail,
.proailtail .ailRight {
    min-width: 0;
}

.proailtail .ail {
    position: relative;
    flex: 1 1 54%;
    width: auto;
}

.proailtail .ailRight {
    flex: 1 1 46%;
    width: auto;
}

.mySwiper21qwe,
.mySwiper21qwe .swiper-slide {
    border-radius: 14px;
}

.mySwiper21qwe .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(16px, 2.5vw, 32px);
}

.mySwiper1wexc .swiper-slide {
    border: 1px solid transparent;
    border-radius: 8px;
}

.mySwiper1wexc .swiper-slide-thumb-active {
    border-color: #c22622;
}

.ruikxc {
    overflow-wrap: anywhere;
}


.ullixzc>li>div:first-child {
    flex: 0 0 auto;
    padding-top: 2px;
}

.cuxlvBianTOp {
    margin-top: clamp(28px, 4vw, 48px);
}

.ntegraRight,
.cusRight1,
.naemLi,
.namex,
.texcLi {
    min-width: 0;
}

.DescripFlex .tab {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
}

.fenye {
    min-height: 80px;
    line-height: 1.75;
}

.namex input,
.texcLi textarea,
.code input {
    width: 100%;
    height: 100%;
}

@media (max-width: 1200px) {
    .proailtail {
        gap: 36px;
    }

    .proailtail .ail {
        flex-basis: 55%;
    }

    .proailtail .ailRight {
        flex-basis: 45%;
    }
}

@media (max-width: 900px) {
    .proailtail {
        max-width: 760px;
    }

    .proailtail .ailRight {
        margin-top: 36px;
    }

    .ruikxc {
        margin-bottom: 18px;
    }

    .ullixzc {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ntegraRight {
        margin-top: 36px;
    }

    .cusRight1 {
        margin-top: 52px;
    }
}

@media (max-width: 640px) {
    .proailtailBox {
        padding: 46px 0 52px;
    }

    .proailtail {
        width: calc(100% - 32px);
    }

    .mySwiper21qwe {
        height: clamp(260px, 70vw, 340px);
    }

    .mySwiper21qwe .swiper-slide {
        padding: 16px;
    }

    .proailtail .ailRight {
        margin-top: 28px;
    }

    .ruikxc {
        font-size: clamp(22px, 6vw, 27px);
        line-height: 1.2;
    }

    .ullixzc {
        grid-template-columns: 1fr;
    }

    .cuxlvBianTOp {
        margin-top: 28px;
    }

    .DescripFlex {
        gap: 8px;
    }

    .DescripFlex .tab {
        min-width: 0;
        padding: 0 10px;
    }

    .cusRight1 {
        margin-top: 40px;
    }

    .naemLiUlsxc {
        margin-top: 22px;
    }

    .namex {
        height: 46px;
    }
}

@media (max-width: 520px) {
    .mySwiper21qwe {
        height: clamp(220px, 72vw, 300px);
    }

    .swipernav {
        align-items: center;
        min-height: 42px;
    }

    .swipernav .buttonOsd {
        flex: 0 0 42px;
        width: 42px !important;
        height: 42px !important;
    }

    .ullixzc>li {
        gap: 10px;
    }

    .DescripFlex>div {
        height: 42px;
        line-height: 1.2;
    }

    .fenye {
        min-height: 64px;
    }

    .cusRight1 {
        padding: 24px 16px;
        border-radius: 14px;
    }

    .guex {
        line-height: 1.2;
    }

    .texcLi {
        height: 140px;
    }
}

@media (max-width: 380px) {
    .proailtail {
        width: calc(100% - 24px);
    }

    .mySwiper21qwe {
        height: 210px;
    }

    .DescripFlex {
        grid-template-columns: 1fr;
    }

    .DescripFlex>div {
        height: 40px;
    }

    .cusRight1 {
        padding: 20px 12px;
    }
} 
      