@font-face {
    font-family: cloud-icon;
    src: url(./fonts/iconfont.635517a.woff2) format("woff2"),url(./fonts/iconfont.dbf9e37.woff) format("woff"),url(./fonts/iconfont.1147217.ttf) format("truetype")
}


body {
    margin: 0;
    font-family: Arial, sans-serif;
}

/* 使图片固定在右下角 */
.fixed-images {
    position: fixed;
    bottom: 30%;
    right: 0;
    transform: translateY(50%);
    z-index: 9999;
}
 /* 确保图片在最上层 */

.image-wrapper {
    position: relative;
    margin: 10px 0;
}

.image {
    display: block;
    width: 60px; /* 图片宽度 */
    height: auto;
    margin-bottom: 10px; /* 图片间距 */
}

.overlay {
    display: none;
    position: absolute;
    top: 0;
    right: 110%; /* 显示在图片左边 */
    width: 200px; /* 悬停时显示的图片宽度 */
    background: rgba(0, 0, 0, 0.7);
    color: white;
    text-align: center;
    padding: 10px;
    box-sizing: border-box;
    z-index: 10;
    border-radius: 5px; /* 可选，圆角效果 */
}
.overlay img {
    max-width: 100%;
    height: auto;
}

.image-wrapper:hover .overlay {
    display: block;
}





.image-text-pair {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
}

.image-container {
    flex: 1 1 150px; /* 允许元素伸缩 */
    margin: 10px; /* 为图片添加一些边距 */
    text-align: center;
    color: black;
}

.image-container img {
    max-width: 100%; /* 确保图片不会超过容器宽度 */
    height: auto; /* 保持图片的纵横比 */
}

/* 媒体查询，针对小屏幕设备 */
@media (max-width: 600px) {
    .image-text-pair {
        flex-direction: column;
    }

    .image-container {
        margin: 10px 0; /* 在垂直方向上增加边距 */
    }

    .image-container img {
        width:10%; /* 在小屏幕上图片宽度为100% */
    }
}


.zoom-container {
    position: relative;
    overflow: hidden; /* 防止放大图片溢出容器 */
    width: 300px; /* 图片容器宽度 */
    height: 200px; /* 图片容器高度 */
}

.zoom-container img {
    width: 100%;
    height: 100%;
    transition: transform 0.3s ease; /* 放大效果的平滑过渡 */
}

.zoom-container:hover img {
    transform: scale(1.2); /* 放大比例 */
}


}

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

[class*=-cloud-icon-] {
    font-family: cloud-icon!important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}
a {
    text-decoration: none;
}

.-cloud-icon-body_arrow_20:before {
    content: "\e642"
}

.-cloud-icon-header_arrow_14:before {
    content: "\e643"
}

.-cloud-icon-header_close_16:before {
    content: "\e644"
}

.-cloud-icon-body_arrow_22:before {
    content: "\e645"
}

.-cloud-icon-scrollbar_phone:before {
    content: "\e646"
}

.-cloud-icon-shangcheng_shield_16:before {
    content: "\e647"
}

.-cloud-icon-header_search_16:before {
    content: "\e648"
}

.-cloud-icon-user_myself_16:before {
    content: "\e649"
}

.-cloud-icon-user_logout_16:before {
    content: "\e64a"
}

.-cloud-icon-user_mail_16:before {
    content: "\e64b"
}

.-cloud-icon-user_waittocon_16:before {
    content: "\e64c"
}

.-cloud-icon-scrollbar_edit:before {
    content: "\e64d"
}

.-cloud-icon-scrollbar_top_16:before {
    content: "\e64e"
}

.-cloud-icon-user_waittopay_16:before {
    content: "\e64f"
}

.-cloud-icon-user_product_16:before {
    content: "\e650"
}

.-cloud-icon-user_cost_16:before {
    content: "\e651"
}

.-cloud-icon-scrollbar_chat:before {
    content: "\e652"
}

.-cloud-icon-a-Frame1:before {
    content: "\e653"
}

.-cloud-icon-user_option_16:before {
    content: "\e654"
}

:root {
    --primary: #1664ff;
    --primary-hover: #4281fe;
}

html {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    height: 100%;
    font-size: 85%;
}

body {
    color: #333;
    font-size: 14px;
    line-height: 1.5;
    font-family: Rubik, -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Hiragino Sans GB,Microsoft YaHei UI,Microsoft YaHei,Source Han Sans CN,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,sans-serif !important;
    font-weight: 400;
    /* background-color: #F6F8FA; */
    /* -webkit-font-smoothing: antialiased; */
}

h1, h2, h3, h4, h5, h6 {
    font-family: Ubuntu, sans-serif;
}

body, button, input, select, textarea {
    font-family: Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Hiragino Sans GB,Microsoft YaHei UI,Microsoft YaHei,Source Han Sans CN,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,sans-serif !important;
}

a {
    transition: all 0.3s ease-in-out 0s;
}

textarea.form-control {
    height: auto !important;
}

.text-primary {
    color: var(--primary) !important;
}

.btn-primary {
    background-color: var(--primary);
    border-color: var(--primary);
}

.btn-primary:hover {
    background-color: var(--primary-hover);
    border-color: var(--primary-hover);
}

.btn-outline-primary {
    color: var(--primary);
    border-color: var(--primary);
}

.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:hover {
    border-color: var(--primary);
    background-color: var(--primary);
}

.page-item.active .page-link {
    background-color: var(--primary);
}

:focus {
    outline: none;
}

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {
    -webkit-transition-delay: 99999s;
    -webkit-transition: color 99999s ease-out, background-color 99999s ease-out;
}

input[type=checkbox] {
    position: relative;
    margin-right: 2px;
    width: 18px;
    height: 12px;
}

input[type=checkbox]:after {
    content: '';
    width: 16px;
    height: 16px;
    cursor: pointer;
    vertical-align: middle;
    outline: none;
    -webkit-appearance: none;
    border: 1px solid #cfd5de;
    background-color: #fff;
    border-radius: 0;
    color: rgba(0,0,0,.9);
    position: absolute;
    transform: translate(0, 0px);
}

input[type=checkbox]:focus:after, input[type=checkbox]:hover:after {
    border-color: #0b53d9;
}

input[type=checkbox]:checked:after {
    display: flex;
    align-items: center;
    justify-content: center;
    border-color: #0b53d9;
    background-color: #0b53d9;
}

input[type=checkbox]:checked:before {
    position: absolute;
    width: 16px;
    height: 16px;
    color: #FFF;
    content: "\f00c";
    font-family: "Font Awesome 5 Pro";
    font-weight: 500;
    z-index: 10;
    font-size: .5rem;
    top:  3px;
    left: 4px;
}

.text-white {
    color: #FFF;
}

.hidden {
    display: none !important;
}

.form-control-plaintext, .form-control {
    box-shadow: none !important;
    border: 1px solid #edefef;
    transition: all .3s;
    height: 36px;
}

.form-control:hover, .form-control:focus {
    outline: 0;
    box-shadow: none;
}



.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: none;
}
.btn-default {
	color: #4e5969;
    background-color: #fff;
    border-color: #c9cdd5;
	box-shadow: 0 1px 1px rgba(0,0,0,.08);
}
.btn-default:hover {
	background-color: #fff;
	box-shadow: 0 1px 1px rgba(0,0,0,.15);
}
.btn-primary {
	background-color: #1664ff;
	border-color: #1664ff;
	box-shadow: 0 1px 1px rgba(0,0,0,.15);
}
.btn-primary:hover {
	background-color: #4281fe;
	border-color: #4281fe;
	box-shadow: 0 1px 1px rgba(0,0,0,.2);
}
.space {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
}

.navbar-brand {
    text-indent: -999rem;
    background-image:url(/upload/cly-logo.png);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: left center;

    height: 53px;
    width: 122px;
    margin: 0;
    padding: 0;
}

/* Header */
header#header {
	z-index: 101;
	top: 0;
	width: 100%;
	z-index: 999;
	background-color: #FFF;
}
.homepage .wrap-main-swiper {
	padding-top: 70px;
}
.homepage header#header {
	z-index: 101;
	width: 100%;
	background-color: rgba(255,255,255,.75);
	backdrop-filter: blur(20px);
	box-shadow: 0 2px 5px 0 rgb(0 0 0 / 6%);
	transition: background-color .3s ease;
}
header#header.header-dark {
	top: 0;
	width: 100%;
	background-color: #1d2129;
}

