header{position: fixed;width: 100%; z-index: 9999}
.pcNav{transition: .4s all ease }
.pcNav_w{width:1410px;max-width: 100%;margin: 0 auto}
.pcNav .pcNav_con{display: flex;justify-content: space-between;align-items: center}
.pcNav_con .con_r{display: flex;align-items: center}
.pcNav_list{display: flex;align-items: center;}
.pcNav_list li{margin-right: 45px;position: relative; }
.pcNav_list li:nth-last-child(1){margin-right: 0}
.pcNav_list li a{display: inline-block;height: 88px;line-height: 88px; color: #333;font-size: 18px;font-weight: 600;transition: .4s all ease}
.pcNav_list li:after{content: '';position: absolute;left: 50%;bottom:10px; transform: translateX(-50% );
    width:  4px;height: 0;background: #F50A04;opacity: 0; transition: .4s all ease}
.pcNav_list li:hover a{color: #F50A04}
.pcNav_list li:hover:after{height: 16px;opacity: 1}
.pcNav_list li.active a{color: #F50A04}
.pcNav_list li.active:after{height: 16px;opacity: 1}
.pcNav.active{box-shadow: 0 0 6px #dfdfdf;background: #fff}

footer{}
footer .f_top{padding: 54px 0; background: #131D27}
footer .f_top .g_w{display: flex;justify-content: space-between}
.f_info{color: #fff}
.f_info i{font-size: 22px}
.f_info b{margin-top: 10px; font-size: 18px;display: block}
.f_info p{margin-top: 4px; font-size: 16px;line-height: 18px;opacity: .6}
footer .f_bottom{padding: 10px 0; text-align: center; background: #F50A04}
footer .f_bottom span{color: #fff;opacity: .65}

.g_body{padding-top: 88px}
.i_body{padding-bottom:100px }
.i_title{text-align: center}
.i_title b{font-family: 'Mont';font-size: 44px;color: #222;line-height: 1; text-transform: capitalize; position: relative;}
.i_title b:nth-last-child(1):after{ display: none; content: '';  width: 100%;height: 6px;background: #F50A04;
position: absolute;left: 0;bottom: 12px}

.i_banner_img{padding-top: calc(720 / 1920 * 100%);background-size: cover;background-position: center}

.i_count{padding: 36px 0; background: #F6F6F6;}
.i_count .g_w{display: flex}
.i_count .item{width: 25%;position: relative;text-align: center;padding: 0 20px;}
.i_count .item .item_text{max-width: 222px; display: inline-block; text-align: right;}
.i_count .item .item_count{}
.i_count .item .item_count i{font-weight: 600;font-size: 48px;color: #222;vertical-align: text-top}
.i_count .item .item_count span{margin-left: 4px; font-size: 24px;font-weight: 600;vertical-align: text-top}
.i_count .item:after{content: '';position: absolute;right: 0;top: 50%;transform: translateY(-50%); height: 60px;width: 1px;background: rgba(0,0,0,0.14)}
.i_count .item p{color: #777;font-size: 15px;line-height: 20px}
.i_count .item:nth-last-child(1):after{display: none}

.i_business{margin-top: 80px}
.i_business .list{margin-top: 26px; column-count: 3;column-gap: 10px}
.i_business .list .item{margin-bottom: 10px}
.i_business .list .item a{display: block;width: 100%; position: relative;overflow: hidden}
.i_business .list .item a .g_bg{display: block;transition: .8s all ease}
.i_business .list .item:nth-child(1) .g_bg{padding-top: calc(628 / 463 * 100%)}
.i_business .list .item2 .g_bg{padding-top: calc(256 / 463 * 100%)}
.i_business .list .item3 .g_bg{padding-top: calc(362 / 463 * 100%)}
.i_business .list .item a span{position: absolute;left: 20px;top: 20px; display: block;padding: 8px 14px;font-size: 16px; color: #222; background: #fff;transition: .4s all ease}
.i_business .list .item:hover .g_bg{transform: scale(1.06)}
.i_business .list .item:hover a span{background: #EC1F25;color: #fff}


.i_technical{margin-top: 100px;padding-top: 85px; background: url("../images/index6.jpg") no-repeat;background-position: top center}
.i_technical .i_title b{color: #fff}
.i_technical .count{display: flex;justify-content: space-between;  margin-top: 60px; padding: 82px 25px;background: #F6F6F6}
.i_technical .count .item{max-width:182px;  text-align: center;position: relative;display: flex;align-items: center}
.i_technical .count .item a{ width: 100%;display: block}
.i_technical .count .item .No{font-size:50px;color: rgba(0,0,0,0.18);font-family: Mont;display: block}
.i_technical .count .item .line{ width: 1px;height: 80px;margin: 25px auto 0 auto;background:  rgba(0,0,0,0.14); display: block;transition: .8s all ease}
.i_technical .count .item i{font-size: 32px;color: #333; display: block;transition: .8s all ease}
.i_technical .count .item .title{margin-top:0; font-size: 22px;color: #222;text-transform: capitalize; display: block}
.i_technical .count .item p{margin-top: 8px; font-size: 15px;color: #777;line-height: 22px;height: 66px;overflow: hidden}
.i_technical .count .item em{display: block;margin: 22px auto 0 auto ; width: 46px;height: 46px;text-align: center;line-height: 44px;color: #979797;font-size: 18px;position: absolute; left: 50%;transform: rotate(180deg) translate(50%,6px);
    background: #fff;border: 1px solid #ababab;border-radius: 50%;opacity: 0;pointer-events: none;transition: .8s all ease}
.i_technical .count .item:hover .No{color:#F50A04 }
.i_technical .count .item:hover i{opacity: 0; pointer-events: none;font-size: 0}
.i_technical .count .item:hover .title{color:#F50A04 }
.i_technical .count .item:hover .line{height: 0;opacity: 0}
.i_technical .count .item:hover em{transform: rotate(180deg) translate(50%,6px);opacity: 1; pointer-events: auto;}



.i_cases{margin-top: 100px}
.i_cases .g_w{display: flex;justify-content: space-between;align-items: center}
.i_cases .btns{ }
.i_cases .btns .swiper-button-prev,
.i_cases .btns .swiper-button-next{display: inline-block; margin: 0 7px; width: 46px;height: 46px; text-align: center;line-height: 44px; color: #ABABAB;
    position: relative;top: auto;left: auto;right: auto;bottom:auto; transform: translate(0);
    background: rgba(255,255,255,0);border-radius: 50%;border: 1px solid #ABABAB;transition: .4s all ease}
.i_cases .btns .swiper-button-next{transform: rotate(180deg)}
.i_cases .btns i{font-size: 18px}
.i_cases .btns div:hover {background: #EC1F25;color: #fff;border-color: #EC1F25}
.i_cases .swiper-container{margin-top: 34px}
.i_cases .swiper-slide{width: 317px;position: relative}
.i_cases .swiper-slide .item_img{position: relative}
.i_cases .swiper-slide .item_img:before{content: ''; width: 90%;height: 90%;border: 6px solid #EC1F25;opacity: 0;
    position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%); transition: .4s all ease}
.i_cases .swiper-slide .title{font-size: 16px;color: #222;margin-top: 14px;transition: .4s all ease}
.i_cases .swiper-slide:hover .title{color: #EC1F25;font-weight: 600}
.i_cases .swiper-slide:hover .item_img:before{opacity: 1; width: 100%;height: 100%;}


.n_banner{padding-top: calc(400 / 1920 * 100%);min-height: 200px; position: relative;background-size: cover;background-position: center}
.n_banner .text{height: 72px;padding: 0 34px;font-size: 36px; color: #000; text-transform: uppercase;font-weight: 600; line-height: 72px; white-space: nowrap; background: #fff;
    position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);}
.n_banner .text:after{content: '';position: absolute;left: 50%;top:100%;transform: translate(-50%,-50%);
    width: 50%;height: 9px;background: #E23A3A}
.n_con{display: flex}
.n_con > .con_l{width: 210px;padding-top: 60px}
.n_con > .con_r{width: calc(100% - 210px);padding: 60px 0 80px 56px;border-left: 1px solid #DBDBDB}
.n_nav{}
.n_nav .title{padding-bottom: 14px; font-size: 18px;font-weight: 600;color: #222;text-transform: capitalize;border-bottom: 1px solid #DBDBDB;}
.n_nav ul{padding: 10px 0}
.n_nav ul li{margin-top: 14px; padding-right: 30px;position: relative}
.n_nav ul li a{font-size: 16px;color: #888;transition: .4s all ease}
.n_nav ul li i{position: absolute;right: 20px;top: 50%;transform: translateY(-50%) rotate(-90deg) scale(0);transition: .4s all ease}
.n_nav ul li.active a{color: #222}
.n_nav ul li.active i{transform: translateY(-50%) rotate(-90deg) scale(1);}
.n_nav ul li:hover a{color: #222}
.n_nav ul li:hover i{transform: translateY(-50%) rotate(-90deg) scale(1);}
.n_title{font-size: 44px;color: #222;font-family: Mont; font-weight: 600;text-transform: capitalize}

.n_text{font-size: 16px;color: #777;line-height: 26px}
.n_text p{margin-top: 14px}
.n_text .red{color: #F50A04;font-size: 18px}
.n_text .b{color: #222;font-size: 18px;font-weight: 600}

.n_show{}
.n_show .title{font-weight: bold;font-size: 22px;color: #222;text-transform: capitalize}
.n_show .list{margin-top: 24px; display: grid;grid-gap:18px ;grid-column: span 3;grid-template-columns: repeat(3,1fr);}
.n_show .list .g_bg{padding-top: calc(240/ 360 * 100%)}

.n_contact{}
.n_contact .con1{margin: 90px 0   }
.n_contact .con1 .g_w{display: flex;justify-content: center;align-items: flex-start}
.n_contact .con1 .con_r{padding-left: 50px}
.contact_info{padding: 10px 0}
.contact_info .name{font-size: 30px;color: #222}
.contact_info .item{margin-top: 28px;display: flex}
.contact_info .item .iconfont{width: 50px;height: 50px;padding: 6px; border-radius: 50%;border: 1px dashed #F50A04;color: #fff;font-size: 18px}
.contact_info .item .iconfont:before{display: block; width: 100%;height: 100%;line-height: 34px; text-align: center; background: #F50A04;border-radius: 50%}
.contact_info .item_r{width: calc(100% - 50px);padding-left: 17px}
.contact_info .item_text b{font-size: 16px;color: #222;text-transform: capitalize}
.contact_info .item_text p{font-size: 16px;color: #777;line-height: 22px;margin-top: 5px;max-width: 500px}


.n_strength{}
.n_strength .con_r{}
.n_strength .list{margin-top: 30px; display: flex;flex-wrap: wrap;border-top:1px  solid #DBDBDB;border-left:1px  solid #DBDBDB}
.n_strength .list .item{width: calc(100% / 6);position: relative;border-bottom:1px  solid #DBDBDB;border-right:1px  solid #DBDBDB;transition: .4s all ease}
.n_strength .list .item:before{content: '';display: block;padding-top: calc(93 / 192 * 100%)}
.n_strength .list .item img{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);max-width: 94%;max-height: 94%}
.n_strength .list .item:hover{box-shadow:  0 0 6px #000;z-index: 99}

.n_about .n_banner{padding-top: calc(600 / 1920 * 100%)}
.n_about .n_text{margin-top: 14px}
.n_about .n_show{margin-top: 36px}

.n_aboutNews{}
.n_aboutNews .list{grid-column-gap:44px ; grid-row-gap: 20px}
.n_aboutNews .list .item{}
.n_aboutNews .list .item_top{position: relative}
.n_aboutNews .list .item_date{display: block;padding: 0 16px;height: 29px;line-height: 29px;color: #fff;background: #F50A04;
    position: absolute;left: -8px;top:12px;transition: .4s all ease }
.n_aboutNews .list .item_img{overflow: hidden}
.n_aboutNews .list .item .g_bg{padding-top: calc(228 / 348 * 100%);transition: .8s all ease}
.n_aboutNews .list .item_title{margin-top: 12px; font-size: 16px;color: #222;line-height: 20px;height: 40px;overflow: hidden;}
.n_aboutNews .list .item_text b{display: block; margin-top: 10px;font-size: 14px;color: #F50A04;font-weight: 600; text-transform: uppercase;opacity: 0;transition: .4s all ease}
.n_aboutNews .list .item:hover .g_bg{transform:scale(1.06)}
.n_aboutNews .list .item:hover .item_text b{opacity: 1}
.n_aboutNews .list .item:hover .item_date{ background: #fff;color: #F50A04}

.detail{padding: 40px 0}
.detail_top{}
.detail_top .title{font-size: 30px;color: #222;font-weight: 600}
.detail_top .date{display: block; margin-top: 9px; font-size: 16px;color: #F50A04}
.detail_con{margin-top: 20px}
.detail_con p{margin-bottom: 20px}


.n_yewu_nav{display: flex}
.n_yewu_nav .item{position: relative;width: 20%}
.n_yewu_nav .item a:before{content: ''; width: 100%;height: 100%;background: rgba(0,0,0,.42);position: absolute;left: 0;top: 0;transition: .4s all ease}
.n_yewu_nav .item .g_bg{padding-top: calc(300 / 384 * 100%)}
.n_yewu_nav .item .title{ padding: 8px 12px;font-size: 16px;color: #222;text-transform: uppercase;background: #fff;
    position: absolute;left: 50%;bottom: 16px;transform: translateX(-50%); display: flex;align-items: center;justify-content: center;}
.n_yewu_nav .item .title b{font-size: 60px;line-height: 44px; opacity: .36;margin-right: 8px;font-family: Mont;display: none}
.n_yewu_nav .item .title span{white-space: nowrap}
.n_yewu_nav .item:hover a:before{opacity: 0}
.n_yewu_nav .item.active a:before{opacity: 0}
.n_yewu_nav .item.active .title{background: none;color: #fff; width: 90%}
.n_yewu_nav .item.active .title span{white-space: initial; display: block}
.n_yewu_nav .item.active .title b{display: block}

.n_yewu .n_con > .con_r{width: 100%}
.n_yewu .n_show{position: relative;margin-top: 30px}
.n_yewu .n_show:before{content: '';position: absolute;left: -59px; width: 6px;height: 22px;background: #F50A04;}

.n_serve .con1{padding: 90px 0}
.n_serve .list{}
.n_serve .list .item{margin-top: 50px; display: flex;align-items: center;justify-content: center}
.n_serve .list .item .item_l{width: calc(610 / 1410 * 100%)} /*4326*/
.n_serve .list .item .item_r{width: calc(837 / 1410 * 100%);position: relative;transform: translateX(-2.62%);z-index: 9}/*5936*/
.n_serve .list .item .g_bg{padding-top: calc(420 / 610 * 100%);transition: .8s all ease}
.n_serve .list .item .item_text{padding:50px;background: #fff;transition: .4s all ease}
.n_serve .list .item .item_title{}
.n_serve .list .item .item_title i{font-size: 32px;color: #333;margin-right: 14px;}
.n_serve .list .item .item_title b{font-size: 34px;color: #222;font-weight: 600;font-family: "Arial Black";text-transform: capitalize ;position: relative}
.n_serve .list .item .item_title b:after{content: '';position: absolute;left: 0; bottom: 4px; width: 100%;height: 6px;background: #F50A04;}
.n_serve .list .item p{margin-top: 24px; font-size: 16px;color: #666;line-height: 26px}
.n_serve .list .item:hover .g_bg{transform: scale(1.06)}
.n_serve .list .item:hover .item_text{box-shadow: 0 0 4px #333}
.n_serve .list .item:nth-child(1){margin-top: 0}
.n_serve .list .item:nth-child(2n){flex-direction: row-reverse}
.n_serve .list .item:nth-child(2n) .item_r{transform: translateX(2.62%);}


@media  (max-width:1800px){

}
@media  (max-width:1680px){
    .n_yewu_nav .item .title span{font-size: 14px}
}
@media  (max-width:1440px){
    .pcNav_w{padding:0 50px;width: 100%}
    .g_w{width: 100%;padding: 0 50px}
    .n_title{font-size: 38px}
    .n_strength .list{margin-top: 20px}

    .n_yewu_nav .item .title{width: 90%}
    .n_yewu_nav .item .title span{white-space: initial;text-align: center}
    .n_yewu_nav .item .title b{font-size: 50px}
}


@media  (max-width:1350px){

}
@media  (max-width:1280px){
    .pcNav_list li{margin-right: 20px}
    .pcNav_list li a{font-size: 16px}
    .n_banner .text{font-size: 28px;height: 60px;line-height: 60px}

    .n_title{font-size: 30px;}

    .n_strength .list .item{width: calc(100% / 4);}


    .n_aboutNews .list .item_title{font-size: 14px}
    .n_aboutNews .list .item_text b{margin-top: 6px}

    .n_aboutNews .list{grid-column-gap:20px ; grid-row-gap: 20px}

    .n_serve .con1{padding: 60px 0}
    .n_serve .list .item .item_text{padding: 30px }
    .n_serve .list .item .item_title i{font-size: 28px}
    .n_serve .list .item .item_title b{font-size: 28px;}
    .n_serve .list .item .item_title b:after{bottom: 6px;height: 3px}
    .n_serve .list .item p{font-size: 14px;line-height: 22px;margin-top: 16px}

}
@media  (max-width:1240px){

}
@media  (max-width:1024px){
    .pcNav{display: none}
    .webNav{display: block}
    .g_body{padding-top: 60px}
    .i_body{padding-bottom: 60px}
    .i_count .item .item_count i{font-size:34px }
    .i_count .item p{font-size: 14px}
    .i_title b{font-size: 30px}
    .i_title b:nth-last-child(1):after{bottom:8px;height: 3px}
    .i_business{margin-top: 40px}
    .i_business .list .item a span{padding: 2px 8px;font-size: 14px}
    .i_technical{margin-top: 40px;padding-top: 40px}
    .i_technical .count{margin-top: 30px;padding: 40px 20px;}
    .i_technical .count .item .No{font-size: 30px}
    .i_technical .count .item .line{height: 40px;margin-top: 0}
    .i_technical .count .item .title{font-size: 18px}
    .i_technical .count .item p{font-size: 14px;line-height: 20px;height: 60px}
    .i_technical .count .item em{width: 36px;height: 36px;line-height: 34px}
    .i_cases{margin-top: 40px}
    .i_cases .btns .swiper-button-prev, .i_cases .btns .swiper-button-next{width: 36px;height: 36px;line-height: 34px}
    .i_cases .swiper-container{margin-top: 20px}

    .f_info b{font-size: 16px}
    .f_info p{font-size: 14px}

    .n_banner .text{font-size: 24px;height: 46px;line-height: 46px}
    .n_banner .text:after{height: 4px}

    .contact_info{padding: 20px 0}
    .contact_info .item{margin-top: 18px}
    .contact_info .name{font-size: 20px}
    .contact_info .item_text b{font-size: 14px}
    .contact_info .item_text p{font-size: 14px;line-height: 18px;}

    .n_con > .con_l{padding-top:30px}
    .n_con > .con_r{padding: 30px 0 30px 30px }

    .n_title{font-size: 24px;}

    .n_strength .list .item{width: calc(100% / 3);}

    .n_show .list{ grid-gap:10px ;grid-column: span 2;grid-template-columns: repeat(2,1fr);}

    .n_yewu_nav{display: block}
    .n_yewu_nav .item{width: 100%}
    .n_yewu_nav .item .g_bg{padding-top: 0;position: absolute;width: 100%;height: 100%}
    .n_yewu_nav .item .title{width: 100%; position: relative;left: auto;top: auto;bottom: auto; transform: translate(0);background: rgba(255,255,255,.8)}
    .n_yewu_nav .item a:before{z-index: 9}
    .n_yewu .n_show:before{left: -33px}


    .n_serve .con1{padding: 40px 0}
    .n_serve .list .item .item_text{padding: 20px }
    .n_serve .list .item .item_title i{font-size: 24px}
    .n_serve .list .item .item_title b{font-size: 24px;}
    .n_serve .list .item p{font-size: 14px;line-height: 22px;margin-top: 6px}
}
@media  (max-width:768px){
    .g_w{width: 100%;padding: 0 5%}
    .i_body{padding-bottom: 30px}
    .i_title b{font-size: 24px}
    .i_count{padding: 20px 0}
    .i_count .g_w{display: block}
    .i_count .item{width: 100%}
    .i_count .item .item_count i{font-size: 26px}
    .i_count .item .item_text{max-width: 100%;text-align: center}
    .i_count .item:after{display: none}
    .i_business{margin-top: 30px}
    .i_business .list{margin-top: 20px}
    .i_business .list{display: block;column-count:auto}
    .i_business .list .item{max-height: 400px;overflow: hidden}
    .i_technical .count{display: block;padding: 20px}
    .i_technical .count .item{width: 100%;max-width: 100%}
    .i_technical .count .item .No{display: none}
    .i_technical .count .item .line{display: none}
    .i_technical .count .item i{font-size: 26px}
    .i_technical .count .item p{height: auto}
    .i_technical .count .item em{display: none}
    .i_technical .count .item:hover i{font-size: 26px;opacity: 1;color: #F50A04}

    .i_cases_swipe{padding: 0 5%}

    footer .f_top .g_w{display: block;text-align: center}
    footer .f_top{padding: 20px 0}
    footer .f_info{margin-top: 10px}
    .f_info b{margin-top: 0}
    .f_info p{font-size: 12px}
    footer .f_bottom{font-size: 12px}

    .n_banner .text{font-size: 20px;height: 40px;line-height: 40px}
    .n_banner .text:after{height: 2px}

    .n_contact .con1 .g_w{display: block}
    .n_contact .con1 .con_l{margin: 0 auto;max-width: 200px; text-align: center}
    .n_contact .con1 .con_r{padding-left: 0;width: 100%}
    .contact_info .item{margin-top: 10px}
    .contact_info .item_text b{font-size: 14px}
    .contact_info .item_text p{font-size: 14px;line-height: 18px;}


    .n_strength .list{margin-top: 10px}
    .n_strength .list .item{width: calc(100% / 2);}

    .n_title{font-size: 20px}

    .n_con{display: block}
    .n_con > .con_l{width: 100%;padding-top: 20px}
    .n_con > .con_r{padding: 20px 0 ;width: 100%;border: 0}

    .n_text{font-size: 14px}

    .n_yewu .n_show:before{left: -5%;top: 2px}
    .n_show .title{font-size: 18px}

    .n_serve .list .item{display: block;margin-top: 20px}
    .n_serve .list .item .item_l{width: 100%}
    .n_serve .list .item .item_r{width: 100%;transform: translate(0) !important;}
    .n_serve .list .item .item_text{padding: 10px;box-shadow: 0 0 6px #333; }

}
@media  (max-width:640px){
    .n_show .list{ grid-column: span 1;grid-template-columns: repeat(1,1fr);}
}
@media  (max-width:500px){}