@charset "utf-8";



body {

	background: url(../images/@x1/index-PC-back.jpg) #f3f7fc no-repeat center;
	background-size: cover;

	font-size: 14px;
	color: #333333;

}


/* 2x */

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),only screen and (min--moz-device-pixel-ratio: 1.5),only screen and (-o-min-device-pixel-ratio: 3/2),only screen and (min-device-pixel-ratio: 1.5),only screen and (min-resolution: 192dpi) {
	body{
		background: url(../images/index-PC-back.jpg) #f3f7fc no-repeat center !important;
		background-size: cover !important;
	}
	.bodys .downback{
		background: url(../images/index-PC_06.png) no-repeat center !important;
		background-size: 100% auto !important;
	}
	.bodys .phones{
		background: url(../images/index-PC_03.png) no-repeat center !important;
		background-size: 100% auto !important;
	}
}


/* --------------index-start-------------- */

.tbody{
	width: 100%;
	min-height: 100vh;
	position: relative;
}

.bodys{
	width: 1200px;
	height: 572px;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.bodys .downback{
	width: 600px;
	height: 488px;
	background: url(../images/@x1/index-PC_06.png) no-repeat center;
	background-size: 100% auto;
	position: relative;
}
.bodys .downback .android-btn,.bodys .downback .ios-btn{
	display: block;
	width: 144px;
	height: 144px;
	position: absolute;
	cursor: pointer;
}
.bodys .downback .android-btn{
	left: 28px;
	top: 290px;
}
.bodys .downback .ios-btn{
	left: 215px;
	top: 290px;
}
.bodys .downback .ewmw{
	width: 98px;
	height: 98px;
	position: absolute;
	left: 426px;
	top: 307px;
}
.bodys .downback .ewmw img{
	width: 100%;
	height: 100%;
}
.bodys .phones{
	width: 572px;
	height: 572px;
	background: url(../images/@x1/index-PC_03.png) no-repeat center;
	background-size: 100% auto;
	position: relative;
}
.bodys .phones .yuan-1{
	width: 80px;
	height: 80px;
	/* background-color: #f54545; */
	border-radius: 50%;
	position: absolute;
	left: -80px;
	top: 110px;
	background: url(../images/q1.png) no-repeat center;
	background-size: 100% auto;
}
.bodys .phones .yuan-2{
	width: 60px;
	height: 60px;
	/* background-color: #4cd3ff; */
	border-radius: 50%;
	position: absolute;
	left: 170px;
	top: -60px;
	background: url(../images/q2.png) no-repeat center;
	background-size: 100% auto;
}
.bodys .phones .yuan-3{
	width: 40px;
	height: 40px;
	/* background-color: #fccf57; */
	border-radius: 50%;
	position: absolute;
	right: 90px;
	top: 10px;
	background: url(../images/q3.png) no-repeat center;
	background-size: 100% auto;
}
.anim-t {
	animation: indexcMenu-y-t 1.5s forwards;

	-webkit-animation: indexcMenu-y-t 1.5s forwards;

	/* Safari and Chrome */

}
.anim-ss-1 {
	opacity: 0;

	animation: index-cq-ss 1.5s infinite 0s alternate;

	-webkit-animation: index-cq-ss 1.5s infinite 0s alternate;

	/* Safari and Chrome */

}
.anim-ss-2 {
	opacity: 0;

	animation: index-cq-ss 1.5s infinite 0.8s alternate;

	-webkit-animation: index-cq-ss 1.5s infinite 0.8s alternate;

	/* Safari and Chrome */

}
.anim-ss-3 {
	opacity: 0;

	animation: index-cq-ss 1.5s infinite 1.6s alternate;

	-webkit-animation: index-cq-ss 1.5s infinite 1.6s alternate;

	/* Safari and Chrome */

}
@keyframes indexcMenu-y-t {

	0% {

		transform: translateY(50px);

		opacity: 0;

	}



	100% {

		transform: translateY(0px);

		opacity: 1;

	}

}
@keyframes index-cq-ss {

	0% {

		opacity: 0.35;
		transform: translateY(-14px);

	}

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

}