@media (max-width:768px) {
    .header-back {
        height: 5.5rem;
        background-color: #373d41;
        transition: all 1s ease;
    }
    .nav-container {
        width: 100%;
        font-size: 0.25rem;
        clear: both;
        display: none;
    }
    .nav-container li {
        display: block;
        line-height: 0.8rem;
        height: 0.6rem;
        color: #fff;
        cursor: pointer;
        width: 80%;
        margin: 0 auto;
        border-bottom: solid 1px #b8afaf;
    }
    .logo-container {
        float: left;
        width: 80%;
        text-align: center;
        font-size: 0.36rem;
    }
    .logo-container a {
        height: 0.9rem;
        line-height: 0.9rem;
    }
    .navbar-toggle-container {
        display: block !important;
        height: 10%;
        width: 20%;
        float: right;
    }
    .banner-item-img {
        left: 0;
        top: 0;
        position: relative;
    }
    .img-container {
        width: 3rem;
    }
    .banner-container {
        height: 6rem;
    }
    .banner-item-container {
        padding-bottom: 0;
        height: 100%;
    }
    .banner-item-container h1 {
        font-size: 0.4rem;
        top: 47%;
    }
    .banner-item-container h2 {
        top: 88%;
        font-size: 0.32rem;
    }
    .s-title {
        font-size: 0.22rem;
    }
    .introduction-container {
        width: 100%;
    }
    .introduction-left {
        width: 90%;
        margin: 0 auto;
        overflow: hidden;
        float: none;
        padding-top: 0.3rem
    }
    .introduction-title {
        text-align: center;
        padding: 0.2rem 0;
    }
    .introduction-title img {
        width: 60%;
    }
    .introduction-trail {
        margin-top: 10px;
        width: 100%;
        position: relative;
        margin-bottom: 0;
        margin-left: 0;
    }
    .introduction-right {
        width: 60%;
        float: none;
        margin: 0 auto;
        overflow: hidden;
    }
    .point1 {
        left: 7.86%;
        top: 78.8%;
    }
    .point2 {
        left: 32.46%;
        top: 62.8%;
    }
    .point3 {
        left: 51.244%;
        top: 57%;
    }
    .point4 {
        left: 76%;
        top: 43.8%;
    }
    .introduction-list {
        margin: 0 auto;
    }
    .intr3-list li {
        width: 100%;
        float: none;
    }
    /* Ʒ�� */
    .procategory-box {
        padding-top: 0.5rem;
    }
    .pro-content {
        width: 90%;
    }
    .pro-content-title .line-left,
    .pro-content-title .line-right {
        width: 10%;
    }
    .procategory-list {
        width: 90%;
        margin: 0 auto 0.2rem;
        overflow: hidden;
    }
    .procategory-list li {
        width: 48%;
        float: left;
        margin-right: 3%;
        text-align: center;
        margin-bottom: 5%;
        height: 3.2rem;
    }
    .procategory-list li:nth-child(2n) {
        margin-right: 0;
    }
    .live-container .title2 {
        font-size: 0.22rem;
    }
    .live-container p {
        font-size: 0.2rem;
        top: 70%;
    }
    .live-container p span {
        font-size: 0.32rem;
    }
    .live-img-container {
        right: 2.2%;
        top: 61%;
        width: 17%;
    }
    .live-container p {
        font-size: 0.2rem;
        line-height: 0.2rem;
        top: 81%
    }
    .live-container p span {
        font-size: 0.18rem;
    }
    .live-img-container img:last-child {
        margin-left: 0;
    }
    .framework-container {
        display: block;
    }
    .framework-container .map-container ul{
    	display: flex;
    	flex-wrap: wrap;
    	justify-content: space-between;
    	width: 100%;
    }
    .framework-container .map-container ul li{
    	width: 48%;
    	margin-right: 0px;
    }
    .framework-container .map-container ul li img{
    	width: 100%;
    	height: auto;
    }
    .m-framework-container {
        display: block;
    }
    .m-framework-container .title {
        text-align: center;
        font-size: 0.3072rem;
        margin: 0.18rem 0;
        color: #4d546a;
        font-weight: 400;
    }
    .arealist {
        width: 100%;
    }
    .arealist li {
        position: relative;
        background-color: rgba(0, 0, 0, 0.7);
        color: #fff;
        border-top: 1px solid #E0E3E5;
    }
    .areatitle {
        width: 100%;
        text-align: left;
        background-color: #305FA1;
        font-size: 0.25rem;
        line-height: 0.6rem;
        text-indent: 0.25rem;
    }
    .downarrow {
        border-width: 0 3px 3px 0;
        border-color: #fff;
        border-style: solid;
        float: right;
        width: 0.2rem;
        height: 0.2rem;
        margin-top: -0.47rem;
        transform: rotate(45deg);
        margin-right: 0.15rem;
    }
    .content-container {
        display: none;
        transition: all 1s;
    }
    .arealist li.active {
        border-top: 1px solid rgba(0, 0, 0, 0.9);
    }
    .arealist li.active .content-container {
        display: block;
    }
    .arealist li.active .areatitle {
        background-color: rgba(0, 0, 0, 0.9);
        text-align: center;
        text-indent: 0;
    }
    .arealist li.active .downarrow {
        transform: rotate(45deg);
        border-width: 3px 0 0 3px;
        margin-top: -0.33rem;
    }
    .job-text {
        font-size: 0.16rem;
    }
    .present-text {
        font-size: 0.18rem;
        line-height: 0.3rem;
        text-align: left;
        padding: 0.15rem 0.55rem;
    }
    .cooperation-container>div::after {
        content: ' ';
        display: block;
        height: 0;
        width: 0;
        clear: both;
    }
    .list-container li,
    .logistics-list-container li {
        text-align: center;
        width: 45%;
        margin-left: 5%;
        margin-top: 0.4rem;
    }
    .logistics-box {
        padding-bottom: 0.3rem;
    }
    .list-container li:nth-child(odd),
    .logistics-list-container li:nth-child(odd) {
        margin-left: 0;
    }
    .join-text {
        width: 90%;
        height: 2.4rem;
        border: 4px solid #CA4A46;
        margin: 0.6rem auto;
        position: relative;
    }
    .l-text {
        font-size: 0.9rem;
    }
    .r-text {
        font-size: 0.38rem;
    }
    .b-content {
        font-size: 0.14rem;
        line-height: 0.3rem;
    }
    .uparrow {
        width: 0.5rem;
        height: 0.5rem;
        line-height: 0.5rem;
        margin-left: -0.25rem;
    }
    .uparrow .iconfont {
        font-size: 0.2rem;
        color: #fff
    }
    .footernav {
        width: 90%;
        margin: 0 auto;
        overflow: hidden;
        padding: 4% 0 7%;
    }
    .footernav li {
        width: 33.3%;
        float: left;
        line-height: 0.38rem;
        margin-top: 10%;
    }
    .footernav img {
        margin-bottom:0;
    }
}

