@media (max-width: 767px)
{
    .carousel-item {
        height: 200px;
    }

    .carousel-item img {
        height: 200px;
        object-fit: cover;
    }

    .banner-desc-box {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 80%;
        height: 100%;
        transform: translate(-50%, -50%);
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }


    .banner-desc-box-title {
        font-size: 30px;
        font-weight: 300;
        color: #FFFFFF;
        text-align: center;
    }

    .banner-desc-box-content {
        font-size: 16px;
        color: #FFFFF5;
        text-align: center;
    }

    .head-box-row {
        margin-bottom: 20px;
        padding: 0 10px;
    }

    .head-box {
        width: 100%;
        max-width: 1300px;
        padding: 20px 0;
        margin: auto;
        /*border-bottom: 1px solid #DFE4EA;*/
    }

    .head-box-title {
        font-family: SailecBold;
        font-size: 32px;
    }

    .head-box-title h1{
        font-family: SailecBold;
        font-size: 32px;
    }

    .head-box-nav {
        margin-top: 20px;
        display: flex;
        align-items: center;
        gap: 10px;
        color: #5a6a78;
    }

    .head-box-nav img {
        width: 17px;
        height: auto;
    }


    .intro-box {
        width: 100%;
        max-width: 1300px;
        margin: 20px auto;
    }

    .intro-list {
        display: grid;
        grid-template-columns:repeat(3, 1fr);
        gap: 20px;
    }

    .intro-item-title {
        font-family: SailecBold;
        font-size: 20px;
        font-weight: 700;
        margin-top: 20px;
    }

    .intro-item-title h3{
        font-family: SailecBold;
        font-size: 20px;
    }

    .intro-item-content {
        font-size: 16px;
        color: #333333;
        font-weight: 300;
    }

    .intro-item-img img {
        width: 59px;
        height: auto;
    }

    .f0f0f0 {
        background-color: #f0f0f0;
    }

    .line {
        width: 100%;
        max-width: 1300px;
        margin: 50px auto;
        border-bottom: 1px solid #DFE4EA
    }

    .environment-box {
        width: 100%;
        max-width: 1300px;
        margin: 50px auto;
        padding: 0 10px;
    }

    .environment-list {
        display: grid;
        grid-template-columns:repeat(1, 1fr);
        gap: 20px;
    }

    .environment-item-img img {
        width: 100%;
        height: auto;
    }

    .environment-item-title {
        font-size: 14px;
        margin-top: 20px;
        text-align: center;
    }

    .explore-box {
        width: 100%;
        max-width: 1300px;
        margin: 50px auto;
        padding: 0 10px;
    }

    .explore-title {
        font-family: SailecBold;
        font-size: 28px;
        padding: 0 0 20px 0;
    }

    .explore-content {
        font-family: sailecRegular;
        font-size: 20px;
        font-weight: 300;
    }

    .quote-btn {
        display: block;
        height: 50px;
        border-radius: 34px !important;
        background: #FB7306;
        padding: 10px 20px;
        color: #ffffff;
        border: 0;
        margin: auto;
    }

    .quote-btn img {
        margin-left: 10px;
    }

    .margin-50 {
        margin: 50px 0;
    }

    .materials-bg {
        background: url("/images/jinhong/factory_product_bg.jpg") no-repeat;
        background-size: cover;
        /*背景 cover*/
        width: 100%;
        margin: 50px 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .materials-box {
        width: 100%;
        max-width: 1300px;
        margin: auto;
        padding: 20px 10px;
    }

    .materials-title {
        font-family: SailecBold;
        font-size: 40px;
        color: #ffffff;
    }

    .materials-title h2{
        text-align: center;
    }

    .materials-content {
        margin-top: 50px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.7);
        padding: 20px 20px;
        display: grid;
        grid-template-columns:repeat(1, 1fr);
        gap: 50px;
    }

    .materials-item-title {
        font-size: 20px;
        font-weight: 700;
        height: 48px;
    }

    .materials-item-title h3{
        font-size: 20px;
        font-family: SailecBold;
    }

    .materials-item-content {
        margin-top: 20px;
        font-size: 16px;
        color: #333333;
        font-weight: 300;
    }


    .factory-pic-box {
        margin: 50px 0 80px;
    }

    .factory-pic-title {
        font-family: SailecBold;
        font-size: 28px;
        font-weight: 700;
        margin: 0 auto 20px;
        width: 100%;
        max-width: 1300px;
    }

    .factory-pic-title h2{
        text-align: center;
    }

    .factory-pic-list{
        overflow: hidden;
        /*display: flex;*/
        /*justify-content: flex-start;*/
        /*align-items: center;*/
        /*gap: 20px;*/
    }

    .swiper-wrapper-factory {
        display: flex !important;
        justify-content: flex-start;
        align-items: center;
    }

    .factory-pic-item{
        height: 400px !important;
    }

    .factory-pic-item img{
        width: 100%;
        height: auto;
    }

    .materials-more{
        margin-top: 50px;
    }

    .materials-more-text{
        color: #FFFFFF;
        text-align: center;
        margin-top:20px;
    }
}

