.main {
--gapWidth:40px
}
.banner {
	height: 48vh;
	max-height: 480px;
	min-height: 200px
}
.banner .swiper {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden
}
.banner .swiper-container-horizontal>.swiper-pagination-bullets {
	bottom: 0.6rem
}
.banner .swiper-pagination-bullet {
	width: Max(0.4rem, 35px);
	height: 4px;
	border-radius: unset;
	background: rgba(255,255,255,0.5);
	filter: blur(1px)
}
.banner .swiper-pagination-bullet-active {
	background-color: #e7b213;
	filter: unset
}
.banner .slide-img {
	width: 100%;
	height: 100%;
	font-size: 0
}
img {
	max-width: 100%;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border: 0
}
.view-more {
	position: relative;
	display: inline-block;
	padding-right: 24px;
	position: relative;
	font-weight: 600;
	font-size: 16px;
	color: #0e80da;
	letter-spacing: 0;
	line-height: 1.5
}
.view-more::after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 14px;
	height: 14px;
	background: url(/_upload/tpl/06/be/1726/template1726/images/home/view-more.png) no-repeat center/contain
}
.view-more:hover {
	text-decoration: underline
}
.learn-more {
	position: relative;
	display: inline-block;
	font-family: Muli;
	font-weight: 700;
	font-size: 12px;
	color: #000000;
	line-height: 2;
	text-transform: Uppercase
}
.learn-more::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-100%);
	width: Max(0.16rem, 16px);
	height: 0.2rem;
	background: url(/_upload/tpl/06/be/1726/template1726/images/home/left-arrow.png) no-repeat center/contain
}
.action-img {
	position: relative;
	display: block;
	height: 100%;
	width: 100%;
	box-sizing: border-box;
	font-size: 0;
	overflow: hidden;
	cursor: pointer
}
.action-img>a {
	display: block;
	width: 100%;
	height: 100%
}
.action-img:hover img {
	transform: scale(1.2)
}
.action-img img {
	position: absolute;
	transform: scale(1);
	transition: all 0.6s
}
h2 {
	-webkit-line-clamp: 1;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
	overflow: hidden
}
.styling-title .title-en {
	position: relative;
	padding-left: Max(0.42rem, 35px);
	margin-bottom: Max(0.1rem, 6px);
	font-family: Montserrat;
	font-weight: 400;
	font-size: 12px;
	color: #097bf7;
	letter-spacing: 1px;
	text-transform: Uppercase
}
.styling-title .title-en::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: Max(0.32rem, 25px);
	height: 1px;
	background-color: #0e80da
}
.styling-title .title-cn {
	font-weight: 500;
	font-size: Max(0.32rem, 25px);
	color: #000000
}
.news-list {
	display: flex
}
.news-list>div {
	width: 100%
}
.news-list ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: start;
	width: 100%
}
.news-list li {
	width: calc((100% - var(--gapWidth)) / 2);
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 0;
	border-bottom: 1px dashed #C0C8CC
}
.news-list li:nth-last-child(-n+2) {
	border-bottom: unset
}
.news-list li:nth-child(2n) {
	border-bottom: 1px dashed #C0C8CC;
	margin-left: var(--gapWidth)
}
.news-list li:last-child {
	border-bottom: unset
}
.news-list .date {
	margin-right: 10px;
	font-weight: 500;
	font-size: 14px;
	color: #0e80da;
	letter-spacing: 1.4px;
	line-height: 1.28;
	white-space: nowrap
}
.news-list h2 {
	font-weight: 400;
	font-size: 16px;
	color: #404040;
	letter-spacing: 0;
	line-height: 1.375
}
.news-list h2 font {
	font-weight: 400 !important
}
.news-list h3 {
	font-family: Arial;
	font-weight: normal;
	margin: 2px 0;
	font-size: 14px;
	color: #909499
}
.news-list.date-list li {
	padding: 10px 0 0;
	gap: unset
}
.news-list .info {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between
}
.news-list .info h2 {
	margin-bottom: 6px
}
.news-list .info h3 {
	display: none
}
.news-list .date2 {
	margin-right: 16px;
	width: 56px;
	flex-shrink: 0
}
.news-list .date2 p {
	padding: 4px 6px;
	font-weight: 500;
	font-size: 14px;
	color: #FFFFFF;
	line-height: 20px;
	text-align: center
}
.news-list .date2 p:first-child {
	background-color: #0c77ce
}
.news-list .date2 p:last-child {
	font-size: 16px;
	background-color: #0e81dc
}
.part-one {
	padding: 50px 0 58px
}
.part-one * {
	box-sizing: border-box
}
.part-one .top {
	display: flex;
	justify-content: space-between;
	align-items: center
}
.part-one .news-list {
	margin-top: 0.3rem
}
.part-one .news-list .pos-text {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 10px 0;
	width: 100%;
	background-image: linear-gradient(180deg, transparent 0%, #000 100%)
}
.part-one .news-list .pos-text h2 {
	box-sizing: border-box;
	padding-left: 0.3rem;
	padding-right: 13px;
	font-weight: 400;
	font-size: 16px;
	color: #ffffff;
	letter-spacing: 0;
	line-height: 1.625
}
.part-one .news-list .action-img {
	display: none
}
.part-one .news-list .list-area {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px
}
.part-one .news-list li:nth-child(2n) {
	margin-left: var(--gapWidth)
}
.part-one .news-list li:nth-child(2n) {
	margin-left: 0
}
.part-one .news-list li:nth-last-child(-n+2) {
	border-bottom: unset
}
.part-one .news-list li:last-child {
	border-bottom: none
}
.part-one .news-list.hasImg li:nth-child(-n+2) {
	padding: 0;
	position: relative;
	width: calc((100% - var(--gapWidth)) / 2);
	height: 360px;
	border-bottom: unset;
	margin-left: 0;
	margin-bottom: 0
}
.part-one .news-list.hasImg li:nth-child(-n+2):hover .pos-text {
	display: block
}
.part-one .news-list.hasImg li:nth-child(-n+2) .action-img {
	display: block
}
.part-one .news-list.hasImg li:nth-child(-n+2) .list-area {
	display: none
}
.part-two {
	padding: 0.8rem 0;
	background-color: #0b7ed9
}
.part-two * {
	box-sizing: border-box
}
.part-two .content-list {
	display: flex;
	justify-content: space-between
}
.part-two li {
	flex: 1;
	position: relative;
	padding: 36px 24px;
	height: 160px;
	background-color: #e6ecf5
}
.part-two li:nth-child(n+2) {
	margin-left: var(--gapWidth)
}
.part-two li>a {
	display: block;
	width: 100%;
	height: 100%
}
.part-two li a {
	display: block;
	width: 100%;
	height: 100%
}
.part-two li:hover {
	background-color: #3ba9ff;
	box-shadow: 0 4px 6px 0 rgba(0,0,0,0.1)
}
.part-two li:hover h2, .part-two li:hover .intro, .part-two li:hover .learn-more {
	color: #fff
}
.part-two li:hover .learn-more {
	font-size: 12px
}
.part-two li:hover .learn-more::after {
	background-image: url(/_upload/tpl/06/be/1726/template1726/images/home/left-arrow-a.png);
	background-size: cover;
	transform: translateY(-40%);
	left: unset;
	right: Min(-0.35rem, -30px);
	width: Max(0.38rem, 32px)
}
.part-two li::after {
	content: "";
	position: absolute;
	bottom: 30px;
	right: 23px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain
}
.part-two li.icon01::after, .part-two li:nth-child(1)::after {
	bottom: 0.23rem;
	width: 57px;
	height: 57px;
	background-image: url(/_upload/tpl/06/be/1726/template1726/images/home/icon01.png);
	pointer-events: none
}
.part-two li.icon01:hover::after, .part-two li:nth-child(1):hover::after {
	background-image: url(/_upload/tpl/06/be/1726/template1726/images/home/icon01_a.png)
}
.part-two li.icon02::after, .part-two li:nth-child(2)::after {
	width: 40px;
	height: 40px;
	background-image: url(/_upload/tpl/06/be/1726/template1726/images/home/icon04.png)
}
.part-two li.icon02:hover::after, .part-two li:nth-child(2):hover::after {
	background-image: url(/_upload/tpl/06/be/1726/template1726/images/home/icon04_a.png)
}
.part-two li:nth-child(3) {
	margin-bottom: 12px
}
.part-two li:nth-child(3)::after {
	width: 35px;
	height: 35px;
	background-image: url(/_upload/tpl/06/be/1726/template1726/images/home/icon03.png)
}
.part-two li:nth-child(3):hover::after {
	background-image: url(/_upload/tpl/06/be/1726/template1726/images/home/icon03_a.png)
}
.part-two li:nth-child(4)::after {
	width: 35px;
	height: 35px;
	background-image: url(/_upload/tpl/06/be/1726/template1726/images/home/icon02.png)
}
.part-two li:nth-child(4):hover::after {
	background-image: url(/_upload/tpl/06/be/1726/template1726/images/home/icon02_a.png)
}
.part-two h2 {
	margin-bottom: 10px;
	font-weight: 600;
	font-size: 20px;
	color: #0a143a;
	letter-spacing: 0;
	line-height: 1.4
}
.part-two .intro {
	font-weight: 400;
	font-size: 16px;
	color: #404040;
	letter-spacing: 0;
	line-height: 1.6;
	height: 128px;
	-webkit-line-clamp: 5;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
	overflow: hidden
}
.part-two .learn-more {
	position: absolute;
	bottom: 36px;
	font-size: 0
}
.part-two .learn-more::after {
	right: -23px
}
.part-three {
	padding: 0.8rem 0;
	background-color: #f8f8f8
}
.part-three * {
	box-sizing: border-box
}
.part-three .top {
	display: flex;
	justify-content: space-between;
	align-items: center
}
.part-three .styling-title {
	margin-bottom: 0.26rem
}
.part-three .middle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-weight: 400;
	font-size: 16px;
	color: #909499;
	letter-spacing: 0;
	line-height: 1.625
}
.part-three .middle ul {
	display: flex
}
.part-three .middle li {
	position: relative;
	cursor: pointer
}
.part-three .middle li.active, .part-three .middle li:hover {
	font-weight: 500;
	color: #0b7ed9
}
.part-three .middle li.active::after, .part-three .middle li:hover::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -15px;
	width: 100%;
	height: 2px;
	background-color: #0b7ed9
}
.part-three .middle li:nth-child(n+2) {
	margin-left: var(--gapWidth)
}
.part-three .news-list {
	margin-top: 15px;
	padding-top: 8px;
	border-top: 1px solid #e1e6eb;
	display: none
}
.part-three .news-list.active {
	display: flex
}
.part-three .view-more {
	display: none
}
.part-three .view-more.active {
	display: block
}
.part-four {
	padding: 65px 0;
	background-color: #e1e6eb
}
.part-four .page-content {
	display: flex;
	justify-content: space-between
}
.part-four .pos-text {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 5;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	text-align: center;
	transition: all 0.6s ease-in-out
}
.part-four .icon {
	margin-bottom: 0.15rem;
	width: Max(0.7rem, 60px);
	height: Max(0.7rem, 60px);
	background: url(/_upload/tpl/06/be/1726/template1726/images/home/play.png) no-repeat center/contain
}
.part-four .title-cn {
	margin-bottom: 6px;
	font-weight: 600;
	font-size: 24px;
	color: #ffffff;
	letter-spacing: 1.2px;
	text-align: center;
	line-height: 1.25
}
.part-four .title-en {
	width: 90%;
	opacity: 0.6;
	font-family: Montserrat;
	font-weight: 400;
	font-size: 14px;
	color: #ffffff;
	letter-spacing: 4.67px;
	line-height: 1.28;
	text-transform: uppercase
}
.part-four .mask-part {
	position: relative;
	display: block;
	width: 100%;
	height: 100%
}
.part-four .mask-part:hover::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.3)
}
.part-four .left {
	position: relative;
	flex: 1
}
.part-four .right {
	flex: 1;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between
}
.part-four .right .title-cn {
	font-weight: 600;
	font-size: 20px;
	letter-spacing: 1px;
	line-height: 1.3
}
.part-four .right .title-en {
	font-size: 12px
}
.part-four .right li {
	width: calc((100% - var(--gapWidth)) / 3);
	height: 180px
}
.part-four .right li:nth-child(n+4) {
	margin-top: 25px
}
.part-four .right li:nth-child(2n) {
	
}
@media screen and (max-width: 1280px) {
.banner {
	height: 400px
}
}
@media screen and (max-width: 1200px) {
.main {
--gapWidth:20px
}
}
@media screen and (max-width: 807px) {
.banner {
	height: 300px;
	max-height: unset
}
.banner .swiper-container-horizontal>.swiper-pagination-bullets {
	bottom: 15px
}
.banner .swiper-pagination-bullet {
	width: 30px
}
.styling-title .title-en {
	padding-left: 35px;
	margin-bottom: 8px
}
.styling-title .title-en::before {
	width: 25px
}
.styling-title .title-cn {
	font-size: 20px
}
.view-more {
	padding-right: 20px;
	font-size: 12px
}
.view-more::after {
	width: 12px;
	height: 12px
}
.learn-more::after {
	width: 16px;
	height: 18px
}
.news-list {
	display: flex
}
.news-list li {
	gap: 15px;
	padding: 12px 0
}
.news-list .date {
	font-size: 12px;
	white-space: nowrap
}
.part-one {
	padding: 50px 0
}
.part-one .middle {
	margin-top: 20px;
	margin-bottom: 20px
}
.part-one .middle li {
	width: 33%;
	height: Max(1rem, 80px)
}
.part-one .middle li:nth-child(n+2) {
	margin-left: 1%
}
.part-one .middle .pos-text {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 10px 0;
	display: none;
	width: 100%;
	background-image: linear-gradient(180deg, transparent 0%, #000 100%)
}
.part-one .middle h2 {
	padding-left: 10px;
	padding-right: 10px;
	font-size: 12px
}
.part-one .news-list {
	margin-top: 20px
}
.part-one .news-list .pos-text {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 10px 0;
	width: 100%;
	background-image: linear-gradient(180deg, transparent 0%, #000 100%)
}
.part-one .news-list .pos-text h2 {
	padding-left: 10px;
	padding-right: 10px;
	font-size: 12px
}
.part-one .news-list .list-area {
	gap: 10px
}
.part-one .news-list li:nth-child(2n+1) {
	margin-left: 3.2%
}
.part-one .news-list li:nth-child(2n) {
	margin-left: 0
}
.part-one .news-list li:nth-child(-n+2) {
	height: 150px;
	margin-bottom: 20px;
	margin-left: 0
}
.part-two {
	padding: 50px 0
}
.part-two .content-list {
	gap: 10px
}
.part-two li {
	padding: 20px;
	width: 32.1%;
	height: Max(1.5rem, 200px)
}
.part-two li:nth-child(1):hover .learn-more::after, .part-two li:nth-child(2):hover .learn-more::after {
	right: -30px;
	width: 32px
}
.part-two li::after {
	bottom: 10px;
	right: 12px
}
.part-two li.icon01::after, .part-two li:nth-child(1)::after {
	right: 0;
	bottom: 0;
	width: 55px;
	height: 55px
}
.part-two li.icon02::after, .part-two li:nth-child(2)::after {
	width: 45px;
	height: 45px
}
.part-two li:nth-child(3) li {
	padding: 20px
}
.part-two li:nth-child(3) li:nth-child(1)::after {
	right: 20px;
	bottom: 20px;
	width: 30px;
	height: 30px
}
.part-two li:nth-child(3) li:nth-child(2)::after {
	right: 20px;
	bottom: 20px;
	width: 34px;
	height: 34px
}
.part-two li:nth-child(3) li .learn-more {
	bottom: 20px
}
.part-two h2 {
	margin-bottom: 15px;
	font-size: 18px
}
.part-two .intro {
	font-size: 12px;
	-webkit-line-clamp: 5
}
.part-two .learn-more {
	bottom: 30px
}
.part-two .learn-more::after {
	right: -28px
}
.part-three {
	padding: 50px 0
}
.part-three .styling-title {
	margin-bottom: 20px
}
.part-three .middle {
	position: relative;
	flex-direction: column-reverse;
	align-items: flex-start;
	font-size: 14px
}
.part-three .middle li:nth-child(n+2) {
	margin-left: 10px
}
.part-three .right {
	position: absolute;
	right: 0;
	top: -40px
}
.part-four {
	padding: 50px 0
}
.part-four .icon {
	margin-bottom: 15px;
	width: 50px;
	height: 50px
}
.part-four .title-cn {
	font-size: 14px
}
.part-four .title-en {
	font-size: 12px
}
.part-four .right .title-cn {
	font-size: 14px
}
.part-four .right li {
	height: 140px
}
}
@media screen and (max-width: 600px) {
.news-list {
	flex-direction: column
}
.news-list ul {
	width: 100%
}
.news-list li {
	width: 100%
}
.news-list li:nth-last-child(-n+2) {
	border-bottom: 1px dashed #C0C8CC
}
.news-list li:nth-child(2n) {
	margin-left: 0
}
.news-list li:last-child {
	border-bottom: unset
}
.part-one .news-list li:nth-child(2n+1) {
	margin-left: 0
}
.part-two .content-list {
	flex-wrap: wrap
}
.part-two li {
	width: 100%;
	height: Max(1.8rem, 230px)
}
.part-three .middle {
	font-size: 12px
}
.part-four .page-content {
	display: block;
	height: unset
}
.part-four .left {
	height: Max(1.8rem, 150px)
}
.part-four .right {
	margin-top: 10px;
	margin-left: 0
}
}
@media screen and (max-width: 400px) {
.part-one .middle {
	display: block
}
.part-one .middle li {
	width: 100%;
	height: Max(2rem, 120px)
}
.part-one .middle li:nth-child(n+2) {
	margin-left: 0;
	margin-top: 10px
}
.part-one .middle .pos-text {
	display: block
}
.part-one .news-list li:nth-child(2n+1) {
	margin-left: 0
}
.part-one .news-list li:nth-child(-n+2) {
	width: 100%;
	height: unset;
	margin-bottom: 10px
}
.part-one .news-list li:nth-child(2) {
	margin-left: 0
}
.part-one .news-list li:nth-child(3) {
	margin-left: 0
}
.part-one .news-list li:nth-child(n) {
	border-bottom: 1px dashed #C0C8CC
}
.part-one .news-list li:last-child {
	border-bottom: none
}
.news-list h2 {
	font-size: 14px
}
.news-list .info h2, .news-list .info h3 {
	font-size: 14px
}
.part-two .content-list {
	display: block
}
.part-two .content-list>li {
	margin-top: 12px
}
.part-two li:nth-child(3) li:nth-child(1) {
	height: Max(1.8rem, 230px)
}
.part-two li:nth-child(3) li:nth-child(1) {
	height: Max(1.8rem, 230px)
}
.part-two li:nth-child(n+2) {
	margin-left: 0
}
}