@media only screen and (min-width: 1024px){
	.xiao-fangan{
			display: block;
		}
}


@font-face {
	font-family: 'cui-icon';
	src: url(../fonts/homepage-cui-icon.eot);
	src: url(../fonts/homepage-cui-icon.eot) format('embedded-opentype'), url(../fonts/homepage-cui-icon.woff2) format('woff2'), url(../fonts/homepage-cui-icon.woff) format('woff'), url(../fonts/homepage-cui-icon.ttf) format('truetype'), url(../fonts/homepage-cui-icon.svg) format('svg');
	font-weight: normal;
	font-style: normal
}

.cui-icon {
	font-family: 'cui-icon' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	display: inline-block;
	vertical-align: middle;
	font-size: 16px
}

.cui-icon-add:before {
	content: "\EA01"
}

.cui-icon-cancel:before {
	content: "\EA02"
}

.cui-icon-confirm:before {
	content: "\EA03"
}

.cui-icon-date:before {
	content: "\EA04"
}

.cui-icon-download:before {
	content: "\EA05"
}

.cui-icon-edit:before {
	content: "\EA06"
}

.cui-icon-heart:before {
	content: "\EA07"
}

.cui-icon-help:before {
	content: "\EA08"
}

.cui-icon-home:before {
	content: "\EA09"
}

.cui-icon-infomation:before {
	content: "\EA0A"
}

.cui-icon-menu:before {
	content: "\EA0B"
}

.cui-icon-minus:before {
	content: "\EA0C"
}

.cui-icon-purchase:before {
	content: "\EA0D"
}

.cui-icon-refresh:before {
	content: "\EA0E"
}

.cui-icon-search:before {
	content: "\EA0F"
}

.cui-icon-star-outline:before {
	content: "\EA10"
}

.cui-icon-star:before {
	content: "\EA11"
}

.cui-icon-visible:before {
	content: "\EA12"
}

.cui-icon-double-down:before {
	content: "\EA13"
}

.cui-icon-double-left:before {
	content: "\EA14"
}

.cui-icon-double-right:before {
	content: "\EA15"
}

.cui-icon-double-up:before {
	content: "\EA16"
}

.cui-icon-down:before {
	content: "\EA17"
}

.cui-icon-left:before {
	content: "\EA18"
}

.cui-icon-more:before {
	content: "\EA19"
}

.cui-icon-play:before {
	content: "\EA1A"
}

.cui-icon-right:before {
	content: "\EA1B"
}

.cui-icon-triangle-down:before {
	content: "\EA1C"
}

.cui-icon-up:before {
	content: "\EA1D"
}

.carousel-container[data-effect="cover"] .carousel-wrapper {
	position: relative;
	width: 100%;
	height: 100%
}

.carousel-container[data-effect="cover"] .carousel-slide {
	position: absolute;
	z-index: 0;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden
}

.carousel-container[data-effect="cover"] .carousel-slide.carousel-slide-current~.carousel-slide {
	left: 100%
}

.carousel-container[data-effect="cover"] .carousel-slide.to-top {
	z-index: 1
}

.cui-btn {
	display: inline-block;
	height: 40px;
	padding: 0 30px;
	border: solid 1px transparent;
	border-radius: 2px;
	background: transparent;
	font-weight: 400;
	font-size: 14px;
	line-height: 38px;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	user-select: none;
	transition: .2s
}

.cui-btn-normal {
	height: 40px;
	padding-left: 30px;
	padding-right: 30px;
	font-size: 14px;
	line-height: 38px
}

.cui-btn-small {
	height: 32px;
	padding-left: 20px;
	padding-right: 20px;
	font-size: 12px;
	line-height: 30px
}

.cui-btn-large {
	height: 48px;
	padding-left: 40px;
	padding-right: 40px;
	font-size: 18px;
	line-height: 46px
}

.cui-btn-primary {
	border-color: #f66f6a;
	background-color: #f66f6a;
	color: #fff
}

.cui-btn-primary:hover,
.cui-btn-primary.hover {
	box-shadow: 0 rgba(246, 111, 106, 0.5)
}

.cui-btn-dark {
	border-color: #252b3a;
	background-color: #252b3a;
	color: #fff
}

.cui-btn-outline-primary {
	border: solid 1px #f66f6a;
	color: #f66f6a
}

.cui-btn-outline-primary:hover,
.cui-btn-outline-primary .hover {
	border-color: #f66f6a;
	background-color: #f66f6a;
	color: #fff
}

.cui-btn-outline-dark {
	border: solid 1px #252b3a;
	color: #252b3a
}

.cui-btn-outline-dark:hover,
.cui-btn-outline-dark .hover {
	border: solid 1px #f66f6a;
	color: #f66f6a
}

.cui-btn-outline-light {
	border: solid 1px #fff;
	color: #fff
}

.cui-btn-outline-light:hover,
.cui-btn-outline-light .hover {
	border-color: #f66f6a;
	background-color: #f66f6a;
	color: #fff
}

.cui-btn.disabled,
.cui-btn[disabled] {
	cursor: default;
	background-color: #f7f7f7;
	border-color: #ddd;
	color: #a0a2a8
}

.cui-btn.disabled:hover,
.cui-btn[disabled]:hover {
	box-shadow: none
}

.cui-select {
	display: inline-block;
	position: relative;
	width: 220px;
	height: 32px;
	border: solid 1px #ddd;
	border-radius: 2px;
	background: white;
	cursor: pointer
}

.cui-select select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	display: block;
	border: 0;
	outline: 0;
	width: 100%;
	height: 100%;
	padding-left: 10px;
	padding-right: 0;
	background: transparent;
	font-size: 14px;
	color: #252b3a;
	line-height: 30px;
	cursor: pointer
}

.cui-select select::-ms-expand {
	display: none
}

.cui-select i {
	position: absolute;
	right: 0;
	top: 0;
	width: 32px;
	height: 30px;
	background: white;
	line-height: 30px;
	text-align: center;
	cursor: pointer
}

.cui-select i:before {
	content: "";
	display: inline-block;
	vertical-align: middle;
	border: solid 4px transparent;
	border-bottom: 0;
	border-top: solid 5px #666a75;
	margin-bottom: 1px
}

.cui-select:after {
	content: "";
	position: absolute;
	top: 5px;
	right: 32px;
	bottom: 5px;
	border-right: solid 1px #ddd
}

.cui-select-trigger {
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0, 0, 0, 0)
}

.cui-select-option-list {
	display: none
}

.cui-select.open .cui-select-option-list {
	display: block;
	position: absolute;
	z-index: 9;
	top: 100%;
	left: -1px;
	right: -1px;
	max-height: 152px;
	overflow: auto;
	border: solid 1px #ddd;
	border-radius: 2px;
	margin-top: 5px
}

.cui-select.open .cui-select-option-list li {
	padding: 4px 9px;
	background: white;
	font-size: 14px;
	line-height: 22px;
	color: #666a75
}

.cui-select.open .cui-select-option-list li:hover {
	background: #f7f7f7;
	color: #f66f6a
}

.cui-select.open .cui-select-option-list li.selected {
	background: #f66f6a;
	color: #fff
}

.popwin-ad {
	display: none;
	position: fixed;
	z-index: 199;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	animation: dialog-fadein .35s ease
}

.popwin-ad .popwin-ad-bg {
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.8)
}

.popwin-ad .popwin-ad-window {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 1180px;
	height: 650px;
	z-index: 2;
	margin-top: -20px
}

.popwin-ad .fade-in {
	transition: opacity 1s linear
}

.popwin-ad .zoom-in {
	transition: all 3s linear
}

.popwin-ad .popwin-ad-body {
	text-align: center;
	width: 100%;
	height: 100%
}

.popwin-ad .popwin-ad-body .motion {
	width: 100%;
	height: 100%;
	position: absolute
}

.popwin-ad .popwin-ad-body .one {
	background: url(../images/homepage-ad-bg.png) no-repeat;
	background-size: contain;
	transform: scale(0)
}

.popwin-ad .popwin-ad-body .two {
	background: url(../images/homepage-ad-text.png) no-repeat;
	background-size: contain;
	opacity: 0
}

.popwin-ad .popwin-ad-body .cui-btn {
	bottom: -20px;
	left: 50%;
	position: absolute;
	opacity: 0;
	transform: translateX(-50%);
	display: none
}

.popwin-ad .popwin-ad-body .cui-btn-large {
	display: block
}

.popwin-ad .popwin-ad-bottom {
	text-align: center;
	padding-top: 20px
}

.popwin-ad .popwin-ad-bottom a {
	opacity: 0;
	font-size: 14px;
	text-decoration: underline;
	cursor: pointer;
	color: #fff;
	left: 50%;
	position: absolute;
	transform: translateX(-50%)
}

.popwin-ad .popwin-ad-bottom a:hover {
	color: #f66f6a
}

.popwin-ad .active .one {
	transform: scale(1.5)
}

.popwin-ad .active .hide_v2 {
	opacity: 0;
	transform: scale(3)
}

.popwin-ad .active .show_v2 {
	transform: scale(1.05);
	transition: none
}

.popwin-ad .active .show_v3 {
	transform: scale(1);
	opacity: 1;
	transition: all 1s linear
}

.popwin-ad .active .two {
	opacity: 1
}

.popwin-ad .active .cui-btn {
	opacity: 1
}

.popwin-ad .active .popwin-ad-bottom a {
	opacity: 1
}

.popwin-ad .popwin-ad-header .close {
	width: 50px;
	height: 50px;
	background: url(../images/homepage-close.png);
	background-size: contain;
	position: absolute;
	right: 0;
	z-index: 2;
	cursor: pointer
}

@media(max-width:1600px) {
	.popwin-ad .popwin-ad-window {
		width: 826px;
		height: 455px
	}

	.popwin-ad .popwin-ad-window .cui-btn {
		display: block
	}

	.popwin-ad .popwin-ad-window .cui-btn-large {
		display: none
	}
}

