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

    body .chat-warn,
    body .chatBox {
        display: none !important
    }

    body #app {
        overflow-x: hidden
    }

    body #app .wapChatICON {
        display: inline-block;
        bottom: 1rem
    }

    body #app .header {
        display: none
    }

    body #app .footer {
        margin-top: 1.5rem
    }

    body #app .footer .phone {
        font-size: 12px;
    }

    body #app .headerForH5 {
        display: flex
    }

    body #app .labelTitle {
        max-width: 92%
    }

    body #app .description {
        font-size: .99rem !important
    }

    body #app .description .zh_desc span i {
        width: 14px;
        height: 14px
    }

    body #app .banner {
        min-width: 360px
    }

    body #app .banner li {
        padding: 2rem .9rem;
        height: 10rem;
        color: #fff;
        display: flex;
        flex-flow: column;
        justify-content: center;
        align-items: center
    }

    body #app .banner li .title {
        font-size: 2.15rem;
        font-weight: 600
    }

    body #app .banner li .description {
        margin-top: .5rem;
        font-weight: 400;
        font-size: .9rem;
        text-align: left;
        max-width: 90%
    }

    body #app .banner .swiper-wrapper {
        height: 250px;
        color: #fff
    }

    body #app .banner .swiper-wrapper .swiper-slide {
        display: flex;
        flex-flow: column;
        justify-content: center;
        align-items: center
    }

    body #app .banner .swiper-wrapper .swiper-slide .title {
        font-size: 2.15rem;
        font-weight: 600
    }

    body #app .banner .swiper-wrapper .swiper-slide .description {
        margin-top: .5rem;
        font-weight: 400;
        font-size: .9rem;
        text-align: left;
        max-width: 90%
    }

    body #app .home .service7-14,
    body #app .home .services {
        padding: 0
    }

    body #app .home .service7-14 .labelTitle,
    body #app .home .services .labelTitle {
        font-size: 1.4rem;
        padding: .9rem 0
    }

    body #app .home .service7-14 .itemsList .line,
    body #app .home .services .itemsList .line {
        flex-flow: column
    }

    body #app .home .service7-14 .itemsList .line .item,
    body #app .home .services .itemsList .line .item {
        flex: 1;
        margin: .5rem 0;
        position: inherit;
        height: 15rem;
        width: 100%
    }

    body #app .home .service7-14 .itemsList .line .item .text,
    body #app .home .services .itemsList .line .item .text {
        position: inherit;
        max-width: 80%
    }

    body #app .home .industry {
        padding: 0;
        margin: 0
    }

    body #app .home .industry .labelTitle {
        font-size: 1.4rem;
        padding: .9rem
    }

    body #app .home .industry .itemsList {
        max-width: 100%;
        margin: 0;
        padding: 0 .8rem
    }

    body #app .home .industry .itemsList .item {
        margin: .5rem .25rem
    }

    body #app .home .industry .itemsList .item .title {
        font-size: .89rem
    }

    body #app .home .industry .itemsList .item img {
        width: 2.5rem
    }

    body #app .industryPage .newslist {
        width: auto;
        padding: 0 .5rem
    }

    body #app .industryPage .newslist .news {
        display: flex;
        flex-flow: column;
        padding: .5rem 0;
        margin-top: .5rem
    }

    body #app .industryPage .newslist .news .img {
        flex: 1;
        width: auto;
        margin: 0;
        max-height: 12.5rem;
        background-size: cover !important
    }

    body #app .industryPage .newslist .news .info {
        flex: 1
    }

    body #app .industryPage .newslist .news .info .title {
        font-size: 1.8rem;
        margin: .5rem 0
    }

    body #app .industryPage .newslist .news .info .description {
        font-size: .9rem;
        line-height: 1.45rem;
        margin: .5rem 0
    }

    body #app .service .step {
        padding: 0
    }

    body #app .service .step .labelTitle {
        max-width: 100%;
        font-size: 18px
    }

    body #app .service .one .cases {
        max-width: 100%;
        flex-wrap: wrap;
        padding: 0;
        margin: 0
    }

    body #app .service .one .cases li {
        margin: .9rem 0 0;
        width: 100%
    }

    body #app .service .one .cases li img {
        width: 100%;
        max-height: 13rem;
        object-fit: cover
    }

    body #app .service .two {
        margin: .96rem
    }

    body #app .service .two .cases {
        max-width: 100%;
        margin: 0 auto;
        padding: 0
    }

    body #app .service .two .cases li {
        width: 100%;
        margin: .5rem 0
    }

    body #app .service .five,
    body #app .service .four,
    body #app .service .three {
        flex-flow: column
    }

    body #app .service .five .left,
    body #app .service .four .left,
    body #app .service .three .left {
        min-height: 15rem;
        width: 100%;
        padding: 0;
        background-position: center center
    }

    body #app .service .five .right,
    body #app .service .four .right,
    body #app .service .three .right {
        align-items: center;
        min-height: 15rem;
        padding: 0;
        width: 100%;
        background-position: center center
    }

    body #app .service .five .right .description,
    body #app .service .four .right .description,
    body #app .service .three .right .description {
        width: 100%
    }

    body #app .service .three .right .description {
        max-width: 98%
    }

    body #app .service .four {
        padding: 0
    }

    body #app .service .four .left {
        padding: .9rem;
        min-height: 0
    }

    body #app .service .four .left .labelTitle {
        text-align: center
    }

    body #app .service .four .left .secondTitle {
        padding-left: .9rem
    }

    body #app .service .four .left .description {
        padding: 0 .9rem
    }

    body #app .service .four .right .cases {
        display: inline-block;
        max-width: 100%;
        margin: 0 auto;
        padding: 0
    }

    body #app .service .four .right .cases li {
        width: 100%;
        height: inherit;
        padding: .5rem .9rem;
        margin: .9rem 0
    }

    body #app .service .four .right .cases li .info img {
        max-width: 3rem
    }

    body #app .service .five .left {
        align-items: center
    }

    body #app .service .five .left .description {
        max-width: 98%
    }

    body #app .service .banner .crm .title {
        font-size: 22px;
        padding: .5rem;
        line-height: 26px
    }

    body #app .service .banner .crm .description {
        margin: 0;
        text-align: center;
        padding: 0
    }

    body #app .service .items .item {
        padding: 1rem 0
    }

    body #app .service .items .item .labelTitle {
        font-size: 1.8rem
    }

    body #app .service .items .item.write p {
        display: flex;
        flex-flow: column;
        line-height: 1.8rem
    }

    body #app .service .items .item.write p .img,
    body #app .service .items .item.write p span {
        flex: 1;
        max-width: 98%;
        margin: .5rem auto
    }

    body #app .service .items .item .description {
        max-width: 100%;
        padding: 0 .9rem;
        line-height: 1.4rem;
        margin: 0
    }

    body #app .service .cases,
    body #app .service .clients {
        padding: .9rem
    }

    body #app .service .cases .labelTitle,
    body #app .service .clients .labelTitle {
        font-size: 1.8rem;
        margin-top: .9rem
    }

    body #app .service .cases .description,
    body #app .service .clients .description {
        margin: 0
    }

    body #app .service .cases .caseItems,
    body #app .service .clients .caseItems {
        flex-flow: column
    }

    body #app .service .cases .caseItems li,
    body #app .service .clients .caseItems li {
        max-width: 100%;
        width: auto;
        flex: 1;
        margin: .9rem 0
    }

    body #app .service .cases .caseItems li img,
    body #app .service .clients .caseItems li img {
        max-height: 18rem
    }

    body #app .service .clients .list img {
        max-width: 8rem;
        margin: 0 .5rem;
        align-items: center
    }

    body #app .aboutUs .content .labelTitle {
        margin: 0;
        padding: 0;
        font-size: 1.8rem
    }

    body #app .aboutUs .content .story {
        margin: 0
    }

    body #app .aboutUs .content .story .description {
        padding: 0;
        margin: 0;
        display: flex;
        flex-flow: column;
        line-height: 1.4rem
    }

    body #app .aboutUs .content .story .description .img {
        flex: 1;
        width: 100%;
        max-height: 20rem;
        margin: .5rem 0
    }

    body #app .aboutUs .content .story .description p {
        padding: 0 .9rem;
        margin: .5rem 0;
        word-wrap: break-word
    }

    body #app .aboutUs .content .otherItem .item {
        padding: .5rem;
        max-height: 18rem;
        justify-content: center
    }

    body #app .aboutUs .content .otherItem .item .labelTitle {
        word-wrap: normal
    }

    body #app .aboutUs .content .otherItem .description {
        margin: 0;
        max-width: 100%;
        padding: 0;
        font-size: 1.2rem
    }

    body #app .jobs .weOffer {
        margin: .9rem 0;
        padding: .5rem
    }

    body #app .jobs .weOffer .job {
        width: auto;
        padding: .9rem 0
    }

    body #app .jobs .weOffer .job img {
        width: 3rem
    }

    body #app .jobs .weOffer .job .title {
        font-size: 1.4rem
    }

    body #app .jobs .weOffer .job .description {
        margin: 0
    }

    body #app .jobs .jobsList {
        width: auto;
        padding: 0 .9rem
    }

    body #app .jobs .jobsList li .title {
        font-size: 1.4rem;
        display: flex;
        flex-flow: column;
        justify-content: flex-start;
        text-align: left
    }

    body #app .jobs .jobsList li .title .address {
        margin: .5rem 0 0;
        text-align: left
    }

    body #app .jobs .jobsList li .title .address img {
        width: 10px
    }

    body #app .jobs .jobsList li .wapChat {
        display: inline-block;
        bottom: .5rem
    }

    body #app .jobs .jobsList li .imBtn {
        bottom: .5rem;
        display: none
    }

    body #app .contactUs .labelTitle {
        font-size: 1.8rem
    }

    body #app .contactUs .info {
        padding: .9rem
    }

    body #app .contactUs .info .description {
        max-width: 90%
    }

    body #app .contactUs .address {
        padding: .9rem 3rem;
        flex-flow: column;
        justify-content: flex-start
    }

    body #app .contactUs .address .title {
        font-size: 1.4rem
    }

    body #app .contactUs .address .title img {
        width: 1rem
    }

    body #app .contactUs .textForm {
        height: auto;
        padding: 20px;
        box-sizing: border-box;
    }

    body #app .contactUs .textForm .formBox {
        position: relative;
        top: 0;
        left: 0;
        margin-left: 0;
        width: 100%;
        height: auto;
        padding: 20px 40px;
    }

    body #app .contactUs .textForm .formBox .titles {
        font-size: 20px;
    }

    body #app .contactUs .textForm .formBox .bottom {
        flex-wrap: wrap;
        margin-top: 20px;
    }

    body #app .contactUs .textForm .formBox .bottom .right {
        padding: 0 0 0 10px;
        width: 100%;
    }

    body #app .contactUs .textForm .formBox .bottom .left {
        padding: 0 10px 0 40px;
        width: 100%;
        border: none;
        margin-bottom: 20px;
    }

    body #app .contactUs .textForm .formBox .bottom .left .item .t1 {
        font-size: 12px;
    }

    body #app .contactUs .textForm .formBox .bottom .left .item .p {
        font-size: 12px;
    }

    body #app .contactUs .textForm .formBox .bottom .right .send {
        width: 100%;
    }

    body #app .contactUs .textForm .formBox .bottom .PC {
        display: none;
    }

    body #app .contactUs .textForm .formBox .bottom .H5 {
        display: block;
    }

    body #app .contactUs .bannerImg {
        height: 224px;
        object-fit: cover;
    }
}

