body {
	margin: 0;
	padding: 0;
}

.diyi {
	height: 100vh;
	background: orange url(../img/head_bg_img_1.jpg);
	background-size: cover;
	position: relative;
	overflow: hidden;
}

#yuan {
	position: relative;
	width: 50%;
	left: 25%;
	height: 100vh;
	overflow: hidden;
	z-index: 99999;
	transform: scale(0.8);
}

#yuan img {
	position: absolute;
	top: 0;
	left: 0;
}

#yuan img:first-child {
	width: 100%;
	animation: zhuan 3s infinite;
}

#yuan img:nth-child {
	width: 100%;
	animation: zhuan 3s infinite;
}

#yuan img:nth-child(2) {
	width: 80%;
	left: 10%;
	top: 10%;
	animation: zhuan 5s infinite;
}

#yuan img:nth-child(3) {
	width: 50%;
	left: 25%;
	top: 25%;
}

#yuan video {
	position: absolute;
	z-index: 999;
	width: 40%;
	left: 30%;
	top: 35%;
}

@keyframes zhuan {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

#shan {
	height: 100vh;
}

#shan img {
	position: absolute;
}

#shan img:first-child {
	top: 0;
	left: 0;
}

#shan img:nth-child(2) {
	bottom: 0;
}

#shan img:nth-child(3) {
	bottom: 0;
	left: 0;
	z-index: 999;
}

#shan img:nth-child(4) {
	bottom: 0;
	left: 0;
	
}
#shan img:last-child{
	top: 100px;
	left: 100px;
	animation: yidong 2s infinite;
}
@keyframes yidong {
	from {
		left: 0;
	}
	to {
		left: 100px;
	}
}
#niao{
	position: absolute;
	top: 0;
	left: 20px;
	width: 140px;
	height: 96px;
	background: url(../img/bird_img_1.png) no-repeat;
	animation: fei 0.5s infinite steps(8);
}
@keyframes fei{
	from{background-position: 0px -768px;}
	to{background-position: 0px 0px;}
}

.dier {
	height: 100vh;
	background: green url(../img/head_bg_img_2.jpg);
	background-size: cover;
}
.huazhou{
	height: 576px;
	width: 60%;
	overflow: hidden;
	margin: 0 auto;
	background: url(../img/jz_img_3.png) repeat-x 0 20px;
	position: zhankai 3s linear,fadein is ease-in forwards;
	 
}
@keyframes zhankai{
	from{width: 0px;}
	to{width: 60%;}
}
@keyframes fadein{
	from{opacity: 0;}
	to{opacity: 1;}
}
.zuozhou{
	width: 36px;
	height: 576px;
	background: url(../img/jz_img_1.png) no-repeat;
	position: absolute;
	left: -8px;
	top: 0; 
}
.youzhou{
	width: 36px;
	height: 576px;
	background: url(../img/jz_img_2.png) no-repeat;
	position: absolute;
	left: -8px;
	top: 0; 
}
.bjzhou video{
	margin-top:50px ;
}

.disan{
	height: 100vh;
	background:  cadetblue url(../img/head_bg_img_3.jpg);
	background-size: cover;
	position: relative;
	overflow: hidden;
}
#quan{
	width: 60%;
	height: 80vh;
	background: url(../img/yuan_img_7.png) no-repeat;
	background-size: cover;
	position: absolute;
	right: 10%;
	top: 400px;
}
.yuan_video{
	width: 1000px;
	height: 1000px;
	border-radius: 100%;
	overflow: hidden;
	background: purple;
	position: absolute;
	bottom: -500px;
	right: 14%;
	animation: fadein 1s ease-out forwards;
	animation-delay: 3s;
}

.disi{
	height: 100vh;
	background: skyblue url(../img/head_bg_img_4.jpg);
	background-size: cover;
	position: relative;
	overflow: hidden;
}
.xingshi{
	width: 1057px;
	height: 373px;
	background: url(../img/button_public2.png) no-repeat;
	margin: 250px auto;
}
.xingshi p{
	width: 151px;
	height: 373px;
	float: left;
}
.xingshi p:hover{
	background: url(../img/button_public2.png) no-repeat;
	animation: tantiao 1s linear;
}
.xingshi p:first-child:hover{
	background-position: 0px -373px;
}
.xingshi p:nth-child(2):hover{
	background-position: -151px -373px;
}
.xingshi p:nth-child(3):hover{
	background-position: -302px -373px;
}.xingshi p:nth-child(4):hover{
	background-position: -453px -373px;
}.xingshi p:nth-child(5):hover{
	background-position: -604px -373px;
}.xingshi p:nth-child(6):hover{
	background-position: -755px -373px;
}.xingshi p:nth-child(7):hover{
	background-position: -907px -373px;
}

@keyframes tantiao{
	0%{ transform: translateY(0px);}
	50%{transform: translateY(-15px);}
	100%{transform: translateY(0px);}
}

.diwu{
	height: 100vh;
	background: skyblue url(../img/head_bg_img_5.jpg);
	background-size: cover;
	position: relative;
	overflow: hidden;
}
.saoma{
	width: 120px;
	height: 120px;
	float: left;
	margin: 50px;
	margin-top: 60px;
}
.guang{
	height: 5px;
	background: linear-gradient(90deg,rgba(255,255,0,0),rgba(255,255,0,1),rgba(255,255,0,0));
	position: relative;
	top: 20px;
	animation: sm 1s infinite;
}
@keyframes sm{
	from{ top: 20px;}
	to{ top: 130px;}
}
.jianbianzi{
	text-align: center;
	font-size: 70px;
	margin-top: 90px;
	background: linear-gradient(#46736c,#d6ede2);
	color: transparent;
	background-clip: text;
}
