.h_b{
    width: 1279px;


    margin: 0 auto;
    position: relative;
    margin-top:300px;
    z-index: 111;
    top: 60px;
    opacity: 0;
}
.h_b h2{ font-size:60px; font-weight:bold; color:#FFF; text-align:center;

}

.h_b img{
	width:1279px; height:325px; margin:0px auto;}
.h_b ul li::after{
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    height: 60px;
    width: 1px;
    background: #eaeaea;
    top: 50%;
    margin-top: -30px;
    content: '';
}
.h_b ul li:nth-child(5)::after{
    content: '';
    background: transparent;
}
.h_b ul li:hover{
    background: #e83828;
}
.h_b ul li:hover span{
    color: #fff;
}
.h_b ul li:hover::after{
    content: '';
    background: transparent;
}
.h_b ul li span{
    text-align: center;
    display: block;
	color:#333;
	font-size:16px;
}
.li1:hover .ion_before{
    -webkit-animation: tuila_l 3s linear 0s infinite alternate;
    background: url(../images/index01_before1.png) no-repeat center !important;
}
.li1:hover .ion{
    background: url(../images/index011.png) no-repeat !important;
}
.li1:hover .ion_after{
    -webkit-animation: tuila_r 1s linear 0s infinite alternate;
    background: url(../images/index01_after1.png) no-repeat center !important;
}
.li2:hover .ion{
    background: url(../images/index022.png) no-repeat !important;
}
.li2:hover .ion_before{
    -webkit-animation: water_line 0.8s linear 0s infinite alternate;
    background: url(../images/index02_before1.png) no-repeat center !important;
}
.li3:hover .ion{
    background: url(../images/index033.png) no-repeat !important;
}
.li3:hover .ion_before{
    -webkit-animation: bolang 1.5s linear 0s infinite alternate;
    background: url(../images/index03_before1.png) repeat !important;
}


.li4:hover .ion{
    background: url(../images/index044.png) no-repeat !important;
}
.li4:hover .ion_before{
    -webkit-animation: bolang 1.5s linear 0s infinite alternate;
    background: url(../images/index04_before1.png) repeat !important;
}
.li5:hover .ion{
    background: url(../images/index055.png) no-repeat !important;
}
.li5:hover .ion_before{
    -webkit-animation: bolang 1.5s linear 0s infinite alternate;
    background: url(../images/index05_before1.png) repeat !important;
}

.li6:hover .ion{
    background: url(../images/index066.png) no-repeat !important;
}
.li6:hover .ion_before{
    -webkit-animation: bolang 1.5s linear 0s infinite alternate;
    background: url(../images/index06_before1.png) repeat !important;
}
.ion{
    width: 80px;
    height: 80px;
    background-repeat: no-repeat;
    background-position: 0 0;
    margin: 25px auto 4px auto;
    position: relative;
}
.h_b ul li:nth-child(1) .ion{
    background-image: url(../images/index01.png);
}


.h_b ul li:nth-child(2) .ion{
    background-image: url(../images/index02.png);
}


.h_b ul li:nth-child(3) .ion_before{
    width: 64px;
    height: 16px;
    position: absolute;
    top: 65%;
    left: 0%;
    transition: all 0.5s ease;
    background: url(../images/index03_before.png) repeat;
}
.h_b ul li:nth-child(3) .ion{
    background-image: url(../images/index03.png);

}
.h_b ul li:nth-child(4) .ion{
    background-image: url(../images/index04.png);
}



.h_b ul li:nth-child(5) .ion{
    background-image: url(../images/index05.png);
}
.h_b ul li:nth-child(6) .ion{
    background-image: url(../images/index06.png);
}