* {
	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: #1a3078;
}

.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(26, 48, 121, .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%,#1a3078 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: 494px;
	height: 100vh;
	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{color: #222222;line-height: 1;font-weight: 300;font-size: clamp(1.2rem, 4vw, 4.25rem);line-height: 1.3;}
.hero-en{font-weight: bold;color: #222222;text-stroke: 2px color: #222222;-webkit-text-stroke: 2px color: #222222;line-height: 1.3;text-transform: uppercase;}
.hero-img{
	position: absolute;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
}
.hero-img1{
	width:47.81%;
	height: auto;
}
.hero-img img{
	width: 100%;
	display: block;
	height: 100%;
	object-fit: cover;
}
.hero .banner-brand {
  margin-top: 0;
}
.hero .banner-brand__img {
  height: 62px;
  display: block;
}

.hero .banner-title {
  font-weight: 300;
  font-size: clamp(1.2rem, 4vw, 4.25rem);
  line-height: 1.3;
  /* font-weight: 400; */
  margin-top: 2rem;
  color: #fff;
}
.hero .banner-title strong {
  font-weight: bold;
}

.hero .banner-subtitle {
  font-size: clamp(1rem, 2vw, 1.375rem);
  opacity: 0.9;
  margin-top: 1.5rem;
  color: #fff;
  font-weight: 300;
}

.hero .banner-services {
  display: flex;
  gap: clamp(1.5rem, 6vw, 5.2vw);
  margin-top: clamp(1.5rem, 6vw, 5.2vw);
}
.hero .banner-service-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
}
.hero .service-icon {
  width: 90px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  /* background-color: rgba(0, 30, 60, 0.7); */
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}
.hero .service-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.hero .service-label {
  font-size: 1.25rem;
  text-align: center;
  color: #fff;
  text-align: center;
}

@media (max-width: 768px) {
  .hero .banner-brand__img {
    height: 32px;
  }
  .hero .banner-title {
    margin-top: 1.5rem;
  }
	.hero .banner-title{
		margin-top:1em;
	}
  .hero .banner-services {
    /* justify-content: space-around; */
    gap: 1.5rem;
    margin-top: 2rem;
  }
  
  .hero .service-icon img {
    /* width: 26px; */
    /* height: 26px; */
  }
  .hero .service-label {
    font-size: 0.9rem;
  }
}
.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%, #d9872b 0);
		background-position: 0 0;
		background-size: 100% 200%
	}

	to {
		background: linear-gradient(transparent 50%, #d9872b 0);
		background-position: 0 100%;
		background-size: 100% 200%
	}
}

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

	to {
		background: linear-gradient(transparent 50%, #d9872b 0);
		background-position: 0 100%;
		background-size: 100% 200%;
		color: #000
	}
}

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

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

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

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

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

	to {
		background: linear-gradient(#161718 50%, #1a3078 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;
	}
	.hero .service-icon {
    width: 60px;
    height: 60px;
  }
}

@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 rgba(240, 240, 240, 1);
	display: flex;
	/* display: grid; */
	flex-direction: row;
	justify-content: space-between;
	gap: 0;
	grid-template-columns: 2fr 1fr 1fr;
	margin-left: 32px;
	padding: 80px 0 48px;
	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-tel{
	font-weight: 500;
	font-size: 34px;
	color: #111111;
	line-height:1;
	margin-top: 1.4em;
	margin-bottom: 10px;
}
.homepage-footer .company-info .text-des {
	color: #161718;
	font-weight: 400;
	font-size: 16px;
	color: #666666;
	line-height: 28px;
	/* margin-bottom: 24px; */
}

.homepage-footer .contact-channel-item {
	align-items: center;
	display: flex;
	flex-direction: column;
	justify-content: center
}
.homepage-footer .contact-channel-item + .contact-channel-item{
	display:none;
}
.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(#1a3078 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: flex-end;
	padding: 0 80px;
	flex-wrap: wrap;
	gap: 0 30px;
}

.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: #fff;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 50px 32px;
	width: 100%;
	/* border-top: 1px solid rgba(240, 240, 240, 1); */
	gap: 0 40px;
}
.homepage-footer .bottom-layer .links{
	display:flex;
	flex:1;
	flex-wrap:wrap;
	gap:0 3.125vw;
}
.homepage-footer .bottom-layer .links a{
	font-weight: 400;
font-size: 16px;
color: rgba(0, 0, 0, 1);
line-height: 28px;
}
.homepage-footer .bottom-layer .copyright a:hover,
.homepage-footer .bottom-layer .links a:hover{
	color: #2B2B8E;
}
.homepage-footer .bottom-layer .copyright {
	color: rgba(153, 153, 153, 1);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	/* letter-spacing: -.14px; */
	line-height: 28px;
}
.homepage-footer .bottom-layer .copyright a{
	color: rgba(153, 153, 153, 1);
}
.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%;
	}
	.homepage-footer .company-info .text-tel{
		font-size:30px;
		margin-top: 1.2em;
	}
}
@media (max-width:1199px){
	.homepage-footer .company-info .text-tel{
		font-size:28px;
		margin-top: 1em;
	}
	.hero .banner-brand__img{
		height:50px;
	}
	.hero .service-icon{
		width:75px;
		height:75px;
	}
	.hero .service-label{
		font-size:1.1em;
	}
	.hero{
		height: 56.25vw;
	}
}
@media screen and (max-width: 768px) {
	.homepage-footer .company-info .text-tel{
		font-size:26px;
		margin-top: .8em;
	}
	.hero .service-label{
		font-size:1em;
	}
	.hero .service-icon{
		width:60px;
		height:60px;
	}
	.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;
		padding: 30px 16px;
	}
	.homepage-footer .bottom-layer .copyright,
	.homepage-footer .bottom-layer .links a{
		font-size:15px;
	}
	.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) {
	.homepage-footer .contact-us-container{
		gap:25px;
	}
	.homepage-footer .company-info .text-tel{
		font-size:24px;
	}
	.hero .service-label{
		font-size: 12px;
	}
	.hero .service-icon{
		width:45px;
		height:45px;
	}
	.hero .banner-brand__img{
		height:45px;
	}
    .header .logo{
        margin-right: 23px;
    }
	.hero-img1{
		width: 70%;
	}
}