/* banner部分 */
body{
	width: 100%;
}
#banner {
	position: relative;
	width: 100%;
	height: 800px;
	background: url('../img/concerning_banner.jpg') no-repeat center;
}
#banner_p_box{
	position: relative;
	margin: 0 auto;
	width: 600px;
	height: 200px;
}
#banner_p {
	position: absolute;
	width: 900px;
	top: -820px;
	z-index: 100;
}

#banner_p1 {
	font-family: 黑体;
	font-size: 110px;
	color: aliceblue;
	position: absolute;
	left: 840px;
	top: 210px;
}

#banner_p2 {
	font-family: 黑体;
	font-size: 100px;
	color: #fff;
	position: absolute;
	left: 960px;
	top: 310px;
}

#banner_p3 {
	font-family: 黑体;
	font-size: 110px;
	color: #fff;
	position: absolute;
	left: 840px;
	top: 390px;
}

#banner_p4 {
	font-family: 黑体;
	font-size: 100px;
	color: #fff;
	position: absolute;
	left: 1030px;
	top: 390px;
}

#banner_div1 {
	width: 40px;
	height: 40px;
	background: #fff;
	border-radius: 100%;
	position: absolute;
	left: 1065px;
	top: 375px;
}

#banner_div2 {
	width: 40px;
	height: 40px;
	background: #fff;
	border-radius: 100%;
	position: absolute;
	left: 1110px;
	top: 475px;
}

#banner_div3 {
	width: 40px;
	height: 40px;
	background: #fff;
	border-radius: 100%;
	position: absolute;
	left: 930px;
	top: 310px;
}

#banner_div4 {
	display: inline-block;
	width: 40px;
	height: 40px;
	background: #fff;
	border-radius: 100%;
	position: absolute;
	left: 930px;
	top: 390px;
	animation: spin1 3s infinite linear;
	transform-origin: 50% 25px;
}

#banner_div5 {
	width: 220px;
	height: 220px;
	background: none;
	border: 3px #fff solid;
	border-radius: 100%;
	position: absolute;
	left: 930px;
	top: 290px;
	animation: xxx 3.5s ease 3s infinite;
}

#banner_div6 {
	width: 370px;
	height: 370px;
	background: none;
	border: 3px #fff solid;
	border-radius: 100%;
	position: absolute;
	left: 800px;
	top: 175px;
}

#banner_div6_1 {
	display: inline-block;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: #fff;
	animation: spin1 3s infinite linear;
	transform-origin: 50% 200px;
	position: absolute;
	left: 165px;
	top: -20px;
}

@keyframes spin1 {
	to {
		transform: rotate(1turn);
	}
}

@keyframes xxx {
	0% {
		opacity: 0;
		transform: scale(0.7)
	}

	50% {
		opacity: 1;
	}

	100% {
		opacity: 0;
		transform: scale(1.3);
	}
}

#banner_botn {
	position: relative;
	margin: 0 auto;
	width: 600px;
	left: -650px;
}

#banner_div7 {
	width: 100px;
	height: 100px;
	background: none;
	border: 3px #fff solid;
	border-radius: 100%;
	position: absolute;
	left: 920px;
	bottom: 90px;
	transition: 0.6s;
}

#banner_div8 {
	width: 120px;
	height: 120px;
	background: none;
	border: 3px #fff solid;
	border-radius: 100%;
	position: absolute;
	left: 910px;
	bottom: 80px;
	transition: 0.6s;
}

#banner_div9 {
	width: 15px;
	height: 15px;
	background: #fff;
	border: 3px #fff solid;
	border-radius: 100%;
	position: absolute;
	left: 962px;
	bottom: 150px;
	transition: 0.8s;
}

#banner_div10 {
	width: 40px;
	height: 65px;
	background: none;
	border: 3px #fff solid;
	border-radius: 20px;
	position: absolute;
	left: 950px;
	bottom: 110px;
	overflow: hidden;
}

#banner_div11 {
	width: 20px;
	height: 35px;
	background: none;
	position: absolute;
	left: 960px;
	bottom: 115px;
	overflow: hidden;
}

#banner_div11_1 {
	width: 5px;
	height: 20px;
	background: #fff;
	border-radius: 20px;
	margin-left: 7px;
	margin-top: 2px;
	transition: 0.7s;
}

#banner_botn:hover #banner_div7 {
	transform: scale(1.05);
}

