﻿@charset "utf-8";
/* CSS Document */
/*all*/

/* =============== 全局断点设置 =============== */
@media screen and (max-width: 1800px) {
    /* 布局调整 */
    .warp {
        padding: 0 70px;
        max-width: 100%;
    }
    
    
    
    
}

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

    :root {
        --font-size-xs: 1.4rem; /* 超小字体 */
        --font-size-sm: 1.6rem; /* 小字体 */
        --font-size-md: 1.8rem; /* 中等字体 */
        --font-size-ld: 2rem; /* 中等字体 */
        --font-size-lh: 2.2rem; /* 中等字体 */
        --font-size-lg: 2.4rem; /* 大字体 */
        --font-size-ls: 2.6rem; /* 大字体 */
        --font-size-lx: 3rem; /* 大字体 */
        --font-size-x: 3.6rem; /* 超大字体 */
        --font-size-xl: 4.8rem; /* 超大字体 */
        --font-size-xlx: 5.4rem; /* 超大字体 */

    }


    .warp,.warp2 {
        padding: 0 60px;
    }

    /* 导航菜单 */
    .header nav a{
        margin: 0px 10px
    }

    .fo_left .info {
        gap: 100px;
        grid-row-gap: 40px;
    }


    
}

@media screen and (max-width: 1500px) {
    /* 布局调整 */
    .warp,.warp2{
        padding: 0 50px;
    } 
    .copyright {
        padding-top: 15px;
        display: initial;
    }
    .copyright p{
        display: inline-block;
        padding-right: 20px;
    }
    .copyright a {
        display: inline-block;
        line-height: 30px;
    }
}
@media screen and (max-width: 1400px) {
    
    :root {
        --font-size-xs: 1.4rem; /* 超小字体 */
        --font-size-sm: 1.6rem; /* 小字体 */
        --font-size-md: 1.8rem; /* 中等字体 */
        --font-size-ld: 2rem; /* 中等字体 */
        --font-size-lh: 2rem; /* 中等字体 */
        --font-size-lg: 2.2rem; /* 大字体 */
        --font-size-ls: 2.4rem; /* 大字体 */
        --font-size-lx: 2.6rem; /* 大字体 */
        --font-size-x: 3.2rem; /* 超大字体 */
        --font-size-xl: 4rem; /* 超大字体 */
        --font-size-xlx: 5rem; /* 超大字体 */

    }

    .warp,.warp2{
        padding: 0 40px;
    }

    .header nav a {
        margin: 0px 6px;
    }

   
    .play {  
        right: 40px;
        bottom: 40px;
    }
    .footer {
        padding: 50px 0 0px 0;
    }
    .fo_left,.fo_right{
        width: 100%;
    }
    .fo_right{
        padding-top: 50px;
    }
    .fo_left nav{
        gap: 60px;
    }
    .fo_left .info {
        gap: 50px;
        grid-row-gap: 40px;
    }
    
}