@media screen and (min-width:768px) and (max-width:1000px) {
    .nav-container {
        font-size: 0.13rem;
    }
    .banner-item-container:nth-of-type(1) {
        background: url('../Images/banner031.jpg') !important;
    }
    .areanav li {
        padding-right: 0.3rem;
        font-size: 0.32rem;
    }
    .point-desc-container {
        width: 4.5rem;
    }
    .area-title {
        font-size: 0.4rem;
    }
}

@media screen and (min-width:360px) and (max-width:1199px) {
    /* html,
    body {
        font-size: 100px !important;
    } */
    .nav-container {
        font-size: 0.16rem;
    }
    .banner-item-container.brandbanner {
        background: url('../Images/banner001.jpg') !important;
    }
}

@media screen and (min-width:1200px) and (max-width:1439px) {
    .nav-container {}
    .banner-item-container.brandbanner {
        background: url('../Images/banner0111.jpg') !important;
    }
}

@media screen and (min-width:1440px) and (max-width:1600px) {
    .nav-container {
        font-size: 0.32rem;
    }
    .banner-item-container.brandbanner {
        background: url('../Images/banner001.jpg') !important;
    }
    .banner-item-container h1 {
        top: 45.5%
    }
    .banner-item-container {
        padding-bottom: 50%;
    }
}

@media screen and (min-width:1920px) and (max-width:2120px) {
    .nav-container {
        font-size: 0.32rem;
    }
    .banner-item-container.brandbanner {
        background: url('../Images/banner001.jpg') !important;
    }
    .banner-item-container h1 {
        top: 46%
    }
}