html {
	margin:0px;
	padding:0px;
	font-family:微软雅黑;
	overflow:hidden;
	width:100%;
	height:100%;
	background-color:black
}
#d1 {
	position:absolute;
	top:30%;
	left:40%;
	width:300px;
	height:300px;
	border:2px solid white;
	border-radius:50%;
	perspective:3000px;
	transform:rotateZ(-30deg);
}
#d1:after {
	position:absolute;
	top:0px;
	left:0px;
	content:"";
	display:block;
	width:1px;
	height:500px;
	background-color:yellow;
	transform:translateX(150px) translateY(-100px);
}
#d1 .d1_1 {
	height:100%;
	transform-style:preserve-3d;
	animation:loading 2s linear 0s infinite;
}
#d1 .d1_1 div:nth-child(1) {
	position:absolute;
	width:300px;
	height:300px;
	border-radius:50%;
	border:1px solid red;
	transform:rotateY(36deg);
}
#d1 .d1_1 div:nth-child(2) {
	position:absolute;
	width:300px;
	height:300px;
	border-radius:50%;
	border:1px solid green;
	transform:rotateY(72deg);
}
#d1 .d1_1 div:nth-child(3) {
	position:absolute;
	width:300px;
	height:300px;
	border-radius:50%;
	border:1px solid blue;
	transform:rotateY(108deg);
}
#d1 .d1_1 div:nth-child(4) {
	position:absolute;
	width:300px;
	height:300px;
	border-radius:50%;
	border:1px solid yellow;
	transform:rotateY(144deg);
}
#d1 .d1_1 div:nth-child(5) {
	position:absolute;
	width:300px;
	height:300px;
	border-radius:50%;
	border:1px solid #b2850d;
	transform:rotateY(180deg);
}
@keyframes loading {
	0% {
	transform:rotateY(180deg);
}
100% {
	transform:rotateY(360deg);
}
}