.online_kefu{ position: fixed;  bottom: 20vh;right:1%;z-index: 9; font-size: 14px;}
.online_kefu ul li{border-radius: 3px; list-style-type:none; width:40px; height:40px; text-align: center; margin:5px 0; position: relative;
 background-color:#fff000; color: #fff; cursor: pointer; transition: background-color .2s linear 0s;perspective:1000;transform-style:preserve-3d;}
.online_kefu li i{font-size: 1.5rem;}
.online_kefu ul li a{ color: #fff;}
.online_kefu ul li .con{ position: relative; line-height:40px;}
.online_kefu ul li .hover_con{border-radius: 3px; position: absolute;	left:-200px;left:-100px;	width: 120px;	color: #ffffff;
	text-align: center;background-color: #282828;height:40px; line-height:40px; bottom:0; transform:rotateX(-90deg); transition: all .2s linear 0s; }
.online_kefu ul li .hover_con img{ width:100px;}
.online_kefu ul li.qrcode {  }
.online_kefu ul li.qrcode .hover_con{ height: 137px;padding: 10px;width: 130px;left: -141px;}
.online_kefu ul li.qrcode .hover_con p{ color: #fff; line-height:24px;}

.online_kefu li:hover{background-color:#333;}
.online_kefu li:hover .hover_con{left:-130px; transform:rotateY(0deg);}
.online_kefu li .hover_con:before{width: 0px;height: 0px;border: 8px solid transparent;border-left: 8px solid #282828; display: block; content: '';position: absolute; top: 12px;right: -16px; transition: top .2s linear ; transition-delay: .1s; }

.online_kefu li.qrcode:hover .hover_con{  bottom: -60px;}
.online_kefu li.qrcode:hover .hover_con:before{top: 48px;}

.mobile_mob{ display: none !important;}
@media (max-width: 767px) {
	.mobile_mob { display: inline-block !important; }
	.mobile_pc { display: none !important; }
}