@charset "utf-8";

/* CSS Document */
.sr_nav {
	width: 100%;
	position: absolute;
	z-index: 2;
	left: 0;
	right: 0;
	bottom: 150px;
	min-width: 1320px;
}

.sr_nav_box {
	width: 1320px;
	margin: 0 auto;
}

.sr_nav_ul {
	padding-left: 90px;
	width: 1320px;
	box-sizing: border-box;
}

.sr_nav_li {
	float: left;
	width: 140px;
}

.sr_nav_link {
	display: inline-block;
	color: #2c2c2c;
	font-size: 22px;
	letter-spacing: 14px;
	font-family: "PINGFANG LIGHT";
	padding-left: 13px;
	height: 24px;
	line-height: 24px;
	border-left: 1px solid rgba(44, 44, 44, 1.00);
	position: relative;
	z-index: 2;
}

.sr_nav_li.type_white .sr_nav_link {
	color: #fff;
	border-left: 1px solid rgba(255, 255, 255, 1.00);
}

.sr_nav_link:hover {
	border-left: 1px solid rgba(44, 44, 44, 0) !important;
}

.sr_nav_link:hover .sr_navHover {
	display: block;
}

.sr_navHover {
	height: 66px;
	position: absolute;
	left: 0;
	top: -31px;
	background-position: 0 0px;
	background-repeat: no-repeat;
	animation: nav_anime steps(1, end) 1s infinite;
	-ms-animation: nav_anime steps(1, end) 1s infinite;
	-webkit-animation: nav_anime steps(1, end) 1s infinite;
	-moz-animation: nav_anime steps(1, end) 1s infinite;
	-o-animation: nav_anime steps(1, end) 1s infinite;
	display: none;

}

.sr_navHover.type_one_black {
	background-image: url(../images/BlackNavHover.png);
	width: 186px;
}

.sr_navHover.type_two_black {
	background-image: url(../images/BlackNavHover2.png);
	width: 197px;
}

.sr_nav_li.type_white .sr_navHover.type_one_black {
	background-image: url(../images/WhiteNavHover.png);
	width: 186px;
}

.sr_nav_li.type_white .sr_navHover.type_two_black {
	background-image: url(../images/WhiteNavHover2.png);
	width: 197px;
}

@keyframes nav_anime {
	0% {
		background-position: 0 0;
	}

	5% {
		background-position: 0 -66px;
	}

	10% {
		background-position: 0 -132px;
	}

	15% {
		background-position: 0 -198px;
	}

	20% {
		background-position: 0 -264px;
	}

	25% {
		background-position: 0 -330px;
	}

	30% {
		background-position: 0 -396px;
	}

	35% {
		background-position: 0 -462px;
	}

	40% {
		background-position: 0 -528px;
	}

	45% {
		background-position: 0 -594px;
	}

	50% {
		background-position: 0 -660px;
	}

	55% {
		background-position: 0 -726px;
	}

	60% {
		background-position: 0 -792px;
	}

	65% {
		background-position: 0 -858px;
	}

	70% {
		background-position: 0 -924px;
	}

	75% {
		background-position: 0 -990px;
	}

	80% {
		background-position: 0 -1056px;
	}

	85% {
		background-position: 0 -1122px;
	}

	90% {
		background-position: 0 -1188px;
	}

	95% {
		background-position: 0 -1254px;
	}

	100% {
		background-position: 0 -1320px;
	}
}

@-webkit-keyframes nav_anime {
	0% {
		background-position: 0 0;
	}

	5% {
		background-position: 0 -66px;
	}

	10% {
		background-position: 0 -132px;
	}

	15% {
		background-position: 0 -198px;
	}

	20% {
		background-position: 0 -264px;
	}

	25% {
		background-position: 0 -330px;
	}

	30% {
		background-position: 0 -396px;
	}

	35% {
		background-position: 0 -462px;
	}

	40% {
		background-position: 0 -528px;
	}

	45% {
		background-position: 0 -594px;
	}

	50% {
		background-position: 0 -660px;
	}

	55% {
		background-position: 0 -726px;
	}

	60% {
		background-position: 0 -792px;
	}

	65% {
		background-position: 0 -858px;
	}

	70% {
		background-position: 0 -924px;
	}

	75% {
		background-position: 0 -990px;
	}

	80% {
		background-position: 0 -1056px;
	}

	85% {
		background-position: 0 -1122px;
	}

	90% {
		background-position: 0 -1188px;
	}

	95% {
		background-position: 0 -1254px;
	}

	100% {
		background-position: 0 -1320px;
	}
}

