/* banner */

.swiper{

    width:100%;

    overflow: hidden;

}

.swiper img{

    width:100%;

    height:100%;

    object-fit: cover;

}

.banner_box{

    width:100%;

    height:800px;

    position: relative;

    z-index: 2;

}

.banner{

    width:100%;

    height:750px;

}

.banner_intro{

    position: absolute;

    bottom:0px;

    z-index: 10;

}

.banner_intro_item{

    float:left;

    width:calc(20% - 20px);

    height:120px;

    margin:0 10px;

    background: #fff;

    border-radius: 10px;

    padding:15px 10px 15px 15px;

    box-sizing: border-box;

    box-shadow: 0 0 10px 2px rgb(0 0 0 / 5%);

    cursor: pointer;

    border: 1px solid #fff;

}

.banner_intro_icon{

    width:34px;

    height:34px;

    line-height: 34px;

    text-align: center;

}

.banner_intro_tit{

    font-size: 20px;

    color:#1C2236;

    font-weight: bold;

    line-height: 34px;

    margin-left:5px;

}

.banner_intro_desc{

    margin-top:5px;

    font-size: 15px;

    color:#454B5F;

    line-height: 1.5;

}

.icon_default{

    visibility:visible;

    opacity: 1;

}

.icon_active{

    visibility: hidden;

    opacity: 0;

}

/* banner遮罩 */

.overlay{

    width: 100%;

    height: 100%;

    position: absolute;

    left: -20%;

    bottom: 0;

    background-position: bottom left;

    background-repeat: no-repeat;

    -webkit-transform-origin: bottom left;

    transform-origin: bottom left;

    opacity: 0;

    background-image:url(../images/overlay.png);

    z-index: -50;

}

.overlay.open{

    -webkit-animation: myfirst 2.8s linear;

    animation: myfirst 2.8s linear;

}

/* 添加on类 */

.banner_intro_item.on,