@media (min-width: 768px) and (max-width: 1365px)
{
    .banner-desc-box {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }


    .banner-desc-box-title {
        font-size: 30px;
        font-weight: 300;
        color: #FFFFFF;
        text-align: center;
    }

    .banner-desc-box-content {
        font-size: 16px;
        color: #FFFFF5;
        width: 50%;
        text-align: center;
    }

    .head-box-row {
        /*margin-bottom: 20px;*/
    }

    .head-box {
        width: 100%;
        max-width: 1300px;
        padding: 45px 15px;
        margin: auto;
        /*border-bottom: 1px solid #DFE4EA;*/
    }

    .head-box-title {
        font-family: SailecBold;
        font-size: 32px;
    }

    .head-box-title h1{
        font-family: SailecBold;
        font-size: 32px;
    }

    .head-box-nav {
        margin-top: 20px;
        display: flex;
        align-items: center;
        gap: 10px;
        color: #5a6a78;
    }

    .head-box-nav img {
        width: 17px;
        height: auto;
    }


    .intro-box {
        width: 100%;
        max-width: 1300px;
        margin: 20px auto;
    }

    .intro-list {
        display: grid;
        grid-template-columns:repeat(3, 1fr);
        gap: 20px;
    }

    .intro-item-title {
        font-family: SailecBold;
        font-size: 20px;
        font-weight: 700;
        margin-top: 20px;
    }

    .intro-item-title h3{
        font-family: SailecBold;
        font-size: 20px;
    }

    .intro-item-content {
        font-size: 16px;
        color: #333333;
        font-weight: 300;
    }

    .intro-item-img img {
        width: 59px;
        height: auto;
    }

    .f0f0f0 {
        background-color: #f0f0f0;
    }

    .line {
        width: 100%;
        max-width: 1300px;
        margin: 20px auto;
        border-bottom: 1px solid #DFE4EA
    }

    .environment-box {
        width: 100%;
        max-width: 1300px;
        margin: 0px auto 50px;
        padding:0 15px;
    }

    .environment-list {
        display: grid;
        grid-template-columns:repeat(2, 1fr);
        gap: 20px;
    }

    .environment-item-img img {
        width: 100%;
        height: auto;
    }

    .environment-item-title {
        font-size: 14px;
        margin-top: 20px;
        text-align: center;
    }

    .explore-box {
        width: 100%;
        max-width: 1300px;
        margin: 50px auto;
        padding: 15px;
    }

    .explore-title {
        font-family: SailecBold;
        font-size: 28px;
        padding: 0 0 20px 0;
    }

    .explore-content {
        font-family: sailecRegular;
        font-size: 20px;
        font-weight: 300;
    }

    .quote-btn {
        display: block;
        height: 50px;
        border-radius: 34px !important;
        background: #FB7306;
        padding: 10px 20px;
        color: #ffffff;
        border: 0;
        margin: auto;
    }

    .quote-btn img {
        margin-left: 10px;
    }

    .margin-50 {
        margin: 50px 0;
    }

    .materials-bg {
        background: url("/images/jinhong/factory_product_bg.jpg") no-repeat;
        background-size: cover;
        /*height: 600px;*/
        width: 100%;
        margin: 50px 0;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 20px 15px;
    }

    .materials-box {
        width: 100%;
        max-width: 1300px;
        margin: auto;
    }

    .materials-title {
        font-family: SailecBold;
        font-size: 40px;
        color: #ffffff;
    }

    .materials-title h2{
        text-align: center;
    }

    .materials-content {
        margin-top: 50px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.7);
        padding: 20px 50px;
        display: grid;
        grid-template-columns:repeat(3, 1fr);
        gap: 50px;
    }

    .materials-item-title {
        font-size: 20px;
        font-weight: 700;
        height: 48px;
    }

    .materials-item-title h3{
        font-size: 20px;
        font-family: SailecBold;
    }

    .materials-item-content {
        margin-top: 20px;
        font-size: 16px;
        color: #333333;
        font-weight: 300;
    }


    .factory-pic-box {
        margin: 50px 0 50px;
        padding: 0 15px;
    }

    .factory-pic-title {
        font-family: SailecBold;
        font-size: 28px;
        font-weight: 700;
        margin: 0 auto 20px;
        width: 100%;
        max-width: 1300px;
    }

    .factory-pic-title h2{
        text-align: center;
    }

    .factory-pic-list{
        overflow: hidden;
        /*display: flex;*/
        /*justify-content: flex-start;*/
        /*align-items: center;*/
        /*gap: 20px;*/
    }

    .swiper-wrapper-factory {
        display: flex !important;
        justify-content: flex-start;
        align-items: center;
    }

    .factory-pic-item{
        height: 300px !important;
    }

    .factory-pic-item img{
        width: 100%;
        height: auto;
    }

    .materials-more{
        margin-top: 20px;
    }

    .materials-more-text{
        color: #FFFFFF;
        text-align: center;
        margin-top:20px;
    }
}

