.mobile {
    display: none;
}

.pc {
    display: block;
}

@media (max-width:640px) {

    .pc {
        display: none;
    }

    .container {
        width: 96%;
    }

    .mobile,
    .bottoming {
        display: block;
    }

    .fluid {
        padding: 30px 0;
    }

    .pc,
    .top-fluid,
    .footer-box1,
    .footer-box2 {
        display: none;
    }

    .header-fluid {
        padding-top: 0;
    }

    .logo-box {
        padding: 10px 5px;
    }

    .logo-box .logo img {
        height: 50px;
    }

    .logo-tel {
        display: block;
    }

    .logo-tel a {
        display: block;
        padding: 4px 5px;
        color: #fff;
        background: #1855a5;
        border-radius: 4px;
        overflow: hidden;
        ;
    }

    .logo-tel a i.iconfont {
        margin-right: 3px;
    }

    .navbar .nav ul,
    .about {
        flex-wrap: wrap;
    }

    .navbar,
    .header,
    .logo-box,
    .about-info,
    .about-img,
    .news-left,
    .news-right,
    .news-item,
    .footer-box3 {
        width: 100%;
    }

    .navbar {
        background: #1855a5;
    }

    .navbar .nav {
        border-top: 1px solid #afc1ee;
    }

    .navbar .nav ul>li {
        width: 25%;
        border-right: 1px solid #afc1ee;
        border-bottom: 1px solid #afc1ee;
        padding: 0;
    }

    .navbar .nav ul>li>a {
        display: block;
        width: 100%;
        text-align: center;
        line-height: 35px;
        font-size: 15px;
        color: #fff;

    }

    .navbar .nav ul>li:nth-of-type(4n) {
        margin-right: 0;
    }

    .main-title .line {
        margin: 3px auto;
    }

    .about-info {
        margin-top: 20px;
    }

    .product-item,

    .hzdw-item,
    .hzdw-item:nth-of-type(5n) {
        width: calc(50% - 5px);
        margin-right: 10px;
        margin-bottom: 10px;
    }

    .solution-item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 10px;
    }

    .hzdw-item:nth-of-type(2n),
    .product-item:nth-of-type(2n) {
        margin-right: 0;
    }

    .product-item a .info .title {
        font-size: 14px;
        line-height: 30px;
    }

    .solution-item a .info {
        padding: 0 4px;
    }

    .solution-item a .info p {
        font-size: 15px;
        line-height: 35px;
        height: 35px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

    .MOREW,
    .MORE {
        margin-top: 20px;
    }

    .news-left {
        display: none;
    }

    .news-left .news-more {
        margin-top: 20px;
    }

    .news-item {
        margin-right: 0;
    }

    .footer-fluid {
        padding: 20px 0;
    }

    .footer-box .title {
        margin-bottom: 20px;
        font-size: 23px;
    }

    .footer-box3 .footer-contact .info {
        width: calc(100% - 110px);
        font-size: 15px;
        line-height: 1.8;
    }

    .footer-ewm {
        width: 100px;
    }

    .footer-bottom-fluid {
        padding-bottom: 68px;
    }

    .footer-bottom {
        font-size: 12px;
        line-height: 20px;
    }

    .sub-wraper-fluid {
        padding: 20px 0;
    }

    .sub-contact-list .item {
        width: 100%;
        padding: 15px;
    }

    .sub-title h2 {
        font-size: 22px;
    }

    .sub-title p {
        font-size: 14px;
        line-height: 20px;
    }

    .sub-title {
        margin-bottom: 20px;
    }

    .sub-content {
        font-size: 16px;
    }

    .sub-application-item .img {
        width: 100%;
    }

    .sub-application-item .info {
        width: 100%;
        padding-top: 0;
        padding: 20px 10px 20px 0;
    }

    .sub-application-item:nth-of-type(2n+1) .info {
        padding-right: 0;
    }

    .sub-application-item:nth-of-type(2n) .info {
        text-align: left;
        padding-left: 0;
    }

    .sub-application-item .info .title::after {
        left: 0;
        right: auto;
    }

    .case-item,
    .case-item:nth-of-type(3n) {
        width: calc(50% - 5px);
        margin-right: 10px;
        margin-bottom: 10px;
    }

    .case-item:nth-of-type(2n) {
        margin-right: 0;
    }

    .case-item a .info .title {
        line-height: 30px;
        font-size: 14px;
    }

    .sub-banner {
        height: auto;
    }

    .sub-banner img {
        display: block;
        width: 100%;
    }

    .sub-contact-box .sub-contact-title {
        font-size: 22px;
    }
  
}

@media (max-width:330px) {
    .logo-box .logo img {
        height: 40px;
    }
}