@media screen and (min-width: 786px) and (max-width:1600px) {
    .content {
        padding:0 1.2rem;
        max-width: 1440px
    }

    .swiper_content {
        padding: 10px 1.2rem;
        max-width: 1460px
    }

    .category_intro .main {
        background-position-y: 160px
    }

    .category_intro .main ul {
        gap: 200px 0
    }

    .home_banner .news {
        right: 0
    }

    .qualification_main .main ul {
        gap: 3rem 2rem
    }
}

@media screen and (min-width: 786px) and (max-width:1440px) {
    .content {
        max-width:1220px
    }

    .swiper_content {
        max-width: 1240px
    }

    .about_history .main::after {
        top: 28%
    }

    .linecard_box .main ul {
        grid-template-columns: repeat(5,1fr)
    }

    .category_intro .main {
        background-position-y: 120px
    }

    .category_intro .main ul {
        gap: 120px 0
    }

    .procure_management .content {
        height: 1000px;
        padding-top: 4rem
    }

    .certificates .certificate .con {
        padding-top: 2rem
    }

    .certificates .certificate .con p {
        font-size: 20px;
        line-height: 1.5
    }

    .category_main .main ul li i {
        width: 3.5rem;
        min-width: 3.5rem
    }

    .category_main .main ul li {
        gap: 1rem;
        padding: 3rem 1rem 2rem
    }

    .category_main .main ul li strong {
        font-size: 26px;
        line-height: 1.5
    }

    .category_main .main ul li p {
        font-size: 18px;
        line-height: 1.5
    }
}

@media screen and (min-width: 786px) and (max-width:1220px) {
    .content {
        max-width:1000px
    }

    .swiper_content {
        max-width: 1020px
    }

    header .header_main nav div>ul {
        gap: 2rem
    }

    .about_history .main ul li {
        padding-left: 1.6rem
    }

    .about_history .main ul li strong {
        font-size: 2rem
    }

    .about_history .main ul li p {
        font-size: 1rem;
        line-height: 1.5
    }

    .applications .application .img {
        width: 180px
    }

    .linecard_box .main ul,.partnum_box .main ul {
        grid-template-columns: repeat(4,1fr);
        gap: 1rem
    }

    .category_intro .main {
        background-position-y: 110px
    }

    .category_intro .main ul {
        gap: 120px 0
    }

    .category_intro .main ul li i {
        width: 4rem
    }

    .category_intro .main ul li strong {
        font-size: 2rem
    }

    .category_intro .main ul li p {
        font-size: 1rem;
        line-height: 1.5
    }

    .category_intro .bottom {
        margin-top: 5rem;
        width: 100%
    }

    .category_main .main ul {
        gap: 1rem
    }

    .locations .location .info strong {
        font-size: 22px;
        line-height: 1.5;
        padding-left: 1.2rem
    }

    .locations .location .info strong::before {
        width: 1rem;
        top: 0
    }

    .procure_management ul li {
        font-size: 1rem;
        line-height: 1.5
    }

    .quality_system .main .flex {
        display: block
    }

    .quality_system .imgs {
        width: 100%
    }

    .product_application .main ul {
        grid-template-columns: repeat(3,1fr)
    }

    .qacenter_equipment .main ul {
        gap: 2rem 1rem
    }

    .qualification_main .main ul {
        gap: 2rem 1rem
    }

    .certificates .certificate .con p {
        font-size: 1rem
    }

    .sourcing_advantage .intro li {
        padding-bottom: 2rem;
        margin-top: 2rem
    }

    .ssdtp_test .main ul li {
        padding: 1rem
    }

    .ssdtp_test .main ul li i {
        width: 3rem;
        min-width: 3rem
    }

    .ssdtp_test .main ul li h3 {
        font-size: 22px;
        line-height: 1.5
    }

    .ssdtp_practice .main ul li {
        width: 24%
    }
}

@media screen and (min-width: 786px) and (max-width:1000px) {
    .content {
        max-width:786px
    }

    .swiper_content {
        max-width: 806px
    }

    header .header_main .logo img {
        width: 150px
    }

    header .header_main .right {
        gap: 1.6rem
    }

    header .header_main nav div>ul {
        gap: 1.4rem
    }

    header .header_main .btns a {
        padding: 4px 1rem 5px;
        zoom:.8}

    header .header_main nav div>ul>li>a {
        font-size: 1rem
    }

    .about_intro .nums li i,.home_about .nums li i {
        width: 4rem;
        height: 4rem
    }

    .about_intro .nums li span,.home_about .nums li span {
        font-size: 2rem
    }

    .about_intro .nums li p,.home_about .nums li p {
        font-size: 1rem
    }

    .about_overview .content>.flex {
        flex-direction: column
    }

    .applications .application .con {
        display: block
    }

    .applications .application .con .img {
        width: 100%;
        aspect-ratio: 2/1
    }

    .blog_main .main ul {
        grid-template-columns: repeat(2,1fr)
    }

    .linecard_box .main ul,.partnum_box .main ul {
        grid-template-columns: repeat(3,1fr)
    }

    .career_advantage .flex {
        flex-direction: column-reverse
    }

    .career_advantage .img {
        min-height: unset
    }

    .category_intro .main {
        background-position-y: 180px
    }

    .category_intro .main ul {
        gap: 50px 0
    }

    .category_main .main ul {
        grid-template-columns: repeat(2,1fr)
    }

    .contact_main .main .flex {
        display: block
    }

    .contact_main .main .inquiry_form {
        width: 100%;
        margin-top: 4rem;
        max-width: 600px
    }

    .contact_location .main .locations {
        grid-template-columns: repeat(2,1fr)
    }

    .culture_value .main {
        display: block
    }

    .culture_value .main .img {
        width: 100%
    }

    .culture_value .main .intro {
        max-width: 100%;
        margin-top: 4rem
    }

    .culture_gallery .main ul li {
        border-radius: 10px
    }

    .home_banner .head {
        padding-top: 0
    }

    .home_canwedo .main .flex {
        flex-direction: column-reverse
    }

    .home_canwedo .main .flex .imgs {
        width: 100%
    }

    .home_canwedo .main .flex .left {
        width: 100%;
        margin-top: 4rem
    }

    .home_application .main .nav li {
        padding-left: 1rem
    }

    .location_main .main .locations {
        grid-template-columns: repeat(2,1fr)
    }

    .post_main form input[type="submit"] {
        font-size: 14px;
        height: 4rem
    }

    .procure_system .main ul li .img {
        max-width: 120px
    }

    .procure_system .main .line {
        top: 190px
    }

    .procure_management .middle {
        font-size: 2rem;
        line-height: 1.5;
        width: 32%
    }

    .product_preview .img,.product_preview .infos {
        flex: 1
    }

    .product_preview .quote {
        width: 100%;
        margin-top: 3rem
    }

    .product_application .main ul {
        grid-template-columns: repeat(2,1fr)
    }

    .product_component table tbody tr td {
        font-size: 1rem;
        line-height: 1.5
    }

    .qacenter_equipment .main ul {
        grid-template-columns: repeat(2,1fr)
    }

    .qualification_main .main ul {
        grid-template-columns: repeat(2,1fr)
    }

    .security_test .flex {
        display: block
    }

    .security_test .flex .right {
        margin-top: 4rem;
        width: 100%
    }

    .sourcing_advantage .main {
        display: block
    }

    .ssdtp_test .main ul {
        grid-template-columns: repeat(2,1fr)
    }

    .ssdtp_darabase .flex {
        display: block
    }

    .ssdtp_darabase .flex .img {
        width: 100%;
        margin-top: 4rem
    }
}
