@media (min-width:480px){
    
    .banner{
        position: relative;
    }
    .banner .bannerBox{
        position: absolute;
        width: 100%;
        top: 113px;
        left: 0;
    }
    .banner .bannerBox .bannerBoxTitle{
        font-size: 90px;
        font-weight: bold;
        text-align: center;
        color: #fff;
    }
    .banner .bannerBox .bannerBoxSubtitle{
        font-size: 70px;
        font-weight: bold;
        text-align: center;
        color: #fff;
    }
    .banner .bannerBox .bannerBoxText{
        width: 629px;
        margin:26px auto 0;
        color: #fff;
        background: linear-gradient(91deg, #05EFFF 0%, #05BBFF 78%);
        font-size: 40px;
        border-radius: 50px;
        text-align: center;
        padding: 10px 0;
    }
    .banner .bannerImg{
        width: 100%;
    }
    .banner .bannerBox img{
        width: 392px;
        display: block;
        margin: 457px auto 0;
    }


    .brand{
        width: 690px;
        height: 201px;
        background: #FFFFFF;
        box-shadow: 0px 5px 13px 0px rgba(30,33,50,0.1);
        border-radius: 26px;
        margin:81px auto 0;
        padding: 34px;
    }
    .brand img{
        width: 485px;
        margin:0 auto 41px;
        display: block;
    }
    .brand ul{
        display: flex;
        justify-content: center;
    }
    .brand ul li:nth-child(1){
        background: #FF8628;
        border-radius: 9px;
        font-size: 32px;
        font-weight: bold;
        color: #FFFFFF;
        padding: 13px 23px;
    }
    .brand ul li:nth-child(2){
        background: #377DFF;
        border-radius: 9px;
        font-size: 32px;
        font-weight: bold;
        color: #FFFFFF;
        padding: 13px 23px;
        margin:0 19px;
    }
    .brand ul li:nth-child(3){
        background: #FC6B57;
        border-radius: 9px;
        font-size: 32px;
        font-weight: bold;
        color: #FFFFFF;
        padding: 13px 23px;
    }

    .about{
        margin-top: 43px;
        position: relative;
    }
    .about img{
        width: 750px;
    }
    .about .aboutBox{
        position: absolute;
        top: 77px;
        width: 100%;
        left: 0;
    }
    .about .aboutBox div{
        font-size: 28px;
        font-weight: 400;
        color: #222222;
        width: 623px;
        padding-top: 36px;
        margin:26px auto 0;
        line-height: 1.8;
        border-top: 1px dashed rgba(60, 63, 80, 0.23);
    }

    .list{
        margin-top: 53px;
    }
    .list ul{
        display: flex;
        flex-wrap: wrap;
        padding: 0 30px;
        margin-top: 70px;
    }
    .list li{
        flex:  0 0 25%;
        text-align: center;
    }
    .list li p{
        margin-bottom: 42px;
        font-size: 28px;
        font-weight: 500;
        color: #222222;
    }
    .list ul img{
        width: 121px;
        margin-bottom: 27px;
    }


    .advantage .commomTitle{
        margin-bottom: 40px;
    }
    .advantage ul{
        width: 683px;
        margin:0 auto;
        background: #FFFFFF;
        box-shadow: 0px 0px 51px 0px rgba(30,33,50,0.1);
        border-radius: 10px;
    }
    .advantage ul{
        margin-bottom: 29px;
        padding: 46px;
        display: flex;
        align-items: center;
    }
    .advantage img{
        height: 136px;
        margin-right: 33px;
    }
    .advantage .title{
        font-size: 32px;
        font-weight: bold;
        color: #006CFF;
        margin-bottom: 20px;
    }
    .advantage .subtitle{
        font-size: 20px;
        font-weight: 400;
        color: #222222;
        line-height: 1.8;
        opacity: 0.9;
    }


    .commentBox{
        width: 690px;
        border-radius: 10px;
        background-color: #006CFF;
        margin:32px auto 0;
        padding: 24px 10px 10px;
        position: relative;
    }
    .commentBox .commentBoxTitle{
        font-size: 34px;
        font-weight: 400;
        color: #FFFFFF;
    }
    .commentBox .bg{
        width:670px;
    }
    .commentBox>div{
        margin-top: 20px;
        position: relative;
    }
    .commentBox>div>div{
        position: absolute;
        top: 0;
        left: 0;
    }
    .commentBox ul{
        display: flex;
        margin-top: 77px;
        padding-bottom: 40px;
        border-bottom: 1px solid rgba(216, 23, 53, 0.21);
    }
    .commentBox ul:last-child{
        border-bottom: none;
    }
    .commentBox .title{
        width: 195px;
        height: 60px;
        border-radius: 10px;
        background-image: url('../img/title_bg.png');
        background-size: 100% 100%;
        font-size: 27px;
        font-weight: bold;
        color: #FFFFFF;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .commentBox .subtitle{
        font-size: 26px;
        font-weight: 400;
        color: #222222;
        margin-left: 45px;
        margin-right: 45px;
        position: relative;
    }
    .commentBox .subtitle::before{
        content:"";
        position: absolute;
        top: 10px;
        left: -26px;
        display: block;
        width: 16px;
        height: 16px;
        background-image: url('../img/icon.png');
        background-size: 100% 100%;
    }
    .commentBox .subtitle::after{
        content:"";
        position: absolute;
        bottom: -26px;
        right: -26px;
        display: block;
        width: 188px;
        height: 28px;
        background-image: url('../img/bodily_5_2.png');
        background-size: 100% 100%;
    }

    .company{
        position: relative;
    }
    .companyBox{
        position: absolute;
        top: 164px;
        left: 0;
        width: 100%;
    }
    .company .companyBox .commomTitle span{
        color: #FFFFFF;
    }
    .company .companyBox .companyBoxTitle{
        font-size: 24px;
        font-weight: 400;
        color: #FFFFFF;
        text-align: center;
        margin-top: 24px;
    }
    .company .companyBox ul{
        display: flex;
        justify-content: center;
        margin-top: 54px;
    }
    .company .companyBox ul li:nth-child(2){
        margin:0 26px;
    }
    .companyBox>img{
        width: 392px;
        display: block;
        margin:65px auto 0;
    }
    .companyBox .commomSubtitle{
        color: #fff;
    }
}
@media (max-width:480px){
    .banner{
        position: relative;
    }
    .banner .bannerBox{
        position: absolute;
        width: 100%;
        top: 56px;
        left: 0;
    }
    .banner .bannerBox .bannerBoxTitle{
        font-size: 40px;
        font-weight: bold;
        text-align: center;
        color: #fff;
    }
    .banner .bannerBox .bannerBoxSubtitle{
        font-size: 29px;
        font-weight: bold;
        text-align: center;
        color: #fff;
    }
    .banner .bannerBox .bannerBoxText{
        width: 315px;
        margin:13px auto 0;
        color: #fff;
        background: linear-gradient(91deg, #05EFFF 0%, #05BBFF 78%);
        font-size: 24px;
        border-radius: 50px;
        text-align: center;
        padding: 10px 0;
    }
    .banner .bannerImg{
        width: 100%;
    }
    .banner .bannerBox img{
        width: 196px;
        display: block;
        margin: 229px auto 0;
    }


    .brand{
        width: 345px;
        background: #FFFFFF;
        box-shadow: 0px 5px 13px 0px rgba(30,33,50,0.1);
        border-radius: 26px;
        margin:30px auto 0;
        padding: 34px;
    }
    .brand img{
        width: 242px;
        margin:0 auto 21px;
        display: block;
    }
    .brand ul{
        display: flex;
        justify-content: center;
    }
    .brand ul li:nth-child(1){
        background: #FF8628;
        border-radius: 9px;
        font-size: 12px;
        font-weight: bold;
        color: #FFFFFF;
        padding: 6px 12px;
    }
    .brand ul li:nth-child(2){
        background: #377DFF;
        border-radius: 9px;
        font-size: 12px;
        font-weight: bold;
        color: #FFFFFF;
        padding: 6px 12px;
        margin:0 10px;
    }
    .brand ul li:nth-child(3){
        background: #FC6B57;
        border-radius: 9px;
        font-size: 12px;
        font-weight: bold;
        color: #FFFFFF;
        padding: 6px 12px;
    }

    .about{
        margin-top: 43px;
        position: relative;
    }
    .about img{
        width: 100%;
    }
    .about .aboutBox{
        position: absolute;
        top: 39px;
        width: 100%;
        left: 0;
    }
    .about .aboutBox div{
        font-size: 14px;
        font-weight: 400;
        color: #222222;
        width: 312px;
        padding-top: 18px;
        margin:13px auto 0;
        line-height: 1.8;
        border-top: 1px dashed rgba(60, 63, 80, 0.23);
    }

    .list{
        margin-top: 27px;
    }
    .list ul{
        display: flex;
        flex-wrap: wrap;
        padding: 0 26px;
        margin-top: 35px;
    }
    .list li{
        flex:  0 0 25%;
        text-align: center;
    }
    .list li p{
        margin-bottom: 20px;
        font-size: 14px;
        font-weight: 500;
        color: #222222;
    }
    .list ul img{
        width: 60px;
        margin-bottom: 14px;
    }


    .advantage .commomTitle{
        margin-bottom: 40px;
    }
    .advantage ul{
        width: 342px;
        margin:0 auto;
        background: #FFFFFF;
        box-shadow: 0px 0px 51px 0px rgba(30,33,50,0.1);
        border-radius: 10px;
    }
    .advantage ul{
        margin-bottom: 14px;
        padding: 20px;
        display: flex;
        align-items: center;
    }
    .advantage img{
        height: 68px;
        margin-right: 16px;
    }
    .advantage .title{
        font-size: 18px;
        font-weight: bold;
        color: #006CFF;
        margin-bottom: 8px;
    }
    .advantage .subtitle{
        font-size: 14px;
        font-weight: 400;
        color: #222222;
        line-height: 1.8;
        opacity: 0.9;
    }


    .commentBox{
        width: 345px;
        border-radius: 10px;
        background-color: #006CFF;
        margin:32px auto 0;
        padding: 24px 10px 10px;
        position: relative;
    }
    .commentBox .commentBoxTitle{
        font-size: 16px;
        font-weight: 400;
        color: #FFFFFF;
    }
    .commentBox .bg{
        width:330px;
    }
    .commentBox>div{
        margin-top: 20px;
        position: relative;
    }
    .commentBox>div>div{
        position: absolute;
        top: 0;
        left: 0;
    }
    .commentBox ul{
        display: flex;
        margin-top: 37px;
        padding-bottom: 20px;
        border-bottom: 1px solid rgba(216, 23, 53, 0.21);
    }
    .commentBox ul:last-child{
        border-bottom: none;
    }
    .commentBox .title{
        width: 97px;
        height: 30px;
        border-radius: 10px;
        background-image: url('../img/title_bg.png');
        background-size: 100% 100%;
        font-size: 12px;
        font-weight: bold;
        color: #FFFFFF;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .commentBox .subtitle{
        font-size: 12px;
        font-weight: 400;
        color: #222222;
        margin-left: 20px;
        margin-right: 20px;
        position: relative;
    }
    .commentBox .subtitle::before{
        content:"";
        position: absolute;
        top: 5px;
        left: -16px;
        display: block;
        width: 10px;
        height: 10px;
        background-image: url('../img/icon.png');
        background-size: 100% 100%;
    }
    .commentBox .subtitle::after{
        content:"";
        position: absolute;
        bottom: -8px;
        right: -16px;
        display: block;
        width: 94px;
        height: 14px;
        background-image: url('../img/bodily_5_2.png');
        background-size: 100% 100%;
    }


    .company>img{
        width: 100%;
    }
    .company{
        position: relative;
    }
    .companyBox{
        position: absolute;
        top: 76px;
        left: 0;
        width: 100%;
    }
    .company .companyBox .commomTitle span{
        color: #FFFFFF;
    }
    .company .companyBox .companyBoxTitle{
        font-size: 24px;
        font-weight: 400;
        color: #FFFFFF;
        text-align: center;
        margin-top: 24px;
    }
    .company .companyBox ul{
        display: flex;
        justify-content: center;
        margin-top: 27px;
    }
    .company .companyBox ul li:nth-child(2){
        margin:0 26px;
    }
    .company .companyBox ul li img{
        width: 89px;
    }
    .companyBox>img{
        width: 196px;
        display: block;
        margin:33px auto 0;
    }
    .companyBox .commomSubtitle{
        color: #fff;
    }
}