@media(max-width:1280px) {
	.popwin-ad .popwin-ad-window {
		width: 826px;
		height: 455px
	}
}

@media(max-width:1023px) {
	.popwin-ad .popwin-ad-window .one .two {
		display: none
	}

	.popwin-ad .popwin-ad-window .one-mb {
		background: url(../images/homepage-ad-mb.png) no-repeat center;
		width: 100%;
		height: 100%;
		position: absolute;
		background-size: contain
	}

	.popwin-ad .popwin-ad-window .cui-btn {
		opacity: 1
	}

	.popwin-ad .popwin-ad-window .popwin-ad-bottom a {
		opacity: 1
	}

	.popwin-ad .popwin-ad-window .close {
		width: 30px;
		height: 30px
	}

	.popwin-ad .popwin-ad-window {
		width: 708px;
		height: 390px
	}
}

@media(max-width:768px) {
	.popwin-ad .popwin-ad-window {
		width: 100%
	}

	.popwin-ad .popwin-ad-header .close {
		right: 0;
		top: -60px
	}

	.popwin-ad .close.mb {
		width: 30px;
		height: 30px;
		margin: 20px;
		display: block;
		position: absolute;
		background: url(../images/homepage-close.png);
		background-size: contain;
		right: 0
	}

	.popwin-ad .close {
		display: none
	}
}

.section {
	box-sizing: border-box
}

.section-wrapper {
	max-width: 1240px;
	padding-left: 30px;
	padding-right: 30px;
	margin-left: auto;
	margin-right: auto
}

@media(max-width:1340px) {
	

	
	.section-wrapper {
		max-width: 1290px;
		padding-right: 80px
	}
}

@media(max-width:1023px) {
	
	
	
	
	.section-wrapper {
		padding-left: 15px;
		padding-right: 15px
	}
}

.section-title {
	text-align: center;
	padding-top: 60px;
	padding-bottom: 52px
}

.section-title h1,
.section-title .h1 {
	position: relative;
	font-size: 36px;
	line-height: 50px;
	letter-spacing: 4px
}

.section-title h2:not(.h1),
.section-title .h2 {
	margin-top: 10px;
	font-size: 18px;
	line-height: 22px;
	letter-spacing: 2px
}

.section-title[data-theme="light"] h1,
.section-title[data-theme="light"] .h1 {
	color: #fff
}

.section-title[data-theme="light"] h2:not(.h1),
.section-title[data-theme="light"] .h2 {
	color: rgba(255, 255, 255, 0.7)
}

.section-title[data-theme="dark"] h1,
.section-title[data-theme="dark"] .h1 {
	color: #252b3a
}

.section-title[data-theme="dark"] h2:not(.h1),
.section-title[data-theme="dark"] .h2 {
	color: #666a75
}

@media(max-width:1366px) {
	.section-title {
		padding-top: 50px;
		padding-bottom: 30px
	}

	.section-title h1,
	.section-title .h1 {
		font-size: 32px;
		line-height: 40px
	}

	.section-title h2:not(.h1),
	.section-title .h2 {
		font-size: 16px;
		line-height: 20px
	}

	.section-title[data-theme="light"] {
		color: #fff
	}

	.section-title[data-theme="dark"] {
		color: #252b3a
	}
}

@media(max-width:1023px) {
	.section-title {
		padding-top: 30px;
		padding-bottom: 20px
	}

	.section-title h1,
	.section-title .h1 {
		font-size: 20px;
		line-height: 26px;
		letter-spacing: 0
	}

	.section-title h2:not(.h1),
	.section-title .h2 {
		margin-top: 10px;
		font-size: 12px;
		line-height: 14px;
		letter-spacing: 0
	}
}

#content {
	background-color: transparent
}

@media(min-width:1024px) {}

.section-bottom {
	padding-top: 40px;
	padding-bottom: 50px
}

@media(max-width:1366px) {
	padding-top: 30px;
	padding-bottom: 40px
}

@media(max-width:1023px) {
	.section-bottom {
		padding-top: 20px;
		padding-bottom: 30px
	}
}

.section-more-wrap {
	text-align: center
}

.section-more-wrap[data-theme="light"] a {
	color: rgba(255, 255, 255, 0.7)
}

.section-more-wrap a {
	display: inline-block;
	font-size: 16px;
	line-height: 24px;
	color: #666a75;
	cursor: pointer;
	user-select: none;
	transition: .2s
}

.section-more-wrap a .cui-icon {
	margin-top: -2px;
	margin-left: 10px;
	transition: transform .2s
}

.section-more-wrap a:hover {
	color: #f66f6a
}

.section-more-wrap a:hover i {
	-ms-transform: translate3d(5px, 0, 0);
	transform: translate3d(5px, 0, 0)
}

@media(max-width:1023px) {
	.section-more-wrap a {
		font-size: 12px;
		line-height: 16px
	}
}

