﻿/* ====首页====== */

body{ background-color:#fff; font-family: "Arial";}

.header_nav{
    width: 100%;
    background: #fff;
    z-index: 9999
}
.fix{
    position: fixed;
    
    top: 0;
    left: 0;
}

/*background: linear-gradient(180deg, #70B3FF 0%, #0077FF 100%);*/

.inbk{display: inline-block; vertical-align: middle;}

/** header **/

.header{ position:relative; z-index:10; padding-bottom: 10px;}

.loarea{ height:110px; z-index:3;}

.logo{ /*width:200px;*/ display:block; padding-top:20px;}

/*.logo img{ height:60px; width:auto;}*/

.headerbox{display: flex; justify-content:space-between; flex-direction: row;}

/*PC导航 begin*/

.nav{z-index:5; padding-top: 45px;}

.navul{ font-size:0;}

.navul li{ display:inline-block; font-size:18px; font-size: 'Arial'; padding-bottom: 5px;}

.navul li>a{ color:#333; text-transform: uppercase; padding:0 15px 50px; text-align:center; display:inline-block; position: relative; }

.navul li>a:hover{ color: #f3a003!important; }

.act_nav{color: #f3a003!important; }



.navul li>a i{

    position: absolute;

    width: 0px;

    height: 3px;

    background: #f3a003;

    bottom: 0;

    left: 50%;

    transform: translateX(-50%); 

    -webkit-transform: translateX(-50%); 

    -moz-transform: translateX(-50%); 

    -ms-transform: translateX(-50%); 

    -o-transform: translateX(-50%);

    transition: .3s; 

    -webkit-transition: .3s; 

    -moz-transition: .3s; 

    -ms-transition: .3s; 

    -o-transition: .3s; 

}

.navul li>a:hover,.navul li>a.act_nav{color: #f3a003; }

.navul li>a:hover i{ width: 50px;}

.navul li>a.act_nav i{width: 50px;}
.navul li:hover .subnav{
     display: block;
}



/*登录注册*/

.inloginbxo{color: #cecece; font-size: 18px; padding-top: 35px; position: relative;}

.inloginbxo span{margin-right: 10px;}

.inloginbxo a{color: #fff;}

.inloginbxo a:hover{color: #fff;}

.searbtn{margin-right: 15px; background:#f3a003; color: #fff; width: 135px; height: 40px; line-height: 40px; border-radius: 40px; text-align: center;}





/*PC导航 begin*/

.subnav{ position:absolute; left:0; top:99%; width:100%; background:#fff; box-shadow:0 -5px 5px #f7f7f7;  display:none;}

.subnav1{display: flex; justify-content: center; flex-direction: row;}

.subnav1 dd img{width: 50px;}

.subnav1 dd{text-align: center; box-sizing: border-box; padding: 100px 20px; }

.subnav1 dd a{color: #333; display: block; font-size: 20px; font-size: 'Arial'; }

.subnav1 dd a:hover{color: #f3a003}

.subnav1 dd:hover{background: url(../images/navbgtp.png) no-repeat; background-size: 100% 100%}

.subnav1 dd .nr a{height:30px; text-align:left; line-height:30px; font-size:14px; display:block;  color:#333 !important; text-align:center; }

.subnav1 dd .nr a:hover{ color:#f3a003 !important; text-indent:2px; background-color:none;}

.subnav1 .tit{ font-size:16px; font-weight:bold; text-align:center; padding:8px 0 4px;}

/*.subnav2{ width:256px;}*/





/*手机导航按钮及下拉菜单begin*/

.menubtn{ position:absolute; width:24px; height:24px;top:19px; left:10px; cursor:pointer; display:none;}

.menubtn i{ display:block; width:21px; height:3px; background-color:#f3a003; position:absolute; -webkit-transition:.5s; -moz-transition:.5s; -ms-transition:.5s; -o-transition:.5s; transition:.5s;}

.menubtn i:nth-child(1){ top:4px; -webkit-transform-origin:left bottom; -moz-transform-origin:left bottom; -ms-transform-origin:left bottom; -o-transform-origin:left bottom; transform-origin:left bottom;}

.menubtn i:nth-child(2){ top:11px;}

.menubtn i:nth-child(3){ top:18px; -webkit-transform-origin:left top; -moz-transform-origin:left top; -ms-transform-origin:left top; -o-transform-origin:left top; transform-origin:left top;}

.menubtn.on i:nth-child(1){ -webkit-transform:rotate(40deg); -moz-transform:rotate(40deg); -ms-transform:rotate(40deg); -o-transform:rotate(40deg); transform:rotate(40deg);}

.menubtn.on i:nth-child(2){ opacity:0;}

.menubtn.on i:nth-child(3){ -webkit-transform:rotate(-40deg); -moz-transform:rotate(-40deg); -ms-transform:rotate(-40deg); -o-transform:rotate(-40deg); transform:rotate(-40deg);}

/*小导航*/

.inav{ background:url(../images/icon/black8.png) repeat; position:absolute; left:0; top:60px; width:100%; display:none; z-index:9; }

.inav{ display:none;}

.inav dl{ padding:0 10px; text-align:left;}

.inav dt{ font-size:14px; color:#fff; height:40px; line-height:40px; border-bottom:1px solid #ffa114; padding-left:8px; position:relative;}

.inavbtn{ position:absolute; right:0px; top:14px; width:14px; height:14px; background:url(../images/icon/jia3.png) center center no-repeat; -webkit-transform-origin:center center; -moz-transform-origin:center center; -ms-transform-origin:center center; -o-transform-origin:center center; transform-origin:center center;-webkit-transition:.5s; -moz-transition:.5s; -ms-transition:.5s; -o-transition:.5s; transition:.5s;}

.inav dd{ display:none; padding-left:2em; border-bottom:1px solid #ffa114; padding-bottom:6px;}

.inav a{ color:#fff;}

.inav a:hover{ color:#ccc;}

.inav dd h6{ font-size:14px; font-weight:normal; line-height:2;}

.inav dd h6 a{ display:block;}

.inav dd p{ font-size:12px; text-indent:1em; line-height:1.8;}

.act_inav{ font-weight:bold;}

.act_inav .inavbtn{ -webkit-transform:rotate(135deg) !important; -moz-transform:rotate(135deg) !important; -ms-transform:rotate(135deg) !important; -o-transform:rotate(135deg) !important;transform:rotate(135deg) !important;}

/*手机导航按钮及下拉菜单end*/

/*banner begin*/

.banner{ position:relative; z-index:3; }

.banner .swiper-slide{position:relative; overflow:hidden;}

.banimg{ width:100%; height:auto; display:block;-webkit-transition:all 20s ease-out 0s; -moz-transition:all 20s ease-out 0s; -ms-transition:all 20s ease-out 0s; -o-transition:all 20s ease-out 0s; transition:all 20s ease-out 0s;}

.banner .swiper-slide-active .banimg{-webkit-animation: zoomin_out 20s infinite ease-in-out;-moz-animation: zoomin_out 20s infinite ease-in-out;-ms-animation: zoomin_out 20s infinite ease-in-out;-o-animation: zoomin_out 20s infinite ease-in-out;}



@-webkit-keyframes zoomin_out{

0%{-webkit-transform:scale(1);}

50%{-webkit-transform:scale(1.1);}

100%{-webkit-transform:scale(1);}

}

@-moz-keyframes zoomin_out{

0%{-moz-transform:scale(1);}

50%{-moz-transform:scale(1.1);}

100%{-moz-transform:scale(1);}

}

@keyframes zoomin_out{

0%{transform:scale(1);}

50%{transform:scale(1.1);}

100%{transform:scale(1);}

}



.banner .swiper-pagination{ bottom:16px !important;}

.banner .swiper-pagination-bullet{

    width:40px;

    height:4px;

    padding: 0;

    background-color:#fff;

    font-size: 0;

    line-height: 0;

    outline:none;

    cursor: pointer; 

    -webkit-border-radius:0%; 

    -moz-border-radius:0%;

    -ms-border-radius:0%; 

    -o-border-radius:0%; 

    border-radius:0%;

    /*filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1; */

    margin:0 10px !important;

}



.banner .swiper-pagination-bullet-active{background-color:#fff;}

/*banner end*/



.bannerTextbox{

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%,-50%);

    -webkit-transform: translate(-50%,-50%);

    -moz-transform: translate(-50%,-50%);

    -o-transform: translate(-50%,-50%);

    -ms-transform: translate(-50%,-50%);

    font-size: 30px;

    line-height: 52px;

    color: #fff;

    text-align: center;

}

.bannerTextbox h3{

    font-size: 44px;

    font-weight: bold;

    color: #fff;

    margin-bottom: 15px;

}

.more{

    font-size: 18px;

    color: #fff;

    width: 180px;

    line-height: 50px;

    border-radius: 50px;

    text-align: center;

    background: linear-gradient(to right, #feca04, #f0a006);

    display: inline-block;

}

.inpartbg{

    padding: 40px 0;

}

.inpartbox{

    position: relative;

    padding: 0 5%;

}

.inpartbox .swiper-button-prev{

    width: 20px;

    height: 38px;

    background: url(../images/arrowpalt.png) no-repeat;

}

.inpartbox .swiper-button-next{

    width: 20px;

    height: 38px;

    background: url(../images/arrowpart.png) no-repeat;

}

.padb{padding: 50px 0;}

.inservBg{

    background: #f8f8f8;

}

.inservtop{

    display: flex;

    justify-content: space-between;

    align-items: center;

    margin-bottom: 30px;

}

.title{

    text-align: center;

    margin-bottom: 20px;

}

.title h3{

    color: #333333;

    font-size: 40px;

    font-weight: bold;

}

.title p{

    font-size: 18px;

    color: #333;
    margin-top: 15px;

}

.inservtop .title{

    margin-bottom: 0;

}

.moreser{

    font-size: 20px;

    color: #666;

    font-weight: bold;

    text-transform: uppercase;

}

.inservibox li{

    float: left;

    width: 31.3%;

    box-sizing: border-box;

    margin: 15px 1%;

    background: #fff;

    padding: 30px;

    font-size: 16px;

    color: #666;

    text-align: center;

    position: relative;
    overflow: hidden;


}

.inservibox li h3{

    font-size: 24px;

    color: #333;

    margin: 12px 0;

}

.inserLihover{

    position: absolute;

    top: 100%;

    left: 0;

    width: 100%;

    height: 100%;

    z-index: 999;

    display: flex;

    align-items: center;

    justify-content: center;

    background: url(../images/inserbg.png) no-repeat;
     transition: all 0.5s;
 /*   opacity: 0;*/

}


.detailbtn{

    color: #fdc804;

    font-size: 24px;

    /*text-decoration: underline;*/

    font-weight: bold;
    position: relative;

}
.inserLihover i{
    position: absolute;
    width: 0px;
    height: 3px;
    background: #fdc804;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
}

.inservibox li:hover .inserLihover{

 /*  opacity: 1;*/
 top: 0

}
.inservibox li:hover .inserLihover i{
    width: 100px;
}
.IndustriesBox{

    position: relative;

    padding: 0 5%;

}

.industrieLi>img{

    display: block;
    width: 100%

}

.industrieLi{

    position: relative;

    box-sizing: border-box;

    transition: 0.3s;

    overflow: hidden;

}

.industitbox{

    position: absolute;

    bottom: 0;

    left: 0;

    width: 100%;

    box-sizing: border-box;

    display: flex;

    justify-content: space-between;

    align-items: center;

    font-size: 24px;

    color: #fff;

    font-weight: bold;

    padding: 20px;

}

.industrieHover{

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

   position: absolute;

   top: 100%;

   left: 0;

   z-index: 999;

   width: 100%;

   height: 100%;

   box-sizing: border-box;

   color: #fff;

   font-size: 18px;

   line-height: 28px;

   padding: 30px 20px 0 20px;
   transition: all 0.5s

}
.industrieLi:hover .industrieHover{
   top: 0;
}
.industrieLi:hover .industitbox{
    display: none;
}
.industrieHover h3{

    font-size: 28px;

    font-weight: bold;

}

.IndustriesBox{

    position: relative;

}

.IndustriesBox .swiper-pagination{

    width: 100%;

    padding-top: 15px;

    left: 0;

}

.IndustriesBox .swiper-pagination-bullet{

    margin: 0 6px;

    background: #ccc;

    opacity: 1;

}

.IndustriesBox .swiper-pagination-bullet-active{

    background: #f3a004;

}

.intechBg{

    background: #f8f8f8;

}

.intechbox{

    display: flex;

    justify-content: space-between;

    align-items: center;

    margin: 35px 0;

}

.intechImg{

    width: 50%;

}

.intechText{

    line-height: 32px;

    width: 45%;

}

.intechText h3{

    font-size: 24px;

    color: #333;

    line-height: 32px;

    margin-bottom: 20px

}

.inproceBg{

    background: url(../images/inprocebg.png) no-repeat;

    background-size: 100% 100%;

}

.inproceBg .title h3{

    color: #fff;

}

.inproceBox{

    display: flex;

    justify-content: space-between;

}

.inproceLi{

    color: #fff;

    font-size: 24px;

    text-align: center;

    position: relative;
    width: 144px;

}

.inproceLi h3{

    font-size: 26px;

}

.imgtp{

    margin: 10px 0;

}

.inproceLi:after{

    content: "";

    position: absolute;

    top: 50%;

    background: url(../images/procearrow.png) no-repeat;

    width: 270px;

    height: 22px;

    transform: translate(18%,-145%);

}

.inproceLi:last-child:after{

    display: none;

}

.invicovBg{

    background: #f9f9f9;

}



.invicovBox{

    position: relative;

}

.invicovBox .swiper-pagination{

    width: 100%;

    padding-top: 15px;

    left: 0;

}

.invicovBox .swiper-pagination-bullet{

    margin: 0 6px;

    background: #ccc;

    opacity: 1;

}

.invicovBox .swiper-pagination-bullet-active{

    background: #f3a004;

}

.invicovLi{

    background: #fff;

    box-sizing: border-box;

    padding: 35px 20px;

}

.invicovTop{

    display: flex;

    justify-content: flex-start;

    align-items: center;

}

.invicoeText{

    margin-left: 15px;

}

.invicoeText h3{

    font-size: 24px;

    color: #333;

    font-weight: bold;

    margin-bottom: 8px;

}

.invocecent{

    margin: 15px 0;

    color: #333;

    font-size: 16px;

    line-height: 28px;

}

.invicoedate{

    color: #999999;

    font-size: 16px;

}

.incontactBg{

    background: url(../images/inftsub.png) no-repeat;

    background-size: 100% 100%;

}

.incontactBg .title{

    text-align: left;

}

.incontactTop{

    display: flex;

    justify-content: space-between;

}

.incontactTop input{

    background: #fff;

    border-radius: 5px;

    line-height: 38px;

    padding: 10px;

    box-sizing: border-box;

    border: none;

    width: 23%;

}
.incontactTop .contafile{
   width: 23%;
   background: #fff url(../images/upfil.png) no-repeat 98% center;
   line-height: 58px;
   height: 58px;
}
.incontactTop .contafile input{
    line-height: 58px;
}
.incontTare{

    height: 200px;

    background: #fff;

    border-radius: 5px;

    box-sizing: border-box;

    border: none;

    width: 100%;

    margin-top: 20px;

}

.submit{

    font-size: 18px;

    color: #fff;

    background: #f3a004;

    border-radius: 42px;

    line-height: 42px;

    width: 140px;

    margin-top: 15px;

}

.footer{

    background: #141b1e;

}

.footertop{

    padding: 60px 0 30px;

    display: flex;

    justify-content: space-between;

    flex-direction: row;

    font-size: 14px;

    color: #fff;

    line-height: 28px;

    border-bottom: 1px solid #242426

}

.footertop a{

    color: #fff;

    display: block;

}
.footertop a:hover{
    color: #f3a003
}

.footertop h3{

    font-size: 18px;

    color: #fff;

    font-family: 'Arial';

    margin-bottom: 20px;

}

.footerbot{

    padding: 20px 0;

    display: flex;

    justify-content: space-between;

    align-items: center;

    flex-direction: row;

}

.fotlxto{

    display: flex;

    justify-content: flex-start;

    align-items: center;

}

.fotlxto img{

    margin:10px 5px;

}

.adverbootfr{width: 100%; position: relative;}

.adverbootfr input{

    width: 100%;

    background: #2c3235;

    border-radius: 46px;

    line-height: 46px;

    padding: 0 47px 0 15px;

    border: none;

    color: #fff;

}

.adverbootfr button{

    position: absolute;

    top: 0;

    right: 0;

    display: block;

    border-radius: 46px;

    padding: 0;

    border: none;

    line-height: 0;

}

.footerbot{

    padding: 20px 0;

    border-top: 1px solid #202729;

    font-size: 16px;

    color: rgba(255,255,255, 0.36);

}

/*contact*/
.banimgarea {
     width: 100%
}
.banimgarea img{
    width: 100%
}
.nrbanner{

    width: 100%;

    position: relative;

}
.nrbanner img{
   width: 100%
}
.nybantext{

    color: #fff;

    font-size: 20px;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 50%;

    -webkit-transform: translate(-50%,-50%);

    -moz-transform: translate(-50%,-50%);

    -ms-transform: translate(-50%,-50%);

    -o-transform: translate(-50%,-50%);

    transform: translate(-50%,-50%);

}

.nybantext h3{

    font-size: 54px;

    font-weight: bold;

}

.currt{

    font-size: 16px;

    color: #333;

    margin: 30px 0

}

.currt a{

    color: #333;

    margin: 0 5px;

}

.currt a:hover,.currt a.on{

    color: #ff9900

}

.contactBox{

    display: flex;

    justify-content: space-between;

    flex-direction: row;

}

.contactFl,.contactFr{

    width: 48%;

}

.contactFl .title h3{

    font-size: 34px;

}

.contactFl .title p{

    color: #666;

    font-size: 16px;

}

.contactFr .title h3{

    font-size: 34px;

}

.contactFr .title p{

    color: #333;

}

.contactLi{

    margin-top: 25px;

    

    color: #333;

}

.contactLi h3{

    font-size: 18px;

    font-weight: bold;

    margin-bottom: 10px;

}

.contactLi input{

    width: 100%;

    box-sizing: border-box;

    padding: 0 20px;

    background: #f7f7f7;

    border: none;

    line-height: 48px;

    border-radius: 5px;

}
.contafile{
    position: relative;
    width: 100%;

    box-sizing: border-box;

    padding: 0 20px;
    line-height: 48px;

    border: none;

    height: 48px;

    border-radius: 5px;
    background: #f7f7f7 url(../images/upfil.png) no-repeat 98% center;

}
#fileNameDisplay{
box-sizing: border-box;

    line-height: 48px;
}
.contafile input{
    opacity: 0;
    position:absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 9999
}

.conttearx{

    width: 100%;

    box-sizing: border-box;

    padding:20px;

    background: #f7f7f7;

    border: none;

    border-radius: 5px;

    height: 210px;

}

.submit{

    font-size: 24px;

    color: #fff;

    font-weight: bold;

    width: 200px;

    line-height: 60px;

    text-align: center;

    border-radius: 60px;

    background: #ff9900;

}

.detailLi{

    margin-top: 25px;

    font-size: 18px;

    color: #333;

}

.detit{

    font-size: 18px;

    color: #999;

    margin: 0 25px 0 10px;

}

.map{

    width: 100%;

    margin-top: 35px;

}

.contactBox .title{

    text-align: left;

}

/**/

.avalilbgz{

    background: #f9f9f9;

    position: relative;

}

.title.titleSub{

    margin-bottom: 50px;

}

.title.titleSub h3{

    font-size: 40px;

}



.avalilTab{

    font-size: 24px;

    color: #333;

    background: #fff;

    width: 330px;

    display: flex;

    justify-content: space-around;

    position: absolute;

    left: 50%;

    top: 0;
    border-radius: 56px;

    -webkit-transform: translate(-50%,-50%);

    -moz-transform: translate(-50%,-50%);

    -ms-transform: translate(-50%,-50%);

    -o-transform: translate(-50%,-50%);

    transform: translate(-50%,-50%);



}

.avalilTab span{

    cursor: pointer;

    width: 50%;

    display: block;

     line-height: 56px;

    border-radius: 56px;

     text-align: center;

}
.avalilTab span:hover{
    background-color: #fac86c;

    color: #fff;
}

.avalilTab span.on{

    background-color: #f49f04;

    color: #fff;



}

.avalilTabSubbox{

    position: relative;

}

.avalilTabSub{

    display: flex;

    justify-content: center;

    align-items: center;

    opacity: 0;
    display: none;

}

.avalilTabSub.on{

     opacity: 1;
     display: flex;

}
.avalilTabSub span:hover{
    color: #fff;
    background: #fac86c
}
.avalilTabSub span{

    font-size: 20px; 

    color: #333;

    background: #fff;

    line-height: 50px;

    padding: 0 25px;

    border-radius: 50px;

    cursor: pointer;
    margin: 0 12px

}

.avalilTabSub span.on{

    color: #fff;

    background: #f49f04

}

.avalilcontbox .avalilcon{

    display: none;

}

.avalilcontbox .avalilcon.on{

    display: block;

}

.avalilcon .intechText h3{

    font-size: 38px;

    color: #333

}

.avalilcon .intechText{

    font-size: 16px;

    color: #666

}

.avacent{

    color: #333;

    font-size: 18px;

}

.avacent span{

    font-size: 20px;

    font-weight: bold;

}

.chosebox ul{

    /*display: flex;

    justify-content: space-around;

    flex-direction: row;

    flex-wrap: wrap;*/

}

.chosebox ul li{

    width: 46%;

    float: left;

    margin: 0 2%;

    border-bottom:1px solid #e5e5e5;

    padding: 50px 0;

    display: flex;

    justify-content: flex-start;

    font-size: 16px;

    color: #666;

    line-height: 25px;

}

.choseImg{

    margin-right: 20px;

}

.indusBg{

    background: #f9f9f9

}

 .title.titleSub p{

    font-size: 20px;

    margin-top: 20px;

 }

 .intechbox.intxch .intechText h3{

    font-weight: bold;

 }



 .serviceBg{

    background: #f7f7f7

 }

 .serviceBox ul li{

    float: left;

    background: #fff;

    width: 23%;

    margin: 20px 1%;

    text-align: center;

    box-sizing: border-box;

    padding: 40px 20px;

    font-size: 16px;

    color: #333;

    line-height: 26px;

 }

.serviceBox ul li h3{

    font-size: 24px;

    color: #333;

    font-weight: bold;

    margin: 12px 0

}



.aboutbox{

    position: relative;

    line-height: 32px;

}

.aboutbox h3{

   color: #333;

   font-size: 34px;

   font-weight: bold;

}





.qualityBox.serviceBox ul li{

    background: transparent;

}

.jsxcbox .title.titleSub h3{

    color: #f3a003

}

.caseBg{

    position: relative;

}



.casebox ul li{

    width: 31.3%;

    margin: 15px 1%;

    float: left;

    box-shadow: 0 0 5px #ccc;
    overflow: hidden;

}
.casebox ul li .imgW{
    overflow: hidden;
}
.casebox ul li .imgW img{
    transition: all 0.5s;
}
.casebox ul li:hover .imgW img{
    transform: scale(1.1);
}
.casebox ul li:hover .casecont h3{
   color:  #f3a003
}

.casecont{

    box-sizing: border-box;

    padding:12px 20px 25px;

    font-size: 16px;

    color: #666;

    line-height: 26px;

}

.casecont h3{

    font-size: 24px;

    color: #333;

    margin-bottom: 12px;

}



