.appContent{
    width: 100%;
    margin: auto;
    text-align: center;
}
.appBox{
    width: 1200px;
    margin: auto;
}
.F_weChatBg{
    margin-top: 100px;width: 100%;text-align: center;cursor: pointer;
}
.F_weChatBox{
    width: 23%;background: #f4f2f3;border:1px solid #d1d1d1;position: relative;display: inline-block;margin: 0 0.8%
}
.wechatDj{
    width: 125px;height: 125px;border-radius: 50%;border:1px solid #d1d1d1;position: absolute;top: -62.5px;left:0;right:0;margin:auto
}
.dj1{
    background: url(../webImg/wachat01.png) center no-repeat #fff;
}
.dj2{
    background: url(../webImg/wachat02.png) center no-repeat #fff;
}
.dj3{
    background: url(../webImg/wachat03.png) center no-repeat #fff;
}
.dj4{
    background: url(../webImg/wachat04.png) center no-repeat #fff;
}
.wechatDjWord{
    padding-top: 80px;
}
.wechatDjTitle{
    font-size: 25px
}
.wechatDjDetail{
    color: #888888;padding: 0 10px
}
.wechatDjBtn{
    margin: 20px 0 30px 0;color: #888888;padding: 10px 40px;border-radius: 20px;font-size: 18px;display: inline-block;border: 1px solid #d1d1d1
}

.F_weChatBox:hover .dj1{
    background: url(../webImg/wachat001.png) center no-repeat #3D7BE1;
    transition: 0.3s;
}
.F_weChatBox:hover .wechatDjTitle{
    color: #fff;
    transition: 0.3s;
}
.F_weChatBox:hover .wechatDjDetail{
    color: #fff;
    transition: 0.3s;
}
.F_weChatBox:hover {
    background: #3D7BE1;
    transition: 0.3s;
}
.F_weChatBox:hover .dj2{
    background: url(../webImg/wachat002.png) center no-repeat #3D7BE1;
    transition: 0.3s;
}.F_weChatBox:hover .dj3{
     background: url(../webImg/wachat003.png) center no-repeat #3D7BE1;.
 transition: 0.3s;
 }