#banner_botn:hover #banner_div8 {
	transform: scale(1.1);
}

#banner_botn:hover #banner_div9 {
	transform: translate(0, 15px)
}

#banner_botn:hover #banner_div11_1 {
	transform: translate(0, 20px)
}

/* 栏目部分 */
#content {
	width: 100%;
	height: 850px;
	position: relative;
	margin: auto;

}

#content_banner {
	position: relative;
	margin: auto;
	width: 1000px;
}

#concerning_content1 {
	position: absolute;
	left: -50px;
	top: 250px;
	z-index: 10;
	transition: 10s;
}

#concerning_content2 {
	position: absolute;
	left: -170px;
	top: 50px;
	z-index: 9;
	transition: 3s;
}

#concerning_content3 {
	position: absolute;
	left: -150px;
	top: 550px;
	z-index: 9;
	transition: 1s;
}
#concerning_content1:hover {
	transform: rotate(360deg) scale(1.2);
	
}
#concerning_content2:hover {
	transform: scale(1.2);
	
}
#concerning_content3:hover {
	transform: rotate(180deg);
}

#H1 {
	position: absolute;
	left: 400px;
	top: 15 0px;
	font-size: 54px;
	z-index: 11;
	transition: 1s;
}

#H1:hover {
	transform: rotate(360deg);
}

#H1_1 {
	position: absolute;
	width: 45px;
	height: 45px;
	border-radius: 50%;
	border: 2px #ccc solid;
	left: 33px;
	top: 17px;
	z-index: -7;
}

#O1 {
	width: 150px;
	height: 150px;
	border: 2px solid #ccc;
	border-radius: 50%;
	position: absolute;
	left: 190px;
	top: 160px;
	z-index: 5;
	animation: xxx 3s ease 3s infinite;
}

#O2 {
	width: 110px;
	height: 110px;
	border: 2px dashed #ccc;
	border-radius: 50%;
	position: absolute;
	left: 210px;
	top: 180px;
	z-index: 5;
	animation: OO 3.5s ease 3s infinite;
}

@keyframes OO {
	0% {
		transform: rotate(0);
	}

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

#O3 {
	width: 200px;
	height: 200px;
	border: 2px dashed #ccc;
	border-radius: 50%;
	position: absolute;
	left: 250px;
	top: 230px;
	z-index: -100;
	animation: OO 6.5s ease 4s infinite;
}

#Z1 {
	position: absolute;
	left: 430px;
	top: 310px;
	font-size: 50px;
	z-index: -11;
	transition: 1s;
	animation: ZZ 3.5s ease 3s infinite;
}

@keyframes ZZ {
	0% {
		transform: rotate(0);
	}

	100% {
		transform: rotateY(360deg);
		transform: rotateX(360deg);
	}
}

#O4 {
	width: 250px;
	height: 250px;
	border: 2px dashed #ccc;
	border-radius: 50%;
	position: absolute;
	left: -150px;
	top: 330px;
	z-index: -100;
	animation: OO 6.5s ease 4s infinite;
}

#O5 {
	width: 150px;
	height: 150px;
	border: 3px solid #ccc;
	border-radius: 50%;
	position: absolute;
	left: -130px;
	top: 390px;
	z-index: -100;
	animation: xO 3s ease 3s infinite;
}

@keyframes xO {
	0% {
		opacity: 0;
		transform: scale(0.7)
	}

	50% {
		opacity: 1;
	}

	100% {
		opacity: 0;
		transform: scale(1);
	}
}

#Z2 {
	position: absolute;
	left: -180px;
	top: 580px;
	font-size: 50px;
	z-index: 11;
	animation: Z1Z 2.5s ease 1s infinite;
}

@keyframes Z1Z {
	0% {
		transform: rotate(0);
	}

	100% {
		transform: rotateY(360deg);

	}
}

#N1 {
	position: absolute;
	left: -50px;
	top: 680px;
	font-size: 42px;
	z-index: 11;
	animation: NN 2.5s ease 1s infinite;
}

