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

    .left,
    .right {
        float: none;
    }
    .w100 {
        width: 100%;
    }
    .d_flex {
        display: block;
    }
    .show_pc {
        display: none;
    }

    .show_wap {
        display: block;
    }

    #home_banner li {
        height: 240px;
    }

    #home_banner li img {
        display: none;
    }

    #home_banner li {
        background-position: 50% 50%;
        background-size: cover;
    }

    .page_des {
        width: 100%;
        padding: 2rem;
    }

    .page_banner {
        background-size: 100%;
        height: 220px;
    }
    header nav ul.main_box {
        display: block;
    }
    header .logo {
        width: 60%;
        padding-left: 2rem;
    }
    header .logo img {
        height: 50px;
    }

    footer {
        padding-top: 0;
    }

    .map {
        width: 100%;
        height: 300px;
    }
    .join_form {
        padding: 20px;
        margin-top: 2rem;
        padding-bottom: 0;
    }

    .join_post li {
        width: 100%;
        padding: 0;
        margin-bottom: 1rem;
    }

    .join_post .text_input {
        width: 100%;
    }

    .textarea_input {
        width: 100%;
        margin-bottom: 0;
    }

    .form-content {
        top: 0;
    }

    .contact_info li img {
        top: 8px;
    }

    .join_post label {
        margin: 0;
        width: 120px;
        margin-bottom: .5rem;
    }
    .contact_info h1 {
        font-size: 20px;
        margin-bottom: 1rem;
        padding-left: 0;
    }
    .contact_info li {
        margin-bottom: .7rem;
        padding: 1rem;
    }
    .join_tit {
        margin-bottom: 1rem;
        padding-left: 1rem;
    }
    .intro_page .content {
        width: 100%;
    }
    .join_form_submit, .join_form_reset {
        margin: 1rem 0;
        /* margin: 88px; */
    }
    header .main_box {
        margin: 0;
    }
    .search_main {
        height: 60px;
    }
    .search_box {
        display: none;
    }
    .search_box .search-input {
        width: 89%;
        float: left;
    }
    .search_box .search_submit {
        width: 10%;
        float: left;
        margin-top: 10px;
    }
    .footer_menu {
    display: flex;
    justify-content: space-between;
}
.footer_menu li {
    width: 25%;
    text-align: center;
    background-color: #f86b1b;
    color: #fff;
    font-size: 16px;
    padding: 10px 0;
}
.footer_menu li img {
    height: 3rem;
}
.footer_menu li a {
    color: #fff;
}
.serial_content .big_img {
    display: none;
}
.s_item {
    width: 100%;
}
.product_item {
    width: 50%;
    padding: 0 1%;
    margin-right: 0;
}
.f_nav {
    display: none;
}
.serial_content {
    margin-bottom: 2rem;
}
.row_title {
    padding: 15px 0 30px;
}
.row_title .p1 {
    font-size: 22px;
    margin-bottom: 5px;
}
.row_title .p2 {
    font-size: 14px;
}
.row_title .p3 {
    font-size: 14px;
}
.ocean_swiper p {
    font-size: 16px;
    line-height: 40px;
}
.ocean_box {
    height: 240px;
}
.ocean_list {
    width: 100%;
    overflow: hidden;
}
header .main_box {
    height: 60px;
}
.m_img {
    margin-bottom: 1rem;
}
 .m_img .col-md-6 {
    width: 50%;
 }
 .featurette-divider {
    padding: 2rem 0;
 }
 .index_featurette .featurette-heading, .news_box .featurette-heading {
    margin: 0;
 }
 .index_featurette .featurette-divider p.lead, .news_box .featurette-divider p.lead {
    margin-bottom: 1rem;
 }
 .news_box {
    padding-bottom: 1rem;
 }
 .foot_down {
    border-top: none;
    padding-top: 1rem;
    padding-bottom: 1rem;
    margin-top: 0;
    text-align: center;
    line-height: 30px;
 }
 .foot_down .main_box {
    border: none;
    text-align: center;
    height: auto;
    display: block;
 }
 .foot_down .right a {
    display: none;
 }
 .intro_box {
    display: block;
    margin-bottom: 2rem;
 }
 .intro_box .right {
    padding: 2rem;
 }
 .intro_title {
    margin-bottom: 1rem;
 }
 .intro_content {
    line-height: 30px;
 }
 .team_img_list li:nth-child(1) {
    padding-top: 0;
 }
 .team_box .row_title {
    padding-bottom: 2rem;
 }
 .team_img_list li p {
    line-height: 40px;
 }
 .team_img_list li:nth-child(4) {
    bottom: 0;
 }
 .brand_intro {
    margin-top: 0;
    padding-bottom: 2rem;
 }
 .brand_intro img {
    margin-top: 0;
 }
 .brand_intro .right {
    margin-left: 0;
    padding: 1rem;
 }
 .brand_intro .right .intro_content {
    line-height: 30px;
 }
 .base_page .row_title {
    padding-bottom: 2rem;
 }
 .env_box {
    padding-bottom: 2rem;
 }
.category_img {
    height: 99px;
 }
 .category_img .row_title .p1 {
    font-size: 22px;
 }
 .category_img .row_title .p2 {
    font-size: 18px;
 }
 .production_box .category_img {
    margin-bottom: 2rem;
 }
 .production_box {
    padding-bottom: 2rem;
 }
 .honor_box .category_img {
    margin-bottom: 2rem;
 }
 .honor_box {
    padding-bottom: 2rem;
 }
 .channels_box .channels_title {
    padding-top: 2rem;
 }
 .channels_box .channels_title .p1 {
    font-size: 22px;
 }
 .channels_box .channels_title .p2 {
    font-size: 18px;
 }
 .channel_contact {
    position: relative;
    padding: 2rem 1.5rem;
 }
 .channels_box {
    padding-bottom: 2rem;
 }
.page_cate_list {
    justify-content: space-between;
    padding: 0;
}
.page_cate_list li a {
    width: 100%;
}
.page_cate_list li {
    width: 48%;
    margin: 0 1%;
}
.cate_img {
    display: none;
}
.jobs_title {
    margin-bottom: 20px;
}
.progress_item {
    width: 33%;
}
.contact_main {
    display: block;
    height: auto;
    margin-bottom: 30px;
}
.contact_info {
    width: 100%;
}
.contact_info_box {padding: 15px;padding-top: 0;}
.contact_info_box .p1 {
    margin-bottom: 15px;
}
.contact_info li {
    padding: 0;
    font-size: 14px;
}
.join_content .right {
    width: 100%;
    padding: 2rem;
}
.contact_page .row_title {
    padding: 2rem 0;
}
.join_content {
    padding-top: 0;
    padding-bottom: 0;
}
.join_condition {
    padding: 2rem;
}
.ten_cate_list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.ten_cate_list a {
    padding: 3px;
}
.ten_cate_list a:nth-child(-n+2) {
    width: 50%;
}
.ten_cate_list a:nth-child(n+3) {
    width: 33.333%;
}
@media screen and (min-width:641px) {}

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

@media screen and (max-width: 376px) {
    .about_box .right li {
        padding: 13.6px 0;
    }
}

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