@keyframes tabContent-fadeIn {
	0 {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

.float-bar-ad {
	display: none !important
}

.float-bar-nav .sub-nav-layer {
	top: auto;
	bottom: 0
}

.section-nav {
	opacity: 0;
	visibility: hidden;
	position: fixed;
	z-index: 20;
	right: 26px;
	top: 50%;
	padding-left: 4px;
	padding-right: 4px;
	-ms-transform: translate(0, -50%);
	transform: translate(0, -50%)
}

.section-nav.show {
	opacity: 1;
	visibility: visible
}

.section-nav-switch {
	display: block;
	position: relative;
	width: 16px;
	height: 16px;
	margin: 8px 0;
	cursor: pointer
}

.section-nav-bg {
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 8px;
	height: 8px;
	margin: auto;
	border-radius: 50%;
	transition: .2s
}

.section-nav-active-bg {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	border: solid 1px transparent;
	border-radius: 50%;
	-ms-transform: scale(0);
	transform: scale(0);
	transition: .2s
}

.section-nav-label {
	position: absolute;
	top: -1px;
	right: -1px;
	height: 18px;
	padding-left: 9px;
	padding-right: 9px;
	border-radius: 9px;
	margin-right: 9px;
	background: #f66f6a;
	font-size: 0;
	overflow: hidden;
	-ms-transform: scale(0);
	transform: scale(0);
	-ms-transform-origin: right center;
	transform-origin: right center;
	-webkit-transition: .2s;
	transition: .2s
}

.section-nav-label span {
	display: inline-block;
	padding-right: 9px;
	font-size: 12px;
	line-height: 18px;
	color: #fff;
	text-align: center;
	white-space: nowrap;
	-ms-transform: scale(0);
	transform: scale(0);
	-ms-transform-origin: right center;
	transform-origin: right center;
	-webkit-transition: .2s;
	transition: .2s
}

.section-nav-switch:not(.hover) .section-nav-label {
	width: 18px !important
}

.section-nav-switch.hover .section-nav-bg {
	background-color: white !important
}

.section-nav-switch.hover .section-nav-label {
	margin-right: 0;
	-ms-transform: scale(1);
	transform: scale(1)
}

.section-nav-switch.hover .section-nav-label span {
	-ms-transform: scale(1);
	transform: scale(1)
}

.section-nav-switch.active .section-nav-active-bg {
	-ms-transform: scale(1);
	transform: scale(1)
}

.section-nav[data-theme] .section-nav-active-bg {
	border-color: #f66f6a
}

.section-nav[data-theme] .section-nav-switch.active .section-nav-bg {
	background-color: #f66f6a
}

.section-nav[data-theme="light"] .section-nav-bg {
	background-color: #fff
}

.section-nav[data-theme="dark"] .section-nav-bg {
	background-color: rgba(0, 0, 0, 0.8)
}

.section-nav[data-theme="grey"] .section-nav-bg {
	background-color: #a0a2a8
}

.section-nav[data-theme="hide"] {
	display: none
}

@media(max-width:1023px) {
	.section-nav {
		display: none
	}
}

.banner-tpl {
	padding-top: 100px;
	min-height: 600px
}

.banner-scale-up {
	animation: scale-up 4s ease-in forwards
}

@keyframes scale-up {
	0 {
		transform: scale3d(1, 1, 1)
	}

	100% {
		transform: scale3d(1.05, 1.05, 1) rotate(0.02deg)
	}
}

.banner-fadeIn {
	animation: fadeIn 1s forwards
}

@keyframes fadeIn {
	0 {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

.banner-fadeOut {
	animation: fadeOut 1s forwards
}

@keyframes fadeOut {
	0 {
		opacity: 1
	}

	100% {
		opacity: 0
	}
}

[data-enter-transition="banner-trans-fadeInUp"] {
	opacity: 0;
	transform: translate3d(0, 100px, 0)
}

.banner-trans-fadeInUp {
	opacity: 1;
	transition: 1s;
	transform: translate3d(0, 0, 0)
}

.banner-trans-fadeOutUp {
	transition: 1s;
	opacity: 0;
	transform: translate3d(0, -100px, 0)
}

@media(max-width:1023px) {
	.banner-tpl {
		display: none
	}
}

@media(min-width:1024px) {
	.banner {
		position: relative;
		z-index: 0;
		width: 100%;
		min-height: 600px;
		background-color: #000e1d
	}

	.banner .carousel-container {
		width: 100%
	}

	.banner .carousel-wrapper {
		position: relative;
		width: 100%;
		height: 980px
	}

	.banner .carousel-slide {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		visibility: hidden;
		opacity: 0
	}

	.banner .carousel-slide-current {
		visibility: visible;
		opacity: 1
	}

	.banner .carousel-slide-current a {
		z-index: 2
	}

	.banner .carousel-slide-active {
		z-index: 1;
		opacity: 1;
		visibility: visible
	}

	.carousel-indicator-wrapper {
		position: absolute;
		z-index: 2;
		bottom: 228px;
		left: 50%;
		-ms-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
		font-size: 0
	}

	.carousel-indicator {
		display: inline-block;
		width: 32px;
		height: 16px;
		margin: 0 7px;
		line-height: 16px;
		text-align: left;
		cursor: pointer
	}

	.carousel-indicator div {
		display: inline-block;
		vertical-align: middle;
		width: 100%;
		height: 4px;
		background-color: rgba(255, 255, 255, 0.4);
		transition: background-color .2s
	}

	.carousel-indicator span {
		display: block;
		background: #f66f6a;
		width: 0;
		height: 100%
	}

	.carousel-indicator-active div {
		border-left: solid 2px #f66f6a
	}

	.carousel-indicator-wrapper[data-theme="light"] .carousel-indicator div {
		background-color: rgba(255, 255, 255, 0.4)
	}

	.carousel-indicator-wrapper[data-theme="light"] .carousel-indicator:hover div {
		background-color: rgba(255, 255, 255, 0.8)
	}

	.carousel-indicator-wrapper[data-theme="dark"] .carousel-indicator div {
		background-color: rgba(160, 162, 168, 0.4)
	}

	.carousel-indicator-wrapper[data-theme="dark"] .carousel-indicator:hover div {
		background-color: rgba(160, 162, 168, 0.8)
	}
}

@media(min-width:1024px) and (max-height:899px),
(min-width:1024px) and (max-width:1599px) {
	.carousel-indicator-wrapper {
		bottom: 168px
	}
}

@media(min-width:1024px) and (max-height:649px),
(min-width:1024px) and (max-width:1279px) {
	.carousel-indicator-wrapper {
		bottom: 134px
	}
}

@keyframes indicatorProgress {
	0 {
		width: 0
	}

	100% {
		width: 100%
	}
}

@media(max-width:1023px) {
	.banner {
		position: relative
	}

	.carousel-container {
		position: relative
	}

	.carousel-slide img {
		display: block;
		width: 100%
	}

	.swiper-container-horizontal .carousel-indicator-wrapper {
		position: absolute;
		z-index: 2;
		bottom: 107px;
		font-size: 0;
		text-align: center
	}

	.swiper-container-horizontal .carousel-indicator-wrapper .swiper-pagination-bullet {
		display: inline-block;
		width: 20px;
		height: 20px;
		margin: 0 4px;
		background: transparent;
		opacity: 1;
		line-height: 20px;
		cursor: pointer
	}

	.swiper-container-horizontal .carousel-indicator-wrapper .swiper-pagination-bullet:before {
		content: "";
		display: block;
		height: 4px;
		margin-top: 8px;
		-webkit-transition: .8s;
		transition: .8s
	}

	.swiper-container-horizontal .carousel-indicator-wrapper .swiper-pagination-bullet-active:before {
		background-color: #f66f6a !important
	}

	.swiper-container-horizontal .carousel-indicator-wrapper[data-theme="light"] .swiper-pagination-bullet:before {
		background: rgba(255, 255, 255, 0.4)
	}

	.swiper-container-horizontal .carousel-indicator-wrapper[data-theme="dark"] .swiper-pagination-bullet:before {
		background: rgba(0, 0, 0, 0.4)
	}
}

.banner-tpl1 {
	height: 100%;
	box-sizing: border-box
}

.banner-tpl1-a {
	display: block;
	position: relative;
	height: 100%
}

.banner-tpl1-a[href="#"],
.banner-tpl1-a[href="javascript:"],
.banner-tpl1-a[href="javascript:void(0)"] {
	cursor: default
}

.banner-tpl1-bg {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden
}

.banner-tpl1-bg .banner-tpl1-bg-inner {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: #252b3a;
	background-position: center;
	background-size: cover
}

.banner-tpl1-bg video {
	position: absolute;
	top: -50%;
	right: -50%;
	bottom: -50%;
	left: -50%;
	margin: auto;
	min-width: 100%;
	min-height: 100%;
	background: transparent
}

.banner-tpl1-bg video[data-cut="height"] {
	width: 100%
}

.banner-tpl1-bg video[data-cut="width"] {
	height: 100%
}

[data-enter-animation="animation-lightning"] {
	opacity: .3
}

.animation-lightning {
	animation: lightning 5s ease infinite
}

@keyframes lightning {
	0 {
		opacity: .3
	}

	5% {
		opacity: .3
	}

	50% {
		opacity: 1
	}

	70% {
		opacity: 1
	}

	100% {
		opacity: .3
	}
}

.banner-tpl1-main {
	position: relative;
	padding-left: 9.375%;
	padding-right: 9.375%;
	margin: 0 auto;
	height: 100%
}

.banner-tpl1-img {
	position: absolute;
	top: calc((100% - 238px) / 2);
	right: 6.25%;
	-ms-transform: translate(0, -50%);
	transform: translate(0, -50%)
}

.banner-tpl1-img img {
	float: right
}

.banner-tpl1-text {
	position: absolute;
	top: calc((100% - 238px) / 2);
	-ms-transform: translate(0, -50%);
	transform: translate(0, -50%)
}

.banner-tpl1-text em {
	font-style: normal;
	color: #f66f6a
}

.banner-tpl1-text .h2 {
	margin-bottom: 20px;
	font-size: 26px;
	line-height: 32px;
	color: #fff
}

.banner-tpl1-text .h1 {
	font-size: 60px;
	line-height: 76px;
	color: #fff
}

.banner-tpl1-text p {
	margin-top: 20px;
	font-size: 24px;
	line-height: 30px;
	color: #fff
}

.banner-tpl1-text .banner-tpl1-btn-box {
	margin-top: 60px
}

.carousel-slide[data-theme="light"] .banner-tpl1-text .h2 {
	color: #666a75
}

.carousel-slide[data-theme="light"] .banner-tpl1-text .h1 {
	color: #252b3a
}

.carousel-slide[data-theme="light"] .banner-tpl1-text p {
	color: #666a75
}

@media(max-height:899px),
(max-width:1599px) {
	.banner-tpl1-main {
		padding-left: 9.25%;
		padding-right: 9.25%
	}

	.banner-tpl1-img {
		top: calc((100% - 178px) / 2);
		right: 7%
	}

	.banner-tpl1-text {
		top: calc((100% - 178px) / 2)
	}

	.banner-tpl1-text .h2 {
		margin-bottom: 14px;
		font-size: 20px;
		line-height: 26px
	}

	.banner-tpl1-text .h1 {
		font-size: 46px;
		line-height: 58px
	}

	.banner-tpl1-text p {
		margin-top: 14px;
		font-size: 18px;
		line-height: 22px
	}

	.banner-tpl1-text .banner-tpl1-btn-box {
		margin-top: 50px
	}

	.banner-tpl1-text .banner-tpl1-btn-box .cui-btn {
		height: 40px;
		padding-left: 30px;
		padding-right: 30px;
		font-size: 14px;
		line-height: 38px
	}

	.banner-tpl1-text img {
		width: 70%
	}

	.banner-tpl1-img img {
		width: 77%
	}
}

@media(max-height:649px),
(max-width:1279px) {
	.banner-tpl1-main {
		padding-left: 8%;
		padding-right: 8%
	}

	.banner-tpl1-img {
		top: calc((100% - 144px) / 2);
		right: 3.8%
	}

	.banner-tpl1-text {
		top: calc((100% - 144px) / 2)
	}

	.banner-tpl1-text .h2 {
		margin-bottom: 10px;
		font-size: 16px;
		line-height: 20px
	}

	.banner-tpl1-text .h1 {
		font-size: 36px;
		line-height: 46px
	}

	.banner-tpl1-text p {
		margin-top: 10px;
		font-size: 16px;
		line-height: 20px
	}

	.banner-tpl1-text .banner-tpl1-btn-box {
		margin-top: 20px
	}

	.banner-tpl1-text-img img {
		width: 55.14%
	}

	.banner-tpl1-img img {
		width: 61.6%
	}
}

@media(max-width:1559px) {
	.banner-tpl1-img img {
		right: 0
	}
}

.banner-tpl2 {
	height: 100%;
	box-sizing: border-box
}

.banner-tpl2-a {
	display: block;
	position: relative;
	height: 100%
}

.banner-tpl2-bg {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden
}

.banner-tpl2-bg .banner-tpl2-bg-inner {
	width: 100%;
	height: 100%;
	background-color: #fff;
	background-position: center;
	background-size: cover
}

.banner-tpl2-bg video {
	position: absolute;
	top: -50%;
	right: -50%;
	bottom: -50%;
	left: -50%;
	margin: auto;
	min-width: 100%;
	min-height: 100%;
	object-position: center;
	object-fit: cover;
	background: transparent
}

.banner-tpl2-text {
	position: absolute;
	top: 34%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%)
}

.events {
	position: absolute;
	z-index: 2;
	left: 0;
	right: 0;
	bottom: 0;
	padding-bottom: 74px
}

.events-wrapper {
	margin-left: 9%;
	margin-right: 9%;
}

.events-wrapper>ul {
	padding-left: 30px;
	padding-right: 30px
}

.events-wrapper>ul:before,
.events-wrapper>ul:after {
	content: " ";
	display: table
}

.events-wrapper>ul:after {
	clear: both
}

.events-wrapper>ul>li {
	float: left;
	position: relative;
	width: 25%
}

.events-wrapper>ul>li+li:before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 50%;
	height: 60px;
	border: solid 1px;
	margin-top: -30px;
	opacity: .4
}

.events-wrapper a {
	display: block;
	padding: 30px 10px;
	text-align: center;
	cursor: inherit;
}

.events-wrapper h2 {
	font-size: 24px;
	line-height: 32px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	letter-spacing: 3px;
	transition: .2s
}

.events-wrapper p {
	margin-top: 4px;
	font-size: 14px;
	line-height: 24px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	letter-spacing: 3px;
	transition: .2s
}

.events[data-theme="light"] li {
	border-color: rgba(255, 255, 255, 0.25)
}

.events[data-theme="light"] a h2,
.events[data-theme="light"] a p {
	color: #fff
}

.events[data-theme="light"] a:hover h2 {
	color: #f66f6a
}

.events[data-theme="dark"] li {
	border-color: rgba(0, 0, 0, 0.25)
}

.events[data-theme="dark"] a h2,
.events[data-theme="dark"] a p {
	color: #252b3a
}

.events[data-theme="dark"] a:hover h2 {
	color: #f66f6a
}

@media(max-height:899px),
(max-width:1599px) {
	.events {
		padding-bottom: 54px
	}

	.events-wrapper {
		margin-left: 30px;
		margin-right: 30px
	}

	.events-wrapper>ul>li:before {
		height: 50px;
		margin-top: -25px
	}

	.events-wrapper a {
		padding: 22px 10px
	}

	.events-wrapper h2 {
		font-size: 20px;
		line-height: 24px
	}

	.events-wrapper p {
		margin-top: 8px;
		font-size: 12px;
		line-height: 24px
	}
}

@media(max-height:649px),
(max-width:1279px) {
	.events {
		padding-bottom: 44px
	}

	.events-wrapper {
		margin-left: 20px;
		margin-right: 20px
	}

	.events-wrapper>ul>li:before {
		height: 40px;
		margin-top: -20px
	}

	.events-wrapper a {
		padding: 15px 10px
	}

	.events-wrapper h2 {
		font-size: 18px;
		line-height: 22px
	}

	.events-wrapper p {
		margin-top: 10px;
		font-size: 12px;
		line-height: 16px
	}
}

@media(max-width:1023px) {
	.events {
		padding-bottom: 11px;
		margin: 0;
		-ms-transform: none;
		transform: none
	}

	.events-wrapper>ul {
		padding-left: 0;
		padding-right: 0;
		margin-left: -3px;
		margin-right: -3px
	}

	.events-wrapper>ul>li {
		width: 50%;
		padding: 3px
	}

	.events-wrapper>ul>li:before {
		content: none !important
	}

	.events-wrapper>ul>li:nth-child(4)~li {
		display: none
	}

	.events-wrapper>ul>li a {
		padding: 8px;
		text-align: center;
		border: solid 1px
	}

	.events-wrapper a {
		padding: 10px 15px
	}

	.events-wrapper h2 {
		font-size: 16px;
		line-height: 22px
	}

	.events-wrapper p {
		display: none
	}

	.events[data-theme="light"] a {
		color: #fff;
		border: solid 1px rgba(255, 255, 255, 0.2)
	}

	.events[data-theme="dark"] a {
		color: #000;
		border: solid 1px rgba(0, 0, 0, 0.2)
	}
}

.page-next {
	position: absolute;
	z-index: 10;
	left: 50%;
	bottom: 26px;
	width: 32px;
	height: 32px;
	margin-left: -16px;
	font-size: 0;
	line-height: 32px;
	text-align: center;
	cursor: pointer;
	animation: page-next .8s infinite alternate
}

.page-next span {
	display: block;
	width: 12px;
	height: 12px;
	margin: 7px auto 0;
	-ms-transform: rotate(225deg);
	transform: rotate(225deg)
}

.page-next span:before {
	content: "";
	display: block;
	width: 100%;
	border-top: solid 1px
}

.page-next span:after {
	content: "";
	display: block;
	width: 1px;
	height: 100%;
	border-left: solid 1px;
	margin-top: -1px
}

.page-next:hover {
	animation-play-state: paused;
	color: #f66f6a !important
}

.page-next[data-theme="light"] {
	color: #fff
}

.page-next[data-theme="dark"] {
	color: #252b3a
}

@keyframes page-next {
	0 {
		margin-bottom: -10px
	}

	100% {
		margin-bottom: 0
	}
}

.page-next-banner {
	bottom: 16px
}

@media(max-height:899px),
(max-width:1599px) {
	.page-next-banner {
		bottom: 10px
	}
}

@media(max-height:649px),
(max-width:1279px) {
	.page-next-banner {
		bottom: 6px
	}
}

@media(max-width:1023px) {
	.page-next-banner {
		display: none
	}
}

@media(min-width:1024px) {
	.product-row {
		margin-left: -5px;
		margin-right: -5px
	}

	.product-row:before,
	.product-row:after {
		content: " ";
		display: table
	}

	.product-row:after {
		clear: both
	}

	[class^="product-col"] {
		position: relative;
		float: left;
		padding: 5px
	}

	.product-col-1 {
		width: 8.33333333%
	}

	.product-col-2 {
		width: 16.66666667%
	}

	.product-col-3 {
		width: 25%
	}

	.product-col-4 {
		width: 33.33333333%
	}

	.product-col-5 {
		width: 41.66666667%
	}

	.product-col-6 {
		width: 50%
	}

	.product-col-7 {
		width: 58.33333333%
	}

	.product-col-8 {
		width: 66.66666667%
	}

	.product-col-9 {
		width: 75%
	}

	.product-col-10 {
		width: 83.33333333%
	}

	.product-col-11 {
		width: 91.66666667%
	}

	.product-col-12 {
		width: 100%
	}
}

.product-tag {
	display: inline-block;
	padding-left: 4px;
	padding-right: 4px;
	border-radius: 2px;
	background-color: #f66f6a;
	font-size: 12px;
	line-height: 18px;
	color: #fff
}

.product-tag.-sale {
	background-color: #f83
}

.product-card {
	display: block;
	padding: 20px;
	border-radius: 2px;
	transition: .2s
}

.product-card .h2 {
	margin-bottom: 5px;
	font-weight: bold;
	font-size: 16px;
	line-height: 22px;
	color: #252b3a;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	transition: .2s
}

.product-card .p {
	font-size: 14px;
	line-height: 22px;
	color: #666a75;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.product-card:hover {
	background-color: rgba(255, 255, 255, 0.7);
	box-shadow: 0 20px 30px 0 rgba(6, 50, 112, 0.1)
}

.product-card:hover .h2 {
	color: #f66f6a
}

.product-card-recommend {
	display: block;
	border-radius: 2px;
	overflow: hidden;
	background-image: url(../images/homepage-card-recommend-bg.jpg);
	background-size: cover;
	background-position: right center;
	transition: .2s
}

.product-card-recommend-content {
	display: block;
	height: 110px;
	padding: 20px 20px 15px
}

.product-card-recommend-content .h2 {
	margin-bottom: 10px;
	font-weight: bold;
	font-size: 16px;
	line-height: 22px;
	color: #252b3a;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	transition: .2s
}

.product-card-recommend-content .p {
	height: 44px;
	color: #666a75;
	font-size: 14px;
	line-height: 22px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden
}

.product-card-recommend-bottom {
	padding: 19px 20px;
	background-color: rgba(255, 255, 255, 0.6)
}

.product-card-recommend-bottom p {
	font-size: 14px;
	line-height: 22px;
	color: #252b3a
}

.product-card-recommend-bottom p .product-tag {
	margin-right: 6px
}

.product-card-recommend-bottom p em {
	font-style: normal;
	color: #f83
}

.product-card-recommend-bottom p a:hover {
	color: #f66f6a
}

.product-card-recommend:hover {
	box-shadow: 0 20px 30px 0 rgba(6, 50, 112, 0.1)
}

.product-card-recommend-content:hover .h2 {
	color: #f66f6a
}

.product-card-ei {
	display: block;
	background-color: rgba(255, 255, 255, 0.7);
	background-image: url(../images/homepage-card-ei-bg.png);
	background-position: right bottom;
	background-repeat: no-repeat;
	border-radius: 2px;
	transition: .2s
}

.product-card-ei:hover {
	box-shadow: 0 20px 30px 0 rgba(6, 50, 112, 0.1)
}

.product-card-ei-row {
	height: 140px;
	padding-left: 10px;
	padding-right: 60px
}

.product-card-ei-row:before,
.product-card-ei-row:after {
	content: " ";
	display: table
}

.product-card-ei-row:after {
	clear: both
}

.product-card-ei-row:last-child {
	position: relative;
	height: 141px;
	padding-top: 1px
}

.product-card-ei-row:last-child:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 25px;
	right: 25px;
	border-top: dashed 1px #ddd
}

.product-card-ei-item {
	display: block;
	position: relative;
	float: left;
	width: 50%;
	padding: 34px 20px 36px
}

.product-card-ei-item .i {
	position: absolute;
	top: 34px;
	left: 20px
}

.product-card-ei-item .i img {
	display: block;
	width: 30px;
	height: 30px
}

.product-card-ei-item .h2 {
	margin-top: 4px;
	margin-bottom: 8px;
	margin-left: 40px;
	font-weight: bold;
	font-size: 16px;
	line-height: 22px;
	color: #252b3a
}

.product-card-ei-item .p {
	height: 36px;
	margin-left: 40px;
	font-size: 12px;
	line-height: 18px;
	color: #666a75;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden
}

.product-card-ei-item:hover .h2 {
	color: #f66f6a
}

.product-card-ei-pic {
	display: block;
	height: 281px;
	padding: 46px 30px;
	border-radius: 2px;
	background-image: url(../images/homepage-card-ei-pic-bg.jpg);
	background-size: cover;
	transition: .2s
}

.product-card-ei-pic .h2 {
	margin-bottom: 10px;
	font-size: 24px;
	line-height: 22px;
	color: #252b3a
}

.product-card-ei-pic .p {
	font-size: 14px;
	line-height: 22px;
	color: #666a75
}

.product-card-ei-pic .p span {
	display: block
}

.product-card-ei-pic:hover {
	box-shadow: 0 20px 30px 0 rgba(6, 50, 112, 0.1)
}

.product-card-ei-pic:hover .h2 {
	color: #f66f6a
}

.product-card-dev {
	display: block;
	background-color: #fff;
	border-radius: 2px;
	transition: .2s
}

.product-card-dev:hover {
	box-shadow: 0 20px 30px 0 rgba(6, 50, 112, 0.1)
}

.product-card-dev-content {
	display: block;
	position: relative;
	height: 110px;
	padding: 20px 20px 0
}

.product-card-dev-content .h2 {
	margin-bottom: 10px;
	font-weight: bold;
	font-size: 16px;
	line-height: 22px;
	color: #252b3a;
	transition: .2s
}

.product-card-dev-content .p {
	height: 44px;
	font-size: 14px;
	line-height: 22px;
	color: #666a75;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden
}

.product-card-dev-content:after {
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	left: 20px;
	right: 20px;
	border-bottom: dashed 1px #ddd
}

.product-card-dev-content:hover .h2 {
	color: #f66f6a
}

.product-card-dev-bottom {
	padding: 19px 20px
}

.product-card-dev-bottom ul {
	height: 22px;
	overflow: hidden
}

.product-card-dev-bottom ul:before,
.product-card-dev-bottom ul:after {
	content: " ";
	display: table
}

.product-card-dev-bottom ul:after {
	clear: both
}

.product-card-dev-bottom li {
	float: left;
	padding-right: 10px;
	font-size: 14px;
	line-height: 22px;
	color: #666a75
}

.product-card-dev-bottom li+li {
	position: relative;
	padding-left: 10px
}

.product-card-dev-bottom li+li:before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 4px;
	bottom: 4px;
	border-left: solid 1px #ddd
}

