@keyframes skeleton-loading {
    0% {
        background-color: #c1cfd6
    }

    100% {
        background-color: #eff3f4
    }
}

@media (max-width:1500px) {
    .container1 {
        padding-left: 5%
    }

    .container2 {
        padding-right: 5%
    }

    .top {
        padding-left: 40px
    }

    .nav .nLi h3 a {
        margin: 0 15px
    }

    .nav .nLi .sub {
        left: 15px
    }

    .industries_box_r {
        width: calc(100% - 650px)
    }
}

@media (max-width:1300px) {
    .nav .nLi h3 a {
        margin: 0 10px
    }

    .nav .nLi .sub {
        left: 10px
    }

    .nav .lx a {
        width: 150px
    }

    .top .logo img {
        height: 50px
    }

    .in_box21 {
        padding-top: 15%
    }

    .in_box21 h2 {
        font-size: 45px;
        line-height: 45px
    }

    .store_box21 li {
        height: 350px
    }

    .in_box ul li {
        margin-top: 30px
    }

    .product_banner .img {
        height: 500px
    }

    .in_box1_b {
        top: -135px
    }
}

@media all and (max-width:1200px) {
    body {
        min-width: auto
    }

    .container,
    .container1 {
        width: 100%;
        box-sizing: border-box;
        padding: 0 40px
    }

    #wapDocCookie .left,
    #wapDocCookie .right {
        width: 100%;
        margin-bottom: 15px;
        text-align: center
    }

    #wapDocCookie .right a {
        display: inline-block;
        padding: 10px 20px
    }

    .di .di_l p {
        position: static !important
    }

    .industries1_box11,
    .store_box1,
    .store_box1 .swiper-slide {
        height: auto
    }

    .industries1_box11 h2,
    .industries1_box11 p {
        width: 100%
    }

    .industries1_box11 .img {
        height: auto;
        position: static;
        margin-top: 15px;
        width: auto
    }

    .industries1_box12 {
        padding: 40px 0
    }

    .quality_box6 .container h3 {
        display: block;
        width: 100%
    }

    .quality_box6 .container h3 .text {
        width: 100%;
        margin-bottom: 20px
    }

    .store_box1_qh .swiper-button-next {
        left: auto;
        right: 70px
    }

    .store_box1_qh .swiper-button-prev {
        left: auto;
        right: 140px
    }
}

@media (max-width:960px) {

    .top,
    .top_g {
        height: 50px
    }

    .top .phone_btn span i,
    .top .phone_btn span:after,
    .top .phone_btn span:before {
        position: absolute;
        left: 0;
        width: 22px;
        height: 2px;
        background: #333
    }

    .top {
        top: 0;
        min-width: auto;
        padding-left: 20px;
        position: static
    }

    .top .logo img {
        height: 70px;
        width: auto
    }

    .in_banner .shubiao,
    .nav {
        display: none
    }
    /* .in_banner .swiper-slide .pc_img */

    .in_banner .swiper-slide .ph_img,
    .phone_btn,
    img.mobile {
        display: block
    }

    .top .phone_btn span {
        width: 20px;
        height: 17px;
        display: inline-block;
        position: relative;
        margin-right: 20px
    }

    .top .phone_btn span:before {
        content: '';
        top: 0
    }

    .top .phone_btn span:after {
        content: '';
        bottom: 0
    }

    .top .phone_btn span i {
        top: 50%;
        margin-top: -1px
    }

    .navMenubox .search {
        display: flex;
        width: calc(100% - 30px);
        margin: 20px 15px 0;
        border: 1px solid #ddd
    }

    .navMenubox .search input {
        width: calc(100% - 30px);
        line-height: 30px;
        border: 0;
        box-sizing: border-box;
        padding: 0 10px
    }

    .navMenubox .search button {
        width: 40px;
        height: 30px;
        border: 0;
        background: #eee
    }

    .navMenubox .search button img {
        width: auto;
        height: 60%
    }

    .in_banner .swiper-button-next,
    .in_banner .swiper-button-prev {
        width: 40px;
        height: 40px;
        display: none
    }

    .in_banner .swiper-button-next::after,
    .in_banner .swiper-button-prev::after {
        font-size: 20px
    }

    .in_banner .swiper-slide a {
        height: auto
    }

    /* img.web {
        display: none !important
    } */

    .in_banner .swiper-slide .pc_img{
        height:auto;
    }
}