@-moz-keyframes nav_anime {
	0% {
		background-position: 0 0;
	}

	5% {
		background-position: 0 -66px;
	}

	10% {
		background-position: 0 -132px;
	}

	15% {
		background-position: 0 -198px;
	}

	20% {
		background-position: 0 -264px;
	}

	25% {
		background-position: 0 -330px;
	}

	30% {
		background-position: 0 -396px;
	}

	35% {
		background-position: 0 -462px;
	}

	40% {
		background-position: 0 -528px;
	}

	45% {
		background-position: 0 -594px;
	}

	50% {
		background-position: 0 -660px;
	}

	55% {
		background-position: 0 -726px;
	}

	60% {
		background-position: 0 -792px;
	}

	65% {
		background-position: 0 -858px;
	}

	70% {
		background-position: 0 -924px;
	}

	75% {
		background-position: 0 -990px;
	}

	80% {
		background-position: 0 -1056px;
	}

	85% {
		background-position: 0 -1122px;
	}

	90% {
		background-position: 0 -1188px;
	}

	95% {
		background-position: 0 -1254px;
	}

	100% {
		background-position: 0 -1320px;
	}
}

@-o-keyframes nav_anime {
	0% {
		background-position: 0 0;
	}

	5% {
		background-position: 0 -66px;
	}

	10% {
		background-position: 0 -132px;
	}

	15% {
		background-position: 0 -198px;
	}

	20% {
		background-position: 0 -264px;
	}

	25% {
		background-position: 0 -330px;
	}

	30% {
		background-position: 0 -396px;
	}

	35% {
		background-position: 0 -462px;
	}

	40% {
		background-position: 0 -528px;
	}

	45% {
		background-position: 0 -594px;
	}

	50% {
		background-position: 0 -660px;
	}

	55% {
		background-position: 0 -726px;
	}

	60% {
		background-position: 0 -792px;
	}

	65% {
		background-position: 0 -858px;
	}

	70% {
		background-position: 0 -924px;
	}

	75% {
		background-position: 0 -990px;
	}

	80% {
		background-position: 0 -1056px;
	}

	85% {
		background-position: 0 -1122px;
	}

	90% {
		background-position: 0 -1188px;
	}

	95% {
		background-position: 0 -1254px;
	}

	100% {
		background-position: 0 -1320px;
	}
}

@-ms-keyframes nav_anime {
	0% {
		background-position: 0 0;
	}

	5% {
		background-position: 0 -66px;
	}

	10% {
		background-position: 0 -132px;
	}

	15% {
		background-position: 0 -198px;
	}

	20% {
		background-position: 0 -264px;
	}

	25% {
		background-position: 0 -330px;
	}

	30% {
		background-position: 0 -396px;
	}

	35% {
		background-position: 0 -462px;
	}

	40% {
		background-position: 0 -528px;
	}

	45% {
		background-position: 0 -594px;
	}

	50% {
		background-position: 0 -660px;
	}

	55% {
		background-position: 0 -726px;
	}

	60% {
		background-position: 0 -792px;
	}

	65% {
		background-position: 0 -858px;
	}

	70% {
		background-position: 0 -924px;
	}

	75% {
		background-position: 0 -990px;
	}

	80% {
		background-position: 0 -1056px;
	}

	85% {
		background-position: 0 -1122px;
	}

	90% {
		background-position: 0 -1188px;
	}

	95% {
		background-position: 0 -1254px;
	}

	100% {
		background-position: 0 -1320px;
	}
}

.sr_nav_subtitle {
	position: absolute;
	z-index: 2;
	left: 35px;
	width: 300px;
	color: #2c2c2c;
	font-size: 16px;
	letter-spacing: normal;
	top: -55px;
	line-height: 18px;
	text-align: left;
	font-family: "fangzhengheiti";
	display: none;
}

.sr_nav_subtitle.type_white {
	color: #fff;
}

.sr_nav_li.type_white .sr_nav_subtitle {
	color: #fff;
}

.sr_nav_link:hover .sr_nav_subtitle {
	display: block;
}

/*右上角导航*/
.sr_rt_nav {
	position: absolute;
	z-index: 2;
	right: 16px;
	top: 16px;
	display: none;
}

.sr_rt_quan_body {
	width: 159px;
	height: 139px;
	overflow: hidden;
	position: relative;
	z-index: 2;
	float: right;
}