.product-card-dev-bottom li a {
	transition: .2s
}

.product-card-dev-bottom li a:hover {
	color: #f66f6a
}

.product-card-dev-bottom p {
	font-size: 14px;
	line-height: 22px;
	color: #252b3a
}

.product-card-dev-bottom p .product-tag {
	margin-right: 6px
}

.product-card-dev-bottom p em {
	font-style: normal;
	color: #f83
}

.product-card-dev-bottom p a {
	transition: .2s
}

.product-card-dev-bottom p a:hover {
	color: #f66f6a
}

.product-card-video {
	display: block;
	position: relative;
	height: 170px;
	border-radius: 2px;
	overflow: hidden;
	transition: .2s
}

.product-card-video-bg {
	height: 100%;
	background-size: cover;
	transition: .2s
}

.product-card-video-play {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 40px;
	height: 30px;
	border-radius: 2px;
	margin-top: -15px;
	margin-left: -20px;
	background-color: rgba(255, 255, 255, 0.3);
	text-align: center;
	font-size: 0;
	line-height: 30px;
	transition: .2s
}

.product-card-video-play .cui-icon-play {
	font-size: 14px;
	color: white
}

.product-card-video-text {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 10px 20px
}

.product-card-video-text .p {
	font-size: 16px;
	line-height: 22px;
	color: #fff
}