@media screen and (max-width: 1200px) {
    .warp,
    .warp2 {
        padding: 0 30px;
    }
    :root {
        --font-size-xs: 1.4rem; /* 超小字体 */
        --font-size-sm: 1.6rem; /* 小字体 */
        --font-size-md: 1.8rem; /* 中等字体 */
        --font-size-ld: 1.8rem; /* 中等字体 */
        --font-size-lh: 2rem; /* 中等字体 */
        --font-size-lg: 2rem; /* 大字体 */
        --font-size-ls: 2.4rem; /* 大字体 */
        --font-size-lx: 2.6rem; /* 大字体 */
        --font-size-x: 3.2rem; /* 超大字体 */
        --font-size-xl: 4rem; /* 超大字体 */
        --font-size-xlx: 5rem; /* 超大字体 */

    }
    /* 布局调整 */
   
    .fo_left nav{
        gap: 40px;
    }
    
    
}


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

    :root {
        --font-size-xs: 1.4rem; /* 超小字体 */
        --font-size-sm: 1.6rem; /* 小字体 */
        --font-size-md: 1.8rem; /* 中等字体 */
        --font-size-ld: 1.8rem; /* 中等字体 */
        --font-size-lh: 2rem; /* 中等字体 */
        --font-size-lg: 2rem; /* 大字体 */
        --font-size-ls: 2.4rem; /* 大字体 */
        --font-size-lx: 2.6rem; /* 大字体 */
        --font-size-x: 3.2rem; /* 超大字体 */
        --font-size-xl: 4rem; /* 超大字体 */
        --font-size-xlx: 5rem; /* 超大字体 */

    }


    #hamburger { display: block !important; }
    .bottomlist{
        display: block;
    }
    .footer{
        margin-bottom: 51px;
    }
    .header,.inside .header, .faside .header{
        position: fixed;
        width: 100%;
        z-index: 8;
        top: 0;
        border-bottom: none;
        box-shadow: 0 0 10px rgba(0,0,0,0.2);
        background-color: #fff;
    }
    .header .logo{
        padding: 15px 0;
    }
    .header nav{
        display: none;
    }
    .banner .info {
        max-width: 380px;
    }
    .fo_left,.fo_right{
        width: 100%;
    }
    .fo_right{
        padding-top: 30px;
    }

}

@media screen and (max-width: 840px) {
    
    :root {
        
        --font-size-xs: 1.4rem; /* 超小字体 */
        --font-size-sm: 1.6rem; /* 小字体 */
        --font-size-md: 1.8rem; /* 中等字体 */
        --font-size-ld: 1.8rem; /* 中等字体 */
        --font-size-lh: 2rem; /* 中等字体 */
        --font-size-lg: 2rem; /* 大字体 */
        --font-size-ls: 2.2rem; /* 大字体 */
        --font-size-lx: 2.4rem; /* 大字体 */
        --font-size-x: 3.2rem; /* 超大字体 */
        --font-size-xl: 3.6rem; /* 超大字体 */
        --font-size-xlx: 5rem; /* 超大字体 */

    }

    
    /* 布局调整 */
    .warp,
    .warp2 {
        padding: 0 30px;
    }
    .banner .info {
        max-width: 360px;
    }
    .fo_left .info{
        grid-template-columns: 1fr 1fr;
        gap: 40px;
    }
    .fo_left .info .item:nth-child(3){
        display: none;
    }
    .fo_left .info .item:last-child p:first-child{
        display: none;
    }
    
}

@media screen and (max-width: 640px) {
    /* 排版系统 */
    :root {
        --font-size-xs: 1.4rem; /* 超小字体 */
        --font-size-sm: 1.6rem; /* 小字体 */
        --font-size-md: 1.6rem; /* 中等字体 */
        --font-size-ld: 1.8rem; /* 中等字体 */
        --font-size-lh: 2rem; /* 中等字体 */
        --font-size-lg: 2rem; /* 大字体 */
        --font-size-ls: 2rem; /* 大字体 */
        --font-size-lx: 2rem; /* 大字体 */
        --font-size-x: 2.8rem; /* 超大字体 */
        --font-size-xl: 3.2rem; /* 超大字体 */
        --font-size-xlx: 5rem; /* 超大字体 */

    }
    
    /* 布局调整 */
    .warp,
    .warp2 {
        padding: 0 30px;
    }
    .banner .info {
        max-width: 300px;
    }

    .footer {
        padding: 40px 0 0px 0;
    }
    
    .fo4 img{
        padding-top: 50px;
    }
    .fo_left nav{
        gap: 15px;
    }

    .fo_left .info{
        
        gap: 20px;
    }
    
}


