* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	/* font-family: 'PingFang SC', 'Microsoft YaHei', 'Microsoft YaHei UI', 'HarmonyOS Sans SC', 'SimSun', 'SimHei', 'Arial', 'sans-serif'; */
}

@font-face {
	font-display: swap;
	font-family: Roboto;
	src: url(../fonts/RedHatDisplay-VariableFont_wght.ttf) format("truetype")
}

@font-face {
	font-display: swap;
	font-family: RedHatDisplay;
	src: url(../fonts/RedHatDisplay-VariableFont_wght.ttf) format("truetype")
}

@font-face {
	font-display: swap;
	font-family: Rubik-Bold;
	src: url(../fonts/RedHatDisplay-VariableFont_wght.ttf) format("truetype")
}

a:link,
a:active,
a:visited,
a:hover {
	background: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-tap-highlight-color: transparent;
}

a {
	text-decoration: none;
}

ul {
	list-style: none;
}

body {
	overflow-x: hidden;
	-webkit-tap-highlight-color: transparent;
	font-family: RedHatDisplay, Roboto, Rubik-Bold;
	/* font-family: apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
'Noto Color Emoji';--ant-font-family-code:'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; */
}

::-webkit-scrollbar {
	/*高宽分别对应横竖滚动条的尺寸*/
	width: 5px;
	height: 5px;
}

/*滚动条里面小方块*/
::-webkit-scrollbar-thumb {
	border-radius: 2px;
	-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
	background: #999;
}

/*滚动条里面轨道*/
::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
	border-radius: 2px;
	background: #EDEDED;
}

.content1300 {
	margin: 0 auto;
	width: 1300px;
	max-width: 94%;
}

.content1440 {
	margin: 0 auto;
	width: 1440px;
	max-width: 94%;
}

.content1400 {
	margin: 0 auto;
	width: 1400px;
	max-width: 94%;
}

.content1240 {
	margin: 0 auto;
	width: 1240px;
	max-width: 94%;
}

.content1200 {
	margin: 0 auto;
	width: 1200px;
	max-width: 94%;
}

.content1500 {
	margin: 0 auto;
	width: 1500px;
	max-width: 94%;
}

.content1600 {
	margin: 0 auto;
	width: 1600px;
	max-width: 94%;
}
.content64{
	padding: 0 64px;
}
.picCover {
	position: relative;
}