.header-dark .navbar-brand {
	background-image: url("../img/logo.svg");
}
.header-dark .dropdown-menu {
	margin: 0;
	border: 0;
	border-radius: 0;
}
.nav-item.billing .dropdown-menu {
	width: 240px;
}
.header-dark .dropdown-menu {
	background-color: #1d212b;
}
.header-dark .dropdown-menu .dropdown-divider {
	border-color: #262f3e;
}
.header-dark .dropdown-item:hover {
	background-color: transparent;
}
.header-dark .dropdown-item .dropdown-link {
	display: flex;
	align-items: center;
	color: #c1c6c8 !important;
}
.header-dark .dropdown-item .dropdown-link:hover {
	background-color: #344258;
}
.header-dark .dropdown-item .dropdown-link:hover i {
	color: #EEE;
}
.dropdown-menu .panel-amount {
	padding: 0 1.5rem;
}
.dropdown-menu .panel-amount-head {
	font-size: 12px;
	color: #888;
	padding: .5rem 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.dropdown-menu .panel-amount-head .panel-amount-head-btn a {
	font-size: 12px !important;
	color: #e6c979;
}
.dropdown-menu .panel-amount-number {
	color: #333;
	font-style: normal;
	margin: 1rem 0;
	display: flex;
	align-items: flex-end;
}
.header-dark .dropdown-menu .panel-amount-number {
	color: #FFF;
}
.dropdown-menu .panel-amount-number em {
	font-style: normal;
}
.dropdown-menu .panel-amount-number .amount-number {
	font-size: 28px;
	line-height: 1;
	margin-right: 2px;
}
header .navbar {
	height: 70px;
}
header .navbar-nav .nav-item > a {
	font-size: 14px;
	display: block;
}
header .navbar-dark .navbar-nav .show > .nav-link {
	color: #5e6166;
}
header .navbar-nav .nav-item .nav-link {
	font-size: 14px;
	color: #5e6166;
	line-height: 69px;
	padding: 0 1rem;
}
header .navbar-nav .nav-item .nav-link .bi {
	font-size: 12px;
	transition: all 0.3s ease;
}
header .navbar-nav .nav-item .nav-link.show,
header .navbar-nav .nav-item .nav-link:hover {
	color: var(--primary);
}
header .navbar-nav.navbar-nav-right .nav-item .btn {
	border-radius: 2px;
	color: #FFF;
}

.header-dark .navbar-nav .nav-item .nav-link {
	/* font-size: 13px; */
	color: #c1c6c8;
}
.header-dark .navbar-nav .nav-item .nav-link:hover {
	color: rgba(255,255,255,.9);
}
.dropdown-menu {
	border: 0 none;
	border-radius: 8px;
	box-shadow: 0 10px 20px rgb(64 64 64 / 15%);
}
.account .dropdown-menu {
	width: 240px;
}
.dropdown-item {
	padding: 0 8px;
}
.dropdown-item:hover {
	background-color: transparent;
}
.dropdown-item:active {
	background-color: transparent;
}
.dropdown-item .dropdown-link {
	color: #3b3c43;
	display: block;
	padding: 8px;
	text-decoration: none;
}
.dropdown-item .dropdown-link i {
	color: #8a8c94;
	font-size: 20px;
	vertical-align: middle;
	margin-top: -4px;
	margin-right: 0.5rem;
}
.dropdown-item .dropdown-link:hover {
	border-radius: 6px;
	background-color: #f2f3f7;
}
.dropdown-item .dropdown-link:hover i {
	color: #3b3c43;
}
.dropdown-wrap {
	position: relative;
}
.dropdown-wrap-fluid {
	position: unset;	
}
.dropdown-container {
	overflow: hidden;
	opacity: 0;
	height: 0;
	max-height: 0;
	position: absolute;
	top: 70px;
	left: 0;
	width: 150px;
	z-index: -1;
	transition: max-height .25s ease-in-out, opacity .25s ease-in-out;
}
.dropdown-wrap-fluid .dropdown-container {	
	width: 100%;
}
.dropdown-container.show {
	padding-bottom: 20px;
	z-index: 100;
	height: auto;
	opacity: 1;
	max-height: 600px;
}
.dropdown-body {
	width: 100%;
	background-color: #FFF;
	box-shadow: 0 4px 8px 0 rgb(0 0 0 / 5%);
	position: relative;
}
.dropdown-body ul > li > a {
	color: #444;
	display: block;
	line-height: 40px;
	text-decoration: none;
	padding: 0 1rem;
}
.dropdown-body ul > li > a:hover {	
	color:  var(--primary-hover);
	background-color: #f9faff;
}
.dropdown-body .list-items h5 {
	
}
.dropdown-body .list-items .list-item-link {
	margin-bottom: 1rem;
}
.dropdown-body .list-items .list-item-link a {
	padding: 0;
	line-height: 1.5;
}
.dropdown-body .list-items .list-item-link a:hover {
	background-color: transparent;
}
.dropdown-body .card .card-title {
	color: #444;
}
.dropdown-wrap-fluid .dropdown-body {
	width: 100%;
	display: flex;
	align-items: stretch;
}
.dropdown-body-menu {
	width: 280px;
	padding: 2rem 3rem;
	background-color: #f7f9fd;
	background-image: url("https://bce.bdstatic.com/p3m/common-service/uploads/left_backend_new_ba6a747.png");
	background-position: right bottom;
	background-repeat: no-repeat;
	background-size: 236px auto;
}
.body-menu-title {
	font-weight: 400;
	font-size: 1.215rem;
	margin-bottom: 1.5rem;
}
.body-menu-desc {
	color: rgba(34, 34, 34, 0.7);
	line-height: 28px;
}
.dropdown-bd {
	width: 100%;
	padding: 2rem 3rem;
	display: grid;
	grid-gap: 2rem;
	grid-template-columns: repeat(3, auto);
}
.dropdown-bd .body-main {
	
}
.dropdown-bd .body-main-title {
	color: #1664FF;
	font-weight: 500;
	margin-bottom: 1rem;
	position: relative;
	font-size: 16px;
}

.dropdown-bd .body-main-bd {
	display: grid;
	grid-gap: 1rem;
	grid-template-columns: repeat(4, 1fr);
}




.body-main-bd-item {
	line-height: 22px;
	margin-bottom: .8rem;
	letter-spacing: .2px;
}
/* .body-main-bd-item:last-child {
	margin-bottom: 0;
} */
.body-main-bd-item h4 {
	color: #444;
	font-weight: 400;
	font-size: 1rem;
	margin-bottom: .25rem;
	display: flex;
	align-items: center;
}
.body-main-bd-item h4 .badge {
	font-weight: 400;
	margin-left: .5rem;
	transform: scale(.7);
	text-transform: uppercase;
	border: 1px solid transparent;
}
.body-main-bd-item h4 .badge-hot {
	color: #dc3545;
	border-color: #dc3545;
}
.body-main-bd-item h4 .badge-new {
	color: var(--primary);
	border-color: var(--primary);
}
.body-main-bd-item p {
	font-size: .815rem;
	color: rgba(34, 34, 34, 0.5);
	margin-bottom: 0;
}
.body-main-bd-item:hover {
	text-decoration: none;
	/* background-color: #f4f4f8; */
	transition: .25s;
}
.body-main-bd-item:hover h4 {
	color: var(--primary);
}
.dropdown-body-menu-list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.dropdown-body-menu-list li {
	cursor: pointer;
	line-height: 50px;
	font-size: 15px;
	font-weight: 700;
	text-align: right;
	padding-right: 30px;
	border-bottom: 1px solid #ebf0fc;
}
.dropdown-body-menu-list li.active {
	color:  var(--primary-hover);
	background-color: #f9faff;
	box-shadow: inset -2px 0px 0px 0px  var(--primary-hover);
}
.dropdown-body-main {
	flex: 1;
	padding: 0 1.5rem;
	border-right: 1px solid #ebf0fc;
}
.dropdown-body-main .tabs-content {
	display: none;
}
.dropdown-body-main .tabs-content.active {
	display: block;
}
.dropdown-body .card {
	border-color: #ebf0fc;
}
.dropdown-body .card:hover {
	background-color: #f9faff;
	text-decoration: none;
	border-color:  var(--primary-hover);
	color:  var(--primary-hover);
}
.dropdown-body .card .card-text {
	color: #444;
}
.dropdown-body .card:hover .card-text {
	color: #444;
}
.dropdown-body-box {
	flex: 1;
	padding: 0 1.5rem;
}
.btn-thememode > a > div {
	display: flex;
	align-items: center;
	font-size: 12px;
	overflow: hidden;
	border-radius: .25rem;
	border: 1px solid #9ba0a4;
	vertical-align: middle;
	transform: scale(.9);
}
.btn-thememode > a > div > div {
	padding: 0px 5px;
}
.btn-thememode > a > div .active {
	color: #FFF;
	background-color: var(--primary);
}
/* swiper */
.wrap-main-swiper {
	overflow: hidden;
	position: relative;
	/* background: linear-gradient(360deg,#062bca 3.55%,#295dff 99.56%); */
	background-position: center;
	background-size: auto 610px;
}
.wrap-main-swiper .swiper-slide {
	background-repeat: no-repeat;
	background-position: top center;
	background-size: auto 550px;
	height: 550px;
	position: relative;
	overflow: hidden;
	
	display: flex;
	align-items: center;
}
.wrap-main-swiper .swiper-slide-mp4 video {
	position: absolute;
	height: 100%;
	left: 50%;
	top: 50%;
	z-index: 10;
	transform: translate(-50%,-50%);
}
.wrap-main-swiper .content-slide {
	padding: 0;
	font-size: 18px;
	max-width: 560px;
	position: relative;
	z-index: 20;
}
.wrap-main-swiper .content-slide .slogan {
	font-size: 40px;
	font-weight: 400;
	letter-spacing: -3px;
	line-height: 120%;
	margin-bottom: 1.5rem;
}
.wrap-main-swiper .content-slide .sub-slogan {
	opacity: .8;
	margin-bottom: 3rem;
	padding-right: 50px;
}
.wrap-main-swiper .content-slide .btn {
	padding: 0;
	line-height: 48px;
	min-width: 180px;
	border-radius: 3px;
}
.wrap-main-swiper .content-slide img {
	position: absolute;
	left: 50px;
	top: -70px;
	max-height: 700px;
	z-index: -1;
}
.swiper-pagination-bullets {
	text-align: left !important;
	top: -120px;
}
.swiper-pagination-bullet {
	cursor: pointer;
	margin: 0 3px;
	border-radius: .5rem !important;
	opacity: 1 !important;
	width: 40px !important;
	height: 5px !important;
	background-color: #FFF !important;
}
.swiper-pagination-bullet-active {
	background-color:  var(--primary) !important;
}
.swiper-media {
	margin: -55px 0;
	z-index: 100;
	position: relative;
}
.swiper-media-items {
	overflow: hidden;
	border-radius: 10px;
	backdrop-filter: blur(20px);
	border: 1.5px solid #fff;
	background-color: rgba(255,255,255,.6);
	box-shadow: 0 4px 33px rgb(190 196 207 / 28%);
	display: flex;
	align-items: center;
}
.swiper-media-item {
	flex: 1;
	color: #4a5072;
	height: 110px;
	display: flex;
	align-items: center;
	position: relative;
	padding: 0 1.3rem;
	overflow: hidden;
	border-radius: 8px;
	backdrop-filter: blur(20px);
	border: 1.5px solid #fff;
	background-color: rgba(255,255,255,.6);
	box-shadow: 0 4px 33px rgb(190 196 207 / 28%);
}
.swiper-media-item:after {
	content: '';
	right: 0px;
	top: 50%;
	width: 1px;
	height: 50px;
	background-color: #ebf0fc;
	position: absolute;
	margin-top: -25px;
}
.swiper-media-item:hover {
	color: #4a5072;
	text-decoration: none;
}
.swiper-media-item img {
	max-width: 43px;
}
.swiper-media-item .media-body {
	
}
.swiper-media-item .media-title {
	font-size: 18px;
	line-height: 24px;
	font-weight: 500;
	color: #282c33;
	margin-bottom: 5px;
}
.swiper-media-item .media-text {
	line-height: 24px;
	color: #9599a8;
	font-size: 14px;
}
.swiper-media-item-last {
	background-image: linear-gradient(to bottom, #3D70FF 0%, rgba(61, 112, 255, 0.85) 100%);
	border-color: rgba(61, 112, 255, 0.45);
	box-shadow: 8px 8px 20px 0 rgba(61, 112, 255, 0.4);
}
.swiper-media-item-last .media-title,
.swiper-media-item-last .media-text {
	color: #FFF;
}
.swiper-media-item:last-child:after {
	display: none;
}
.main-header {
	text-align: center;
	margin-bottom: 5rem;
}
.main-title {
	font-size: 40px;
}
.main-header p {
	font-size: 16px;
}
.main-products-menu {
	border-bottom: 2px solid #e7e8ef;
}
.main-products-menu .nav .nav-link {
	color: #333;
	font-size: 18px;
	line-height: 30px;
	margin-bottom: -2px;
}
.main-products-menu .nav .nav-link.active {
	color: #096eff;
	border-radius: 0;
	box-shadow: inset 0 -2px 0 0 #096eff;
	background-color: transparent;
}
.main-products {
	padding-top: 120px !important;
	background: #f5f7fc;
	background-image: linear-gradient(0deg,#f5f7fc,#f0f1f7);
}
.main-products-body {
	border-radius: 3px;
	background-color: #FFF;
	box-shadow: 0 4px 40px 0 rgb(0 0 0 / 10%);
}
.main-products-body.style2 {
	border-radius: 0;
	background-color: transparent;
	box-shadow: none;
}
.product-detail {
	display: flex;
}
.product-detail-side {
	width: 350px;
	padding-right: 32px;
	margin-bottom: 0;
}
.product-detail-main {
	flex: 1;
}
.product-detail-wrap {
	display: flex;
}
.product-detail-column {
	width: calc(33.33333% - 5.33333px);
	background: #fff no-repeat;
	background-size: 100% 160px;
	border-radius: 8px;
	flex: 1 1 auto;
	padding: 25px 0 34px;
	position: relative;
	margin-right: 16px;
	border: 1.5px solid #fff;
	box-shadow: 0 4px 60px 0 rgba(0,28,85,.04);
}
.product-detail-column:first-child {
	background-image: linear-gradient(0deg,rgba(209,227,255,0),#d1e3ff);
}
.product-detail-column:first-child .column-bg {
	background-image: url(https://cdn-image.templetes2024l.com/2024/resource/tos_41aea0d23743cdc0093a2b54378eb2ed.png);
}
.product-detail-column:first-child .column-wrap {
	border-bottom-color: #ddedff;
}
.product-detail-column:first-child .column-title {
	color: #1357bd;
}
.product-detail-column:first-child .column-subtitle {
	color: #1357bdcc;
}
.product-detail-column:nth-child(2) {
	background-image: linear-gradient(0deg,rgba(202,240,248,0),#caeff8);
}
.product-detail-column:nth-child(2) .column-bg {
	background-image: url(https://cdn-image.templetes2024l.com/2024/resource/tos_7fe1c3decf58fca69936928ac762d675.png);
}
.product-detail-column:nth-child(2) .column-wrap {
	border-bottom-color: #d5f1f2;
}
.product-detail-column:nth-child(2) .column-title {
	color: #0d72aa;
}
.product-detail-column:nth-child(2) .column-subtitle {
	color: rgba(13,114,170,.8);
}
.product-detail-column:nth-child(3) {
	margin-right: 0;
	background-image: linear-gradient(0deg,hsla(0,0%,100%,0),#e6e1fa);
}
.product-detail-column:nth-child(3) .column-bg {
	background-image: url(https://cdn-image.templetes2024l.com/2024/resource/tos_863f2fa36883229c29fcf407db6faa66.png);
}
.product-detail-column:nth-child(3) .column-wrap {
	border-bottom-color: #e9e6f2;
}
.product-detail-column:nth-child(3) .column-title {
	color: #5c43a4;
}
.product-detail-column:nth-child(3) .column-subtitle {
	color: rgba(92,67,164,.8);
}
.product-detail-column .column-bg {
	background-position: right 12px;
	background-repeat: no-repeat;
	background-size: contain;
	bottom: 0;
	height: 102px;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1;
}
.column-wrap {
	border-bottom: 1px solid;
	border-radius: 8px 8px 0 0;
	margin: 0 32px 22px;
	padding-bottom: 25px;
}
.column-title {
	font-size: 24px;
	font-weight: 500;
	line-height: 32px;
}
.column-subtitle {
	color: rgba(19,87,189,.8);
	font-size: 14px;
	line-height: 22px;
}
.column-link {
	display: block;
	padding: 16px 32px;
}
.column-link:hover {
	text-decoration: none;
}
.column-link-hd {
	display: flex;
	align-items: center;
	margin-bottom: 8px;
	color: #000;
}
.column-link:hover .column-link-title {
	color: #0052d9;
}
.column-link-title {
	font-weight: 500;
	font-size: 18px;
	color: inherit;
	line-height: 24px;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-bottom: 0;
}
.column-link-desc {
	margin-bottom: 8px;
	font-size: 14px;
	color: #3d485d;
	line-height: 22px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.column-link-tags {
	
}
.column-link-tag {
	display: inline-block;
	vertical-align: middle;
	padding: 0 12px;
	box-sizing: border-box;
	font-size: 12px;
	line-height: 26px;
	color: #41464f;
	border: 1px solid #dde2e9;
	border-radius: 4px;
	margin-right: 8px;
}
.column-link-marks {
	margin-left: 8px;
	white-space: nowrap;
}
.column-link-bubble {
	display: inline-block;
	vertical-align: middle;
	padding-left: 4px;
}
.column-link-bubble:last-child {
	margin-right: 0;
}
.column-link-bubble-inner22 {
	display: inline-block;
	vertical-align: middle;
	position: relative;
	padding: 0 8px;
	height: 22px;
	box-sizing: border-box;
	font-size: 12px;
	line-height: 22px;
	color: #fff;
	background-color: #28a745;
	border-radius: 2px;
	border-bottom-left-radius: 0;
}

.column-link-bubble-inner {
	display: inline-block;
	vertical-align: middle;
	position: relative;
	padding: 0 8px;
	height: 22px;
	box-sizing: border-box;
	font-size: 12px;
	line-height: 22px;
	color: #fff;
	background-color: #f64041;
	border-radius: 2px;
	border-bottom-left-radius: 0;
}

.column-link-bubble-inner3:after {
	content: "";
	position: absolute;
	right: 100%;
	bottom: 0;
	width: 0;
	height: 0;
	border-color: transparent #1673ff #1673ff transparent;
	border-style: solid;
	border-width: 2px 3px;
}
.column-link-bubble-inner3 {
	display: inline-block;
	vertical-align: middle;
	position: relative;
	padding: 0 8px;
	height: 22px;
	box-sizing: border-box;
	font-size: 12px;
	line-height: 22px;
	color: #fff;
	background-color: #1673ff;
	border-radius: 2px;
	border-bottom-left-radius: 0;
}
.column-link-bubble-inner:after {
	content: "";
	position: absolute;
	right: 100%;
	bottom: 0;
	width: 0;
	height: 0;
	border-color: transparent #f64041 #f64041 transparent;
	border-style: solid;
	border-width: 2px 3px;
}





.product-recommend {
    background-color: #f3f5f8;
    background-image: url("../img/w45wr.webp"),linear-gradient(180deg,#f3f5f8,#fff 178px,#fff);
    background-size: 340px auto,auto;
    background-position: 100% 0;
    background-repeat: no-repeat;
    border: 2px solid #fff;
    box-shadow: 8px 8px 20px 0 rgb(55 99 170 / 10%), -8px -8px 20px 0 #fff;
    border-radius: 4px;
    padding: 18px;
    box-sizing: border-box;
    height: 150px;
    position: relative;
    margin-bottom: 2rem;
}

.product-recommend:last-child {
    margin-bottom: 0;
}

.product-recommend-link {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.product-recommend-hd {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    color: #000;
}

.product-recommend-title {
    font-weight: 500;
    font-size: 20px;
    color: inherit;
    line-height: 28px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 0;
}

.product-recommend:hover .product-recommend-title {
    color: #0052d9;
}

.product-recommend-desc {
    font-size: 14px;
    color: #3d485d;
    line-height: 22px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.product-recommend-btns {
    margin-top: 16px;
    display: flex;
    position: relative;
    z-index: 2;
}

.product-recommend-btns .btn:first-child {
    margin-left: 0;
    position: relative;
}

.product-recommend-btns .btn {
    flex: 1;
    margin-left: 12px;
    min-width: 0;
    padding: 0 12px;
    height: 36px;
    line-height: 36px;
}

.product-detail-lists {
    display: grid;
    grid-gap: 2.5rem;
    grid-template-columns: repeat(3, auto);
}

.clientarea-body .product-detail-lists {
    grid-gap: 1rem;
}

.product-detail-list:hover {
    text-decoration: none;
}

.product-detail-list-hd {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    color: #000;
}

.product-detail-list:hover .product-detail-list-title {
    color: #0052d9;
}

.product-detail-list-title {
    font-weight: 500;
    font-size: 16px;
    color: inherit;
    line-height: 24px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 0;
}

.product-detail-list-desc {
    margin-bottom: 8px;
    font-size: 14px;
    color: #3d485d;
    line-height: 22px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.product-detail-list-tags {
}

.product-detail-list-tag {
    display: inline-block;
    vertical-align: middle;
    padding: 0 8px;
    height: 22px;
    box-sizing: border-box;
    font-size: 12px;
    line-height: 20px;
    color: #98a3b7;
    border: 1px solid rgba(157,173,193,.5);
    border-radius: 2px;
    margin-right: 8px;
}

.product-detail-list-marks {
    margin-left: 8px;
    white-space: nowrap;
}

.product-detail-list-bubble {
    display: inline-block;
    vertical-align: middle;
    padding-left: 4px;
}

.product-detail-list-bubble:last-child {
    margin-right: 0;
}

.product-detail-list-bubble-inner {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    padding: 0 8px;
    height: 22px;
    box-sizing: border-box;
    font-size: 12px;
    line-height: 22px;
    color: #fff;
    background-color: #f64041;
    border-radius: 2px;
    border-bottom-left-radius: 0;
}

.product-detail-list-bubble-inner:after {
    content: "";
    position: absolute;
    right: 100%;
    bottom: 0;
    width: 0;
    height: 0;
    border-color: transparent #f64041 #f64041 transparent;
    border-style: solid;
    border-width: 2px 3px;
}

.page-product-aside {
    padding-right: 0;
}

.page-product-body-aside {
    height: 483px;
    padding: 28px 32px;
    background-color: #077cff;
    background-image: url("../img/bg-product-aside.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 4px 0 0 4px;
    box-sizing: border-box;
}

.page-product-body-title {
    line-height: 32px;
    font-size: 24px;
    color: #FFF;
    font-weight: 400;
    margin-bottom: 16px;
}

.page-product-body-data {
    color: #FFF;
    margin: 0 0;
    padding: 0;
    list-style: none;
}

.page-product-body-data li {
    line-height: 24px;
    font-size: 14px;
}

.page-product-body-data li + li {
    margin-top: 16px;
}

.page-product-body-foot {
    margin-top: 46px;
}

.page-product-body-foot .btn {
    width: 100px;
}

.page-product-list [class*=col-] {
    padding: 0;
    border-right: 1px solid #E5E8ED;
    border-bottom: 1px solid #E5E8ED;
}

.page-product-list [class*=col-]:nth-child(2n) {
    padding-right: 15px;
    border-right: none;
}

.page-product-list [class*=col-]:nth-child(5n), .page-product-list [class*=col-]:nth-child(6n) {
    border-bottom: none;
}

.page-product-card {
    padding: 25px;
    display: block;
}

.page-product-card:hover {
    color: inherit;
    text-decoration: none;
    box-shadow: 0 4px 8px 0 rgb(0 110 255 / 12%);
}

.page-product-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .5rem;
}

.page-product-card-title {
    color: #333;
    line-height: 24px;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 0;
}

.page-product-card-price {
    color: #ff7900;
    font-weight: 500;
    font-size: 16px;
}

.page-product-card-desc {
    color: #999;
}

.page-product-card-body ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
}

.page-product-card-body ul li {
    flex: 1;
    color: #000;
}

.page-product-card-body ul li span {
    display: block;
    color: #999;
    line-height: 24px;
    font-size: 12px;
}

.left-tools {
    display: flex;
    align-items: center;
}

.left-tools > .btn {
    margin-right: .8rem;
}

.left-tools .btn-default {
    border-color: #AAA;
    background-color: transparent;
}

.right-tools {
    display: flex;
    align-items: center;
}

.right-tools button {
    border: 0 none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    font-size: 18px;
}

.changeViews {
    margin-left: 1.5rem;
}

.changeViews {
    display: flex;
    overflow: hidden;
    border-radius: .25rem;
}

.changeViews > button {
    border: 0 none;
    cursor: pointer;
    flex: 1 1 50%;
    background-color: #FFF;
}

.changeViews > button:focus, .changeViews > button:hover, .changeViews > button.active {
    color: var(--primary);
    outline: none;
    background-color: #a8bff2;
}

.main-solution {
    background-size: cover;
    background-image: url("../img/9r9c9.png");
}

.main-solution-body .main-solution-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 180px;
    padding: 0 16px 0 26px;
    position: relative;
    margin-bottom: 3rem;
    border-radius: .5rem;
    background-color: #fbfcfd;
    transition: all .3s ease-in-out;
    box-shadow: 0 12px 18px 2px rgb(204 204 204 / 17%);
}

.main-solution-body .main-solution-item:hover {
    background-color: #fff;
    transform: translateY(-20px);
}

.main-solution-body .main-solution-item img {
    width: 110px;
}

.main-solution-body .main-solution-item h4 {
    margin-bottom: 16px;
    line-height: 28px;
    font-size: 20px;
    font-weight: 500;
}

.main-solution-body .main-solution-item p {
    line-height: 22px;
    color: #848b99;
    margin-bottom: 0;
}

.main-services-item {
    padding: 50px 28px;
    height: 400px;
    overflow: hidden;
    border-radius: .8rem;
    box-sizing: border-box;
    background-size: 110%;
    transition: all .3s ease-in-out;
    background-position: bottom;
    background-color: #e5eaf6;
}

.main-services-item:hover {
    transform: translateY(-20px);
}

.main-services-item-1 {
    background-image: url("../img/simple_bg.png");
}

.main-services-item-1:hover {
    background-image: url("../img/simple_hover_bg.png");
}

.main-services-item-2 {
    background-image: url("../img/data_bg.png");
}

.main-services-item-2:hover {
    background-image: url("../img/data_hover_bg.png");
}

.main-services-item-3 {
    background-image: url("../img/intelligence_bg.png");
}

.main-services-item-3:hover {
    background-image: url("../img/intelligence_hover_bg.png");
}

.main-services-item-4 {
    background-image: url("../img/export_bg.png");
}

.main-services-item-4:hover {
    background-image: url("../img/export_hover_bg.png");
}

/* maps */
.intl-map {
    position: relative;
}

.intl-map-object {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    max-width: 92.2882%;
    box-sizing: border-box;
    z-index: 2;
}

.intl-map-bg-pc {
    position: relative;
    padding-top: 48.944%;
    width: 100%;
    height: 0;
    font-size: 0;
    box-sizing: border-box;
}

.intl-map-bg-pc img {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.intl-map-bg-mb {
    display: none;
}

.intl-map-dot-group {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.intl-map-dot-group {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box
}

.intl-map-dot {
    position: absolute;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    cursor: pointer
}

.intl-map-dot::after {
    content: "";
    display: block;
    width: 48px;
    height: 48px;
    visibility: hidden;
    opacity: 0
}

.intl-map-dot-layer, .intl-map-dot::after {
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: 50%;
    border-style: solid;
    border-width: 1px;
    box-sizing: border-box;
    transform: translate(-50%, -50%);
}

.intl-map-dot-group.anim .intl-map-dot-layer {
    animation: fadeIn .3s ease-out forwards
}

.intl-map-dot.active .intl-map-dot-layer, .intl-map-dot:hover .intl-map-dot-layer {
    opacity: 0;
    visibility: hidden
}

.intl-map-dot.active::after, .intl-map-dot:hover::after {
    opacity: 1;
    visibility: visible;
    animation: fadeInLarger .5s ease-out forwards
}

@keyframes fadeIn2 {
    0% {
        opacity: 0;
        width: 6px;
        height: 6px
    }

    100% {
        opacity: 1;
        width: 22px;
        height: 22px
    }
}

@keyframes fadeInLarger {
    0% {
        width: 22px;
        height: 22px
    }

    100% {
        width: 36px;
        height: 36px
    }
}

.intl-map-dot.style-1 {
    background: #006EFF
}

.intl-map-dot.style-1 .intl-map-dot-layer, .intl-map-dot.style-1::after {
    background: rgba(0, 110, 255, .1);
    border-color: rgba(0, 110, 255, .2)
}

.intl-map-dot.style-2 {
    background: #FF7800
}

.intl-map-dot.style-2 .intl-map-dot-layer, .intl-map-dot.style-2::after {
    background: rgba(255, 120, 0, .1);
    border-color: rgba(255, 120, 0, .2)
}

.intl-map-dot-tit {
    position: absolute;
    top: 50%;
    line-height: 1;
    font-size: 12px;
    color: #666;
    white-space: nowrap;
    transform: translateY(-50%);
}

.intl-map-dot-tit.pos-left {
    margin-right: 4px;
    right: 100%
}

.intl-map-dot-tit.pos-right {
    margin-left: 4px;
    left: 100%
}

.intl-map-bubble {
    position: absolute;
    z-index: 6;
    left: 50%;
    bottom: 100%;
    margin-left: -100px;
    margin-bottom: 12px;
    width: 200px;
    text-align: center;
    transition: .3s all ease-out;
    opacity: 0;
    visibility: hidden;
    transform: translateY(5px);
    cursor: default;
    pointer-events: none;
    box-sizing: border-box
}

.intl-map-bubble-inner {
    position: static !important;
    left: 50%;
    top: 50%;
    min-width: 196px;
    line-height: 18px;
    font-size: 12px;
    text-align: left;
    background-color: #fff;
    border: 1px solid #006EFF;
    border-radius: 4px;
    box-shadow: 0 4px 8px 0 rgba(3, 27, 78, .12);
    box-sizing: border-box
}

.intl-map-bubble-tit {
    line-height: 24px;
    font-size: 14px;
    color: #006EFF;
    background: #EBF4FF;
    border-radius: 4px 4px 0 0;
    padding: 8px 16px;
    font-weight: 500
}

.intl-map-bubble-detail {
    margin-top: 4px;
    line-height: 20px;
    font-size: 14px;
    color: #000;
    padding: 8px 16px
}

.intl-map-bubble-detail-item {
    margin-bottom: 4px
}

.intl-map-bubble-detail-item::after {
    content: "";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden
}

.intl-map-bubble-detail-tip {
    float: right;
    margin-left: 16px
}

.intl-map-bubble-detail-main {
    overflow: hidden
}

.intl-map-bubble-inner::after, .intl-map-bubble-inner:before {
    content: "";
    position: absolute;
    top: 100%;
    left: inherit;
    right: inherit;
    margin-top: -1px;
    margin-left: -8px;
    width: 0;
    height: 0;
    font-size: 0;
    border: 8px dashed transparent;
    border-top-style: solid;
    box-sizing: border-box
}

.intl-map-bubble-inner::before {
    border-top-color: #006EFF
}

.intl-map-bubble-inner::after {
    margin-top: -2px;
    border-top-color: #fff
}

.intl-map-dot.activ, .intl-map-dot:hover {
    z-index: 3
}

.intl-map-dot.active .intl-map-bubble, .intl-map-dot:hover .intl-map-bubble {
    opacity: 1;
    visibility: visible;
    transform: translateY(0)
}

.intl-map-main {
    position: absolute;
    left: 0;
    bottom: 20px
}

.intl-map-data-item + .intl-map-data-item {
    margin-top: 20px
}

.intl-map-data-tit {
    line-height: 32px;
    font-size: 32px;
    color: #000;
    font-weight: 700
}

.intl-map-data-desc {
    margin-top: 4px;
    line-height: 20px;
    font-size: 14px;
    color: #000
}

.intl-map-explain {
    margin-top: 40px
}

.intl-map-explain-item + .intl-map-explain-item {
    margin-top: 12px
}

.intl-map-explain-item {
    position: relative;
    padding-left: 32px
}

.intl-map-explain-item .intl-map-dot {
    position: absolute;
    top: 9px;
    left: 9px
}

.intl-map-explain-item .intl-map-dot-layer {
    width: 24px;
    height: 24px
}

.intl-map-explain-text {
    line-height: 24px;
    font-size: 14px;
    color: #000
}

.intl-map-annotations2 {
    display: none
}

.intl-map-annotations {
    margin-top: 40px
}

.intl-map-annotations-text {
    max-width: 266px;
    color: rgba(255, 255, 255, .7);
    font-size: 14px;
    line-height: 18px
}



body.login header#header,
body.clientregister header#header {
	background-color: transparent !important;
}
.login-container {
	width: 100%;
	padding: 120px 0 100px;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	height: 100vh;
	
	background-image: url("https://cdn-image.templetes2024l.com/2024/resource/168845e55aa0417b97b84088aacfef78.jpeg");
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 100vh;
}
.login-wrapper {
	display: flex;
}
.login-bg {
	width: 600px;
	padding: 4rem;
}
.login-body {
	flex: 1;
	width: 460px;
	max-width: 460px;
	padding: 4rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-color: #FFF;
	border-radius: 20px;
	box-shadow: 0 5px 15px rgba(0,0,0,.05);
	position: relative;
	overflow: hidden;
}
.login-loading {
	position: relative;
	overflow: hidden;
}
.login-loading:before {
	background-color: rgba(255,255,255,.6);
	bottom: 0;
	content: "";
	height: 100%;
	left: 0;
	opacity: 1;
	pointer-events: auto;
	position: absolute;
	right: 0;
	top: 0;
	transition: opacity .1s linear;
	width: 100%;
	z-index: 1;
}
.arco-spin-icon {
	color: var(--primary);
	font-size: 20px;
	position: absolute;
	z-index: 2;
	left: 50%;
	transform: translate(-50%,-50%);
}
.arco-icon-loading {
	display: inline-block;
	color: inherit;
	font-style: normal;
	width: 1em;
	height: 1em;
	vertical-align: -2px;
	animation: arco-loading-circle 1s linear infinite;
}
@keyframes arco-loading-circle {
	to {
		transform:rotate(1turn)
	}
}
.login-body .form-control {
	height: 42px;
}
.login-body .agreement {
	font-size: 12px;
	color: #7f8792;
}
.login-body .agreement a {
	color: #000;
	margin: 0 2px;
}

.login-body .login-or {
	position: relative;
    margin-bottom: 4px;
    color: rgba(0,0,0,.25);
    font-size: 12px;
    line-height: 22px;
    text-align: center;
}
.login-body .login-or:after,
.login-body .login-or:before {
    position: absolute;
    top: 50%;
    right: 0;
    width: 44%;
    height: 1px;
    background-color: #e8eaec;
    content: "";
    transform: translateY(-50%);
}
.login-body .login-or:before {
	left: 0;
}
.login-body .social-login .btn:hover {
	color: #007bff;
    border-color: #007bff;
    background-color: transparent;
}
/* Sidebar */
.sidebar-sticky {
    height: 100%;
    padding-top: 1.5rem;
    background-color: #1e222d;
}

.sidebar-sticky .nav-title {
    padding: 18px 0 5px 20px;
    color: #7c878e;
    font-size: 12px;
}

.sidebar-sticky .nav-link {
    color: #c1c6c8;
    padding: 9px 0 9px 20px;
    display: flex;
    align-items: center;
    border-radius: 4px;
}

.sidebar-sticky .nav-link i {
    color: #7c878e;
    margin-right: 8px;
    font-size: 20px;
    text-align: center;
}

.sidebar-sticky .nav-link span:first-child {
    flex: 1;
}

.sidebar-sticky .nav-link:hover {
    background-color: #262f3e;
}

.sidebar-sticky .nav-link.active {
    color: #FFF;
    background-color: var(--primary);
}

.sidebar-sticky .nav-link.active i {
    color: #FFF;
}

.side-white .sidebar-sticky {
    background-color: #f9fafc;
    border-right: 1px solid #f0f1f3;
    padding-right: 12px;
    padding-left: 12px;
}

.side-white .sidebar-sticky .nav-link {
    color: #7c878e;
}

.side-white .sidebar-sticky .nav-link:not(.active):hover {
    background-color: #1664ff2e;
    color: #1664ff;
}

.side-white .sidebar-sticky .nav-link:not(.active):hover i {
    color: #1664ff;
}
.side-white .sidebar-sticky .nav-link.active {
    color: #FFF;
}

/* WHMCS ClientArea */
.page-container {
    height: 100%;
    position: relative;
}

.page-body {
    transition: all cubic-bezier(.4,0,.2,1) .2s;
    position: absolute;
    left: 200px;
    top: 0;
    right: 0;
    bottom: 0;
}

.page-body .card {
    border-color: #eef0f8;
}

.page-side {
    position: fixed;
    top: 60px;
    width: 200px;
    display: inline-block;
    height: 100%;
    vertical-align: top;
}

/* Subtop */
.subtop {
    padding: 70px 0;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    background-image: url("../img/common_banner_bg_templetes2024.jpg");
    padding-top: 140px;
}

.subtop .subtop-info {
    color: #FFF;
    font-size: 16px;
}

.subtop .subtop-title {
    color: #181818;
    font-family: PingFang SC;
    font-size: 44px;
    font-style: normal;
    font-weight: 500;
    height: 52px;
    letter-spacing: .002em;
    line-height: 52px;
}

.subtop-info p {
    color: hsla(0,0%,9%,.8);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    margin-top: 12px;
    width: 100%;
}

.subtop .subtop-title small {
    font-size: 20px;
    margin-left: 1rem;
}

/* ACT */
.pages-actindex {
    background-color: #FFF;
}

.act-hd {
    margin-bottom: 4rem;
}

.act-title {
    font-size: 28px;
    color: #16181A;
    line-height: 48px;
    font-weight: 500;
}

.act-tit-dazzing {
    color: #0052D9;
    position: relative;
    display: inline-block;
}

.act-tit-routine::before {
    content: "";
}

.act-desc {
    font-size: 16px;
    color: #666;
    line-height: 22px;
}

.actindex-hd {
    margin-top: -60px;
}

.act-selllist-item {
    height: 180px;
    border: 1px solid #E5E8ED;
    box-shadow: 0 2px 4px 0 rgb(178 178 178 / 20%);
    box-sizing: border-box;
    padding: 16px 20px;
    position: relative;
    margin-bottom: 2rem;
    background-color: #FFF;
    cursor: pointer;
}

.act-selllist-item:hover {
    padding-top: 15px;
    transform: translate(0,-1px);
    border: 1px solid #0052D9;
}

.act-selllist-item-first {
    color: #FFF;
    padding: 2rem 20px;
    background-size: cover;
    background-image: url("../img/act/k97nc.png");
}

.act-selllist-item-first:hover {
    padding-top: 2rem;
}

.act-selllist-item-first .act-selllist-tit {
    color: #FFF;
    border-bottom: 0 none;
}

.act-selllist-item-first .act-selllist-subtit {
    color: rgba(255,255,255,.8);
}

.act-selllist-link {
    width: 100%;
    height: 100%;
    display: inline-block;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    pointer-events: auto;
}

.act-selllist-tit-tag {
    margin-left: -46px;
    display: inline-block;
    padding-left: 8px;
    width: 38px;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
    vertical-align: middle;
    background-image: url("../img/hot.svg");
    background-repeat: no-repeat;
    background-size: cover;
    height: 18px;
}

.act-selllist-tit-tag-con {
    background-color: #FF6000;
    height: 18px;
    line-height: 18px;
    width: 100%;
    display: none;
    color: #FFF;
    font-size: 12px;
    font-weight: 300;
    text-align: center;
}

.act-selllist-icon {
    position: absolute;
    width: 158px;
    height: 100px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    z-index: 0;
    right: 0;
    bottom: 0;
    background-image: url("../img/5wjtu.svg");
}

.act-selllist-con {
    height: 100%;
    position: relative;
    z-index: 2;
    box-sizing: border-box;
    padding-bottom: 56px;
    pointer-events: none;
}

.act-selllist-tit {
    white-space: nowrap;
    white-space: nowrap;
    padding-bottom: 4px;
    margin-bottom: 4px;
    border-bottom: 1px solid #EAEDF4;
    color: #000;
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    transition: color .2s linear;
}

.act-selllist-tit-txt {
    display: inline-block;
    box-sizing: border-box;
    vertical-align: middle;
    padding-right: 46px;
}

.act-selllist-subtit {
    font-size: 14px;
    color: #666;
    line-height: 22px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.act-selllist-code {
    position: absolute;
    left: 0;
    bottom: 0;
}

.act-selllist-promocode {
    font-size: 18px;
    margin-bottom: 0;
    text-transform: uppercase;
}

.act-selllist-promocode .act-selllist-warm-txt {
    font-size: 14px;
}

.act-selllist-price {
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 4px;
}

.act-selllist-warm-txt {
    color: #FF6000;
}

/* WHMCS */
section#main-body {
    padding: 0;
    position: absolute;
    width: 100%;
    top: 70px;
    height: 100%;
}

.main-content {
    margin-bottom: 0;
}

.main-content .card {
    margin-bottom: 1.5rem;
}

.main-content h3.card-title {
    font-size: 1.25rem;
    font-weight: 400;
}

.main-content .form-check {
    padding-left: 0;
}

.bootstrap-switch.bootstrap-switch-small, .bootstrap-switch.bootstrap-switch-mini {
    min-width: 55px;
    line-height: auto;
}

/* displayéšè— */
.marketing-email-optin {
    padding: 20px;
    margin: 0 0 20px 0;
    background-color: #f8f8f8;
    border-radius: 3px;
    display: none;
}

#registration label {
    font-weight: 400;
    font-size: 16px;
}

#registration .checkbox {
    margin-top: 0;
    margin-bottom: 20px;
}

.checkbox label, .radio label {
    padding-left: 0;
}

/* clientarea-home */
.main-container {
    padding: 1.5rem 0;
}

.clientarea-home .card {
    margin-bottom: 22px;
    border: 0px solid #f1f2f3;
    box-shadow: 0px 1px 3px 0px rgb(0 0 0 / 3%);
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0,0,0,.05);
}

.clientarea-home .card .card-header {
    border-bottom: 1px solid #f1f2f3;
    background-color: transparent;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.clientarea-home .card .card-header .btn:hover {
    color: #FFF;
}

.clientarea-home .card .card-header .card-title {
    color: #666;
    font-size: 1rem;
    font-weight: 600;
    line-height: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.clientarea-home .card .card-body {
    padding: 1rem 1.25rem;
    position: relative;
    max-height: inherit;
    overflow: hidden;
}

.clientarea-home .card .card-body ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.clientarea-home .card .card-body ul li.list-group-item {
    padding: 10px 1.25rem;
    border: 0 none;
    border-bottom: 1px solid #f1f2f3;
}

.clientarea-home .card .card-body li.list-group-item .date {
    color: #AAA;
}

.clientarea-home .card .card-body li h5 {
    color: #333;
    font-size: 1rem;
    margin-bottom: 0;
}

.clientarea-home .card .card-body li a {
    display: block;
}

.clientarea-home .card .card-body a, .clientarea-home .card .card-body a:hover {
    text-decoration: none;
}

.clientarea-home .card-item {
    display: flex;
    margin: .5rem 0 .75rem;
}

.clientarea-home .card-item .card-item-icon {
    height: 48px;
    width: 48px;
    margin-right: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f4f6fc;
    color: #7d848e;
    font-size: 24px;
    line-height: 1;
}

.clientarea-home .card-item .card-item-title {
    color: #444;
    margin-bottom: 4px;
}

.clientarea-home .card-item:hover .card-item-title {
    color: #076dff;
}

.clientarea-home .card-item .card-item-info {
    font-size: 12px;
    color: #888;
    display: flex;
    align-items: flex-start;
    word-break: break-word;
}

.home-billing-recent {
    display: flex;
}

.consumption-infos {
	flex: 0 0 28.57143%;
	min-width: 200px;
	width: 28.57143%;
	display: flex;
	flex-direction: column;
}
.consumption-info {
	background-color: #f6f8fa;
	border-radius: 8px;
	box-sizing: border-box;
	display: block;
	height: 110px;
	margin-top: 16px;
	padding: 16px 20px;
}
.consumption-info:first-child {
	margin-top: 0;
	height: auto;
	background-color: rgba(209,227,255,.45);
	border: 1px solid rgba(162,193,255,.1);
}


.consumption-chart {
	margin-left: 24px;
	flex: 0 0 71.42857%;
	max-width: calc(100% - 200px);
	width: 71.42857%;
}
.consumption-info {
    color: #888;
}

.consumption-info span {
    color: #333;
}

.current-month-number {
    margin: 16px 0 10px 0;
    font-size: 20px;
    color: #333;
    font-family: TCloudNumber;
}

.last-month-number {
    margin-top: 10px;
    font-size: 14px;
}

ul.reward-primary {
    display: flex;
}

ul.reward-primary > li {
    flex: 1;
    border-right: 1px solid #ebebeb;
    text-align: center;
}

ul.reward-primary > li:last-child {
    border-right: 0;
}

ul.reward-primary > li .money {
    color: #333;
    font-size: 2rem;
    font-family: TCloudNumber;
}

ul.reward-primary > li .symbol {
    font-size: 14px;
}

ul.reward-primary > li .money-label {
    font-size: 12px;
    color: rgba(85,85,85,.5);
}

ul.reward-secondary {
    margin-top: 20px;
}

ul.reward-secondary>li {
    display: flex;
    position: relative;
    line-height: 24px;
    font-size: 12px;
}

ul.reward-secondary>li .money-label {
    color: #333;
    flex: 1;
    color: #888;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.item-aff .links {
    margin-top: 16px;
    text-align: center;
}

.item-aff .inner {
    font-size: 12px;
    margin-top: 16px;
    margin-right: -17px;
    margin-left: -17px;
    padding: 12px 16px;
    color: #555;
    background-color: #ebf4fb;
}

.item-aff .share-links {
}

.no-data {
    min-height: 300px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column;
}

.no-data .icon-holder {
    background-image: url("../img/icon-no-openorder.svg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100%;
    width: 70px;
    height: 70px;
    margin: 0 auto 20px;
}

.avatar {
    border-radius: 50%;
    overflow: hidden;
}

.avatar-sm {
    width: 24px;
    height: 24px;
}

.avatar-md {
    width: 48px;
    height: 48px;
}

.avatar-lg {
	width: 64px;
	height: 64px;
}

.avatar img {
    max-width: 100%;
}



.card-body-info {
	display: flex;
	align-items: center;
	background-image: url("../img/avatar-bg.svg");
	background-position: 110px 14px;
	background-repeat: no-repeat;
	background-size: auto 100%;
	padding: 1.5rem;
}
.funds-item-info {
	display: flex;
	align-items: center;
	margin-bottom: 2rem;
}
.funds-item-labels {
	
}
.funds-item-label {
	color: #4e5969;	
	padding: 1px 8px;
	border-radius: 4px;
	box-shadow: 0 0 0 1px #dde2e9, 0 2px 1px rgba(0,0,0,.08);
	border: 0 none;
	background-color: #f6f8fa;
	margin-right: 8px;
}
.funds-item-text {
	
}
.funds-item-top {
	display: flex;
	align-items: center;
}
.funds-item-top small {
	margin-left: 1rem;
}
.funds-item-other {
	display: flex;
	margin: 0 -20px;
}
.funds-item {
	flex: 1;
	padding: 0px 20px;
	cursor: pointer;
	text-decoration: none;
}
.funds-item:last-child {
	margin-right: 0;
}
.funds-item:hover {
	text-decoration: none;
}
.funds-item-header {
	font-size: 13px;
	color: #888;
	line-height: 1.5;
}
.funds-item .funds-num {
	color: #000;
	font-size: 20px;
	font-family: TCloudNumber;
}
.funds-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.funds-header h5 {
	font-size: 12px;
}


/*
* Main-top
*/
.main-top {
    background-color: #FFF;
    margin: 0;
    padding: 1.25rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #eaedf1;
}

.main-top > .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.main-top h1 {
    color: #2a2e36;
    font-size: 1.6rem;
    font-weight: 400;
    margin-bottom: 0;
}

.main-top h1 small {
    font-weight: 400;
    line-height: 1;
    color: #777;
    margin-left: 10px;
    font-size: 1rem;
}

.main-top .breadcrumb {
    color: #4d5460;
    padding: 0;
    margin-bottom: 0;
    background-color: transparent;
}

.main-top .breadcrumb a {
    color: #a6abaf;
}

/* INVOICE */
@media (min-width: 992px) and (max-width: 1199px) {
    .invoice-container > div:last-child:not(.col-md-3) {
        width: 242px!important;
    }
}

.status-label {
    float: right;
    font-weight: 500;
    background-color: rgba(255, 255, 255, .1);
}

.invoice-logo img {
    max-width: 280px;
}

.invoice-top ul > li {
    position: relative;
    margin: 0 0 8px 0;
    text-align: right;
}

.invoice-top ul .list-label {
    display: inline-block;
    padding: 0 15px 0 0;
    color: #a1a6b2;
}

.invoice-status {
    color: #fff;
}

.invoice-status .status-id {
    padding-left: 44px!important;
}

.invoice-status.status-md .status-id {
    padding-right: 30px;
    text-align: right;
}

.invoice-status.status-md .status-label {
    font-weight: 700;
}

.panel-invoice .list-address, .panel-invoice address {
    font-size: 13px;
}

.invoice-info h5 {
    font-size: 14px;
    font-weight: bold;
}

.form-actions table, .form-actions table > tbody, .form-actions table > tbody > tr, .form-actions table > tbody > tr > td, .form-actions table > tbody > tr > td > form {
    display: block;
    width: 100%;
}

.form-actions table > tbody > tr > td:first-child {
    margin-bottom: 8px;
}

.invoice-table .table>tbody>tr>td, .invoice-table .table>tbody>tr>th, .invoice-table .table>thead>tr>td, .invoice-table .table>thead>tr>th, .invoice-table .table>tfoot>tr>td, .invoice-table .table>tfoot>tr>th {
    padding-left: 0;
}

.invoice-table .table>tfoot>tr:last-child>td {
    border-bottom: 0 none;
}

.table .table-summary > tr > td:first-child {
    text-align: right;
    vertical-align: middle;
    border-bottom: none;
}

@media (min-width: 768px) {
    .panel-invoice .row {
        margin-left: -20px;
        margin-right: -20px;
    }

    .panel-invoice [class*="col-"] {
        padding-left: 20px;
        padding-right: 20px;
    }

    .panel-invoice .table > tbody > tr > td, .panel-invoice .table > thead > tr > th, .panel-invoice .table > tfoot > tr > td {
        padding: 10px 25px;
    }

    .panel-invoice .table > tbody > tr > td:first-child, .panel-invoice .table > thead > tr > th:first-child, .panel-invoice .table > tfoot > tr > td:first-child, .panel-invoice > .panel-body > h4, .panel-invoice > .panel-body > p {
        padding-left: 0;
    }

    .panel-invoice .table > tbody > tr > td:last-child, .panel-invoice .table > thead > tr > th:last-child, .panel-invoice .table > tfoot > tr > td:last-child, .panel-invoice > .panel-body > h4, .panel-invoice > .panel-body > p {
        padding-right: 0;
    }

    .status-label {
        padding: 0 20px;
    }

    .invoice-top, .invoice-status {
        margin-bottom: 40px;
    }

    .invoice-info {
        margin-bottom: 20px;
    }

    .invoice-status.status-lg {
        height: 80px;
        font-size: 32px;
        font-weight: 100;
        line-height: 80px;
    }

    .invoice-status.status-md {
        height: 40px;
        color: #fff;
        font-size: 16px;
        line-height: 40px;
    }

    .invoice-taxitem {
        margin: -30px 0 40px;
    }
}

@media (max-width: 767px) {
    .invoice-status {
        padding-left: 54px;
        margin: 0 0 20px -40px;
    }

    .invoice-status .status-id {
        padding-left: 10px!important;
    }

    .invoice-status .status-label {
        padding-left: 20px;
    }

    .invoice-payto, .invoice-invoicedto {
        margin-bottom: 20px!important;
    }

    .invoice-top {
        margin-bottom: 32px!important;
    }

    .invoice-taxitem {
        margin: -10px 0 20px;
    }

    .invoice-status.status-lg {
        height: 50px;
        font-size: 24px;
        font-weight: 100;
        line-height: 50px;
    }

    .invoice-status.status-md {
        height: 32px;
        font-size: 14px;
        font-weight: 100;
        line-height: 32px;
    }

    .panel-invoice h4 {
        margin-bottom: 10px;
    }

    .invoice-table .table > tbody > tr, .invoice-table .table > thead > tr th {
        padding-left: 0!important;
        padding-right: 0!important;
    }

    .invoice-table .table > tbody > tr .amount-col {
        line-height: 32px;
    }

    .table-summary tr {
        width: 100%;
        padding: 10px 0;
    }

    .table-summary tr:after {
        display: block;
        content: "";
        clear: both;
    }

    .table-summary tr td {
        float: left;
        width: 50%;
        padding: 0 10px !important;
    }
}

@media (max-width: 579px) {
    .panel-invoice .panel-body {
        padding: 24px;
    }

    .invoice-logo {
        text-align: center;
        margin-bottom: 20px;
    }

    .invoice-logo img {
        max-width: 200px;
    }

    .invoice-top ul > li {
        float: left;
        width: 50%;
        margin: 0;
        text-align: left;
    }

    .invoice-top ul > li .list-label {
        display: block;
    }

    .invoice-status {
        padding-left: 20px;
        margin: 0 0 20px -24px;
    }

    .invoice-status .status-id {
        padding-left: 10px!important;
    }

    .invoice-status .status-label {
        padding-left: 20px;
    }

    .main-top {
        display: flex;
        flex-direction: column;
        align-items: start;
    }
}

/* Product List */
.products-lists {
    display: flex;
    flex-direction: column;
    background-color: #FFF;
    border-radius: 4px;
    box-shadow: 0 2px 4px 0 rgb(54 58 80 / 32%);
}

.products-row {
    display: flex;
    width: 100%;
    border-bottom: 1px solid #e8eaf0;
    transition: background-color .1s linear;
}

.products-row:hover {
    background-color: #eceef2;
}

.products-row.products-head {
    border-bottom: 1px solid #cfd5de;
}

.products-row.products-foot {
    align-items: center;
    justify-content: space-between;
}

.products-row.products-head:hover, .products-row.products-foot:hover {
    background-color: transparent;
}

.products-row.products-head .products-cell {
    font-weight: 600;
    padding: .8rem .5rem;
    color: rgba(0,0,0,.4);
}

.products-row.products-foot .products-cell {
    width: 100%;
    padding: 1rem;
    flex-direction: unset;
}

.products-row.products-foot .products-cell:nth-child(2) {
    justify-content: end;
}

.products-row.products-foot .products-cell .page-link {
    padding-top: 0;
    padding-bottom: 0;
    line-height: 24px;
}

.products-row.products-foot .products-cell .page-link.prev {
    border-radius: 2px 0 0 2px;
}

.products-row.products-foot .products-cell .page-link.next {
    border-radius: 0 2px 2px 0;
}

.products-cell {
    font-size: 12px;
    width: 15%;
    padding: 1rem .5rem;
    color: rgba(0,0,0,.7);
    display: flex;
    position: relative;
}

.ip-div {
    display: flex;
    align-items: center;
}

.ip-div .bi-clipboard {
    display: none;
}

.products-row:hover .ip-div .bi-clipboard {
    display: inline-block;
}

.ip-tag {
    height: 18px;
    min-width: 35px;
    display: block;
    line-height: 16px;
    text-align: center;
    font-size: 12px;
    border: 1px solid #dbdee3;
    border-radius: 2px;
    background-color: #fbfbfc;
    color: #AAA;
    transform: scale(.8);
    margin-right: 2px;
    padding: 0 4px;
    text-transform: uppercase;
}

.products-cell:nth-child(1) {
    width: 30px;
}

.products-cell:nth-child(2) {
    flex-direction: column;
}

.products-cell:nth-child(3), .products-cell:nth-child(4), .products-cell:nth-child(5), .products-cell:nth-child(6) {
    width: 110px;
}

.products-cell .fa-os {
    width: 16px;
    height: 16px;
    background-size: 100%;
}

.products-cell .iti-flag {
    margin-top: 2px;
}

.products-grid {
    background-color: transparent;
    box-shadow: none;
    overflow: unset;
}

.products-grid .products-lists-bd {
    display: grid;
    grid-gap: 2rem;
    grid-template-columns: repeat(3, auto);
}

.products-grid .products-row.products-head, .products-grid .products-row.products-foot {
    display: none;
}

.products-grid .products-row {
    overflow: hidden;
    background-color: #FFF;
    display: unset;
    position: relative;
    height: 150px;
    border-radius: 4px;
    box-shadow: 0 2px 4px 0 rgb(54 58 80 / 32%);
}

.products-grid .products-cell {
    position: absolute;
    padding: 1rem 1rem;
    width: auto;
}

.products-grid .products-cell .ip-div.PrivateIP {
    display: none;
}

.products-grid .products-cell:nth-child(2) {
    left: 30px;
}

.products-grid .products-cell:nth-child(3) {
    right: 0;
}

.products-grid .products-cell:nth-child(4) {
    top: 50px;
    left: 30px;
}

.products-grid .products-cell:nth-child(5) {
    top: 50px;
    left: 130px;
}

.products-grid .products-cell:nth-child(6) {
    top: 50px;
    left: 230px;
}

.products-grid .products-cell:nth-child(7) {
    bottom: 0;
    right: 0;
}

.products-grid .products-cell:nth-child(8) {
    left: 0;
    bottom: 0;
    flex-direction: unset !important;
}

.products-grid .products-cell:nth-child(8) > div {
    margin-right: .5rem;
}

.products-grid .products-cell:nth-child(9) {
    display: none;
}

.btn-return-to-admin {
    right: 150px;
    bottom: 0;
    top: unset;
    transform: unset;
    border-radius: .25rem .25rem 0 0 !important;
}

/* All Table */
.table-container {
    position: relative;
    background-color: #FFF;
    border-radius: 4px;
    box-shadow: 0px 1px 3px 0px rgb(0 0 0 / 3%);
}

.table-container .listtable {
}

div.dataTables_wrapper div.dataTables_info {
    padding: 1rem !important;
    color: #333;
    font-weight: 400;
}

div.dataTables_wrapper div.dataTables_filter label {
    padding: 0;
    margin-bottom: 0;
}

.dataTables_wrapper .dataTables_length {
    height: 55px;
}

.dataTables_wrapper .dataTables_length label {
    padding: 0 10px;
}

div.dataTables_wrapper div.dataTables_paginate {
    padding: 10px;
}

.dataTables_wrapper .dataTables_filter label .form-control {
    margin: 7px 10px 0 0;
    background-position: left 10px center;
    background-size: auto 15px;
    padding-left: 40px !important;
}

.dataTables_wrapper table.table-list {
    border: 0;
    border-top: 0 none;
    border-bottom: 1px solid #f0f2f2;
    border-radius: 0;
    margin: 0 !important;
}

.dataTables_wrapper table.table-list thead th {
    color: #34474d;
    font-weight: 600;
    background-color: #f8f8f9;
    border: 0;
    padding-top: .75rem;
    padding-bottom: .75rem;
    padding-left: 1rem;
    text-align: left;
    border-radius: 0 !important;
}

table.dataTable > thead .sorting:after, table.dataTable > thead .sorting_asc:after, table.dataTable > thead .sorting_desc:after, table.dataTable > thead .sorting:before, table.dataTable > thead .sorting_asc:before, table.dataTable > thead .sorting_asc_disabled:before, table.dataTable > thead .sorting_desc:before, table.dataTable > thead .sorting_desc_disabled:before {
    bottom: 15px !important;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    top: auto !important;
}

table.dataTable > thead .sorting:after, table.dataTable > thead .sorting_asc:after, table.dataTable > thead .sorting_desc:after {
    content: "\f0dd" !important;
}

table.dataTable > thead .sorting:before, table.dataTable > thead .sorting_desc:before, table.dataTable > thead .sorting_asc:before {
    content: "\f0de" !important;
}

.dataTables_wrapper table.table-list thead th:first-child, .dataTables_wrapper table.table-list tbody td:first-child {
    padding-left: 1.5rem;
}

.dataTables_wrapper table.table-list tbody tr:first-child td {
    border-top: 0 none;
}

.table-list>tbody>tr>td {
    color: #666;
    padding: 1rem;
    border-top: 1px solid #f1f2f2;
}

.table-container .dataTables_empty {
    height: 100px;
    vertical-align: middle;
}

.table-list>tbody>tr>td .fa-os {
    height: 18px;
    width: 18px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    vertical-align: middle;
}

.table-list>tbody>tr>td a:not([class]) {
    color: #999;
    font-weight: 400;
    text-decoration: none;
}

.iti-flag {
    display: inline-block;
}

/* products */
.visible-xs {
    display: none;
}

.table-header {
    padding: 20px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #edeeee;
}

.table-footer {
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #FFF;
}

.table-header .btn {
    box-shadow: none;
    background-image: none;
}

.table-header .btn-group .btn.active {
    color: #36dba1;
    font-weight: 500;
    background-color: #f8fcfd;
    border-color: #36dba1;
}

.table-paginate, .table-pages {
    color: #8e9595;
    font-size: 13px;
}

.table-status {
    display: flex;
}

.table-status .dropdown {
    margin-right: 10px;
}

.table-paginate {
    display: flex;
    align-items: center;
}

.table-paginate .dropdown {
    margin-right: 10px;
}

.table-paginate .dropdown .btn {
    padding: 5px 25px 5px 10px;
    background-image: none;
    height: 31px;
}

.table-paginate .dropdown .btn:after {
    position: absolute;
    top: 7px;
    right: 7px;
    font-family: "Font Awesome 5 Pro";
    content: "\f078";
    border: 0 none;
    transform: scale(.8);
}

.table-paginate .dropdown .c-dropdown__menu {
    width: 60px;
    min-width: 60px;
}

.table-paginate .pagination {
    margin: 0;
}

.table-paginate .pagination .form-control {
    max-width: 40px;
    text-align: center;
    border: 1px solid #edefef;
    border-radius: 4px !important;
    min-height: 28px;
    padding: 0 .25rem;
    font-size: .8em;
    margin-right: 1px;
}

.table-paginate .pagination .page-link {
    border: 0 none;
    cursor: pointer;
}

.table-paginate .pagination .page-link i {
    font-weight: 600;
    color: #36d29b;
}

.table-paginate .pagination .page-link:hover {
    color: #333;
    font-weight: 600;
    background-color: transparent;
}

.table-search {
    min-width: 25%;
    position: relative;
    margin-right: 1rem;
    padding-right: 1rem;
}

.table-search:after {
    position: absolute;
    content: '';
    border-right: 1px solid #edefef;
    height: 16px;
    top: 50%;
    right: 0;
    margin-top: -8px;
}

.table-search i {
    position: absolute;
    color: #3bdba2;
    font-size: 16px;
    font-weight: 600;
    width: 24px;
    height: 24px;
    top: 6px;
    left: 12px;
}

.table-search .form-control {
    padding-left: 40px;
    max-height: 32px;
    padding-top: .5rem;
    padding-bottom: .5rem;
}

.table-search .form-control::-webkit-input-placeholder {
    color: #b4bebc;
}

.table-search .table-search-val {
    z-index: 100;
    width: 400px;
    position: absolute;
    top: 100%;
    margin-top: 10px;
    border: 1px solid #dfe3ea;
    border-radius: 4px;
    background-color: #FFF;
    overflow-y: auto;
    max-height: 410px;
}

.table-search .table-search-val ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.table-search .table-search-val li {
    border-bottom: 1px solid #dfe3ea;
}

.table-search .table-search-val li:last-child {
    border-bottom: 0;
}

.table-search .table-search-val li.no-data {
    height: auto;
    margin: 0;
    padding: 15px;
}

.table-search .table-search-val li a {
    padding: 10px 15px;
    color: #7f8fa4;
    display: flex;
    align-items: center;
    text-decoration: none;
    justify-content: space-between;
}

.table-search .table-search-val li a:hover {
    background-color: #f8fcfd;
}

.btn-createHost {
    padding: .215rem 1.125rem;
    border-radius: 6px;
    border-color: #55b291;
    background-color: #36dba1;
}

.btn-createHost:hover, .btn-createHost:focus, .btn-createHost:active {
    border-color: #55b291;
    background-color: #55b291;
}

.security-title-box {
    padding: 24px;
    background-color: #d0e3ff;
    display: flex;
    justify-content: flex-start;
}

.security-title-box .icon-box {
    margin-right: 16px;
}

.security-title-box .icon-box .bi {
    color: #084298;
    font-size: 40px;
    line-height: 1;
}

.security-title-box .title-info .title {
    color: #1f2533;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    margin-bottom: 4px;
}

.security-title-box .title-info .sub-title {
    color: #7c8294;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-bottom: 0;
}

.security-list {
    padding: 0;
}

.security-content {
    min-height: 24px;
    padding: 20px 0;
    border-bottom: 1px solid #eef0f8;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.security-line {
    padding: 0 24px;
}

.security-line:hover {
    background-color: #fafbfc;
}

.security-line:last-child .security-content {
    border-bottom: 0 none;
}

.security-line .security-content .icon-title-box {
    display: flex;
    align-items: center;
    margin-right: 12px;
}

.security-line .security-content .icon-title-box .icon-box {
    margin-right: 12px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.security-line .security-content .icon-title-box .icon-box .bi {
    color: var(--primary);
    font-size: 24px;
    line-height: 1;
    vertical-align: text-top;
}

.security-line .security-content .icon-title-box .title-box .line-title {
    color: #40475b;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 0;
}

.security-line .security-content .icon-title-box .title-box .line-desc {
    color: #9ba1b1;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-bottom: 0;
}

.security-line .security-content .right-content {
    width: 340px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.security-line .security-content .right-content span {
    margin-right: 16px;
    font-size: 12px;
    font-weight: 500;
}

.security-line .security-content .right-content span:last-child {
    margin-right: 0;
}

.security-line .security-content .right-content .info-text {
    color: #9aa1b1;
    line-height: 16px;
}

.announcement-items {
    display: grid;
    grid-gap: 1.5rem;
    grid-template-columns: repeat(3, 1fr);
}

.announcement-item {
    flex: 1;
    position: relative;
    border-radius: .35rem;
    border: 1px solid #f0f1f3;
    overflow: hidden;
}

.announcement-items {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, auto);
}

.announcement-item a {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: end;
    text-decoration: none;
    position: relative;
    z-index: 3;
    width: 100%;
    min-height: 200px;
    height: 100%;
}

.announcement-item h4 {
    height: 25px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.announcement-body {
    font-size: 1.25rem;
}

.main-news-body .announcement-items {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, auto);
}

.announcement-item:hover {
    transform: translateY(-2px) scale(1.02);
    transition: all .3s ease-in-out;
}

.announcement-item img {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.announcement-item:after {
    position: absolute;
    z-index: 2;
    content: '';
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0,0,0,.5);
}

.main-news-body .announcement-item a {
    min-height: 180px;
}

.announcement-item:first-child {
    grid-column: 1/span 2;
    grid-row: 1/span 2;
}


.main-news .main-news-body {
	padding: 27px 28px 30px;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f0f2f5), to(#fff)), -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff));
	background-image: -o-linear-gradient(top, #f0f2f5 0%, #fff 100%), -o-linear-gradient(#fff, #fff);
	background-image: linear-gradient(180deg, #f0f2f5 0%, #fff 100%), linear-gradient(#fff, #fff);
	background-blend-mode: normal, normal;
	box-shadow: 0px 4px 20px 0px rgba(0, 53, 128, 0.1);
	border-radius: 2px;
	border: solid 2px #fff;
}
.main-news .other-system-item {
	padding: 10px 0;
}
.main-news .other-system-item:first-child {
	width: 100%;
}
.main-news .icon-system-item {
	width: 38px;
	height: 38px;
	background-color: #ddd;
	margin-right: 10px;
}
.main-news .icon-system-item1 {
	background: url("https://cdn-image.templetes2024l.com/2023/img/group_special.7571b76f.png") no-repeat center;
	background-size: cover;
}
.main-news .icon-system-item2 {
	background: url(https://cdn-image.templetes2024l.com/2023/img/group_app.ec690231.png) no-repeat center;
	background-size: cover;
}
.main-news .icon-system-item3 {
	background: url(https://cdn-image.templetes2024l.com/2023/img/group_user.0ce9f464.png) no-repeat center;
	background-size: cover;
}
.main-news .main-news-list {
	margin: 30px 0;
	list-style: none;
	padding: 0px;
}
.main-news .main-news-list a {
	color: #666;
	margin-bottom: 8px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.main-news .main-news-list a:hover {
	color: #006aff;
	text-decoration: none;
}
.main-news .main-news-list time {
	color: #999;
	width: 85px;
}
.main-news .system-desc {
	margin: 22px 0;
}
.main-news .other-system-item {
	padding-left: 10px;
	padding-right: 20px;
}
.other-system-item h3 {
	line-height: 38px;
}
.main-news .main-news-list h5 {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 1rem;
	font-weight: 400;
	flex: 1;
	margin-bottom: 0;
}

.main-partner-items {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}
.main-partner-item {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem;
}
.main-partner-item img {
	width: 100%;
	max-height: 40px;
	max-width: 200px;
	opacity: .6;
	cursor: pointer;
	transition: all .3s ease-in-out;
}
.main-partner-item:hover img {
	opacity: 1;
	transform: translateY(-2px) scale(1.02);
}

.pageError {
    display: flex;
    align-items: center;
    justify-items: center;
    padding: calc( (100vh - 661px) / 2) 0;
}

.pageError .display-1 {
    font-size: 12rem;
    background-image: linear-gradient(to right,#FFCF02, #FF7352);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

.pageError lottie-player {
    max-width: 720px;
    max-height: 400px;
    margin: 0 auto;
}

.notes .layui-layer-content {
    padding: 25px;
}

.notes.layui-layer {
    border-radius: 6px;
    box-shadow: 0 0 10px 0 rgba(0,0,0,.2);
}

.notes .layui-layer-title {
    padding: 0 25px;
    line-height: 45px;
    font-size: 16px;
    font-weight: 500;
    border-bottom: 0 none;
    background-color: transparent;
}

.layui-layer-content .form-item-title {
    line-height: 24px;
    color: #666;
    margin-bottom: 15px;
    font-weight: 600;
    margin-top: -20px;
}

.notes .layui-layer-setwin {
    top: 10px;
    right: 15px;
}

.notes .layui-layer-setwin .layui-layer-close1 {
    font-family: "Font Awesome 5 Pro";
    background-image: none;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #AAA;
}

.notes .layui-layer-setwin .layui-layer-close1:before {
    content: "\f00d";
}

.notes .layui-layer-btn {
    display: flex;
    padding: 0 25px 25px;
}

.notes .layui-layer-btn > a {
    display: flex;
    flex: 1;
    min-height: 45px;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    font-weight: 600;
    margin: 0;
}

.notes .layui-layer-btn .layui-layer-btn0 {
    border-color: #087fdf;
    background-color: #087fdf;
}

.notes .layui-layer-btn .layui-layer-btn1 {
    margin-left: 20px;
    color: #087fdf;
    border-color: #087fdf;
}

.layui-layer-loading .layui-layer-loading2 {
    width: 48px;
    height: 48px;
    background: none;
    border: 3px solid rgba(0, 0, 0, .15);
    border-top: 3px solid #2d9df3;
    border-radius: 100%;
    vertical-align: text-bottom;
    animation: rotation .6s infinite linear;
    background-image: none !important;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(360deg)
    }
}

@media (max-width: 576px) {
    .table-header, .table-footer {
        display: block;
    }

    .table-status, .table-pages {
        margin-bottom: 1rem;
    }

    .table-status .btn-group {
        display: flex;
    }

    .table-status .btn-group .btn {
        flex: 1;
    }

    .table-search .table-search-val {
        width: 100%;
    }
}

.status {
    padding: 1px 3px 2px;
    font-size: 11px;
    font-weight: 400;
    color: #fff;
    white-space: nowrap;
    -moz-border-radius: 3px;
    border-radius: 3px
}
/*   2024-1-5æ›´æ–° å¤‡ä»½statusæ—§æ ·å¼

.status {
    font-weight: 600;
    padding: 0;
    color: #6c757d;
    display: inline-block;
    margin-bottom: 0;
    background-color: transparent;
}

*/


/* 'Pending','Active','Suspended','Terminated','Cancelled','Fraud','Completed' */
.status.status-pending {
    background-color: #fd7e14;
}

.status.status-open, .status.status-paid, .status.status-completed, .status.status-active {
    background-color: #28a745;
}

.status.status-unpaid, .status.status-close, .status.status-Fraud, .status.status-terminated {
    background-color: #dc3545;
}

.status.status-cancelled, .status.status-suspended {
    background-color: #6c757d;
}

.status.status-customer-reply {
    background-color: #f60;
}

/*  2024-1-5æ›´æ–° å¤‡ä»½æ—§çŠ¶æ€æ ·å¼ 

.status.status-pending {
    color: #fd7e14;
}

.status.status-open, .status.status-paid, .status.status-completed, .status.status-active {
    color: #28a745;
}

.status.status-unpaid, .status.status-close, .status.status-Fraud, .status.status-terminated {
    color: #dc3545;
}

.status.status-cancelled, .status.status-suspended {
    color: #6c757d;
}

.status.status-customer-reply {
    color: #f60;
}


*/


/* article */
.article section#main-body {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background-color: transparent;
}

.xs-title h4 {
    font-size: 1.5rem;
    font-weight: 500;
    margin-bottom: 16px;
}

.terms-wraper p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.647;
    color: #444;
}

.terms-wraper:not(:last-child) {
    margin-bottom: 30px;
}

.order-list {
    padding-left: 0px;
    margin-bottom: 0px;
}

.order-list li {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.647;
    color: #666;
    list-style: decimal;
    list-style-position: inside;
}

.order-list li:not(:last-child) {
    margin-bottom: 10px;
}

.tickets-main {
    border: 1px solid #EEE;
    border-radius: 4px;
    padding: 20px;
    display: block;
}

.tickets-main:focus, .tickets-main:hover {
    text-decoration: none;
    background-color: #FAFAFA;
}

.tickets-main h4 {
    color: #333;
    font-size: 18px;
    margin: 0 0 15px;
}

.tickets-main p {
    color: #666;
    margin-bottom: 0;
}

#popup-backdrop .main-content {
    padding: 0;
}

/* SiteMap */
.sitemap h4 {
    margin: 0;
    font-weight: 400;
    padding-bottom: 18px;
}

.sitemap li {
    padding-bottom: 5px;
}

.sitemap li a {
    color: #333;
    font-size: 1rem;
    line-height: 1.5;
}

.sitemap li .label {
    vertical-align: middle;
    border-radius: 2px;
    margin-left: 5px;
    padding: 0 .6em .1em;
}

.label-update {
    background-color: #3ca6ff;
}

.label-new {
    background-color: #cf4f2e;
}

.submit-item a {
    display: flex;
    align-items: center;
    border-radius: .5rem;
    border: 1px solid #f0f1f3;
    padding: 1rem 1.5rem;
    text-decoration: none;
}

.submit-item a:hover {
    background-color: #f0f1f3;
}

.common-tool-icon {
    margin-right: 1.5rem;
}

.common-tool-icon i {
    color: var(--primary);
    font-size: 48px
}

.common-tool-msg-cont {
}

.submit-item-title {
    color: #333;
    font-size: 16px;
}

.submit-item-text {
    margin-bottom: 0;
    color: #6c757d;
}

/* Footer */
footer.footer {
    padding: 60px 0;
    background-color: #282f3c;
    border: 0 none;
    font-size: 14px;
    position: relative;
    border-top: 0 none;
}

footer.footer h5 {
    font-size: 16px;
    margin-bottom: 1rem;
}

footer.footer a {
    line-height: 26px;
    color: #939699;
}

footer.footer .copyright {
    margin: 0;
    font-size: 1rem;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

footer.footer .privacy a {
    color: #FFF;
    position: relative;
    display: inline-block;
    padding-right: 20px;
}

footer.footer .privacy a:after {
    height: 14px;
    position: absolute;
    content: '';
    right: 8px;
    top: 6px;
    width: 1px;
    background-color: #444;
}

footer.footer .privacy a:last-child::after {
    display: none;
}

/* header-lined */
div.header-lined h1 {
    margin: 0px 0px 0px -2px;
    border-bottom: none;
    font-weight: 400;
    color: #2a2e36;
    font-size: 28px;
    line-height: 40px;
    line-height: 1.5;
}

div.header-lined h1 small {
    color: #777;
    font-size: 1.25rem;
    margin-left: 1rem;
}

div.header-lined .breadcrumb {
    font-size: 14px;
}

div.header-lined .breadcrumb>.active {
    color: #666;
}

div.header-lined .breadcrumb > .breadcrumb-item > a {
    color: #888;
}

div.dataTables_wrapper div.dataTables_length label {
    margin-top: 4px;
}

.dataTables_wrapper .dataTables_length label .form-control {
    border: 1px solid #ddd;
    min-width: 50px;
    height: 27px !important;
    line-height: 27px;
    padding: 0 0 0 10px;
}

select.form-control {
    appearance: none;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIyLjEuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IldhcnN0d2FfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiCgkgd2lkdGg9IjZweCIgaGVpZ2h0PSI2cHgiIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDYgNjsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiNCOUJEQzU7fQo8L3N0eWxlPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNS41LDFoLTVDMC4yMiwxLDAsMS4yMiwwLDEuNVYyYzAsMC4xMywwLjA1LDAuMjYsMC4xNSwwLjM1bDIuNSwyLjVDMi43NCw0Ljk1LDIuODcsNSwzLDVzMC4yNi0wLjA1LDAuMzUtMC4xNQoJbDIuNS0yLjVDNS45NSwyLjI2LDYsMi4xMyw2LDJWMS41QzYsMS4yMiw1Ljc4LDEsNS41LDF6Ii8+Cjwvc3ZnPgo=);
    background-position-y: 50%;
    background-position-x: calc(100% - 11px);
    background-repeat: no-repeat;
    padding-right: 24px;
    -webkit-appearance: none;
}

.tickets-main {
    border: 1px solid #EEE;
    border-radius: 4px;
    padding: 20px;
    display: block;
}

.tickets-main:focus, .tickets-main:hover {
    text-decoration: none;
    background-color: #FAFAFA;
}

.tickets-main h4 {
    color: #333;
    font-size: 18px;
    margin: 0 0 15px;
}

.tickets-main p {
    color: #666;
    margin-bottom: 0;
}

.ticket-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ticket-action {
    display: flex;
    align-items: center;
}

.ticket-cell {
    margin-left: 1.5rem;
    color: #a2a2a2;
}

.ticket-cell strong {
    color: #333;
    margin-left: 15px;
}

.ticket-detail {
    display: flex;
    padding: 1.5rem 0;
    border-bottom: 1px dashed #d3d3d3;
}

.ticket-detail:last-child {
    border-bottom: 0 none;
}

.ticket-detail-icon {
    margin-right: 1rem;
}

.ticket-detail-icon img {
    width: 40px;
    height: 40px;
}

.ticket-detail-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .2rem;
}

.ticket-detail-main {
    width: 100%;
}

.ticket-detail-message {
    font-size: 12px;
}

.ticket-detail-message ul, .ticket-detail-message ol {
    margin: 0 0 1rem;
    padding-left: 25px;
}

.ticket-detail-message pre {
    padding: .7rem 1rem;
    margin: 0 0 1rem;
    font-size: .75rem;
    line-height: 1.7;
    word-break: break-all;
    word-wrap: break-word;
    background-color: #f8f8f8;
    border-radius: .25rem;
}

.ticket-detail-message blockquote {
    font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    padding: .7rem 1rem;
    font-size: .75rem;
    line-height: 1.7;
    word-break: break-all;
    word-wrap: break-word;
    border-left: 4px solid var(--primary);
}

.ticket-detail-message blockquote p:last-child {
    margin-bottom: 0;
}

.ticket-reply .rating, .ticket-reply .rating-done {
    font-size: 18px;
}

@media (min-width: 768px) {
    .container {
        max-width: 98%;
    }
}

@media (min-width: 1400px) {
    .container {
        max-width: 1300px;
    }
}

@media (max-width: 1052px) {
    .nav-item.language {
        display: none;
    }
}

@media (max-width: 800px) {
    .space {
        padding-top: 30px !important;
        padding-bottom: 30px !important;
    }

    .px100 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }

    .navbar-collapse {
        background-color: #FFF;
        border-top: 1px solid #efefef;
        border-bottom: 1px solid #efefef;
        margin-top: 15px;
        padding-bottom: 15px;
        padding-left: 30px;
        padding-right: 30px;
    }

    .footer.footer .back-to-top {
        position: absolute;
        top: 10px;
        right: 10px;
    }

    div.dataTables_wrapper div.dataTables_length label {
        float: left;
    }

    div.dataTables_wrapper div.dataTables_paginate {
        padding: 5px 0 0;
    }

    .navbar-toggle {
        margin: 0;
        position: absolute;
        right: 15px;
    }

    .navbar-brand {
        margin: 0;
    }

    .header .navbar {
        min-height: 90px;
    }

    .header .navbar-toggler {
        color: #333;
        min-height: 36px;
        border: 1px solid #999;
    }

    .header .navbar-collapse {
        display: block !important;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 12;
        height: 100%;
        width: 240px;
        background-color: #1b70b8;
        transition: transform .24s ease;
        transform: translateX(-240px);
        overflow-y: auto;
        overflow-x: hidden;
        margin: 0;
        height: 100%;
        border: 0;
    }

    .header .navbar-collapse.show {
        transform: translateX(0px);
    }

    .header .navbar-nav>li>a, .header .navbar-nav.navbar-right>li>a {
        color: #FFF;
        text-align: center;
    }

    .header .navbar-nav>li>a:hover {
        color: #EEE;
    }

    .header .navbar-collapse.in {
        transform: translateX(0);
    }

    .product-table td .ip-tag, .product-table td .ip-div, .product-table td .info, .reload .status {
        display: inline-block;
    }

    .product-wrap .boxe-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 15px;
    }

    .product-wrap .boxe-title .name, .product-wrap .boxe-title .cost {
        margin: 0;
    }

    .product-wrap .boxe .btn {
        display: block;
    }

    .product-wrap .boxe dl dt {
        float: inherit;
    }

    .product-wrap .boxe dl dt, .product-wrap .boxe dl dd {
        width: 24%;
        min-width: auto;
        display: inline-block;
    }

    .product-wrap .boxe dl dd:last-child {
        width: 60%;
    }

    .notice .item-list li a {
        height: 24px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }

    .item-list li .time {
        display: block;
        float: inherit;
    }

    .language {
        display: block;
        border-left: 0 none;
        padding-left: 0;
        margin-top: 15px;
    }

    .login-bg {
        display: none;
    }

    .login-container {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .login-body {
        padding: 2rem;
    }

    .login-wrapper {
        min-height: 500px;
    }

    .page-side {
        transform: translateX(-300px);
    }

    .page-side.show {
        top: 59px;
        z-index: 100;
        transform: translateX(0);
        transition: transform .2s;
    }

    .page-body {
        left: 0;
    }

    .home-billing-recent {
        flex-direction: column;
    }

    .consumption-info {
        display: flex;
        align-items: center;
        width: 100%;
        flex: 1;
        max-width: 100%;
    }

    .consumption-info > * {
        flex: 1;
    }

    .consumption-chart {
        width: 100%;
        flex: 1;
        max-width: 100%;
        margin: 0;
    }

    .footer-logo, .page-product-aside, .wrap-main-swiper .content-slide img {
        display: none;
    }

    .page-product-list [class*=col-] {
        padding-right: 15px;
        padding-left: 15px;
        border: 0 none;
    }

    .main-maps {
        overflow: hidden;
    }

    .page-product-card {
        border-radius: 3px;
        background-color: #FFF;
        box-shadow: 0 4px 40px 0 rgb(0 0 0 / 10%);
        margin-bottom: 2rem;
    }

    .main-solution-body .card {
        margin-bottom: 2rem
    }

    .main-products-body {
        border-radius: 0;
        box-shadow: none;
        background-color: transparent;
    }

    .wrap-main-swiper .swiper-slide {
        height: 450px;
        background-size: auto 450px;
    }

    .wrap-main-swiper .content-slide {
        height: 450px;
        max-height: 450px;
        padding-top: 80px;
    }

    .swiper-pagination-bullets {
        top: -50px;
    }

    .wrap-main-swiper .content-slide .slogan {
        font-size: 2rem;
    }

    .navbar-collapse {
        display: block !important;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        z-index: 12;
        width: 300px;
        transition: transform .24s ease;
        transform: translateX(-300px);
        overflow-y: auto;
        overflow-x: hidden;
        margin: 0;
        height: 100vh;
        border: 0;
        box-shadow: 0 4px 40px 0 rgb(0 0 0 / 10%);
    }

    .navbar-collapse.show {
        transform: translateX(0px);
    }

    header .navbar-nav .nav-item .nav-link {
        text-align: center;
    }

    .navbar-toggler {
        position: relative;
    }

    .navbar-toggler:focus {
        outline: none;
    }

    .navbar-toggler {
        border: 1px solid #dfe1e7;
    }

    .navbar-toggler > i {
        color: #dfe1e7;
    }

    header .navbar-nav.navbar-nav-right .nav-item .btn {
        margin-top: 1rem;
        line-height: 40px;
    }

    header .navbar-nav.navbar-nav-right .nav-item .nav-link {
        line-height: 60px !important;
    }

    .dropdown-container.show {
        top: 110px;
        max-height: 100vh;
    }

    .dropdown-body-menu {
        display: none;
    }

    .dropdown-bd {
        padding: 1rem;
        grid-gap: 1rem;
        grid-template-columns: repeat(1, 1fr);
    }

    .dropdown-bd .body-main-bd {
    }

    .body-main-bd-item p {
        display: none;
    }

    .card-body-info {
        background-image: none;
    }

    .funds-items {
        flex-direction: column;
    }

    .funds-item-info {
        width: 100%;
        display: flex;
        padding-bottom: 1.5rem;
        border-bottom: 1px solid #e8e9f0;
    }

    .funds-item-other {
        width: 100%;
        display: grid;
        grid-gap: 0rem;
        grid-template-columns: repeat(2, auto);
    }

    .funds-item {
        width: 100%;
        font-size: 18px;
        padding: 1rem 1.5rem 1rem 0;
        border-left: none;
        border-bottom: 1px solid #e8e9f0;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .funds-item .funds-num {
        margin: 0;
    }

    .main-top h1 {
        font-size: 1.25rem;
    }

    .consumption-info {
        display: grid;
        grid-gap: 1rem;
        grid-template-columns: repeat(2, auto);
        margin-bottom: 2rem;
    }

    .last-month-number, .current-month-number {
        margin: 0;
        font-size: 1.125rem;
    }

    .announcement-items {
        display: flex;
        flex-direction: column;
    }

    .main-partner-items {
        grid-template-columns: repeat(2, 1fr);
    }

    .main-header {
        margin-bottom: 2rem;
    }

    .main-title {
        font-size: 1.5rem;
    }

    .product-detail {
        flex-direction: column;
    }

    .product-detail-side {
        padding-right: 1.5rem;
    }

    .product-detail-main {
        margin-top: 1.5rem;
    }

    .product-detail-lists {
        grid-gap: 1.5rem;
        grid-template-columns: repeat(1, auto);
    }

    .intl-map-main {
        bottom: -10px;
    }

    .swiper-media {
        margin: 2rem 0 0;
    }

    .main-services-item {
        height: 300px;
        margin-bottom: 1.5rem;
    }

    .swiper-media-items {
        align-items: unset;
        flex-direction: column;
    }

    .swiper-media-item {
        padding: 1.5rem;
    }

    .swiper-media-item:after {
        right: 0;
        width: 100%;
        height: 1px;
        top: auto;
        bottom: 0;
        margin-top: 0;
        margin-left: 50%;
    }

    .dataTables_wrapper table.table-list thead {
        display: none;
    }

    .dataTables_wrapper table.table-list tbody tr {
        border-top: 1px solid #f1f2f2;
    }

    .dataTables_wrapper table.table-list tbody tr td {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: space-between;
        vertical-align: unset;
        white-space: nowrap;
        padding: 1rem !important;
        min-width: 300px;
        border: none !important;
    }

    .dataTables_wrapper table.table-list tbody tr td .w-hidden {
        display: inline-block;
    }
}

@font-face {
    font-display: swap;
    font-family: TCloudNumber;
    font-style: normal;
    font-weight: 400;
    src: url("./fonts/TCloudNumber-Regular.ttf");
}

@font-face {
    font-family: ucicon-product;
    src: url(./fonts/ucicon-division.eot?v=1656486059844);
    src: url(./fonts/ucicon-division.eot?v=1656486059844) format("embedded-opentype"), url(./fonts/ucicon-division.ttf?v=1656486059844) format("truetype"), url(./fonts/ucicon-division.woff?v=1656486059844) format("woff"), url(./fonts/ucicon-division.svg?v=1656486059844) format("svg");
    font-weight: 400;
    font-style: normal
}

[class*=" icon-product__"], [class^=icon-product__] {
    font-family: ucicon-product !important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    display: inline-block;
    text-decoration: inherit;
    text-align: center;
    letter-spacing: 0;
    -ms-font-feature-settings: "liga"1;
    -o-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

[class*=" icon-product__"]:before, [class^=icon-product__]:before {
    display: inline-block
}

.icon-product__access-control:before {
    content: "\E001"
}

.icon-product__accessgw:before {
    content: "\E002"
}

.icon-product__account-security:before {
    content: "\E003"
}

.icon-product__account:before {
    content: "\E004"
}

.icon-product__aim5g:before {
    content: "\E005"
}

.icon-product__anycasteip:before {
    content: "\E006"
}

.icon-product__billing:before {
    content: "\E007"
}

.icon-product__caas:before {
    content: "\E008"
}

.icon-product__censor:before {
    content: "\E009"
}

.icon-product__cloudshell:before {
    content: "\E00A"
}

.icon-product__company:before {
    content: "\E00B"
}

.icon-product__consumption-analysis:before {
    content: "\E00C"
}

.icon-product__contract-center:before {
    content: "\E00D"
}

.icon-product__cube:before {
    content: "\E00E"
}

.icon-product__dashboard3:before {
    content: "\E00F"
}

.icon-product__epc-graphics:before {
    content: "\E010"
}

.icon-product__finance:before {
    content: "\E011"
}

.icon-product__firewall:before {
    content: "\E012"
}

.icon-product__globalrdp:before {
    content: "\E013"
}

.icon-product__globalssh:before {
    content: "\E014"
}

.icon-product__gpu:before {
    content: "\E015"
}

.icon-product__hela:before {
    content: "\E016"
}

.icon-product__httpdns:before {
    content: "\E017"
}

.icon-product__invoice:before {
    content: "\E018"
}

.icon-product__iotedge:before {
    content: "\E019"
}

.icon-product__ipsecvpn:before {
    content: "\E01A"
}

.icon-product__isms:before {
    content: "\E01B"
}

.icon-product__library:before {
    content: "\E01C"
}

.icon-product__logo:before {
    content: "\E01D"
}

.icon-product__message-center:before {
    content: "\E01E"
}

.icon-product__message:before {
    content: "\E01F"
}

.icon-product__mongodb:before {
    content: "\E020"
}

.icon-product__mq:before {
    content: "\E021"
}

.icon-product__nat:before {
    content: "\E022"
}

.icon-product__networkacl:before {
    content: "\E023"
}

.icon-product__overview:before {
    content: "\E024"
}

.icon-product__plive:before {
    content: "\E025"
}

.icon-product__qqtc:before {
    content: "\E026"
}

.icon-product__recycle:before {
    content: "\E027"
}

.icon-product__roma:before {
    content: "\E028"
}

.icon-product__routetable:before {
    content: "\E029"
}

.icon-product__safehouse:before {
    content: "\E02A"
}

.icon-product__search-global:before {
    content: "\E02B"
}

.icon-product__secgroup:before {
    content: "\E02C"
}

.icon-product__sharedgpu:before {
    content: "\E02D"
}

.icon-product__shockwave:before {
    content: "\E02E"
}

.icon-product__snapshot:before {
    content: "\E02F"
}

.icon-product__tidb:before {
    content: "\E030"
}

.icon-product__transaction-bill:before {
    content: "\E031"
}

.icon-product__uads:before {
    content: "\E032"
}

.icon-product__uai-behavior:before {
    content: "\E033"
}

.icon-product__uai-exterior:before {
    content: "\E034"
}

.icon-product__uai-face:before {
    content: "\E035"
}

.icon-product__uai-object:before {
    content: "\E036"
}

.icon-product__uai-ubox:before {
    content: "\E037"
}

.icon-product__uai-ucvm:before {
    content: "\E038"
}

.icon-product__uai-ueng:before {
    content: "\E039"
}

.icon-product__uai-uepg:before {
    content: "\E03A"
}

.icon-product__uai-upda:before {
    content: "\E03B"
}

.icon-product__uai-vehicle:before {
    content: "\E03C"
}

.icon-product__uai:before {
    content: "\E03D"
}

.icon-product__uaitrain:before {
    content: "\E03E"
}

.icon-product__uanycastclean:before {
    content: "\E03F"
}

.icon-product__uapi:before {
    content: "\E040"
}

.icon-product__uapigateway:before {
    content: "\E041"
}

.icon-product__uapistore:before {
    content: "\E042"
}

.icon-product__uarchive:before {
    content: "\E043"
}

.icon-product__uas:before {
    content: "\E044"
}

.icon-product__ucamon:before {
    content: "\E045"
}

.icon-product__ucdn:before {
    content: "\E046"
}

.icon-product__ucgs:before {
    content: "\E047"
}

.icon-product__uclickhouse:before {
    content: "\E048"
}

.icon-product__ucloudstack:before {
    content: "\E049"
}

.icon-product__ucloudstor:before {
    content: "\E04A"
}

.icon-product__ucmp:before {
    content: "\E04B"
}

.icon-product__ucnam:before {
    content: "\E04C"
}

.icon-product__udas:before {
    content: "\E04D"
}

.icon-product__udataark:before {
    content: "\E04E"
}

.icon-product__udb:before {
    content: "\E04F"
}

.icon-product__uddb:before {
    content: "\E050"
}

.icon-product__udhost:before {
    content: "\E051"
}

.icon-product__udi:before {
    content: "\E052"
}

.icon-product__udisk:before {
    content: "\E053"
}

.icon-product__udnr:before {
    content: "\E054"
}

.icon-product__udns:before {
    content: "\E055"
}

.icon-product__udocker:before {
    content: "\E056"
}

.icon-product__udoris:before {
    content: "\E057"
}

.icon-product__udpn:before {
    content: "\E058"
}

.icon-product__udts:before {
    content: "\E059"
}

.icon-product__udw:before {
    content: "\E05A"
}

.icon-product__ues:before {
    content: "\E05B"
}

.icon-product__uewaf:before {
    content: "\E05C"
}

.icon-product__ufile:before {
    content: "\E05D"
}

.icon-product__uflink:before {
    content: "\E05E"
}

.icon-product__ufs:before {
    content: "\E05F"
}

.icon-product__ugaa:before {
    content: "\E060"
}

.icon-product__ugc:before {
    content: "\E061"
}

.icon-product__ugn:before {
    content: "\E062"
}

.icon-product__ugroup:before {
    content: "\E063"
}

.icon-product__uhadoop:before {
    content: "\E064"
}

.icon-product__uhas:before {
    content: "\E065"
}

.icon-product__uhids:before {
    content: "\E066"
}

.icon-product__uhive:before {
    content: "\E067"
}

.icon-product__ec:before, .icon-product__dedicated:before, .icon-product__uhost:before {
    content: "\E068"
}

.icon-product__uhub:before {
    content: "\E06A"
}

.icon-product__uhybrid:before {
    content: "\E06B"
}

.icon-product__uhyperbox:before {
    content: "\E06C"
}

.icon-product__uiot:before {
    content: "\E06D"
}

.icon-product__uiotbox:before {
    content: "\E06E"
}

.icon-product__uiotstack:before {
    content: "\E06F"
}

.icon-product__uiw:before {
    content: "\E070"
}

.icon-product__uk8s:before {
    content: "\E071"
}

.icon-product__ukafka:before {
    content: "\E072"
}

.icon-product__ukms:before {
    content: "\E073"
}

.icon-product__ulb:before {
    content: "\E074"
}

.icon-product__ulive:before {
    content: "\E075"
}

.icon-product__ulog:before {
    content: "\E076"
}

.icon-product__umarket:before {
    content: "\E077"
}

.icon-product__umedia:before {
    content: "\E078"
}

icon-product__umem:before {
    content: "\E079"
}

.icon-product__umon:before {
    content: "\E07A"
}

.icon-product__unet:before {
    content: "\E07B"
}

.icon-product__uni:before {
    content: "\E07C"
}

.icon-product__unvs:before {
    content: "\E07D"
}

.icon-product__uodn:before {
    content: "\E07E"
}

.icon-product__uodn2:before {
    content: "\E07F"
}

.icon-product__uol:before {
    content: "\E080"
}

.icon-product__upca:before {
    content: "\E081"
}

.icon-product__uphone:before {
    content: "\E082"
}

.icon-product__uphoneserver:before {
    content: "\E083"
}

.icon-product__server:before, .icon-product__uphost:before {
    content: "\E084"
}

.icon-product__uprivate:before {
    content: "\E085"
}

.icon-product__upro:before {
    content: "\E086"
}

.icon-product__urecord:before {
    content: "\E087"
}

.icon-product__urlm:before {
    content: "\E088"
}

.icon-product__urmp:before {
    content: "\E089"
}

.icon-product__urtc:before {
    content: "\E08A"
}

.icon-product__usa:before {
    content: "\E08B"
}

.icon-product__usdp:before {
    content: "\E08C"
}

.icon-product__user:before {
    content: "\E08D"
}

.icon-product__uslk:before {
    content: "\E08E"
}

.icon-product__uslpe:before {
    content: "\E08F"
}

.icon-product__usmc:before {
    content: "\E090"
}

.icon-product__usnap:before {
    content: "\E091"
}

.icon-product__hgc:before, .icon-product__usql:before {
    content: "\E092"
}

.icon-product__ussg:before {
    content: "\E093"
}

.icon-product__ussl:before {
    content: "\E094"
}

.icon-product__utsdb:before {
    content: "\E095"
}

.icon-product__uvms:before {
    content: "\E096"
}

.icon-product__uws:before {
    content: "\E097"
}

.icon-product__video:before {
    content: "\E098"
}

.icon-product__vip:before {
    content: "\E099"
}

.icon-product__vouchers:before {
    content: "\E09A"
}

.icon-product__vpc:before {
    content: "\E09B"
}

.icon-product__work-order:before {
    content: "\E09C"
}

.icon-product__xzone:before {
    content: "\E09D"
}

.icon-product__xzoneserver:before {
    content: "\E09E"
}

.icon-product__host:before {
    content: "\E049";
}

.icon-product__cdn:before {
    content: "\E059";
}

ul.footer-contact.under-line {
    list-style: none;
    padding: 0px;
}

@media (max-width: 768px) {
    .product-detail {
        overflow: hidden;
    }

    .product-detail-side {
        padding-right: 0px;
    }

    .product-detail-lists a {
        overflow: hidden;
    }
}

section.home-news {
    background: #f5f6f9;
}

.home-news .news-item {
    height: auto;
    text-align: left;
    box-sizing: border-box;
    background: #fff;
    border: 1px solid #f0f0f0;
    position: relative;
    cursor: pointer;
    padding: 30px;
    min-height: 200px;
    margin-bottom: 20px;
    width: auto;
    display: block;
}

.home-news .tagTitle {
    margin-bottom: 16px;
    color: #030a1a;
    font-size: 18px;
    line-height: 24px;
}

.home-news .content-summary {
    color: #020814;
    display: -webkit-box;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 70%;
    min-height: 60px;
}

.article-sidebar .sidebar-sticky {
    background: transparent;
}

.icon-product__tiktok:before {
    content: "\E075";
}

.pageError img {
    max-width: 300px;
    margin-bottom: 20px;
}

.wrap-main-swiper .swiper-slide {
    background-repeat: no-repeat!important;
    background-size: cover;
    background-position: 50%;
}

@media (max-width: 768px) {
    a.product-detail-list {
        background-color: #f3f5f8;
        background-image: url(../img/w45wr.webp),linear-gradient(180deg,#f3f5f8,#fff 178px,#fff);
        background-size: 340px auto,auto;
        background-position: 100% 0;
        background-repeat: no-repeat;
        border: 2px solid #fff;
        box-shadow: 8px 8px 20px 0 rgb(55 99 170 / 10%), -8px -8px 20px 0 #fff;
        border-radius: 4px;
        padding: 18px;
        box-sizing: border-box;
        height: 150px;
        position: relative;
    }
}

.nav-tabs {
    border-bottom: 0
}

.nav-tabs .nav-link {
    border: solid transparent;
    border-width: 0 0 2px;
    border-radius: 0;
    text-transform: uppercase;
    line-height: 1;
    font-weight: 500;
    font-size: 12px;
    color: rgba(0,0,0,.55);
    padding: 17px 29px 16px
}

.nav-tabs .nav-link:hover {
    background-color: #f7f7f7;
    border-color: transparent
}

.nav-tabs .nav-link:focus {
    border-color: transparent
}

.nav-tabs .nav-item.show .nav-link,.nav-tabs .nav-link.active {
    color: #1664ff;
    border-color: #1664ff;
}

.nav-pills {
    margin-left: -.5rem
}

.nav-pills .nav-link {
    border-radius: .25rem;
    font-size: 12px;
    text-transform: uppercase;
    padding: 17px 29px 16px;
    line-height: 1;
    background-color: #f7f7f7;
    font-weight: 500;
    color: rgba(0,0,0,.55);
    margin: .5rem
}

.nav-pills .nav-link.active,.nav-pills .show>.nav-link {
    background-color: #e3ebf7;
    color: #285192
}

.nav-fill .nav-item .nav-link,.nav-justified .nav-item .nav-link {
    width: auto
}

.ann-card ul.nav.nav-tabs {
    margin-bottom: 5px;
}

.clientarea-home .card .card-body li h5 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.solution-item {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    background-color: #fff;
    border-radius: 8px;
    padding: 28px 24px;
    height: 193px;
    overflow: hidden;
    position: relative;
    margin: 0 0px 20px;
    border: 1px solid #e6e6e6
}

.solution-item .subtitle {
    margin-bottom: 28px;
    font-weight: 600;
    font-size: 22px;
    line-height: 31px
}

.solution-item p {
    margin-top: 12px;
    z-index: 2;
    margin-bottom: 0px;
}

.solution-item p a {
    position: relative;
    color: #181818;
    font-size: 14px;
}

.solution-item p a i {
    font-size: 20px;
    line-height: 14px;
    vertical-align: text-bottom;
    vertical-align: middle;
    display: inline-block;
    transition: all .3s
}

.solution-item p a:hover i {
    transform: translateX(4px)
}

.solution-item p a>i {
    margin-left: 12px
}

.solution-item .background-box {
    width: 208px;
    height: 193px;
    position: absolute;
    right: 0;
    top: 0;
    background-repeat: no-repeat;
    background-position-y: center;
    background-position-x: center;
    background-size: 208px 193px
}

.solution-item:hover {
    position: relative;
    background-color: #02e894;
    background-image: -webkit-linear-gradient(344deg,#02e894,#00ab75);
    background-image: linear-gradient(106deg,#02e894,#00ab75);
    color: #fff
}




.solution-item:hover:before {
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    background: url(../img/home/solutionBg.png);
    position: absolute;
    left: 0;
    top: 0
}

.table {
    width: 100%;
    margin-bottom: 1rem;
    color: #212529
}

.table th, .table td {
    padding: .75rem;
    vertical-align: top;
    border-top: 1px solid #d5dce5
}

.table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #d5dce5
}

.table tbody + tbody {
    border-top: 2px solid #d5dce5
}

.table-sm th, .table-sm td {
    padding: .3rem
}

.table-bordered {
    border: 1px solid #d5dce5
}

.table-bordered th, .table-bordered td {
    border: 1px solid #d5dce5
}

.table-bordered thead th, .table-bordered thead td {
    border-bottom-width: 2px
}

.table-borderless th, .table-borderless td, .table-borderless thead th, .table-borderless tbody + tbody {
    border: 0
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, .05)
}

.table-hover tbody tr:hover {
    color: #212529;
    background-color: rgb(52 97 255 / 5%);
    --bs-table-accent-bg: transparent;
}

.table-primary, .table-primary > th, .table-primary > td {
    background-color: #b8d8f3
}

.table-primary th, .table-primary td, .table-primary thead th, .table-primary tbody + tbody {
    border-color: #7bb6e9
}

.table-hover .table-primary:hover {
    background-color: #a2ccef
}

.table-hover .table-primary:hover > td, .table-hover .table-primary:hover > th {
    background-color: #a2ccef
}

.table-secondary, .table-secondary > th, .table-secondary > td {
    background-color: #f5c9c8
}

.table-secondary th, .table-secondary td, .table-secondary thead th, .table-secondary tbody + tbody {
    border-color: #ec9b99
}

.table-hover .table-secondary:hover {
    background-color: #f1b4b2
}

.table-hover .table-secondary:hover > td, .table-hover .table-secondary:hover > th {
    background-color: #f1b4b2
}

.table-success, .table-success > th, .table-success > td {
    background-color: #b8d8f3
}

.table-success th, .table-success td, .table-success thead th, .table-success tbody + tbody {
    border-color: #7bb6e9
}

.table-hover .table-success:hover {
    background-color: #a2ccef
}

.table-hover .table-success:hover > td, .table-hover .table-success:hover > th {
    background-color: #a2ccef
}

.table-info, .table-info > th, .table-info > td {
    background-color: #d1edf6
}

.table-info th, .table-info td, .table-info thead th, .table-info tbody + tbody {
    border-color: #aadeee
}

.table-hover .table-info:hover {
    background-color: #bce5f2
}

.table-hover .table-info:hover > td, .table-hover .table-info:hover > th {
    background-color: #bce5f2
}

.table-warning, .table-warning > th, .table-warning > td {
    background-color: #fbe8cd
}

.table-warning th, .table-warning td, .table-warning thead th, .table-warning tbody + tbody {
    border-color: #f7d4a3
}

.table-hover .table-warning:hover {
    background-color: #f9ddb5
}

.table-hover .table-warning:hover > td, .table-hover .table-warning:hover > th {
    background-color: #f9ddb5
}

.table-danger, .table-danger > th, .table-danger > td {
    background-color: #f4cfce
}

.table-danger th, .table-danger td, .table-danger thead th, .table-danger tbody + tbody {
    border-color: #eba6a3
}

.table-hover .table-danger:hover {
    background-color: #efbbb9
}

.table-hover .table-danger:hover > td, .table-hover .table-danger:hover > th {
    background-color: #efbbb9
}

.table-active, .table-active > th, .table-active > td {
    background-color: rgba(0, 0, 0, .075)
}

.table-hover .table-active:hover {
    background-color: rgba(0, 0, 0, .075)
}

.table-hover .table-active:hover > td, .table-hover .table-active:hover > th {
    background-color: rgba(0, 0, 0, .075)
}

.table .thead-dark th {
    color: #fff;
    background-color: #343a40;
    border-color: #454d55
}

.table .thead-light th {
    color: #495057;
    background-color: #e9ecef;
    border-color: #d5dce5
}

.table-dark {
    color: #fff;
    background-color: #343a40
}

.table-dark th, .table-dark td, .table-dark thead th {
    border-color: #454d55
}

.table-dark.table-bordered {
    border: 0
}

.table-dark.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, .05)
}

.table-dark.table-hover tbody tr:hover {
    color: #fff;
    background-color: rgba(255, 255, 255, .075)
}

@media (max-width: 575.98px) {
    .table-responsive-sm {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch
    }

    .table-responsive-sm > .table-bordered {
        border: 0
    }
}

@media (max-width: 767.98px) {
    .table-responsive-md {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch
    }

    .table-responsive-md > .table-bordered {
        border: 0
    }
}

@media (max-width: 991.98px) {
    .table-responsive-lg {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch
    }

    .table-responsive-lg > .table-bordered {
        border: 0
    }
}

@media (max-width: 1199.98px) {
    .table-responsive-xl {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch
    }

    .table-responsive-xl > .table-bordered {
        border: 0
    }
}

.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch
}

.table-responsive > .table-bordered {
    border: 0
}

.table-masspay {
    margin-top: 20px
}

.table-masspay tr th {
    font-weight: 500
}

.table-masspay tr td h5 {
    font-size: 15px
}

.table-masspay tr td h5 i {
    margin-right: 4px
}

.table-masspay tr td a {
    text-decoration: none
}

.table-masspay .item-description td {
    border: 0 none !important
}

.table-masspay .masspay-total td {
    font-size: 15px;
    font-weight: 500;
    background-color: transparent;
    padding: 15px 0
}

.table-masspay .masspay-total td.text-right {
    padding-right: 4px
}

.table-container {
    background-color: #fff;
    border: 1px solid #d5dce5;
    padding: 0;
    margin-bottom: 20px;
    border-radius: 4px;
    border-radius: 10px;
    box-shadow: 0px 1px 2px rgb(0 0 0 / 10%);
    border-radius: 2px;
}

.table-container .listtable .table {
    margin-bottom: 0!important;
    margin-top: 0!important;
}

.table-container .listtable .table thead th {
    font-weight: normal;
    font-size: 80%;
    border-bottom: 2px solid #d5dce5
}

.table-container .listtable .table thead th[class*=sorting_] {
    background-color: #fff;
    border-bottom: 2px solid #3461ff;
}

.table-container .listtable .table tbody .col-small {
    width: 45px;
    min-width: 45px
}

.table-container .listtable .table tbody .col-small.center {
    text-align: center
}

.table-container .listtable .table tbody tr {
    cursor: pointer
}

.table-container .listtable .table tbody tr.row-detail ul {
    padding: 0
}

.table-container .listtable .table tbody tr.row-detail ul li {
    list-style-type: none
}

.table-container .listtable .table tbody tr td {
    outline: none !important
}

.table-container .listtable .table tbody tr td a {
    text-decoration: none
}

.table-container .listtable .table tbody tr td .text-small {
    display: inline-block;
    font-size: 85%
}

.table-container .listtable .table tbody tr td .ssl-info {
    display: inline-block
}

.table-container .listtable .table tbody tr td .ssl-info img {
    height: 12px;
    width: 12px;
    max-width: 12px
}

.table-container .listtable .table tbody tr td .btn-link {
    color: #0273d4;
    background-color: transparent !important;
    text-decoration: none
}

@media (min-width: 1041px) {
    .table-container .listtable .table tbody tr td .cycle-text {
        display: block
    }
}

.table-container .listtable .table thead tr th, .table-container .listtable .table tbody tr th, .table-container .listtable .table tfoot tr th, .table-container .listtable .table thead tr td, .table-container .listtable .table tbody tr td, .table-container .listtable .table tfoot tr td {
    position: relative;
    vertical-align: middle
}

.table-container .listtable .table.datatable.has-columns-hidden tbody tr td a {
    -ms-word-break: break-all;
    word-break: break-all
}

.table-container .listtable .table.datatable.has-columns-hidden tbody tr td span.responsiveExpander {
    top: 0 !important;
    left: 0;
    bottom: 0;
    border: 0;
    border-radius: 0;
    height: 100%;
    width: 44px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    text-align: center;
    text-indent: 0 !important;
    outline: 0;
    background-color: #edf0f5
}

.table-container .listtable .table.datatable.has-columns-hidden tbody tr td span.responsiveExpander:before {
    font-weight: 500
}

.table-container .listtable .table.datatable.has-columns-hidden tbody tr td:first-child {
    padding-left: 60px
}

.table-container .dataTables_filter, .table-container .dataTables_info {
    display: none
}

.table-container .table-header {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px 15px;
    border-bottom: 1px solid #d5dce5
}

.table-container .table-header label {
    font-weight: normal;
    margin: 0;
    margin-right: 10px
}

.table-container .table-header .btn {
    background-color: #fff !important;
    border: 1px solid #d5dce5 !important;
    padding: 3px 6px
}

.table-container .dataTables_paginate {
    margin: 0;
    white-space: nowrap;
    text-align: right;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    float: right;
    padding: 10px 15px
}

.table-container .dataTables_paginate .pagination {
    margin: 0
}

.table-container .dataTables_length {
    border-top: 1px solid #d5dce5
}

.table-container .dataTables_length label {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    text-align: left;
    white-space: nowrap;
    padding: 10px 15px;
    margin: 0
}

.table-container .dataTables_length:after {
    display: block;
    content: "";
    clear: both
}

.table-container.domain-pricing-table {
    box-shadow: none !important;
    border: 0 none
}

.table-container.domain-pricing-table table {
    box-shadow: 0px 4px 6px 0px rgba(0, 11, 40, .1);
    border: 1px solid #d5dce5
}

.table-container.domain-pricing-table .dataTables_filter {
    display: block
}

.dataTable.table.has-columns-hidden > tbody > tr > td > span.responsiveExpander::before {
    font-style: normal;
    font-weight: 900;
    content: "\2b";
    padding-right: 5px;
    font-size: 19px;
    color: rgb(136, 136, 136);
    font-family: "Font Awesome 5 Pro" !important;
}

.pagination {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: .25rem
}

.pagination li a {
    position: relative;
    display: block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #0273d4;
    background-color: #fff;
    border: 1px solid #dee2e6;
}

.pagination li:hover {
    z-index: 2;
    color: #0c8efd;
    text-decoration: none;
    background-color: #e9ecef;
    border-color: #dee2e6
}

.pagination li:focus {
    z-index: 3;
    outline: 0;
    box-shadow: 0 0 0 .2rem rgba(2, 115, 212, .25)
}

.pagination li:first-child a {
    margin-left: 0;
    border-top-left-radius: .25rem;
    border-bottom-left-radius: .25rem
}

.pagination li:last-child a {
    border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem
}

.pagination li.active a {
    z-index: 3;
    color: #fff;
    background-color: #0273d4;
    border-color: #0273d4
}

.pagination li.disabled a {
    color: #6c757d;
    pointer-events: none;
    cursor: auto;
    background-color: #fff;
    border-color: #dee2e6
}

.pagination-lg .page-link {
    padding: .75rem 1.5rem;
    font-size: 1.25rem;
    line-height: 1.5
}

.pagination-lg .page-item:first-child .page-link {
    border-top-left-radius: .3rem;
    border-bottom-left-radius: .3rem
}

.pagination-lg .page-item:last-child .page-link {
    border-top-right-radius: .3rem;
    border-bottom-right-radius: .3rem
}

.pagination-sm .page-link {
    padding: .25rem .5rem;
    font-size: .875rem;
    line-height: 1.5
}

.pagination-sm .page-item:first-child .page-link {
    border-top-left-radius: .2rem;
    border-bottom-left-radius: .2rem
}

.pagination-sm .page-item:last-child .page-link {
    border-top-right-radius: .2rem;
    border-bottom-right-radius: .2rem
}

form[name='hiddenProduct'] {
    display: flex;
    margin-bottom: 10px;
    margin-left: -20px;
}

form[name='hiddenInvoice'] {
    display: flex;
    margin-bottom: 10px;
    margin-left: -10px;
}

@media (max-width: 768px) {
    .hideChecks {
        left: 10px;
    }
}

.no-data .text {
    margin-top: 10px;
    margin-bottom: 20px;
}

.service-tab a {
    line-height: 65px;
    text-decoration: none;
    display: inline-block;
    height: inherit;
}

.service-mod {
    position: relative;
    padding: 40px 0 60px;
    background: #F5F5F5;
    overflow: hidden;
}

.service-tab {
    background: #FFF;
    box-shadow: 0 20px 20px 0 rgb(0 0 0 / 10%);
}

.security-tab-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto;
    /* background: -100px 0 no-repeat; */
    background-size: cover;
    margin-bottom: 30px;
    background-repeat: inherit;
    margin-bottom: 60px;
}

.security-tab-icon:hover {
    background-position: 0 0;
}

.service-tab .title-main {
    padding-top: 70px;
    text-align: center;
}

.security-tab-title {
    position: absolute;
    bottom: 20px;
    left: 0;
    width: 100%;
    margin-top: 20px;
    font-size: 18px;
    line-height: 25px;
    color: #666;
    font-family: PingFangSC-Medium, sans-serif;
    text-align: center;
    font-family: 'djf';
}

.service-nav-link {
    position: relative;
    height: 130px;
    cursor: pointer;
    width: 100%;
    border-bottom: 4px solid transparent;
}

.service-nav-card {
    text-align: center;
    justify-content: center;
    display: flex;
}

.service-tab-row .col-md-3.active .security-tab-title {
    color: var(--primary);
}

.service-tab-row .col-md-3.active .security-tab-icon {
    background-position: 0 0;
}

.service-tab-row .col-md-3.active .service-nav-link {
    border-bottom: 4px solid var(--primary);
}

a.spro-mod-2 {
    position: relative;
    z-index: 2;
    display: inline-block;
    padding: 10px 20px;
    width: 100%;
    font-size: 14px;
    margin-bottom: 20px;
    text-align: left;
    vertical-align: top;
}

a.spro-mod-2:hover {
    background: url(../img/index/icon_arrow_black_web.svg) right 20px center no-repeat #FFF;
    background-size: 16px 16px;
    box-shadow: 0 10px 20px 0 rgba(0, 0, 0, .1);
}

.spro-mod2-title {
}

.spro-mod2-hint {
    margin-top: 6px;
    font-size: 14px;
    color: #989898;
    line-height: 20px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

span.spro-mod2-title-name {
    margin-top: 6px;
    padding-right: 14px;
    font-size: 16px;
    color: #333;
    line-height: 30px;
}

span.hot {
    width: 28px;
    height: 20px;
    margin-right: 10px;
    display: inline-block;
    vertical-align: sub;
    background: url(../img/index/tag_hot_white_web.svg) right center no-repeat;
}

span.sale {
    width: 28px;
    height: 20px;
    margin-right: 10px;
    display: inline-block;
    vertical-align: sub;
    background: url(../img/index/icon_sale_white.svg) right center no-repeat;
}

.fade:not(.show) {
    display: none;
}

section.subtop.ec {
    background-image: url(../img/product/banner_ec_templetes2024.jpg);
    background-position: center; 
}

section.subtop.cdn {
    background-image: url(../img/product/banner_cdn_templetes2024.jpg);
    background-position: center;
}

section.subtop.dedicated {
    background-image: url(../img/product/server-banner.jpg);
    background-position: center;
}

section.subtop.host {
    background-image: url(../img/product/banner_host_templetes2024.jpg);
    background-position: center;
}

.subtop.ec .subtop-title,.subtop.cdn .subtop-title,.subtop.server .subtop-title {
    color: #121933;
}

section.subtop.ec p,section.subtop.cdn p ,section.subtop.server p {
    color: rgb(82, 82, 82);
    font-size: 18px;
}

.home-service .product-type-item {
    height: 190px;
    margin-bottom: 20px;
}

.home-service .product-type-item .product-type-item-content {
    position: relative;
    float: left;
    width: 100%;
    height: 190px;
    background: linear-gradient(0deg, #FFFFFF, #FFFFFF);
    padding: 23px 15px 23px 23px;
    border: 1px solid #FFF;
    -webkit-transition: all 0.15s;
    -moz-transition: all 0.15s;
    -o-transition: all 0.15s;
    transition: all 0.15s;
    box-shadow: 0px 4px 8px 0px rgba(30, 35, 45, 0.08);
}

.home-service .product-type-item .product-type-item-content .bg {
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background-repeat: no-repeat;
    background-position: right center;
}

.home-service .product-type-item .product-type-item-content > a {
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    z-index: 3;
}

.home-service .product-type-item:hover .product-type-item-content {
    background: linear-gradient(0deg, #FFFFFF, #F0F2F5);
    margin-top: -8px;
    box-shadow: 0px 8px 8px 0px rgba(30, 35, 45, 0.08);
}

.home-service .product-type-item:hover .product-type-item-content .title {
    color: var(--primary);
}

.home-service .product-type-item:last-child {
    margin-bottom: 0px;
}

.home-service .product-type-item .title {
    position: relative;
    z-index: 2;
    height: 24px;
    line-height: 24px;
    font-size: 20px;
    color: #2D3037;
}

.home-service .product-type-item .title a {
    font-size: 20px;
    color: #2D3037;
}

.home-service .product-type-item .title a:hover {
    color: var(--primary);
}

.home-service .product-type-item .title .minprice {
    position: relative;
    display: inline-block;
    height: 24px;
    line-height: 22px;
    font-size: 12px;
    color: var(--primary);
    padding: 0px 8px;
    border: 1px solid var(--primary);
    vertical-align: top;
    margin-left: 16px;
}

.home-service .product-type-item .title .yh-s {
    display: inline-block;
    vertical-align: top;
    height: 24px;
    line-height: 24px;
    font-size: 12px;
    color: #FFFFFF;
    background-color: var(--primary);
    padding: 0px 8px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    margin-left: 6px;
}

.home-service .product-type-item .des {
    position: relative;
    z-index: 2;
    line-height: 24px;
    font-size: 14px;
    color: #5E6D81;
    margin-top: 10px;
}

.home-service .product-type-item .badge-list {
    position: relative;
    z-index: 2;
    margin-top: 10px;
}

.home-service .product-type-item .badge-list span {
    float: left;
    height: 20px;
    line-height: 18px;
    color: #9EA7B3;
    padding: 0px 8px;
    border: 1px solid #BDC5D3;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    margin-right: 4px;
}

.home-service .product-type-item .badge-list span:last-child {
    margin-right: 0px;
}

.home-service .product-type-item .link {
    position: relative;
    z-index: 4;
    height: 36px;
    margin-top: 18px;
}

.home-service .product-type-item .link a {
    float: left;
    width: 100px;
    font-size: 14px;
    text-align: center;
    border: 1px solid var(--primary);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    margin-right: 16px;
}

.home-service .product-type-item .link a:nth-child(1) {
    color: #FFFFFF;
    background-color: var(--primary);
}

.home-service .product-type-item .link a:nth-child(1):hover {
    background-color: var(--primary-hover);
}

.home-service .product-type-item .link a:last-child {
    color: #2D3037;
    border-color: #BDC5D3;
    margin-right: 0px;
}

.home-service .product-type-item .link a:last-child:hover {
    color: var(--primary);
    border-color: var(--primary);
}

.home-service .product-item {
    float: left;
    height: 190px;
    padding: 24px 10px 0px 10px;
    margin-bottom: 20px;
}

.home-service .product-item .title {
    height: 24px;
    line-height: 24px;
    font-size: 18px;
    color: #2D3037;
    white-space: nowrap;
}

.home-service .product-item .title .minprice {
    position: relative;
    display: inline-block;
    height: 24px;
    line-height: 22px;
    font-size: 12px;
    color: var(--primary);
    padding: 0px 8px;
    border: 1px solid var(--primary);
    vertical-align: top;
    margin-left: 16px;
}

.home-service .product-item .title .yh-s {
    display: inline-block;
    vertical-align: top;
    height: 24px;
    line-height: 24px;
    font-size: 12px;
    color: #FFF;
    padding: 0px 8px;
    background-color: var(--primary);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    margin-left: 6px;
}

.home-service .product-item .des {
    line-height: 24px;
    font-size: 14px;
    color: #5E6D81;
    margin-top: 12px;
    margin-bottom: 0px;
}

.home-service .product-item .badge-list {
    margin-top: 15px;
}

.home-service .product-item .badge-list span {
    float: left;
    height: 22px;
    line-height: 20px;
    color: #9EA7B3;
    padding: 0px 7px;
    border: 1px solid #BDC5D3;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    margin-right: 4px;
}

.home-service .product-item .badge-list span:last-child {
    margin-right: 0px;
}

.home-service .product-item .now-s-buy {
    display: inline-block;
    vertical-align: top;
    height: 24px;
    line-height: 24px;
    font-size: 14px;
    color: #9EA7B3;
    margin-top: 22px;
}

.home-service .product-item .now-s-buy i {
    display: inline-block;
    width: 6px;
    height: 11px;
    background: url(../../images/arrow-right-gray.png) no-repeat center;
    margin-left: 9px;
    vertical-align: -1px;
    -webkit-transition: all 0.15s;
    -moz-transition: all 0.15s;
    -o-transition: all 0.15s;
    transition: all 0.15s;
}

.home-service .product-item .now-s-buy:hover {
    color: var(--primary);
}

.home-service .product-item .now-s-buy:hover i {
    background: url(../../images/link-arrow-right.png) no-repeat center;
    -webkit-transform: translateX(8px);
    -moz-transform: translateX(8px);
    -o-transform: translateX(8px);
    transform: translateX(8px);
}

.home-service .product-item .look-all-product-link {
    line-height: 20px;
    font-size: 14px;
    color: var(--primary);
    margin-top: 15px;
}

.home-service .product-item .look-all-product-link .arrow {
    display: inline-block;
    width: 6px;
    height: 11px;
    background: url(../../images/link-arrow-right.png) no-repeat center;
    margin-left: 10px;
    -webkit-transition: all 0.15s;
    -moz-transition: all 0.15s;
    -o-transition: all 0.15s;
    transition: all 0.15s;
}

.home-service .product-item .look-all-product-link:hover .arrow {
    -webkit-transform: translateX(8px);
    -moz-transform: translateX(8px);
    -o-transform: translateX(8px);
    transform: translateX(8px);
}

.home-service .product-item:hover .title {
    color: var(--primary);
}

/* v2 */
.hotnew-left {
}

.hotnew-left .better {
    position: relative;
    border-radius: 2px;
    border: 1px solid #fff;
    height: 302px;
    background-size: auto 302px;
    padding: 40px 0 0 30px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: left;
    background: url(http://p4.qhimg.com/t010ead841227128fed.png), linear-gradient(rgb(217, 255, 239) 0.01%, rgb(240, 252, 247) 100%);
    background-repeat: no-repeat!important;
    background-position: 100% 0!important;
    background-size: 100% auto!important;
}

.hotnew-left .better h2 {
    height: 24px;
    font-size: 24px;
    font-weight: 500;
    color: #181818;
    line-height: 24px;
    margin-bottom: 30px;
    font-family: 'djf';
}

.hotnew-left .better .des {
    margin-top: 10px;
    height: 22px;
    font-size: 14px;
    font-weight: 400;
    color: #6e6e6e;
    line-height: 22px
}

.hotnew-left .better .enter {
    position: relative;
    z-index: 10;
    margin-top: 30px;
    width: 88px;
    height: 28px;
    background: #337dff;
    -webkit-box-shadow: 2px 2px 8px 0 rgba(51,125,255,.3);
    box-shadow: 2px 2px 8px 0 rgba(51,125,255,.3);
    border-radius: 2px;
    font-size: 12px;
    font-weight: 400;
    color: #fff;
    line-height: 28px;
    text-align: center;
    cursor: pointer;
    background-color: var(--primary);
    border-color: var(--primary);
    padding: 10px 30px;
    margin-top: 40px;
}

.hotnew-left .better .enter.home-service:hover {
    background-color: #1f6bf1
}

.hotnew-left .better .triangle {
    position: absolute;
    top: 0;
    right: 0;
    width: auto;
    height: 300px;
    z-index: 100;
}

.hotnew-left .hotnew-all {
    margin-top: 8px;
    height: 147px;
    background: #fff;
    border-radius: 2px;
    padding: 20px 25px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: left;
    cursor: pointer;
    background-color: #fff4d7;
    background-image: url(https://easyv.assets.dtstack.com/homepage/common/assets/images/price/saas_advanced_newbg.png);
    border: 1px solid #fff;
}

.hotnew-left .hotnew-all:hover h4 {
    color: var(--primary);
}

.hotnew-left .hotnew-all:hover h4 .product-right {
    -webkit-transform: translateX(5px);
    transform: translateX(5px)
}

.hotnew-left .hotnew-all h4 {
    height: 25px;
    font-size: 18px;
    font-weight: 500;
    color: #181818;
    line-height: 25px
}

.hotnew-left .hotnew-all h4 .product-right {
    display: inline-block;
    padding-left: 5px;
    font-size: 18px;
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s,-webkit-transform .2s
}

.hotnew-left .hotnew-all p {
    margin-top: 10px;
    font-size: 14px;
    font-weight: 400;
    color: #6e6e6e;
    line-height: 22px
}

.special-div {
    margin-bottom: 8px;
    width: 100%;
    height: 147px;
    padding: 30px 24px 19px;
    text-align: left;
    border-radius: 2px;
    position: relative;
    background: #fff;
    cursor: pointer;
}

.special-div .label p {
    padding: 1px 5px;
    border-radius: 2px;
    border: 1px solid #e3e3e3;
    font-weight: 400;
    color: #aaa;
    line-height: 18px;
    font-size: 12px;
    margin-right: 8px;
    cursor: pointer;
}

.special-div .label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 10px;
}

.special-div .header {
    height: 25px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.special-div .header span {
    font-size: 18px;
    font-weight: 500;
    color: #181818;
    line-height: 25px;
}

p.normal_subtitle {
    width: auto;
    margin-top: 10px;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    color: #6e6e6e;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.special-div.sale {
    background: url(../img/product/logo.svg);
    border: 1px solid #fff;
    border-radius: 2px;
    position: relative;
    cursor: pointer;
    background-size: cover;
}

.special-div .iconbox {
    width: 57px;
    height: 57px;
    position: absolute;
    top: -2px;
    right: -2px;
}

.special-div .iconbox img {
    width: 57px;
    height: 57px;
}

.special-div .iconbox p {
    position: absolute;
    top: 11px;
    right: 8px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    font-size: 12px;
    font-weight: 500;
    color: #fff;
}

.special-div:hover {
    -webkit-box-shadow: 0 2px 8px 0 rgb(0 0 0 / 10%);
    box-shadow: 0 2px 8px 0 rgb(0 0 0 / 10%);
}

.special-div:hover .header span {
    color: #337dff;
}

.WPA3-SELECT-PANEL {
    z-index: 2147483647;
    width: 463px;
    height: 292px;
    margin: 0;
    padding: 0;
    border: 1px solid #d4d4d4;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 15px #d4d4d4;
}

.WPA3-SELECT-PANEL * {
    position: static;
    z-index: auto;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: auto;
    height: auto;
    max-height: auto;
    max-width: auto;
    min-height: 0;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
    clear: none;
    clip: auto;
    background: transparent;
    color: #333;
    cursor: auto;
    direction: ltr;
    filter: ;
    float: none;
    font: normal normal normal 12px "Helvetica Neue", Arial, sans-serif;
    line-height: 16px;
    letter-spacing: normal;
    list-style: none;
    marks: none;
    overflow: visible;
    page: auto;
    quotes: none;
    -o-set-link-source: none;
    size: auto;
    text-align: left;
    text-decoration: none;
    text-indent: 0;
    text-overflow: clip;
    text-shadow: none;
    text-transform: none;
    vertical-align: baseline;
    visibility: visible;
    white-space: normal;
    word-spacing: normal;
    word-wrap: normal;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    -ms-opacity: 1;
    -o-opacity: 1;
    opacity: 1;
    -webkit-outline: 0;
    -moz-outline: 0;
    -ms-outline: 0;
    -o-outline: 0;
    outline: 0;
    -webkit-text-size-adjust: none;
    font-family: Microsoft YaHei,Simsun;
}

.WPA3-SELECT-PANEL a {
    cursor: auto;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-TOP {
    height: 25px;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-CLOSE {
    float: right;
    display: block;
    width: 47px;
    height: 25px;
    background: url(http://combo.b.qq.com/crm/wpa/release/3.3/wpa/views/SelectPanel-sprites.png) no-repeat;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-CLOSE:hover {
    background-position: 0 -25px;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-MAIN {
    padding: 23px 20px 45px;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-GUIDE {
    margin-bottom: 42px;
    font-family: "Microsoft Yahei";
    font-size: 16px;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-SELECTS {
    width: 246px;
    height: 111px;
    margin: 0 auto;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-CHAT {
    float: right;
    display: block;
    width: 88px;
    height: 111px;
    background: url(http://combo.b.qq.com/crm/wpa/release/3.3/wpa/views/SelectPanel-sprites.png) no-repeat 0 -80px;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-CHAT:hover {
    background-position: -88px -80px;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-AIO-CHAT {
    float: left;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-QQ {
    display: block;
    width: 76px;
    height: 76px;
    margin: 6px;
    background: url(http://combo.b.qq.com/crm/wpa/release/3.3/wpa/views/SelectPanel-sprites.png) no-repeat -50px 0;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-QQ-ANONY {
    background-position: -130px 0;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-LABEL {
    display: block;
    padding-top: 10px;
    color: #00a2e6;
    text-align: center;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-BOTTOM {
    padding: 0 20px;
    text-align: right;
}

.WPA3-SELECT-PANEL .WPA3-SELECT-PANEL-INSTALL {
    color: #8e8e8e;
}

.network-providers img {
    margin: 5px 25px;
}

.cros-pricing-container {
    position: relative
}

.cros-pricing-container .owl-carousel {
    margin-bottom: 0
}

.cros-pricing-container .owl-carousel .owl-prev.disabled, .cros-pricing-container .owl-carousel .owl-next.disabled {
    display: none
}

.cros-pricing-container .owl-carousel .owl-prev {
    position: absolute;
    left: -120px;
    top: 50%;
    margin-top: -32px
}

.cros-pricing-container .owl-carousel .owl-next {
    position: absolute;
    right: -120px;
    top: 50%;
    margin-top: -32px
}

.cros-pricing-container .pricing-slider, .cros-pricing-container .pricing-box, .cros-pricing-container .home-products {
    position: relative;
    z-index: 2
}

.cros-pricing-container .pricing-slider .slide-item, .cros-pricing-container .pricing-box .slide-item, .cros-pricing-container .home-products .slide-item {
    padding: 45px 10px 0
}

.cros-pricing-container .tns-nav {
    text-align: center
}

.cros-pricing-container .tns-controls {
    position: absolute;
    top: -20px;
    left: auto;
    right: 30px;
    z-index: 5
}

@media (max-width: 991px) {
    .cros-pricing-container .tns-controls {
        left: 30px;
        right: auto
    }
}

.cros-pricing-container .cros-pricing-table {
    position: relative;
    margin: 0 0 45px;
    padding: 10px 30px 15px;
    box-shadow: 0px 4px 6px 0px rgba(0, 11, 40, .1);
    border: 1px solid #d5dce5;
    z-index: 2;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    border-radius: 4px;
    color: #2a2e36
}

.cros-pricing-container .cros-pricing-table .st-sm {
    display: none
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing {
    display: block
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group {
    width: 100%
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .btn {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent !important;
    border-color: #d5dce5;
    color: #2a2e36;
    padding: 5px 10px;
    text-align: left;
    margin: 0
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .btn .fas, .cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .btn .far, .cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .btn .fal, .cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .btn .fad {
    margin: 0
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .btn.dropdown-toggle:after {
    display: none
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .dropdown-menu {
    width: 100%;
    border-color: #d5dce5;
    border-radius: 0;
    padding: 0
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .dropdown-menu li {
    display: block;
    padding: 5px 10px;
    cursor: pointer;
    border-bottom: 1px solid #d5dce5;
    position: relative
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .dropdown-menu li:last-child {
    border-bottom: 0 none
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .dropdown-menu li:hover, .cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .dropdown-menu li:focus {
    background-color: #edf0f5
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .dropdown-menu li .current_prcing {
    color: #2a2e36
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .dropdown-menu li .current_prcing .dollar {
    font-size: 20px
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .save_text {
    margin-bottom: 5px;
    font-size: 90%
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .discounted_options {
    color: #777
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .discounted_options div:first-child {
    margin-right: 4px
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .discounted_options .price_duration {
    font-size: 14px
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .discounted_options .regular_pricing.savecut {
    position: relative;
    display: inline-block;
    font-size: 11px
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .discounted_options .regular_pricing.savecut:before {
    content: "";
    position: absolute;
    top: 50%;
    left: -2px;
    width: calc(100% + 8px);
    height: 1px;
    background: #2a2e36
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .current_prcing {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-align: baseline;
    align-items: baseline;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-word-break: break-all;
    word-break: break-all
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .current_prcing .dollar, .cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .current_prcing .cents, .cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .current_prcing .prefix {
    font-weight: 700;
    color: #db3f3b
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .current_prcing .suffix {
    font-weight: 700;
    margin: 0 2px
}

.cros-pricing-container .cros-pricing-table .billing-cycle-pricing .btn-group .current_prcing .dollar {
    font-size: 29px;
    color: #db3f3b
}

@media only screen and (max-width: 767px) {
    .cros-pricing-container .cros-pricing-table .PriceList-toggle {
        margin: 15px 0;
        cursor: pointer;
        font-weight: 700
    }

    .cros-pricing-container .cros-pricing-table .plan-features {
        padding: 0
    }
}

.cros-pricing-container .cros-pricing-table .table-heading {
    display: inline-block;
    background-color: #0273d4;
    color: #fff;
    padding: .08em .7em .08em .7em;
    line-height: 1.42857143;
    position: relative;
    text-transform: none;
    margin: 30px 0 0
}

.cros-pricing-container .cros-pricing-table .table-heading:after {
    content: "";
    background-color: #0273d4;
    position: absolute;
    top: 0;
    right: -.1em;
    width: .2em;
    height: 1.535em;
    -moz-transform: skew(-7deg, 0);
    -webkit-transform: skew(-7deg, 0);
    -o-transform: skew(-7deg, 0);
    -ms-transform: skew(-7deg, 0);
    transform: skew(-7deg, 0)
}

.cros-pricing-container .cros-pricing-table .table thead th {
    font-weight: 500;
    border-bottom: 0 none
}

.cros-pricing-container .cros-pricing-table .table thead th:first-child {
    font-weight: 700
}

.cros-pricing-container .cros-pricing-table .table th {
    text-align: center
}

.cros-pricing-container .cros-pricing-table .table th:first-child {
    text-align: left
}

.cros-pricing-container .cros-pricing-table .table tbody {
    border-collapse: separate
}

.cros-pricing-container .cros-pricing-table .table tbody tr {
    vertical-align: baseline;
    background-color: #edf0f5;
    border-bottom: 10px solid #fff
}

.cros-pricing-container .cros-pricing-table .table tbody td {
    vertical-align: middle;
    text-align: center;
    border-right: 1px solid #fff;
    border-top: 0 none
}

.cros-pricing-container .cros-pricing-table .table tbody td h3, .cros-pricing-container .cros-pricing-table .table tbody td h4, .cros-pricing-container .cros-pricing-table .table tbody td .h3, .cros-pricing-container .cros-pricing-table .table tbody td .h4 {
    background: transparent;
    padding: 0;
    margin: 10px 0;
    border: 0 none
}

.cros-pricing-container .cros-pricing-table .table tbody td:first-child {
    text-align: left;
    border-right: 0 none
}

.cros-pricing-container .cros-pricing-table .table tbody td:last-child {
    border-right: 0 none
}

@media (min-width: 768px) {
    .cros-pricing-container .cros-pricing-table .table tbody td:first-child .server-info img {
        width: 70px;
        max-width: 70px
    }

    .cros-pricing-container .cros-pricing-table .table tbody td:first-child .server-info h4, .cros-pricing-container .cros-pricing-table .table tbody td:first-child .server-info .h4 {
        font-size: 21px;
        margin: 20px 0
    }

    .cros-pricing-container .cros-pricing-table .table tbody td:last-child {
        max-width: 195px
    }
}

@media only screen and (max-width: 991px) {
    .cros-pricing-container .cros-pricing-table .table tbody td .footable-toggle {
        margin-left: 5px
    }
}

.cros-pricing-container .cros-pricing-table .table tbody td.server-heading {
    padding-left: 0
}

.cros-pricing-container .cros-pricing-table .table tbody td .server-info {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background: #1a1a1a;
    color: #fff;
    text-align: left;
    padding: 7px;
    margin-left: -4px;
    position: relative;
    margin-right: 10px
}

.cros-pricing-container .cros-pricing-table .table tbody td .server-info:before {
    border-top: 4px solid transparent;
    border-right: 4px solid #1a1a1a;
    left: 0;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    top: -3px;
    width: 0
}

.cros-pricing-container .cros-pricing-table .table tbody td .server-info h4, .cros-pricing-container .cros-pricing-table .table tbody td .server-info .h4 {
    color: #fff
}

.cros-pricing-container .cros-pricing-table .table tbody td .server-info h5, .cros-pricing-container .cros-pricing-table .table tbody td .server-info .h5 {
    font-weight: 700;
    text-transform: uppercase
}

.cros-pricing-container .cros-pricing-table .table tbody td .server-info img {
    float: right;
    width: 50px;
    max-width: 50px
}

.cros-pricing-container .cros-pricing-table .table tbody td .server-info span .fad {
    font-size: 48px
}

.cros-pricing-container .cros-pricing-table .table tbody td .server-info.highlight {
    border: 5px solid #fedc45;
    margin-right: 0;
    border-left: 0
}

.cros-pricing-container .cros-pricing-table .table tbody td .server-info.highlight:before {
    top: -8px
}

.cros-pricing-container .cros-pricing-table .table tbody td .server-info.highlight.success {
    border-color: #0273d4
}

.cros-pricing-container .cros-pricing-table .table tbody td .server-info.highlight.danger {
    border-color: #d9534f
}

.cros-pricing-container .cros-pricing-table .table tbody td .server-info.highlight.primary {
    border-color: #0273d4
}

.cros-pricing-container .cros-pricing-table .table tbody td small {
    display: block
}

.cros-pricing-container .cros-pricing-table .table tbody td .footable-row-detail-inner {
    width: 100%
}

.cros-pricing-container .cros-pricing-table .table tbody td .footable-row-detail-name {
    color: #0273d4
}

.cros-pricing-container .cros-pricing-table .table tbody td .footable-row-detail-name, .cros-pricing-container .cros-pricing-table .table tbody td .footable-row-detail-value {
    display: block
}

@media only screen and (min-width: 1152px) {
    .cros-pricing-container .cros-pricing-table .table tbody td mark {
        margin-top: 7.5px
    }
}

.cros-pricing-container .cros-pricing-table .table tbody td.server-price {
    background-color: #1a1a1a
}

.cros-pricing-container .cros-pricing-table .table tbody td.server-price a {
    color: #fff
}

.cros-pricing-container .cros-pricing-table .table tbody td.server-price .billing-cycle-pricing .btn-group .btn {
    border: 0 none;
    color: #fff
}

.cros-pricing-container .cros-pricing-table .table tbody td.server-price .billing-cycle-pricing .btn-group .btn .price_duration, .cros-pricing-container .cros-pricing-table .table tbody td.server-price .billing-cycle-pricing .btn-group .btn .regular_pricing, .cros-pricing-container .cros-pricing-table .table tbody td.server-price .billing-cycle-pricing .btn-group .btn .dollar, .cros-pricing-container .cros-pricing-table .table tbody td.server-price .billing-cycle-pricing .btn-group .btn .cents, .cros-pricing-container .cros-pricing-table .table tbody td.server-price .billing-cycle-pricing .btn-group .btn .prefix {
    color: #fff
}

.cros-pricing-container .cros-pricing-table .table tbody td.server-price .billing-cycle-pricing .btn-group .btn .regular_pricing.savecut:before {
    background: #fff
}

.cros-pricing-container .cros-pricing-table .table tbody td.server-price .price {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -ms-word-break: normal;
    word-break: normal;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff
}

.cros-pricing-container .cros-pricing-table .table tbody td.server-price .price span {
    color: #fff
}

.cros-pricing-container .cros-pricing-table .table tbody td.server-price .price span.cost {
    font-size: 21px
}

.cros-pricing-container .cros-pricing-table .table tbody td.server-price .price span.prefix {
    top: -.2em
}

.cros-pricing-container .cros-pricing-table .table tbody td.server-price .btn {
    margin: 0
}

@media only screen and (max-width: 597px) {
    .cros-pricing-container .cros-pricing-table .table tbody td .footable-row-detail-row:last-child {
        margin-top: 15px
    }
}

.cros-pricing-container .cros-pricing-table .table tbody td .btn {
    margin: 15px 0 0
}

@media (min-width: 768px) {
    .cros-pricing-container .cros-pricing-table .table.ssl tbody td:first-child .server-info h4, .cros-pricing-container .cros-pricing-table .table.ssl tbody td:first-child .server-info .h4 {
        text-transform: none
    }
}

.cros-pricing-container .cros-pricing-table .table.ssl tbody td.company {
    width: 150px;
    max-width: 150px
}

.cros-pricing-container .cros-pricing-table .table.ssl tbody td img {
    max-width: 120px;
    width: 120px
}

@media (min-width: 992px) {
    .cros-pricing-container .cros-pricing-table:hover, .cros-pricing-container .cros-pricing-table:focus {
        -ms-transform: translateY(-5px);
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px)
    }
}

.cros-pricing-container .cros-pricing-table.no-animation {
    padding: 15px 30px 20px
}

.cros-pricing-container .cros-pricing-table.no-animation:hover, .cros-pricing-container .cros-pricing-table.no-animation:focus {
    -ms-transform: none;
    -webkit-transform: none;
    transform: none
}

.cros-pricing-container .cros-pricing-table.bg-primary h3, .cros-pricing-container .cros-pricing-table.bg-primary h4, .cros-pricing-container .cros-pricing-table.bg-primary .h3, .cros-pricing-container .cros-pricing-table.bg-primary .h4, .cros-pricing-container .cros-pricing-table.bg-primary .desc, .cros-pricing-container .cros-pricing-table.bg-primary .price span, .cros-pricing-container .cros-pricing-table.bg-primary .plan-features ul li {
    color: #fff
}

.cros-pricing-container .cros-pricing-table.bg-primary .btn-primary {
    background-color: transparent;
    border-color: #fff;
    border-bottom-width: 2px;
    color: #fff
}

.cros-pricing-container .cros-pricing-table.bg-primary .btn-primary:hover, .cros-pricing-container .cros-pricing-table.bg-primary .btn-primary:focus {
    background-color: rgba(255, 255, 255, .1)
}

.cros-pricing-container .cros-pricing-table.bg-primary .starting-from.text-muted {
    color: #fff;
    border-color: #fff
}

.cros-pricing-container .cros-pricing-table.dark h3, .cros-pricing-container .cros-pricing-table.dark h4, .cros-pricing-container .cros-pricing-table.dark .h3, .cros-pricing-container .cros-pricing-table.dark .h4, .cros-pricing-container .cros-pricing-table.dark .desc, .cros-pricing-container .cros-pricing-table.dark .price span, .cros-pricing-container .cros-pricing-table.dark .plan-features ul li {
    color: #fff
}

.cros-pricing-container .cros-pricing-table.bg-primary .billing-cycle-pricing .btn-group, .cros-pricing-container .cros-pricing-table.dark .billing-cycle-pricing .btn-group {
}

.cros-pricing-container .cros-pricing-table.bg-primary .billing-cycle-pricing .btn-group .btn, .cros-pricing-container .cros-pricing-table.dark .billing-cycle-pricing .btn-group .btn {
    color: #fff;
    border-color: rgba(255, 255, 255, .25)
}

.cros-pricing-container .cros-pricing-table.bg-primary .billing-cycle-pricing .btn-group .btn .discounted_options, .cros-pricing-container .cros-pricing-table.dark .billing-cycle-pricing .btn-group .btn .discounted_options, .cros-pricing-container .cros-pricing-table.bg-primary .billing-cycle-pricing .btn-group .btn .current_prcing, .cros-pricing-container .cros-pricing-table.dark .billing-cycle-pricing .btn-group .btn .current_prcing {
    color: #fff
}

.cros-pricing-container .cros-pricing-table.bg-primary .billing-cycle-pricing .btn-group .dropdown-menu li .current_prcing .prefix, .cros-pricing-container .cros-pricing-table.dark .billing-cycle-pricing .btn-group .dropdown-menu li .current_prcing .prefix, .cros-pricing-container .cros-pricing-table.bg-primary .billing-cycle-pricing .btn-group .dropdown-menu li .current_prcing .dollar, .cros-pricing-container .cros-pricing-table.dark .billing-cycle-pricing .btn-group .dropdown-menu li .current_prcing .dollar, .cros-pricing-container .cros-pricing-table.bg-primary .billing-cycle-pricing .btn-group .dropdown-menu li .current_prcing .cents, .cros-pricing-container .cros-pricing-table.dark .billing-cycle-pricing .btn-group .dropdown-menu li .current_prcing .cents {
    color: #db3f3b
}

.cros-pricing-container .cros-pricing-table.bg-primary .text-muted, .cros-pricing-container .cros-pricing-table.dark .text-muted {
    color: rgba(255, 255, 255, .7)
}

.cros-pricing-container .cros-pricing-table.bg-primary .plan .plan__column .plan__header, .cros-pricing-container .cros-pricing-table.dark .plan .plan__column .plan__header {
    border-right: 1px solid rgba(255, 255, 255, .25);
    border-bottom: 3px solid rgba(255, 255, 255, .25)
}

.cros-pricing-container .cros-pricing-table.bg-primary .plan .plan__column .plan__body .plan__cell, .cros-pricing-container .cros-pricing-table.dark .plan .plan__column .plan__body .plan__cell {
    border-right: 1px solid rgba(255, 255, 255, .25);
    border-bottom: 1px solid rgba(255, 255, 255, .25)
}

.cros-pricing-container .cros-pricing-table.no-shadow {
    box-shadow: none
}

.cros-pricing-container .cros-pricing-table .sticker-wrapper {
    position: absolute;
    top: -20px;
    right: 15px
}

.cros-pricing-container .cros-pricing-table .sticker-wrapper .sticker {
    display: block;
    font-size: 14px;
    text-transform: uppercase;
    color: #000;
    font-weight: 700;
    text-align: center;
    -moz-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    transform: rotate(5deg);
    position: relative;
    background-color: #fedc45;
    white-space: nowrap;
    border-radius: 25px 0px 0px 0px;
    border: 3px solid #fff;
    padding: 7.5px 15px;
    background-color: #010101;
    color: #ffffff;
    letter-spacing: 5px;
    text-shadow: 2px 1px 0 #ee1d52, -2px -1px 0 #69c9d0;
    cursor: pointer;
}

@keyframes shadows {
    0%, 100% {
        text-shadow: 4px 0 0 #EE1D52, 0 -4px 0 #69C9D0;
    }

    25% {
        text-shadow: 4px 4px 0 #EE1D52, -4px -4px 0 #69C9D0;
    }

    50% {
        text-shadow: 0 4px 0 #EE1D52, -4px 0 0 #69C9D0;
    }

    75% {
        text-shadow: 0 0 0 #EE1D52, 0 0 0 #69C9D0;
    }
}

.cros-pricing-container .cros-pricing-table.st_s-1 .sticker-wrapper {
    right: -1px;
    left: -1px
}

.cros-pricing-container .cros-pricing-table.st_s-1 .sticker-wrapper .sticker {
    -moz-transform: rotate(0);
    -webkit-transform: rotate(0);
    -o-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    border: 0 none;
    border-radius: 4px 4px 4px 4px;
}

.cros-pricing-container .cros-pricing-table.st_s-2.popular h4, .cros-pricing-container .cros-pricing-table.st_s-2.active h4, .cros-pricing-container .cros-pricing-table.st_s-2.popular .h4, .cros-pricing-container .cros-pricing-table.st_s-2.active .h4 {
    margin-bottom: 0
}

.cros-pricing-container .cros-pricing-table.st_s-2.popular .sticker-wrapper, .cros-pricing-container .cros-pricing-table.st_s-2.active .sticker-wrapper {
    display: none
}

.cros-pricing-container .cros-pricing-table.st_s-2 .st-sm {
    display: -ms-inline-flexbox;
    display: -webkit-inline-flex;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 2px 7.5px;
    font-size: 12px;
    font-weight: 500;
    text-transform: none;
    background-color: #fedc45;
    color: #000;
    border-radius: 10px;
    margin: 5px 0
}

.cros-pricing-container .cros-pricing-table.pt_st_4 {
    padding: 0
}

.cros-pricing-container .cros-pricing-table.pt_st_4 .no-gutters {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0
}

@media (max-width: 767px) {
    .cros-pricing-container .cros-pricing-table.pt_st_4 .no-gutters {
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-] {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    padding: 20px;
    -ms-flex-align: center;
    align-items: center
}

.cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-]:first-child {
    border-bottom: 1px solid #d5dce5
}

@media (min-width: 768px) {
    .cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-]:first-child {
        border-right: 1px solid #d5dce5;
        border-bottom: 0 none
    }
}

.cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-]:first-child h1, .cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-]:first-child h2, .cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-]:first-child h3, .cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-]:first-child h4, .cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-]:first-child .h1, .cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-]:first-child .h2, .cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-]:first-child .h3, .cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-]:first-child .h4 {
    margin-top: 0
}

.cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-]:last-child .btn {
    margin: 0
}

@media (max-width: 778px) {
    .cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-] {
        display: block;
        width: 100%
    }
}

.cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-] .content {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%
}

.cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-] .content .featured_desc {
    border-top: 1px dashed #d5dce5;
    padding: 10px 0 0;
    margin-top: 15px
}

.cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-] .plan-features {
    padding: 0;
    margin: 0
}

.cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-] .plan-features li {
    display: inline-table;
    width: 48%
}

@media (min-width: 1200px) {
    .cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-] .plan-features li {
        width: 32%
    }
}

@media (max-width: 991px) {
    .cros-pricing-container .cros-pricing-table.pt_st_4 [class*=col-] .plan-features li {
        width: 100%
    }
}

.cros-pricing-container .cros-pricing-table.pt_st_4.active {
    margin: 45px 0 30px;
}

.cros-pricing-container .cros-pricing-table.pt_st_4.active [class*=col-] h1, .cros-pricing-container .cros-pricing-table.pt_st_4.active [class*=col-] h2, .cros-pricing-container .cros-pricing-table.pt_st_4.active [class*=col-] h3, .cros-pricing-container .cros-pricing-table.pt_st_4.active [class*=col-] h4, .cros-pricing-container .cros-pricing-table.pt_st_4.active [class*=col-] .h1, .cros-pricing-container .cros-pricing-table.pt_st_4.active [class*=col-] .h2, .cros-pricing-container .cros-pricing-table.pt_st_4.active [class*=col-] .h3, .cros-pricing-container .cros-pricing-table.pt_st_4.active [class*=col-] .h4 {
    margin-top: 10px;
    margin-bottom: 15px
}

.cros-pricing-container .cros-pricing-table.pt_st_4.active:first-child {
    margin-top: 0
}

.cros-pricing-container.mbo .pricing-slider .slide-item {
    padding: 0 10px 0
}

.cros-pricing-container.mbo table.trns {
    border-collapse: separate;
    border-spacing: 0;
    border: 0 none;
    width: 100%;
}

.cros-pricing-container.mbo table.trns th, .cros-pricing-container.mbo table.trns tr, .cros-pricing-container.mbo table.trns td {
    border: 0 none
}

.cros-pricing-container.mbo .cros-pricing-table {
    position: static;
    margin: 0 0 30px;
    background-image: url(https://bce.bdstatic.com/p3m/common-service/uploads/jijianshitiyangx_12be1f6.png);
    background-repeat: no-repeat;
    background-size: 440px 148px;
    background-position: right bottom;
    background-color: #ffffff;
}

.cros-pricing-container.mbo .cros-pricing-table .sticker-wrapper {
    top: -47px
}

.cros-pricing-container.mbo .cros-pricing-table.st_s-1 .sticker-wrapper {
    top: -58px;
    right: -30px;
    left: -30px
}

@media (min-width: 992px) {
    .cros-pricing-container.mbo .cros-pricing-table:hover, .cros-pricing-container.mbo .cros-pricing-table:focus {
        -ms-transform: none;
        -webkit-transform: none;
        transform: none
    }
}

.cros-pricing-container.mbo .cros-pricing-table.pt_st_4 .st-sm {
    margin: -10px 0 10px
}

.cros-pricing-container.mbo .cros-pricing-table.pt_st_4 .sticker-wrapper {
    top: -20px;
    left: auto;
    right: 20px
}

.cros-pricing-container.mbo .cros-pricing-table.pt_st_4.st_s-1 .sticker-wrapper {
    top: -15px;
    left: 20px;
    right: 20px
}

.cros-pricing-container .card.upgrade-plans .card-body ul li {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: .25rem 0;
    border-top: 1px dotted #d5dce5;
    font-size: 80%
}

.cros-pricing-container .card.upgrade-plans .card-body ul li:last-child {
    border-bottom: 1px dotted #d5dce5
}

.cros-pricing-container .card.upgrade-plans .card-body ul li .feature-label {
    text-align: left;
    margin-right: 5px;
    max-width: 75%
}

.cros-pricing-container .card.upgrade-plans .card-body ul li .feature-value {
    text-align: right;
    margin-left: 5px
}

.product-content {
    display: inline-block;
    position: relative;
    width: 100%;
    height: 100%;
    margin-right: 16px;
    min-height: 457px;
    background: #ffffff;
}

.product-content .product-content__header {
    position: relative;
    height: 116px;
    background-size: cover;
    background-position: 100%;
    background-repeat: no-repeat;
    background: linear-gradient(265deg,#08b883 -1.12%,#00cba1);
}

.product-content .product-content__header .product-content__header__img {
    position: absolute;
    right: -4px;
    top: -4px
}

.product-content .product-content__header .product-content__header__title {
    position: absolute;
    top: 24px;
    left: 32px;
    font-size: 18px;
    color: #fff;
    font-weight: 500;
    font-family: 'djf';
}

.product-content .product-content__header .product-content__header__secondTitle {
    position: absolute;
    top: 57px;
    left: 32px;
    width: 240px;
    height: 51px;
    font-size: 12px;
    color: #fff;
    font-weight: 400
}

.product-content .product-content__center {
    position: relative;
    height: 274px;
    text-align: left;
    margin-top: 20px;
    box-shadow: 0 10px 16px 0 rgba(0,0,0,.08);
    background-color: #fff
}

.product-content .product-content__center .product-content__center__parameter {
    height: 40px;
    margin-left: 32px
}

.product-content .product-content__center .product-content__center__parameter .product-content__center__parameter__key {
    display: inline-block;
    text-align: left;
    width: 64px;
    font-size: 14px;
    color: #666;
    font-weight: 400;
    margin-right: 24px;
    vertical-align: top
}

.product-content .product-content__center .product-content__center__parameter .product-content__center__parameter__value {
    display: inline-block;
    text-align: left;
    width: 164px;
    font-size: 14px;
    color: #333;
    font-weight: 400
}

.product-content .product-content__center .product-content__center__hostNumber {
    position: absolute;
    text-align: center;
    left: 32px;
    bottom: 90px;
    width: 80px;
    border: 1px solid #f65240;
    border-radius: 2px;
    font-size: 12px;
    color: #f65240;
    font-weight: 400
}

.product-content .product-content__center .product-content__center__prise {
    position: absolute;
    left: 32px;
    bottom: 35px
}

.product-content .product-content__center .product-content__center__prise .product-content__center__prise__new {
    font-size: 32px;
    color: #f65240;
    font-weight: 400
}

.product-content .product-content__center .product-content__center__prise .product-content__center__prise__new .product-content__center__prise__new__symbol {
    font-size: 14px
}

.product-content .product-content__center .product-content__center__prise .product-content__center__prise__new .product-content__center__prise__new__decimal {
    font-size: 24px;
    color: #f65240;
    letter-spacing: 0;
    line-height: 38px;
    font-weight: 400
}

.product-content .product-content__center .product-content__center__prise .product-content__center__prise__old {
    font-size: 12px;
    color: #ccc;
    letter-spacing: 0;
    font-weight: 400;
    text-decoration: line-through;
    margin-left: 16px
}

.product-content .product-content__footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 56px;
    cursor: pointer;
    font-size: 16px;
    color: #fff;
    letter-spacing: 0;
    text-align: center;
    line-height: 56px;
    font-weight: 500;
    box-shadow: 0 -4px 11px 0 hsla(0,0%,89.8%,.47);
    background-color: var(--primary);
    border-color: var(--primary);
}

.product-content .product-content__footer:hover {
    background-color: var(--primary-hover);
    border-color: var(--primary-hover);
}

.cros-pricing-container.mbo .cros-pricing-table {
    border-left: 10px #25f4ee solid;
    border-right: 10px #fe2c55 solid;
    background-color: #fff;
    transition: all 0.2s;
}

.cros-pricing-container.mbo .cros-pricing-table:hover {
    transform: scale(105%);
    border-left: 10px #fe2c55 solid;
    border-right: 10px #25f4ee solid;
}

a.btn.btn-primary.btn-lg {
    background: #fe2c55;
    border-color: #fe2c55;
}

.home-map .resource-summary {
    display: table;
    border-collapse: separate;
    border-spacing: 16px 0;
    width: 100%
}

.home-map .resource-summary>.item {
    display: table-cell;
    vertical-align: top
}

.home-map .resource-summary {
    margin-bottom: 24px;
    margin-top: 15px
}

.home-map .resource-summary .item {
    width: 25%;
    background: #f5f5f5;
    border-radius: 8px;
    padding: 20px 24px;
    color: #5b5b5b
}

.home-map .resource-summary .item .text {
    font-size: 22px;
    vertical-align: middle
}

.home-map .resource-summary .item div:first-child {
    font-size: 40px;
    font-weight: 600;
    color: #181818;
    margin-bottom: 16px
}

.home-map .resource-distribute {
    height: 209px;
    box-sizing: border-box;
    padding: 31px 24px 0;
    background: hsla(0,0%,96.1%,.4);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-radius: 8px;
    position: relative;
    z-index: 1
}

.home-map .resource-distribute .map-tab-item {
    width: 120px!important;
    text-align: left;
    line-height: 20px;
    font-size: 14px;
    font-weight: 600;
    color: #181818;
    padding-bottom: 12px!important;
    position: relative;
    padding-bottom: 8px
}

.home-map .resource-distribute .map-tab-item:after {
    content: "";
    position: absolute;
    left: 26px;
    bottom: 0;
    width: 0;
    height: 4px;
    transform: translateX(-50%);
    transition: width .3s ease;
    background: linear-gradient(109.9deg,#06f 30.4%,#0453d9 77.46%);
}

.home-map .resource-distribute .map-tab-item.active:after {
    width: 56px
}

.home-map .resource-distribute .resource-box {
    margin-top: 30px;
    overflow: hidden
}

.home-map .resource-distribute .tab-content {
    white-space: nowrap
}

.home-map .resource-distribute .tab-content.scroll {
    width: 9999px;
    transition: transform .1s ease
}

.home-map .resource-distribute .tab-content.scroll>.row {
    width: 9999px;
    white-space: pre-wrap
}

.home-map .resource-distribute .tab-content .pool {
    display: inline-block;
    padding: 8px 12px;
    margin-right: 16px;
    background: #fff;
    border-radius: 4px;
    min-width: 104px;
    font-size: 12px;
    line-height: 17px;
    margin-bottom: 16px
}

.home-map .resource-distribute .tab-content .pool:after {
    content: "";
    clear: both;
    display: block
}

.home-map .resource-distribute .tab-content .pool>span {
    float: right
}

.home-map .resource-distribute .tab-content .pool>span:first-child {
    float: left
}

.home-map .earch-box {
    overflow: hidden;
    text-align: center;
    position: absolute;
    bottom: -1000px;
    background-repeat: no-repeat;
    background-position: center 20%;
    background-size: 100%
}

.home-map .earch-box.has-bg {
    background-image: url(/portal/_nuxt/img/earth.0bd412c.png);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: auto
}

.home-map .bg {
    position: relative;
    height: 390px;
    width: calc(100% - 32px);
    margin: 0 16px
}

.ct-cert {
    background-color: #fff;
    overflow: hidden;
}

.ct-cert .ct-cert-list {
    display: table;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%
}

.ct-cert .ct-cert-list>.ct-cert-item {
    display: table-cell;
    vertical-align: top
}

.ct-cert>.ct-cert-list .ct-cert-item {
    cursor: pointer;
    text-align: center;
    display: inline-block;
    position: relative;
    height: 142px;
    padding-top: 24px
}

.ct-cert>.ct-cert-list .ct-cert-item>div {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    background: #f5f5f7;
    border-radius: 8px;
    padding: 12px 0;
    height: 62px;
    width: 160px;
    line-height: 38px
}

.ct-cert>.ct-cert-list .ct-cert-item>div img {
    vertical-align: middle;
    max-height: 100%;
    max-width: 100%
}

.ct-cert>.ct-cert-list .ct-cert-item>p {
    font-size: 12px;
    line-height: 17px;
    color: #181818;
    position: absolute;
    top: 98px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    white-space: nowrap;
    transition-property: color;
    transition-duration: .3s;
    transition-timing-function: cubic-bezier(.22,.08,.32,.99);
    transition-delay: 0s
}

.ct-cert>.ct-cert-list .ct-cert-item>p:hover {
    color: #c70b0b!important
}

@-webkit-keyframes wipes {
    0% {
        background-position: 100% 100%
    }

    to {
        background-position: 0 0
    }
}

@keyframes wipes {
    0% {
        background-position: 100% 100%
    }

    to {
        background-position: 0 0
    }
}

div#globe canvas {
    width: 100%!important;
    max-width: 100%!important;
}

section.home-map {
    overflow: hidden;
    background: #ffffff;
}

.home-map .resource-distribute>div {
    display: flex;
}

a.btn.btn-customservice-black:before {
    position: absolute;
    left: -50px;
    width: 15px;
    height: 75px;
    background: #fff;
    -webkit-transform: matrix(.69,.69,-.75,.69,0,0);
    -ms-transform: matrix(.69,.69,-.75,.69,0,0);
    transform: matrix(.69,.69,-.75,.69,0,0);
    opacity: .4;
    -webkit-filter: blur(9px);
    filter: blur(9px);
    content: "";
}

a.btn.btn-customservice-black {
    color: #fff;
    background: linear-gradient(91.54deg,#393939,#1f1f1f);
    display: block;
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 40px;
    margin-bottom: 24px;
    overflow: hidden;
    font-size: 14px;
    line-height: 40px;
    border-radius: 4px;
    cursor: pointer;
}

a.btn.btn-customservice-black:hover:before {
    left: 230px;
    transition: left .8s;
}

.current_prcing .big {
    font-family: DINAlternate-Bold;
    font-size: 24px;
    color: #ff502e;
    line-height: 24px;
    font-weight: 700;
    margin-right: 10px;
    margin-top: 5px;
}

.hotnew-left .hotnew-all.blue {
    background: linear-gradient(150.84deg,#e3fffb 11.25%,#f7fdfe 85.08%);
}

a.btn.btn-customservice-blue:before {
    position: absolute;
    left: -50px;
    width: 15px;
    height: 75px;
    background: #fff;
    -webkit-transform: matrix(.69,.69,-.75,.69,0,0);
    -ms-transform: matrix(.69,.69,-.75,.69,0,0);
    transform: matrix(.69,.69,-.75,.69,0,0);
    opacity: .4;
    -webkit-filter: blur(9px);
    filter: blur(9px);
    content: "";
}

a.btn.btn-customservice-blue {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 40px;
    margin-bottom: 24px;
    overflow: hidden;
    font-size: 14px;
    line-height: 40px;
    border-radius: 4px;
    cursor: pointer;
    color: #fff;
}

a.btn.btn-customservice-blue:hover:before {
    left: 230px;
    transition: left .8s;
}

a.btn.btn-customservice-blue:before {
    position: absolute;
    left: -50px;
    width: 15px;
    height: 75px;
    background: #fff;
    -webkit-transform: matrix(.69,.69,-.75,.69,0,0);
    -ms-transform: matrix(.69,.69,-.75,.69,0,0);
    transform: matrix(.69,.69,-.75,.69,0,0);
    opacity: .4;
    -webkit-filter: blur(9px);
    filter: blur(9px);
    content: "";
}

a.btn.btn-customservice-blue {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 40px;
    margin-bottom: 24px;
    overflow: hidden;
    font-size: 14px;
    line-height: 40px;
    border-radius: 4px;
    cursor: pointer;
    color: #fff;
    color: #fff;
    background-color: #0ecb92;
}

a.btn.btn-customservice-blue:hover:before {
    left: 230px;
    transition: left .8s;
}

.home-service .main-title {
    margin-top: 50px;
    font-size: 40px;
    font-family: "djf";
}

@media (max-width: 768px) {
    .home-service .main-title {
        margin-top: 50px;
    }

    .service-tab-row .col-md-3.active .service-nav-link {
        margin-bottom: 10px;
    }

    .home-service .product-item {
        width: 100%;
        height: auto;
    }

    .hotnew-left .hotnew-all {
        margin-bottom: 10px;
    }

    .home-map .resource-summary .item {
        width: 100%;
        display: block;
        margin-bottom: 10px;
    }

    div#globe canvas {
        height: 400px!important;
    }

    div#globe {
        bottom: -200px;
    }

    .home-map .bg {
        height: 300px;
    }

    .home-map .resource-distribute>div {
        flex-wrap: wrap;
    }

    .home-map .resource-distribute .map-tab-item {
        margin-bottom: 20px;
    }

    .home-map .resource-distribute .map-tab-item:last-child {
        margin-bottom: 0px;
    }

    .home-map .resource-distribute {
        height: 269px;
    }

    section.main-partner {
        display: none;
    }
}

.recomm-card {
    display: flex;
    justify-content: space-between;
    text-decoration: none;
    cursor: pointer;
    background-color: transparent;
}

.recomm-img {
    flex: none;
    padding-right: 10px;
}

.recomm-img img {
    width: 72px;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.recomm-text h4 {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    color: #000;
    margin-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.recomm-text p {
    color: #888;
    line-height: 20px;
    font-weight: 400;
    word-wrap: break-word;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    font-size: 12px;
}

.recomm-text {
    flex: auto;
    max-width: calc(100% - 82px);
    text-align: left;
}

@media (max-width: 768px) {
    .right_aside {
        display: none;
    }
}

.icon-product__baremetal:before {
    content: "\E091";
}

.product-wrap-price .big>span {
    display: block;
    width: 100%;
    float: right;
    color: #e0ddd9!important;
    font-size: 16px;
}

.product-wrap-price .big {
    color: #F33E3E;
}

.card.wechat-card {
    background-image: url(../img/wechat/unbind.svg);
    background-size: auto 100%;
    background-position-x: right;
    background-repeat: no-repeat;
}

.card.wechat-card h2 {
    font-size: 16px;
}

.card.wechat-card p {
    max-width: 60%;
}

.card.wechat-card a {
    min-width: 130px;
}

.card.wechat-card.bind {
    background-image: url(../img/wechat/bind.svg);
}

/* Footer */
footer.footer {
    padding-top: 100px;
    padding-bottom: 0px;
    border: 0 none;
    font-size: 14px;
    position: relative;
    background-color: #f9fafc;
}

footer.footer .btn {
    color: #333;
    display: flex;
    align-items: center;
}

footer.footer .btn > div {
    margin-right: .2rem;
}

.footer-top {
    padding-bottom: 60px;
    border-top: 1px solid #dde2e9;
    border-bottom: 1px solid #dde2e9;
    padding-top: 50px;
}

.footer-top h4 {
    margin-bottom: 18px;
    line-height: 20px;
    font-size: 15px;
    color: #020814;
    font-size: 14px;
    font-weight: 500;
}

.footer-top ul li {
    padding: 6px 0;
    line-height: 20px;
    font-size: 14px;
    color: #999;
}

.footer-top ul li a {
    display: block;
    line-height: 20px;
    font-size: 14px;
    color: #333;
}

.footer-top ul li a:hover {
    color: #1664ff;
    text-decoration: none;
}

.footer-bottom {
    padding: 20px 0;
    border-top: 1px solid rgba(255,255,255,.08);
}

footer.footer .footer-bottom .copyright {
    font-size: 14px;
    margin: 0;
    text-align: left;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}

footer.footer .footer-bottom .copyright .nav {
    align-items: center;
}

footer.footer .footer-bottom .copyright .nav .nav-item .nav-link {
    padding: 0;
}

footer.footer .footer-bottom .copyright .nav .nav-item .nav-link2 {
    max-width: 67px;
}

footer.footer .footer-bottom .copyright .nav .nav-item .nav-link img {
    max-width: 100%;
}

footer.footer .footer-bottom .copyright .nav .stick {
    margin: 0 12px;
    width: 1px;
    height: 14px;
    background-color: rgba(255,255,255,.1);
}

footer.footer .navbar-brand {
    filter: brightness(0) invert(1);
    -webkit-filter: brightness(0) invert(1);
}

@media screen and (max-width: 768px) {
    .footer-col.active h4 {
        color: #1664ff;
    }

    .footer-col.active h4:after {
        background-image: url(../img/footer-media.svg);
        background-position: 95% 50%;
        background-size: 225% 112.5%;
        background-repeat: no-repeat;
        transform: rotate(360deg);
    }

    .footer-top ul.list-unstyled {
        display: none;
        padding: 10px 16px;
        border-top: 1px solid rgba(229,232,237,.1);
    }

    .footer-top h4 {
        position: relative;
        margin: 0;
        padding: 12px 40px 12px 16px;
        line-height: 24px;
        font-size: 16px;
    }

    .footer-top h4:after {
        content: "";
        display: block;
        position: absolute;
        right: 16px;
        top: 16px;
        width: 16px;
        height: 16px;
        background-image: url(../img/footer-media.svg);
        background-position: 95% 50%;
        background-size: 225% 112.5%;
        background-repeat: no-repeat;
        transform: rotate(180deg);
    }

    .footer-top .col {
        flex-basis: auto;
        width: 100%;
        border-bottom: 1px solid rgba(229,232,237,.1);
        padding: 0;
    }
}

@media (max-width: 768px) {
    footer.footer .footer-bottom .copyright {
        display: block;
    }

    footer.footer .footer-bottom .copyright .nav {
        position: static;
        margin-top: 20px!important;
    }
}

.footer-col .list-unstyled.active {
    display: block;
}

.footer-icon .desc-item {
    display: flex;
    align-items: center;
}

.footer-icon .desc-item-img {
    width: 38px;
    margin-right: 13px;
}

.footer-icon .desc-item-text .title {
    border-bottom: none;
    text-align: left;
    color: #020814;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .003em;
    line-height: 24px;
    margin-bottom: 8px;
}

.footer-icon .desc-item-text .desc {
    color: #41464f;
    font-size: 14px;
    letter-spacing: .003em;
    line-height: 22px;
    margin-bottom: 0px;
}

.footer-icon {
    padding-top: 30px;
    margin-bottom: 30px;
}

.footer-icon .row {
    border-bottom: 1px solid rgba(255,255,255,.08);
    font-size: 14px;
}

i.icon-product__sharevds:before {
    content: "\E085";
}

i.icon-product__excvds:before {
    content: "\E049";
}

header#header.header-white .header-container,header#header.header-dark .header-container {
    box-shadow: inset 0 -1px 0 0 #e7eaef;
}

img.footer-icp {
    width: 14px;
    height: 14px;
    margin-right: 10px;
    line-height: initial;
}

.omnisearch {
    width: 100%;
    margin-top: 1.5rem;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050;
    opacity: 0;
    background-color: transparent;
    pointer-events: none;
    transform: translateY(0);
    transition: transform 0.3s, opacity 0.15s;
}

@media (prefers-reduced-motion: reduce) {
    .omnisearch {
        transition: none;
    }
}

.omnisearch.show {
    opacity: 1;
    transform: translateY(50%);
}

.omnisearch .container {
    position: relative;
    height: 100%;
}

.omnisearch .omnisearch-form {
    display: block;
    position: relative;
    z-index: 700;
    background: #FFF;
    border-radius: 0.375rem;
    width: 680px;
    margin: auto;
}

.omnisearch .omnisearch-form .input-group-text {
    font-size: 1.25rem;
    background: transparent;
}

.omnisearch .omnisearch-form .form-control {
    display: block;
    height: 68px;
    font-size: 1.25rem;
    color: #454545;
    background-color: transparent;
    background-image: none;
}

.omnisearch .omnisearch-form .form-control:-ms-input-placeholder {
    color: #C0CCDA;
}

.omnisearch .omnisearch-form .form-control::placeholder {
    color: #C0CCDA;
}

.omnisearch .omnisearch-suggestions {
    width: 680px;
    min-height: 150px;
    padding: 1.5rem;
    background: white;
    margin: auto;
    border-radius: 0.375rem;
    position: relative;
    opacity: 0;
    transition: opacity 0.3s;
    transition-delay: 0.21s;
}

@media (prefers-reduced-motion: reduce) {
    .omnisearch .omnisearch-suggestions {
        transition: none;
    }
}

.omnisearch .omnisearch-suggestions:before {
    background: #FFF;
    box-shadow: none;
    content: '';
    display: block;
    height: 16px;
    width: 16px;
    left: 20px;
    position: absolute;
    bottom: 100%;
    transform: rotate(-45deg) translateY(1rem);
    z-index: -5;
    border-radius: .2rem;
}

.omnisearch .omnisearch-suggestions .heading {
    color: #8492A6;
}

.omnisearch .omnisearch-suggestions .list-link span {
    font-weight: 600;
    color: #3C4858;
}

.omnisearch .omnisearch-suggestions .list-link:hover {
    color: #6e00ff;
}

.omnisearch .omnisearch-suggestions .list-link:hover span {
    color: #6e00ff;
}

.omnisearch.show .omnisearch-form, .omnisearch.show .omnisearch-suggestions {
    pointer-events: auto;
}

.omnisearch.show .omnisearch-suggestions {
    opacity: 1;
}

@media (max-width: 991.98px) {
    .omnisearch .omnisearch-form {
        width: 100%;
    }

    .omnisearch .omnisearch-suggestions {
        width: 100%;
    }
}

.mask-body {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: 999998;
}

.mask-body-dark {
    background: rgba(31, 45, 61, 0.3);
}

.mask-body-light {
    background: rgba(255, 255, 255, 0.3);
}

.omnisearch.show {
    z-index: 999999;
}

.omnosearch-search-card-header {
    padding: 0 20px;
    padding-top: 1px;
    height: 64px;
    background: linear-gradient(90.07deg,#4281fe .78%,#1664ff);
}

.omnosearch-search-card-header span {
    display: inline-block;
    cursor: pointer;
    height: 64px;
    width: auto;
    color: #fff;
    opacity: .9;
    padding-right: 30px;
    text-align: center;
    line-height: 64px;
    font-size: 15px;
    float: left;
    letter-spacing: 0;
    position: relative;
}

.omnosearch-search-card {
    position: relative;
    background: #fff;
    box-shadow: 0 8px 13px 0 rgb(0 0 0 / 7%);
    border-radius: 0 0 2px 2px;
    z-index: 1;
    transition: width .2s ease-in-out;
}

.omnisearch .omnisearch-form .input-group-text {
    border: none;
    padding: 20px;
}

.omnisearch .omnisearch-form .form-control {
    border: navajowhite;
}

.input-group-prepend {
    border: none;
}

a.common-search-history-item {
    line-height: 18px;
    height: 24px;
    font-size: 12px;
    color: #181818;
    display: inline-block;
    letter-spacing: 0;
    padding: 3px 12px;
    border: 1px solid #d8d8d8;
    margin-right: 12px;
    margin-bottom: 10px;
    min-width: 64px;
    cursor: pointer;
    text-align: center;
    transition: all .2s;
}

a.common-search-history-item:hover {
    color: #ff6a00;
    border: 1px solid #ff6a00;
}

.omnisearch .omnisearch-suggestions .heading {
    color: #999;
    font-weight: 400;
    margin-bottom: 10px;
}

.omnisearch .omnisearch-suggestions {
    min-height: 100px;
}

a.omnisearch-close {
    height: 64px;
    width: auto;
    color: #fff;
    opacity: .6;
    line-height: 64px;
    font-size: 15px;
    float: left;
    letter-spacing: 0;
    position: relative;
}

.list-wrapper {
    margin-top: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-shadow: 0 0 10px 0 rgb(0 0 0 / 6%);
    box-shadow: 0 0 10px 0 rgb(0 0 0 / 6%);
    border-radius: 2px;
    background: #ffffff;
    list-style: none;
    padding-left: 0px;
}

.list-wrapper .item {
    position: relative;
    padding: 40px 40px 30px;
}

.list-wrapper .item:last-child {
    background-position: 100% 100%;
    background-repeat: no-repeat;
    background-size: 196px 131px;
}

.list-wrapper .name {
    display: block;
    font-size: 18px;
    line-height: 28px;
    color: #031129;
    margin-bottom: 10px;
}

.list-wrapper .desc {
    font-size: 14px;
    color: #333;
    line-height: 22px;
}

ul.content-wrapper {
    list-style: none;
    padding-left: 0px;
}

.list-wrapper .number {
    font-size: 18px;
    line-height: 25px;
    color: #0052d9;
    font-weight: 400;
    display: inline-block;
    vertical-align: middle;
    position: relative;
}

.list-wrapper .content-wrapper .content {
    margin-bottom: 10px;
}

.list-wrapper .item:first-child:before {
    position: absolute;
    top: 0;
    right: 0;
    content: "";
    display: block;
    width: 1px;
    height: 100%;
    background-color: #eee;
}



ul.list-wrapper .item {
    width: 50%;
    background-position: 100% 100%;
    background-repeat: no-repeat;
    background-size: 196px 131px;
}


ul.qylist-wrapper .item {
    width: 50%;
    background-position: 96% 49%;
    background-repeat: no-repeat;
    background-size: 138px 119px;
}

.qylist-wrapper .item:first-child:before {
    position: absolute;
    top: 0;
    right: 0;
    content: "";
    display: block;
    width: 1px;
    height: 100%;
    background-color: #eee;
}


.qylist-wrapper {
    margin-top: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-shadow: 0 0 10px 0 rgb(0 0 0 / 6%);
    box-shadow: 0 0 10px 0 rgb(0 0 0 / 6%);
    border-radius: 2px;
    background: #ffffff;
    list-style: none;
    padding-left: 0px;
}

.qylist-wrapper .item {
    position: relative;
    padding: 40px 40px 30px;
}

.qylist-wrapper .item:last-child {
    background-position: 100% 100%;
    background-repeat: no-repeat;
    background-size: 196px 131px;
}

.qylist-wrapper .name {
    display: block;
    font-size: 18px;
    line-height: 28px;
    color: #031129;
    margin-bottom: 10px;
}

.qylist-wrapper .desc {
    font-size: 14px;
    color: #333;
    line-height: 22px;
}

ul.content-wrapper {
    list-style: none;
    padding-left: 0px;
}

.qylist-wrapper .number {
    font-size: 18px;
    line-height: 25px;
    color: #0052d9;
    font-weight: 400;
    display: inline-block;
    vertical-align: middle;
    position: relative;
}

.qylist-wrapper .content-wrapper .content {
    margin-bottom: 10px;
}



.kf-list {
    display: flex;
    width: 100%;
}

.kf-list span {
    width: 30%;
}

ul.list-wrapper.beian .item {
    background-size: 196px 111px;
}

.kf-list span:first-child {
    color: rgba(0,0,0,.9);
    font-size: 15px;
    font-weight: 500;
}

.kf-list span:nth-child(2) {
    font-family: PingFangSC-Semibold;
    font-weight: 600;
}

.kf-list span:nth-child(2) svg {
    color: #333;
}

.list-wrapper.beian .desc {
    font-size: 18px;
    line-height: 25px;
    color: #0052d9;
    font-weight: 400;
    display: inline-block;
    vertical-align: middle;
    position: relative;
}

.list-wrapper.beian .desc i {
    margin-left: 10px;
}

@media (max-width: 768px) {
    .header-container-wrap a img {
        height: 22px;
    }

    .header-container .nav-item {
        padding: 0 5px;
    }

    li#Secondary_Navbar-Account-themeMode {
        display: none;
    }
}

.home-event {
    position: relative;
    z-index: 1;
    margin: -60px 0;
}

.home-event .event-items {
    border-radius: 10px;
    backdrop-filter: blur(20px);
    border: 1.5px solid #fff;
    background-color: rgba(255,255,255,.6);
    box-shadow: 0 4px 33px rgb(190 196 207 / 28%);
}

.home-event .event-item {
    display: flex;
    align-items: center;
    flex: 1;
    color: #4a5072;
    height: 110px;
    display: flex;
    align-items: center;
    position: relative;
    padding: 0 1.3rem;
}

.home-event .event-item-icon {
    height: 70px;
    width: 70px;
    margin-right: 20px;
    background-size: 70px;
    background-position: center;
    background-repeat: no-repeat;
}

.home-event .event-item-info h3 {
    font-size: 16px;
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    color: #282c33;
    margin-bottom: 5px;
}

.home-event .event-item-info p {
    color: #999;
    margin-bottom: 0;
}

.home-event .event-item-icon.icon1 {
    background-image: url("../img/home/sub1.png");
}

.home-event .event-item-icon.icon2 {
    background-image: url("../img/home/sub2.png");
}

.home-event .event-item-icon.icon3 {
    background-image: url("../img/home/sub3.png");
}

.home-event .event-item-icon.icon4 {
    background-image: url("../img/home/sub4.png");
}

@media screen and (max-width: 770px) {
    section.home-event {
        margin-top: -20px;
    }

    .home-event .event-item {
        margin-bottom: 20px;
        background-position-x: 130%!important;
    }
}

@media screen and (min-width: 996px) {
    .bor-header-container-top {
        padding-left: 50px;
    }
}

li#Secondary_Navbar-Account-Account_Security {
    display: none;
}

.footer-split {
    width: 100%;
    height: 9px;
    margin-top: -1px;
    background: linear-gradient(90.07deg,#4281fe .78%,#1664ff);
}

.footer-advisory {box-sizing: border-box;padding: 40px 0;background-color: #f7f9fa;background-image: url(//p0.qhimg.com/t016262015149166432.png);background-repeat: no-repeat;background-size: auto 278px;background-position: top;display: flex;flex-direction: column;align-items: center;}

.footer-advisory .title {
    width: fit-content;
    font-size: 36px;
    font-weight: 500;
    color: #020814;
    line-height: 50px;
    margin: auto;
    font-family: 'djf';
}

.footer-advisory .description {
    width: fit-content;
    font-size: 16px;
    font-weight: 400;
    color: rgba(24, 24, 24, 0.64);
    line-height: 16px;
    margin: 22px auto 0;
}

.footer-advisory .btn {
    display: block;
    margin: 40px auto;
    font-weight: 600;
    letter-spacing: .002em;
    width: 240px;
    line-height: 40px;
    background-color: #0ecb92;
    box-shadow: 0 4px 18px 0 rgba(62,226,138,0.12), 0px 2px 12px 0 rgba(62,226,138,0.4);
    color: #fff;
    font-size: 16px;
    border-radius: 4px;
    text-align: center;
    cursor: pointer;
    margin-bottom: 52px;
}

.home-news .news-item .item-active-1 {
    background-image: url(../img/news/img-1.81aebf8e.png);
    transition: .4s
}

.home-news .news-item .item-active-2 {
    background-image: url(../img/news/img-2.30e41ed4.png);
    transition: .4s
}

.home-news .news-item .item-active-3 {
    background-image: url(../img/news/img-3.578df191.png);
    transition: .4s
}

.home-news .news-item .item-active-4 {
    background-image: url(../img/news/img-4.2e6386fe.png);
    transition: .4s
}

.home-news .news-item:hover {
    background-size: cover;
    z-index: 11
}

.home-news .news-item:hover .item-active-1 {
    background-image: url(../img/news/img-1-active.53e88a18.png)
}

.home-news .news-item:hover .item-active-2 {
    background-image: url(../img/news/img-2-active.9653cffb.png)
}

.home-news .news-item:hover .item-active-3 {
    background-image: url(../img/news/img-3-active.588da18c.png)
}

.home-news .news-item:hover .item-active-4 {
    background-image: url(../img/news/img-4-active.e95f6a99.png)
}

.home-news .news-item .item-bg {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 170px;
    width: 140px;
    background-size: cover;
}

.hero-card-item {
    display: flex;
    margin-bottom: 15px;
    border-radius: 10px;
    height: 124px;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background: hsla(0,0%,100%,.1);
    border: 1px solid hsla(0,0%,100%,.1);
    box-shadow: 0 4px 40px rgb(0 110 255 / 10%);
    color: #fff;
    padding: 24px 15px;
    cursor: pointer;
    overflow: hidden;
}

.hero-card-item .item-title {
    font-size: 19px;
    font-weight: 900;
    color: #000;
    line-height: 28px;
    margin-bottom: 6px;
    margin-top: 8px;
    font-family: 'djf';
}

.hero-card-item .item-text {
    font-size: 15px;
    color: #000;
    opacity: .5;
    font-weight: 500;
}

.hero-card-item:hover::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: linear-gradient(hsla(0,0%,100%,.15),hsla(0,0%,100%,.06));
    z-index: -1;
}

.hero-card-item .item-text {
    opacity: 1;
}

.hero-card-item video {
    margin-right: 10px;
}

.home-notices {
    height: 60px;
    background-color: transparent;
    position: absolute;
    bottom: 0px;
    width: 100%;
    z-index: 99;
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    background: hsla(0,0%,100%,.2);
    border: 1px solid hsla(0,0%,100%,.2);
    box-shadow: inset 0 4px 4px hsl(0deg 0% 100% / 1%),inset 0 0 68px hsl(0deg 0% 100% / 1%);
}

.home-notices .splide--ttb > .splide__pagination {
    display: none;
}

.home-notices .splide__arrows {
    position: absolute;
    top: 5px;
    right: 15px;
    z-index: 100;
    display: inline-block;
}

.home-notices .splide__arrow {
    display: block;
    height: 16px;
    width: 16px;
    font-size: 1.5rem;
    outline: none;
    background-color: transparent;
    position: relative;
}

.home-notices .splide__arrow svg {
    max-height: 16px;
    max-width: 16px;
}

.home-notices .splide--ttb > .splide__arrows .splide__arrow--prev {
    top: 0;
    margin-bottom: 15px;
    color: #fff;
}

.home-notices .splide--ttb > .splide__arrows .splide__arrow--next {
    bottom: 10px;
    color: #fff;
}

.home-notices .splide__slide {
    display: flex;
    align-items: center;
}

.home-notices .splide__slide .badge-cell {
    margin-right: 15px;
    padding: 3px 11px;
    border-radius: 13px;
    background: #009ef7;
    font-size: 0.875rem;
    color: #fff;
    font-weight: 600;
}

.home-notices .splide__slide .text {
    padding-left: 10px;
}

.home-notices .splide__slide .text a {
    color: #0a0a0a;
    font-size: 14px;
}

.hero-card-item img {
    height: 64px;
    margin-right: 10px;
    width: 64px;
}

@media (max-width: 768px) {
    .new_plan .plan_advert .pc_img {
        display:none;
    }

    .new_plan .plan_advert .mobile_img {
        display: block;
    }

    .new_plan .plan_advert .center1200 {
        justify-content: space-between;
    }

    .hero-card-item {
        height: unset;
        padding: 12px;
        border-radius: 3px;
    }

    .hero-card-item video {
        width: 28px;
        height: 28px;
    }

    .hero-card-item .item-text {
        display: none;
    }

    .hero-card-item .item-title {
        margin: 0;
        font-size: 14px;
    }

    .hero-card-item img {
        width: 28px;
        height: 28px;
    }

    .wrap-main-swiper .swiper-slide {
        height: 650px;
        background-size: auto 650px;
    }

    .wrap-main-swiper .content-slide {
        height: 450px;
        max-height: 450px;
        padding-top: 30px;
    }

    .swiper-pagination-bullets {
        top: -50px;
    }

    .wrap-main-swiper .content-slide .slogan {
        font-size: 2rem;
    }
}


.dropdown-menu {
	border: 0 none;
	border-radius: 8px;
	box-shadow: 0 10px 20px rgb(64 64 64 / 15%);
}
.index-section-header-title {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    --swiper-navigation-size: 44px;
    --swiper-theme-color: #007aff;
    font-size: 12.5px;
    font-family: PingFang SC,Source Sans Pro,Helvetica Neue,Arial,Microsoft YaHei,WenQuanYi Micro Hei,sans-serif;
    user-select: none;
    border: 0 solid #e5e7eb;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgba(59,130,246,.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia: ;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    position: relative;
    text-align: center;
    line-height: 60px;
}

span.index-module-textbg {
    text-align: center;
    line-height: 60px;
    border: 0 solid #e5e7eb;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    display: block;
    font-weight: 500;
    --tw-text-opacity: 1;
    color: rgb(4 203 148/var(--tw-text-opacity));
    opacity: .06;
    font-size: 80px;
}

.index-section-header-title h2 {
    user-select: none;
    text-align: center;
    border: 0 solid #e5e7eb;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    width: 100%;
    font-weight: 500;
    --tw-text-opacity: 1;
    color: rgb(44 44 69/var(--tw-text-opacity));
    font-size: 30px;
    line-height: 60px;
    font-family: 'djf';
}

.index-section-header {
    text-align: center;
    margin-bottom: 70px;
}

.index-section-header p {
    margin-bottom: 0px!important;
}

.index-section-header-title {
    margin-bottom: 10px;
}



.CatalogBlock_tab__E_OiC {
    cursor: pointer;
    height: 160px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 0 8px rgba(45,60,100,.03), 0 4px 32px rgba(45,60,100,.05);
    transition: background .3s ease-in-out;
}
.CatalogBlock_tabs__32aFe {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-gap: 16px;
    gap: 16px;
}
.CatalogBlock_tabContent__iohZQ {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    box-sizing: border-box;
    height: 100%;
    padding: 20px;
}
.CatalogBlock_tabTitle__ROiJq {
    margin: 0;
    font-family: SBSansInterface;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: #373e45;
    transition: color .3s ease-in-out;
}
.CatalogBlock_tabIcon__sJJHg {
    width: 48px;
    height: 48px;
    margin-top: auto;
}
.CatalogBlock_icon__uu1KW {
    position: absolute;
    z-index: 0;
    right: 16px;
    bottom: 16px;
    transition: color .3s ease-in-out;
}
.CatalogBlock_products__xhDSm.CatalogBlock_active__UNG0L {
    width: 100%;
    height: auto;
    padding: 48px;
    visibility: visible;
}

.CatalogBlock_products__xhDSm {
    position: absolute;
    left: 0;
    display: grid;
    grid-column: 1/5;
    grid-template-columns: repeat(4,1fr);
    grid-gap: 16px;
    gap: 16px;
    box-sizing: border-box;
    width: 100%;
    height: 0;
    margin-top: 16px;
    padding: 0;
    visibility: hidden;
    background: #212830;
    border-radius: 12px;
    transition: height .3s ease-in-out;
        z-index: 9;
}

.CatalogBlock_tab__E_OiC.CatalogBlock_active__UNG0L, .CatalogBlock_tab__E_OiC:hover {
    background: #212830;
}
.CatalogBlock_tab__E_OiC.CatalogBlock_active__UNG0L .CatalogBlock_icon__uu1KW, .CatalogBlock_tab__E_OiC.CatalogBlock_active__UNG0L .CatalogBlock_tabTitle__ROiJq, .CatalogBlock_tab__E_OiC:hover .CatalogBlock_icon__uu1KW, .CatalogBlock_tab__E_OiC:hover .CatalogBlock_tabTitle__ROiJq {
    color: #fff;
}

.CatalogBlock_productsTitle__kRs56 {
    grid-column: 1/5;
    margin-bottom: 32px;
    font-size: 32px;
    line-height: 36px;
    color: #fff;
    letter-spacing: -.01em;
}
.CatalogBlock_card__ROIvh {
    display: block;
    box-sizing: border-box;
    padding: 20px;
    background: #373e45;
    border-radius: 8px;
    outline: 1px solid transparent;
    transition: outline-color .3s ease-in-out;
}

.CatalogBlock_cardTitle__Q5XCI {
    font-family: SBSansInterface;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    color: #fff;
    margin-bottom: 0px;
}
.CatalogBlock_cardText__Fc7tT {
    overflow: hidden;
    display: -webkit-box;
    font-family: SBSansInterface;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #a6a9ac;
    letter-spacing: .01em;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.CatalogBlock_cardIcon__qPKjQ {
    -ms-flex: none;
    flex: none;
}

@media (max-width: 768px) {
.CatalogBlock_tabs__32aFe {
    display: block;
}

.CatalogBlock_products__xhDSm {
    display: block;
}

.CatalogBlock_card__ROIvh {
    margin-bottom: 20px;
}

.CatalogBlock_tabContent__iohZQ {
}

.CatalogBlock_tab__E_OiC {
    margin-bottom: 20px!important;
}
span.index-module-textbg {
    font-size: 35px;
}

.index-section-header-title h2 {
    font-size: 22px;
}

}


.page-body.page-home {
    width: 100%;
    left: 0;
}

body.clientareahome {
    background: #f9fafc;
}

.verification-banner.email-verification {
    display: none;
}

img.avatar-menu {
    width: 50px;
    border-radius: 50%;
}

.header-container .nav-item a i {
    font-size: 18px;
    margin-right: 10px;
    color: #5E6673;
}

.dropdown-toggle::after {
    border: solid #949499;
    border-width: 0 1px 1px 0;
    display: inline-block;
    padding: 2px;
    vertical-align: middle;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    margin-left: 5px;
}


.newsContainer-vMFw {
    -moz-box-pack: center;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center
}

@media screen and (max-width: 1023px) {
    .newsContainer-vMFw {
        background:#fff;
        border-radius: 8px;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        margin: 0 12px
    }

    .newsItem-y_ek {
        -moz-box-pack: justify;
        display: -webkit-flex;
        display: -moz-box;
        display: flex;
        -webkit-flex-shrink: 0;
        flex-shrink: 0;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        padding-left: 12px
    }
}

@media screen and (max-width: 767px) {
    .newsItem-y_ek {
        width:100%
    }

    .newsItem-y_ek:nth-child(-n+3) .newsTitleWrap-sM5T {
        border-bottom: 1px solid #eaedf1
    }
}

@media screen and (min-width: 768px)and (max-width:1023px) {
    .newsItem-y_ek {
        width:50%
    }

    .newsItem-y_ek:nth-child(-n+2) .newsTitleWrap-sM5T {
        border-bottom: 1px solid #eaedf1
    }
}

@media screen and (min-width: 1024px) {
    .newsItem-y_ek {
        -moz-box-flex:1;
        -webkit-flex: 1 1;
        flex: 1 1;
        margin-left: 32px
    }

    .newsItem-y_ek:hover .newsTitle-ZYMW {
        color: #1664ff
    }

    .newsItem-y_ek:hover .newsPicPc-czWx {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -o-transform: scale(1.1);
        transform: scale(1.1)
    }

    .newsItem-y_ek:first-child {
        margin-left: 0
    }
}

.newsTitleWrap-sM5T {
    -moz-box-flex: 1;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -moz-box-pack: center;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -webkit-flex: 1 1;
    flex: 1 1;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center
}

@media screen and (max-width: 1023px) {
    .newsTitleWrap-sM5T {
        padding:12px 0
    }
}

.newsTitleWrap-sM5T .newsTitle-ZYMW {
    -webkit-line-clamp: 2;
    /*! autoprefixer: off */
    -webkit-box-orient: vertical;
    color: #020814;
    display: -webkit-box;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis
}

@media screen and (max-width: 1023px) {
    .newsTitleWrap-sM5T .newsTitle-ZYMW {
        font-size:14px;
        line-height: 22px
    }
}

@media screen and (min-width: 1024px) {
    .newsTitleWrap-sM5T .newsTitle-ZYMW {
        font-size:18px;
        letter-spacing: .003em;
        line-height: 26px
    }
}

.newsTitleWrap-sM5T .newsTagMob-p25n {
    color: #41464f;
    font-size: 12px;
    letter-spacing: .003em;
    line-height: 20px;
    margin-top: 8px
}

@media screen and (min-width: 1024px) {
    .newsTitleWrap-sM5T .newsTagMob-p25n {
        display:none
    }
}

.newsPicPcWrap-DQNZ {
    border-radius: 8px;
    margin-bottom: 24px;
    overflow: hidden;
    position: relative
}

@media screen and (min-width: 1024px)and (max-width:1439px) {
    .newsPicPcWrap-DQNZ {
        height:155px
    }
}

@media screen and (min-width: 1440px)and (max-width:1679px) {
    .newsPicPcWrap-DQNZ {
        height:167px
    }
}

@media screen and (min-width: 1680px) {
    .newsPicPcWrap-DQNZ {
        height:189px
    }
}

@media screen and (max-width: 1023px) {
    .newsPicPcWrap-DQNZ {
        display:none
    }
}

.newsPicPcWrap-DQNZ .newsPicPc-czWx {
    display: block;
    height: 100%;
    -webkit-transition: all .25s ease;
    -o-transition: all .25s ease;
    -moz-transition: all .25s ease;
    transition: all .25s ease;
    width: 100%
}

.newsPicPcWrap-DQNZ .newsTagPc-egc0 {
    background-image: url(https://portal.volccdn.com/obj/volcfe/Home4.0/news/news_tag.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: 0;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    left: 0;
    line-height: 20px;
    padding: 2px 17px 2px 12px;
    position: absolute
}

@media screen and (max-width: 1023px) {
    .newsPicPcWrap-DQNZ .newsTagPc-egc0 {
        display:none
    }
}

.newsPicMob-Yb8o {
    aspect-ratio: 4/3;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 4px;
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    margin: 12px;
    width: 27%
}

@media screen and (min-width: 1024px) {
    .newsPicMob-Yb8o {
        display:none
    }
}

section.home-bigdata {
    background-image: url(../img/number_banner_bg-cd7f2fde4ac2ef41d8918ee9d4834911.png);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
}

section.main-solutions {
    background: #f9fafc;
}



.home-bigdata-contentlistitem {
    display: flex;
}

.home-bigdata-contentlistitem p {
    margin-bottom: 0px;
}

.home-bigdata-contentlistitem img {
    width: 54px;
    height: 49px;
    margin-right: 20px;
}

.home-bigdata-contentlistitem div div {
    display: flex;
    color: #181818;
    display: inline-block;
    font-size: 48px;
    position: relative;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
}

span.index-module--unit--cdOR6 {
    font-size: 20px;
    color: #181818;
    padding-left: 8px;
}
.index-module--numberBox--iyObb {
    -ms-flex-align: start;
    align-items: flex-start;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
}



@media (max-width: 768px) {
.home-bigdata-contentlistitem div div {
    font-size: 18px;
}

span.index-module--unit--cdOR6 {
    font-size: 14px;
}

.home-bigdata-contentlistitem img {
    margin-right: 10px;
}

.home-bigdata-contentlistitem {
    margin-bottom: 10px;
    margin-top: 10px;
}
}


.active-link{text-decoration:none;-webkit-transition:color .3s;-o-transition:color .3s;-moz-transition:color .3s;transition:color .3s}
.active-link:hover{color:#1664ff!important}
.menu-hover{padding-left:.1rem;margin-left:-.1rem;border-radius:3px;-webkit-transition:-webkit-box-shadow .3s ease-in-out;transition:-webkit-box-shadow .3s ease-in-out;-o-transition:box-shadow .3s ease-in-out;-moz-transition:box-shadow .3s ease-in-out;transition:box-shadow .3s ease-in-out;transition:box-shadow .3s ease-in-out,-webkit-box-shadow .3s ease-in-out;-webkit-box-shadow:0 0 0 rgba(191,191,191,.08);box-shadow:0 0 0 rgba(191,191,191,.08)}
.menu-hover:hover{-webkit-box-shadow:0 0 10px rgba(191,191,191,.08);box-shadow:0 0 10px rgba(191,191,191,.08)}
.header-container-wrap{position: fixed;top:0;left:0;width:100%;z-index: 99999;background: #fff;-webkit-box-shadow: 0 2px 6px rgba(0,0,0,.08);box-shadow: 0 2px 6px rgba(0,0,0,.08);-webkit-box-sizing: border-box;}
.header-container{position:relative;-webkit-transition:background .3s;-o-transition:background .3s;-moz-transition:background .3s;transition:background .3s;position: relative;height: 70px;backdrop-filter: blur(20px);}
.header-container:hover{background:#fff}
.header-container.white{background:#fff}
.bor-header-container-top{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content: center;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;white-space:nowrap;-webkit-flex-flow:nowrap;-ms-flex-flow:nowrap;flex-flow:nowrap;/* max-width:1200px; */margin:0 auto;height: 100%;padding-left: 20px;}
.header-container-left{position:relative;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-webkit-justify-content:flex-start;-moz-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-flow:nowrap;-ms-flex-flow:nowrap;flex-flow:nowrap;-webkit-box-flex:1;-webkit-flex:1;-moz-box-flex:1;-ms-flex:1;flex:1}
.header-container-left .et-logo{display:inline-block;margin-right:6%}
.header-container-left .et-logo .bor-logo-img{margin-top:16px;vertical-align:baseline}

.header-container-left .et-diff-intro{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-flow:nowrap;-ms-flex-flow:nowrap;flex-flow:nowrap;-webkit-box-pack:start;-webkit-justify-content:flex-start;-moz-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-webkit-flex:1;-moz-box-flex:1;-ms-flex:1;flex:1;margin-left: 30px;}
.header-container .nav-item{position:relative;display:inline-block;font-size:15px;color: #333;padding: 0 15px;}
.header-container .nav-item>span{color: #333;-webkit-transition:color .3s;-o-transition:color .3s;-moz-transition:color .3s;transition:color .3s;}
.header-container .nav-item:hover>a>span,.header-container .nav-item:hover>span{color:#1664ff}
.header-container .nav-item:hover .menu-arrow{-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}
.header-container .nav-item .hot-new{color:#181818}
.header-container .nav-item .hot-new::after{content:"Hot";margin-left:2px;color:#ff69b4}
.menu-arrow{display:inline-block;width:14px;height:8px;margin-left:.03rem;color:#e2e2e7;-webkit-transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0);-webkit-transition:-webkit-transform .4s;transition:-webkit-transform .4s;-o-transition:-o-transform .4s;-moz-transition:transform .4s,-moz-transform .4s;transition:transform .4s;transition:transform .4s,-webkit-transform .4s,-moz-transform .4s,-o-transform .4s;transition:transform .4s,-webkit-transform .4s,-moz-transform .4s,-o-transform .4s;transition:transform .4s,-webkit-transform .4s,-moz-transform .4s,-o-transform .4s;vertical-align:middle;margin-top:-2px}
.nav-item .nav-topbar-dropdown-wrap{position:fixed;top: 70px;left:0;right:0;height:0;opacity:0;z-index:999;min-width:1020px;overflow-y:hidden;-webkit-transition:height .2s cubic-bezier(.215,.61,.355,1),opacity .2s cubic-bezier(.215,.61,.355,1);-o-transition:height .2s cubic-bezier(.215,.61,.355,1),opacity .2s cubic-bezier(.215,.61,.355,1);-moz-transition:height .2s cubic-bezier(.215,.61,.355,1),opacity .2s cubic-bezier(.215,.61,.355,1);transition:height .2s cubic-bezier(.215,.61,.355,1),opacity .2s cubic-bezier(.215,.61,.355,1);background-color:#fff;border-top: 1px solid rgba(34, 34, 34, 0.16);}
.header-container .nav-item a{color:#181818;display: flex;align-items: center;}
.header-container .nav-item:hover .second-nav-topbar-dropdown{opacity:1;height:540px;max-height:540px}
.header-container .nav-item:hover .third-nav-topbar-dropdown{opacity:1;height:428px;max-height:428px}
.header-container .nav-item:hover .sixth-nav-topbar-dropdown{opacity:1;height:460px;max-height:460px}
.header-container .nav-item:hover .eigth-nav-topbar-dropdown{opacity:1;height:310px;max-height:310px}
.nav-item .nav-topbar-dropdown{color:#1b2226;/* max-width:1200px; */height:100%;z-index:1;margin:0 auto;padding-top:0;background-color: #ffffff;}
.header-container-right{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;height: 100%;}
.header-container-right .bor-link{padding: 23px 28px;-webkit-transition:background-color .2s;-o-transition:background-color .2s;-moz-transition:background-color .2s;transition:background-color .2s;height: 100%;font-size: 15px;}
.header-container-right .bor-link.et-trial{border-left: 1px solid #e6e9f0!important;color: #333;}
.header-container-right .bor-link.et-trial:hover{background-color: #1664ff1f;color: #1664ff;}
.header-container-right .bor-link.et-demonstract{color:#fff;background-color: var(--primary);}
.header-container-right .bor-link.et-demonstract:hover{background-color: var(--primary-hover);}
.nav-item .nav-topbar-dropdown>h2{padding:15px 0;text-align:left;font-size:17px;font-weight:500}
.nav-item .product-title{color:#152235;font-size:16px}
.nav-item .bor-block-product-container{float:right;display:inline-block;width: 78%;height:auto;color:#0a0a0a;vertical-align:top;margin-top:.6rem;}
.nav-item .bor-block-product-container .product-detail{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:start;-webkit-align-items:flex-start;-moz-box-align:start;-ms-flex-align:start;align-items:flex-start}
.nav-item .bor-block-product-container .product-detail .bor-product-menu-second-wrap{-webkit-box-flex:1;-webkit-flex:1;-moz-box-flex:1;-ms-flex:1;flex:1;padding-right:.2rem;max-width: 25%;padding-left: 10px;padding-right: 10px;}
.nav-item .product-detail .bor-product-menu-second-wrap .product-menu-item-title{display:inline-block;width:55%;line-height:normal;font-size:15px;color:#818b99;font-weight:400;vertical-align:middle;margin-bottom:0}
.nav-item .product-detail .bor-product-menu-second-wrap>hr{width:90%;color:#87a0be;opacity:.36;margin:10px 0}
.nav-item .product-detail .bor-product-menu-second-wrap .product-menu-item{display:block;color:#87a0be;line-height:60px;cursor:default;margin:10px 0}
.nav-item .product-detail .bor-product-menu-second-wrap .product-menu-item .menu-item-wrap{padding-left:.1rem;margin-left:-.1rem;border-radius:3px}
.nav-item .product-detail .bor-product-menu-second-wrap .product-menu-item:nth-of-type(1){margin-top:0}
.nav-item .product-detail .bor-product-menu-second-wrap .menu-item-wrap:hover .menu-primary .menu-title{color:#047ad4}
.nav-item .product-detail .bor-product-menu-second-wrap .menu-item-wrap:hover .menu-primary .menu-info{color:#152235}
.nav-item .product-detail .bor-product-menu-second-wrap .menu-item-wrap:hover .menu-img{background-color:#d0e2f4}
.nav-item .product-detail .bor-product-menu-second-wrap .product-menu-item .menu-img{display:-webkit-inline-box;display:-webkit-inline-flex;display:-moz-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-webkit-justify-content:center;-moz-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;width:50px;height:50px;background-color:#ebf3ff;border-radius:2px;vertical-align:middle;-webkit-transition:background-color .3s;-o-transition:background-color .3s;-moz-transition:background-color .3s;transition:background-color .3s}
.nav-item .product-detail .bor-product-menu-second-wrap .product-menu-item .menu-img .img{width:54%}
.nav-item .product-detail .bor-product-menu-second-wrap .product-menu-item .menu-primary{display:inline-block;vertical-align:middle;margin-left:.05rem}
.nav-item .product-detail .bor-product-menu-second-wrap .product-menu-item .menu-primary>span{display:block;line-height:normal}
.nav-item .product-detail .bor-product-menu-second-wrap .product-menu-item .menu-title{font-size:16px;color:#152235}
.nav-item .product-detail .bor-product-menu-second-wrap .product-menu-item .menu-info{font-size:13px;color:#727c8e;margin-top:.05rem;overflow: hidden;white-space:nowrap;text-overflow:ellipsis;width:100%;}
.nav-item .bor-block-product-container .product-version>img{width:7px;vertical-align:middle;margin-left:14px}
.nav-item .bor-block-product-container .product-version>span{color:#87a0be;vertical-align:middle}
.nav-item .bor-block-product-container .product-version>.iconmenu-arrow{font-size:12px;color:#dde1e4;margin-left:.2rem}
.nav-item .bor-block-product-type{float:left;width: 15%;height:100%;border-right:2px solid #f5f5f5;font-size:14px;text-align:left;margin-top:25px;}
.nav-item .bor-block-product-type .product-type-item{width:100%;color:#152235;line-height:normal}
.nav-item .bor-block-product-type .product-type-item a{display:block;font-size:16px;color:#152235;margin-bottom:24px}
.nav-item .bor-block-product-type .product-function{white-space:normal}
.nav-item .bor-block-product-type .product-function a{display:inline-block;width:45%}
.solution-nav-topbar .product-title{margin-top:.4rem}
.container-top{margin-top:24px}
.nav-topbar-dropdown .all-menu-container .second-menu-inner-wrap.scene-menu{width:26%}
.second-menu-inner-wrap{display:inline-block;width:14%;margin-right:.6rem;vertical-align:top}
.second-menu-inner-wrap>hr{color:#87a0be;opacity:.36;margin:10px 0}
.second-menu-inner-wrap .second-menu-title{line-height:normal;font-size:15px;color:#818b99}
.second-menu-inner-wrap .menu-title{display:inline-block;color:#152235;font-size:15px}
.second-menu-inner-wrap .third-menu-item-wrap{line-height:45px}
.second-menu-inner-wrap .third-menu-item-wrap .between-item{display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
.second-menu-inner-wrap .third-menu-item-wrap .between-item .econ::after{content:"";padding:2px 4px;background-color:#fffae5;color:#f93;font-size:12px;margin-left:.03rem}
.menu-icon{display:none;position:relative;height:48px;width:48px;vertical-align:middle;overflow:hidden;margin-top:-2px;text-indent:100%;white-space:nowrap;color:transparent}
.menu-icon .nav-trigger{position:absolute;left:50%;top:50%;bottom:auto;right:auto;background-color:#404040;height:2px;width:24px;-webkit-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);-o-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);-webkit-transition:background-color .2s;-o-transition:background-color .2s;-moz-transition:background-color .2s;transition:background-color .2s}
.menu-icon .nav-trigger:after,.menu-icon .nav-trigger:before{position:absolute;background-color:#404040;height:2px;width:24px;content:"";left:0;transition:-webkit-transform .2s;-webkit-transition:-webkit-transform .2s;-o-transition:transform .2s;-o-transition:-o-transform .2s;-moz-transition:transform .2s,-moz-transform .2s;transition:transform .2s;transition:transform .2s,-webkit-transform .2s,-moz-transform .2s,-o-transform .2s;transition:transform .2s,-webkit-transform .2s,-moz-transform .2s,-o-transform .2s;transition:transform .2s,-webkit-transform .2s,-moz-transform .2s,-o-transform .2s;transition:transform .2s,-webkit-transform .2s}
.menu-icon .nav-trigger:before{-webkit-transform:translateY(-8px);-ms-transform:translateY(-8px);-moz-transform:translateY(-8px);-o-transform:translateY(-8px);transform:translateY(-8px)}
.menu-icon .nav-trigger:after{-webkit-transform:translateY(8px);-ms-transform:translateY(8px);-moz-transform:translateY(8px);-o-transform:translateY(8px);transform:translateY(8px)}
.menu-icon.active .nav-trigger{background-color:transparent}
.menu-icon.active .nav-trigger:before{-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}
.menu-icon.active .nav-trigger:after{-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}
.header-container-wrap .nav-side-menu{display:none;position:fixed;top: 70px;bottom:0;left:0;width:100%;z-index:399;overflow:hidden;background-color:rgba(55,61,65,.4)}
.header-container-wrap .dropdown-wrap{position:absolute;top:0;width:100%;height:100%;left:100%;z-index:399;opacity:1}
.nav-side-menu.show{-webkit-animation:showSide .5s;-moz-animation:showSide .5s;-o-animation:showSide .5s;animation:showSide .5s;opacity:1}
.nav-side-menu.hide{-webkit-animation:hideSide .5s;-moz-animation:hideSide .5s;-o-animation:hideSide .5s;animation:hideSide .5s;opacity:0}
.nav-side-menu.show .dropdown-wrap{-webkit-animation:showMove .5s;-moz-animation:showMove .5s;-o-animation:showMove .5s;animation:showMove .5s;left:0}
.nav-side-menu.hide .dropdown-wrap{-webkit-animation:hideMove .5s;-moz-animation:hideMove .5s;-o-animation:hideMove .5s;animation:hideMove .5s;left:100%}
.header-container-wrap .dropdown-wrap .bor-dropdown-content{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;position:relative;height:100%;overflow:auto;background-color:#fff}
.header-container-wrap .dropdown-wrap .bor-dropdown-content .nav-p-menu{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-flow:column;-moz-box-orient:vertical;-moz-box-direction:normal;-ms-flex-flow:column;flex-flow:column;-webkit-box-align:self-start;-webkit-align-items:self-start;-moz-box-align:self-start;-ms-flex-align:self-start;align-items:self-start;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;width:140px;background-color:#f2f4f7;padding-left:10px;padding-right: 10px;padding-bottom:40px;}
.dropdown-wrap .bor-dropdown-content .nav-p-menu .nav-p-t{width:100%}
.header-container-wrap .dropdown-wrap .bor-dropdown-content .nav-p-menu .nav-p-t-item{width:100%;padding:14px 0;color:#181818;border-bottom:1px solid #e0e0e0}
.dropdown-wrap .bor-dropdown-content .nav-p-menu .nav-p-t-item.active{color: var(--primary);}
.dropdown-wrap .bor-dropdown-content .nav-p-menu .nav-p-t ul{list-style:none;padding:0}
.dropdown-wrap .bor-dropdown-content .nav-p-menu .nav-p-f{width:100%}
.dropdown-wrap .bor-dropdown-content .nav-p-menu .nav-p-f .nav-p-b-item{display:block;padding:8px 0;color:#787979;position:relative}
.dropdown-wrap .bor-dropdown-content .nav-p-menu .nav-p-f .nav-p-b-item:after{content:"";position:absolute;right: 15px;top:15px;width:12px;height:5px;background-image:url(../img/page/icon-link.svg);}
.header-container-wrap .dropdown-wrap .bor-dropdown-content .nav-p-container{-webkit-box-flex:1;-webkit-flex:1;-moz-box-flex:1;-ms-flex:1;flex:1;padding:10px 0 10px 15px;overflow:auto}
.header-container-wrap .dropdown-wrap .bor-dropdown-content .nav-p-container .nav-p-t-main{display:none;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-flow:column;-moz-box-orient:vertical;-moz-box-direction:normal;-ms-flex-flow:column;flex-flow:column;-webkit-box-align:start;-webkit-align-items:flex-start;-moz-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-pack:start;-webkit-justify-content:flex-start;-moz-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;color:#272727}
.header-container-wrap .dropdown-wrap .bor-dropdown-content .nav-p-container .nav-p-t-main.active{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}
.header-container-wrap .dropdown-wrap .bor-dropdown-content .nav-p-container .nav-p-t-main .main-first-title{display:block;width:100%;font-size:16px;border-bottom:1px solid #ececec;line-height:42px}
.header-container-wrap .dropdown-wrap .bor-dropdown-content .nav-p-container .nav-p-t-main .main-second-item,.header-container-wrap .dropdown-wrap .bor-dropdown-content .nav-p-container .nav-p-t-main>a{width:100%;padding-right:20px}
.header-container-wrap .dropdown-wrap .bor-dropdown-content .nav-p-container .nav-p-t-main .main-second-item>a{display:block;width:100%;font-size:16px;color:#272727;margin-top:11px}
.header-container-wrap .dropdown-wrap .bor-dropdown-content .nav-p-container .nav-p-t-main .main-second-item>a>span{display:block;font-size:14px;color:#6f7786;margin-top:18px}
.header-container-wrap .dropdown-wrap .bor-dropdown-content .nav-p-container .nav-p-t-main .main-second-item>a>span::after{content:"";width:6px;height:12px;background:url(../../images/lanyun/icon/icon-arrow-right.svg) no-repeat right/cover;float:right}
.banner .banner-container{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-moz-box-pack:center;-ms-flex-pack:center;justify-content:center;height:350px}
.banner .banner-container .banner-text-wrap{color:#fff;max-width:1140px}
.banner .banner-container .banner-text-wrap .banner-text{text-align:center;color:#fff}
.banner .banner-container .banner-text-wrap .banner-text .pOne{font-size:59px;margin-bottom:30px}
.banner .banner-container .banner-text-wrap .banner-text .pTwo{font-size:18px;margin-top:29px;line-height:33px}
.version{padding:68px;text-align:center}
.version .version-title{text-align:center;font-size:32px;color:#17214c;font-weight:400;margin-bottom:65px}
.version .ver-wrap{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;max-width:1180px;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin:0 auto 55px;text-align:left}
.version .ver-wrap .version-container{position:relative;width:556px;max-width:556px;margin:0 6px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:42px 38px 80px;flex-shrink:1;background-color:#fff;-webkit-box-shadow:3px 3px 5px rgba(165,165,165,.35);box-shadow:3px 3px 5px rgba(165,165,165,.35)}
.version .ver-wrap .version-container>h3{color:#307fe2;font-size:40px;font-weight:400;text-align:center;margin-bottom:58px}
.version .ver-wrap .version-container>h4{color:#212121;font-size:18px;font-weight:400;text-align:left;margin-bottom:29px}
.version .ver-wrap .version-container>p{color:#5a5a66;font-size:14px;margin-bottom:5px}
.version .ver-wrap .version-container .major-function{background-color:#f5fbff;padding:21px 18px;height:230px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin-top:30px;text-align:left}
.version .ver-wrap .version-container .major-function h5{font-size:14px;color:#191919;margin-bottom:23px}
.version .ver-wrap .version-container .major-function li{font-size:14px;color:#5a5a66;margin:14px 0}
.version .ver-wrap .version-container .major-function li::before{content:"";display:inline-block;width:15px;height:15px;margin-right:8px;background:url(../../images/lanyun/icon/icon-tick-bg.svg) no-repeat center/cover;vertical-align:middle}
.version .ver-wrap .version-container .contact-btn{width:100%;margin-top:47px;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;padding:0 35px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
.version .ver-wrap .version-container .contact-btn a{width:45%;display:inline-block;font-size:18px;padding:10px 0;text-align:center}
.version .ver-wrap .version-container .contact-btn .try{background-color:#307fe2;color:#fff;-webkit-transition:background-color .3s,color .3s;-o-transition:background-color .3s,color .3s;-moz-transition:background-color .3s,color .3s;transition:background-color .3s,color .3s}
.version .ver-wrap .version-container .contact-btn .ask{border:1px solid #307fe2;color:#307fe2;-webkit-transition:background-color .3s;-o-transition:background-color .3s;-moz-transition:background-color .3s;transition:background-color .3s}
.version .ver-wrap .version-container .contact-btn .try:hover{background-color:#4baaea}
.version .ver-wrap .version-container .contact-btn .ask:hover{border:1px solid #4baaea;background-color:#e6f4fd}
.version .version-free{position:absolute;top:-2px;left:5%;display:block;width:50px}
.fire-icon{display:inline-block;width:9px;height:11px;margin-left:4px}
.arrow-right{display:inline-block;width:6px;line-height:10px}
@-webkit-keyframes showSide{0%{opacity:0;display:block}
100%{opacity:1}
}
@-moz-keyframes showSide{0%{opacity:0;display:block}
100%{opacity:1}
}
@-o-keyframes showSide{0%{opacity:0;display:block}
100%{opacity:1}
}
@keyframes showSide{0%{opacity:0;display:block}
100%{opacity:1}
}
@-webkit-keyframes hideSide{0%{opacity:1}
100%{opacity:0;display:none}
}
@-moz-keyframes hideSide{0%{opacity:1}
100%{opacity:0;display:none}
}
@-o-keyframes hideSide{0%{opacity:1}
100%{opacity:0;display:none}
}
@keyframes hideSide{0%{opacity:1}
100%{opacity:0;display:none}
}
@-webkit-keyframes showMove{0%{left:100%}
100%{left:0}
}
@-moz-keyframes showMove{0%{left:100%}
100%{left:0}
}
@-o-keyframes showMove{0%{left:100%}
100%{left:0}
}
@keyframes showMove{0%{left:100%}
100%{left:0}
}
@-webkit-keyframes hideMove{0%{left:0}
100%{left:100%}
}
@-moz-keyframes hideMove{0%{left:0}
100%{left:100%}
}
@-o-keyframes hideMove{0%{left:0}
100%{left:100%}
}
@keyframes hideMove{0%{left:0}
100%{left:100%}
}
.home-customer{text-align:center}
.home-customer .customer-logo{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-webkit-justify-content:flex-start;-moz-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-top:56px;margin-bottom:60px}
.home-customer .customer-logo>a{display:inline-block;-webkit-box-flex:0;-webkit-flex:0 1 25%;-moz-box-flex:0;-ms-flex:0 1 25%;flex:0 1 25%}
.home-customer .customer-logo .logo{display:-webkit-inline-flex;display:-moz-inline-box;display:-ms-inline-flexbox;display:-webkit-inline-box;display:inline-flex;width:96%;margin:8px 0;border:1px solid #ededed;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-moz-box-pack:center;-ms-flex-pack:center;justify-content:center}
.home-customer .customer-logo .logo img{display:inline-block;width:100%}
.area-section{padding-top:64px;padding-bottom:64px;text-align:center;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.area-section .title{font-size:32px;color:#1b1c1c;font-weight:400;margin-bottom:12px}
.area-section .title2{font-size:16px;font-weight:400;color:#777;max-width:850px;margin:0 auto 40px}
.area-section .carousel-item{width:1144px}
.button{display:inline-block;border-radius:3px;text-align:center;-webkit-transition:background-position .3s ease-in-out;-o-transition:background-position .3s ease-in-out;-moz-transition:background-position .3s ease-in-out;transition:background-position .3s ease-in-out}
.button__left{margin-left:30px}
.button__right{margin-right:30px}
.button__normal{width:166px;height:46px;font-size:18px;line-height:46px}
.button__large{width:190px;height:49px;font-size:18px;line-height:49px}
.button.button-theme__blue{color:#fff;background-image:-webkit-linear-gradient(340deg,#1c96ff,#06f,#a72dda);background-image:-moz-linear-gradient(340deg,#1c96ff,#06f,#a72dda);background-image:-o-linear-gradient(340deg,#1c96ff,#06f,#a72dda);background-image:linear-gradient(110deg,#1c96ff,#06f,#a72dda);-o-background-size:200%;background-size:200%}
.button-theme__blue:hover{background-position:100% 20%}
.button.button-theme__white{background-image:-webkit-linear-gradient(330deg,#ffe5e5,#d8ffec,#bbefe0,#ffb87a);background-image:-moz-linear-gradient(330deg,#ffe5e5,#d8ffec,#bbefe0,#ffb87a);background-image:-o-linear-gradient(330deg,#ffe5e5,#d8ffec,#bbefe0,#ffb87a);background-image:linear-gradient(120deg,#ffe5e5,#d8ffec,#bbefe0,#ffb87a);color:#047ad4;-o-background-size:300%;background-size:300%;-webkit-transition:background-position .3s ease-in-out,color .3s ease-in-out;-o-transition:background-position .3s ease-in-out,color .3s ease-in-out;-moz-transition:background-position .3s ease-in-out,color .3s ease-in-out;transition:background-position .3s ease-in-out,color .3s ease-in-out}
.button-theme__white:hover{color:#fff;background-position:100% 19%}
.button.button-theme__orange{position:relative;border:1px solid #047ad4;background-image:-webkit-linear-gradient(135deg,#f9bb30 0,#ff890d 74%);background-image:-moz-linear-gradient(135deg,#f9bb30 0,#ff890d 74%);background-image:-o-linear-gradient(135deg,#f9bb30 0,#ff890d 74%);background-image:linear-gradient(315deg,#f9bb30 0,#ff890d 74%)}
.button.button-theme__orange:hover{background-image:-webkit-linear-gradient(135deg,#ffc74a 0,#ff9b33 74%);background-image:-moz-linear-gradient(135deg,#ffc74a 0,#ff9b33 74%);background-image:-o-linear-gradient(135deg,#ffc74a 0,#ff9b33 74%);background-image:linear-gradient(315deg,#ffc74a 0,#ff9b33 74%)}
.button.button-theme__white2{border:1px solid #047ad4;background-color:#fff;color:#047ad4;-webkit-transition:color .3s,background-color .3s;-o-transition:color .3s,background-color .3s;-moz-transition:color .3s,background-color .3s;transition:color .3s,background-color .3s}
.button-theme__white2:hover{color:#fff;background-color:#c5e8ff4a}
.button-theme__white.color__black:hover,.button-theme__white2.color__black:hover{color:#fff}
.button.button-theme__transparent{border:1px solid #fff;background-color:transparent;-webkit-transition:background-color .3s;-o-transition:background-color .3s;-moz-transition:background-color .3s;transition:background-color .3s}
.button.button-theme__transparent:hover{background-color:#56ade84a}
.button.color__black{color:#232d5d}
.waves{position:relative;cursor:pointer;display:inline-block;overflow:hidden;text-align:center;-webkit-tap-highlight-color:transparent;z-index:1}
.waves .waves-animation{position:absolute;border-radius:50%;width:25px;height:25px;opacity:0;background:rgba(255,255,255,.3);-webkit-transition:all .7s ease-out;-o-transition:all .7s ease-out;-moz-transition:all .7s ease-out;transition:all .7s ease-out;transition-property:transform,opacity,-webkit-transform;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);pointer-events:none}
@media screen and (min-width:770px){body{min-width:1020px}
::-webkit-scrollbar{width:7px;height:7px;background-color:#f5f5f5}
::-webkit-scrollbar-track{border-radius:10px;background-color:#f5f5f5}
::-webkit-scrollbar-thumb{border-radius:10px;box-shadow:inset 0 0 6px rgba(0,0,0,.1);-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.1);background-color:#c8c8c8}
}
@media screen and (max-width:1100px){.menu-arrow{display:none}
}
@media screen and (min-width:770px) and (max-width:1200px){.bor-header-container-top{min-width:1020px}
.header-container .nav-item:hover .second-nav-topbar-dropdown{height:510px;max-height:510px}
.nav-item .product-detail .bor-product-menu-second-wrap>hr{margin:6px 0}
.nav-topbar-dropdown .all-menu-container .second-menu-inner-wrap.scene-menu{min-width:245px}
.header-container .nav-item:hover .eigth-nav-topbar-dropdown{height:280px;max-height:280px}
}
@media screen and (max-width:770px){.header-container{background-color:#fff}
.header-container .bor-link{display:none}
.header-container-left .et-diff-intro{display:none}
.header-container-right .menu-icon, .header-container-right .user-icon{display:inline-block}
.pc-footer{display:none}
#footer{display:block}
.version{padding:50px 12px}
.version .version-title{font-size:28px}
.version .ver-wrap{text-align:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-flow:column;-moz-box-orient:vertical;-moz-box-direction:normal;-ms-flex-flow:column;flex-flow:column;min-width:auto;margin-bottom:0}
.version .ver-wrap .version-container{width:90%;padding:40px 18px;text-align:left;margin:0 auto 30px;-webkit-box-shadow:3px 3px 10px rgb(165 165 165 / 10%);box-shadow:3px 3px 10px rgb(165 165 165 / 10%)}
.version .ver-wrap .version-container>h3{font-size:28px;margin-bottom:20px}
.version .ver-wrap .version-container>h4{font-size:16px;margin-bottom:16px}
.version .ver-wrap .version-container .major-function{margin-top:20px}
.version .ver-wrap .version-container .contact-btn{margin-top:30px;padding-left:0;padding-right:0;-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around}
.version .ver-wrap .version-container .contact-btn a{font-size:16px}
.home-customer .customer-logo>a{-webkit-box-flex:0;-webkit-flex:0 1 33%;-moz-box-flex:0;-ms-flex:0 1 33%;flex:0 1 33%}
.home-customer .customer-logo .logo{width:94%;height:auto}
.home-customer .customer-logo .logo img{width:100%}
.home-customer .customer-logo{margin-bottom:32px;margin-top:40px}
.area-section{padding-top:50px;padding-bottom:50px}
.area-section .title{font-size:28px}
.button__normal{width:120px;height:40px;font-size:17px;line-height:40px}
.button__large{width:146px;height:50px;font-size:18px;line-height:50px}
}
.header-container-wrap a{text-decoration:none!important;}
.solution-menu-main{margin-top:30px}
.main-menu-title{position:relative;padding-left:18px;font-size:18px;font-weight:400;margin-bottom:10px}
.main-menu-title:before{content:" ";position:absolute;left:0;top:50%;margin-top:-10px;display:block;height:20px;width:4px;background:#1664ff}
.solution-item{line-height:unset;border:1px solid #e6e9f0;transition:all .1s;margin-top: 20px;background-color: #fff;border: solid 2px #ffffff;border-radius: 2px;}
.solution-item .nav-item-name{padding-left:20px}
.solution-item:hover{color:#1664ff;cursor:pointer;background-image: -webkit-gradient(linear, left top, left bottom, from(#f0f2f5), to(#ffffff)), -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffff));background-image: -o-linear-gradient(top, #f0f2f5 0%, #ffffff 100%), -o-linear-gradient(#ffffff, #ffffff);background-image: linear-gradient(180deg, #f0f2f5 0%, #ffffff 100%), linear-gradient(#ffffff, #ffffff);background-blend-mode: normal, normal;-webkit-box-shadow: 0px 4px 20px 0px rgb(0 53 128 / 10%);box-shadow: 0px 4px 20px 0px rgb(0 53 128 / 10%);-webkit-transition: 0.25s;-o-transition: 0.25s;transition: 0.25s;}
.solution-menu-box-body{margin-bottom:20px}
.product-menu-item-box{margin-top:10px;line-height:unset;border:1px solid #e6e9f0;transition:all .1s;display:block;padding:12px 20px;max-width: 227px;}
.product-menu-item-box .menu-title{width:100%;display:block;line-height:normal;margin-bottom:5px}
.product-menu-item-box .menu-info{width:100%;display:block;line-height:normal}
.product-menu-item-box:hover{border: 1px solid #1664ff;color: #1664ff;cursor:pointer;}
.product-menu-item-box:hover .menu-info,.product-menu-item-box:hover .menu-title{color: #1664ff!important;}


.nav-item .bor-block-product-type .product-type-item a {
    border-radius: 8px;
    color: #1664ff;
    background-color: #1664ff1c !important;
    padding: 10px;
    margin-right: 10px;
}
.nav-item .bor-block-product-type .product-type-item a img {
    margin-right: 5px;
}


.old-system-login {
    margin-right: 12px;
    color: #333;
}


.header-dropdown-left {
    box-sizing: border-box;
    max-height: 600px;
    min-height: 300px;
    padding: 36px 0px 40px 50px;
    background: #F6F9FE url(https://bce.bdstatic.com/p3m/common-service/uploads/left_backend_new_ba6a747.png) right bottom no-repeat;
    background-size: 236px auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    float: left;
    width: 20%;
    height: 100%;
    font-size: 14px;
    text-align: left;
}

.header-dropdown-left {
  box-sizing: border-box;
  max-height: 600px;
  min-height: 300px;
  padding: 36px 0px 40px 50px;
  
  background-size: 236px auto;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
}
.header-dropdown-left.product {
background: #F6F9FE url(../img/header/headerbg_1.svg) right bottom no-repeat;
}
.header-dropdown-left.products {background: #FDFEFE url(../img/menu/menu_1.png) right bottom no-repeat;background-repeat: no-repeat;background-position: 100% 100%;background-size: auto 372px;}

.header-dropdown-left.solution {background: #FDFEFE url(../img/menu/menu_3.png) right bottom no-repeat;background-repeat: no-repeat;background-position: 100% 100%;background-size: auto 372px;}


.header-dropdown-left.services {background: #FDFEFE url(../img/menu/menu_4.png) right bottom no-repeat;background-repeat: no-repeat;background-position: 100% 100%;background-size: auto 372px;}




.header-dropdown-left.about {
background: #F6F9FE url(../img/header/headerbg_5.svg) right bottom no-repeat;
}
.header-dropdown-left .header-dropdown-nav {
  box-sizing: border-box;
  overflow: auto;
}
.header-dropdown-left .header-dropdown-nav .header-all-product {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
}
.header-dropdown-left .header-dropdown-nav .header-all-product .header-other-title h2 {
  margin-bottom: 16px;
}
.header-dropdown-left .header-dropdown-nav .header-all-product .header-other-title p {
  margin-bottom: 16px;
}
.header-dropdown-left .header-dropdown-nav .header-all-product .header-left-button {
  margin-bottom: 24px;
  vertical-align: middle;
  padding-right: 10px;
  font: 600 14px / 22px PingFangSC-Semibold;
  height: 22px;
  color: #222222;
  position: relative;
}
.header-dropdown-left .header-dropdown-nav .header-all-product .header-left-button::after {
  content: '';
  box-sizing: border-box;
  position: absolute;
  right: -8px;
  top: 4px;
  width: 16px;
  height: 16px;
  background: url(https://bce.bdstatic.com/p3m/common-service/uploads/arrow_aca2afe.svg) no-repeat center / cover;
  transition: right 0.3s cubic-bezier(0.25, 0.1, 0.25, 0.1);
}
.header-dropdown-left .header-dropdown-nav .header-all-product .header-left-button:hover {
  color: #2468f2;
}
.header-dropdown-left .header-dropdown-nav .header-all-product .header-left-button:hover::after {
  right: -16px;
  background-image: url(https://bce.bdstatic.com/p3m/common-service/uploads/arrow-hover_5c62c57.svg);
}
.header-dropdown-left .header-dropdown-nav .header-left-nav li {
  float: left;
  clear: left;
  position: relative;
  font: 400 14px / 22px PingFangSC-Regular;
  color: #222222;
  margin-bottom: 16px;
  cursor: default;
}
.header-dropdown-left .header-dropdown-nav .header-left-nav li::after {
  content: '';
  position: absolute;
  left: 0;
  width: 0;
  top: 27px;
  height: 2px;
  background-color: #2468f2;
  transition: width 0.3s linear;
}
.header-dropdown-left .header-dropdown-nav .header-left-nav li.current {
  color: #2468f2;
}
.header-dropdown-left .header-dropdown-nav .header-left-nav li.current::after {
  width: 100%;
}
.header-dropdown-left .header-dropdown-nav .header-left-jump {
  display: block;
  float: left;
  clear: left;
  position: relative;
  font: 400 14px / 22px PingFangSC-Regular;
  color: #222222;
  cursor: pointer;
}
.header-dropdown-left .header-dropdown-nav .header-left-jump:hover {
  color: #2468f2;
}
.header-dropdown-left .header-left-extends {
  padding-right: 24px;
  box-sizing: border-box;
  white-space: pre-line;
}
.header-dropdown-left .header-left-title {
  font: 400 20px / 28px PingFangSC;
  color: #222222;
}
.header-dropdown-left .header-left-desc {
  font: 400 14px / 22px PingFangSC-Regular;
  padding-right: 24px;
  box-sizing: border-box;
  color: rgba(34, 34, 34, 0.7);
}

.header-dropdown-left {
  padding-left: calc((100% - 1438px) / 2);
  min-width: 288px;
}
.header-dropdown-left .header-dropdown-nav {
  width: 238px;
}
.header-dropdown-left .header-left-extends {
  width: 238px;
}
.header-dropdown-left .header-left-desc {
  width: 238px;
  white-space: initial;
}

.product-type-item{width:100%;color:#152235;line-height:normal}
.product-type-item a{display:block;font-size:16px;color:#152235;margin-bottom:24px}
.product-type-item img {width: 30px;}

.solution-menu-main>.row {
    margin: 0;
}



.product-info-card {
    margin-bottom: 10px;
    line-height: normal;
    border: 1px solid #e6e9f0;
    transition: all .1s;
    padding: 10px 20px;
}

.product-info-card-name {
    color: #333;
    line-height: normal;
}

small.product-info-card-headline {
    color: #333;
    line-height: normal!important;
    height: auto;
    margin-top: 10px;
    display: block;
}





.header-dropdown-left .header-dropdown-nav {
  box-sizing: border-box;
  overflow: auto;
}
.header-dropdown-left .header-dropdown-nav .header-all-product {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
}
.header-dropdown-left .header-dropdown-nav .header-all-product .header-other-title h2 {
  margin-bottom: 16px;
}
.header-dropdown-left .header-dropdown-nav .header-all-product .header-other-title p {
  margin-bottom: 16px;
}
.header-dropdown-left .header-dropdown-nav .header-all-product .header-left-button {
  margin-bottom: 24px;
  vertical-align: middle;
  padding-right: 10px;
  font: 600 14px / 22px PingFangSC-Semibold;
  height: 22px;
  color: #222222;
  position: relative;
}
.header-dropdown-left .header-dropdown-nav .header-all-product .header-left-button::after {
  content: '';
  box-sizing: border-box;
  position: absolute;
  right: -8px;
  top: 4px;
  width: 16px;
  height: 16px;
  background: url(https://bce.bdstatic.com/p3m/common-service/uploads/arrow_aca2afe.svg) no-repeat center / cover;
  transition: right 0.3s cubic-bezier(0.25, 0.1, 0.25, 0.1);
}
.header-dropdown-left .header-dropdown-nav .header-all-product .header-left-button:hover {
  color: #2468f2;
}
.header-dropdown-left .header-dropdown-nav .header-all-product .header-left-button:hover::after {
  right: -16px;
  background-image: url(https://bce.bdstatic.com/p3m/common-service/uploads/arrow-hover_5c62c57.svg);
}
.header-dropdown-left .header-dropdown-nav .header-left-nav li {
  float: left;
  clear: left;
  position: relative;
  font: 400 14px / 22px PingFangSC-Regular;
  color: #222222;
  margin-bottom: 16px;
  cursor: default;
}
.header-dropdown-left .header-dropdown-nav .header-left-nav li::after {
  content: '';
  position: absolute;
  left: 0;
  width: 0;
  top: 27px;
  height: 2px;
  background-color: #2468f2;
  transition: width 0.3s linear;
}
.header-dropdown-left .header-dropdown-nav .header-left-nav li.current {
  color: #2468f2;
}
.header-dropdown-left .header-dropdown-nav .header-left-nav li.current::after {
  width: 100%;
}
.header-dropdown-left .header-dropdown-nav .header-left-jump {
  display: block;
  float: left;
  clear: left;
  position: relative;
  font: 400 14px / 22px PingFangSC-Regular;
  color: #222222;
  cursor: pointer;
}
.header-dropdown-left .header-dropdown-nav .header-left-jump:hover {
  color: #2468f2;
}
.header-dropdown-left .header-left-extends {
  padding-right: 24px;
  box-sizing: border-box;
  white-space: pre-line;
}
.header-dropdown-left .header-left-title {
  font: 400 20px / 28px PingFangSC;
  color: #222222;
}
.header-dropdown-left .header-left-desc {
  font: 400 14px / 22px PingFangSC-Regular;
  padding-right: 24px;
  box-sizing: border-box;
  color: rgba(34, 34, 34, 0.7);
}

.header-dropdown-left {
  padding-left: calc((100% - 1438px) / 2);
  min-width: 288px;
}
.header-dropdown-left .header-dropdown-nav {
  width: 238px;
}
.header-dropdown-left .header-left-extends {
  width: 238px;
}
.header-dropdown-left .header-left-desc {
  width: 238px;
  white-space: initial;
}
.product-info-card:hover {
    border-color: #1664ff;
}
.product-info-card:hover .product-info-card-name{
    color:#1664ff!important;
}



.nav-item .bor-block-product-container .product-detail .bor-product-menu-second-wrap.active {
    display: block;
    width: 100%;
    max-width: 100%;
}

.nav-item .bor-block-product-container .product-detail .bor-product-menu-second-wrap {
    display: none;
}




.bor-product-menu-second-wrap .card {
	border-color: #ebf0fc;
}
.bor-product-menu-second-wrap .card:hover {
	background-color: #f9faff;
	text-decoration: none;
	border-color: #06f;
	color: #06f;
}
.bor-product-menu-second-wrap .card .card-text {
	color: #444;
}
.bor-product-menu-second-wrap .card:hover .card-text {
	color: #444;
}

.product-type-item a img {
    height: 24px;
}

.product-type-item a {
    border-radius: 8px;
    padding: 5px 5px;
    margin-right: 10px;
    transition: all .3s;
}
.product-type-item a.active {
    color: #1664ff;
    background-color: #1664ff1a !important;
}

.product-type-item a img {
    margin-right: 5px;
    width: 24px;
}
.product-detail {
    margin-top: 30px;
}


main {
    margin-top: 70px;
}



.prodNav a {
	margin-top: 20px;
	background-color: #fff;

	padding: 15px 30px 15px 30px;
}

.prodNav a h4 {
	font-size: 16px;
	font-weight: 500;
}

.prodNav a p {
	margin-top: 3px;
	color: #7d87a5;
	line-height: initial;
	margin-bottom: 0px;
}

.prodNav a:hover,.ffsub a:hover {
	background: #f8f8fa;
	border-left: 5px solid #1664ff;
}

.prodNav a:hover p,
.prodNav a:hover h4 {color: #ffffff;}

.user-icon {
    display: none;
    position: relative;
    height: 48px;
    width: 48px;
    vertical-align: middle;
    margin-top: -2px;
    text-indent: 100%;
    white-space: nowrap;
    color: transparent;
    overflow: hidden;
    margin-right: 10px;
}
.user-icon svg {
    position: absolute;
    left: 50%;
    top: 12px;
    bottom: auto;
    right: auto;
}
.header-container-wrap .nav-user-menu.show {
    display:block;
}

.header-container-wrap .nav-user-menu {
    display: none;
    /* position: fixed; */
    top: 70px;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 398;
    overflow: hidden;
    background-color: rgba(55,61,65,.4);
    -webkit-box-shadow: 0 4px 8px rgb(0 0 0 / 10%);
    box-shadow: 0 4px 8px rgb(0 0 0 / 10%);
    cursor: default;
    background: #fff;
}

.user-menu-bottom {
    padding: 20px;
}


ul.header-user-info-list.account-nav {
    list-style: none;
    padding-left: 0px;
}

.user-menu-top {
    padding: 20px;
    padding-bottom: 0px;
}


.header-user-info-split {
    height: 1px;
    line-height: 1;
    background: #dfe1e6;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-top: 5px;
    margin-bottom: 5px;
}


ul.header-user-info-list.account-nav li a span {
    width: auto;
    min-width: 16px;
    background-color: var(--primary);
    float: right;
    padding: 0 4px;
    border-radius: 10px;
    font-size: 12px;
    line-height: 16px;
    color: #fff !important;
    margin-top: 3px;
}

ul.header-user-info-list.account-nav li a {
    height: 22px;
    line-height: 22px;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    color: #252b3a;
    font-size: 14px;
}

.header-user-info-list .header-verification {
    padding-left: 0;
    line-height: 20px;
    text-align: right;
    height: 32px;
    display: block;
}

.header-user-info-list>li {
    position: relative;
    line-height: 20px;
    color: #252b3a;
}

.header-user-info-item-account>a {
    float: left;
    width: 50%;
}

.header-user-info-list>li:not(.header-user-info-split) {
    padding-top: 5px;
    padding-bottom: 5px;
}

a.account-verification.header-verification {
    margin-bottom: 5px;
}

.header-menu-content a {
    display: block;
    width: 100%;
    display: block;
    box-sizing: border-box;
    padding: 20px;
    background: #f8f8fa;
    border: 1px solid transparent;
    border-radius: 8px;
    margin-bottom: 20px;
}

.header-menu-content a span {
    margin: 0;
    font-family: SBSansInterface;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    color: #212830;
}

.header-menu-content-right {
    margin-left: 10px;
}


a.d-flex.flex-column.product-item {
    text-align: left;
    align-items: baseline;
    background: #fff;
    border: 1px solid #f3f3f3;
    box-shadow: 0 3px 8px 0 rgba(46,70,146,.05);


}

a.d-flex.flex-column.product-item:hover {
    border-radius: 4px;
    box-shadow: 0 3px 8px rgba(46,70,146,.05);
    background-color: var(--primary);
}


.CatalogBlock_cardHead__ew_HX {
    display: -ms-flexbox;
    display: flex;
    gap: 12px;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 16px;
}

@media (max-width: 1280px){

.CatalogBlock_cardHead__ew_HX {
    gap: 0.9375vw;
    margin-bottom: 1.25vw;
}

}

.CatalogBlock_card__ROIvh:hover {
    outline-color: #06c37f;
}


@media (max-width: 768px){
.footer-advisory .title {
    font-size: 26px;
}

.footer-icon .desc-item-text .title {
    margin-bottom: 0px;
    font-size: 14px;
}

.footer-icon .desc-item {
    margin-bottom: 5px;
}

    .footer-icon .desc-item-text .desc {
    font-size: 12px;
}
}
.TZ_qLFdV span {
    color: #626f84;
}

.TZ_qLFdV {
    display: flex;
    justify-content: center;
}
.TZ_qLFdV .TZ_2H8wl img {
    margin-right: 8px;
    width: 24px;
}
.TZ_qLFdV .TZ_2H8wl {
    display: flex;
    margin: 0 48px;
    font-size: 16px;
}




.acp-home-earth-item-line {
    background-color: #34a853;
    border-radius: 4px;
    bottom: 0;
    height: 79px;
    left: 0;
    position: absolute;
    width: 4px;
}

.acp-home-earth-item {
    margin-bottom: 40px;
}

.acp-home-earth-item-amount, .acp-home-earth-item-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}



.datacenter-right-content {
    grid-gap: 43px 100px;
    display: grid;
    gap: 43px 100px;
    grid-template-columns: 230px 1fr;
    margin-top: 40px
}

.acp-home-earth-item {
    padding-left: 23px;
    position: relative
}

.acp-home-earth-item-title {
    -webkit-box-align: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    -webkit-align-items: baseline;
    align-items: baseline;
    margin-bottom: 8px
}

.acp-home-earth-item-amount,.acp-home-earth-item-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    display: block;
}

.acp-home-earth-item-amount {
    font-size: 56px;
    font-weight: 700;
    display: flex;
    align-items: baseline;
}

.acp-home-earth-item-unit {
    font-size: 20px;
    margin-left: 16px
}

.acp-home-earth-item-desc {
    font-size: 16px;
}

.acp-home-earth-item-line {
    background-color: #34a853;
    border-radius: 4px;
    bottom: 0;
    height: 99px;
    left: 0;
    position: absolute;
    width: 4px
}
.datacenter-right {
    padding-left: 80px;
}


@media (max-width: 768px) {
video.acp-home-earth-video {max-width: 100%;height: auto;}

.datacenter-right {
    padding-left: 0px;
}

.datacenter-right-content {
    display: block;
    display: grid;
    grid-gap: 1.5rem;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, auto);
}

.acp-home-earth-item-amount {
    font-size: 20px;
}

.acp-home-earth-item-line {
    height: 50px;
}
}

p.slogan b {
    font-family: 'djf';
    letter-spacing: 1px;
}


.datacenter-right .main-title {
    font-family: 'djf';
}



.TZ_54Stq {
    display: flex;
    justify-content: center;
    position: relative;
    padding: 70px 00px;
    overflow: hidden;
}


section.new-solution {
    background: linear-gradient(180deg,#2e3956,#202742);
}


.TZ_54Stq .TZ_i-EwM ul li {
    display: inline-block;
    vertical-align: top;
    width: 400px;
    height: 240px;
    box-sizing: border-box;
    background: #2d3852;
    padding: 32px;
    position: relative
}
.TZ_54Stq .TZ_i-EwM ul {
    list-style: none;
    padding: 0;
    width: 1200px;
    height: 480px;
    border-radius: 16px;
    border: 1px solid hsla(0,0%,100%,0.15);
    margin: 40px auto;
    box-sizing: content-box;
    overflow: hidden;
}


.TZ_54Stq .TZ_i-EwM ul li h2 {
    color: #fff;
    font-size: 20px;
    font-family: 'djf';
    font-style: normal;
    font-weight: 600;
    line-height: 30px
}

.TZ_54Stq .TZ_i-EwM ul li p {
    color: hsla(0,0%,100%,0.64);
    margin-bottom: 8px
}

.TZ_54Stq .TZ_i-EwM ul li p,.TZ_54Stq .TZ_i-EwM ul li span {
    font-size: 16px;
    font-family: PingFang SC;
    font-style: normal;
    font-weight: 400;
    line-height: 24px
}

.TZ_54Stq .TZ_i-EwM ul li span {
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center
}


.TZ_54Stq .TZ_i-EwM ul li .TZ_cnHOP {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%
}

.TZ_54Stq .TZ_i-EwM ul li .TZ_1CxrE {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%
}

.TZ_54Stq .TZ_i-EwM ul li:nth-child(odd) {
    background: #374664
}

.TZ_54Stq .TZ_i-EwM ul li .TZ_1CxrE img {
    height: 100%
}

.TZ_54Stq .TZ_i-EwM ul li:hover span {
    color: #0ecb92
}

.TZ_54Stq .TZ_i-EwM h1 {
    color: #fff;
    text-align: center;
    font-size: 40px;
    font-family: "djf";
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}




@media (max-width: 768px) {
.TZ_54Stq .TZ_i-EwM ul {
    width: 100%;
    overflow: hidden;
    height: auto;
}

.TZ_54Stq .TZ_i-EwM ul li {
    max-width: 100%;
    width: 100%;
}

.TZ_54Stq {
    display: block;
}
}

.TZ_54Stq .TZ_3tbHz {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1029px;
    height: 746px;
    background: url(http://p0.qhimg.com/t01743714f24d890461.png) no-repeat;
    background-size: 1029px 746px
}

.TZ_54Stq .TZ_i-EwM {
    position: relative;
    z-index: 2;
    width: 100%;
}

section.home-service.bg-white.space {
    padding-bottom: 0px!important;
}

.hero-card-item:hover {
    background: linear-gradient(150.84deg,#e3fffb 11.25%,#f7fdfe 85.08%);
    transition: all .5s;
}

.pageError h3 {
    color: #434e59;
    font-size: 72px;
    font-weight: 600;
    line-height: 72px;
    margin-bottom: 24px;
    padding-top: 20px;
}

.pageError p {
    color: rgba(0,0,0,0.45);
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 16px;
}


.invoice-main .card ,.invoice-slide .card,body.clientareadetails .card {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0,0,0,.05);
    overflow: hidden;
    width: 100%;
    border: none;
}



.invoice-main .card-header,.invoice-slide .card-header ,body.clientareadetails .card-header{
    background: transparent;
    border-bottom: 0px;
}


body.viewinvoice .primary-content.main-container,body.clientareadetails .primary-content.main-container{
    background: #F6F8FA;
}

.invoice-main .card .card {background: rgb(255, 255, 255);border: 1px solid rgb(234, 237, 241);border-radius: 2px;box-shadow: none;}

.card .card .card-header {
    background: #F6F8FA;
    border-color: #eaedf1;
}

.invoice-main .table th,.invoice-main .table td {
    border-color: #eaedf1;
}


.invoice-main .btn-group.btn-group-sm.d-print-none a {
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.08);
    box-shadow: 0 1px 1px rgba(0,0,0,.08);
    padding: 5px 20px!important;
}

.invoice-main .btn-group.btn-group-sm.d-print-none a:last-child {
    color: #1664ff;
    border-color: #1664ff;
    background: transparent;
}

.badge-success {
    background: #1664ff;
}
.badge-refunded {
    background: #f98600;
}
.invoice-status.badge-default {
    background: #ff5b5b;
}

.margin-bottom {
    margin-bottom: 20px;
}
.homepage header#header.header-fixed {
    background: #ffffff;
    -webkit-box-shadow: inset 0 -1px 0 0 #E6EBF2;
    box-shadow: inset 0 -1px 0 0 #E6EBF2;
}



.homepage header#header {
	background-color: rgba(255,255,255,.1);
}
.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom, .swiper-pagination-fraction {
	bottom: 90px;
}
.homepage .wrap-main-swiper {
	position: relative;
	padding-top: 0px;
}
.swiper-pagination-bullets {
	top: -110px;
}
.wrap-main-swiper .swiper-slide {
	height: 600px;
	background-size: cover;
}
.wrap-main-swiper .content-slide {
	max-width: 60%;
}
.wrap-main-swiper .content-slide .slogan {
	font-size: 42px;
	font-weight: 500;
	letter-spacing: -1px;
}
.bg-top-Zeth {
	display: block;
	height: 100%;
	-o-object-fit: contain;
	object-fit: contain;
	position: absolute;
	right: 40px;
	z-index: 2;
}
@media (min-width: 768px) {
	.bg-top-Zeth {
		bottom: 40px;
		height: calc(100% - 100px);
	}
}
@media (min-width: 1280px) {
	.bg-top-Zeth {
		right: calc(-600px + 45vw);
	}
}



/* main-intelligent */
.main-intelligent {
	background-color: #2c73f2;
	overflow: hidden;
	position: relative;
	height: 234px;
}
.main-intelligent:after,
.main-intelligent:before {	
	display: block;

	width: 0;
	position: absolute;
	bottom: -1px;
	z-index: 2;
	border-color: transparent transparent #fff;
	border-style: solid;

}
.main-intelligent:before {
	right: 50%;
	transform: scaleX(-1);
	filter: FlipH;
}
.main-intelligent:after {
	left: 50%;
}
.main-intelligent-video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.main-intelligent-video video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 266%;
	object-fit: cover;
}

.main-intelligent-content {
	text-align: center;
	position: relative;
}
.main-intelligent-content h2 {
	font-family: PingFangSC-Semibold;
	font-size: 36px;
	color: #000;
	text-align: center;
	line-height: 36px;
	font-weight: 600;
	margin-bottom: 24px;
}
.main-intelligent-content p {
	font-size: 20px;
	font-family: PingFangSC-Regular;
	text-align: center;
	line-height: 26px;
	font-weight: 400;
	color: #000;
	margin-bottom: 24px;
}




.templetes2024-banner-main-intelligent {
	background-color: #2c73f2;
	overflow: hidden;
	position: relative;
	height: 234px;
}
.templetes2024-banner-main-intelligent:after,
.templetes2024-banner-main-intelligent:before {	
	display: block;
	content: "";
	width: 0;
	position: absolute;
	bottom: -1px;
	z-index: 2;
	border-color: transparent transparent #fff;
	border-style: solid;
	border-width: 0 0 1.6vw 50vw;
}
.templetes2024-banner-main-intelligent:before {
	right: 50%;
	transform: scaleX(-1);
	filter: FlipH;
}
.templetes2024-banner-main-intelligent:after {
	left: 50%;
}
.templetes2024-banner-main-intelligent-video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}








.templetes2024-banner-main-intelligent-video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.templetes2024-banner-main-intelligent-video video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 266%;
	object-fit: cover;
}

.templetes2024-banner-main-intelligent-content h2 {
	font-family: PingFangSC-Semibold;
	font-size: 36px;
	color: #000;
	text-align: center;
	line-height: 36px;
	font-weight: 600;
	margin-bottom: 24px;
}

.templetes2024-banner-main-intelligent-content {
	text-align: center;
	position: relative;
}

.templetes2024-banner-main-intelligent-content h2 {
	font-family: PingFangSC-Semibold;
	font-size: 36px;
	color: #222;
	text-align: center;
	line-height: 36px;
	font-weight: 600;
	margin-bottom: 24px;
}

.templetes2024-banner-main-intelligent-content p {
	font-size: 20px;
	font-family: PingFangSC-Regular;
	text-align: center;
	line-height: 26px;
	font-weight: 400;
	color: #596064;
	margin-bottom: 24px;
}


.templetes2024-banner-main-intelligent-content {
	text-align: center;
	position: relative;
}



.develop-speed {
	background: url("https://cdn-image.templetes2024l.com/2024/resource/tos_2781e7adcbfb6de5c4b8888357699d4a.jpg") no-repeat 50%;
	background-size: cover;
	text-align: center;
}
.speed-content a {
	background: #266DFB;
	color: #FFFFFF;
}
.speed-text {
	font-size: 26px;
	font-weight: 500;
	margin-bottom: 2rem;
	color: #000000;
}



@media (max-width: 800px) {
.product-detail {
		flex-direction: column;
	}
	.product-detail-side {
		width: 100%;
		padding-right: 0;
	}
	.product-detail-main {
		margin-top: 1.5rem;
	}
	.product-detail-lists {
		grid-gap: 1.5rem;
		grid-template-columns: repeat(1, auto);
	}
	.product-detail-wrap {
		flex-direction: column;
	}
	.product-detail-column {
		margin-right: 0;
		margin-top: 16px;
		width: 100%;
	}
	.product-detail-column:first-child {
		margin-top: 0;
	}
	
	.swiper-media-item {
    margin-bottom: 10px;
    height: auto;
}
}


.m-change-part {
	cursor: pointer;
}

.m-change-part .u-change-tip {
	right: 60px;
	top: 9px;
	z-index: 1;
	width: auto;
	padding: 0 5px;
	height: 23px;
	border: 1px solid #0d5ffe;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	line-height: 21px;
	font-size: 12px;
	color: #0d5ffe;
	text-align: center;
	background: #dfeafe;
}

.m-change-part .u-change-tip,.m-change-part .u-change-tip .u-arrow {
	position: absolute;
}

.m-change-part .u-change-tip .u-arrow {
	width: 7px;
	height: 19px;
	background: url(../img/user/switch-arrow-icon.svg) no-repeat;
	background-position: 0;
	z-index: 2;
	top: 1px;
	-webkit-transform: translateX(-.2px);
	-moz-transform: translateX(-.2px);
	-ms-transform: translateX(-.2px);
	transform: translateX(-.2px);
	right: -7px;
}

.m-change-part .u-change-loginType-btn {
	position: absolute;
	top: 0;
	right: 0;
	width: 55px;
	height: 55px;
	background: url(../img/user/account-switch-icon.svg);
	cursor: pointer;
	background-size: cover;
}

.m-change-part.f-account .u-change-loginType-btn {
	background: url(../img/user/phone-switch-icon.svg);
}


.whmcs_content_right .whmcs_box {
    position: relative;
}

.u-change-loginType-btn.wechat {
    background: url(../img/user/qrcode-switch-icon.svg);
}


.login_weChatText__2QyuK {
    display: -moz-box;
    display: flex;
    -moz-box-pack: center;
    justify-content: center;
    font-size: 14px;
    line-height: 20px;
    color: #79879c;
}

.login_weChatText__2QyuK span {
    font-weight: 500;
    color: #242e42;
}

.my-auto.wechat h1 {
    margin-bottom: 10px;
    font-weight: 500;
    font-size: 24px;
    line-height: 34px;
    text-align: center;
    color: #242e42;
    margin-top: 30px;
}


    .index-module__left-panel--jrHKe .index-module__left-panel-title--aSRni {
                color: #181818;
                display: inline-block;
                font-family: PingFang SC;
                font-size: 32px;
                font-style: normal;
                font-weight: 600;
                letter-spacing: .002em;
                line-height: 40px;
                margin: unset;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                width: 100%
            }

            .index-module__left-panel--jrHKe .index-module__left-panel-subtitle--xA6c9 {
                color: #525b6a;
                display: inline-block;
                font-family: PingFang SC;
                font-size: 20px;
                font-style: normal;
                font-weight: 400;
                line-height: 28px;
                margin-top: 8px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                width: 100%
            }

            .index-module__left-panel--jrHKe .index-module__left-panel-advantages--pmkfj {
                margin-top: 40px
            }

            .index-module__left-panel--jrHKe .index-module__left-panel-advantages--pmkfj .index-module__advantage-item--bQnq6:not(:first-child) {
                margin-top: 32px
            }

            .index-module__left-panel--jrHKe .index-module__left-panel-advantages--pmkfj .index-module__advantage-item--bQnq6 .index-module__advantage-item-header--W0Gm4 {
                display: inline-block;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                width: 100%
            }

            .index-module__left-panel--jrHKe .index-module__left-panel-advantages--pmkfj .index-module__advantage-item--bQnq6 .index-module__advantage-item-header--W0Gm4 .index-module__advantage-item-tag--cYEPz {
                border: 1px solid rgba(0,110,255,.7);
                border-radius: 4px;
                box-shadow: 0 0 0 1px #dde2e9;
                color: #006eff;
                display: -moz-box;
                display: flex;
                display: inline-block;
                font-family: PingFang SC;
                font-size: 12px;
                font-style: normal;
                font-weight: 400;
                letter-spacing: .003em;
                line-height: 20px;
                padding: 0 6px;
                vertical-align: middle
            }

            .index-module__left-panel--jrHKe .index-module__left-panel-advantages--pmkfj .index-module__advantage-item--bQnq6 .index-module__advantage-item-header--W0Gm4 .index-module__advantage-item-title--X4Lnb {
                color: #181818;
                font-family: PingFang SC;
                font-size: 20px;
                font-style: normal;
                font-weight: 400;
                line-height: 28px;
                margin-left: 8px;
                vertical-align: middle
            }

            .index-module__left-panel--jrHKe .index-module__left-panel-advantages--pmkfj .index-module__advantage-item--bQnq6 .index-module__advantage-item-des--H4ijK {
                color: #525b6a;
                display: inline-block;
                font-family: PingFang SC;
                font-size: 14px;
                font-style: normal;
                font-weight: 400;
                line-height: 22px;
                margin-top: 4px;
                opacity: .7;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                width: 100%
            }

            .index-module__right-panel--tkLBq {
                -moz-box-flex: 0;
                flex: none;
                padding-top: 60px;
                position: relative;
                width: 60%
            }

            .index-module__right-panel--tkLBq .index-module__success-block-wrapper--2x92Y {
                height: 100%;
                width: 100%
            }

            .index-module__right-panel--tkLBq .index-module__form-block-wrapper--GnwU0 {
                height: 100%;
                padding: 0 calc(50% - 218.5px);
                width: 100%
            }

            @media screen and (max-width: 600.9px) {
                {
                    padding:68px 16px 16px
                }
            }

            @media screen and (min-width: 601px) and (max-width:767.9px) {
                {
                    padding:80px 16px 16px
                }
            }

            @media screen and (max-width: 767.9px) {
                {
                    background-color:#fafafa
                }

                .index-module__left-panel--jrHKe {
                    display: none
                }

                .index-module__right-panel--tkLBq {
                    background-color: #fff;
                    border-radius: 8px;
                    padding: 24px 24px 0;
                    width: 100%
                }

                .index-module__right-panel--tkLBq .index-module__success-block-wrapper--2x92Y {
                    height: auto
                }

                .index-module__right-panel--tkLBq .index-module__form-block-wrapper--GnwU0 {
                    height: auto;
                    padding: 0
                }
            }




@media (max-width: 992px)  {

.dropdown-bd .body-main-bd {
    grid-template-columns: repeat(2, 1fr);
    margin-top: 20px;
}

.dropdown-body-main .tabs-content {
    display: block;
}

header .navbar-nav .nav-item .nav-link {
}

.body-main-bd-item {
    margin-bottom: 0px;
}

.dropdown-body {
    box-shadow: none;
}
.dropdown-bd .body-main.py-4 {
	padding-top: 0px!important;
}
}