﻿.w1520{

    width: 15.2rem;

    margin-left: auto;

    margin-right: auto;

}

header .logo{

    display: flex;

    align-items: center;

}

header.header-appear{

    background: rgba(36, 38, 50, .8);

    -webkit-box-shadow: 3px 4px 5px 0 rgb(0 0 0 / 10%);

    -moz-box-shadow: 3px 4px 5px 0 rgba(0,0,0,.1);

    box-shadow: 3px 4px 5px 0 rgb(0 0 0 / 10%);

}

.pc_nav li a{

    display: block;

    font-size:18px;

    color: #DDDDDD;

    margin-left: .3rem;

}



.pc_nav li:hover a,.pc_nav li.active a{

    font-weight: bold;

    color: #fff;

}

header{

    position: fixed;

    left: 0;

    top: 0;

    z-index: 888;

    height: 1rem;

    line-height: 1rem;

    width: 100%;

}

header .w1520{

    height: 100%;

}

.ibanner{

    width: 100%;

    height: 100vh;

    background-size: cover !important;

    position: relative;

}

.ibanner .round{

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%,-50%);

    background: url(../images/bannerf2.png) no-repeat center center;

    text-align: center;

    width: 8.07rem;

    height: 6.24rem;

    background-size: 100% 100%;

    display: flex;

    align-items: center;

    justify-content: center;

}

.ibanner .round .m_round{

    position: relative;

    width: 4rem;

    height: 4rem;

    display: flex;

    align-items: center;

    justify-content: center;



}

.ibanner .round .m_round .wave{

    width: 100%;

    height: 100%;

    z-index: 12;

    background: #2c2e3a;

    border-radius: 50%;

    text-align: center;

}

.ibanner .round .m_round .wave span {

    position: absolute;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    margin: auto;

}

.ibanner .round .m_round .wave span:nth-of-type(1){

    z-index: 8;

    width: 100%;

    height: 100%;

    background: rgba(255, 255, 255, 0.01);

    border-radius: 50%;

    animation: ripple1 7s ease-in-out infinite;

}

.ibanner .round .m_round .wave span:nth-of-type(2){

    z-index: 8;

    width: 100%;

    height: 100%;

    background: rgba(255, 255, 255, 0.01);

    border-radius: 50%;

    animation: ripple1 7s ease-in-out infinite;

    animation-delay: 1.5s;

}

.ibanner .round .m_round .wave span:nth-of-type(3){

    z-index: 8;

    width: 100%;

    height: 100%;

    background: rgba(255, 255, 255, 0.01);

    border-radius: 50%;

    animation: ripple1 7s ease-in-out infinite;

    animation-delay: 3.5s;

}

.ibanner .round .m_round .wave span:nth-of-type(4){

    z-index: 8;

    width: 100%;

    height: 100%;

    background: rgba(255, 255, 255, 0.01);

    border-radius: 50%;

    animation: ripple1 7s ease-in-out infinite;

    animation-delay: 4.5s;

}

.ibanner .round .m_round .wave span:nth-of-type(5){

    z-index: 8;

    width: 100%;

    height: 100%;

    background: rgba(255, 255, 255, 0.01);

    border-radius: 50%;

    animation: ripple1 7s ease-in-out infinite;

    animation-delay: 5.5s;

}

.ibanner .round .s_round{

    position: absolute;

    width: 2.8rem;

    height: 2.8rem;

    margin: 0 auto;

    background: rgba(255, 255, 255, 0.03);

    border-radius: 50%;

    left: 50%;

    top: 50%;

    transform: translate(-50%,-50%);

    z-index: 13;

}

.ibanner .round .s_round::after{

    content: '';

    position: absolute;

    width: 100%;

    height: 100%;



    top: 0;

    left: 0;

}

.ibanner .font{

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%,-36%);

    z-index: 13;

}

