.online_kefu{ position: fixed;  bottom: 10vh; right:1%; z-index: 9;}
.online_kefu ul li{ border: 1px solid #efefef; list-style-type:none; width:65px; height:60px; padding-top: 7px;  text-align: center; position: relative; background-color: #fff; color: #666666; cursor: pointer; transition: background-color .2s linear 0s;perspective:1000;transform-style:preserve-3d;}
.online_kefu li i{font-size: 20px;width: 100%;}
.online_kefu ul li a{ color: #666666;}
.online_kefu ul li .con{ position: relative; line-height:20px;font-size: 12px;}
.online_kefu ul li .hover_con{height: 240px;
    padding: 10px;
    width: 180px;
    left: -200px;background: #fff;
    box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.13);
    border: 1px solid #d8d8d8;border-radius: 3px;
    position: absolute;transition: all .2s linear 0s; top:-80px; display:none;}
.online_kefu ul li .hover_con:before{border: 1px solid #d8d8d8;
    visibility: visible;
    content: '';
    transform: rotate(45deg);
    width: 12px;
    height: 12px;
    background: #fff;
    right: -7px;
    position: absolute;
    border-left: none;
    border-bottom: none;
    top: 100px; }
.online_kefu ul li .hover_con p{ color: #333; line-height:24px;}
.online_kefu li:hover{background-color:#0c88d3; color: #fff;border: 1px solid #005CAC;}
.online_kefu li:hover i{ color: #fff;}
.online_kefu li:hover span{ color: #fff;}
.online_kefu li:hover p a{ color: #fff;}