body,
html {
	margin: 0;
	padding: 0;
}

.appBg {
	color: #E5E5E5;
	background: #090A0C;
	min-height: 100vh;
}

.logo {
	width: 28px;
	margin: 23px 20px;
}

.bg3 {
	width: 1160px;
	margin: auto;
	display: block;
}

.homeBannerWrap {
	max-width: 1440px;
	margin: 0 auto;
	min-width: 1280px;
	width: 100%;
	height: 486px;
	position: relative;
}

.homeBannerLeft {
	position: relative;
	z-index: 10;
	top: 86px;
	padding-left: 80px;
}

.homeBannerRight {
	position: absolute;
	width: 1019px;
	height: 425px;
	top: 30px;
	right: 0;
	background: url('https://img.jgzpro.com/activeXP/banner/bg.png') no-repeat;
	background-size: 100% 100%;
}

.fps {
	position: absolute;
	z-index: 3;
	width: 100%;
	height: 100%;
	background-size: 100% 100% !important;
	animation: fpsAmin 2s linear 0s infinite;
}

.bg {
	position: absolute;
	z-index: 4;
	width: 300px;
	height: 100%;
	background-image: linear-gradient(to right, rgba(9, 10, 12, 1), rgba(9, 10, 12, 0));
}


@keyframes fpsAmin {
	0% {
		background: url('https://img.jgzpro.com/activeXP/banner/1.png');
	}

	2.127% {
		background: url('https://img.jgzpro.com/activeXP/banner/2.png');
	}

	4.254% {
		background: url('https://img.jgzpro.com/activeXP/banner/3.png');
	}

	6.381% {
		background: url('https://img.jgzpro.com/activeXP/banner/4.png');
	}

	8.5% {
		background: url('https://img.jgzpro.com/activeXP/banner/5.png');
	}

	10.63% {
		background: url('https://img.jgzpro.com/activeXP/banner/6.png');
	}

	12.76% {
		background: url('https://img.jgzpro.com/activeXP/banner/7.png');
	}

	14.88% {
		background: url('https://img.jgzpro.com/activeXP/banner/8.png');
	}

	17.01% {
		background: url('https://img.jgzpro.com/activeXP/banner/9.png');
	}

	19.143% {
		background: url('https://img.jgzpro.com/activeXP/banner/10.png');
	}

	21.27% {
		background: url('https://img.jgzpro.com/activeXP/banner/11.png');
	}

	23.39% {
		background: url('https://img.jgzpro.com/activeXP/banner/12.png');
	}

	25.52% {
		background: url('https://img.jgzpro.com/activeXP/banner/13.png');
	}

	27.65% {
		background: url('https://img.jgzpro.com/activeXP/banner/14.png');
	}

	29.77% {
		background: url('https://img.jgzpro.com/activeXP/banner/15.png');
	}

	31.9% {
		background: url('https://img.jgzpro.com/activeXP/banner/16.png');
	}

	34.03% {
		background: url('https://img.jgzpro.com/activeXP/banner/17.png');
	}

	36.15% {
		background: url('https://img.jgzpro.com/activeXP/banner/18.png');
	}

	38.28% {
		background: url('https://img.jgzpro.com/activeXP/banner/19.png');
	}

	40.41% {
		background: url('https://img.jgzpro.com/activeXP/banner/20.png');
	}

	42.54% {
		background: url('https://img.jgzpro.com/activeXP/banner/21.png');
	}

	44.66% {
		background: url('https://img.jgzpro.com/activeXP/banner/22.png');
	}

	46.79% {
		background: url('https://img.jgzpro.com/activeXP/banner/23.png');
	}

	48.92% {
		background: url('https://img.jgzpro.com/activeXP/banner/24.png');
	}

	51.04% {
		background: url('https://img.jgzpro.com/activeXP/banner/25.png');
	}

	53.17% {
		background: url('https://img.jgzpro.com/activeXP/banner/26.png');
	}

	55.3% {
		background: url('https://img.jgzpro.com/activeXP/banner/27.png');
	}

	57.42% {
		background: url('https://img.jgzpro.com/activeXP/banner/28.png');
	}

	59.55% {
		background: url('https://img.jgzpro.com/activeXP/banner/29.png');
	}

	61.68% {
		background: url('https://img.jgzpro.com/activeXP/banner/30.png');
	}

	63.81% {
		background: url('https://img.jgzpro.com/activeXP/banner/31.png');
	}

	65.93% {
		background: url('https://img.jgzpro.com/activeXP/banner/32.png');
	}

	68.06% {
		background: url('https://img.jgzpro.com/activeXP/banner/33.png');
	}

	70.19% {
		background: url('https://img.jgzpro.com/activeXP/banner/34.png');
	}

	72.31% {
		background: url('https://img.jgzpro.com/activeXP/banner/35.png');
	}

	74.44% {
		background: url('https://img.jgzpro.com/activeXP/banner/36.png');
	}

	76.57% {
		background: url('https://img.jgzpro.com/activeXP/banner/37.png');
	}

	78.69% {
		background: url('https://img.jgzpro.com/activeXP/banner/38.png');
	}

	80.82% {
		background: url('https://img.jgzpro.com/activeXP/banner/39.png');
	}

	82.95% {
		background: url('https://img.jgzpro.com/activeXP/banner/40.png');
	}

	85.08% {
		background: url('https://img.jgzpro.com/activeXP/banner/41.png');
	}

	87.2% {
		background: url('https://img.jgzpro.com/activeXP/banner/42.png');
	}

	89.33% {
		background: url('https://img.jgzpro.com/activeXP/banner/43.png');
	}

	91.46% {
		background: url('https://img.jgzpro.com/activeXP/banner/44.png');
	}

	93.58% {
		background: url('https://img.jgzpro.com/activeXP/banner/45.png');
	}

	95.71% {
		background: url('https://img.jgzpro.com/activeXP/banner/46.png');
	}

	97.84% {
		background: url('https://img.jgzpro.com/activeXP/banner/47.png');
	}
}

.title {
	display: flex;
	font-size: 64px;
}

.title img {
	margin-left: 10px;
}

.btnWrap {
	display: flex;
	gap: 20px;
	margin-top: 50px;
}

.primaryBtn {
	width: 192px;
	height: 44px;
	background: var(--FC);
	color: var(--FC-white);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 4px;
	border-radius: 100px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.downloadWrap {
	position: relative;
}

.downloadWrap:hover .downloadQr {
	display: block;
}

.downloadBtn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border-width: 1px;
	border-style: solid;
	height: 44px;
	border-color: var(--FC);
	border-radius: 100px;
	width: 135px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.downloadBtn img {
	width: 15px;
	height: 15px;
}

.downloadQr {
	display: none;
	position: absolute;
	border-radius: 20px;
	padding: 12px;
	background: var(--PB);
	width: 134px;
	height: 134px;
	top: 54px;
	border: 1px solid var(--IBG-line);
}




@media (max-width:1000px) {
	.homeBannerWrap {
		max-width: 100%;
		min-width: 100%;
		height: auto;
	}

	.homeBannerLeft {
		top: 40px;
		padding-left: 0;

	}

	.homeBannerLeft .title {
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 32px;
		margin-bottom: 12px;
	}

	.homeBannerRight {
		position: relative;
		width: 100%;
		height: 41vw;
		margin-top: 80px;
		top: 0;
	}

	.homeBannerRight .bg {
		display: none;
	}

	.bg3 {
		width: calc(100% - 30px);
		margin: 80px 15px 0 15px;
	}
}