.product-card-video-text+.product-card-video-play {
	margin-top: -28px
}

.product-card-video:hover {
	box-shadow: 0 20px 30px 0 rgba(6, 50, 112, 0.1)
}

.product-card-video:hover .product-card-video-bg {
	transform: scale(1.1)
}

.product-card-video:hover .product-card-video-play {
	background-color: #f66f6a
}

.product-card-iot {
	padding: 20px 30px;
	background-color: #fff;
	border-radius: 2px;
	transition: .2s
}

.product-card-iot:hover {
	box-shadow: 0 20px 30px 0 rgba(6, 50, 112, 0.1)
}

.product-card-iot-text {
	height: 88px;
	margin-bottom: 6px;
	font-size: 14px;
	line-height: 22px;
	color: #666a75;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	overflow: hidden
}

.product-card-iot-subtext {
	text-align: right;
	font-size: 12px;
	line-height: 18px;
	color: #666a75
}

.section-product {
	position: relative;
	z-index: 0;
	background-color: #d9e5fa
}

.section-product-bg {
	position: absolute;
	z-index: -1;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0
}

.section-wrapper-product {
	width: 100%
}

.section-wrapper-product:before,
.section-wrapper-product:after {
	content: " ";
	display: table
}

.section-wrapper-product:after {
	clear: both
}

@media(min-width:1024px) {
	.section-wrapper-product {
		height: 494px
	}
}

.product-mb-collapse-head {
	display: none
}

.product-nav {
	float: left;
	position: relative;
	width: 140px;
	height: 100%
}

.product-nav-list {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100%;
	padding: 30px 0
}

.product-nav-list a {
	display: block;
	font-size: 18px;
	line-height: 54px;
	color: #252b3a;
	cursor: pointer
}

.product-nav-list ul {
	height: 100%
}

.product-nav-list li {
	position: relative;
	height: calc((100% - 54px) / 5)
}

.product-nav-list li:last-child {
	height: auto
}

.product-nav-list li:before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 50px;
	width: 0;
	height: 3px;
	background-color: #f66f6a;
	transition: .2s
}

.product-nav-list li:after {
	content: "";
	display: block;
	position: absolute;
	right: 0;
	top: 27px;
	border-right: solid 10px rgba(255, 255, 255, 0.5);
	border-top: solid 17px transparent;
	border-bottom: solid 17px transparent;
	margin-top: -17px;
	opacity: 0;
	transition: .2s
}

.product-nav-list li.active:before {
	width: 40px
}

.product-nav-list li.active:after {
	opacity: 1
}

.product-nav-list li.active a {
	font-weight: bold;
	font-size: 18px;
	cursor: default
}

.product-wrapper {
	float: left;
	width: calc(100% - 140px);
	padding-left: 30px
}

.product-content {
	display: none
}

.product-content.show {
	display: block
}

.product-row.product-row-large {
	height: 170px;
	margin-bottom: 15px
}

.product-row.product-row-large>[class^="product-col"] {
	padding-top: 0;
	padding-bottom: 0
}

.product-row.product-row-xlarge {
	height: 281px;
	margin-bottom: 15px
}

.product-row.product-row-xlarge>[class^="product-col"] {
	padding-top: 0;
	padding-bottom: 0
}

.product-row-extend [class^="product-col"]:first-child>[class^="product-card"] {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	margin-right: -5px
}

.product-row-extend [class^="product-col"]:last-child>[class^="product-card"] {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	margin-left: -5px
}

.product-row-extend:hover [class^="product-col"]>[class^="product-card"] {
	box-shadow: 0 20px 30px 0 rgba(6, 50, 112, 0.1)
}

@media(min-width:1024px) and (max-width:1366px) {
	.section-wrapper-product {
		height: 395px
	}

	.product-row-large~.product-row:nth-child(4) {
		display: none
	}

	.product-row-xlarge~.product-row:nth-child(3) {
		display: none
	}

	.product-row:nth-child(5) {
		display: none
	}
}

@media(max-width:1023px) {
	.product-card {
		padding: 10px 5px
	}

	.product-card .h2 {
		display: block;
		font-size: 14px;
		line-height: 22px;
		white-space: normal
	}

	.product-card .p {
		display: block;
		height: auto;
		font-size: 12px;
		line-height: 18px
	}

	.product-card-recommend {
		border-radius: 2px
	}

	.product-card-recommend-content {
		height: auto;
		padding: 15px 20px 10px
	}

	.product-card-recommend-content .h2 {
		margin-bottom: 10px;
		font-size: 14px;
		line-height: 22px;
		white-space: normal
	}

	.product-card-recommend-content .p {
		display: block;
		height: auto;
		font-size: 12px;
		line-height: 18px
	}

	.product-card-recommend-bottom {
		padding: 10px 20px
	}

	.product-card-recommend-bottom p {
		font-size: 12px;
		line-height: 22px
	}

	.product-card-ei {
		display: block;
		background-color: rgba(255, 255, 255, 0.7);
		background-image: none;
		box-shadow: none
	}

	.product-card-ei-row {
		height: auto;
		padding-left: 20px;
		padding-right: 20px
	}

	.product-card-ei-row:before,
	.product-card-ei-row:after {
		content: " ";
		display: table
	}

	.product-card-ei-row:after {
		clear: both
	}

	.product-card-ei-row:last-child {
		position: relative;
		height: auto;
		padding-top: 0
	}

	.product-card-ei-row:last-child:before {
		content: none
	}

	.product-card-ei-item {
		display: block;
		position: relative;
		float: none;
		width: auto;
		padding: 15px 20px;
		border-top: dashed 1px #ddd
	}

	.product-card-ei-item .i {
		top: 20px;
		left: 0
	}

	.product-card-ei-item .h2 {
		margin-top: 0;
		margin-bottom: 5px;
		margin-left: 40px;
		font-size: 14px;
		line-height: 22px
	}

	.product-card-ei-item .p {
		display: block;
		height: auto;
		margin-left: 40px;
		font-size: 12px;
		line-height: 18px
	}

	.product-card-ei-row:first-child .product-card-ei-item:first-child {
		border-top: 0
	}

	.product-card-ei-pic {
		height: auto;
		padding: 30px 20px 26px;
		border-radius: 2px;
		background-image: url()
	}

	.product-card-ei-pic .h2 {
		margin-bottom: 5px;
		font-size: 18px;
		line-height: 22px
	}

	.product-card-ei-pic .p {
		font-size: 12px;
		line-height: 18px
	}

	.product-card-ei-pic .p span {
		display: inline-block
	}

	.product-card-ei-pic .p span+span {
		margin-left: 5px
	}

	.product-card-dev {
		border-radius: 2px;
		box-shadow: none
	}

	.product-card-dev-content {
		display: block;
		position: relative;
		height: auto;
		padding: 15px 20px 10px
	}

	.product-card-dev-content .h2 {
		margin-bottom: 5px;
		font-size: 14px;
		line-height: 22px
	}

	.product-card-dev-content .p {
		display: block;
		height: auto;
		font-size: 12px;
		line-height: 18px
	}

	.product-card-dev-bottom {
		padding: 10px 20px 14px
	}

	.product-card-dev-bottom li {
		padding-right: 8px;
		font-size: 12px;
		line-height: 22px;
		color: #666a75
	}

	.product-card-dev-bottom li+li {
		padding-left: 8px
	}

	.product-card-dev-bottom li+li:before {
		top: 2px;
		bottom: 2px
	}

	.product-card-dev-bottom p {
		font-size: 12px;
		line-height: 22px
	}

	.product-card-video {
		border-radius: 2px
	}

	.product-card-iot {
		padding: 16px 20px;
		border-radius: 2px;
		box-shadow: none
	}

	.product-card-iot-text {
		display: block;
		height: auto;
		margin-bottom: 10px;
		font-size: 12px;
		line-height: 18px
	}

	.section-product {
		background-color: #d9e5fa;
		background-image: url(../images/homepage-product-mb-bg.jpg);
		background-size: cover;
		background-position: center top
	}

	.section-product-bg {
		display: none
	}

	.section-wrapper-product {
		padding: 0
	}

	.product-nav {
		display: none
	}

	.product-wrapper {
		float: none;
		width: 100%;
		padding: 0
	}

	.product-mb-collapse-head {
		display: block;
		position: relative;
		width: 100%;
		height: 44px;
		padding-left: 20px;
		padding-right: 30px;
		background-color: rgba(255, 255, 255, 0.8);
		line-height: 44px;
		font-size: 14px;
		color: #252b3a;
		cursor: pointer
	}

	.product-mb-collapse-head:before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		width: 0;
		background: #f66f6a;
		opacity: 0;
		transition: .35s
	}

	.product-mb-collapse-head .cui-icon-up {
		position: absolute;
		right: 20px;
		top: 50%;
		margin-top: -6px;
		font-size: 12px;
		color: #666a75;
		transition: .35s;
		-ms-transform: rotate(180deg);
		transform: rotateX(180deg)
	}

	.product-mb-collapse-head.active {
		width: 100%
	}

	.product-mb-collapse-head.active:before {
		width: 4px;
		opacity: 1
	}

	.product-mb-collapse-head.active .cui-icon-up {
		-ms-transform: rotate(0);
		transform: rotateX(0)
	}

	.product-mb-collapse-body {
		height: 0;
		overflow: hidden;
		transition: height .35s
	}

	.product-mb-collapse-body.active {
		height: auto
	}

	.product-mb-collapse-content {
		width: 100%;
		height: auto;
		padding: 15px
	}

	.product-content {
		display: block !important
	}

	.product-content+.product-content {
		margin-top: 2px
	}

	.product-row,
	.product-row-large,
	.product-row-xlarge {
		height: auto !important;
		margin-bottom: 0
	}

	.product-row-large [class^="product-col"],
	.product-row-xlarge [class^="product-col"] {
		margin-bottom: 10px
	}

	.product-row-iot [class^="product-col"]:first-child {
		margin-bottom: 0
	}

	.product-row .product-card {
		position: static;
		-ms-transform: none;
		transform: none
	}

	.product-row-extend [class^="product-col"]:first-child {
		margin-bottom: 0
	}

	.product-row-extend [class^="product-col"]:first-child>[class^="product-card"] {
		border-radius: 2px;
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
		margin: 0
	}

	.product-row-extend [class^="product-col"]:last-child>[class^="product-card"] {
		border-radius: 2px;
		border-top-left-radius: 0;
		border-top-right-radius: 0;
		margin: 0
	}
}

