.reversal{
    position: relative;
    height:350px;
}
.face,.back{
    width:100%;
    position: absolute;
    backface-visibility: hidden;
    transform-style: preserve-3d;
    transition: transform .9s;
	-webkit-backface-visibility:hidden;
	-moz-backface-visibility:hidden;
	-ms-backface-visibility:hidden; 
}
.face{
    transform: rotateY(0deg);
    -webkit-transform: rotateY(0deg);
}
.back{
    transform: rotateY(-180deg);
    -webkit-transform: rotateY(-180deg)
}

.bottom_item{
    float:left;
    /* width:16.666%; */
    width:20%;
    height:auto;
    padding-top: 12px;
}

#list_box_height{
    width:95%;
    margin:0px auto;
    padding-top: 70px;
    padding-bottom: 80px;
    border-bottom: 1px dashed #888888;
}
.boxFoot{
    width:100%;
    background-color:#eee;
    padding-bottom: 15px;
}
.i_img{
    position: relative;
    width:99px;
    height:99px;
    line-height: 96px;
    text-align: center;
    margin: 12px auto 0;
    border-radius: 100%;
    z-index:1;
    background: url('../../img/type-icons/zd_xb.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
/* .iconBj{
    position: absolute;
    top:25%;
    left:25%;
    width:48px;
    height:48px;
    background-repeat: no-repeat;
    background-size: cover;
    transform:rotate(0deg);
    -webkit-transform: rotate(0deg);
    transition: transform .9s;

} */
/*.i_img .iconBj{
    background-image:url("../../img/type-icons/d_z.png");
}*/
/* .bottom_item:hover .i_img1{
    transform: rotate(360deg);
} */
.i_img1{
    position: relative;
    width:99px;
    height:99px;
    line-height: 99px;
    text-align: center;
    margin: 12px auto 0;
    background: url('../../img/type-icons/xn_ao.png');
    background-size: 100% 100%;
    background-repeat: no-repeat; 
    /* border-radius: 100%; */
    /* border:1px solid #27649c;
    z-index:1;*/
}
/* .i_img1 .iconBj{
    background-image:url("../../img/type-icons/x_n.png");
} */
.i_img2{
    position: relative;
    width:99px;
    height:99px;
    line-height: 96px;
    margin: 12px auto 0;
    text-align: center;
    border-radius: 100%;
    z-index:1;
    background: url('../../img/type-icons/qt_zx.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
/* .i_img2 .iconBj{
    width:60px;
    height:60px;
    top:15%;
    left:19%;
    background-image:url("../../img/type-icons/x_b.png");
} */
.i_img3{
    position: relative;
    width:99px;
    height:99px;
    line-height: 96px;
    margin: 12px auto 0;
    text-align: center;
    border-radius: 100%;
    background: url('../../img/type-icons/dz_xx.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    z-index:1;
}
/* .i_img3 .iconBj{
    background-image:url("../../img/type-icons/x_x.png");
} */
.i_img4{
    position: relative;
    width:99px;height:99px;margin: 12px auto 0;
    background: url('../../img/type-icons/zs_jy.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.i_img5{
    position: relative;
    width:99px;
    height:99px;
    line-height: 96px;
    margin: 12px auto 0;
    text-align: center;
    border-radius: 100%;
    background: url('../../img/type-icons/jw_xt.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    z-index:1;
}
/* .i_img5 .iconBj{
  background-image: url("../../img/type-icons/j_w.png");
  background-position: center;
} */
.i_img6{
    position: relative;
    width:99px;
    height:99px;
    line-height: 96px;
    text-align: center;
    margin: 12px auto 0;
    border-radius: 100%;
    background: url('../../img/type-icons/kygl_xt.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    z-index:1;
}
/* .i_img6 .iconBj{
    background-image: url("../../img/type-icons/g_k.png");
  } */
.i_img7{
    position: relative;
    width:99px;
    height:99px;
    line-height: 96px;
    text-align: center;
    margin: 12px auto 0;
    border-radius: 100%;
    background: url('../../img/type-icons/jy.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    z-index:1;
}
/* .i_img7 .iconBj{
    background-image: url("../../img/type-icons/j_y.png");
  } */
.btnh1{
    text-align: center;
    font-size: 18px;
    margin-top:14px;
    font-weight: normal;
}
.btnh1 a{color:#27649c;}

 /* .bottom_item:hover .i_img{
    background-color:#27649c;
} */
.bottom_item:hover .i_img{
   background-image: url("../../img/type-icons/zd_xb_hover.png");
}
.bottom_item:hover .i_img1{
    background-image: url("../../img/type-icons/xn_ao_hover.png");
}
/* .bottom_item:hover .i_img1 .iconBj{
    background-image: url("../../img/type-icons/x_n_hover.png");
 }  */

/* .bottom_item:hover .i_img2{
    background-color: #27649c;
} */
.bottom_item:hover .i_img2{
    background-image:url("../../img/type-icons/qt_zx_hover.png");
}
/* .bottom_item:hover .i_img3{
    background-color: #27649c;
} */
.bottom_item:hover .i_img3{
    background-image:url("../../img/type-icons/dz_xx_hover.png");
}
.bottom_item:hover .i_img4{
    height:48px;
    width:48px;
    z-index:11;
    background-image:url("../../img/type-icons/zs_jy_hover.png");
    animation: change_kx 0.3s forwards;
}
.bottom_item:hover .b_list{
    margin-top: -50px;
    display: block;
    opacity: 1;
}
/* .bottom_item:hover .i_img5{
    background-color: #27649c;
} */
.bottom_item:hover .i_img5{
    background-image:url("../../img/type-icons/jw_xt_hover.png");
}
/* .bottom_item:hover .i_img6{
    background-color: #27649c;
} */
.bottom_item:hover .i_img6{
    background-image: url("../../img/type-icons/kygl_xt_hover.png");
}
/* .bottom_item:hover .i_img7{
    background-color: #27649c;
} */
.bottom_item:hover .i_img7{
    background-image: url("../../img/type-icons/jy_hover.png");
}
.bottom_item:hover .btnh1 a{color:#F27405}
.bottom_item .b_list{
    position: relative;
    margin-top: -50px;
    display: none;
    opacity: 0;
}
.bottom_item .b_list li{
    text-align: center;
    background: #ffffff;
    padding-bottom: 10px;
    padding-top: 20px;
    font-size: 16px;
    font-family: "微软雅黑";
}
.padTop{padding-top: 40px!important;}
.bottom_item .b_list li a{color:#000000}
.bottom_item .b_list li:hover a{color:#F27405}
.margin-tongzhi{margin-top: 70px;}
@keyframes change_kx{
    from{background-image: url("../../img/type-icons/zs_jy.png"); width: 99px; height: 99px; }
    to{background-image: url("../../img/type-icons/zs_jy_hover.png");   width: 48px; height: 48px; margin-top: -40px;}
}
@media (max-width: 992px) {
    .bottom_item{
        width:25%;
    }
}
@media (min-width:768px){
    .reversal:hover .back{
        -webkit-transform: rotateY(0deg);
        transform: rotateY(0deg);
        
    }
    .reversal:hover .face{
        -webkit-transform: rotateY(-180deg);
        transform: rotateY(-180deg);
    }
}
@media (max-width: 768px) {
    .margin-tongzhi{margin-top: 0px;}
    #list_box_height{padding-top: 10px;}
    .boxFoot{padding-bottom: 1px;margin-top: 70px;}
    .i_img,.i_img1,.i_img2,.i_img3,.i_img4,.i_img5,.i_img6,.i_img7{
        width:80px;height:80px;
    }
    .iconBj{height:35px;width:35px;}
    .i_img2 .iconBj{
        top:20%;
        left:24%;
        height:40px;
        width:40px;
    }
    .i_img3 .iconBj{
        top:25%;
        left:27%;
    }
    .i_img1 .iconBj{
        left:26%;
    }
}
@media (max-width: 767px) {
   .back{
        display:none!important;
    }
}
@media (max-width: 500px) {
    .bottom_item{
        width:50%;
    }
}
@media (max-width: 576px) {
    .keyan-card-2{
        padding-top: 45px;
        padding-bottom: 50px;
        margin-top: 15px;
    }
    .keyan-line-2{height:35px;}
    .keyan-line-1{height:42px;}
    .reversal{
       height:300px;
    }
}