.ibanner .font h1{

    font-size: .66rem;

    color: #04A467;

    font-weight: bold;

    font-family: ttf-bold;

    background: linear-gradient(0deg, #3CB54E 0%, #19B0A7 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    white-space: nowrap;

}

.ibanner .font p{

    font-size: .26rem;

    color: #04A467;

    background: linear-gradient(0deg, #3CB54E 0%, #19B0A7 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    margin-top: .16rem;

}

.ibanner .font a{

    width: 2rem;

    height: .56rem;

    line-height: .56rem;

    background: linear-gradient(90deg, #3CB54E, #19B0A7);

    border-radius: .28rem;

    display: block;

    text-align: center;

    font-size: .18rem;

    color: #fff;

    font-weight: bold;

    margin: 0 auto;

    margin-top: .46rem;



}

.ibanner .font a:hover{

    transition: all .5s;

    transform: scale(0.88);

}

.main .s1{

    display: flex;

    justify-content: center;

    padding: .9rem;

}

.main .s1 .r_item{

    max-width: 6.36rem;

    margin-top: .3rem;

    margin-left: 1.65rem;

}

.main .s1 .r_item .t1{

    font-size: .42rem;

    color: #333333;

    font-weight: bold;

}

.main .s1 .r_item .desc{

    color: #888888;

    font-size: 18px;

    line-height: 36px;

    margin-top: .4rem;

}

.main .s1 .r_item .t2{

    font-size: 24px;

    color: #04A467;

    margin-top: .5rem;

}

.main .s1 .r_item .desc2{

    font-size: .16rem;

    color: #04A467;

    margin-top: .1rem;

}

.main .s1 .l_item{

    flex-shrink: 0;

    animation: trantop 3s ease-in-out infinite alternate;

}

.intitle{

    font-weight: bold;

    font-size: .42rem;

    text-align: center;

}

.intitle span{

    font-size: .8rem;

    font-weight: bold;

    color: #04A467;

    background: linear-gradient(0deg, #3CB54E 0%, #19B0A7 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}

.main .s2{

    background: #f6f6f9;

    padding-top: 1rem;

}

.main .s2 .cont{

    display: flex;

    justify-content: center;

}

.main .s2 .cont .c_item{

    width: 5.22rem;

}

.main .s2 .cont .num{

    font-weight: 500;

    color: #FFFFFF;

    font-size: 24px;

    position: relative;

    text-align: center;

    line-height: .6rem;

    width: .6rem;

    height: .6rem;

    font-family: FARRAY !important;

}

.main .s2 .cont .num span{

    position: relative;

    z-index: 1;

}

.main .s2 .cont .num::after{

    content: '';

    position: absolute;

    width: 100%;

    height: 100%;

    left: 0;

    background: linear-gradient(90deg, #3CB54E, #19B0A7);

    transform: rotate(45deg);

    border-radius: 4px;

    z-index: 0;

}

.main .s2 .cont .item{

    position: relative;

}

.main .s2 .cont .item h3{

    font-size:.22rem;

    color: #333333;

}

.main .s2 .cont .item .desc{

    font-size: .16rem;

    color: #999999;

    margin-top: .16rem;

}

.main .s2 .cont .l_item .item{

    padding-right: 1rem;

    text-align: right;

    margin-bottom: .84rem;

}

.main .s2 .cont .l_item .item:nth-child(2){

    transform: translateX(-.6rem);

}

.main .s2 .cont .l_item .item:last-child{

    margin-bottom: 0;

    transform: translateX(.4rem);

}

.main .s2 .cont .l_item .num{

    position: absolute;

    right: 0;

    top: 0;

}

.main .s2 .cont .r_item .item{

    padding-left: 1rem;

    text-align: left;

    margin-bottom: .84rem;

}

.main .s2 .cont .r_item .item:last-child{

    margin-bottom: 0;

    transform: translateX(-.4rem);

}

.main .s2 .cont .r_item .item:nth-child(2){

    transform: translateX(.6rem);

}

.main .s2 .cont .r_item .num{

    position: absolute;

    left:0;

    top: 0;

}

.main .s3{

    padding: 1.1rem 0;

}

.main .s3 .nav_tab{

    margin-bottom: .6rem;

}

.main .s3 .nav_tab li{

    font-size: .24rem;

    color: #666;

    text-align: center;

    background: #F6F6F9;

    border: 1px solid #EEEEEE;

    box-sizing: border-box;

    cursor: pointer;

    height: .54rem;

    line-height: .54rem;

    border-radius: 6px;

}

.main .s3 .nav_tab li.swiper-slide-thumb-active{

    background: linear-gradient(90deg, #3CB54E, #19B0A7);

    border: 1px solid #EEEEEE;

    color: #fff;

}

.main .s3  .intitle{

    line-height: .8rem;

    display: flex;

    align-items: center;

    justify-content: center;

}

.imore{

    display: block;

    margin-left: auto;

    margin-right: auto;

    width: 2.6rem;

    height: .54rem;

    line-height: .54rem;

    background: linear-gradient(90deg, #3CB54E, #19B0A7);

    border-radius: .27rem;

    font-size: .18rem;

    color: #FFFFFF;

    text-align: center;



}

.imore:hover{

    color: #fff;

    transform: scale(.88);

    transition: all .5s;

}

.main .s4{

    background: url(../images/s4bg.jpg) no-repeat center center;

    background-size: cover;

    padding: 1.25rem 0;

}

.main .s4 .item .font h3{

    color: #fff;

    font-size: .48rem;

    font-weight: bold;

    margin-bottom: .1rem;

}

.main .s4 .item .font p{

    font-size:.18rem;

    color: #fff;

}

.main .s4 .cont{

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-top: 1rem;

}

.main .s4 .cont .item .icon img{

    margin: 0 auto;

}

.main .s4 .cont .item .btcont{

    position: relative;

    text-align: center;

    margin-top: .58rem;

}

.main .s4 .cont .item .btcont .status{

    position: absolute;

    top: 50%;

    right: -.4rem;

    transform: translateY(-50%);

}

.main .s5{

    background: #f6f6f9;

    padding: 1.1rem 0;

}

.main .s5 .cont{

    margin-top: .6rem;

}

.main .s5 .body{

    display: flex;

    justify-content: space-between;

}

.main .s5 .body .l_item{

    margin-top: .5rem;

    flex-shrink: 0;

}

.main .s5 .body .l_item h3{

    font-size: 24px;

    color: #333;

    font-weight: normal;

    position: relative;

    margin-bottom: .1rem;

}

.main .s5 .body .l_item h3::before{

    content: '';

    position: absolute;

    top: 0;

    left: -.2rem;

    width: 4px;

    height: 18px;

    background: #04A467;

    top: .1rem;

}

.main .s5 .body .l_item p{

    font-size: 18px;

    color: #888888;

}

.main .s5 .body .l_item .item{

    padding-left: .2rem;

    margin-bottom: .46rem;

}

.main .s5 .body .l_item .item:last-child{

    margin-bottom: 0;

}

.main .s5 .body .r_item{

    flex-shrink: 0;

}

.main .s5 .body .r_item img{

    display: block;

    width: 100%;

    width: 100%;

    object-fit: cover;

}

.main .s5 .swiper-pagination{

    display: flex;

    bottom: 30px;

}

.main .s5 .swiper-pagination .swiper-pagination-bullet{

    width: 10px;

    height: 10px;

    margin: 0;

    background: #AAAAAA;

    opacity: 1;

    margin-right: 12px;

    border-radius: 10px;

    transition: all 1s;

}

.main .s5 .swiper-pagination .swiper-pagination-bullet-active{

    width: 42px;

    background: linear-gradient(90deg, #3CB54E, #19B0A7);

    border-radius: 5px;

    border-radius: 10px;

}

.main .s6{

    padding: 1.1rem 0;

}

.main .s6 .cont{

    display: flex;

    margin-top: .46rem;

    justify-content: space-between;

}

.main .s6 .cont .l_item{

    flex-shrink: 0;

    width: 4.64rem;

}

.main .s6 .cont .r_item{

    display: flex;

    flex-wrap: wrap;

    max-width: 10rem;

    flex-shrink: 0;

    margin-top: .48rem;

}

.main .s6 .cont .r_item .item{

    width: 4.5rem;

    margin-right: .98rem;

    position: relative;

}

.main .s6 .cont .r_item .item:nth-child(2n){

    margin-right: 0;

}

.main .s6 .cont .r_item .item .t{

    line-height: .44rem;

    display: flex;

}

.main .s6 .cont .r_item .item .t::before{

    content: '';

    width: 1rem;

    height: .44rem;

    left: 0;

    position: absolute;

    background: linear-gradient(90deg, #3CB54E, #19B0A7);

    border-radius: 6px;

    z-index: 1;

    transition: all .8s;

}

.main .s6 .cont .r_item .item:hover .t::before{

    width: 100%;

    background: #FF8E3D;

}

.main .s6 .cont .r_item .item .t .bq{

    font-size: .2rem;

    font-weight: bold;

    color: #FFFFFF;

    width: 1rem;

    text-align: center;

    height: .44rem;

    line-height: .44rem;

    margin-right: .28rem;

    position: relative;

    z-index:2;

    cursor: pointer;

    flex-shrink: 0;

}

.main .s6 .cont .r_item .item .t .tt{

    font-size: .2rem;

    color: #333333;

    position: relative;

    z-index:2;

    transition: all .8s;

    white-space:nowrap;

}

.main .s6 .cont .r_item .item:hover .t .tt{

    color: #fff;

}

.main .s6 .cont .r_item .item .desc{

    font-size: .16rem;

    line-height: 32px;

    color: #999999;

    margin-top: .12rem;

    margin-left: 1.28rem;

}

.main .s7 .smt{

    font-size: 20px;

    text-align: center;

}

.main .s7{

    background: #f6f6f9;

    padding: 1.1rem 0;

}

.main .s7 .swiper-container{

    margin-top: .6rem;

}

.main .s7 .swiper-slide{

    width: 1000px;

}

.main .s7 .swiper-slide .body{

    max-width: 1000px;

    height: 3.2rem;

    background: #FFFFFF;

    box-shadow: 0px 12px 26px 0px rgba(0, 0, 0, 0.06);

    border-radius: 10px;

    padding-top: .56rem;

    position: relative;

}

.main .s7 .swiper-slide .body::before{

    content: '';

    position: absolute;

    left: .5rem;

    top: .36rem;

    width: .87rem;

    height: .62rem;

    background: url(../images/yh1.png) no-repeat center center;

    background-size: 100% 100%;

}

.main .s7 .swiper-slide .body::after{

    content: '';

    position: absolute;

    right: .5rem;

    bottom: .36rem;

    width: .87rem;

    height: .62rem;

    background: url(../images/yh2.png) no-repeat center center;

    background-size: 100% 100%;

}

.main .s7 .swiper-slide .t{

    font-size: 24px;

    color: #333333;

    text-align: center;

}

.main .s7 .swiper-slide .desc{

    font-size: .16rem;

    color: #666;

    max-width: 6.6rem;

    margin: 0 auto;

    margin-top: .34rem;

}

.main .s7 .swiper-button-prev{

    width: .48rem;

    height: .48rem;

    background: url(../images/l_arrow1.png) no-repeat center center;

}

.main .s7 .swiper-button-next{

    width: .48rem;

    height: .48rem;

    background: url(../images/r_arrow1.png) no-repeat center center;

}

.main .s7 .pp_cont{

    margin-top: .8rem;

}

.main .s8{

    padding: 1.1rem 0;

    background: url(../images/bg1.jpg) no-repeat center center;

    background-size: cover;

}

.main .s8 .t{

    font-size: .42rem;

    color: #fff;

    text-align: center;

}

.main .s8 .search_box{

    display: flex;

    align-items: center;

    width: 5.6rem;

    height: .5rem;

    background: #FFFFFF;

    border-radius: .25rem;

    justify-content: center;

    margin: 0 auto;

    margin-top: .42rem;

}

.main .s8 .search_box input{

    background: transparent;

    border: none;

    display: block;

    flex: 1;

    height: 100%;

    font-size: .16rem;

    padding-left: .2rem;

}

.main .s8 .search_box button{

    width: 1.46rem;

    flex-shrink: 0;

    height: .46rem;

    background: linear-gradient(90deg, #3CB54E, #19B0A7);

    border-radius: 23px;

    font-size: 18px;

    color: #fff;

    border: none;

    margin-right: .02rem;

    cursor: pointer;

    transition: all .5s;

}

.main .s8 .search_box button:hover{

    transform: scale(0.94);

}

.rf_menu{

    position: fixed;

    top: 30%;

    right: 0;

    z-index: 100;

    text-align: center;

    box-sizing: border-box;



}



.rf_menu ul li{

    margin-bottom: 4px;

    display: flex;

    position: relative;

    transition: all 0.25s;
    transform: translateX(0);
}

.rf_menu ul li>a{

    display: block;

    width: .82rem;

    box-sizing: border-box;

    padding: .15rem 0;

    background: linear-gradient(90deg, #3CB54E, #19B0A7);

    border-radius: 6px 0px 0px 6px;

    display: flex;

    justify-content: center;

    align-items: center;

    flex-direction: column;

}


.rf_menu ul li a img{

    margin: 0 auto;

}

.rf_menu ul li a p{

    font-size: .15rem;

    color: #fff;

    margin-top: .1rem;

    transition: all 0.25s;

}




.rf_menu ul li .phone_box{

    padding: .1rem;

    background:#19B0A7;

    height: 100%;

    box-sizing: border-box;

    position: absolute;

    left: 99%;

    width: 160px;

}

.rf_menu ul li .phone_box a{

    display: block;

    font-size: 13px;

    color: #fff;

    box-sizing: border-box;

}

.rf_menu ul li:nth-child(2):hover{

    transform: translateX(-160px);

}

@keyframes trantop{

    0%{

        transform: translateY(-5px);

    }

    50%{

        transform: translateY(0); 

    }

    100%{

        transform: translateY(5px); 

    }

}

@keyframes ripple1 {



    0% {

  

      opacity: 1;

  

      -webkit-transform: scale(1);

  

      -moz-transform: scale(1);

  

      -ms-transform: scale(1);

  

      transform: scale(1);

  

    }

    100%{

        opacity: 0.1;

  

        -webkit-transform: scale(3.5);

    

        -moz-transform: scale(3.5);

    

        -ms-transform: scale(3.5);

    

        transform: scale(3.5);  

    }

  

  }

  @media only screen and (max-width: 1520px){

    .w1520{

        width: 90%;

    }

  }