@media all and (min-width:576px) and (max-width:768px) {

    .solutions_box2 .container2 .wz h2,
    .solutions_box2 .container2 .wz p,
    .solutionss_box1_l {
        padding: 0 40px
    }
}

@media all and (max-width:1200px) and (min-width:768px) {

    .in_box,
    .in_box1,
    .in_box1_b,
    .in_box21,
    .in_box211,
    .solutions_banner,
    .store_box22 li a .nr {
        height: auto
    }

    .di .container,
    .di .di_l,
    .in_box1_b,
    .in_box211,
    .quality1_box1,
    .solutionss_box1 .container1 {
        display: block
    }

    .about_box1,
    .about_box1_r,
    .contact_box3_r,
    .solutionss_box1_l {
        box-sizing: border-box
    }

    .in_box ul {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px
    }

    .in_box ul li {
        width: calc(50% - 10px)
    }

    .in_box1_b {
        top: -35px
    }

    .contact_box3_l,
    .di .di_r,
    .in_box1_b .in_box1_b_l,
    .in_box1_b .in_box1_b_r,
    .in_box21 h2,
    .in_box21 p,
    .in_box21 span,
    .industries_box_r {
        width: 100%
    }

    .in_box21 {
        padding: 20% 20px 20px;
        width: 100%
    }

    .in_box211 {
        width: 100%;
        position: static;
        margin-top: 40px
    }

    .in_box3 ul li {
        width: 50%
    }

    .in_box3 ul:last-child {
        margin-top: auto
    }

    .di .di_l {
        width: 100%;
        margin-bottom: 40px
    }

    .about_banner .nr p,
    .solutions_box1 ul li h2 {
        font-size: 30px
    }

    .solutions_banner .container {
        padding: 40px 20px;
        height: 600px;
        display: flex
    }

    .solutions_banner .container h3 {
        width: 100%;
        font-size: 30px
    }

    .solutions_banner .container img {
        position: static;
        width: 100%;
        margin-top: 20px
    }

    .solutionss_box1_r {
        display: none
    }

    .solutionss_box1_l {
        width: 100%;
        padding: 40px 0
    }

    .quality1_banner {
        height: 300px;
        display: block;
        font-size: 35px;
        padding: 20px 40px
    }

    .quality1_box1_l,
    .quality1_box2 {
        width: 50%;
        display: inline-block
    }

    .quality1_box1_r {
        width: 45%;
        text-align: center;
        margin-top: 40px;
        display: inline-block;
        vertical-align: bottom
    }

    .quality1_box1_r img {
        width: 150px
    }

    .about_banner .nr {
        padding-top: 20px;
        max-width: 100%
    }

    .about_banner .nr1 {
        width: 100%;
        padding-bottom: 20px
    }

    .about_banner .video {
        position: sticky;
        width: 100%;
        height: auto;
        display: block
    }

    .about_box1 {
        padding: 0;
        height: auto
    }

    .about_box1_r {
        height: 100%;
        position: static
    }

    .about_box1_r h2 {
        padding-top: 20px;
        padding-bottom: 20px
    }

    .about2_box_l {
        height: auto;
        padding: 20px 40px
    }

    .industries_box {
        display: block;
        padding-top: 40px
    }

    .contact_box3 .container2 {
        display: block;
        padding: 0
    }

    .contact_box3_r {
        width: 100%;
        padding: 20px 40px
    }
}

