@media screen and (max-width: 767px) {
    .about{
        color: #008FD3 !important;
    }

    .banner {
        width: 100%;
        height: 177.86vw;
        margin-top: 12vw;
        background: url("../img/about-phone.png") no-repeat;
        background-size: 100% 100%;
        position: relative;
    }

    .banner h6{
        position: absolute;
        transform: translate(-50%,-50%);
        top: 50%;
        left: 50%;
        font-size: 11.73vw;
        font-family: PingFang SC;
        font-weight: 400;
        line-height: 16.53vw;
        color: #2A2E2E;
    }

    .introduction{
        width: 90%;
        margin:42.6vw auto 42.6vw;
        overflow: hidden;
    }

    .introduction ul{
        width: auto;
        overflow: hidden;
    }

    .introduction ul .introduction-left{
        width: 100%;
        height: 54.4vw;
        margin:0 auto 10vw;
        overflow: hidden;
    }

    .introduction ul .introduction-left img{
        width: 100%;
        height: 54.4vw;
    }

    .introduction ul .introduction-right{
        width: 100%;
    }

    .introduction-right h6{
        text-align: center;
        font-size: 6.4vw;
        font-family: PingFang SC;
        font-weight: bold;
        line-height: 8vw;
        color: #181D27;
        margin: 0 0 7.2vw 0;
    }

    .introduction-right p{
        font-size: 3.7vw;
        font-family: PingFang SC;
        font-weight: 400;
        line-height: 10.67vw;
        color: #5F6464;
        margin-bottom: 5.4vw;
    }

}

@media screen and (min-width: 768px) and (max-width: 895px)  {
    .about{
        color: #008FD3 !important;
    }

    .banner {
        width: 100%;
        height: 45vw;
        background: url("../img/about.png") no-repeat;
        background-size: 100% 100%;
        position: relative;
    }

    .banner h6{
        position: absolute;
        transform: translate(-50%,-50%);
        top: 50%;
        left: 50%;
        font-size: 30px;
        font-family: PingFang SC;
        font-weight: 400;
        line-height: 40px;
        color: #2A2E2E;
    }


    .introduction{
        width: 90%;
        margin:190px auto 180px;
        overflow: hidden;
    }

    .introduction ul{
        width: auto;
        overflow: hidden;
    }

    .introduction ul .introduction-left{
        width: 80%;
        margin:0 auto 80px;
        overflow: hidden;
    }

    .introduction ul .introduction-left img{
        width: 100%;
    }

    .introduction ul .introduction-right{
        width: 100%;
    }

    .introduction-right h6{
        text-align: center;
        font-size: 26px;
        font-family: PingFang SC;
        font-weight: bold;
        line-height: 40px;
        color: #181D27;
        margin: 0 0 27px 0;
    }

    .introduction-right p{
        font-size: 16px;
        font-family: PingFang SC;
        font-weight: 400;
        line-height: 24px;
        color: #5F6464;
    }


}

@media screen and (min-width: 896px) and (max-width: 1079px)  {
    .about{
        color: #008FD3 !important;
    }

    .banner {
        width: 100%;
        height: 45vw;
        background: url("../img/about.png") no-repeat;
        background-size: 100% 100%;
        position: relative;
    }

    .banner h6{
        position: absolute;
        transform: translate(-50%,-50%);
        top: 50%;
        left: 50%;
        font-size: 30px;
        font-family: PingFang SC;
        font-weight: 400;
        line-height: 62px;
        color: #2A2E2E;
    }

    .introduction{
        width: 90%;
        margin:190px auto 180px;
        overflow: hidden;
    }

    .introduction ul{
        width: auto;
        overflow: hidden;
    }

    .introduction ul .introduction-left{
        float: left;
        width: 46.55%;
    }

    .introduction ul .introduction-left img{
        width: 100%;
    }

    .introduction ul .introduction-right{
        float: right;
        width: 44%;
    }

    .introduction-right h6{
        font-size: 26px;
        font-family: PingFang SC;
        font-weight: bold;
        line-height: 40px;
        color: #181D27;
        margin: 0 0 27px 0;
    }

    .introduction-right p{
        font-size: 16px;
        font-family: PingFang SC;
        font-weight: 400;
        line-height: 24px;
        color: #5F6464;
    }


}

@media screen and (min-width: 1080px) and (max-width: 1199px) {
    .about{
        color: #008FD3 !important;
    }

    .banner {
        width: 100%;
        height: 45vw;
        background: url("../img/about.png") no-repeat;
        background-size: 100% 100%;
        position: relative;
    }

    .banner h6{
        position: absolute;
        transform: translate(-50%,-50%);
        top: 50%;
        left: 50%;
        font-size: 44px;
        font-family: PingFang SC;
        font-weight: 400;
        line-height: 62px;
        color: #2A2E2E;
        opacity: 1;
    }

    .introduction{
        width: 90%;
        margin:190px auto 180px;
        overflow: hidden;
    }

    .introduction ul{
        width: auto;
        overflow: hidden;
    }

    .introduction ul .introduction-left{
        float: left;
        width: 46.55%;
    }

    .introduction ul .introduction-left img{
        width: 100%;
    }

    .introduction ul .introduction-right{
        float: right;
        width: 44%;
    }

    .introduction-right h6{
        font-size: 36px;
        font-family: PingFang SC;
        font-weight: bold;
        line-height: 50px;
        color: #181D27;
        margin: 3px 0 27px 0;
    }

    .introduction-right p{
        font-size: 16px;
        font-family: PingFang SC;
        font-weight: 400;
        line-height: 41px;
        color: #5F6464;
    }


}

@media screen and (min-width: 1200px) {
    .about{
        color: #008FD3 !important;
    }

    .banner {
        width: 100%;
        height:480px;
        background: url("../img/about.png") no-repeat;
        background-size: 100% 100%;
        position: relative;
    }

    .banner h6{
       position: absolute;
        transform: translate(-50%,-50%);
        top: 50%;
        left: 50%;
        font-size: 44px;
        font-family: PingFang SC;
        font-weight: 400;
        line-height: 62px;
        color: #2A2E2E;
        opacity: 1;
    }

    .introduction{
        width: 1130px;
        margin:190px auto 180px;
        overflow: hidden;
    }

    .introduction ul{
        width: auto;
        overflow: hidden;
    }

    .introduction ul .introduction-left{
        float: left;
        width: 46.55%;
    }

    .introduction ul .introduction-left img{
        width: 100%;
    }

    .introduction ul .introduction-right{
        float: right;
        width: 44%;
    }

    .introduction-right h6{
        font-size: 36px;
        font-family: PingFang SC;
        font-weight: bold;
        line-height: 50px;
        color: #181D27;
        margin: 3px 0 27px 0;
    }

    .introduction-right p{
        font-size: 16px;
        font-family: PingFang SC;
        font-weight: 400;
        line-height: 41px;
        color: #5F6464;
    }


}