@media screen and (min-width:700px) and (max-width:1000px) {
    body #app .header .subMenu {
        width: 100%;
        left: 0
    }

    body #app .home .service7-14 .itemsList .line .item,
    body #app .home .services .itemsList .line .item {
        position: inherit
    }

    body #app .home .service7-14 .itemsList .line .item .text,
    body #app .home .services .itemsList .line .item .text {
        position: inherit;
        max-width: 80%
    }

    body #app .home .industry .labelTitle {
        padding: .9rem
    }

    body #app .home .industry .itemsList {
        max-width: 100%
    }

    body #app .home .industry .itemsList .item {
        margin: 1rem
    }

    body #app .home .industry .itemsList .item img {
        width: 4rem
    }

    body #app .industryPage .newslist {
        width: auto;
        padding: 0 1rem
    }

    body #app .industryPage .newslist .news img {
        width: 20rem;
        height: 10rem
    }

    body #app .service .one {
        padding: .9rem
    }

    body #app .service .one .cases {
        max-width: 100%;
        margin: .5rem auto
    }

    body #app .service .one .cases li img {
        width: 18rem
    }

    body #app .service .two {
        padding: .9rem
    }

    body #app .service .two .cases {
        max-width: 100%;
        margin: 0 auto
    }

    body #app .service .four {
        padding: 0
    }

    body #app .service .four .left {
        padding: .5rem
    }

    body #app .service .four .cases {
        display: inline-block;
        max-width: 100%;
        margin: 0 auto
    }

    body #app .service .four .cases li {
        height: 200px
    }

    body #app .service .four .cases li .info .title {
        text-align: left
    }

    body #app .service .items .item {
        padding: 1rem 0
    }

    body #app .service .items .item .description {
        max-width: 100%;
        padding: 0 .9rem
    }

    body #app .service .cases,
    body #app .service .clients {
        padding: .9rem
    }

    body #app .service .cases .labelTitle,
    body #app .service .clients .labelTitle {
        margin-top: .9rem
    }

    body #app .service .cases .description,
    body #app .service .clients .description {
        margin: 0
    }

    body #app .service .cases .caseItems li,
    body #app .service .clients .caseItems li {
        width: 100%;
        margin: .9rem 0
    }

    body #app .service .cases .caseItems li .avatar .title,
    body #app .service .clients .caseItems li .avatar .title {
        padding: .9rem .5rem
    }

    body #app .service .cases .caseItems li img,
    body #app .service .clients .caseItems li img {
        height: 15rem
    }

    body #app .service .clients .list img {
        margin: .5rem
    }

    body #app .aboutUs .content .labelTitle {
        margin: 0;
        padding: .9rem 0 0
    }

    body #app .aboutUs .content .story {
        margin: .9rem
    }

    body #app .aboutUs .content .otherItem .description {
        margin: 0;
        max-width: 80%;
        padding: .9rem 0
    }

    body #app .jobs .weOffer {
        margin: .9rem 0;
        padding: .5rem
    }

    body #app .jobs .weOffer .job {
        width: auto
    }

    body #app .jobs .jobsList {
        width: auto;
        padding: .9rem
    }

    body #app .contactUs .textForm {
        height: auto;
        padding: 20px;
        box-sizing: border-box;
    }

    body #app .contactUs .textForm .formBox {
        position: relative;
        top: 0;
        left: 0;
        margin-left: 0;
        width: 100%;
        height: auto;
        padding: 20px 40px;
    }

    body #app .contactUs .textForm .formBox .titles {
        font-size: 30PX;
    }

    body #app .contactUs .textForm .formBox .bottom .right {
        padding: 0 0 0 20px;
    }

    body #app .contactUs .textForm .formBox .bottom .left {
        padding: 0 20px 0 20px;
    }

    body #app .contactUs .textForm .formBox .bottom .left .item .t1 {
        font-size: 14px;
    }

    body #app .contactUs .textForm .formBox .bottom .left .item .p {
        font-size: 14px;
    }

    body #app .contactUs .info {
        padding: .9rem
    }

    body #app .contactUs .info .description {
        max-width: 90%
    }

    body #app .contactUs .address {
        padding: .9rem 3rem;
        flex-flow: column;
        justify-content: flex-start
    }
}

@media screen and (min-width:1100px) and (max-width:1600px) {
    body #app .service .cases .caseItems li {
        width: 16.5rem;
        margin: .5rem .35rem
    }
}

@media screen and (min-width:1000px) and (max-width:1300px) {
    body #app .aboutUs .content .story {
        margin: 0 5rem
    }

    body #app .header .subMenu {
        width: 100%;
        left: 0
    }
}