/* 自定义字体 */
@font-face{
	font-family: syr;
    src: url("NotoSansHans-Regular.otf");
}
@font-face{
	font-family: syb;
    src: url("NotoSansHans-Bold.otf");
}
@font-face{
	font-family: dinr;
    src: url("swiss.ttf");
}
@font-face{
	font-family: dinb;
    src: url("swissb.ttf");
}
*{
    padding: 0px;
    margin: 0px;
    list-style: none;
    text-decoration: none;
	font-family: syr;
}


/* 引导页 */
.yindao{
	width: 100vw;
	height: 100vh;
	background-color: #080F40;
	position: fixed;
	z-index: 99999;
	overflow: hidden;
	animation: yindaoD 3s ease-in-out;
	opacity: 0;
}
.yindao .yd-logo{
	font-size: 100px;
	color: #BBD4EF;
	position: absolute;
	left: 50%;
	bottom: 45%;
	transform: translate(-50%, -50%);
	text-align: center;
	z-index: 99;
	opacity: 0.2;
	animation: logoD 3s ease-in-out;
}
.yindao .door{
	width: 100%;
	height: 100%;
	position: absolute;
	display: flex;
	justify-content: space-between;
}
.yindao .door span{
	display: block;
	width: 50%;
	height: 100%;
	background-color: #272B60;
	left: 0;
	top: 0;
	animation: doorD 3s ease-in-out;
}
.yindao .door span:last-child{
	display: block;
	width: 50%;
	height: 100%;
	background-color: #272B60;
	right: 0;
	top: 0;
	animation: doorD 3s ease-in-out;
}
.yindao .line{
	background-color: #272B60;
	height: 2px;
	bottom: 45%;
	position: absolute;
	left: 50%;
	transform: translate(-50%);
	animation: lineD 3s ease-in-out;
}
.yindao .line .line-gaoliang{
	position: absolute;
	height: 100%;
	background-color: #BBD4EF;
	left: 50%;
	transform: translate(-50%);
	animation: lineTwoD 3s ease-in-out;
}

@keyframes doorD{
	0%   {
		width: 50%;
	}
	30%  {
		width: 0%;
	}
	100% {
		width: 0%;
	}
}
@keyframes lineD{
	0%   {
		width: 0%;
	}
	5%  {
		width: 0%;
	}
	30%  {
		width: 400px;
	}
	75%  {
		width: 400px;
		opacity: 1;
	}
	100% {
		width: 50px;
		opacity: 0;
	}
}
@keyframes lineTwoD{
	0%   {
		width: 0%;
	}
	30%  {
		width: 0%;
	}
	40%  {
		width: 100%;
	}
	75%  {
		width: 100%;
	}
	100% {
		width: 50px;
	}
}
@keyframes logoD{
	0%   {
		opacity: 0;
	}
	10%  {
		opacity: 0;
	}
	40%  {
		opacity: 1;
	}
	75%  {
		font-size: 100px;
		opacity: 1;
	}
	100% {
		font-size: 80px;
		opacity: 0;
	}
}
@keyframes yindaoD{
	0%{
		opacity: 1;
	}
	95%{
		opacity: 1;
		display: block;
	}
	100%{
		opacity: 0;
	}
}