.picCover .pic {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.picCover .pic img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hoverLi .pic {
	overflow: hidden;
}

.hoverLi:hover .imgScale {
	transform: scale(1.05);
}

.imgScale {
	transition: all 1s;
	display: block;
	width: 100%;
}

.font30 {
	font-size: 30px;
}

.font48 {
	font-size: 48px;
}

.font36 {
	font-size: 36px;
}

.font60 {
	font-size: 60px;
}
.font72{
	font-size: 72px;
}

.font80 {
	font-size: 80px;
}

.font90 {
	font-size: 90px;
}
.font120{
	font-size: 120px;
}
.font200 {
	font-size: 200px;
}

.header {
	background-color: #fff;
	display: flex;
	padding: 16px 32px;
	position: sticky;
	position: -webkit-sticky;
	top: 0;
	width: 100%;
	z-index: 100
}

.header .m-aslide-btn {
	align-items: center;
	cursor: pointer;
	display: none;
	font-size: 22px;
	height: 24px;
	justify-content: center;
	margin-right: 16px;
	width: 24px;
	margin-top: auto;
	margin-bottom: auto;
}

.header.active1 {
	background-color: transparent;
	left: 0;
	position: fixed;
	top: 0;
	transition: background-color .3s ease;
	width: 100%;
	z-index: 100;
}

.header.active {
	background-color: #fff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .1);
}

.header .logo {
	height: 36px;
	margin-right: 48px;
}

.header .logo img {
	display: block;
	height: 100%;
}

.header .nav {
	display: flex;
	margin-bottom: auto;
	margin-top: auto;
}

.header .nav li {
	position: relative;
}

.header .nav li>a {
	color: rgba(34, 34, 34, 1);
	font-size: 14px;
	font-weight: 500;
	line-height: 22px
}

.header .nav li.active>a {
	color: rgba(217, 41, 27, 1);
}

.header .nav li:not(:last-child) {
	margin-right: 48px
}

.header .nav li .dropdown {
	position: absolute;
	left: 0;
	top: 100%;
	padding: 8px 0;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0 6px 16px 0 rgba(0, 0, 0, .08), 0 3px 6px -4px rgba(0, 0, 0, .12), 0 9px 28px 8px rgba(0, 0, 0, .05);
	display: none;
}

.header .nav li:hover .dropdown {
	display: block;
}

.header .nav li .dropdown a {
	font-size: 14px;
	color: rgba(0, 0, 0, .88);
	transition: all .2s;
	padding: 12px;
	line-height: 1.57;
	display: block;
	white-space: nowrap;
}

.header .nav li .dropdown a:hover {
	background: rgba(217, 41, 27, .1);
}

.header .r .aslideBtn .iconfont {
	color: rgba(153, 153, 153, 1);
	font-size: 22px;
	transition: all .6s;
}

.header .r .header-search-box {
	position: relative;
	margin-left: 40px;
}

.header .r .header-search-box .header-searchBtn {
	cursor: pointer;
	font-size: 22px;
	color: rgba(153, 153, 153, 1);
	transition: all .6s;
}

.header .r .header-search-box .header-searchBtn:hover {
	color: rgba(233, 202, 86, 1);
}

.header .r .header-search-box .header-search-container {
	position: absolute;
	right: -15px;
	top: 70px;
	display: none;
	/* border: 1px solid #999; */
}

.header .r .header-search-box .header-search {
	width: 230px;
	height: 38px;
	background: rgba(255, 255, 255, 1);
	/* background: #F0F0F0; */
	border-radius: 19px;
	display: flex;
	align-items: center;
	/* box-shadow: 0 10px 40px rgba(0, 0, 0, .08); */
	border: 1px solid #999;
}

.header .r .header-search-box .header-search input {
	flex: 1;
	padding-left: 17px;
	font-size: 12px;
	font-family: Microsoft YaHei;
	font-weight: 400;
	color: #333;
	height: 100%;
	width: 100%;
	border-radius: 19px;
	border: none;
	outline: none;
	background-color: transparent;
}

.header .r .header-search-box .header-search input::placeholder {
	color: #999;
}

.header .r .header-search-box .header-search .iconfont {
	cursor: pointer;
	color: rgba(153, 153, 153, 1);
	padding: 0 15px 0 10px;
	transition: all 1s;
}

.header .r .header-search-box .header-search .iconfont:hover {
	color: rgba(233, 202, 86, 1);
}

.header-drawer {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 1001;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: all .3s .04s;
}

.header-drawer.active {
	visibility: visible;
	opacity: 1;
	pointer-events: inherit;
	transition: all .3s;
}

.header-drawer .mask {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .45);
	/* z-index: 1000; */
	pointer-events: auto;
}

.header-drawer-wrapper {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	transition: all .3s;
	background-color: #fff;
	display: flex;
	flex-direction: column;
	overflow: auto;
	transform: translateX(-110%);
}

.header-drawer.active .header-drawer-wrapper {
	transform: translateX(0);
	transition: all .3s .04s;
}

.header-drawer-header {
	border-bottom: 1px solid rgba(22, 23, 24, .1);
	padding: 16px;
	display: flex;
	align-items: center;
	font-size: 16px;
	line-height: 1.5;
}

.header-drawer-header .icon {
	color: #161718;
	font-size: 24px;
	margin-right: 8px;
}

.header-drawer-header .text {
	color: #161718;
	font-size: 17px;
	font-weight: 700;
}

.header-drawer-body {
	flex: 1;
	overflow-y: auto;
	padding: 16px;
	scrollbar-width: none;
}

.header-drawer-body li {
	border-bottom: 1px solid rgba(22, 23, 24, .1);
	padding: 4px;
}

.header-drawer-body li>a {
	align-items: center;
	color: #161718;
	display: flex;
	font-size: 17px;
	font-weight: 700;
	height: 48px;
	justify-content: space-between;
	width: 100%;
	margin: 0 4px;
}

.header-drawer-body li .dropdown {
	display: none;
}

.header-drawer-body li .dropdown a {
	font-size: 14px;
	color: rgba(0, 0, 0, .88);
	display: block;
	line-height: 40px;
	margin: 0 4px;
}