.section-case {
	background-color: #20283f;
	background-image: url(../images/homepage-case-bg.jpg);
	background-size: cover;
	background-position: center top
}

.section-case.init-bg-animation {
	background-color: transparent
}

.case-tabs>ul {
	border-bottom: solid 1px rgba(255, 255, 255, 0.2);
	text-align: center
}

.case-tabs>ul>li {
	display: inline-block;
	padding-left: 40px;
	padding-right: 40px;
	margin-bottom: -1px;
	font-size: 0
}

.case-tabs a {
	position: relative;
	display: block;
	padding: 10px 0 20px 0;
	font-weight: 500;
	font-size: 16px;
	line-height: 22px;
	color: rgba(255, 255, 255, 0.7);
	cursor: pointer;
	transition: .2s
}

.case-tabs a:after {
	content: "";
	display: block;
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	width: 0;
	height: 3px;
	margin: auto;
	background-color: #f66f6a;
	transition: .2s
}

.case-tabs a:hover {
	color: #fff
}

.case-tabs>ul>li.active a {
	color: #fff
}

.case-tabs>ul>li.active a:after {
	width: 100%
}

@media(min-width:1024px) {
	.case-content {
		display: none
	}

	.case-content.active {
		display: block
	}
}

.case-info {
	position: relative;
	animation: tabContent-fadeIn .35s ease-in
}

.case-info:before,
.case-info:after {
	content: " ";
	display: table
}

.case-info:after {
	clear: both
}

.case-info-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 23.72881356%;
	height: 100%;
	background-size: 280px auto;
	background-position: center center;
	background-repeat: no-repeat
}

.case-info-text {
	width: 52.54237288%;
	padding: 40px 1.69491525%;
	margin-left: 23.72881356%
}

.case-info-text .h3 {
	margin-bottom: 10px;
	font-weight: 500;
	font-size: 22px;
	line-height: 28px;
	color: #fff
}

.case-info-text .p {
	font-size: 14px;
	line-height: 22px;
	color: rgba(255, 255, 255, 0.7)
}

.case-info-btn-wrap {
	position: absolute;
	top: 0;
	right: 0;
	width: 23.72881356%;
	height: 100%
}

.case-info-btn-wrap .cui-btn {
	position: absolute;
	top: 50%;
	left: 60px;
	margin-top: -16px
}

.case-info-btn-wrap .cui-btn+.cui-btn {
	margin-left: 10px
}

.case-details {
	padding-top: 10px;
	padding-bottom: 40px
}

.case-details-diagram img {
	display: block;
	width: 100%
}

.case-details-list {
	margin-top: 5px
}

.case-details-list:before,
.case-details-list:after {
	content: " ";
	display: table
}

.case-details-list:after {
	clear: both
}

.case-details-list>li {
	float: left;
	width: 23.72881356%;
	padding-right: 1.69491525%
}

.case-details-list>li+li {
	width: 25.42372881%;
	padding-left: 1.69491525%
}

.case-detail-card {
	padding: 20px 0
}

.case-detail-card .h4 {
	margin-bottom: 15px;
	font-weight: 500;
	font-size: 16px;
	line-height: 20px;
	color: #fff
}

.case-detail-card .p {
	font-size: 14px;
	line-height: 22px;
	color: rgba(255, 255, 255, 0.7)
}

.case-mb-collapse-head {
	display: none
}

@media(max-width:1023px) {
	.section-case {
		background: #20283f
	}

	.section-wrapper-case {
		padding: 0
	}

	.case-content {
		border-top: solid 1px rgba(255, 255, 255, 0.2)
	}

	.case-tabs {
		display: none
	}

	.case-mb-collapse-head {
		display: block;
		position: relative;
		width: 100%;
		height: 44px;
		padding-left: 20px;
		padding-right: 30px;
		border-left: solid 1px rgba(255, 255, 255, 0.2);
		border-right: solid 1px rgba(255, 255, 255, 0.2);
		font-weight: 500;
		font-size: 14px;
		line-height: 44px;
		color: #fff;
		cursor: pointer
	}

	.case-mb-collapse-head:before {
		content: "";
		position: absolute;
		top: -1px;
		bottom: -1px;
		left: -1px;
		width: 0;
		background: #f66f6a;
		opacity: 0;
		transition: .35s
	}

	.case-mb-collapse-head .cui-icon-up {
		position: absolute;
		right: 20px;
		top: 50%;
		margin-top: -6px;
		font-size: 12px;
		color: #ddd;
		transition: .35s;
		-ms-transform: rotate(180deg);
		transform: rotateX(180deg)
	}

	.case-mb-collapse-head.active {
		width: 100%
	}

	.case-mb-collapse-head.active:before {
		width: 4px;
		opacity: 1
	}

	.case-mb-collapse-head.active .cui-icon-up {
		-ms-transform: rotate(0);
		transform: rotateX(0)
	}

	.case-mb-collapse-body {
		height: 0;
		overflow: hidden;
		transition: height .35s
	}

	.case-mb-collapse-body.active {
		height: auto
	}

	.case-mb-collapse-content {
		padding: 20px;
		border-top: solid 1px rgba(255, 255, 255, 0.2)
	}

	.case-info-img {
		position: static;
		width: 900px;
		height: 76px;
		margin-bottom: 15px
	}

	.case-info-text {
		float: none;
		width: auto;
		padding: 0;
		margin: 0
	}

	.case-info-text .h3 {
		font-size: 14px;
		line-height: 18px
	}

	.case-info-text .p {
		font-size: 12px;
		line-height: 18px
	}

	.case-info-btn-wrap {
		position: static;
		width: auto;
		height: auto;
		margin-top: 15px
	}

	.case-info-btn-wrap .cui-btn {
		position: static;
		margin-top: 0
	}

	.case-details-diagram {
		display: none
	}

	.case-details {
		padding: 0
	}

	.case-details-list {
		margin-top: 0
	}

	.case-details-list>li,
	.case-details-list>li+li {
		float: none;
		width: auto;
		padding: 0
	}

	.case-detail-card {
		padding: 20px 0 0 0
	}

	.case-detail-card .h4 {
		margin-bottom: 5px;
		font-size: 14px;
		line-height: 18px
	}
}

.section-solution {
	position: relative;
	z-index: 0
}

.section-solution-all {
	position: relative;
	width: 100%
}

.section-solution-bg {
	position: absolute;
	z-index: -1;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0
}

.solution-content {
	position: relative;
	height: 370px;
	background-color: #000
}

.solution-content:before,
.solution-content:after {
	content: " ";
	display: table
}

.solution-content:after {
	clear: both
}

.solution-container {
	float: left;
	height: 100%;
	width: 87.5%;
	overflow: hidden
}

.solution-container:before,
.solution-container:after {
	content: " ";
	display: table
}

.solution-container:after {
	clear: both
}

.solution-wrapper {
	position: relative;
	height: 100%;
	font-size: 0;
	white-space: nowrap
}