.sr_rt_quan {
	width: 159px;
	height: 139px;
	position: absolute;
	left: 0;
	right: 0;
	z-index: 2;
	background-image: url(../images/p2_quan_b.png);
	background-position: 18px 16px;
	background-repeat: no-repeat;
	background-size: 130px;
	animation: quan 4s infinite;
	-webkit-animation: quan 4s infinite;
	-moz-animation: quan 4s infinite;
	-o-animation: quan 4s infinite;
	-ms-animation: quan 4s infinite;
}

.sr_rt_nav.type_white .sr_rt_quan {
	background-image: url(../images/p2_quan.png);
}

.sr_rt_quan_text_body {
	width: 159px;
	height: 139px;
	position: absolute;
	left: 0;
	right: 0;
	z-index: 1;
}

.sr_rt_quan_text {
	width: 159px;
	height: 139px;
	background-position: 18px 16px;
	background-repeat: no-repeat;
	background-size: 130px;
	display: none;
}

.sr_rt_quan_text.type_dao {
	background-image: url(../images/p2_dao.png);
}

.sr_rt_quan_text.type_shu {
	background-image: url(../images/shu.png);
}

.sr_rt_quan_text.type_ji {
	background-image: url(../images/ji.png);
}

.sr_rt_quan_text.type_shou {
	background-image: url(../images/shou.png);
}

.sr_rt_quan_text.type_shanren {
	background-image: url(../images/shanren.png);
}

.sr_rt_quan_text.type_miaoji {
	background-image: url(../images/miaoji.png);
}

.sr_rt_quan_text.type_zhaoxian {
	background-image: url(../images/zhaoxian.png);
}

@keyframes quan {
	0% {
		transform: rotate(0);
		animation-timing-function: linear;
	}

	100% {
		transform: rotate(360deg);
	}
}

@-webkit-keyframes quan {
	0% {
		-webkit-transform: rotate(0);
		-webkit-animation-timing-function: linear;
	}

	100% {
		-webkit-transform: rotate(360deg);
	}
}

@-moz-keyframes quan {
	0% {
		-moz-transform: rotate(0);
		-moz-animation-timing-function: linear;
	}

	100% {
		-moz-transform: rotate(360deg);
	}
}

@-o-keyframes quan {
	0% {
		-o-transform: rotate(0);
		-o-animation-timing-function: linear;
	}

	100% {
		-o-transform: rotate(360deg);
	}
}

@-ms-keyframes quan {
	0% {
		-ms-transform: rotate(0);
		-ms-animation-timing-function: linear;
	}

	100% {
		-ms-transform: rotate(360deg);
	}
}

.sr_rt_quan_point_body {
	position: relative;
	z-index: 3;
	float: left;
	margin-top: 54px;
	overflow: hidden;
	width: 128px;
	margin-right: -3px;
}

.sr_rt_quan_point_ul {
	width: 338px;
	float: right;
}

.sr_rt_quan_point_li {
	background-position: center center;
	background-size: 15px;
	background-repeat: no-repeat;
	width: 32px;
	height: 18px;
	float: right;
	cursor: pointer;
	text-align: center;
}

.sr_rt_quan_point_li span {
	line-height: 18px;
	color: #2c2c2c;
	line-height: 16px;
	display: none;
}

.sr_rt_nav.type_white .sr_rt_quan_point_li span {
	color: #fff;
}

.sr_rt_quan_point_li:hover span {
	display: inline;
}

.sr_rt_quan_point_li:hover {
	background-image: none !important;
}

.sr_rt_quan_point_li.type_1 {
	background-image: url(../images/point1.png);
}

.sr_rt_quan_point_li.type_2 {
	background-image: url(../images/point2.png);
}

.sr_rt_quan_point_li.type_3 {
	background-image: url(../images/point3.png);
}

.sr_rt_quan_point_li.type_4 {
	background-image: url(../images/point4.png);
}

.sr_rt_nav.type_white .sr_rt_quan_point_li.type_1 {
	background-image: url(../images/point5.png);
}

.sr_rt_nav.type_white .sr_rt_quan_point_li.type_2 {
	background-image: url(../images/point6.png);
}

.sr_rt_nav.type_white .sr_rt_quan_point_li.type_3 {
	background-image: url(../images/point7.png);
}

.sr_rt_nav.type_white .sr_rt_quan_point_li.type_4 {
	background-image: url(../images/point8.png);
}