@media screen and (max-width: 460px) {
    /* 布局调整 */
    :root {
       --font-size-xs: 1.4rem; /* 超小字体 */
        --font-size-sm: 1.6rem; /* 小字体 */
        --font-size-md: 1.6rem; /* 中等字体 */
        --font-size-ld: 1.6rem; /* 中等字体 */
        --font-size-lh: 1.8rem; /* 中等字体 */
        --font-size-lg: 1.8rem; /* 大字体 */
        --font-size-ls: 2rem; /* 大字体 */
        --font-size-lx: 2rem; /* 大字体 */
        --font-size-x: 2.4rem; /* 超大字体 */
        --font-size-xl: 3.2rem; /* 超大字体 */
        --font-size-xlx: 5rem; /* 超大字体 */
    }

    .warp,
    .warp2 {
        padding: 0 20px;
    }

    
    .copyright{
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .copyright p{
        text-align: left;
    }

    .fo_left nav{
        gap: 10px;
    }
}

/* =============== 移动端优先断点 =============== */
/* 375px断点保留作为扩展点 */


/*首页*/


@media screen and (max-width: 1600px) {
    .ip1 {    
        background-size: 1100px;
        padding: 85px 0;
    }
    .ip5_right .item{
        padding: 55px 0;
    }
    .ip5_right .item:first-child{
        padding-top: 40px;
    }
}

@media screen and (max-width: 1400px) {
    .ip1 {    
        background-size: 900px;
        padding: 85px 0 30px 0;
    }
    .tit h2,.ip5 .title h2 {
        padding-bottom: 25px; 
    }
    .ip1_list .tit {
        padding-bottom: 50px;
    }

    .ip1_list .hor {
        padding-top: 75px;
    }

    .ip2 {
        padding: 100px 0;
    }
    .ip2 .tit {
        padding-bottom: 60px;
    }
    .ip2_list { 
        grid-gap: 20px;
    }
    .ip3,.ip4,.ip5{
        padding: 60px 0;
    }
    .ip3,.ip4{
        height: 800px;
    }

    .ip3 .tit b,.ip4 .tit b{
        padding-bottom: 50px;
    }
    .ip5 .title{
        padding-bottom: 50PX;
    }

    .ip5_list{
        gap: 50px;
    }

    

    .ip5_right .item a .txt h4{
        margin-bottom: 20px;
    }

    
    
}

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

    .ip1 {    
        background-size:700px;
        padding: 85px 0  10px 0;
    }

    .ip3, .ip4 {
        height: 650px;
    }
    .ip5_right .item {
        padding: 20px 0 35px 0;
    }

    .ip5_list {
        gap: 40px;
    }

    .ip5_left .info {
        padding: 50px 30px;
        gap: 50px;
    }
    .ip5_right .item:first-child {
        padding-top: 15px;
    }
        
}


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

    .ip1{
        background: #fcfefb;
        padding: 50px 0 10px 0;
    }
    .banner { 
        margin-top: 102px;
    }
    .banners{
        margin-top: 102px;
    }
    .ip1_s{
        display: block;
    }
    .ip2 {
        padding: 60px 0;
    }
    
    .show{
        display:none;
    }
    .hide{
        display: block;
    }
    .ip3, .ip4 {
        height: 560px;
    }

    .ip5_list{
        grid-template-columns: 1fr;
    }
    .ip5_left .img img{
        width: 100%;
    }
    

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

    
    .ip3, .ip4 {
        height: 500px;
    }
    .ip2 {
        padding: 50px 0;
    }

    .ip2 .tit {
        padding-bottom: 45px;
    }
    .ip3, .ip4, .ip5 {
        padding: 50px 0;
    }
    
}

@media screen and (max-width: 640px) {
    
    
    .ip2_list {
        grid-template-columns: 1fr 1fr;
    }
    
    .new_link a {
        padding: 10px 17px;
    }
    
    
}

