@charset "utf-8";

body{ color:#333; font-size:14px;font-family: "Microsoft Yahei";} /*??????????*/
body,ul,ol,li,div,p,h1,h2,h3,h4,h5,h6,dl,dt,dd,img,span,input{margin:0;padding:0;list-style:none;}
a { color:#333; text-decoration:none;font-family: "Microsoft Yahei";}  /*for ie f6n.net*/
a:focus{outline:0;} /*for ff f6n.net*/
/*a:hover { text-decoration:underline;}*/
img{border:none;}
.vam { vertical-align:middle;}
.clear{clear:both; height:0; line-height:0; font-size:0;}
p{ font-family: "Microsoft Yahei"; }
h1,h2,h3,h4,h5,h6{ font-family:"Microsoft Yahei";}

.tr { text-align:right;}
.tl { text-align:left;}
.center { text-align:center;}
.fl { float:left;}
.fr { float:right;}
.pa{ position:absolute;}
.pr{ position:relative}
i,em{ font-style:normal;}
.clearfix:after{content:"";height:0;clear:both;display:block;visibility:hidden;}
.clearfix{zoom:1;}

.content{ width:1200px; margin:0 auto;font-family: "Microsoft Yahei";}

.tit {text-align: center;font-weight: normal; }
.tit i{ display: block;font-size: 16px;color: #358ee4;line-height: 16px;padding-bottom: 12px;text-transform: uppercase;}
.tit i b{ display: inline-block;width: 6px;height: 14px;color: #358ee4;content: "";background: #358ee4;margin: 0px 5px 0;}
.tit span{display:block;font-size: 30px;color: #358ee4;line-height: 30px;font-weight: bold;}
.tit em{ display: block;font-size: 14px;color: #666666;line-height: 14px;padding-top: 18px;}


.wb_yy{ padding-top: 54px;}
.wb_yy h2{ float: left;padding-top:18px ;padding-left:55px;font-weight: normal;margin-right: 60px;}
.wb_yy h2 b{ display: block;font-size: 23px;line-height: 23px;color: #333333;}
.wb_yy h2 span{ font-size: 16px;line-height: 20px;color: #333333;font-family: Arial;display: block;padding-top: 5px;padding-bottom: 10px;background:url(../images/wb_yybg.png) no-repeat bottom ;}

.wb_yy li{ float: left;width: 170px;height: 75px;border-left: 1px solid #bfbfbf;}
.wb_yy li img{ display: block;width: 50px;height: 50px;margin: 0 auto;}
.wb_yy li span{ display: block;font-size:16px ;line-height:36px ;color: #333333;text-align: center;}


.wb_yzcon{ height: 291px;margin: 52px -2px 0;background:url(../images/wb_yzbg.jpg) no-repeat center;}
.wb_yz h3{ padding-top: 107px;font-size: 20px;line-height: 20px;color: #4d99e3;text-align: center;}
.wb_yz p{ width: 200px;margin-top: 12px;margin-left: 50px;}
.wb_yz p span{display: block;float: left;width:100px;font-size: 14px;line-height: 32px;}
.wb_yzl{ float: left;width: 360px;margin-left: 120px;margin-right: 320px;}
.wb_yzr{ float: left;width:230px;}
.wb_yzr p{ margin-left: 25px;}
.wb_yzr p span:last-child{width: 220px;text-align: center; }

.wb_fw{ padding-top: 54px;}
.wb_fwcon{ margin-top: 35px;padding-top: 30px;height: 467px;background:url(../images/wb_fwcon.jpg) no-repeat center ;}
.wb_fwcon .fw_l{ float: left;}
.wb_fwcon .fw_l li{ width: 208px;float: left;}
.wb_fwcon .fw_l li img{ display: block;width:74px;height: 52px;margin: 0 auto 14px;}
.wb_fwcon .fw_l li b{ display: block;height:36px ;line-height: 36px;border-bottom: 2px solid #999999;font-size: 20px;text-align: center;color: #666666;}
.wb_fwcon .fw_l li span{ display: block;text-align: center;font-size: 14px;line-height: 30px;color: #666666;}
.wb_fwcon .fw_l li:nth-child(1) b{padding-top: 60px;margin-bottom: 20px;}
/*.wb_fwcon .fw_l li:nth-child(1) span{margin-bottom: 20px;}*/
.wb_fwcon .fw_l li:nth-child(2) b{ padding-top: 20px;margin-bottom: 20px;}
/*.wb_fwcon .fw_l li:nth-child(3) b{ display: block;height:153px ;line-height: 153px;font-size: 20px;text-align: center;color: #666666;border-bottom: 0;}*/

.wb_fwcon .fw_l li:nth-child(3) b{ padding-top: 20px;margin-bottom: 20px;}
.wb_fwcon .fw_l li:nth-child(1){ margin-top: 40px;}
.wb_fwcon .fw_l li:nth-child(1) p{height: 317px;width:148px;background: #fdfdfd;padding: 0 30px;}
.wb_fwcon .fw_l li:nth-child(2){ margin-top: 87px;}
.wb_fwcon .fw_l li:nth-child(2) p{height: 270px;width:148px;background: #fdfdfd;padding: 0 30px;border-left:1px solid #358ee4;}
.wb_fwcon .fw_l li:nth-child(3){ margin-top: 144px;}
.wb_fwcon .fw_l li:nth-child(3) p{height: 213px;width:148px;background: #fdfdfd;padding: 0 30px;border-left:1px solid #358ee4;}
.wb_fwcon .fw_l li:hover p{ background:#f1f1f1;}

.wb_fwcon .fw_r{ float: right;width:548px;height: 422px;position:relative;}
.wb_fwcon .fw_r em{ display:block;width:548px;height: 422px;}
.wb_fwcon .fw_r em img{display:block;width:548px;height: 422px;}
 .fw_r .fw_t{ position: absolute;left: 440px;bottom:24px;}
.fw_r .fw_t li{ float: left;margin: 0 6px;width:12px ;height: 12px;border-radius: 6px;background: #fff;}
.fw_r .fw_t li.cur{ background: #358ee4;opacity: 1;}


.wb_ms{ padding-top: 36px;}
.wb_mscon{ margin-top: 32px;}
.wb_mscon li{float: left;border-radius: 6px;border:1px solid #e8e8e8;box-sizing: border-box;margin-right: 9px;position:relative;}
.wb_mscon li:last-child{ margin-right: 0;}
.wb_mscon li i{ display:block;width: 273px;height: 164px;overflow:hidden;    padding: 9px 9px 0;}
.wb_mscon li img{width: 273px;height: 164px;display: block;transition:all 0.3s;}
.wb_mscon li:hover img{ transform:scale(1.05);}
.wb_mscon li span{ display: block;font-size: 16px;line-height:30px ;color: #333333;height: 30px;text-align: center;}
.wb_mscon li p{ position:absolute;left:0;top:0;opcity:0.8;font-size: 14px;color:#fff;text-align:center;background:rgba(0,0,0,0.55);display:none;height:173px;line-height:164px;width:100%;}
.wb_mscon li:hover p{display:block;}

.wb_xgg{height: 216px;background:url(../images/wb_xgg.jpg) no-repeat center;margin-top: 60px;}
.wb_xgg span { display: block;float: left;padding-left: 143px;padding-top: 40px;}
.wb_xgg span em{ display: block;font-size:22px ;line-height: 45px;color: #ffffff;font-weight:bold;font-family: 思源黑体 CN;letter-spacing: 2px;}
.wb_xgg p{ float: right;padding-top:59px ;padding-right: 124px;}
.wb_xgg p em{ display: block;font-size: 14px;line-height: 14px;color: #fff;}
.wb_xgg p b{ font-size: 26px;line-height: 26px;color: #fff;font-family: Arial;display: block;padding-top: 4px;}



.wb_ys{ padding-top: 70px;padding-bottom: 80px;}
.wb_yscon{ margin-top: 72px;height: 600px!important;}
.wb_yscon dt img{ width: 1172px;height: 600px;float: right;margin-right: -360px;}
.wb_yscon dd{float: left;width:388px;margin-left: -360px;height: 600px;background: #f6f6f6;padding-left: 360px;}
.wb_yscon dd h3{display: block;width: 216px;height: 100px;line-height: 124px;background:url(../images/wb_ysic.png) no-repeat center;margin-top: 76px;font-size: 36px;color: #3286d8;}
.wb_yscon dd p{ display: block;font-size: 16px;line-height:30px ;color: #666666;width:340px ;margin-top: 40px;}
.wb_yst{width:600px;margin-top: -185px;height: 105px; position: relative;z-index: 100;}
.wb_yst li{float: left;width:194px;height:105px ;line-height:105px ;font-size: 26px;color: #fff;text-align: center;background: rgba(54,54,54,0.8);}
.wb_yst li.cur{ background: #3286d8;}

.wb_fa{ padding-top: 128px;}
.wb_fal{ float: left;width: 296px;height:621px ;background:url(../images/wb_fal.png) no-repeat center;}
.wb_fal em img{display: block;width:172px ;height:172px ;margin: 78px auto 0;}
.wb_fal b{ display: block;font-size: 22px;line-height:36px ;color: #333333;text-align: center;padding-top: 50px;}
.wb_fal p{ display: block;padding-top: 60px;}
.wb_fal span{ display: block;font-size: 18px;line-height:18px ;color: #333333;text-align: center;}
.wb_fal i{ display: block;font-size: 30px;line-height:30px ;color: #358ee4;text-align: center;padding-top: 20px;font-weight: bold;}
.wb_far{ float: right;width:885px;margin-top: 40px;position: relative;}
.wb_far li{ float: left;width:287px;height: 166px;position: relative;margin-right: 12px;margin-bottom: 12px;}
.wb_far li:nth-child(3n){ margin-right: 0;}
.wb_far li i{ display:block; width:287px;height: 166px;overflow:hidden;}
.wb_far li i img{ display:block; width:287px;height: 166px;transition:all 0.5s;}
.wb_far li:hover img{ transform:scale(1.05);}

.wb_far li span{ display: block;width:100%;height: 30px;line-height: 30px;background: rgba(0,0,0,0.39);font-size: 18px;color: #fff;text-align: center;position: absolute;left: 0;bottom: 0;}
.wb_far p img{ width: 172px;height: 275px;position: absolute;left: -84px;bottom: -47px;}


.wb_zz{ padding-top: 60px;}
.wb_zzcon{ margin-top: 28px;position: relative;}
.wb_zzcon li{ float: left;width:292px;height: 208px;position: relative;margin-right: 12px;}
.wb_zzcon li i{width:292px;height: 208px;display:block;overflow:hidden; }
.wb_zzcon li img{ width:292px;height: 208px;transition:all 0.5s;}
.wb_zzcon li:hover img{ transform:scale(1.05);}
.wb_zzcon li span{ display: block;width:100%;height: 30px;line-height: 30px;background: rgba(0,0,0,0.39);font-size: 16px;color: #fff;text-align: center;position: absolute;left: 0;bottom: 0;}
.wb_zzcon .wb_prev{ position:absolute; left:-80px; top:88px; width:62px;height:62px; background:url(../images/wb_prev.png) no-repeat;z-index: 100;}
.wb_zzcon .wb_next{ position:absolute; right:-80px; top:88px;  width:62px;height:62px; background:url(../images/wb_next.png) no-repeat;z-index: 100;}

.wb_case{ padding-top: 92px;}
.wb_casecon{ padding-top:70px;height: 618px;background:url(../images/wb_casebg.jpg) no-repeat center;margin-top: 32px;}
.wb_cases{ height: 377px!important;}
.wb_cases dt{float: left;width: 598px;height: 337px;display:block;overflow:hidden;}
.wb_cases dt img{width: 598px;height: 337px;overflow:hidden; transition:all 0.5s;}
.wb_cases dt:hover img{ transform:scale(1.05);}

.wb_cases dd{ float: left;padding-left: 20px;width:530px;}
.wb_cases dd h3 a{display: block;font-size: 32px;line-height: 32px;color: #fff;padding-top: 48px;font-weight: normal;}
.wb_cases dd h4{display: block;font-size: 20px;line-height: 20px;color: #0e0e0e;padding-top: 94px;font-weight: normal;}
.wb_cases dd p{display: block;font-size: 16px;line-height: 24px;color: #333333;padding-top: 30px;}
.wb_caset{ margin-top: 50px;}
.wb_caset li{ float: left;width:244px;height: 138px;position: relative;margin-right: 56px;position: relative;}
.wb_caset li.cur:after{position: absolute;width: 36px;height: 22px;left: 50%;top: -45px;content: "";background:url(../images/wb_casesan.png) no-repeat center;margin-left: -18px; }
.wb_caset li:nth-child(4){ margin-right: 0;}
.wb_caset li img{ width:244px;height: 138px;}
.wb_caset li span{ display: block;width:100%;height: 30px;line-height: 30px;background: rgba(0,0,0,0.71);font-size: 14px;color: #fff;text-align: center;position: absolute;left: 0;bottom: 0;}

.wb_tx{ height: 803px;background:url(../images/wb_txbg.jpg) no-repeat center;}
.wb_tx h3{display:block;font-size: 30px;color: #358ee4;line-height: 30px;font-weight: bold;text-align: center;padding-top: 114px;}
.wb_txt { margin-left: 124px;margin-top: 30px;}
.wb_txt li{ float: left;width:86px ;margin-right:90px ;padding-top: 20px;height: 78px;background:url(../images/wb_txt.png) no-repeat center;}
.wb_txt li:hover{background:url(../images/wb_txth.png) no-repeat center; }
.wb_txt li em{ display: block;width: 35px;height: 35px;overflow:hidden;margin: 0 auto;}
.wb_txt li em img{ display: block;width: 35px;height:35px;transition: all 0.3s;}
.wb_txt li:hover em img:nth-child(1){margin-top:-35px;}
.wb_txt li span{ display: block;font-size:14px ;line-height: 14px;color: #666666;margin-top: 6px;text-align: center;}
.wb_txt li:hover span,.wb_txt li.cur span{ color: #fff;}
.wb_tx h4{display:block;font-size: 16px;color: #333333;line-height: 16px;text-align: center;padding-top: 22px;position: relative;font-weight: normal;}
.wb_tx h4:after{ position: absolute;left: 50%;top: 58px;width:80px ;height: 1px;background: #666666;content: "";margin-left:-40px ;}
.wb_txcon{ margin-top: 54px;position: relative;}
.wb_txcon li{ float: left;width: 315px;height: 193px;margin-right: 570px;margin-bottom: 5px;}
.wb_txcon li:nth-child(2n){ margin-right: 0;}
.wb_txcon li img{ width: 315px;height: 193px;display: block;}
.wb_txcon p{ width: 560px;height: 392px;display: block;position: absolute;left:320px;top: 0px;}
.wb_txcon p img{ width: 560px;height: 392px;display: block;}



.wb_liu{ padding-top: 132px;}
.wb_liu h3{display:block;font-size: 30px;color: #358ee4;line-height: 30px;font-weight: bold;text-align: center;}
.wb_liu ul{ margin-top: 50px;}
.wb_liu ul li{ width: 200px;float: left;position: relative;}
.wb_liu ul li i{display: block;width: 90px;height: 90px;margin: 0 auto;border-radius: 45px;transition:all 0.5s;}
  .wb_liu ul li:hover i{  transform: rotate(360deg);}
.wb_liu ul li span{ display: block;font-size:20px ;line-height: 36px;color: #333333;text-align: center;}
.wb_liu ul li:after{ position: absolute;width: 15px;height: 18px;right: 0;top: 45px;content: "";background:url(../images/wb_liujt.png) no-repeat center;}
.wb_liu ul li:last-child:after{ background: 0;}
.wb_liu ul li:nth-child(1) i{background:url(../images/wb_liuic1.png) no-repeat center #e9e9e9; }
.wb_liu ul li:nth-child(2) i{background:url(../images/wb_liuic2.png) no-repeat center #e9e9e9; }
.wb_liu ul li:nth-child(3) i{background:url(../images/wb_liuic3.png) no-repeat center #e9e9e9; }
.wb_liu ul li:nth-child(4) i{background:url(../images/wb_liuic4.png) no-repeat center #e9e9e9; }
.wb_liu ul li:nth-child(5) i{background:url(../images/wb_liuic5.png) no-repeat center #e9e9e9; }
.wb_liu ul li:nth-child(6) i{background:url(../images/wb_liuic6.png) no-repeat center #e9e9e9; }
.wb_liu ul li:nth-child(1):hover i{background:url(../images/wb_liuic1h.png) no-repeat center #358ee4; }
.wb_liu ul li:nth-child(2):hover i{background:url(../images/wb_liuic2h.png) no-repeat center #358ee4; }
.wb_liu ul li:nth-child(3):hover i{background:url(../images/wb_liuic3h.png) no-repeat center #358ee4; }
.wb_liu ul li:nth-child(4):hover i{background:url(../images/wb_liuic4h.png) no-repeat center #358ee4; }
.wb_liu ul li:nth-child(5):hover i{background:url(../images/wb_liuic5h.png) no-repeat center #358ee4; }
.wb_liu ul li:nth-child(6):hover i{background:url(../images/wb_liuic6h.png) no-repeat center #358ee4; }


.wb_xc{ padding-top: 116px;}
.wb_xc h3{display:block;font-size: 30px;color: #358ee4;line-height: 30px;font-weight: bold;text-align: center;margin-bottom: 36px;}
.wb_xc ul{ margin-bottom: 20px;}
.wb_xc ul li{ float: left;width: 585px;height: 378px;}
.wb_xc ul li img{ display:block;width: 585px;height: 378px;}
.wb_xc ul li:nth-child(2n){ float: right;}
.wb_xc p img{ display:block;width: 1200px;height: 364px;margin-bottom: 20px;}

/*友情链接*/

.f_link{background:url(../images/link_bg.jpg) no-repeat center 0;height: 120px;overflow: hidden;line-height: 80px;overflow: hidden;}
.f_link b{display: block;float: left;font-size: 14px;color: #fff;width: 80px;}
.f_link p{font-size: 14px;color: #fff;float: left;width: 1120px;}
.f_link p a{font-size: 14px;color: #fff; padding:0 10px 0 0;}


@-webkit-keyframes fadeInDown1 {
    from { opacity: 0; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
@keyframes fadeInDown1 {
    from { opacity: 0; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
.fadeInDown1 { -webkit-animation-name: fadeInDown1; animation-name: fadeInDown1 }
@-webkit-keyframes fadeInDown2 {
    from { opacity: 0; -webkit-transform: translate3d(0, -20%, 0); transform: translate3d(0, -20%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
@keyframes fadeInDown2 {
    from { opacity: 0; -webkit-transform: translate3d(0, -20%, 0); transform: translate3d(0, -20%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
.fadeInDown2 { -webkit-animation-name: fadeInDown2; animation-name: fadeInDown2 }
@-webkit-keyframes fadeInLeft1 {
    from { -webkit-transform: translate3d(-10%, 0, 0); transform: translate3d(-10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInLeft1 {
    from { -webkit-transform: translate3d(-10%, 0, 0); transform: translate3d(-10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInLeft1 { -webkit-animation-name: fadeInLeft1; animation-name: fadeInLeft1 }
@-webkit-keyframes fadeInLeft2 {
    from { -webkit-transform: translate3d(-5%, 0, 0); transform: translate3d(-5%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInLeft2 {
    from { -webkit-transform: translate3d(-5%, 0, 0); transform: translate3d(-5%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInLeft2 { -webkit-animation-name: fadeInLeft2; animation-name: fadeInLeft2 }
@-webkit-keyframes fadeInRight1 {
    from { -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInRight1 {
    from { -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInRight1 { -webkit-animation-name: fadeInRight1; animation-name: fadeInRight1 }
@-webkit-keyframes zoomLeft {
    from { -webkit-transform: scale3d(0.3, .3, .3); transform: scale3d(0.3, .3, .3); opacity: 0 }
    50% { opacity: 1 }
}
@keyframes zoomLeft {
    from { -webkit-transform: scale3d(0.3, .3, .3); transform: scale3d(0.3, .3, .3); opacity: 0 }
    50% { opacity: 1 }
}
.zoomLeft { -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-animation-name: zoomLeft; animation-name: zoomLeft }
.zoomRight { -webkit-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-animation-name: zoomLeft; animation-name: zoomLeft }
@-webkit-keyframes fadeInUp1 {
    from { -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInUp1 {
    from { -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInUp1 { -webkit-animation-name: fadeInUp1; animation-name: fadeInUp1 }
@-webkit-keyframes fadeInUp2 {
    from { -webkit-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInUp2 {
    from { -webkit-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInUp2 { -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2 }
@keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}
@-moz-keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}
@-webkit-keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}
@-o-keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}