* {
	margin: 0;
	padding: 0;
}

html,
body {
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	/* 防止水平滚动条 */
}

.container {
	position: relative;
	width: 100%;
	height: 100%;
}

.head-wapper {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 80px;
	background: #15151F;
	z-index: 1;
	display: flex;
	justify-content: center;
	align-items: center;
}

.head-section {
	width: 1200px;
	height: 80px;
	display: flex;
	align-items: center;
}

.head-title {
	font-size: 18px;
	color: #FFFFFFB7;
	cursor: pointer;
}

.mgL100 {
	margin-left: 100px;
}

.headColor {
	color: #25BFD3;
}


.head-login {
	margin-left: auto;
	font-size: 18px;
	color: #FFFFFFB7;
	cursor: pointer;
}

.content-wapper {
	position: absolute;
	top: 80px;
	left: 0;
	width: 100%;
	height: 2995px;
	background-image: url('../img/homeBg.png');
	background-size: 100% 100%;
	object-fit: cover;
}

.pay-content-wapper {
	position: absolute;
	top: 80px;
	left: 0;
	width: 100%;
	height: 1314px;
	background-image: url('../img/payBg.png');
	background-size: 100% 100%;
	object-fit: cover;
}

.address-wapper {
	position: absolute;
	top: 3075px;
	left: 0;
	width: 100%;
	height: 196px;
	background: #141625;
}

.pay-address-wapper {
	position: absolute;
	top: 1314px;
	left: 0;
	width: 100%;
	height: 196px;
	background: #141625;
}

.info-section {
	width: 100%;
	padding-top: 163px;
}

.info-name {
	width: 216px;
	height: 105px;
	margin: auto;
	font-size: 72px;
	color: #25BFD3;
}

.info-des {
	padding-top: 5px;
	width: 500px;
	height: 50px;
	font-size: 36px;
	font-weight: 400;
	color: #fff;
	margin: auto;
	text-align: center;
}

.info-note {
	padding-top: 20px;
	width: 828px;
	height: 76px;
	font-size: 20px;
	color: #697995;
	text-align: center;
	margin: auto;
}

.info-download {
	padding-top: 23px;
	width: 1200px;
	height: 90px;
	margin: auto;
	display: flex;
	justify-content: center;
	align-items: center;

}

.download-img {
	width: 292px;
	height: 86px;
}

.info-select {
	padding-top: 48px;
	width: 1200px;
	height: 321px;
	margin: auto;

	img {
		width: 100%;
		height: 100%;
	}
}

.info-gx-title {
	padding-top: 62px;
	width: 216px;
	height: 32px;
	font-size: 36px;
	color: #25BFD3;
	margin: auto;
}

.caclu-wapper {
	padding-top: 50px;
	width: 1200px;
	height: 664px;
	margin: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 25px;
	flex-wrap: wrap;
}

.caclu-item {
	width: 281px;
	height: 317px;
	cursor: pointer;

	img {
		width: 100%;
		height: 1005;
	}
}

.about-wapper {
	margin-top: 206px;
	width: 100%;
}

.about-title {
	width: 180px;
	height: 32px;
	font-size: 36px;
	color: #00BAAD;
	margin: auto;
	text-align: center;
}

.about-section {
	padding-top: 70px;
	width: 1200px;
	height: 220px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: auto;
}

.about-item {
	width: 384px;
	height: 218px;

	img {
		width: 100%;
		height: 100%;
	}
}

.about-title2 {
	width: 300px;
	height: 32px;
	font-size: 36px;
	color: #00BAAD;
	margin: auto;
	text-align: center;
	padding-top: 250px;
}

.about-note {
	padding-top: 40px;
	width: 766px;
	height: 76px;
	font-size: 20px;
	color: #FFFFFFBC;
	text-align: center;
	margin: auto;
}

.about-des-section {
	width: 488px;
	height: 100px;
	padding-top: 36px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: auto;
}

.about-des-item {
	width: 139px;
	height: 91px;

	img {
		width: 100%;
		height: 100%;
	}
}

.address-info-section {
	width: 1200px;
	height: 127px;
	margin: auto;
	border-bottom: 1px solid #FFFFFF72;
}

.ad-info-name {
	margin-top: 20px;
	font-size: 18px;
	color: #25BFD3;
}

.ad-info-company {
	margin-top: 10px;
	font-size: 16px;
	color: #697995;
}

.ad-info-address {
	margin-top: 10px;
	font-size: 16px;
	color: #697995;
}

.ad-beian {
	width: 220px;
	height: 26px;
	margin: auto;
	text-align: center;
	font-size: 14px;
	color: #697995;
	cursor: pointer;
	margin-top: 15px;
}

/* 登录框 */
.login-modal {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
}

.modal-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
}

.modal-body {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 448px;
	height: 548px;
	background: #1A1B2F;
	border-radius: 16px;
}

.login-wapper {
	padding-top: 30px;
}


.login-form {
	margin-top: 20px;
}

.form-group {
	width: 388px;
	margin: auto;
}

.form-group input {
	width: 378px;
	height: 42px;
	border: 1px solid #ddd;
	border-radius: 4px;
	padding-left: 10px;
}