@keyframes NN {
	0% {
		transform: rotate(0);
	}

	100% {
		transform: rotateZ(360deg);

	}
}
/* 字 */
#aboutus{
	width: 375px;
	height: 160px;
	position: absolute;
	left: 600px;
	top: 150px;
	border-radius: 100px 0 100px 0 ;
	transition: background-color .5s; 
	z-index: 20;
	background: linear-gradient(to right,#89c997,#70ca67,#ffeb3b,#32b16c,#89c997);
	background-size: 400%;
}
p{
	cursor:default;
}
#aboutus p{
	cursor:default;
	font-size: 72px;
	font-family: 黑体;
	left: 40px;
	top: 40px;
	color: #fff;
	position: absolute;
}
#aboutus:hover{
	animation: streamer 18s infinite; 
}
@keyframes streamer{
		    100%{
		        background-position: -400% 0;
		    }
		}
@keyframes op {
	20%{transform: translateY(-22px);}
	100%{transform: translateY(0px);}
			}			
#aboutus:hover span{
	display: inline-block;
	animation: op 1.5s linear infinite;
			}		
#aboutus:hover span:nth-child(2){
	animation-delay: 100ms;
			}
#aboutus span:nth-child(3){
	animation-delay: 200ms;
			}
#aboutus:hover span:nth-child(4){
	animation-delay: 300ms;
			}
#aboutus:hover span:nth-child(5){
	animation-delay: 400ms;
			}
#aboutus2{
	width: 400px;
	height: 400px;
	color: #70ca67;
	font-size: 72px;
	font-family: 黑体;
	position: absolute;
	left: 700px;
	top: 450px;
	z-index: 20;
}
#aboutus2 p:nth-child(1){
	position: absolute;
	left: -50px;
}
#aboutus2_pp2{
	position: absolute;
	left: 50px;
	top: 100px;
}
#aboutus2:hover span{
	display: inline-block;
	animation: op 1.5s linear infinite;
			}
#aboutus2:hover span:nth-child(2){
	animation-delay: 100ms;
			}
#aboutus2 p:nth-child(2):hover span:nth-child(1){
	animation-delay: 200ms;
			}
#aboutus2 p:nth-child(2):hover span:nth-child(2){
	animation-delay: 300ms;
			}
#aboutus2 p:nth-child(2):hover span:nth-child(3){
	animation-delay: 400ms;
			}	
#aboutus2 p:nth-child(2):hover span:nth-child(4){
	animation-delay: 500ms;
			}
#aboutus_img1{
	position: absolute;
	left: 850px;
	top: 400px;
	z-index: -100;
	transition:1s; 
}
#aboutus_img2{
	position: absolute;
	left: 900px;
	top: 450px;
	z-index: -100;
}
/* #aboutus_img3{
	position: absolute;
	left: 560px;
	top: 550px;
	z-index: -100;
}
#aboutus_img4{
	position: absolute;
	left: 600px;
	top: 520px;
	z-index: -100;
	transform:rotate(180deg);
} */

/* 栏目2 */
#content2 {
	width: 100%;
	height: 605px;
	position: relative;
	margin: auto;
	background: #32b16c;
	margin-bottom: 20px;
	overflow: hidden;
}
#content2_div{
	width: 1200px;
	margin: auto;
	position: relative;
}
#content2_p1{
	position: absolute;
	color: #fff;
	left: 440px;
	top: 20px;
	font-size: 72px;
	font-family: 黑体;
}
#concerning_con_banner{
	width: 625px;
	height: 450px;
	overflow: hidden;
	position: absolute;
	top: 120px;
	transition:1s
}
#concerning_con_banner:hover{
	border-radius: 150px ;
}
#content2_p2{
	width: 450px;
	position: absolute;
	color: #fff;
	font-size: 32px;
	font-family: 黑体;
	left: 700px;
	top: 150px;
}#content2_p3{
	width: 450px;
	position: absolute;
	color: #fff;
	font-size: 20px;
	font-family: 黑体;
	left: 700px;
	top: 280px;
}
#content2_p4{
	width: 450px;
	position: absolute;
	color: #fff;
	font-size: 30px;
	left: 700px;
	top: 320px;
}
#content2_div p:hover{
	color: #ddd;
}
#content2_p1:hover{
	color: #ddd;
}
#content2_d1{
	position: absolute;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	background: #fff;
	right: 100px;
	top: -50px;
}
#content2_d2{
	position: absolute;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	background: #fff;
	right: 300px;
	top: 550px;
}
#content2_d3{
	position: absolute;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	background: #fff;
	right: 1000px;
	top: -60px;
}
#content2_d4{
	position: absolute;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	background: #fff;
	right: 1000px;
	top: 580px;
}