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

    .headline p:nth-child(1) {

        font-size: 64px;

    }

    .headline p:nth-child(2) {

        font-size: 20px;

    }

    .referral .about-title {

        width: 780px;

        font-size: 40px;

    }

    .referral .intro>div{

        width: 456px;

    }

    .referral li{

        margin-left: 100px;

    }

    .referral li span {

        font-size: 48px;

    }

    .referral .vidio{

        width: 100%;

    }

    .product p:nth-child(1) {

        font-size: 42px;

        margin-top: 96px;

    }

    .workshop ul {

        margin-top: 35px;

    }

    .workshop li:nth-child(1) {

        width: 580px;

    }

    .workshop li {

        width: 300px;

        height: 350px;

    }

    .news>div>P {

        width: 100%;

    }

    .news>div>P>span {

        font-size: 40px;

    }

    .news .left {

        width: 480px;

        height: 490px;

    }

    .news .right li {

        margin-bottom: 16px;

        padding-bottom: 13px;

    }

    .news .right p {

        font-size: 20px;

    }

    .news .right li span {

        font-size: 13px;

    }

    .news .right .picture {

        width: 430px;

    }

    .news .right {

        width: 650px;

    }

}

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

    .product p:nth-child(1) {

        font-size: 35px;

        margin-top: 72px;

    }

    .swiper-banner .swiper-button-prev {

      top: 300px;

    }

    .swiper-banner .swiper-button-next {

      top: 300px;

    }

    .product {

        height: 772px;

    }

}

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

    body{

        background: #FFFFFF !important;

    }

    .banner{
        height: 4.22rem;
    }
    .mse{
        height: 4.22rem !important;
    }
    .banner .yin h4{
        font-size: .6rem;
        line-height: .8rem;
    }
    .banner .yin p {
        font-size: .26rem;
        line-height: .44rem;
        margin-top: .1rem;
    }


    .swiper_head{

        width: 7.5rem;

        height: 8.7rem;

      }

    .swiper_head .swiper-slide{

        height: 6.0rem;

        background-image: url(../../images/app_banner.png) !important;

        background-repeat: no-repeat;

    }

    .headline {

        width: 100%;

        height: 1.4rem;

    }

    .headline p:nth-child(1) {

        font-size: .56rem;

        line-height: .74rem;

    }

    .headline p:nth-child(2) {

        width: 6.4rem;

        height: 0.88rem;

        font-size: .3rem;

        line-height: .45rem;

        margin: 0 auto;

        margin-top: .2rem;

    }

    .headline .player{
        margin-top: .3rem;
        width: .6rem;
        height: .6rem;
    }



    .swiper_head .swiper-pagination-bullet {

        width: .2rem !important;

        height: .04rem !important;

    }

    .swiper_head .swiper-container .swiper-pagination {

        bottom: .2rem;

    }

    .swiper_head .swiper-pagination-bullet:nth-child(2){

        margin: 0 .1rem !important;

    }

    .referral {

        padding: 0.6rem 0 .0rem;

    }

    .referral .about-title {

        width: 6.86rem;

        height: 2rem;

        font-size: .44rem;

        line-height: .6rem;

        margin-bottom: -0.5rem;

    }

    .referral .intro>div {

        width: 6.8rem;

        font-size: .26rem;

        line-height: .40rem;

        margin-right: 0px;

    }
    .referral .intro p span{
        font-size: .27rem !important;
    }

    .referral .intro ul{

        margin-top: .1rem;
        width: 100%;
        display: flex;
        justify-content: space-between;
    }

    .referral li {

        margin-left: 0px;

    }

    .referral li span {

        font-size: .6rem;

        line-height: .7rem;

    }

    .referral li:nth-child(2) span::after {

        font-size: .4rem;

        top: -.2rem;

        right: -.3rem;

    } 

    .referral li:nth-child(3) span::after {

        font-size: .4rem;

        top: -.2rem;

        right: 0rem;

    } 

    .referral li p {

        font-size: .24rem;

        margin-top: 0px;

    } 

    /* .referral li div {

        font-size: .36rem;

        right: -.24rem;

    } */

    .referral li:nth-child(2){


    }

    .referral li:nth-child(2) div{

        right: .1rem;

    }

    .referral .vidio {

        width: 6.9rem;

        height: 3.9rem;

    }

    .referral .vidio .play {

        margin-top: .7rem;

        width: 100%;

    }

    .referral .vidio .player {

        width: 1.02rem;

        height: 1.02rem;

    }

    .product {

        margin: 0 .3rem;

        width: 6.9rem;

        height: auto;

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

        background-size: cover;
        position: relative;

    }

    .product img{

        width: 6.9rem;

        height: auto;

        position: static;

        bottom: .8rem;

        left: 0;

    }

    .product p:nth-child(1) {

        width: 5.08rem;

        line-height: .7rem;

        font-size: .56rem;

        margin: 0 auto;

        margin-top: 0.7rem;

    }

    .product p:nth-child(2) {

        width: 5.92rem;

        line-height: 1.79;

        font-size: .24rem;

        color: #FFFFFF;

        text-align: center;

        margin: 0 auto;

        margin-top: .4rem;

    }

    .product ul {
        width: 100%;
        margin-top: .34rem;
        justify-content: flex-start;
    }

    .product li {

        width: 3rem;
        height: .56rem;
        font-size: .24rem;
        border: .04rem solid #A8875A;
        /* float: left; */
        margin: 0 .2rem .2rem;
    }

    .product li:nth-child(2n){
        margin-right: 0;
    }



    .product li a{

        display: block;

        line-height: .48rem;

    }





    .workshop{

        display: none;

    }

    .app_workshop{

        width: 100%;

        overflow: hidden;

        display: block;

        margin-top: .2rem;

    }

    .app_workshop .mySwiper{

        width: 6.9rem;

        height: 3.9rem;

    }

    .app_workshop .mySwiper .swiper-slide{

        position: relative;

    }

    .app_workshop .mySwiper .swiper-slide::before{

        content: '';

        position: absolute;

        left: 0;

        top: 0;

        width: 100%;

        height: 100%;

        background: linear-gradient(180deg,rgba(0,0,0,0.5),rgba(0,0,0,0.2));

        z-index: 5;

    }

    .app_workshop .mySwiper .text{

        width: 5.6rem;

        height: 0.76rem;

        font-size: .24rem;

        line-height: .37rem;

        position: absolute;

        top: .26rem;

        left: .24rem;

        color: #FFFFFF;

        z-index: 10;

    }

    .app_workshop .mySwiper img{

        position: relative;

        z-index: 1;

    }

    .app_workshop .mySwiper .player{

        width: 0.6rem;

        height: 0.6rem;

        position: absolute;

        top: 0;

        bottom: 0;

        left: 0;

        right: 0;

        margin: auto;

        z-index: 10;

    }

    .app_workshop .mySwiper .swiper-pagination .swiper-pagination-bullet{

        width: .2rem;

        height: .04rem;

        margin: 0 .1rem !important;

        opacity: 0.4;

    }







    .news {

        background: #FFFFFF;

        padding-bottom: 0px;

    }

    .news>div>P {

        margin-top: .92rem;

        width: 100%;

        height: .7rem;

        margin-bottom: .4rem;

    }

    .news>div>P>span {

        width: 2.32rem;

        height: .7rem;

        font-size: .56rem;

        line-height: .7rem;

    }

    .news>div>P>a {

        font-size: .28rem;

        width: 1.46rem;

        height: .7rem;

        line-height: .7rem;

        box-sizing: border-box;

        position: absolute;

        right: 0;

        top: .08rem;

    }

    .news>div>P>a img{

        margin-left: .1rem;

    }

    .news .left {

        width: 6.9rem;

        height: 7.12rem;

        margin-bottom: .54rem;

    }

    .news .left a{

        display: block;

        position: relative;

    }

    .news .left a::before{

        content: '';

        position: absolute;

        left: 0;

        top: 0;

        width: 100%;

        height: 100%;

        background: linear-gradient(180deg,rgba(0,0,0,0.5),rgba(0,0,0,0.2));

        z-index: 5;

    }

    .news .left img{
        height: 7.12rem;
    }


    .news .left p {

        font-size: .34rem;

        line-height: .52rem;

        bottom: .28rem;

       left: 0;

       box-sizing: border-box;

       padding: 0 .38rem;

        margin-left: 0px;

        margin-right: 0px;

        z-index: 10;

    }

    .news .right {

        width: 100%;

    }

    .news .right p {

        font-size: .3rem;

        line-height: .35rem;

    }

    .news .right .picture {

        width: 4.6rem;

        height: 2.04rem;

        float: left;

    }

    .news .right li .amplification {

        width: 2.04rem;

        height: 2.04rem;

        overflow: hidden;

        float: right;

        border-radius: 4px;

    }

    .news .right li img {

        width: 100%;

        height: 100%;

    }

    .news .right li span {

        color: #999999;

        font-size: .26rem;

    }

}