@media (min-width: 1366px)
{
    .banner-desc-box {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }


    .banner-desc-box-title {
        font-size: 30px;
        font-weight: 300;
        color: #FFFFFF;
        text-align: center;
    }

    .banner-desc-box-content {
        font-size: 16px;
        color: #FFFFF5;
        width: 50%;
        text-align: center;
    }

    .head-box-row {
        margin-bottom: 20px;
    }

    .head-box {
        width: 100%;
        max-width: 1300px;
        padding: 45px 0;
        margin: auto;
        /*border-bottom: 1px solid #DFE4EA;*/
    }

    .head-box-title {
        font-family: SailecBold;
        font-size: 32px;
    }

    .head-box-title h1{
        font-family: SailecBold;
        font-size: 32px;
    }

    .head-box-nav {
        margin-top: 20px;
        display: flex;
        align-items: center;
        gap: 10px;
        color: #5a6a78;
    }

    .head-box-nav img {
        width: 17px;
        height: auto;
    }


    .intro-box {
        width: 100%;
        max-width: 1300px;
        margin: 50px auto;
    }

    .intro-list {
        display: grid;
        grid-template-columns:repeat(3, 1fr);
        gap: 20px;
    }

    .intro-item-title {
        font-family: SailecBold;
        font-size: 20px;
        font-weight: 700;
        margin-top: 20px;
    }

    .intro-item-title h3{
        font-family: SailecBold;
        font-size: 20px;
    }

    .intro-item-content {
        font-size: 16px;
        color: #333333;
        font-weight: 300;
    }

    .intro-item-img img {
        width: 59px;
        height: auto;
    }

    .f0f0f0 {
        background-color: #f0f0f0;
    }

    .line {
        width: 100%;
        max-width: 1300px;
        margin: 50px auto;
        border-bottom: 1px solid #DFE4EA
    }

    .environment-box {
        width: 100%;
        max-width: 1300px;
        margin: 50px auto;
    }

    .environment-list {
        display: grid;
        grid-template-columns:repeat(2, 1fr);
        gap: 20px;
    }

    .environment-item-img img {
        width: 100%;
        height: auto;
    }

    .environment-item-title {
        font-size: 14px;
        margin-top: 20px;
        text-align: center;
    }

    .explore-box {
        width: 100%;
        max-width: 1300px;
        margin: 50px auto;
    }

    .explore-title {
        font-family: SailecBold;
        font-size: 28px;
        padding: 0 0 20px 0;
    }

    .explore-content {
        font-family: sailecRegular;
        font-size: 20px;
        font-weight: 300;
    }

    .quote-btn {
        display: block;
        height: 50px;
        border-radius: 34px !important;
        background: #FB7306;
        padding: 10px 20px;
        color: #ffffff;
        border: 0;
        margin: auto;
    }

    .quote-btn img {
        margin-left: 10px;
    }

    .margin-50 {
        margin: 50px 0;
    }

    .materials-bg {
        background: url("/images/jinhong/factory_product_bg.jpg") no-repeat;
        background-size: 100%;
        height: 600px;
        width: 100%;
        margin: 50px 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .materials-box {
        width: 100%;
        max-width: 1300px;
        margin: auto;
    }

    .materials-title {
        font-family: SailecBold;
        font-size: 40px;
        color: #ffffff;
    }

    .materials-title h2{
        text-align: center;
    }

    .materials-content {
        margin-top: 50px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.7);
        padding: 20px 50px;
        display: grid;
        grid-template-columns:repeat(3, 1fr);
        gap: 50px;
    }

    .materials-item-title {
        font-size: 20px;
        font-weight: 700;
        height: 48px;
    }

    .materials-item-title h3{
        font-size: 20px;
        font-family: SailecBold;
    }

    .materials-item-content {
        margin-top: 20px;
        font-size: 16px;
        color: #333333;
        font-weight: 300;
    }


    .factory-pic-box {
        margin: 50px 0 80px;
    }

    .factory-pic-title {
        font-family: SailecBold;
        font-size: 28px;
        font-weight: 700;
        margin: 0 auto 20px;
        width: 100%;
        max-width: 1300px;
    }

    .factory-pic-title h2{
        text-align: center;
    }

    .factory-pic-list{
        overflow: hidden;
        /*display: flex;*/
        /*justify-content: flex-start;*/
        /*align-items: center;*/
        /*gap: 20px;*/
    }

    .swiper-wrapper-factory {
        display: flex !important;
        justify-content: flex-start;
        align-items: center;
    }

    .factory-pic-item{
        height: 400px !important;
    }

    .factory-pic-item img{
        width: 100%;
        height: auto;
    }

    .materials-more{
        margin-top: 50px;
    }

    .materials-more-text{
        color: #FFFFFF;
        text-align: center;
        margin-top:20px;
    }
}