.solution-wrapper:before,
.solution-wrapper:after {
	content: " ";
	display: table
}

.solution-wrapper:after {
	clear: both
}

.solution-slide {
	display: inline-block;
	position: relative;
	height: 100%;
	width: 14.28571429%;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	font-size: 1rem;
	overflow: hidden;
	vertical-align: top;
	white-space: normal
}

.solution-card-bg {
	position: relative;
	width: 100%;
	height: 100%;
	transition: .2s
}

.solution-card-bg img {
	display: block;
	position: absolute;
	top: -10000px;
	right: -10000px;
	bottom: -10000px;
	left: -10000px;
	height: 100%;
	margin: auto
}

.solution-card-bg:after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: #000;
	opacity: .5;
	transition: .2s
}

.solution-card-collapse {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	cursor: pointer;
	transition: .5s
}

.solution-card-collapse-inner {
	position: absolute;
	top: 50%;
	width: 100%;
	margin-top: -46px;
	font-size: 0;
	text-align: center
}

.solution-card-collapse-inner i {
	display: inline-block;
	width: 48px;
	height: 48px;
	background-size: cover
}

.solution-card-collapse-inner .h2 {
	margin-top: 14px;
	font-size: 20px;
	color: #fff;
	line-height: 26px
}

.solution-card-open {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	cursor: default;
	opacity: 0;
	visibility: hidden;
	transition: .5s
}

.solution-card-open-inner {
	position: absolute;
	top: 50%;
	left: -10000px;
	right: -10000px;
	width: 370px;
	-ms-transform: translate(0, -50%);
	transform: translate(0, -50%);
	margin: auto;
	color: #fff;
	text-align: center
}

.solution-card-open-inner .h1 {
	position: relative;
	margin-bottom: 44px;
	font-weight: 500;
	font-size: 24px;
	line-height: 30px;
	color: #fff;
}

.solution-card-open-inner .h1:after {
	content: "";
	display: block;
	position: absolute;
	top: 100%;
	right: 0;
	left: 0;
	width: 68px;
	height: 3px;
	margin: 20px auto 0;
	background-color: #f66f6a
}

.solution-card-open-inner p {
	margin-bottom: 30px;
	font-size: 14px;
	line-height: 22px
}

.solution-recommend {
	display: inline-block;
	font-size: 14px;
	line-height: 22px
}

.solution-recommend h2 {
	font-weight: 500;
	color: #fff;
}

.solution-recommend ul {
	margin-top: 4px
}

.solution-recommend ul:before,
.solution-recommend ul:after {
	content: " ";
	display: table
}

.solution-recommend ul:after {
	clear: both
}

.solution-recommend ul>li {
	float: left
}

.solution-recommend ul>li+li:before {
	content: "\2002|\2002"
}

.solution-recommend ul>li a {
	transition: .2s
}

.solution-recommend ul>li a:hover {
	color: #f66f6a
}

.solution-card-btnbox {
	font-size: 0;
	text-align: center
}

.solution-card-btnbox .cui-btn i {
	margin-left: 4px;
	transition: transform .2s
}

.solution-card-btnbox .cui-btn:hover i {
	-ms-transform: translate3d(4px, 0, 0);
	transform: translate3d(4px, 0, 0)
}

.solution-slide:not(.open):hover .solution-card-bg {
	-ms-transform: scale(1.05);
	transform: scale(1.05)
}

.solution-slide:not(.open):hover .solution-card-bg:after {
	opacity: 0
}

.solution-slide.open .solution-card-bg:after {
	opacity: .2
}

.solution-slide.open .solution-card-collapse {
	opacity: 0
}

.solution-slide.open .solution-card-open {
	opacity: 1;
	visibility: visible
}

.solution-ctrl {
	float: left;
	position: relative;
	width: 12.5%;
	height: 100%;
	overflow: hidden;
	color: #fff;
	cursor: pointer
}

.solution-ctrl-arrow {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 20px;
	height: 28px;
	margin-left: -10px;
	margin-top: -14px;
	opacity: .5;
	transition: .2s;
	animation: solution-arrow-flash .6s ease-in infinite alternate
}

.solution-ctrl-arrow span {
	display: block;
	width: 28px;
	height: 28px;
	margin-left: -12px;
	-ms-transform: rotate(135deg);
	transform: rotate(135deg)
}

.solution-ctrl-arrow span:before {
	content: "";
	display: block;
	width: 100%;
	border-top: solid 4px;
	border-radius: 2px
}

.solution-ctrl-arrow span:after {
	content: "";
	display: block;
	width: 4px;
	height: 100%;
	border-right: solid 4px;
	border-radius: 2px;
	margin-top: -4px
}

.solution-ctrl-bg {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-image: url(../images/homepage-solution-ctrl.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	transition: .2s
}

.solution-ctrl-bg:after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: #000;
	opacity: .5;
	transition: .2s
}

.solution-ctrl:hover .solution-ctrl-bg {
	-ms-transform: scale(1.05);
	transform: scale(1.05)
}

.solution-ctrl:hover .solution-ctrl-bg:after {
	opacity: 0
}

.solution-ctrl:hover .solution-ctrl-arrow {
	animation: none;
	opacity: 1
}

.solution-ctrl[data-toggle="next"] .solution-ctrl-arrow {
	-ms-transform: rotateY(0);
	transform: rotateY(0)
}

.solution-ctrl[data-toggle="prev"] .solution-ctrl-arrow {
	-ms-transform: rotateY(180deg);
	transform: rotateY(180deg)
}

@media(max-width:1366px) {
	.solution-card-collapse-inner .h2 {
		font-size: 20px;
		line-height: 26px
	}

	.solution-card-open-inner .h1 {
		margin-bottom: 45px;
		font-size: 20px;
		line-height: 26px
	}
}

@keyframes solution-arrow-flash {
	0 {
		opacity: .3
	}

	100% {
		opacity: 1
	}
}

@media(max-width:1023px) {
	.section-solution {
		background-image: url(../images/homepage-product-mb-bg.jpg);
		background-size: cover;
		background-position: center top
	}

	.solution-card-bg,
	.solution-card-collapse,
	.solution-card-open {
		display: none
	}

	.solution-wrapper.open .solution-slide:nth-child(4)~.solution-slide {
		display: block
	}

	.solution-card-mb {
		display: block;
		position: relative;
		cursor: pointer
	}

	.solution-card-mb .h2 {
		position: absolute;
		top: 50%;
		left: 0;
		right: 0;
		margin-top: -12px;
		font-size: 14px;
		line-height: 24px;
		color: #fff;
		text-align: center
	}

	.solution-card-mb img {
		display: block;
		width: 100%
	}

	.solution-mb-more {
		position: relative
	}

	.solution-mb-more img {
		display: block;
		width: 100%
	}

	.solution-mb-more a {
		position: absolute;
		top: 50%;
		left: 50%;
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%)
	}

	.solution-mb-more a i {
		font-size: inherit
	}

	.solution-mb-more a span {
		vertical-align: middle
	}

	.solution-mb-more a span+span {
		display: none
	}

	.solution-mb-more a.open span:first-child {
		display: none
	}

	.solution-mb-more a.open span+span {
		display: inline
	}

	.solution-mb-more a.open i {
		-ms-transform: rotate(180deg);
		transform: rotateX(180deg)
	}

	#solution-mb-swiper .swiper-wrapper {
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex
	}
}

#solution-mb-swiper {
	display: none
}

@media(max-width:1023px) {
	.solution-content {
		display: none
	}

	.section-bottom {
		padding-top: 15px
	}

	#solution-mb-swiper {
		display: none;
		margin-left: -15px;
		margin-right: -15px
	}

	#solution-mb-swiper .solution-slide-wrapper {
		height: 315px;
		margin: 0 auto;
		padding: 0 15px;
		overflow: hidden
	}

	#solution-mb-swiper .solution-slide-wrapper .solution-slide {
		display: block
	}

	#solution-mb-swiper .solution-slide-wrapper .solution-card-mb {
		overflow: hidden
	}

	#solution-mb-swiper .solution-slide-wrapper img {
		display: block;
		height: 315px;
		width: 687px;
		left: 50%;
		transform: translateX(-50%)
	}

	#solution-mb-swiper .swiper-pagination {
		position: relative;
		padding: 10px 0 0 0;
		bottom: 0
	}

	#solution-mb-swiper .swiper-pagination .swiper-pagination-bullet {
		border-radius: 0;
		background-color: #fff;
		opacity: .4;
		width: 20px;
		height: 4px;
		margin: 0 2.5px
	}

	#solution-mb-swiper .swiper-pagination .swiper-pagination-bullet-active {
		background-color: #f66f6a;
		opacity: 1
	}

	#solution-mb-swiper .solution-card-mb-bg {
		width: 100%;
		background-size: cover;
		background-position: center;
		height: 315px
	}

	#solution-mb-swiper .solution-card-mb-text {
		position: absolute;
		top: 50%;
		left: -10000px;
		right: -10000px;
		width: 265px;
		-ms-transform: translate(0, -50%);
		transform: translate(0, -50%);
		margin: auto;
		color: #fff;
		text-align: center
	}

	#solution-mb-swiper .solution-card-mb-text .h1 {
		margin-bottom: 43px;
		font-size: 16px;
		line-height: 22px
	}

	#solution-mb-swiper .solution-card-mb-text .h1:after {
		content: "";
		display: block;
		position: absolute;
		right: 0;
		left: 0;
		width: 36px;
		height: 3px;
		margin: 20px auto 0;
		background-color: #f66f6a
	}

	#solution-mb-swiper .solution-card-mb-text .h2 {
		position: relative;
		top: 0;
		margin-top: 0
	}

	#solution-mb-swiper .solution-card-mb-text p {
		padding: 0 0 30px 0;
		font-size: 12px;
		line-height: 18px
	}

	#solution-mb-swiper .solution-card-mb-text ul {
		display: inline-block;
		margin: 0 -20px
	}

	#solution-mb-swiper .solution-card-mb-text ul:after {
		content: '';
		clear: both;
		display: block
	}

	#solution-mb-swiper .solution-card-mb-text li {
		float: left
	}

	#solution-mb-swiper .solution-card-mb-text li+li:before {
		content: "\2002|\2002"
	}
}