.F_weChatBox:hover .dj4{
    background: url(../webImg/wachat004.png) center no-repeat #3D7BE1;
    transition: 0.3s;
}
.F_weChatBox:hover .wechatDjBtn{
    color: #3D7BE1;
    background: #fff;
    border: 1px solid #fff;
    transition: 0.3s;
}
.tsBtn{
    border: 1px solid #3D7BE1;
    padding: 10px 40px;
    display: inline-block;
    font-size: 16px;
    margin: 20px 0;
    border-radius: 5px ;
}
.tsBtn:hover{
    background: #3D7BE1;
    color: #fff;
    transition: 0.3s;
}
.tsContentBg{
    margin-top: 30px;overflow:hidden;position: relative;
}
.tsWordBox{
    width:50%;display: inline-block;text-align: left;position: absolute;margin: auto;bottom: 60px;
}
.tsWordLeft{
    left:0;
    padding: 20px 40px 40px 0;
}
.tsWordRight{
    right:0;
    padding: 20px 0 40px 40px;
}
.tsTitle{
    font-size: 40px;font-weight: bold;
}
.tsDetail{
    font-size:16px;color: #888888;line-height: 30px
}
.tsImgBox{
    width: 50%;display: inline-block
}
.tsBg{
    background: #f4f4f4;width: 100%;margin: 50px 0
}
.left{
    float: left;
}
.right {
    float: right;
}
.contentBox{
    overflow: hidden;
    position: relative;
}
.swiperBox{
    border: 1px solid #d1d1d1;padding: 20px 0;width: 70%;cursor: pointer;
}
.swiperBox:hover {
    background: #3D7BE1;
    transition: 0.2s;
}
.swiperBox:hover p{
    color: #fff;
    transition: 0.2s;
}
.swiperBox:hover .zs1{
    background: url(../webImg/wachat005.png) center no-repeat;
}
.swiperBox:hover .zs2{
    background: url(../webImg/wachat006.png) center no-repeat;
}
.swiperBox:hover .zs3{
    background: url(../webImg/wachat007.png) center no-repeat;
}
.swiperBox:hover .zs4{
    background: url(../webImg/wachat008.png) center no-repeat;
}
.swiperBox:hover .jy1{
    background: url(../webImg/jy001.png) center no-repeat;
}
.swiperBox:hover .jy2{
    background: url(../webImg/jy002.png) center no-repeat;
}
.swiperBox:hover .jy3{
    background: url(../webImg/jy003.png) center no-repeat;
}
.swiperBox:hover .jy4{
    background: url(../webImg/jy004.png) center no-repeat;
}
.swiperBox:hover .fx1{
    background: url(../webImg/fx001.png) center no-repeat;
}
.swiperBox:hover .fx2{
    background: url(../webImg/fx002.png) center no-repeat;
}
.swiperBox:hover .fx3{
    background: url(../webImg/fx003.png) center no-repeat;
}
.swiperBox:hover .fx4{
    background: url(../webImg/fx004.png) center no-repeat;
}
.swiperBox:hover .xf1{
    background: url(../webImg/xf001.png) center no-repeat;
}
.swiperBox:hover .xf2{
    background: url(../webImg/xf002.png) center no-repeat;
}
.swiperBox:hover .xf3{
    background: url(../webImg/xf003.png) center no-repeat;
}
.swiperBox:hover .xf4{
    background: url(../webImg/xf004.png) center no-repeat;
}
.swiperBox:hover .cd1{
    background: url(../webImg/cd001.png) center no-repeat;
}
.swiperBox:hover .cd2{
    background: url(../webImg/cd002.png) center no-repeat;
}
.swiperBox:hover .cd3{
    background: url(../webImg/cd003.png) center no-repeat;
}
.swiperBox:hover .cd4{
    background: url(../webImg/cd004.png) center no-repeat;
}
.swiperBox:hover .hd1{
    background: url(../webImg/hd001.png) center no-repeat;
}
.swiperBox:hover .hd2{
    background: url(../webImg/hd002.png) center no-repeat;
}
.swiperBox:hover .hd3{
    background: url(../webImg/hd003.png) center no-repeat;
}
.swiperBox:hover .hd4{
    background: url(../webImg/hd004.png) center no-repeat;
}
.swiperBox:hover .hd5{
    background: url(../webImg/hd005.png) center no-repeat;
}
.swiperBox:hover .hd6{
    background: url(../webImg/hd006.png) center no-repeat;
}
.typeIcon{
    width: 104px;height: 104px;margin: auto
}
.zs1{
    background: url(../webImg/wachat05.png) center no-repeat;
}
.zs2{
    background: url(../webImg/wachat06.png) center no-repeat;
}
.zs3{
    background: url(../webImg/wachat07.png) center no-repeat;
}
.zs4{
    background: url(../webImg/wachat08.png) center no-repeat;
}
.jy1{
    background: url(../webImg/jy01.png) center no-repeat;
}
.jy2{
    background: url(../webImg/jy02.png) center no-repeat;
}
.jy3{
    background: url(../webImg/jy03.png) center no-repeat;
}
.jy4{
    background: url(../webImg/jy04.png) center no-repeat;
}
.fx1{
    background: url(../webImg/fx01.png) center no-repeat;
}
.fx2{
    background: url(../webImg/fx02.png) center no-repeat;
}
.fx3{
    background: url(../webImg/fx03.png) center no-repeat;
}
.fx4{
    background: url(../webImg/fx04.png) center no-repeat;
}
.xf1{
    background: url(../webImg/xf01.png) center no-repeat;
}
.xf2{
    background: url(../webImg/xf02.png) center no-repeat;
}
.xf3{
    background: url(../webImg/xf03.png) center no-repeat;
}
.xf4{
    background: url(../webImg/xf04.png) center no-repeat;
}
.cd1{
    background: url(../webImg/cd01.png) center no-repeat;
}
.cd2{
    background: url(../webImg/cd02.png) center no-repeat;
}
.cd3{
    background: url(../webImg/cd03.png) center no-repeat;
}
.cd4{
    background: url(../webImg/cd04.png) center no-repeat;
}
.hd1{
    background: url(../webImg/hd01.png) center no-repeat;
}
.hd2{
    background: url(../webImg/hd02.png) center no-repeat;
}
.hd3{
    background: url(../webImg/hd03.png) center no-repeat;
}
.hd4{
    background: url(../webImg/hd04.png) center no-repeat;
}
.hd5{
    background: url(../webImg/hd05.png) center no-repeat;
}
.hd6{
    background: url(../webImg/hd06.png) center no-repeat;
}
.swiperTitle{
    margin-top: 20px;margin-bottom: 10px;font-size: 20px;font-weight: bold
}
.swiperDetail{
    font-size: 16px;color: #888888;line-height: 30px
}
.type ul{
    padding: 30px 0 50px 0;
}
.type ul li{
    float: left;
    width:16.6%;
}
.type ul li a{
    display: inline-block;
    padding: 10px 40px;
    background: #dddddd;
    color: #000;
    border-radius: 20px;
    cursor: pointer;
    font-size: 16px;
}
.typeActive a {
    background: #3D7BE1 !important;
    transition: 0.1s;
    color: #fff !important;
}