.banner_intro_item:hover{

    background-image: linear-gradient(to bottom, #fff, #fff4e9);

    border: 1px solid #ffecd9;

}



.banner_intro_item.on .icon_default,

.banner_intro_item:hover .icon_default{

    visibility: hidden;

    opacity: 0;

}

.banner_intro_item.on .icon_active,

.banner_intro_item:hover .icon_active{

    visibility:visible;

    opacity: 1;

}

.banner_intro_item.on .banner_intro_tit,

.banner_intro_item:hover .banner_intro_tit{

    color:#e9280c;

}

/* service */

.service_box{

    padding-bottom: 50px;

    padding-top: 80px;

}

.service_item{

    width:22.5%;

    margin-left:2%;

    border-radius: 10px;

    background: #fff url(../images/service_item_bg.png) no-repeat 52% 52%;

    box-shadow: 0 0 10px 2px rgb(0 0 0 / 5%);

}

.service_item a{

    padding:25px;

    box-sizing: border-box;

}

.service_item_tit{

    font-size: 32px;

    color:#1C2236;

    font-weight: bold;

}

.service_item_icon{

    width:100%;

    height:200px;

}

.service_item_icon img{

    width:124px;

    height:124px;

}

.service_item_content li{

    float:left;

    width:50%;

    font-size: 20px;

    color:#1C2236;

    line-height: 50px;

    padding-left: 15px;

    box-sizing: border-box;

    position: relative;

}

.service_item_content li::before{

    content:"";

    position: absolute;

    top:22px;

    left:0;

    width: 5px;

    height: 5px;

    border-top: 1px solid;

    border-right: 1px solid;

    border-color: #383838;

    transform: rotate(45deg);

    transition: all 0.3s ease-in-out;

}

.service_item:hover{

    /* transform: translateY(-5px); */

    margin-top: -5px;

    box-shadow: 0 20px 50px rgba(168, 91, 0, .1);

    background: #fff url(../images/service_item_bg.png) no-repeat 56% 56%;

}

.service_item:hover .service_item_tit{

    color:#e9280c;

}

/* product轮播图 */

.product{

    height:877px;

    /* margin-top:50px; */

}

.product_btn_box{

    position: absolute;

    left:0;

    bottom:0;

    width:750px;

    height:110px;

    z-index: 10;

    border-top-right-radius: 40px;

    overflow: hidden;

}

.mouse_btn{

    width:360px;

    height:100%;

    background: linear-gradient(to right,#e70811,#eb4009);

}

.mouse_btn img{

    width:36px;

    height:36px;

    /* opacity:1;

    animation:arrow 3s cubic-bezier(0.5,0,0.1,1) infinite;

    -webkit-animation:arrow 3s cubic-bezier(0.5,0,0.1,1) infinite;

    position:absolute;

    left:calc(50% - 18px);

    top:37px;

    cursor:pointer; */

}

.mouse_btn img:hover{

    animation-play-state:paused;

    -webkit-animation-play-state:paused;

}

.pagination_box{

    width:calc(100% - 360px);

    height:100%;

    background: #fff;

}

/* 修改pagination和翻页按钮的默认样式 */

.product .swiper-button-prev{

    left:60px;

}

.product .swiper-button-next{

    left:160px;

}

.product .swiper-button-next:after, 

.product .swiper-button-prev:after{

    font-size: 14px;

    font-weight: bold;

}

.product .swiper-button-next, 

.product .swiper-button-prev{

    color:#383838;

    width: 28px;

    height: 28px;

    border-radius: 50%;

    background: transparent;

    cursor: pointer;

    margin-top:41px;

    top:0;

    transition: all 0.4s ease;

}

.product .swiper-pagination{

    right:50px;

    top:calc(50% - 10px);

    height:20px;

    /* background: green; */

}

.product .swiper-pagination-bullet{

    width:20px;

    height:20px;

    background: transparent;

    opacity: 1;

    margin-left:10px;

    position: relative;

    border-radius: 0;

    /* background: yellow; */

}

.product .swiper-pagination-bullet::after{

    content:"";

    position: absolute;

    left:7px;

    top:7px;

    width:6px;

    height:6px;

    /* border-radius: 50%; */

    border-radius: 3px;

    background: #CCCCCC;

}

.product .swiper-pagination-bullet-active{

    width:20px;

    height:20px;

    background: transparent;

}

.product .swiper-pagination-bullet.swiper-pagination-bullet-active::after{

    left:6px;

    top:6px;

    width:8px;

    height:8px;

    background: #E60411;

    border-radius: 4px;

}

.product .swiper-button-next:hover,

.product .swiper-button-prev:hover{

    background: #FF3226;

    color:#fff;

}

/* 案例 */

.case{

    margin-top: 80px;

}

.case_tit{

    font-size: 60px;

    font-weight: bold;

    color:#1C2236;

    line-height: 1.5;

}

.case_subtit{

    font-size: 40px;

    font-weight: bold;

    color:#1C2236;

    line-height: 1.5;

}

.case_list{

    margin-top:40px;

}

.case_item{

    width:32%;

    margin-right:2%;

    margin-bottom: 30px;

}

.case_item:nth-child(3n){

    margin-right: 0;

}

.case_item_pic{

    width:100%;

    height:320px;

}

.case_item_pic img{

    width:100%;

    height:100%;

    object-fit: cover;

}

.case_tag{

    width:180px;

    height:50px;

    line-height: 50px;

    text-align: center;

    border-radius: 4px;

    background:linear-gradient(to right,rgba(253, 57, 70,1),rgba(254, 130, 109,1));

    font-size: 26px;

    color:#fff;

    margin-top:20px;

    overflow: hidden;

}



.case_item_tit{

    font-size: 28px;

    font-weight: bold;

    color:#1C2236;

    margin-top:10px;

    line-height: 1.5;

}

.case_item_desc{

    font-size: 20px;

    color:#454B5F;

    line-height: 1.8;

}

.case_item:hover{}

.case_item:hover .case_item_tit{

    color:#e9280c;

}

.case_item:hover .case_item_desc{}

/* 客户 */

.partner{

    margin-top: 50px;

}

.about{

    width:calc(45% - 50px);

    margin-right: 50px;

    background: url(../images/partner.png) no-repeat top left;

    padding-top:100px;

    box-sizing: border-box;

}

.about .tit{

    font-size: 60px;

    font-weight: bold;

    color:#1C2236;

    line-height: 1.5;

}

.about .desc{

    font-size: 20px;

    color: #1C2236;

    font-weight: bold;

}

.about .subtit{

    font-size: 24px;

    font-weight: bold;

    color:#1C2236;

    margin-top: 40px;

    line-height: 1.5;

}

.about .introduce{

    font-size: 18px;

    color:#454B5F;

    line-height: 2;

    margin-top: 5px;

}

.about .more{
    display: block;

    width:200px;

    height:50px;

    line-height: 50px;

    text-align: center;

    border-radius: 4px;

    background:linear-gradient(to right,rgba(253, 57, 70,1),rgba(254, 130, 109,1));

    margin-top: 60px;

}

.about .more span{

    font-size: 20px;

    color:#fff;

}

.about .more img{

    vertical-align: middle;

}

.partner_box{

    width:55%;

    height:480px;

    margin-top: 100px;

}

.partner_list{

    width:100%;

    height:auto;

}

.partner_item{

    width:25%;

    height:120px;

    border:1px solid #E5E5E5;

    box-sizing: border-box;

    overflow: hidden;

}

.partner_item img{

    /* filter: grayscale(100%) invert(1); */

    transform-origin: center;

}

.partner_item:not(:nth-child(4n)){

    border-right: none;

}

.partner_item:not(:nth-last-child(-n+4)){

    border-bottom: none;

}

.partner_item img{

    width:100%;

    height:auto;

}

/* 解决方案 */

.solution{

    margin-top: 100px;

    width:100%;

    height:715px;

}

.solution_item{

    width:25%;

    height:100%;

    background-repeat: no-repeat;

    background-position: 50% 50%;

    background-size: 100%;

    transition: all 0.6s ease;

    overflow: hidden;

}

.solution_item::after{

    content: "";

    position: absolute;

    top:0;

    left:0;

    width:100%;

    height:100%;

    background: rgba(0,0,0,0.3);

    z-index: 1;

}

.solution_item a{

    position: absolute;

    top:0;

    left:0;

    width:100%;

    height:100%;

    z-index: 2;

    padding:40px;

    box-sizing: border-box;

}

.solution_item:nth-child(1){

    background-image: url(../images/solution_bg1.png);

}

.solution_item:nth-child(2){

    background-image: url(../images/solution_bg2.png);

}

.solution_item:nth-child(3){

    background-image: url(../images/solution_bg3.png);

}

.solution_item:nth-child(4){

    background-image: url(../images/solution_bg4.png);

}

.solution_item:hover{

    background-size: 110%;

}



.solution_item .tit{

    font-size: 32px;

    color:#fff;

    font-weight: bold;

    line-height: 1.5;

}

.solution_item .subtit{

    font-size: 18px;

    color:#fff;

    font-weight: bold;

    line-height: 1.5;

    height:50px;

}

.solution_item .desc{

    font-size: 16px;

    color:#fff;

    font-weight: bold;

    line-height: 2.2;

    height:150px;

}

.solution_item .open{

    position: absolute;

    left:40px;

    bottom:40px;

}

.menu_list{}

.menu_list li{

    margin-bottom: 15px;

    height:45px;

}

.menu_list li span{

    font-size: 16px;

    font-weight: bold;

    color:#fff;

    padding:12px 30px;

    background: rgba(255,255,255,0.3);

    border:1px solid #fff;

    transition: all 0.3s ease;

}

.menu_list li:first-child span,

.menu_list li:last-child span{

    background: #fff;

    color:#383838;

}



.solution_item:hover::after{

    background: rgba(200,5,14,0.8);

}

.solution_item .menu_list li:hover span{

    background: #fff;

    color:#383838;

}

.solution_item .menu_list li:first-child:hover span,

.solution_item .menu_list li:last-child:hover span{

    color:#fff;

    background: rgba(255,255,255,0.3);

}

/* blog */

.blog{

    margin-top:80px;

}

.highlight_news{

    width:45%;

}

.highlight_news_tit{

    font-size: 60px;

    font-weight: bold;

    color:#1C2236;

}

.highlight_news_subtit{

    font-size: 24px;

    color:#1C2236;

    font-weight: bold;

}

.highlight_news_content{

    margin-top: 60px;

    width:100%;

    border-right:1px solid #E5E5E5;

    padding-right:50px;

    box-sizing: border-box;

}

.highlight_news_content .time{

    color:#1C2236;

    opacity: 0.2;

}

.highlight_news_content .time .year{

    font-size: 54px;

    font-weight: bold;

}

.highlight_news_content .time .date{

    font-size: 16px;

    margin-left:5px;

}

.highlight_news_content .abstract{

    font-size: 16px;

    color:#454B5F;

    line-height: 2;

    margin-top: 15px;

}

.highlight_news_content .content{

    width:100%;

    height:280px;

    border-radius: 4px;

    overflow: hidden;

    margin-top: 60px;

}

.highlight_news_content .content.haspic{

    border-radius: 10px;

    overflow: hidden;

}

.highlight_news_content .content.nopic::before{

    position: absolute;

    left:0;

    top:0;

    width:100%;

    height: 100%;

    content:"暂无图片";

    background: #FF3226;

    padding-top: 120px;

    box-sizing: border-box;

    text-align: center;

    color:#fff;

    font-size: 24px;

    font-weight: bold;

}

.highlight_news_content .content .tit{

    font-size: 20px;

    color:#fff;

    position: absolute;

    left:0;

    bottom:0;

    width:100%;

    height:50px;

    padding:0 10px 0 15px;

    box-sizing: border-box;

}

.highlight_news_content .content.haspic .tit{

    background: linear-gradient(to top,rgba(0,0,0,0.6),rgba(0,0,0,0));

}



.highlight_news_content .line{

   width:0;

   height:6px;

   border-radius: 10px;

   background:linear-gradient(to right,rgba(253, 57, 70,1),rgba(254, 130, 109,1));

   margin-top: 50px;

   transition: all 0.3s ease;

}

.highlight_news_content:hover .time{

    color:#e9280c;

    opacity: 1;

}

.highlight_news_content:hover .line{

    width:88px;

}

.news{

    width:55%;

}

.news_tab{

   width:100%;

   margin-top: 20px;

   margin-bottom: 50px;

   display: flex;

   justify-content: end;

}

.news_tab li{

    font-size: 24px;

    color:#1C2236;

    cursor: pointer;

    transition: all 0.3s ease-in-out;

    float:left;

}

.news_tab li .line{

   margin:0 10px;

}

.news_tab li:last-child .line{

    display: none;

}

.news_tab li.active .tab{

    color:#e9280c;

}

.news_tab_content .content{

    display: none;

    transition: all 0.3s ease-in-out;

}

.news_list{

    padding-left:50px;

    box-sizing: border-box;

    /* border-left:1px solid #E5E5E5; */

    width:100%;

    height:auto;

}

.news_item{

    width:100%;

    height:auto;

    padding:40px 0;

    box-sizing: border-box;

    border-bottom: 1px solid #E5E5E5;

    position: relative;

}

.news_item::after{

    content:"";

    position: absolute;

    left:0;

    bottom:0;

    width:0;

    height:1px;

    background: #FF3226;

    transition: all 0.6s ease;

}

.news_item .tit_box{

    width:calc(100% - 200px);

}

.news_item .time{

    width:100px;

}

.news_item .tit{

    font-size: 22px;

    color:#000;

    font-weight: bold;

    line-height: 1.5;

    margin-bottom: 10px;

}

.news_item .abstract{

    font-size: 16px;

    color:#454B5F;

    line-height: 2;

}

.news_item .year{

    font-size: 36px;

    color:#BFBFBF;

    font-weight: bold;

    text-align: right;

}

.news_item .date{

    font-size: 16px;

    color:#BFBFBF;

    text-align: right;

}

.news_item:hover{

    border-bottom: none;

}

.news_item:hover::after{

    width:100%;

}

.news_item:hover .year,

.news_item:hover .date,

.news_item:hover .tit{

    color:#e9280c;

}

/* .news_item:hover .abstract{

    transform: translateX(10px);

} */











@media (max-width: 1768px){

    .banner_intro_desc{

        font-size: 14px;

    }

    .service_item_content li{

        font-size: 16px;

    }

}

@media (max-width: 1680px) {

    .banner_box{

        height:700px;

    }

    .banner{

        height:650px;

    }

    .banner_intro_tit{

        font-size: 18px;

        line-height: 30px;

    }

    .banner_intro_icon {

        width: 30px;

        height: 30px;

        line-height: 30px;

    }

    .banner_intro_icon img{

        transform: scale(0.9);

    }

    .service_item a{

        padding:20px;

    }

    .service_item_icon{

        height:150px;

    }

    .service_item_icon img{

        width:108px;

        height:108px;

    }

    .service_item_tit{

        font-size: 28px;

    }

    .service_item_content li{

        line-height: 40px;

    }

    .service_item_content li::before{

        top:17px;

    }

    .service_item{

        background: #fff url(../images/service_item_bg.png) no-repeat 54% 54%;

    }

    .product{

        height:750px;

    }

    .case_tit{

        font-size: 52px;

    }

    .case_subtit{

        font-size: 34px;

    }

    .case_item_pic{

        height:280px;

    }

    .case_tag{

        width:140px;

        height:40px;

        line-height: 40px;

        font-size: 20px;

        margin-top: 15px;

    }

    .case_item_tit{

        font-size: 24px;

        margin-top: 5px;

    }

    .case_item_desc{

        font-size: 16px;

    }

    .about .tit{

        font-size: 52px;

    }

    .about .subtit{

        font-size: 22px;

        margin-top: 30px;

    }

    .about .desc{

        font-size: 18px;

    }

    .about .introduce{

        font-size: 16px;

    }

    .partner_item{

        height:108px;

    }

    .solution{

        height:640px;

    }

    .solution_item a{

        padding:30px;

    }

    .solution_item .tit{

        font-size: 28px;

    }

    .solution_item .subtit{

        font-size: 16px;

    }

    .solution_item .open{

        left:30px;

        bottom:30px;

    }

    .menu_list li{

        height:39px;

    }

    .menu_list li span{

        font-size: 15px;

        padding:10px 25px;

    }

    .highlight_news_tit{

        font-size: 52px;

    }

    .highlight_news_subtit{

        font-size: 22px;

    }

    .news_tab li{

        font-size: 22px;

    }

}

@media (max-width: 1600px) {

    .banner_intro_item{

        padding:10px;

    } 

    .news_tab li{

        font-size: 20px;

    }

}

@media (max-width: 1440px){

    .banner_box{

        height:600px;

    }

    .banner{

        height:550px;

    }

    .banner_intro_icon {

        width: 24px;

        height: 24px;

        line-height: 24px;

    }

    .banner_intro_icon img{

        transform: scale(0.7);

    }

    .banner_intro_tit {

        font-size: 16px;

        line-height: 24px;

    }

    .service_item_content li{

        font-size: 14px;

        padding-left: 12px;

    }

    .service_item_tit {

        font-size: 24px;

    }

    .service_item_icon {

        height: 130px;

    }

    .service_item_icon img{

        width:90px;

        height:90px;

    }

    .service_item a {

        padding: 15px;

    }

    .service_item{

        background: #fff url(../images/service_item_bg.png) no-repeat 56% 56%;

    }

     .service_item:hover{

        background: #fff url(../images/service_item_bg.png) no-repeat 58% 58%;

    }

    .product{

        height:650px;

    }

    .product_btn_box{

        width:500px;

        height:100px;

    }

    .mouse_btn{

        width:200px;

    }

    .pagination_box {

        width: calc(100% - 200px);

    }

    .product .swiper-button-next, .product .swiper-button-prev{

        margin-top: 36px;

    }

    .product .swiper-button-prev {

        left: 30px;

    }

    .product .swiper-button-next {

        left: 90px;

    }

    .product .swiper-pagination{

        right:30px;

    }

    .case_tit{

        font-size: 48px;

    }

    .case_subtit{

        font-size: 30px;

    }

    .case_item_pic{

        height:240px;

    }

    .case_item_tit {

        font-size: 22px;

    }

    .about .tit{

        font-size: 42px;

    }

    .partner_item {

        height: 96px;

    }

    .about .more{

        width:160px;

        height:40px;

        line-height: 40px;

        margin-top: 40px;

    }

    .about .more span{

        font-size: 16px;

    }

    .solution{

        height:550px;

    }

    .solution_item a {

        padding: 20px;

    }

    .solution_item .tit {

        font-size: 24px;

    }

    .solution_item .subtit {

        font-size: 14px;

        height:35px;

    }

    .solution_item .desc{

        font-size: 15px;

        line-height: 1.8;

        height:130px;

    }

    .menu_list li span{

        padding:8px 20px;

    }

    .menu_list li {

        height: 35px;

        margin-bottom: 12px;

    }

    .solution_item .open {

        left: 20px;

        bottom: 20px;

    }

    .highlight_news_tit {

        font-size: 42px;

    }

    .news_item .tit{

        font-size: 20px;

    }

    .highlight_news_subtit {

        font-size: 20px;

    }

    .highlight_news_content{

        margin-top: 40px;

    }

    .news_item{

        padding:35px 0;

    }

    .news_tab li {

        font-size: 18px;

    }

}

@media (max-width: 1366px){

    .about{

        width:calc(50% - 40px);

        margin-right: 40px;

    }

    .partner_box{

        width:50%;

    }

}

@media (max-width: 1280px){

    .banner_box{

        height:550px;

    }

    .banner{

        height:500px;

    }

    .banner_intro_tit{

        font-size: 15px;

    }

    .service_item_content li{

        font-size: 13px;

        padding-left: 10px;

    }

    .service_item_content li::before{

        width:4px;

        height:4px;

    }

    .service_item_icon {

        height: 110px;

    }

    .service_item_icon img {

        width: 80px;

        height: 80px;

    }

    .service_item_tit {

        font-size: 22px;

    }

    .product{

        height:580px;

    }

    .product_btn_box{

        height:90px;

    }

    .product .swiper-button-next, .product .swiper-button-prev{

        margin-top: 31px;

    }

    .case_tit{

        font-size: 36px;

    }

    .case_subtit{

        font-size: 24px;

    }

    .case_item_pic{

        height:210px;

    }

    .case_tag {

        width: 120px;

        height: 35px;

        line-height: 35px;

        font-size: 16px;

        margin-top: 10px;

    }

    .case_item_tit {

        font-size: 18px;

    }

    .case_item_desc {

        font-size: 14px;

    }

    .about .tit{

        font-size: 30px;

    }

    .about .desc {

        font-size: 16px;

    }

    .about .subtit{

        font-size: 20px;

        margin-top: 20px;

    }

    .partner_item {

        height: 88px;

    }

    .solution{

        height:500px;

    }

    .solution_item a {

        padding: 15px;

    }

    .solution_item .tit {

        font-size: 20px;

    }

    .solution_item .desc{

        font-size: 14px;

        height:120px;

    }

    .menu_list li span{

        font-size: 14px;

    }

    .highlight_news_tit {

        font-size: 32px;

    }

    .highlight_news_subtit {

        font-size: 18px;

    }

    .highlight_news_content{

        margin-top: 30px;

    }

    .news_item{

        padding:35px 0;

    }

    .news_item .tit {

        font-size: 18px;

    }

    .news_tab li {

        font-size: 16px;

    }

}

@media (max-width: 1176px){

    .banner_box{

        height:500px;

    }

    .banner{

        height:450px;

    }

    .banner_intro_item{

        width:calc(20% - 10px);

        margin:0 5px;

    }

    .banner_intro_icon {

        width: 20px;

        height: 20px;

        line-height: 20px;

    }

    .banner_intro_icon img{

        transform: scale(0.6)translateX(-8px);

    }

    .banner_intro_tit{

        font-size: 14px;

        line-height: 20px;

        margin-left: 0;

    }

    .banner_intro_desc{

        font-size: 13px;

    }

    .service_item_content li{

        font-size: 11px;

    }

    .service_item_content li{

        line-height: 30px;

    }

    .service_item_content li::before {

        top: 12px;

    }

    .product{

        height:480px;

    }

    .case_item_pic{

        height:180px;

    }

}