.header-drawer-body li>a .anticon {
	font-size: 14px;
}

.header-drawer-body li>a .anticon.icon {
	font-size: 18px;
	font-weight: bold;
	color: #000;
	transform: rotate(-90deg);
	transition: all .3s;
}

.header-drawer-body li.active>a .anticon.icon {
	transform: rotate(0deg);
}

.header-drawer-body li .dropdown a:not(:last-child) {
	border-bottom: 1px solid rgba(22, 23, 24, .1);
}
.header .loginBtn{
	background: linear-gradient(#007cf3 50%,RGBA(187, 31, 45, 1) 0);
	background-position: 0 100%;
	background-size: 100% 200%;
	border: unset;
	border-radius: 4px;
	color: #fff;
	cursor: pointer;
	font-size: 15px;
	font-weight: 500;
	line-height: 20px;
	padding: 6px 24px;
	transition: all .1s ease-in-out;
	margin: auto 0 auto auto;
}
.header .loginBtn:hover{
	 animation: blue-button-hover .25s ease-in-out;
	 background-position: 0 0;
	 border-color: #fff;
	 color: #fff;
	 transition: all 0s
}
.hero{
	position: relative;
	min-height: 340px;
	height: 44.79vw;
	background: rgba(245, 246, 250, 1);
	display: flex;
	align-items: center;
	justify-content: center;
	background-size: cover;
}
.hero-content{
	position: relative;
	width: 100%;
	z-index: 3;
}
.hero-subtitle{
font-weight: 400;
color: #222222;
line-height: 1;
margin-bottom: 1.44em;
} 
.hero-title{
font-weight: bold;
font-size: 72px;
color: #222222;
line-height: 1;
}
.hero-en{
font-weight: 400;
color: rgba(34, 34, 34, 0);
text-stroke: 2px #D7D9E3;
-webkit-text-stroke: 2px #D7D9E3;
line-height: 1;
margin-top: .5em;
text-transform: uppercase;
}
.hero-img{
	position: absolute;
	right: 0;
	bottom: 0;
	width: 47.81%;
}
.hero-img img{
	width: 100%;
	display: block;
}
.modal {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.55);
	display: none;
	z-index: 999;
}

.modal .shadow {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.video-content {

	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);

}

.modal .close {
	position: absolute;
	right: -26px;
	top: -26px;
	cursor: pointer;
	color: #fff;
	font-size: 24px;
}

.video-content video {
	display: block;
	margin: 0 auto;
	max-width: 90vw;
	max-height: 80vh;
}

.pagination {
	margin: 16px 0 0 auto;
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	display: flex;
	font-size: 14px;
	color: rgba(0, 0, 0, .88);
	line-height: 1.57;
	justify-content: flex-end;
	align-items: center;
}

.pagination>span:not(:last-child) {
	margin-right: 8px;
}

.pagination .total-text {
	line-height: 30px;
}

.pagination .pagination-prev,
.pagination .pagination-next {
	cursor: pointer;
	width: 32px;
	height: 32px;
	line-height: 32px;
	text-align: center;
	color: #1e1e1e;
	border-radius: 4px;
	transition: all .3s;
}

.pagination .pagination-prev.pagination-disabled,
.pagination .pagination-next.pagination-disabled {
	color: rgba(0, 0, 0, 0.25);
	cursor: not-allowed;
}

.pagination .pagination-prev .anticon,
.pagination .pagination-next .anticon {
	font-size: 12px;
}

.pagination .pagination-item {
	width: 32px;
	height: 32px;
	line-height: 32px;
	border-radius: 4px;
	text-align: center;
	cursor: pointer;
	transition: all .3s;
}

.pagination .pagination-item.active {
	background-color: #161718;
	color: #fff;
}

.pagination .pagination-prev:not(.pagination-disabled):hover,
.pagination .pagination-next:not(.pagination-disabled):hover,
.pagination .pagination-item:hover {
	background: rgba(0, 0, 0, 0.06);
}

.pagination .pagination-options {
	margin-left: 16px;
}

.pagination .pagination-options input {
	width: 50px;
	height: 32px;
	margin: 0 8px;
	padding: 4px 11px;
	border: 1px solid #d9d9d9;
	border-radius: 4px;
	outline: none;
}