@media screen and (max-width: 420px) {
   
    .banner .info {
        width: 100%;
    }
    .banner .info h4 {        
        margin-top: 20px;
    }
    .play {
        right: 20px;
        bottom: 20px;
    }
    .play a span {
        font-size: 60px;
        color: #fff;
    }

    .ip5_left .info{
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
}

/*about*/
@media screen and (max-width: 1600px) {
    .banners, .banners2{
        height: 700px;
    }
    
}



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

    .banners, .banners2{
        height: 600px;
    }
    .ab1{
        padding: 110px 0  150px 0;
    }
    
    .ab1_right{
        padding-left: 30px;
    }
    .ab3_list{
        gap: 60px;
        margin-top: 60px;
    }
    .ab3_list .item{
        grid-template-columns: 9fr 4fr;
        gap: 60px;
    }

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

    .banners, .banners2{
        height: 540px;
    }
    .ab1{
        padding: 60px 0 100px 0;
    }
    .ab1 .warp2{
        flex-wrap: wrap;
    }
    .ab1_left .tit {
        padding-bottom: 60px;
    }
    .ab1_left{
        width: 100%;
    } 
    .ab1_right{
        transform: translateY(0px);
        margin-bottom: 0px;
        padding-left: 0;
        padding-top: 30px;
    }

    .ab2 {
        padding: 80px 0 140px 0;
    }

    .ab3_list .item {
        grid-template-columns: 3fr 2fr;
        gap: 60px;
    }

    .ab3_list .item .txt h4{
        font-size: 140px;
    }
    .ab3_list .item .txt{
        padding: 40px 0 ;
    }
    

}
@media screen and (max-width: 1000px) {
    
    .ab2 .txt {
        padding-top: 70px;
    }
    .ab3 {
        padding: 80px 0;
        
    }
    .ab2 .txt p {
        margin-top: 40px;
    }

    .ab3_list .item .txt b { 
        padding-bottom: 25px;
        padding-top: 45px;
    }
        
}

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

    .banners, .banners2{
        height: 440px;
    }
    
    .ab1_list {
        padding-top: 40px;
    }
    .ab3_list .item {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .ab3_list .item .img{
        height: 400px;
    }
    .ab3_list .item .txt {
        padding: 10px 0;
    }
    
}

