@charset "utf-8";

* {

	padding: 0;

	margin: 0;

	font-family: "微软雅黑"

}

* {

	padding: 0;

	margin: 0;

	font-family: "微软雅黑"

}

ol, ul {

	list-style: none

}

a {

	text-decoration: none;

	color: #686868

}

img {

	border: 0

}

.side {

	position: fixed;

	width: 78px;

	right: 0;

	top: 68%;

	margin-top: -200px;

	z-index: 1000;

	border: 1px solid #e0e0e0;

	background: #fff;

	border-bottom: 0

}

.side ul li {

	width: 78px;

	height: 78px;

	float: left;

	position: relative;

	border-bottom: 1px solid #e0e0e0;

	color: #fff;

	font-size: 14px;

	line-height: 38px;

	text-align: center;

	transition: all .3s;

	cursor: pointer;

	background: #008cd6;

}

.side ul li a { color:#fff; }

.side ul li:hover {

	background: #333;

	color: #fff

}

.side ul li:hover a {

	color: #fff

}

.side ul li i {

	height: 25px;

	margin-bottom: 1px;

	display: block;

	overflow: hidden;

	background-repeat: no-repeat;

	background-position: center center;

	background-size: auto 25px;

	margin-top: 14px;

	transition: all .3s

}

.side ul li i.bgs1 {

	background-image: url(../images/whatsapp-w.png)

}

.side ul li i.bgs2 {

	background-image: url(../images/right_pic7.png)

}

.side ul li i.bgs3 {

	background-image: url(../images/right_pic2_on.png)

}

.side ul li i.bgs4 {

	background-image: url(../images/right_pic1_on.png)

}

.side ul li i.bgs5 {

	background-image: url(../images/email-w.png)

}

.side ul li i.bgs6 {

	background-image: url(../images/right_pic6_on.png)

}

.side ul li:hover i.bgs1 {

	background-image: url(../images/whatsapp-w.png)

}

.side ul li:hover i.bgs2 {

	background-image: url(../images/right_pic7_on.png)

}

.side ul li:hover i.bgs3 {

	background-image: url(../images/right_pic2_on.png)

}

.side ul li:hover i.bgs4 {

	background-image: url(../images/right_pic1_on.png)

}

.side ul li:hover i.bgs5 {

	background-image: url(../images/email-w.png)

}

.side ul li .sidebox {

	position: absolute;

	width: 78px;

	height: 78px;

	top: 0;

	right: 0;

	transition: all .3s;

	overflow: hidden

}

.side ul li.sidetop {

	background: #f67524;

	color: #fff

}

.side ul li.sidetop:hover {

	opacity: .8;

	filter: Alpha(opacity=80)

}

.side ul li.sideewm .ewBox.son {

	width: 200px;

	display: none;

	color: #363636;

	text-align: center;

	padding-top: 200px;

	position: absolute;

	left: -200px;

	top: 0;

	background-image: url(../images/wx.jpg);

	background-repeat: no-repeat;

	background-position: center center;

	border: 1px solid #e0e0e0

}

.side ul li.sideewm .waBox.son {

	width: 200px;

	display: none;

	color: #363636;

	text-align: center;

	padding-top: 200px;

	position: absolute;

	left: -200px;

	top: 0;

	background-image: url(../images/whats.jpg);

	background-repeat: no-repeat;

	background-position: center center;

	border: 1px solid #e0e0e0

}

.side ul li.sideetel .telBox.son {

	width: 240px;

	height: 237px;

	display: none;

	color: #fff;

	text-align: left;

	position: absolute;

	left: -240px;

	top: -79px;

	background: #d70012

}

.side ul li.sideetel .telBox dd {

	display: block;

	height: 118.5px;

	overflow: hidden;

	padding-left: 72px;

	line-height: 24px;

	font-size: 18px

}

.side ul li.sideetel .telBox dd span {

	display: block;

	line-height: 28px;

	height: 28px;

	overflow: hidden;

	margin-top: 22px;

	font-size: 18px

}

.side ul li.sideetel .telBox dd.bgs1 {

	background: url(../images/right_pic8.png) 20px center no-repeat;

	background-color: #e60013

}

.side ul li.sideetel .telBox dd.bgs2 {

	background: url(../images/right_pic9.png) 20px center no-repeat

}

.side ul li:hover .son {

	display: block!important;

	animation: fadein 1s

}

@keyframes fadein {

from {

opacity:0

}

to {

opacity:1

}

}