.pagination .pagination-options input:focus {
	border-color: #fff;
	box-shadow: 0 0 0 2px rgba(5, 145, 255, 0.1);
}

@keyframes fadeInUpSmall {
	from {
		opacity: 0;
		transform: translate3d(0%, 30px, 0);
	}

	to {
		opacity: 1;
		transform: translate3d(0%, 0px, 0);
	}
}

@keyframes fadeInSmallDown {
	from {
		opacity: 0;
		transform: translate3d(0%, -50px, 0);
	}

	to {
		opacity: 1;
		transform: translate3d(0%, 0px, 0);
	}
}

.fadeInSmallDown {
	animation-name: fadeInSmallDown;
}

@keyframes normal-button-hover {
	0% {
		background: linear-gradient(transparent 50%, rgba(217, 41, 27, 1) 0);
		background-position: 0 0;
		background-size: 100% 200%
	}

	to {
		background: linear-gradient(transparent 50%, rgba(217, 41, 27, 1) 0);
		background-position: 0 100%;
		background-size: 100% 200%
	}
}

@keyframes button-hover {
	0% {
		background: linear-gradient(transparent 50%, rgba(217, 41, 27, 1) 0);
		background-position: 0 0;
		background-size: 100% 200%;
		color: #000
	}

	to {
		background: linear-gradient(transparent 50%, rgba(217, 41, 27, 1) 0);
		background-position: 0 100%;
		background-size: 100% 200%;
		color: #000
	}
}