.section-news {
	background: #FFF
}

.news-wrapper {
	max-width: 1210px;
	padding-left: 15px;
	padding-right: 15px;
	margin-left: auto;
	margin-right: auto
}

.news-body {
	height: 420px;
	box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.12)
}

.news-body:before,
.news-body:after {
	content: " ";
	display: table
}

.news-body:after {
	clear: both
}

.news-main {
	float: left;
	height: 100%;
	width: 32.5%
}

.news-sub {
	float: left;
	position: relative;
	height: 100%;
	width: 67.5%
}

.news-main-card {
	display: block;
	position: relative;
	height: 100%;
	overflow: hidden
}

.news-main-card-bg {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-size: cover;
	background-position: center;
	transition: .2s
}

.news-main-card-bg-mb {
	display: none
}

.news-main-card-top {
	position: relative;
	height: 210px
}

.news-play-btn {
	display: none;
	position: absolute;
	top: 70px;
	right: 0;
	bottom: 0;
	left: 0;
	width: 40px;
	height: 30px;
	background-color: rgba(255, 255, 255, 0.3);
	border-radius: 2px;
	margin: auto;
	font-size: 0;
	line-height: 30px;
	text-align: center;
	cursor: pointer;
	transition: .2s
}

.news-play-btn .cui-icon-play {
	font-size: 16px;
	color: #fff
}

.news-main-card-bottom {
	position: relative;
	height: 210px;
	padding: 30px
}

.news-main-card-bottom .h2 {
	margin-bottom: 10px;
	font-weight: 500;
	font-size: 20px;
	line-height: 28px;
	color: #fff;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.news-main-card-bottom .p {
	max-height: 40px;
	font-size: 14px;
	line-height: 20px;
	color: rgba(255, 255, 255, 0.7);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden
}

.news-main-card-bottom .sub-p {
	position: relative;
	padding-left: 10px;
	font-size: 14px;
	line-height: 20px;
	color: #fff
}

.news-main-card-bottom .sub-p:before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 10px;
	border: solid 2px;
	border-radius: 50%;
	margin-top: -2px
}

.news-main-card-bottom .sub-p-date {
	margin-top: 10px
}

.news-main-card-bottom .sub-p-author {
	margin-top: 5px
}

.news-main-card-bottom .btn-group {
	position: absolute;
	bottom: 30px
}

.news-main-card-bottom .btn-group .cui-icon {
	margin-top: -2px;
	margin-right: 8px;
	font-size: inherit
}

.news-main-card:hover .news-main-card-bg {
	-ms-transform: scale(1.1);
	transform: scale(1.1)
}

.news-main-card:hover .news-play-btn {
	background-color: #f66f6a;
	border-color: #f66f6a
}

.news-list-v {
	position: absolute;
	height: 100%;
	width: 100%;
	visibility: hidden;
	opacity: 0;
	transition: 0 .2s
}

.news-list-v:before,
.news-list-v:after {
	content: " ";
	display: table
}

.news-list-v:after {
	clear: both
}

.news-list-v>li {
	float: left;
	width: 33.33333333%;
	height: 50%
}

.news-list-v>li:nth-child(4) {
	width: 66.66666667%
}

.news-list-v.show {
	z-index: 1;
	visibility: visible;
	opacity: 1;
	transition: .2s
}

@keyframes news-change {
	0 {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

.news-list-card {
	display: block;
	position: relative;
	height: 100%;
	padding: 0 30px;
	background-color: white;
	line-height: 210px
}

.news-list-card .h1 {
	font-weight: 500;
	font-size: 20px;
	line-height: 28px;
	color: #252b3a
}

.news-list-card .p {
	margin-top: 10px;
	font-size: 14px;
	line-height: 20px;
	color: #666a75;
}

.news-list-v>li:not(:nth-child(4)) .news-list-card .p {
	display: none
}

.news-list-card .more {
	position: absolute;
	left: 30px;
	bottom: 10px;
	opacity: 0;
	font-size: 14px;
	line-height: 22px;
	transition: opacity .2s
}

.news-list-card .more i {
	margin-left: 5px;
	transition: transform .2s
}

.news-list-card .more:hover i {
	transform: translate(5px, 0)
}

@media(min-width:1024px) {

	.news-list-v>li:nth-child(1) .news-list-card,
	.news-list-v>li:nth-child(2) .news-list-card,
	.news-list-v>li:nth-child(5) .news-list-card {
		/*background-color: #f66f6a;*/
		background-color: #999;
	}

	.news-list-v>li:nth-child(1) .news-list-card .h1,
	.news-list-v>li:nth-child(2) .news-list-card .h1,
	.news-list-v>li:nth-child(5) .news-list-card .h1 {
		color: #fff
	}

	.news-list-v>li:nth-child(1) .news-list-card .p,
	.news-list-v>li:nth-child(2) .news-list-card .p,
	.news-list-v>li:nth-child(5) .news-list-card .p,
	.news-list-v>li:nth-child(1) .news-list-card .more,
	.news-list-v>li:nth-child(2) .news-list-card .more,
	.news-list-v>li:nth-child(5) .news-list-card .more {
		color: rgba(255, 255, 255, 0.7)
	}
	.news-list-v>li:nth-child(1) .news-list-card {
		background-image: url(https://www.cab2b.com.cn/upload/202302/1677576098982348.png);
		background-size: cover
	}
	.news-list-v>li:nth-child(2) .news-list-card {
		background-image: url(https://www.cab2b.com.cn/upload/202302/1676598040231569.jpg);
		background-size: cover
	}
	.news-list-v>li:nth-child(3) .news-list-card {
		/*background-image: url(https://www.cab2b.com.cn/upload/202302/1676253378637106.jpg);*/
		background-size: cover
	}

	.news-list-v>li:nth-child(4) .news-list-card {
		/*background-image: url(https://www.cab2b.com.cn/upload/202302/1676598040231569.jpg);*/
		background-size: cover
	}
	
	.news-list-v>li:nth-child(5) .news-list-card {
		background-image: url(https://www.cab2b.com.cn/upload/202301/1673232782420536.jpg);
		background-size: cover
	}
}

.news-list-card-text {
	display: inline-block;
	width: 100%;
	vertical-align: middle;
	transition: .2s;
	margin-top: 10%;
}

@media(min-width:1024px) {
	.news-list-card:hover .news-list-card-text {
		-ms-transform: translate(0, -26px);
		transform: translate(0, -26px)
	}

	.news-list-card:hover .more {
		opacity: 1
	}
}

.section-more-wrap .news-more {
	display: none
}

.section-more-wrap .news-change {
	padding-right: 20px;
	background-image: url(../images/homepage-news-icon-change.png);
	background-repeat: no-repeat;
	background-position: right center
}

.section-more-wrap .news-change:before,
.section-more-wrap .news-change:hover {
	content: "";
	background-image: url(../images/homepage-news-icon-change-active.png)
}

@media(min-width:1024px) and (max-width:1366px) {
	.news-list-card:hover .news-list-card-text {
		-ms-transform: translate(0, -16px);
		transform: translate(0, -16px)
	}
}

@media(min-width:1024px) and (max-width:1279px) {
	.news-list-card {
		padding-left: 20px;
		padding-right: 20px
	}

	.news-list-card .more {
		left: 20px
	}
}

@media(max-width:1023px) {
	.news-body {
		height: auto;
		box-shadow: none;
		margin-left: 0;
		margin-right: 0
	}

	.news-main,
	.news-sub {
		float: none;
		width: auto
	}

	.news-main-card {
		box-shadow: 0 20px 30px 0 rgba(6, 50, 112, 0.1)
	}

	.news-main-card-bg {
		display: none
	}

	.news-main-card-bg-mb {
		display: block;
		bottom: auto;
		padding-top: 56.25%
	}

	.news-main-card-top {
		height: auto;
		padding-top: 56.25%
	}

	.news-play-btn {
		display: block;
		top: 0
	}

	.news-main-card-bottom {
		height: auto;
		padding: 15px;
		background-color: white
	}

	.news-main-card-bottom .h2,
	.news-main-card-bottom .sub-p {
		color: #252b3a
	}

	.news-main-card-bottom .sub-p-date {
		padding-left: 22px;
		background-image: url();
		background-size: 16px 16px;
		background-repeat: no-repeat;
		background-position: 0 4px;
		line-height: 24px
	}

	.news-main-card-bottom .sub-p-date:before {
		content: none
	}

	.news-main-card-bottom .h2 {
		font-size: 16px;
		line-height: 20px
	}

	.news-main-card-bottom .p {
		font-size: 14px;
		line-height: 24px
	}

	.news-main-card-bottom .p,
	.news-main-card-bottom .sub-p-author,
	.news-main-card-bottom .btn-group {
		display: none
	}

	.news-list-v {
		position: static;
		margin-top: 5px
	}

	.news-list-v>li {
		float: none;
		width: auto !important;
		height: auto
	}

	.news-list-v:not(.show) {
		display: none
	}

	.news-list-card {
		padding: 20px 15px;
		border-bottom: solid 1px #ddd;
		background-color: transparent;
		background-image: none !important;
		line-height: 1.5
	}

	.news-list-card .h1 {
		font-weight: 500;
		font-size: 16px;
		line-height: 24px
	}

	.news-list-card .p {
		display: none
	}

	.news-list-card .cui-btn {
		display: none
	}

	.news-list-card:hover {
		background-color: white;
		box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1)
	}

	.news-list-card:hover .h1 {
		color: #f66f6a
	}

	.section-more-wrap .news-more {
		display: inline-block
	}

	.section-more-wrap .news-change {
		display: none
	}
}