@media screen and (max-width: 640px) {
    .ab1 {
        padding: 60px 0 ;
    }
    .ab1_left .tit {
        padding-bottom: 50px;
    }
    .banners, .banners2{
        height: 400px;
    }
    .ab1_list .tip {
        padding-top: 0px;
        padding-bottom: 20px;
    }
    .ab1_list {
       
        display: grid;
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .ab1_list .item {
        flex-direction: column-reverse;
    }
    .ab2 {
        padding: 60px 0 100px 0;
    }

    .ab3_list .item .txt h4 {
        font-size: 100px;
    }
}

@media screen and (max-width: 460px) {
   .ab1,.ab3 {
        padding:50px 0 ;
    }
    .ab2 {
        padding: 50px 0 80px 0;
    }
    
    .banners, .banners2 {
        height: 300px;
    }
}

/*jingyi*/
@media screen and (max-width: 1200px) {
    .pro1 {
        padding: 80px 0;
    }
    .pro1 .warp2 {
        grid-template-columns: 210px auto;
        grid-gap: 30px;
    }
    
}

@media screen and (max-width: 1100px) {
    .pro_box {
        
        grid-template-columns: repeat(3,1fr);
        gap: 25px;
       
    }
}
@media screen and (max-width: 1000px) {
    .pro1 {
        padding: 60px 0;
    }
   .pro1 .warp2 {
        grid-template-columns:1fr;
        grid-gap: 30px;
    }
    .pro_list{
        display: none;

    }
    
    /* .pro1_left{
        display: none;
    } */
}
@media screen and (max-width: 840px) {
    .pro1 {
        padding: 50px 0;
    }
    
}
@media screen and (max-width: 640px) {
    .pro_box {
        grid-template-columns: repeat(2,1fr);
       
    }
    .Pagination { 
        padding-top: 30px;
    }
}
@media screen and (max-width: 460px) {
    .pro_box {
        grid-template-columns: repeat(1,1fr);
       
    }
    .pro_box a img{
        width: 100%;
    }

    
}

/*case*/
@media screen and (max-width:1600px){
    .case1 {
        padding: 100px 0 100px 50px;
        display: grid;
        grid-template-columns: 260px calc(100% - 310px);
        grid-gap: 50px;
    }
}
@media screen and (max-width:1400px){
    .case1 {
        padding: 80px 0 80px 50px;
        grid-template-columns: 210px calc(100% - 240px);
        grid-gap: 30px;
       
    }
    
}
@media screen and (max-width: 1000px) {
    .case1 {
        grid-template-columns: 100%;
        grid-gap: 30px;
        padding: 60px 0 60px 50px;
    }
    
}
@media screen and (max-width: 640px) {
    
    .case1{
        padding:50px  30px;
    }
    .case1 .swiper-slide {
        padding-bottom: 60px;
    }
}


/*news*/

@media screen and (max-width:1400px){
    .news1 {
        padding: 80px 0;
    }
    .new_box {
        gap: 50px;
    }
}
@media screen and (max-width: 1200px) {
    .news1 .warp2 {
        grid-template-columns: 210px auto;
        grid-gap: 30px;
    }
    .new_box {
        gap: 30px;
    }
   
}
@media screen and (max-width: 1000px) {
    .news1 {
        padding: 60px 0;
    }
    .news1 .warp2 {
        grid-template-columns: 1fr;
        grid-gap: 30px;
    }
    
}

@media screen and (max-width: 640px) {
    .news1 {
        padding: 50px 0;
    }
    .new_box {
        grid-template-columns: 1fr;
        gap:40px;
    }
}


/*newsshow*/
@media screen and (max-width:1400px){
    .in_news .banners{
        height:250px;
    }
}
@media screen and (max-width: 1200px) {
    .newsshow .tit .dot {
        padding-top: 40px;
    }
    .newsshow .txt {
        padding: 50px 0px;
        
    }

    .newsshow .btn { 
        margin-top: 40px;
        padding: 0px 0;
    }
    
}
@media screen and (max-width: 1024px) {
    
    .newsshow .tit2,.newsshow .btn{ padding:40px 20px;}  
    .newsshow .txt{ padding:30px;}
    .newsshow .tit{
        padding: 20px;
    }
    .newsshow .btn { 
        margin-top: 40px;
        padding: 0px 0;
    }
    .newsshow .btn a{
        font-size: 1.4em;
        
    }

    .in_news .banners {
        height: 100px;
    }
    
}

@media screen and (max-width: 640px) {
    .newsshow .tit2 h3{ font-size:1.6em;}
    .newsshow .tit2 .dot h4{ font-size:1em; padding:10px 2px;}
    .newsshow .tit2{ padding:30px 20px 0 20px;}
    .newsshow .btn { 
        margin-top: 40px;
        padding: 0px 0;
    }
    

    .newsshow .btn {

        grid-template-columns: 1fr;
        gap: 5px;
        align-items: center;
        padding: 0;
        padding-top: 0px;
        margin-top: 20px;
    }
    .newsshow .btn a {
        width: 100%;
        text-align: left;
        padding: 0;
    }
    .newsshow .btn a:last-child {
        text-align: left;
    }
    .newsshow .btn a:nth-child(2){
        display: none;
    }

    .in_news .banners {
        height: 50px;
    }
}




/*contact*/

@media screen and (max-width: 1200px) {
    .fo_contact {
        display: flex;
        justify-content: flex-start;
        margin-bottom: 50px;
        padding-right:230px;
    }
}
@media screen and (max-width: 1000px) {
    .fo_contact {
       
        padding-right: 0px;
    }

    .fo_left{
        width: 100%;
    }
}
@media screen and (max-width: 640px) {
    
}
