@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")
}

@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
}

.-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 {
    height: 43px;
    width: 122px;
    margin: 0;
    padding: 0;
}

/* Header */
header#header {
    z-index: 101;
    position: fixed;
    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%;
    position: fixed;
    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 {
    position: fixed;
    top: 0;
    width: 100%;
    background-color: #1d2129;
}

.header-dark .navbar-brand {
    background-image: url("./images/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: 650px;
}

.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("./images/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(10, 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:99;
    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;
    flex-wrap: wrap;
}

.product-detail-column {
    width: 23%;
    background: #fff no-repeat;
    background-size: 100% 160px;
    border-radius: 8px;
    padding: 25px 0 20px;
    position: relative;
    margin-right: 16px;
    border: 1.5px solid #fff;
    box-shadow: 0 4px 60px 0 rgba(0, 28, 85, .04);
    margin-bottom: 15px;
}
.product-detail-column:hover{
    transform: translateY(-10px);
}

.product-detail-column:nth-child(3n+1),.product-detail-column:nth-child(3n+4),.product-detail-column:nth-child(3n+7),.proudctcont a:nth-child(3n+1) li,.proudctcont a:nth-child(3n+4) li,.proudctcont a:nth-child(3n+7) li {
    background-image: linear-gradient(0deg, rgba(209, 227, 255, 0), #d1e3ff);
}

.product-detail-column:nth-child(3n+1) .column-bg,.product-detail-column:nth-child(3n+4) .column-bg,.product-detail-column:nth-child(3n+7) .column-bg {
    background-image: url(./images/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(3n+2),.product-detail-column:nth-child(3n+5),.product-detail-column:nth-child(3n+8),.proudctcont a:nth-child(3n+2) li,.proudctcont a:nth-child(3n+3) li,.proudctcont a:nth-child(3n+8) li {
    background-image: linear-gradient(0deg, rgba(202, 240, 248, 0), #caeff8);
}

.product-detail-column:nth-child(3n+2) .column-bg,.product-detail-column:nth-child(3n+5) .column-bg,.product-detail-column:nth-child(3n+8) .column-bg {
    background-image: url(./images/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(3n+3),.product-detail-column:nth-child(3n+6),.product-detail-column:nth-child(3n+9), .proudctcont a:nth-child(3n+3) li,.proudctcont a:nth-child(3n+6) li,.proudctcont a:nth-child(3n+9) li{
    background-image: linear-gradient(0deg, hsla(0, 0%, 100%, 0), #e6e1fa);
}

.product-detail-column:nth-child(3n+3) .column-bg,.product-detail-column:nth-child(3n+6) .column-bg,.product-detail-column:nth-child(3n+9) .column-bg {
    background-image: url(./images/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 0px;
    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;
    margin-bottom: 5px;
}

.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("./images/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("./images/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("./images/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("./images/simple_bg.png");
}

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

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

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

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

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

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

.main-services-item-4:hover {
    background-image: url("./images/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;
    background-image: url("./images/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("./images/common_banner_bg_lz.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("./images/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("./images/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("./images/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("./images/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("./images/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.lzl.com/2023/img/group_special.7571b76f.png") no-repeat center;
    background-size: cover;
}

.main-news .icon-system-item2 {
    background: url(https://cdn-image.lzl.com/2023/img/group_app.ec690231.png) no-repeat center;
    background-size: cover;
}

.main-news .icon-system-item3 {
    background: url(https://cdn-image.lzl.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 {
        width: 100%;
    }

    .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(./images/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(./images/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(./images/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(./images/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(./images/index/icon_sale_white.svg) right center no-repeat;
}

.fade:not(.show) {
    display: none;
}

section.subtop.ec {
    background-image: url(./images/product/banner_ec_lz.jpg);
    background-position: center;
}

section.subtop.cdn {
    background-image: url(./images/product/banner_cdn_lz.jpg);
    background-position: center;
}

section.subtop.dedicated {
    background-image: url(./images/product/server-banner.jpg);
    background-position: center;
}

section.subtop.host {
    background-image: url(./images/product/banner_host_lz.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(./images/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(./images/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(./images/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(./images/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(./images/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(./images/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(./images/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(./images/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(./images/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(./images/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(./images/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("./images/home/sub1.png");
}

.home-event .event-item-icon.icon2 {
    background-image: url("./images/home/sub2.png");
}

.home-event .event-item-icon.icon3 {
    background-image: url("./images/home/sub3.png");
}

.home-event .event-item-icon.icon4 {
    background-image: url("./images/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(./images/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(./images/news/img-1.81aebf8e.png);
    transition: .4s
}

.home-news .news-item .item-active-2 {
    background-image: url(./images/news/img-2.30e41ed4.png);
    transition: .4s
}

.home-news .news-item .item-active-3 {
    background-image: url(./images/news/img-3.578df191.png);
    transition: .4s
}

.home-news .news-item .item-active-4 {
    background-image: url(./images/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(./images/news/img-1-active.53e88a18.png)
}

.home-news .news-item:hover .item-active-2 {
    background-image: url(./images/news/img-2-active.9653cffb.png)
}

.home-news .news-item:hover .item-active-3 {
    background-image: url(./images/news/img-3-active.588da18c.png)
}

.home-news .news-item:hover .item-active-4 {
    background-image: url(./images/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(./images/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(./images/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(./images/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(./images/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(./images/header/headerbg_1.svg) right bottom no-repeat;
}

.header-dropdown-left.products {
    background: #FDFEFE url(./images/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(./images/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(./images/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(./images/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(./images/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(./images/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(./images/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(./images/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(./images/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;
}




.lz-banner-main-intelligent {
    background-color: #2c73f2;
    overflow: hidden;
    position: relative;
    height: 234px;
}

.lz-banner-main-intelligent:after,
.lz-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;
}

.lz-banner-main-intelligent:before {
    right: 50%;
    transform: scaleX(-1);
    filter: FlipH;
}

.lz-banner-main-intelligent:after {
    left: 50%;
}

.lz-banner-main-intelligent-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}








.lz-banner-main-intelligent-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.lz-banner-main-intelligent-video video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 266%;
    object-fit: cover;
}

.lz-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;
}

.lz-banner-main-intelligent-content {
    text-align: center;
    position: relative;
}

.lz-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;
}

.lz-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;
}


.lz-banner-main-intelligent-content {
    text-align: center;
    position: relative;
}



.develop-speed {
    background: url("./images/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(./images/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(./images/user/account-switch-icon.svg);
    cursor: pointer;
    background-size: cover;
}

.m-change-part.f-account .u-change-loginType-btn {
    background: url(./images/user/phone-switch-icon.svg);
}


.whmcs_content_right .whmcs_box {
    position: relative;
}

.u-change-loginType-btn.wechat {
    background: url(./images/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;
    }
}