body{
    margin: 0;
    padding: 0;
}
html{
    scroll-behavior: smooth;
}
ul,ol,li{
    list-style: none;
    vertical-align: top;
    margin: 0;
}
.swiper-slide{
    margin-right:  0;
}
@media(min-width: 751px) {
    .body {
        overflow: hidden;
        height: 100%;
    }

    .wap {
        width: 100%;
        margin: auto;
        display: flex;
        height: 1rem;
        justify-content: space-between;
        z-index: 999;
        /*border-bottom: 0.04rem solid #1E1B39;*/
    }

    .logo {
        width: 20%;
        padding-top: 0.1rem;
        padding-bottom: 0.1rem;
        padding-left: 5%;
    }

    .logo img {
        height: 0.8rem;
    }

    .nav {
        display: flex;
        padding-right: 5%;
    }

    .nav-ul {
        display: flex;
        margin: 0;
        align-items: center;
    }

    .nav-ul .nav-li {
        padding: 0 0 0 1rem;
        color: #656565;
        height: 0.15rem;
        font-family: "microsoft yahei";
        font-size: 0.22rem;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
     .nav-ul .nav-li a{
         white-space: nowrap;
         color: #8a8a8a!important;
     }
    .nav-ul .nav-li span {
        font-size: 0.14rem;
    }

    /*轮播图*/
    .swiper-box {
        width: 100%;
        height: calc(100% - 1.04rem);
    }

    .swiper-img img {
        width: 100%;
        height: 100%;
    }

    /*服务*/
    .service-box {
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

    .service-header {
        width: 80%;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: 0.6rem;
    }

    .service-header-left {
        font-size: 0.4rem;
        font-weight: bold;
        color: #333;
    }

    .service-header-right {
        font-size: 0.18rem;
        font-weight: bold;
        color: #1E1B39;
    }

    .service-box .service-list {
        width: 80%;
        margin: 0 auto;
        transform: scale(0);
        transition: all 1s ease-in-out;
    }

    .service-box.active .service-list {
        transform: scale(1);
    }

    .service-ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        padding: 0;
    }

    .service-li .active-img {
        display: none;
    }

    .service-li:hover .active-img {
        display: inline-block;
    }

    .service-li:hover .normal-img {
        display: none;
    }

    .service-list ul li {
        width: 20%;
        padding: 4% 3% 3% 4%;
        margin: 1.5% 1% 0px 1.75%;
        height: 3rem;
        display: flex;
        flex-direction: column;
    }

    .service-list ul li:hover {
        background: #0f59da;
        border-radius: 7px;
    }

    .service-list ul li a .service-li-img {
        text-align: center;
    }

    .service-li-img img {
        width: 109px;
        height: 109px;
    }

    .service-list ul li a h4 {
        color: #333;
        font-size: 0.24rem;
        font-weight: bold;
        text-align: center;
    }

    .service-list ul li:hover a h4 {
        color: #ffffff;
    }

    .service-list ul li a p {
        color: #818182;
        font-size: 0.22rem;
        font-weight: 400;
        margin: 0.1rem auto;
        line-height: 0.3rem;
        text-align: center;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
    }

    .service-list ul li:hover a p {
        color: #ffffff;
    }

    /*产品*/
    .produce-box {
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

    .produce-header {
        width: 80%;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: 1rem;
    }

    .produce-header-left {
        font-size: 0.4rem;
        font-weight: bold;
        color: #fff;
    }

    .produce-header-right {
        font-size: 0.18rem;
        font-weight: bold;
        color: #fff;
    }
    .produce-swiper {
        width: 70%;
        margin: 0 10%;
        height: 5.0rem;
        overflow: hidden;
        padding-top: 5%;
    }
    .produce-item{
        margin: 7px 0.4rem 7px 0.1rem;
        margin-right: 0.35rem!important;
        display: inline;
        width: 4.1rem!important;
        padding-bottom: 0.2rem;
    }
    .produce-item .produce-img{
    width: 4.1rem;
    height: 2.8rem;
    overflow: hidden;
    border-radius: 10px 10px 0 0;
}
    .produce-item .produce-img img{
        width: 4.1rem;
        min-height: 2.8rem;
        cursor: pointer;
        transition: all 0.6s;
    }
    .produce-item .produce-item-info{
        background: #ffffff;
        padding: 0.15rem;
        height: 2.2rem;
    }
    .produce-item .produce-item-info h1{
        font-size: 0.25rem;
        font-weight: bold;
        color: #333;
    }
    .produce-item .produce-item-info p{
        color: #626262;
        line-height: 0.3rem;
        font-size: 0.18rem;
    }
    .produce-prev{
        position: absolute;
        left: auto!important;
        top: 2.9rem!important;
        right: 12%!important;
        padding: 0.2rem;
        border: 3px solid #46A4FF;
        border-radius: 50%;
        width: 0.3rem!important;
        height: 0.3rem!important;
        background-size: 0.3rem!important;
    }
    .produce-next{
        position: absolute;
        left: auto!important;
        top: 7rem!important;
        right: 12%!important;
        z-index:999;
        padding: 0.2rem;
        border: 3px solid #46A4FF;
        border-radius: 50%;
        width: 0.3rem!important;
        height: 0.3rem!important;
        background-size: 0.3rem!important;
    }
    /*新闻*/
    .news-box{
        width: 100%;
        height: 100%;
        overflow: hidden;
    }
    .news-header {
        width: 80%;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: 1rem;
    }
    .news-header-left {
        font-size: 0.4rem;
        font-weight: bold;
        color: #333;
    }
    .news-header-right {
        font-size: 0.18rem;
        font-weight: bold;
        color: #333;
    }
    .news-list{
        width: 80%;
        margin: 0 auto;
    }
    .news-ul{
        width: 100%;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        padding: 0.8rem 0 0 0;
    }
    .news-ul .news-li{
        width: 45%;
        display: flex;
        justify-content: space-between;
        font-size: 0.22rem;
        line-height: 30px;
        font-weight: bold;
        padding-bottom: 0.3rem;
        padding-top: 0.4rem;
    }
    .news-title{
        color: #333;
        width: 5rem;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
    /*关于我们*/
    .about-box{
        width: 100%;
        height: 100%;
        overflow: hidden;
    }
    .about-header {
        width: 80%;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: 1rem;
    }
    .about-header-left {
        font-size: 0.4rem;
        font-weight: bold;
        color: #fff;
    }
    .about-header-right {
        font-size: 0.18rem;
        font-weight: bold;
        color: #fff;
    }
    .about-box .about-list{
        width: 80%;
        margin: 0 auto;
        height: 8rem;
        position: relative;
        transform: scale(0);
        transition: all 1s ease-in-out;
    }
    .about-box.active .about-list {
        transform: scale(1);
    }
    .about-item{
        z-index: 99999;
    }
    .about-item:nth-child(1){
        position: absolute;
        padding: 0.3rem;
        left: 0;
        top: 2.3rem;
    }
    .about-item:nth-child(2){
        position: absolute;
        padding: 0.3rem;
        left: 3rem;
        top: 0;
    }
    .about-item:nth-child(3){
        position: absolute;
        padding: 0.3rem;
        left: 6rem;
        top: 3.1rem;
    }
    .about-item:nth-child(4){
        position: absolute;
        padding: 0.3rem;
        left: 8.5rem;
        top: 0.2rem;
    }
    .about-item:nth-child(5){
        position: absolute;
        padding: 0.3rem;
        left: 11rem;
        top: 4rem;
    }
    .about-item:nth-child(6){
        position: absolute;
        padding: 0.3rem;
        left: 3rem;
        top: 5rem;
    }
    .about-item:nth-child(1) .circle-box div{
        background: #33abcd;
    }
    .about-item:nth-child(2) .circle-box div{
        background: #46A4FF;
    }
    .about-item:nth-child(3) .circle-box div{
        background: #6c4fe2;
    }
    .about-item:nth-child(4) .circle-box div{
        background: #7495b7;
    }
    .about-item:nth-child(5) .circle-box div{
        background: #3eb383;
    }
    .about-item:nth-child(6) .circle-box div{
        background: #e2680f;
    }
    .circle-box{
        position: relative;
    }
    .about-item:nth-child(1) .circle{
        width:2rem;
        height: 2rem;
        border-radius: 50%;
        z-index: 10;
    }
    .about-item:nth-child(1) .circle img{
        width:2rem;
        height: 2rem;
        border-radius: 50%;
        z-index: 10
    }
    .about-item:nth-child(2) .circle{
        width:2.3rem;
        height: 2.3rem;
        border-radius: 50%;
        z-index: 10;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .about-item:nth-child(2) .circle h2{
        font-size: 0.25rem;
        color: #fff;
        font-weight: bold;
        text-align: center;
        letter-spacing: 0.05rem;
    }
    .about-item:nth-child(2) .circle-box .circle_light{
        width: 2.3rem;
        height: 2.3rem;
    }
    .about-item:nth-child(3) .circle-box .circle:before{
       content: '';
        width: 0.3rem;
        height: 0.3rem;
        left: 3.5rem;
        box-shadow: #46A4FF 0 0 2vh 2vh, #46A4FF 12vh 4vh 2vh 0.3vh;
        background-color: rgb(255, 255, 255, 0.5);
        position: relative;
        display: flex;
        border-radius: 50%;
        animation: rotate 6s linear infinite;
    }
    .about-item:nth-child(3) .circle-box .circle:after{
        content: '';
        background-color: rgb(255, 255, 255, 0.5);
        position: relative;
        display: flex;
        border-radius: 50%;
        animation: rotate 6s linear infinite;
    }
    .about-item:nth-child(2) .circle-box .circle_light2{
        width: 2.5rem;
        height: 2.5rem;
        filter: alpha(opacity=40);
        position: absolute;
        top: -0.1rem;
        left: -0.1rem;
    }
    .about-item:nth-child(3) .circle{
        width:2.2rem;
        height: 2.2rem;
        border-radius: 50%;
        z-index: 10;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .about-item:nth-child(3) .circle h2{
        font-size: 0.25rem;
        color: #fff;
        font-weight: bold;
        text-align: center;
        letter-spacing: 0.05rem;
    }
    .about-item:nth-child(3) .circle-box .circle_light{
        width: 2.2rem;
        height: 2.2rem;
    }
    .about-item:nth-child(3) .circle-box .circle_light2{
        width: 2.4rem;
        height: 2.4rem;
        filter: alpha(opacity=40);
        position: absolute;
        top: -0.1rem;
        left: -0.1rem;
    }
    .about-item:nth-child(4) .circle{
        width:2.8rem;
        height: 2.8rem;
        border-radius: 50%;
        z-index: 10;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
    .about-item:nth-child(4) .circle h2{
        font-size: 0.25rem;
        color: #fff;
        font-weight: bold;
        text-align: center;
        letter-spacing: 0.05rem;
    }
    .about-item:nth-child(4) .circle-box .circle_light{
        width: 2.8rem;
        height: 2.8rem;
    }
    .about-item:nth-child(4) .circle-box .circle_light2{
        width: 3rem;
        height: 3rem;
        filter: alpha(opacity=40);
        position: absolute;
        top: -0.1rem;
        left: -0.1rem;
    }
    .about-item:nth-child(5) .circle{
        width:3.5rem;
        height: 3.5rem;
        border-radius: 50%;
        z-index: 10;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
    .about-item:nth-child(5) .circle h2{
        font-size: 0.25rem;
        color: #fff;
        font-weight: bold;
        text-align: center;
        letter-spacing: 0.05rem;
    }
    .about-item:nth-child(5) .circle-box .circle_light{
        width: 3.5rem;
        height: 3.5rem;
    }
    .about-item:nth-child(5) .circle-box .circle_light2{
        width: 3.7rem;
        height: 3.7rem;
        filter: alpha(opacity=40);
        position: absolute;
        top: -0.1rem;
        left: -0.1rem;
    }
    .about-item:nth-child(6) .circle{
        width:1.6rem;
        height: 1.6rem;
        border-radius: 50%;
        z-index: 10;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
    .about-item:nth-child(6) .circle h2{
        font-size: 0.25rem;
        color: #fff;
        font-weight: bold;
        text-align: center;
        letter-spacing: 0.05rem;
    }
    .about-item:nth-child(6) .circle-box .circle_light{
        width: 1.6rem;
        height: 1.6rem;
    }
    .about-item:nth-child(6) .circle-box .circle_light2{
        width: 1.8rem;
        height:1.8rem;
        filter: alpha(opacity=40);
        position: absolute;
        top: -0.1rem;
        left: -0.1rem;
    }
    .circle_light{
        border-radius: 100%;
        width: 2rem;
        height: 2rem;
        filter: alpha(opacity=40);
        position: absolute;
        top: 0;
        left: 0;
        z-index: -999;
    }
    .animation {
        -webkit-animation: twinkling 2.1s infinite ease-in-out;
        animation: twinkling 2.1s infinite ease-in-out;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
    }
    .circle_light2{
        border-radius: 100%;
        width: 2.3rem;
        height: 2.3rem;
        filter: alpha(opacity=40);
        position: absolute;
        top: -0.15rem;
        left: -0.15rem;
        z-index: -999;
    }
    .animations {
        -webkit-animation: twinkling 2.1s infinite ease-in-out;
        animation: twinkling 2.1s infinite ease-in-out;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
    }
    @keyframes twinkling{
        0% {
            opacity: 0.2;
            filter: alpha(opacity=20);
            -webkit-transform: scale(1);
        }
        50% {
            opacity: 0.5;
            filter: alpha(opacity=50);
            -webkit-transform: scale(1.12);
        }
        100% {
            opacity: 0.2;
            filter: alpha(opacity=20);
            -webkit-transform: scale(1);
        }
    }
    @keyframes rotate{
        0% {
          transform: rotate(0deg);
        }
        100% {
            transform: rotate(-360deg);
        }
    }
    .footer-box{
        height: 3.5rem;
        background: #2a2a2a;
    }
    .swiper-vertical .swiper-wrapper .swiper-slide:last-child{
        height: 3.5rem!important;
    }
    .home-swiper .swiper-wrapper .swiper-slide:last-child{
        height: 100%!important;
    }
    .footer{
        width: 80%;
        margin: 0 auto;
        display: flex;
    }
    .footer-left{
        display: flex;
        flex-direction: column;
        align-items: center;
        padding-top: 0.2rem;
        width: 15%;
    }
    .footer-left img:first-child{
        width: 1.8rem;
        height: 0.5rem;
    }
    .footer-left img:last-child{
        width: 1.5rem;
        height: 1.5rem;
        margin-top: 0.2rem;
    }
    .footer-right{
        display: flex;
        padding-top: 0.4rem;
        padding-left: 5%;
        width: 75%;
        justify-content: space-between;
    }
    .footer-right .footer-ul{
        margin: 0 3% 0 4%;
    }
    .footer-ul li:first-child{
        font-size: 0.24rem;
        font-weight: bold;
        color: #fff;
    }
    .footer-ul li{
        color: #8a8a8a;
        font-size: 0.2rem;
        line-height: 0.4rem;
    }
    .records{
        color: #8a8a8a;
        clear: both;
        text-align: center;
        line-height: 40px;
        font-size: 0.2rem;
        padding-top: 0.4rem;
    }
    .wap-footer{
        display: none;
    }
    #on_wap{
        display: none;
    }
    .right-fixed-box{
        position: fixed;
        right: 0;
        bottom: 1rem;
        background:#46A4FF;
        z-index: 999;
        border-radius: 0.100000rem 0 0 0.100000rem;
        padding: 0.1rem;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .right-fixed-box .fixed-img{
        width: 0.3rem;
        height: 0.3rem;
        border-bottom: 1px solid #ffffff;
        cursor: pointer;
        position: relative;
        padding: 0.1rem;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .right-fixed-box .fixed-img:hover .link-info{
        display: block;
    }
    .link-info{
        display: none;
        position: absolute;
        top: 0;
        right: 0.8rem;
        background: #46A4FF;
        padding: 0.2rem;
    }
    .link-info p{
        margin: 0;
        font-size: 0.2rem;
        color: #fff;
        white-space: nowrap;
        text-align: center;
    }
    .right-fixed-box .fixed-img:last-child{
        border-bottom: none;
    }
    .right-fixed-box .fixed-img img{
        width: 0.3rem;
        height: 0.3rem;
    }
    .mark{
        display: none;
        width: 100%;
        height: 100%;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 99999;
        background: rgba(0,0,0,.8);
    }
    .form-div{
        width: 6rem;
        height: 6rem;
        background: #ffffff;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        border-radius: 0.1rem;
        padding: 0.250000rem 0.320000rem;
        box-sizing: border-box;
        color: #222;
        z-index: 999999;
    }
    .form-header{
        display: flex;
        justify-content: space-between;
    }
    .form-header .title{
        font-size: 0.24rem;
        color: #333;
        font-weight: bold;
    }
    .close{
        width: 0.4rem;
        height: 0.4rem;
        cursor: pointer;
    }
    .close img{
        width: 100%;
        height: 100%;
    }
    .form-item{
        display: flex;
        justify-content: center;
        margin-top: 0.2rem;
    }
    .form-item label{
        color: red;
    }
    .form-item span{
        font-size: 0.2rem;
        text-align: right;
        width: 0.8rem;
    }
    .form-item input{
        margin-left: 0.3rem;
        width: 4.2rem;
        height: 0.4rem;
        box-sizing: border-box;
        padding: 0 0.1rem;
        font-size: 0.16rem;
        border: 0.02rem solid #666666;
        outline: none;
        font-size: 14px;
    }
    .form-item textarea{
        margin-left: 0.3rem;
        width: 4.2rem;
        height: 1.6rem;
        padding: 0.1rem;
        box-sizing: border-box;
        border: 0.02rem solid #666666;
        outline: none;
        resize: none;
        overflow: auto;
        font-size: 14px;
    }
    .form-item input:focus,.form-item textarea:focus{
        border:0.02rem solid #46A4FF;
    }
    .submit{
        width: 80%;
        height: 0.6rem;
        margin: 0 auto;
        margin-top: 0.4rem;
        background: #46A4FF;
        color: #ffffff;
        line-height: 0.6rem;
        text-align: center;
        font-size: 0.2rem;
        border-radius: 10px;
        cursor: pointer;
    }
}