.login-title {
	margin-top: 32px;
	width: 50px;
	height: 26px;
	text-align: center;
	margin: auto;
	font-size: 24px;
	color: #62D1DF;
}

.form-title {
	font-size: 16px;
	color: #fff;
	margin-bottom: 10px;
}

.submit-btn {
	width: 388px;
	height: 52px;
	margin-left: 30px;
	margin-top: 50px;
	background: linear-gradient(90deg, #2FC1DE 0%, #00BAAD 100%), linear-gradient(90deg, #6C63FF 0%, #3E7BFF 100%), #CCCCCC;
	box-shadow: 0px 2px 10px #FFFFFF;
	color: white;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: 16px;
}

.select-btn-wapper {
	margin-left: 30px;
	margin-right: 30px;
	width: 388px;
	height: 40px;
	display: flex;
	align-items: center;
	margin-top: 20px;
}

.tab-btn-select {
	font-size: 14px;
	color: #62D1DF;
	cursor: pointer;
}

.tab-btn-select.active {
	color: #25BFD3;
	font-weight: bold;
}

.tab-btn-forget {
	margin-left: auto;
	font-size: 14px;
	color: #62D1DF;
	cursor: pointer;
}

.login-wapper {
	display: none;
}

.login-wapper.active {
	display: block;
}

.pay-section {
	width: 1200px;
	height: 1062px;
	margin: auto;
	background: #1A1B2F;
	margin-top: 60px;
	border-radius: 30px;
}


.pay-head {
	width: 1200px;
	height: 209px;
	position: relative;
}

.pay-head img {
	width: 100%;
	height: 100%;
}

.pay-head-select {
	position: absolute;
	top: 125px;
	left: 0;
	width: 100%;
	height: 100px;
}

.pay-select {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.pay-select-item {
	width: 49%;
	text-align: center;
	font-size: 24px;
	color: #fff;
	cursor: pointer;
}

.pay-list-section {
	margin-top: 89px;
	margin-left: 102px;
	margin-right: 102px;
	height: 287px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.pay-list-item {
	width: 282px;
	height: 287px;
	background: #24253D;
	border-radius: 10px;
}

.pay-list-item.active {
	border: 2px solid #25BFD3;
}

.pay-list-wapper {
	display: none;
}

.pay-list-wapper.active {
	display: block;
}

.item-num-1 {
	margin-top: 68px;
	font-size: 24px;
	color: #FFFFFFC4;
	text-align: center;
	font-weight: 500;
}

.item-price-section {
	display: flex;
	justify-content: center;
	margin-top: 24px;
}

.item-price {
	font-size: 48px;
	color: #25BFD3;
}

.item-tag {
	margin-top: 25px;
	font-size: 24px;
	color: #25BFD3;
}

.pay-san-section {
	margin-left: 102px;
	margin-right: 102px;
	height: 280px;
	background: #24253D;
	border-radius: 10px;
	margin-top: 51px;
	display: flex;
	align-items: center;
}

.pay-qr-section {
	width: 214px;
	height: 214px;
	border-radius: 10px;
	background: #fff;
	margin-left: 52px;
}

.pay-info-section {
	margin-left: 20px;
	margin-right: 20px;
	height: 214px;
}

.pay-info-price {
	display: flex;
}

.pay-info-title {
	margin-top: 28px;
	font-size: 24px;
	color: #FFFFFFA5;
}

.pay-info-money {
	margin-top: 2px;
	font-size: 48px;
	color: #25BFD3;
}

.pay-note-section {
	margin-top: 100px;
	display: flex;
	align-items: center;
}

.pay-img-wx {
	width: 24px;
	height: 24px;
}

.pay-img-ali {
	width: 24px;
	height: 24px;
	margin-left: 5px;
}

.pay-note {
	font-size: 20px;
	color: #FFFFFFA5;
	margin-left: 5px;
}

.list-title-section {
	margin-top: 56px;
	margin-left: 102px;
	margin-right: 102px;
	height: 60px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: #24253D;
}

.list-item {
	width: 25%;
	height: 60px;
	line-height: 60px;
	text-align: center;
	font-size: 24px;
	text-align: #FFFFFFA5;
	color: #fff;
}

.contact-section {
	width: 1200px;
	height: 541px;
	margin: auto;
	background: #1A1B2F;
	margin-top: 60px;
	border-radius: 16px;
	border: 1px solid #FFFFFF;
}

.contact-title {
	margin-left: 30px;
	margin-right: 30px;
	height: 54px;
	font-size: 16px;
	color: #fff;
	border-bottom: 1px solid #FFFFFF60;
	line-height: 54px;
}

.contact-list-section {
	margin-top: 27px;
	margin-left: 30px;
	margin-right: 30px;
	height: 300px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}

.contact-list-item {
	width: 368px;
	height: 135px;
	background: #262740;
	border-radius: 5px;
}

.contact-info-section {
	margin-top: 20px;
	margin-left: 30px;
	margin-right: 30px;
	height: 104px;
	background: #262740;
	border-radius: 5px;
}