.SupportHero {
	display: flex;
	align-items: center;
	height: 480px;
	padding: 0;
	background-image:
		linear-gradient(90deg, rgba(8, 12, 15, 0.76), rgba(8, 12, 15, 0.26)),
		url("../images/ff32f3f146b202f0531ca2a88859f9cb1815a605.png");
	color: #fff;
	background-size: cover;
}

.SupportHero .main,
.SupportApplication .main {
	width: 1360px;
	max-width: 90%;
}

.SupportHero span {
	color: #ef5535;
	font-size: 14px;
	line-height: 21px;
}

.SupportHero h1 {
	margin-top: 14px;
	font-size: 64px;
	line-height: 70px;
}

.SupportHero p {
	max-width: 690px;
	margin-top: 18px;
	color: #d0d3d5;
	font-size: 18px;
	line-height: 29px;
}

.SupportApplication {
	padding: 80px 0 120px;
	background: #f5f6f7;
}

.SupportApplication .supportLayout {
	display: grid;
	grid-template-columns:  minmax(0, 1fr) 322px;
	gap: 24px;
}

.SupportApplication .supportNav,
.SupportApplication form,
.SupportApplication .supportInfo > div {
	border: 1px solid var(--site-line);
	background: #fff;
}

.SupportApplication .supportNav {
	align-self: start;
	padding: 26px;
}

.SupportApplication .supportNav h3 {
	font-size: 24px;
	line-height: 34px;
}

.SupportApplication .supportNav p {
	color: #747a80;
	font-size: 14px;
	line-height: 22px;
}

.SupportApplication .supportNav a {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 8px;
	padding: 12px 16px;
	font-size: 16px;
	line-height: 24px;
}

.SupportApplication .supportNavIcon {
	width: 18px;
	height: 18px;
	flex: 0 0 18px;
}

.SupportApplication .supportNav a.active {
	background: var(--site-red);
	color: #fff;
}

.SupportApplication .supportNav a.active .supportNavIcon {
	filter: brightness(0) invert(1);
}

.SupportApplication form {
	padding: 38px;
}

.SupportApplication form h2 {
	font-size: 32px;
	line-height: 42px;
}

.SupportApplication form > p {
	margin-top: 8px;
	color: #697077;
	font-size: 16px;
	line-height: 26px;
}

.SupportApplication .fieldGrid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 18px;
	margin-top: 28px;
}

.SupportApplication form label {
	display: grid;
	gap: 8px;
	margin-top: 18px;
	font-size: 14px;
	line-height: 22px;
}

.SupportApplication form input,
.SupportApplication form select,
.SupportApplication form textarea {
	width: 100%;
	padding: 13px 16px;
	background: #f1f3f4;
	font-size: 16px;
	line-height: 24px;
}

.SupportApplication form textarea {
	min-height: 140px;
	resize: vertical;
}

.SupportApplication form input[type="file"] {
	display: none;
}

.SupportApplication .upload {
	display: grid;
	place-content: center;
	min-height: 120px;
	border: 1px dashed var(--site-red);
	background: #fafafa;
	text-align: center;
}

.SupportApplication .supportActionIcon {
	width: 22px;
	height: 22px;
	margin: 0 auto 8px;
}

.SupportApplication .remote .supportActionIcon {
	display: inline-block;
	width: 18px;
	height: 18px;
	margin: 0 8px 0 0;
	vertical-align: middle;
	filter: brightness(0) invert(1);
}

.SupportApplication .upload small {
	margin-top: 4px;
	font-size: 12px;
	line-height: 18px;
}

.SupportApplication form > button {
	width: 100%;
	height: 54px;
	margin-top: 22px;
background: rgba(178, 35, 0, 1);
	color: #fff;
}

.SupportApplication .supportInfo > div {
	margin-bottom: 20px;
	padding: 26px;
}
.SupportApplication .supportInfo ul{
    display: grid;
    gap: vaR(--p20);
}
.SupportApplication .supportInfo ul li{
    display:grid;
    grid-template-columns: 2em 1fr;
    align-items: flex-start;
    gap: var(--p10);
}
.SupportApplication .supportInfo ul li span{
    margin-top: 0;
}
.SupportApplication .supportInfo ul li  .key{
    color: rgba(92, 64, 57, 1);
    font-size: var(--ft14);
}
.SupportApplication .supportInfo h3 {
	margin-bottom: 18px;
	font-size: 24px;
	line-height: 34px;
}

.SupportApplication .supportInfo span,
.SupportApplication .supportInfo strong,
.SupportApplication .supportInfo p {
	display: block;
}

.SupportApplication .supportInfo span {
	margin-top: 14px;
	color: rgba(25, 28, 30, 1);
	color: #747a80;
	font-size: 12px;
	line-height: 18px;
}
.SupportApplication .supportInfo .wechat small{
    font-size: vaR(--ft12);
    color: rgba(92, 64, 57, 1);
}
.SupportApplication .supportInfo strong {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 18px;
	font-weight: 500;
	line-height: 29px;
}

.SupportApplication .supportContactIcon {
	width: 18px;
	height: 18px;
	flex: 0 0 18px;
}

.SupportApplication .supportInfo p {
	margin-top: 6px;
	color: #747a80;
	font-size: 14px;
	line-height: 22px;
}

.SupportApplication .remote {
	background-image: url(../images/supbg.png) !important;
	background-size: cover;
	color: #fff;
}

.SupportApplication .remote p {
	color: #d0d3d5;
}

.SupportApplication .remote a {
    
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 18px;
	padding: 12px;
	gap: vaR(--p20);
	border: 1px solid #6a7075;
	text-align: center;
}

.SupportApplication .wechat {
	text-align: center;
}

.SupportApplication .wechatCode {
	width: 112px;
	height: 112px;
	margin: 14px auto;
	flex-shrink: 0;
}

@media only screen and (max-width: 1440px) {
	.SupportApplication .supportLayout {
		grid-template-columns:  minmax(0, 1fr) 280px;
	}
}

@media only screen and (max-width: 768px) {
	.SupportHero {
		height: auto;
		min-height: 480px;
	}

	.SupportHero h1 {
		font-size: 44px;
		line-height: 56px;
	}

	.SupportApplication .supportLayout,
	.SupportApplication .fieldGrid {
		grid-template-columns: 1fr;
	}

	.SupportApplication form {
		padding: 24px;
	}
}