@media all and (max-width:768px) {

    .in_box211,
    .in_box42 {
        margin-top: 40px
    }

    .about3_box ul li a,
    .contact_box1 .bd ul li,
    .contact_box1 .hd ul,
    .di .container,
    .di .di_l,
    .in_box1_b,
    .in_box211,
    .industries1_box4_r ul,
    .quality1_banner,
    .quality1_box1,
    .quality2_box3 ul li,
    .solutionss_box1 .container1 {
        display: block
    }

    .about_box1_l,
    .about_box1_r {
        float: none;
        position: static;
        height: auto
    }

    .about1_box4,
    .footerLogo,
    .product_banner .img,
    .product_detail1_l,
    .quality1_box1_r {
        text-align: center
    }

    .about_banner,
    .contact_banner,
    .in_box,
    .in_box1,
    .industries1_box4,
    .industries1_box4_r ul li h2,
    .product1_box ul li a .nr,
    .product_banner,
    .quality2_box1,
    .solutions_banner,
    .store_box22 li a .nr {
        height: auto
    }

    .in_box ul {
        margin-top: 15px
    }

    .in_box ul li {
        width: 100%;
        margin-bottom: 15px;
        height: auto;
        margin-top: 0
    }

    .in_box1_b {
        top: -35px;
        height: auto
    }

    .about1_box1_l,
    .about1_box5_r,
    .about2_box1 ul li,
    .about2_box_l h2,
    .about2_box_l p,
    .contact_box1 .bd ul li h2,
    .contact_box3_,
    .contact_box3_l,
    .di .di_r,
    .in_box1_b .in_box1_b_l,
    .in_box1_b .in_box1_b_r,
    .in_box21 h2,
    .in_box21 p,
    .in_box21 span,
    .industries1_box ul li,
    .industries_box_l img,
    .industries_box_r,
    .mySwiper2,
    .product1_box ul li,
    .product_banner h2,
    .product_banner p,
    .quality1_box1_l,
    .quality1_box2,
    .solutions_box2 .container2 .wz {
        width: 100%
    }

    .container1 {
        width: 100% !important;
        padding: 0
    }

    .in_box21 {
        height: auto;
        padding: 20% 20px 20px;
        width: 100%
    }

    .in_box211 {
        height: auto;
        width: 100%;
        position: static
    }

    .in_box3 ul li {
        width: 50%
    }

    .in_box3 ul:last-child {
        margin-top: auto
    }

    .di .di_l {
        width: 100%;
        margin-bottom: 40px
    }

    .di .di_r ul {
        flex-wrap: wrap
    }

    .di .di_r ul li {
        flex: 50%;
        width: 50%;
        margin-bottom: 40px
    }

    .solutions_banner .container h3 {
        width: 100%;
        font-size: 30px;
        color: #000
    }

    .solutions_banner .container img {
        position: static;
        width: 100%;
        margin-top: 20px
    }

    .solutions_box1 ul li {
        width: calc(50% - 20px)
    }

    .solutions_box2 .container2 .img {
        width: 100%;
        margin-bottom: 20px
    }

    .about1_box1 .container2,
    .about2_box3 .container2,
    .contact_box3 .container2,
    .solutions_box2 .container2 {
        display: block;
        padding: 0
    }

    .solutionss_box1_l {
        width: 100%;
        box-sizing: border-box
    }

    .quality1_box1_r {
        width: 100%;
        margin-top: 40px
    }

    .quality1_box1 {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .quality1_box1_r img {
        width: 150px
    }

    .quality2_box3 ul li .right img {
        position: static;
        margin: auto
    }

    .quality2_box2,
    .quality2_box3,
    .quality2_box4,
    .quality2_box5 {
        height: auto;
        padding: 40px 0
    }

    .mySwiper2 .swiper-slide .img,
    .quality2_box2_l,
    .quality2_box3 ul li .right {
        width: 100%;
        position: static;
        height: auto;
        text-align: center
    }

    .quality2_box2_r,
    .quality2_box3 ul li .left {
        width: 100%;
        position: static;
        height: auto;
        padding: 20px 40px;
        box-sizing: border-box;
        float: none
    }

    .quality2_box1 .quality2_box1_qh {
        top: initial
    }

    .quality1_banner {
        height: auto;
        font-size: 35px;
        padding: 20px 40px
    }

    .about_box,
    .product_detail,
    .quality2_box {
        padding: 20px 0
    }

    .quality3_banner .video {
        width: 100%;
        position: static;
        height: auto;
        margin-top: 20px
    }

    .quality2_box h2 {
        padding-top: 0
    }

    .quality2_box {
        height: auto
    }

    .about1_box5_l,
    .about2_box2 .container .bt,
    .banner_video,
    .industries1_box4_l h2,
    .mySwiper,
    .product1_box ul li a .nr i,
    .quality_box {
        display: none
    }

    .about_banner .nr {
        padding-top: 20px;
        max-width: 100%
    }

    .about_banner .nr1 {
        width: 100%;
        padding-bottom: 20px
    }

    .about_banner .nr p {
        font-size: 30px
    }

    .about_banner .video {
        position: static;
        width: 100%
    }

    .about_box1 {
        padding: 0;
        height: auto;
        box-sizing: border-box
    }

    .about1_box1_r,
    .about2_box3_r,
    .about_box1_r,
    .contact_box3_r {
        padding: 20px 40px;
        width: 100%;
        box-sizing: border-box
    }

    .about_box1_l {
        width: 100%;
        box-sizing: border-box
    }

    .about_box1_r h2 {
        padding-top: 20px;
        padding-bottom: 20px
    }

    .about_box1::after,
    .solutions_banner1::after {
        content: none
    }

    .about1_box1,
    .about1_box5,
    .contact_box3,
    .product_box {
        padding: 40px 0
    }

    .about1_box2 {
        padding-bottom: 40px
    }

    .about1_box2_qh {
        margin: auto
    }

    .about1_box4 {
        height: auto;
        display: block;
        padding: 20px 0
    }

    .about1_box5 .container2 {
        display: block;
        padding: 0 40px;
        box-sizing: border-box
    }

    .about2_box_l {
        width: 100%;
        padding: 20px 40px;
        height: auto
    }

    .about2_box_r {
        width: 100%;
        position: static;
        box-sizing: border-box;
        height: auto
    }

    .mySwiper2 .swiper-slide p {
        width: 100%;
        padding-top: 20px
    }

    .mySwiper2 .swiper-slide .img img {
        width: auto;
        margin: auto
    }

    .about2_box3_l,
    .about3_box ul li a .left {
        width: 100%;
        height: auto
    }

    .about3_box ul li a .right {
        width: 100%;
        margin-top: 40px
    }

    .product_banner .img {
        height: auto;
        position: static;
        width: auto
    }

    .product_banner .container {
        padding: 40px 20px
    }

    .product_detail1 {
        display: block;
        padding: 20px 0
    }

    .product_detail1_l {
        width: auto;
        height: auto;
        display: block
    }

    .product_detail1_r {
        width: 100%;
        margin-top: 20px
    }

    .industries_box {
        display: block;
        padding-top: 40px
    }

    .contact_box1 .hd ul li {
        margin-bottom: 20px;
        width: 100%
    }

    .solutions_banner .container {
        padding: 40px 20px;
        height: auto;
        display: block
    }

    .solutions_banner .container h2 {
        color: #000 !important
    }

    .industries1_box4 .container {
        display: block;
        padding-top: 40px;
        padding-bottom: 40px
    }

    .industries1_box4_r {
        width: 100%;
        margin: auto
    }

    .industries1_box4_l {
        width: 100%;
        padding-top: 0;
        margin-bottom: 40px
    }

    .industries1_box4_r ul li {
        height: auto;
        width: auto;
        margin-bottom: 20px
    }

    .quality_banner {
        height: auto;
        display: block
    }

    .quality_banner_l,
    .quality_banner_r {
        width: 100%;
        margin: auto;
        height: auto;
        box-sizing: border-box
    }

    .quality_banner_l {
        padding-top: 40px
    }

    .solutions_box2 h2,
    .solutions_box2 p {
        padding: 0 20px
    }

    .quality_box1_qh .swiper-slide span img {
        width: 25%
    }

    .industries1_box4_r ul li span a,
    .product_box_qh .swiper-button-next,
    .product_box_qh .swiper-button-prev,
    .quality_box1_qh .swiper-button-next,
    .quality_box1_qh .swiper-button-prev,
    .quality_box2_qh .swiper-button-next,
    .quality_box2_qh .swiper-button-prev,
    .quality_box3_qh .swiper-button-next,
    .quality_box3_qh .swiper-button-prev {
        width: 40px;
        height: 40px
    }

    .swiper-button-next:after,
    .swiper-button-prev:after {
        font-size: 20px
    }

    .industries1_box11 p,
    .industries1_box3 .about1_box1_r p,
    .industries1_box4_r ul li h2,
    .product_banner p,
    .quality_banner_l h3,
    .quality_box4 .container h2,
    .store_box21 li {
        font-size: 30px;
        line-height: normal
    }

    .store_box21 li b {
        font-size: 60px
    }

    .quality_box4 {
        height: 300px
    }

    .industries1_box4_r ul li span a img {
        width: 20px
    }

    .skeleton .in_box1_b_l , .skeleton .in_banner , .skeleton .in_box43 .swiper-slide a .img {
        animation: 1s linear infinite alternate skeleton-loading;
        width: 100%;
    }
    .skeleton .in_box43 .swiper-slide a .img{height: 250px;}
    .skeleton .in_banner{height: 182px;}
    .skeleton .in_box1_b_l{height: 274px;}
    }

@media all and (max-width:576px) {

    .about1_box5_r ul li p,
    .in_box3 ul li,
    .in_bt,
    .solutions_box1 ul li,
    .store_box1 .img,
    .store_box1 .nr,
    .store_box21 li {
        width: 100%
    }

    .container,
    .container1 {
        padding: 0 20px
    }

    .in_box ul {
        margin-top: 20px
    }

    .store_box21 li,
    .store_box22 li {
        margin: auto auto 15px;
        height: auto
    }

    .in_box1_b .in_box1_b_r ul li {
        width: 100%;
        margin-bottom: 20px
    }

    .in_box21 h2 {
        font-size: 30px
    }

    .in_box21 {
        padding-top: 40%
    }

    .desktop,
    .quality_banner_r {
        display: none
    }

    .mobile {
        display: block
    }

    .in_box3 .mobile ul {
        flex-wrap: nowrap
    }

    .store_box1 .swiper-slide,
    .store_box21,
    .store_box22 {
        display: block;
        box-sizing: border-box;
        margin: auto
    }

    .store_box22 li {
        width: 49%;
        display: inline-block
    }

    .store_box22 li a .img {
        height: auto
    }

    .store_box22 li a .nr h2 {
        font-size: 16px
    }

    .store_box22 li a .nr i img {
        width: 20px
    }

    .about1_box5_r ul li {
        display: flex;
        padding-left: 0;
        flex-wrap: wrap;
        gap: 15px;
        align-items: center
    }

    .about1_box5_r ul li b {
        position: static
    }

    .about1_box5_r ul li h2 {
        padding: 0
    }
}

@media all and (min-width:991px) {
    .mobileSliderOne .swiper {
        overflow: visible
    }

    .in_box1_b .in_box1_b_r ul {
        display: flex;
        flex-wrap: wrap
    }
}