@keyframes blue-button-hover {
	0% {
		background: linear-gradient(#007cf3 50%, rgba(217, 41, 27, 1) 0);
		background-position: 0 0;
		background-size: 100% 200%;
		color: #fff
	}

	to {
		background: linear-gradient(#007cf3 50%, rgba(217, 41, 27, 1) 0);
		background-position: 0 100%;
		background-size: 100% 200%;
		color: #000
	}
}

@keyframes white-button-hover {
	0% {
		background: linear-gradient(#fff 50%, rgba(217, 41, 27, 1) 0);
		background-position: 0 0;
		background-size: 100% 200%;
		color: #fff
	}

	to {
		background: linear-gradient(#fff 50%, rgba(217, 41, 27, 1) 0);
		background-position: 0 100%;
		background-size: 100% 200%;
		color: #000
	}
}

@keyframes black-button-hover {
	0% {
		background: linear-gradient(#161718 50%, rgba(217, 41, 27, 1) 0);
		background-position: 0 0;
		background-size: 100% 200%;
		color: #fff
	}

	to {
		background: linear-gradient(#161718 50%, rgba(217, 41, 27, 1) 0);
		background-position: 0 100%;
		background-size: 100% 200%;
		color: #000
	}
}

.m-right-buttom {
	display: none;
}

@media (max-width:1630px) {
	.content1600 {
		width: 94%;
	}
}

@media (max-width:1500px) {}

@media (max-width:1440px) {
	.font48 {
		font-size: 36px;
	}

	.font36 {
		font-size: 32px;
	}

	.font60 {
		font-size: 48px;
	}
	.font72,
	.font80 {
		font-size: 60px;
	}
	.font120{
		font-size: 100px;
	}
	.font90 {
		font-size: 70px;
	}

	.font200 {
		font-size: 150px;
	}
	.content64{
		padding-left: 3%;
		padding-right: 3%;
	}
}

@media (max-width:1400px) {}

@media (max-width:1430px) {
	.content1400 {
		width: 94%;
	}
}

@media (max-width:1330px) {
	.content1300 {
		width: 94%;
	}
}

@media (max-width:1280px) {
	.font36 {
		font-size: 30px;
	}

	.font60 {
		font-size: 36px;
	}
	.font72,
	.font80 {
		font-size: 48px;
	}
	.font120,
	.font90 {
		font-size: 60px;
	}

	.font200 {
		font-size: 120px;
	}

	.font30 {
		font-size: 28px;
	}

	.font48 {
		font-size: 30px;
	}
}

@media (max-width:1199px) {
	.font36 {
		font-size: 28px;
	}

	.font60 {
		font-size: 30px;
	}
	.font72,
	.font80 {
		font-size: 36px;
	}
	.font120,
	.font90 {
		font-size: 50px;
	}

	.font200 {
		font-size: 90px;
	}

	.font30 {
		font-size: 26px;
	}

	.font48 {
		font-size: 28px;
	}

}

@media (max-width: 1024px) {
	.header .nav {
		display: none;
	}

	.header .m-aslide-btn {
		display: flex;
	}

	.font36 {
		font-size: 26px;
	}

	.font60 {
		font-size: 28px;
	}
	.font72,
	.font80 {
		font-size: 30px;
	}
	.font120,
	.font90 {
		font-size: 40px;
	}

	.font200 {
		font-size: 70px;
	}

	.font30 {
		font-size: 24px;
	}

	.font48 {
		font-size: 26px;
	}
}

@media (max-width: 768px) {
	.header .loginBtn{
		padding:5px 16px
	}
	.font36 {
		font-size: 24px;
	}

	.font60 {
		font-size: 26px;
	}
	.font72,
	.font80 {
		font-size: 28px;
	}
	.font120,
	.font90 {
		font-size: 30px;
	}

	.font200 {
		font-size: 50px;
	}

	.font30 {
		font-size: 22px;
	}

	.font48 {
		font-size: 24px;
	}

	.video-content {
		width: 85%;
	}

	.video-content video {
		display: block;
		margin: 0 auto;
		width: 100%;
		height: auto;
	}
}

@media (max-width: 500px) {
	.font36 {
		font-size: 22px;
	}

	.font60 {
		font-size: 24px;
	}
	.font72,
	.font80 {
		font-size: 26px;
	}
	.font120,
	.font90 {
		font-size: 26px;
	}

	.font200 {
		font-size: 30px;
	}

	.font30 {
		font-size: 20px;
	}

	.font48 {
		font-size: 22px;
	}
}

.articleItem a {
	background: #fff;
	border-radius: 8px;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	height: 420px;
	min-width: 240px;
	overflow: hidden;
	position: relative;
	transition: all .3s ease;
}

.articleItem .pic {
	border-radius: 4px 4px 0 0;
	height: 172px;
	margin-left: 1px;
	overflow: hidden;
	width: calc(100% - 2px);
}

.articleItem .pic img {
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
	display: block;
}

.articleItem .text-box {
	background: #fff;
	border-radius: 0 0 8px 8px;
	height: 242px;
	left: 0;
	overflow: hidden;
	position: absolute;
	top: 172px;
	transition: all .3s ease;
	width: 100%
}

.articleItem .text-box-container {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding: 16px 0 32px
}

.articleItem .text-content {
	display: flex;
	flex-direction: column;
	gap: 8px;
	height: 156px
}

.articleItem .text-title {
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	color: #161718;
	display: -webkit-box;
	font-size: 16px;
	font-weight: 500;
	line-height: 24px;
	margin: 0;
	overflow: hidden;
	text-overflow: ellipsis
}

.articleItem .text-des {
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	color: #666;
	display: -webkit-box;
	font-size: 14px;
	line-height: 20px;
	margin: 0;
	overflow: hidden;
	text-overflow: ellipsis
}

.articleItem .meta {
	align-items: center;
	display: flex;
	gap: 4px;
	justify-content: start;
	font-family: RedHatDisplay;
	font-size: 15px;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 20px;
	vertical-align: middle;
	color: #1e1e1e;
}

.articleItem .moreBtn {
	align-items: center;
	color: #161718;
	display: flex;
	flex-direction: row;
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px;
}

.homepage-footer {
	align-items: center;
	background: #fff;
	display: flex;
	flex-direction: column;
	width: 100%
}

.homepage-footer .contact-us-container {
	grid-gap: 0;
	border-bottom: 1px solid #d5dee5;
	display: flex;
	display: grid;
	flex-direction: row;
	gap: 0;
	grid-template-columns: 2fr 1fr 1fr;
	margin-left: 32px;
	padding: 80px 0;
	width: calc(100% - 64px);
	background: #fff;
}

.homepage-footer .company-info {
	display: flex;
	flex-direction: column
}

.homepage-footer .social-container>div:not(:last-child),
.contact-us-container>div:not(:last-child) {
	border-right: 1px solid #d5dee5;
}

.homepage-footer .company-info .title {
	color: #161718;
	font-size: 32px;
	font-style: normal;
	font-weight: 600;
	line-height: 40px;
	margin-bottom: 32px;
	text-transform: uppercase;
}

.homepage-footer .company-info .text-title {
	color: #697682;
	font-size: 17px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px
}

.homepage-footer .company-info .text-des {
	color: #161718;
	font-size: 17px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	margin-bottom: 24px
}

.homepage-footer .contact-channel-item {
	align-items: center;
	display: flex;
	flex-direction: column;
	justify-content: center
}

.homepage-footer .contact-channel-item .anticon {
	color: #161718;
	font-size: 30px
}

.homepage-footer .contact-channel-item .line {
	background-color: #acb8c3;
	height: 1px;
	margin: 28px 0;
	width: 32px
}

.homepage-footer .contact-channel-item .channel-value {
	color: #161718;
	font-size: 20px;
	font-style: normal;
	font-weight: 600;
	line-height: 28px;
	text-align: center
}

.homepage-footer .contact-channel-item .channel-desc {
	color: #697682;
	font-size: 17px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	margin-top: 8px;
	text-align: center
}

.homepage-footer .social-container {
	grid-gap: 0;
	border-bottom: 1px solid #d5dee5;
	display: flex;
	display: grid;
	flex-direction: row;
	gap: 0;
	grid-template-columns: 1fr 1fr;
	margin-left: 32px;
	padding: 80px 0;
	width: calc(100% - 64px)
}

.homepage-footer .contact-us-wrap {
	display: flex;
	flex-direction: column
}

.homepage-footer .contact-us-wrap .title {
	color: #161718;
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px;
	margin-bottom: 16px
}

.homepage-footer .contact-us-wrap .subscribe {
	margin-right: 80px;
}

.homepage-footer .contact-us-wrap .subscribe form {
	border: 1px solid #161718;
	border-radius: 2px;
	border-radius: 8px;
	display: flex;
	flex-direction: row;
	height: 46px;
	overflow: hidden
}

.homepage-footer .contact-us-wrap .subscribe input {
	background-color: transparent;
	border-color: transparent;
	flex: 1;
	width: 100%;
	padding: 4px 11px;
	color: rgba(0, 0, 0, .88);
	outline: none;
}

.homepage-footer .contact-us-wrap .subscribe input::placeholder {
	color: rgba(0, 0, 0, .3);
}

.homepage-footer .contact-us-wrap .subscribe .submit {
	background: linear-gradient(rgba(217, 41, 27, 1) 50%, #161718 0);
	background-position: 0 100%;
	background-size: 100% 200%;
	border-radius: 0;
	border-width: 0;
	color: #fff;
	cursor: pointer;
	font-size: 17px;
	font-weight: 500;
	height: 100%;
	line-height: 24px;
	transition: all .1s ease-in-out;
	width: 144px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.homepage-footer .contact-us-wrap .subscribe .submit:hover {
	animation: black-button-hover .25s ease-in-out;
	background-position: 0 0;
	color: #000;
	transition: all 0s
}

.homepage-footer .social-group {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 0 80px;
	flex-wrap: wrap;
}

.homepage-footer .social-group .item-wrap {
	align-items: center;
	display: flex;
	flex-direction: column
}

.homepage-footer .social-group .item-wrap .pic img {
	height: 120px;
	width: 120px
}

.homepage-footer .social-group .item-wrap .desc-wrap {
	align-items: center;
	display: flex;
	flex-direction: row;
	margin-top: 16px
}

.homepage-footer .social-group .item-wrap .desc-wrap .desc {
	color: #161718;
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px
}

.homepage-footer .social-group .item-wrap .desc-wrap .anticon {
	font-size: 18px;
	margin-right: 10px
}

.homepage-footer .bottom-layer {
	align-items: center;
	background: RGBA(187, 31, 45, 1);
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 0 32px;
	width: 100%
}

.homepage-footer .bottom-layer .copyright {
	color: #fff;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	letter-spacing: -.14px;
	line-height: 16px
}

.homepage-footer .bottom-layer .logo {
	height: 16px;
}

.communication-btn {
	background-color: #fff;
	border-radius: 28px;
	border-width: 0;
	bottom: 32px;
	box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .078);
	color: #161718;
	cursor: pointer;
	font-size: 13px;
	height: 148px;
	position: fixed;
	right: 16px;
	transition: all .3s ease-in-out;
	width: 56px;
	z-index: 100;
	display: flex;
	align-items: center;
	justify-content: center;

}

.communication-btn:hover {
	background-color: #161718;
	color: #fff
}

.communication-btn .communication-content {
	margin: 0;
	width: min-content;
	text-align: center;
}

.communication-btn .communication-content svg {
	display: block;
	margin-bottom: 5px;
}

.popover-inner {
	position: absolute;
	bottom: 0;
	right: 110%;
	border-radius: 4px;
	background-color: #fff;
	padding: 12px;
	box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08),
		0 3px 6px -4px rgba(0, 0, 0, 0.12),
		0 9px 28px 8px rgba(0, 0, 0, 0.05);
	transition: all .2s ease-in-out;
	transform: scale(.8);
	transform-origin: right bottom;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.communication-btn:hover .popover-inner {
	transform: scale(1);
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.popover-inner .info-wrap {
	display: flex;
	gap: 10px 40px;
	justify-content: center;
	padding: 48px 38px
}

.popover-inner .info-wrap .info-item {
	align-items: center;
	display: flex;
	flex-direction: column;
	width: 224px;
}

.popover-inner .info-wrap .info-item .title {
	color: #161718;
	font-size: 20px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	margin-bottom: 8px;
	text-transform: capitalize
}

.popover-inner .info-wrap .info-item .barcode-wrap {
	align-items: center;
	align-self: stretch;
	background: #f4f7f9;
	border: 1px solid #eef2f5;
	border-radius: 8px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	justify-content: center;
	padding: 20px 20px 16px
}

.popover-inner .info-wrap .info-item .barcode-wrap .pic img {
	height: 182px;
	width: 182px
}

.popover-inner .info-wrap .bottom-tip-wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 4px;
	color: #000;
}

.anticon {
	display: inline-flex;
	align-items: center;
	color: inherit;
	font-style: normal;
	line-height: 0;
	text-align: center;
	text-transform: none;
	vertical-align: -0.125em;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

.anticon>* {
	line-height: 1;
}

.anticon svg {
	display: inline-block;
}

.anticon .anticon .anticon-icon {
	display: block;
}
@media (max-width:1440px) {
	.hero-content{
		padding-left: 3%;
		padding-right: 3%;
	}
}
@media screen and (max-width: 768px) {
	.communication-btn {
		display: none;
	}

	.homepage-footer .social-group {
		grid-gap: 16px;
		display: grid;
		gap: 16px;
		grid-template-columns: 1fr 1fr;
		justify-items: center;
		padding: unset
	}

	.homepage-footer .social-container>div:not(:last-child),
	.contact-us-container>div:not(:last-child) {
		border-right: none;
	}

	.homepage-footer .bottom-layer {
		flex-direction: column
	}

	.homepage-footer .contact-us-wrap .social-group {
		grid-gap: 16px;
		display: grid;
		gap: 16px;
		grid-template-columns: 1fr 1fr;
		justify-items: center;
		padding: unset
	}

	.homepage-footer .contact-us-wrap .subscribe {
		margin-right: unset;
	}

	.homepage-footer .social-container {
		display: flex;
		flex-direction: column;
		gap: 32px;
		grid-template-columns: unset;
		margin-left: unset;
		padding: 32px 16px;
		width: 100%
	}

	.homepage-footer .contact-channel-item {
		border-top: 1px solid #d5dee5;
		padding-top: 24px;
		width: 100%
	}

	.homepage-footer .company-info .title {
		font-size: 24px;
		line-height: 32px
	}

	.homepage-footer .contact-us-container {
		align-items: center;
		border-bottom: unset;
		display: flex;
		flex-direction: column;
		gap: 32px;
		grid-template-columns: unset;
		justify-content: center;
		margin-left: unset;
		padding: 32px 16px;
		width: 100%
	}
}
@media (max-width:500px) {
    .header .logo{
        margin-right: 23px;
    }
	.hero-img{
		width: 70%;
	}
}