.err-page[data-v-4c07dec2] {
    position: relative;
    height: 400px;
    padding-top: 13%
}

.err-page .error403[data-v-4c07dec2] {
    background: url(http://www.haoio.cn/nuxt-static/img/403.c8c9475.png) no-repeat;
    background-size: cover;
    height: 174px;
    width: 350px;
    margin: 0 auto
}

.err-page .error404[data-v-4c07dec2] {
    background: url(http://www.haoio.cn/nuxt-static/img/404.829fe19.png) 50% no-repeat;
    background-size: cover;
    height: 174px;
    width: 350px;
    margin: 0 auto
}

.err-page .error500[data-v-4c07dec2] {
    background: url(http://www.haoio.cn/nuxt-static/img/500.efcd094.png) no-repeat;
    background-size: cover;
    height: 174px;
    width: 350px;
    margin: 0 auto
}

.err-page .warning[data-v-4c07dec2] {
    font-size: 14px;
    color: rgba(0,0,0,.85);
    line-height: 21px;
    text-align: center
}

.error-header__bg[data-v-4c07dec2] {
    height: 60px;
    background: url(http://www.haoio.cn/nuxt-static/img/document-headbg.4c3c37c.png) no-repeat #4b5058
}

.nuxt-progress {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    width: 0;
    opacity: 1;
    transition: width .1s,opacity .4s;
    background-color: #fff;
    z-index: 999999
}

.nuxt-progress.nuxt-progress-notransition {
    transition: none
}

.nuxt-progress-failed {
    background-color: red
}

@font-face {
    font-family: babasNeue;
    src: url(http://www.haoio.cn/nuxt-static/fonts/BebasNeue-Regular.d4f210f.eot);
    src: url(http://www.haoio.cn/nuxt-static/fonts/BebasNeue-Regular.afeaf67.woff) format("woff"),url(http://www.haoio.cn/nuxt-static/fonts/BebasNeue-Regular.47f711b.ttf) format("truetype")
}

@font-face {
    font-family: din;
    src: url(http://www.haoio.cn/nuxt-static/fonts/DIN-Condensed-Bold.e2db8fc.eot);
    src: url(http://www.haoio.cn/nuxt-static/fonts/DIN-Condensed-Bold.70c203d.woff) format("woff"),url(http://www.haoio.cn/nuxt-static/fonts/DIN-Condensed-Bold.8417dfa.ttf) format("truetype")
}

@font-face {
    font-family: Oswald;
    src: url(http://www.haoio.cn/nuxt-static/fonts/Oswald-Regular.727a758.ttf)
}

body,html {
    background: #eaf2fb;
    padding: 0;
    margin: 0;
    min-height: 100%;
    font-size: 14px;
    line-height: 1.5em;
    font-family: PingFangSC,helvetica neue,hiragino sans gb,arial,microsoft yahei ui,microsoft yahei,simsun,"sans-serif";
    color: #000;
    box-sizing: border-box
}

body {
    min-width: 1200px
}

body.mobile {
    min-width: 0
}

input,input:focus {
    outline: 0
}

img {
    border: 0
}

a {
    color: #7f7f7f
}

a,a:hover {
    text-decoration: none
}

a:hover {
    color: #548aff
}

h1,h2,h3,h4,h5,h6,ol,p,ul {
    margin: 0
}

ol,ul {
    list-style: none;
    padding: 0
}

.product-label {
    color: #ff4f36;
    font-size: 12px;
    margin-left: 4px
}

.svg-icon {
    width: 1em;
    height: 1em;
    vertical-align: -.2em;
    fill: currentColor;
    overflow: hidden
}

.svg-icon.disabled {
    color: #666
}

.portal-affix {
    position: fixed;
    z-index: 10
}

.el-pagination span {
    padding: 0 5px
}

.el-pagination .el-select .el-input__suffix {
    right: 10px
}

.common-section-title {
    margin-bottom: 40px
}

.common-section-title h2,.common-section-title h3 {
    margin: 0;
    color: rgba(0,0,0,.85);
    font-size: 40px;
    font-weight: 500;
    letter-spacing: 3px;
    line-height: 60px;
    text-align: center
}

.common-page-section-title {
    font-size: 32px;
    font-weight: 500;
    letter-spacing: 3px;
    line-height: 48px;
    text-align: center;
    color: rgba(0,0,0,.85)
}

.mobilePagination {
    text-align: center
}

.mobilePagination ul.el-pager {
    width: calc(100% - 120px)
}

.page-preview-tip {
    position: fixed;
    right: 16px;
    top: 16px;
    background-color: #fff;
    padding: 14px 36px 14px 16px;
    border-radius: 2px;
    overflow: hidden;
    box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
    z-index: 999
}

.page-preview-tip .svg-icon-contain {
    position: absolute;
    right: 8px;
    top: 14px;
    font-size: 12px;
    cursor: pointer
}

.page-preview-tip .svg-icon-contain:hover {
    color: #666
}

.ws-arrow-break {
    display: inline-block;
    width: 50px;
    height: 21px
}

.ws-arrow-break .ws-arrow-single {
    position: relative;
    display: inline-block;
    width: 11px;
    height: 21px
}

.ws-arrow-break .ws-arrow-single:first-child {
    left: 5px;
    z-index: 3;
    opacity: .2
}

.ws-arrow-break .ws-arrow-single:nth-child(2) {
    left: -5px;
    z-index: 2;
    opacity: .6
}

.ws-arrow-break .ws-arrow-single:nth-child(3) {
    left: -15px;
    z-index: 1
}

.ws-arrow-break .ws-arrow-single:before {
    left: 0;
    border-color: transparent transparent transparent #2b66ff
}

.ws-arrow-break .ws-arrow-single:after,.ws-arrow-break .ws-arrow-single:before {
    content: "";
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    padding: 0;
    border-style: solid;
    border-width: 9px 6px
}

.ws-arrow-break .ws-arrow-single:after {
    left: -2px;
    border-color: transparent transparent transparent #fff
}

.button {
    display: inline-block;
    padding: 6px 24px;
    color: #fff;
    border-radius: 24px;
    text-align: center;
    box-sizing: border-box;
    outline: none;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.button__circle {
    border-radius: 20px
}

.button__primary {
    background: #2b66ff
}

.button.is-active,.button__primary:hover {
    color: #fff;
    background: #548aff
}

.button__info {
    background: #f3f2f2;
    color: #000
}

.button__transparent {
    background-color: transparent;
    border: 1px solid #d6d6d6
}

.button.is-active,.button__transparent:hover {
    background-color: #2b66ff;
    border-color: #2b66ff;
    color: #fff
}

.button__light:active {
    background-color: #1f4ed7
}

.button--small {
    padding: 4px 15px
}

.button--default {
    color: #2b66ff;
    border: 1px solid #dcdfe6;
    background-color: #fff
}

.button--default:active,.button--default:focus,.button--default:hover {
    color: #2b66ff;
    border-color: #d7e4ff;
    background-color: #d7e4ff
}

.textarea {
    line-height: 1.5;
    padding: 5px 15px;
    border-radius: 4px;
    box-sizing: border-box
}

.textarea::-moz-placeholder {
    font-size: 12px;
    color: #7f7f7f
}

.textarea:-ms-input-placeholder {
    font-size: 12px;
    color: #7f7f7f
}

.textarea::-ms-input-placeholder {
    font-size: 12px;
    color: #7f7f7f
}

.textarea::placeholder {
    font-size: 12px;
    color: #7f7f7f
}

.textarea:focus {
    outline: none!important;
    border-color: #2b66ff
}

.el-select .el-input__inner {
    height: 45px;
    line-height: 45px;
    color: #000;
    border: none;
    border-radius: 0;
    border-radius: initial;
    background-color: transparent;
    background-color: initial
}

.el-select .el-input__suffix {
    right: 20px
}

.el-select .el-select__caret.el-input__icon.el-icon-arrow-up {
    color: #a1a1a1
}

.el-select .el-icon-arrow-up:before {
    content: "\e78f"
}

.el-select-dropdown.el-popper {
    margin-top: 0!important;
    border: none;
    border-radius: 0;
    border-radius: initial
}

.el-select-dropdown.el-popper .popper__arrow {
    display: none!important
}

.el-select-dropdown.el-popper .el-scrollbar .el-select-dropdown__list {
    padding: 0
}

.el-select-dropdown.el-popper .el-scrollbar .el-popper .popper__arrow,.el-select-dropdown.el-popper .el-scrollbar .el-popper .popper__arrow:after {
    display: none
}

.el-select-dropdown.el-popper .el-scrollbar .el-select-dropdown__item {
    padding: 0 22px;
    height: 40px;
    line-height: 40px;
    color: rgba(0,0,0,.65)
}

.el-select-dropdown.el-popper .el-scrollbar .el-select-dropdown__item.hover,.el-select-dropdown.el-popper .el-scrollbar .el-select-dropdown__item:hover {
    color: #000;
    background: #f5f5f6
}

.el-tabs .el-tabs__header {
    margin: 0
}

.el-tabs .el-tabs__header .el-tabs__nav-scroll,.el-tabs .el-tabs__header .el-tabs__nav-wrap {
    overflow: visible;
    overflow: initial
}

.el-tabs .el-tabs__header .el-tabs__nav-scroll:after,.el-tabs .el-tabs__header .el-tabs__nav-wrap:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.el-tabs .el-tabs__item {
    vertical-align: top;
    padding: 0 85px;
    height: 24px;
    font-size: 18px;
    line-height: 24px;
    color: #262728
}

.el-tabs .el-tabs__item:hover {
    color: #262728
}

.el-tabs .el-tabs__item.is-active {
    font-weight: 700;
    color: #2b66ff
}

.el-tabs .el-tabs__nav-wrap:after {
    width: 0
}

.el-tabs .el-tabs__active-bar {
    height: 1px;
    background-color: #2b66ff;
    top: 40px
}

.el-tabs .el-tabs__active-bar:before {
    top: -11px;
    border: 6px solid transparent;
    border-bottom-color: #2b66ff
}

.el-tabs .el-tabs__active-bar:after,.el-tabs .el-tabs__active-bar:before {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    padding: 0
}

.el-tabs .el-tabs__active-bar:after {
    top: -10px;
    border: 6px solid transparent;
    border-bottom-color: #fff
}

.el-dialog .el-dialog__headerbtn:focus .el-dialog__close,.el-dialog .el-dialog__headerbtn:hover .el-dialog__close {
    color: #2b66ff
}

.el-dialog .el-dialog__headerbtn .el-dialog__close {
    font-size: 18px
}

.activity-validate-dialog .el-dialog__body,.activity-validate-dialog .el-dialog__footer {
    text-align: center
}

.activity-validate-dialog .el-dialog__footer .cancel-btn,.activity-validate-dialog .el-dialog__footer .confirm-btn {
    cursor: pointer;
    border-radius: 2px;
    padding: 5px 0;
    display: inline-block;
    width: 120px
}

.activity-validate-dialog .el-dialog__footer .confirm-btn {
    margin-right: 5px;
    background-color: #2b66ff;
    color: #fff
}

.activity-validate-dialog .el-dialog__footer .cancel-btn {
    border: 1px solid #2b66ff;
    color: #2b66ff
}

body .el-checkbox__input.is-checked .el-checkbox__inner,body .el-checkbox__input.is-indeterminate .el-checkbox__inner {
    background-color: #2b66ff;
    border-color: #2b66ff
}

body .el-checkbox__input.is-checked+.el-checkbox__label {
    color: #2b66ff
}

body .el-dialog__body {
    padding: 10px 20px 30px
}

body .el-loading-spinner .el-loading-text {
    color: #2b66ff
}

body .el-dialog__footer {
    padding: 10px 20px 20px;
    margin-top: 0
}

body .el-dialog {
    padding-bottom: 0
}

body .el-input__inner:focus,body .el-select .el-input.is-focus .el-input__inner {
    box-shadow: none
}

body .el-loading-spinner .path {
    stroke: #2b66ff
}

@media screen and (max-width: 768px) {
    .mobile .activity-validate-dialog .el-dialog__header {
        padding:15px 15px 10px
    }

    .mobile .activity-validate-dialog .el-dialog__header .el-dialog__title {
        font-size: 18px
    }

    .mobile .activity-validate-dialog .el-dialog__body {
        padding: 15px
    }

    .mobile .activity-validate-dialog .el-dialog__footer .cancel-btn,.mobile .activity-validate-dialog .el-dialog__footer .confirm-btn {
        width: 80px
    }
}

#newBridge .nb-icon-right-center {
    top: auto!important;
    bottom: 20%!important;
    transform: none!important
}

.clearfix:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.center-block {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.inline-block {
    display: inline-block
}

.pull-right {
    float: right
}

.pull-left {
    float: left
}

.common-content-wrap {
    width: 100%;
    margin: 0 auto
}

.single-title-banner {
    height: 180px;
    background-color: #1f252f
}

.single-title-banner h2 {
    font-size: 32px;
    font-weight: 500;
    letter-spacing: 3px;
    line-height: 48px;
    text-align: center;
    color: rgba(0,0,0,.85);
    color: #fff;
    padding-top: 68px
}

.hidden,.hide {
    display: none!important
}

.show {
    display: block!important
}

.invisible {
    visibility: hidden
}

.relative {
    position: relative
}

.absolute {
    position: absolute
}

.text-hide {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0
}

.text-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.text-break {
    word-break: break-all;
    word-wrap: break-word
}

.text-left {
    text-align: left
}
.application_img {
    text-align: center;
}
.text-right {
    text-align: right
}

.text-center {
    text-align: center
}

.text-justify {
    text-align: justify
}

.text-nowrap {
    white-space: nowrap
}

.text-lowercase {
    text-transform: lowercase
}

.text-uppercase {
    text-transform: uppercase
}

.text-capitalize {
    text-transform: capitalize
}

.pd-0 {
    padding: 0
}

.pd-4 {
    padding: 4px
}

.pd-8 {
    padding: 8px
}

.pd-12 {
    padding: 12px
}

.pd-16 {
    padding: 16px
}

.pd-20 {
    padding: 20px
}

.pd-24 {
    padding: 24px
}

.pd-28 {
    padding: 28px
}

.pd-32 {
    padding: 32px
}

.pd-36 {
    padding: 36px
}

.pd-40 {
    padding: 40px
}

.pd-44 {
    padding: 44px
}

.pd-48 {
    padding: 48px
}

.pd-52 {
    padding: 52px
}

.pd-56 {
    padding: 56px
}

.pd-60 {
    padding: 60px
}

.pd-t0 {
    padding-top: 0
}

.pd-t4 {
    padding-top: 4px
}

.pd-t8 {
    padding-top: 8px
}

.pd-t12 {
    padding-top: 12px
}

.pd-t16 {
    padding-top: 16px
}

.pd-t20 {
    padding-top: 20px
}

.pd-t24 {
    padding-top: 24px
}

.pd-t28 {
    padding-top: 28px
}

.pd-t32 {
    padding-top: 32px
}

.pd-t36 {
    padding-top: 36px
}

.pd-t40 {
    padding-top: 40px
}

.pd-t44 {
    padding-top: 44px
}

.pd-t48 {
    padding-top: 48px
}

.pd-t52 {
    padding-top: 52px
}

.pd-t56 {
    padding-top: 56px
}

.pd-t60 {
    padding-top: 60px
}

.pd-r0 {
    padding-right: 0
}

.pd-r4 {
    padding-right: 4px
}

.pd-r8 {
    padding-right: 8px
}

.pd-r12 {
    padding-right: 12px
}

.pd-r16 {
    padding-right: 16px
}

.pd-r20 {
    padding-right: 20px
}

.pd-r24 {
    padding-right: 24px
}

.pd-r28 {
    padding-right: 28px
}

.pd-r32 {
    padding-right: 32px
}

.pd-r36 {
    padding-right: 36px
}

.pd-r40 {
    padding-right: 40px
}

.pd-r44 {
    padding-right: 44px
}

.pd-r48 {
    padding-right: 48px
}

.pd-r52 {
    padding-right: 52px
}

.pd-r56 {
    padding-right: 56px
}

.pd-r60 {
    padding-right: 60px
}

.pd-b0 {
    padding-bottom: 0
}

.pd-b4 {
    padding-bottom: 4px
}

.pd-b8 {
    padding-bottom: 8px
}

.pd-b12 {
    padding-bottom: 12px
}

.pd-b16 {
    padding-bottom: 16px
}

.pd-b20 {
    padding-bottom: 20px
}

.pd-b24 {
    padding-bottom: 24px
}

.pd-b28 {
    padding-bottom: 28px
}

.pd-b32 {
    padding-bottom: 32px
}

.pd-b36 {
    padding-bottom: 36px
}

.pd-b40 {
    padding-bottom: 40px
}

.pd-b44 {
    padding-bottom: 44px
}

.pd-b48 {
    padding-bottom: 48px
}

.pd-b52 {
    padding-bottom: 52px
}

.pd-b56 {
    padding-bottom: 56px
}

.pd-b60 {
    padding-bottom: 60px
}

.pd-l0 {
    padding-left: 0
}

.pd-l4 {
    padding-left: 4px
}

.pd-l8 {
    padding-left: 8px
}

.pd-l12 {
    padding-left: 12px
}

.pd-l16 {
    padding-left: 16px
}

.pd-l20 {
    padding-left: 20px
}

.pd-l24 {
    padding-left: 24px
}

.pd-l28 {
    padding-left: 28px
}

.pd-l32 {
    padding-left: 32px
}

.pd-l36 {
    padding-left: 36px
}

.pd-l40 {
    padding-left: 40px
}

.pd-l44 {
    padding-left: 44px
}

.pd-l48 {
    padding-left: 48px
}

.pd-l52 {
    padding-left: 52px
}

.pd-l56 {
    padding-left: 56px
}

.pd-l60 {
    padding-left: 60px
}

.mg-0 {
    margin: 0
}

.mg-4 {
    margin: 4px
}

.mg-8 {
    margin: 8px
}

.mg-12 {
    margin: 12px
}

.mg-16 {
    margin: 16px
}

.mg-20 {
    margin: 20px
}

.mg-24 {
    margin: 24px
}

.mg-28 {
    margin: 28px
}

.mg-32 {
    margin: 32px
}

.mg-36 {
    margin: 36px
}

.mg-40 {
    margin: 40px
}

.mg-44 {
    margin: 44px
}

.mg-48 {
    margin: 48px
}

.mg-52 {
    margin: 52px
}

.mg-56 {
    margin: 56px
}

.mg-60 {
    margin: 60px
}

.mg-64 {
    margin: 64px
}

.mg-68 {
    margin: 68px
}

.mg-72 {
    margin: 72px
}

.mg-76 {
    margin: 76px
}

.mg-80 {
    margin: 80px
}

.mg-t0 {
    margin-top: 0
}

.mg-t4 {
    margin-top: 4px
}

.mg-t8 {
    margin-top: 8px
}

.mg-t12 {
    margin-top: 12px
}

.mg-t16 {
    margin-top: 16px
}

.mg-t20 {
    margin-top: 20px
}

.mg-t24 {
    margin-top: 24px
}

.mg-t28 {
    margin-top: 28px
}

.mg-t32 {
    margin-top: 32px
}

.mg-t36 {
    margin-top: 36px
}

.mg-t40 {
    margin-top: 40px
}

.mg-t44 {
    margin-top: 44px
}

.mg-t48 {
    margin-top: 48px
}

.mg-t52 {
    margin-top: 52px
}

.mg-t56 {
    margin-top: 56px
}

.mg-t60 {
    margin-top: 60px
}

.mg-t64 {
    margin-top: 64px
}

.mg-t68 {
    margin-top: 68px
}

.mg-t72 {
    margin-top: 72px
}

.mg-t76 {
    margin-top: 76px
}

.mg-t80 {
    margin-top: 80px
}

.mg-r0 {
    margin-right: 0
}

.mg-r4 {
    margin-right: 4px
}

.mg-r8 {
    margin-right: 8px
}

.mg-r12 {
    margin-right: 12px
}

.mg-r16 {
    margin-right: 16px
}

.mg-r20 {
    margin-right: 20px
}

.mg-r24 {
    margin-right: 24px
}

.mg-r28 {
    margin-right: 28px
}

.mg-r32 {
    margin-right: 32px
}

.mg-r36 {
    margin-right: 36px
}

.mg-r40 {
    margin-right: 40px
}

.mg-r44 {
    margin-right: 44px
}

.mg-r48 {
    margin-right: 48px
}

.mg-r52 {
    margin-right: 52px
}

.mg-r56 {
    margin-right: 56px
}

.mg-r60 {
    margin-right: 60px
}

.mg-r64 {
    margin-right: 64px
}

.mg-r68 {
    margin-right: 68px
}

.mg-r72 {
    margin-right: 72px
}

.mg-r76 {
    margin-right: 76px
}

.mg-r80 {
    margin-right: 80px
}

.mg-b0 {
    margin-bottom: 0
}

.mg-b4 {
    margin-bottom: 4px
}

.mg-b8 {
    margin-bottom: 8px
}

.mg-b12 {
    margin-bottom: 12px
}

.mg-b16 {
    margin-bottom: 16px
}

.mg-b20 {
    margin-bottom: 20px
}

.mg-b24 {
    margin-bottom: 24px
}

.mg-b28 {
    margin-bottom: 28px
}

.mg-b32 {
    margin-bottom: 32px
}

.mg-b36 {
    margin-bottom: 36px
}

.mg-b40 {
    margin-bottom: 40px
}

.mg-b44 {
    margin-bottom: 44px
}

.mg-b48 {
    margin-bottom: 48px
}

.mg-b52 {
    margin-bottom: 52px
}

.mg-b56 {
    margin-bottom: 56px
}

.mg-b60 {
    margin-bottom: 60px
}

.mg-b64 {
    margin-bottom: 64px
}

.mg-b68 {
    margin-bottom: 68px
}

.mg-b72 {
    margin-bottom: 72px
}

.mg-b76 {
    margin-bottom: 76px
}

.mg-b80 {
    margin-bottom: 80px
}

.mg-l0 {
    margin-left: 0
}

.mg-l4 {
    margin-left: 4px
}

.mg-l8 {
    margin-left: 8px
}

.mg-l12 {
    margin-left: 12px
}

.mg-l16 {
    margin-left: 16px
}

.mg-l20 {
    margin-left: 20px
}

.mg-l24 {
    margin-left: 24px
}

.mg-l28 {
    margin-left: 28px
}

.mg-l32 {
    margin-left: 32px
}

.mg-l36 {
    margin-left: 36px
}

.mg-l40 {
    margin-left: 40px
}

.mg-l44 {
    margin-left: 44px
}

.mg-l48 {
    margin-left: 48px
}

.mg-l52 {
    margin-left: 52px
}

.mg-l56 {
    margin-left: 56px
}

.mg-l60 {
    margin-left: 60px
}

.mg-l64 {
    margin-left: 64px
}

.mg-l68 {
    margin-left: 68px
}

.mg-l72 {
    margin-left: 72px
}

.mg-l76 {
    margin-left: 76px
}

.mg-l80 {
    margin-left: 80px
}

@-webkit-keyframes ctree-animation-spin {
    0% {
        transform: rotate(0deg) translateZ(0)
    }

    to {
        transform: rotate(1turn) translateZ(0)
    }
}

@keyframes ctree-animation-spin {
    0% {
        transform: rotate(0deg) translateZ(0)
    }

    to {
        transform: rotate(1turn) translateZ(0)
    }
}

@-webkit-keyframes ctree-animation-svg-circle-spin {
    0% {
        stroke-dasharray: 1 130;
        stroke-dashoffset: 0
    }

    50% {
        stroke-dasharray: 90 130;
        stroke-dashoffset: -30
    }

    to {
        stroke-dasharray: 90 130;
        stroke-dashoffset: -124
    }
}

@keyframes ctree-animation-svg-circle-spin {
    0% {
        stroke-dasharray: 1 130;
        stroke-dashoffset: 0
    }

    50% {
        stroke-dasharray: 90 130;
        stroke-dashoffset: -30
    }

    to {
        stroke-dasharray: 90 130;
        stroke-dashoffset: -124
    }
}

.ctree-tree__scroll-area,.ctree-tree__wrapper {
    width: 100%;
    height: 100%;
    position: relative
}

.ctree-tree__scroll-area {
    overflow: auto;
    display: flex
}

.ctree-tree__block-area {
    flex: 1
}

.ctree-tree__empty {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0
}

.ctree-tree__empty-text_default {
    width: 100%;
    text-align: center
}

.ctree-tree__loading {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    background-color: hsla(0,0%,100%,.95)
}

.ctree-tree__loading-wrapper {
    width: 100%;
    text-align: center
}

.ctree-tree__loading-icon {
    display: inline-block;
    width: 30px;
    height: 30px;
    -webkit-animation: ctree-animation-spin 2s linear infinite;
    animation: ctree-animation-spin 2s linear infinite
}

.ctree-tree__loading-icon .ctree-loading-icon__circle {
    stroke: #2d8cf0;
    stroke-linecap: round;
    -webkit-animation: ctree-animation-svg-circle-spin 1.5s ease-in-out infinite;
    animation: ctree-animation-svg-circle-spin 1.5s ease-in-out infinite
}

.ctree-tree__iframe {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    border: none;
    padding: 0;
    margin: 0;
    opacity: 0;
    z-index: -1000;
    pointer-events: none
}

.ctree-tree-node__wrapper {
    display: flex;
    flex-direction: column
}

.ctree-tree-node__drop {
    width: 100%;
    height: 2px
}

.ctree-tree-node__drop_active {
    background-color: #5cadff
}

.ctree-tree-node__node-body {
    flex: 1;
    display: flex;
    align-items: center
}

.ctree-tree-node__square {
    width: 20px;
    height: 20px;
    flex-shrink: 0
}

.ctree-tree-node__expand,.ctree-tree-node__square {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center
}

.ctree-tree-node__expand {
    cursor: pointer;
    width: 16px;
    height: 16px;
    transition: transform .2s linear
}

.ctree-tree-node__expand:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    border: 5px solid transparent;
    border-left-color: #515a6e
}

.ctree-tree-node__expand_active {
    transform: rotate(90deg)
}

.ctree-tree-node__loading-icon {
    display: inline-block;
    width: 14px;
    height: 14px;
    -webkit-animation: ctree-animation-spin 2s linear infinite;
    animation: ctree-animation-spin 2s linear infinite
}

.ctree-tree-node__loading-icon .ctree-loading-icon__circle {
    stroke: #515a6e;
    stroke-linecap: round;
    -webkit-animation: ctree-animation-svg-circle-spin 1.5s ease-in-out infinite;
    animation: ctree-animation-svg-circle-spin 1.5s ease-in-out infinite
}

.ctree-tree-node__checkbox {
    box-sizing: border-box;
    cursor: pointer;
    width: 14px;
    height: 14px;
    position: absolute;
    border: 1px solid #dcdee2;
    border-radius: 2px;
    background-color: #fff;
    transition: border-color .2s ease-in-out,background-color .2s ease-in-out,box-shadow .2s ease-in-out
}

.ctree-tree-node__checkbox:after {
    content: "";
    display: table;
    position: absolute;
    box-sizing: border-box;
    border: 2px solid #fff;
    border-top: 0;
    border-left: 0;
    width: 4px;
    height: 8px;
    top: 1px;
    left: 4px;
    transform: rotate(45deg) scale(0);
    transition: all .2s ease-in-out
}

.ctree-tree-node__checkbox:hover {
    border-color: #c5c8ce
}

.ctree-tree-node__checkbox:focus {
    box-shadow: 0 0 0 2px #5cadff
}

.ctree-tree-node__checkbox_checked {
    border-color: #2d8cf0;
    background-color: #2d8cf0
}

.ctree-tree-node__checkbox_checked:after {
    width: 4px;
    height: 8px;
    top: 1px;
    left: 4px;
    transform: rotate(45deg) scale(1)
}

.ctree-tree-node__checkbox_checked:hover,.ctree-tree-node__checkbox_indeterminate {
    border-color: #2d8cf0;
    background-color: #2d8cf0
}

.ctree-tree-node__checkbox_indeterminate:after {
    width: 8px;
    height: 1px;
    top: 5px;
    left: 2px;
    transform: scale(1)
}

.ctree-tree-node__checkbox_indeterminate:hover {
    border-color: #2d8cf0;
    background-color: #2d8cf0
}

.ctree-tree-node__checkbox_disabled {
    cursor: not-allowed
}

.ctree-tree-node__checkbox_disabled,.ctree-tree-node__checkbox_disabled:hover {
    border-color: #dcdee2;
    background-color: #e8eaec
}

.ctree-tree-node__checkbox_disabled:after {
    border-color: #c5c8ce
}

.ctree-tree-node__title {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    flex: 1;
    height: 26px;
    line-height: 26px;
    margin-left: 5px;
    padding-left: 5px;
    background-color: transparent;
    word-break: keep-all;
    white-space: nowrap;
    word-wrap: none
}

.ctree-tree-node__title:hover {
    background-color: #ebf5ff
}

.ctree-tree-node__title_selected,.ctree-tree-node__title_selected:hover {
    background-color: #d4e7fc
}

.ctree-tree-node__title_disabled {
    cursor: not-allowed;
    color: #c5c8ce
}

.ctree-tree-search__wrapper {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column
}

.ctree-tree-search__search {
    height: 42px;
    display: flex;
    box-sizing: border-box
}

.ctree-tree-search__check-all-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    justify-content: normal;
    width: 40px
}

.ctree-tree-search__check-all {
    margin-left: 23px
}

.ctree-tree-search__input-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 5px;
    flex: 1
}

.ctree-tree-search__input {
    color: #515a6e;
    box-sizing: border-box;
    width: 100%;
    height: 32px;
    border: 1px solid #dcdee2;
    border-radius: 4px;
    padding: 4px 7px;
    outline: none;
    transition: border .2s ease-in-out,box-shadow .2s ease-in-out
}

.ctree-tree-search__input::-moz-placeholder {
    color: #c5c8ce
}

.ctree-tree-search__input:-ms-input-placeholder {
    color: #c5c8ce
}

.ctree-tree-search__input::-ms-input-placeholder {
    color: #c5c8ce
}

.ctree-tree-search__input::placeholder {
    color: #c5c8ce
}

.ctree-tree-search__input:hover {
    border-color: #57a3f3
}

.ctree-tree-search__input:focus {
    border-color: #57a3f3;
    box-shadow: 0 0 0 2px rgba(45,140,240,.2)
}

.ctree-tree-search__input_disabled {
    cursor: not-allowed;
    color: #ccc;
    background-color: #f3f3f3
}

.ctree-tree-search__input_disabled:hover {
    border-color: #dcdee2
}

.ctree-tree-search__action-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px
}

.ctree-tree-search__checked-button {
    cursor: pointer
}

.ctree-tree-search__checked-button:hover {
    color: #5cadff
}

.ctree-tree-search__checked-button_active {
    color: #2d8cf0
}

.ctree-tree-search__tree-wrapper {
    width: 100%;
    flex: 1;
    overflow-y: auto
}

.ctree-tree-search__footer {
    padding: 5px
}

.ctree-tree-drop__wrapper {
    position: relative
}

.ctree-tree-drop__reference {
    cursor: pointer
}

.ctree-tree-drop__display-input {
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding-right: 20px
}

.ctree-tree-drop__display-input-text {
    display: block;
    height: 100%;
    line-height: 22px
}

.ctree-tree-drop__display-input-placeholder {
    color: #c5c8ce
}

.ctree-tree-drop__display-input_focus {
    border-color: #57a3f3;
    box-shadow: 0 0 0 2px rgba(45,140,240,.2)
}

.ctree-tree-drop__display-icon-drop {
    position: absolute;
    top: 8px;
    right: 3px;
    width: 14px;
    height: 14px;
    box-sizing: border-box;
    border: 3px solid #808695;
    border-top: none;
    border-left: none;
    transform: rotate(45deg) scale(.5) translateX(-3.5px) translateY(-3.5px);
    transition: transform .2s ease-in-out
}

.ctree-tree-drop__display-icon-drop_active {
    transform: rotate(225deg) scale(.5) translateX(-3.5px) translateY(-3.5px)
}

.ctree-tree-drop__display-icon-clear {
    position: absolute;
    top: 8px;
    right: 3px;
    width: 14px;
    height: 14px;
    box-sizing: border-box;
    border-radius: 50%;
    background-color: #808695;
    overflow: hidden;
    transform: scale(.9) rotate(45deg);
    display: none
}

.ctree-tree-drop__display-icon-clear:after,.ctree-tree-drop__display-icon-clear:before {
    content: "";
    width: 1px;
    height: 7px;
    display: block;
    background-color: #fff;
    position: absolute;
    top: 3.5px;
    left: 6.5px
}

.ctree-tree-drop__display-icon-clear:after {
    transform: rotate(90deg)
}

.ctree-tree-drop__display-input:hover .ctree-tree-drop__display-icon-clear {
    display: block
}

.ctree-tree-drop__dropdown {
    position: absolute;
    top: -999px;
    left: -999px;
    box-shadow: 0 1px 6px rgba(0,0,0,.2);
    border-radius: 4px;
    margin: 5px 0;
    padding: 5px 0;
    transform-origin: center top 0;
    background-color: #fff;
    z-index: 9999
}

.ctree-tree-drop__dropdown .ctree-tree-search__search {
    border-bottom: 1px solid #dcdee2;
    padding-bottom: 5px;
    height: 38px
}

.ctree-tree-drop__dropdown .ctree-tree-search__tree-wrapper {
    padding-top: 5px
}

.ctree-dropdown-enter,.ctree-dropdown-leave-to {
    opacity: 0;
    transform: scaleY(.8)
}

.ctree-dropdown-enter-active,.ctree-dropdown-leave-active {
    transition: opacity .3s,transform .3s
}

.ws-web-header {
    position: relative;
    z-index: 12
}

.ws-web-header:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.ws-web-header__wrap {
    padding: 0 60px
}

.ws-web-header__wrap:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.ws-web-header__logo {
    float: left;
    width: 207px;
    text-align: left;
    vertical-align: top;
    height: 60px;
    line-height: 60px
}

.ws-web-header__logo-link {
    display: inline-block
}

.ws-web-header__logo img {
    vertical-align: middle
}

.ws-web-header__nav {
    background: #fff;
    height: 60px
}

.ws-web-header__regist {
    float: right;
    height: 60px;
    line-height: 60px;
    margin-left: 40px
}

.ws-web-header__regist a.regist-button {
    display: inline-block;
    padding: 0;
    color: #fff;
    width: 100px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    border-radius: 2px
}

.ws-web-header__user {
    position: relative
}

.ws-web-header__user a {
    display: inline-block;
    height: 60px;
    line-height: 60px;
    padding: 0 20px
}

.ws-web-header__user a:hover {
    color: #2b66ff
}

.ws-web-header__user:hover .info-wrap {
    display: block
}

.ws-web-header__user .info-wrap {
    position: absolute;
    display: none;
    right: 50%;
    margin-right: -23px;
    top: 100%;
    width: 220px;
    background: #fff;
    box-shadow: 0 2px 10px 0 rgba(0,0,0,.3)
}

.ws-web-header__user .info-wrap img {
    float: left;
    width: 43px;
    height: 43px
}

.ws-web-header__user .info-wrap:before {
    position: absolute;
    top: -10px;
    right: 23px;
    content: "";
    width: 0;
    height: 0;
    border: 5px solid transparent;
    border-bottom-color: #f0f4fa
}

.ws-web-header__user .info-wrap .user-row {
    padding: 16px 14px 10px;
    height: 67px;
    background: #f0f4fa;
    box-sizing: border-box
}

.ws-web-header__user .info-wrap .user-row .avatar {
    width: 43px;
    height: 43px;
    vertical-align: top
}

.ws-web-header__user .info-wrap .user-row .authentication-msg {
    display: inline-block;
    font-size: 14px;
    margin-left: 8px
}

.ws-web-header__user .info-wrap .user-row .authentication-msg i {
    margin-right: 5px
}

.ws-web-header__user .info-wrap .user-row .authentication-msg a {
    color: #fff;
    display: inline-block;
    height: auto;
    line-height: normal;
    padding: 0
}

.ws-web-header__user .info-wrap .user-row .authentication-msg--warn {
    color: orange
}

.ws-web-header__user .info-wrap .user-row .authentication-msg--warn a {
    text-decoration: underline;
    color: orange
}

.ws-web-header__user .info-wrap .user-row .authentication-msg--success {
    color: green
}

.ws-web-header__user .info-wrap .user-row .text {
    display: inline-block;
    width: 136px;
    vertical-align: top;
    margin-left: 8px
}

.ws-web-header__user .info-wrap .user-row .text .title {
    margin-top: 1px;
    margin-bottom: 3px;
    font-size: 14px;
    color: rgba(0,0,0,.65);
    line-height: 19px
}

.ws-web-header__user .info-wrap .user-row .text .name {
    font-size: 14px;
    color: #000;
    line-height: 19px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.ws-web-header__user .info-wrap .func-row {
    box-sizing: border-box;
    padding: 24px 20px 27px 16px
}

.ws-web-header__user .info-wrap .func-row-item {
    color: #000;
    line-height: 19px;
    margin-bottom: 16px
}

.ws-web-header__user .info-wrap .func-row-item a {
    line-height: 19px;
    font-size: 14px;
    display: block;
    color: #000;
    height: auto;
    padding: 0
}

.ws-web-header__user .info-wrap .func-row-item a:hover {
    color: #2b66ff
}

.ws-web-header__user .info-wrap .func-row-item.login-out {
    padding-left: 1px
}

.ws-web-header__user .info-wrap .func-row-item.login-out .svg-icon-contain {
    margin-right: 10px
}

.ws-web-header__user .info-wrap .func-row-item .svg-icon-contain {
    margin-right: 12px
}

.ws-web-header__user .info-wrap .func-row-item:hover {
    color: #2b66ff
}

.ws-web-header__user .info-wrap .func-row-item:last-child {
    margin-bottom: 0
}

.ws-web-header__tools-link {
    float: left
}

.ws-web-header .ws-web-topnav__nav-dropdown {
    position: absolute;
    display: none;
    box-shadow: 0 1px 2px 0 rgba(173,190,204,.35);
    min-width: 72px
}

.ws-web-header .is-full .ws-web-topnav__nav-dropdown {
    left: 0;
    right: 0;
    overflow: hidden;
    box-shadow: inset 0 3px 7px #000
}

.ws-web-header .is-full .ws-web-topnav__nav-dropdown .header-dropdown-menu__detail {
    margin-right: 206px;
    margin-left: 308px
}

.ws-web-header .header-dropdown-menu {
    position: relative;
    background-color: hsla(0,0%,100%,.95)
}

.ws-web-header .header-dropdown-menu__normallist ul {
    padding: 4px
}

.ws-web-header .header-dropdown-menu__normallist li {
    min-width: 200px
}

.ws-web-header .header-dropdown-menu__normallist li a {
    font-size: 14px;
    height: 24px;
    line-height: 24px;
    border-radius: 2px;
    padding: 6px 16px;
    display: inline-block;
    color: #262626
}

.ws-web-header .header-dropdown-menu__normallist li a:hover {
    color: #2b66ff
}

.ws-web-header .header-dropdown-menu__list {
    float: left;
    width: 220px;
    background-color: #222833;
    padding-bottom: 999px;
    margin-bottom: -999px;
    position: relative
}

.ws-web-header .header-dropdown-menu__list ul {
    margin: 12px 0
}

.ws-web-header .header-dropdown-menu__list li {
    display: block;
    height: 48px;
    line-height: 48px;
    padding: 0 20px 0 39px;
    color: #fff;
    cursor: pointer
}

.ws-web-header .header-dropdown-menu__list li.is-active,.ws-web-header .header-dropdown-menu__list li:hover {
    background-color: #2b66ff
}

.ws-web-header .header-dropdown-menu__list--icon {
    position: absolute;
    right: 12px;
    font-size: 12px
}

.ws-web-header .header-dropdown-menu__detail {
    overflow: hidden
}

.ws-web-header .header-dropdown-menu__detail .header-dropdown-menu__columns {
    vertical-align: top;
    display: inline-block
}

.ws-web-header .header-dropdown-menu__detail .header-dropdown-menu__item {
    padding: 24px 0 30px 20px;
    width: 152px
}

.ws-web-header .header-dropdown-menu__detail .header-dropdown-menu__item-name {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #999;
    padding-left: 16px;
    padding-bottom: 12px;
    font-size: 12px
}

.ws-web-header .header-dropdown-menu__detail .header-dropdown-menu__item-name.is-last {
    color: #262626;
    padding-left: 0;
    padding-bottom: 0
}

.ws-web-header .header-dropdown-menu__detail .header-dropdown-menu__item-children {
    padding-top: 6px
}

.ws-web-header .header-dropdown-menu__detail .header-dropdown-menu__item-children a {
    font-size: 14px;
    line-height: 20px;
    border-radius: 2px;
    padding: 6px 16px;
    color: #262626;
    display: inline-block;
    white-space: normal
}

.ws-web-header .header-dropdown-menu__detail .header-dropdown-menu__item a:hover {
    color: #2b66ff
}

.ws-web-header .header-dropdown-menu__detail.is-single {
    display: flex;
    flex-flow: column wrap;
    height: 221px;
    padding: 22px 0
}

.ws-web-header .header-dropdown-menu__detail.is-single .header-dropdown-menu__columns {
    width: 190px;
    padding: 0 0 12px 26px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ws-web-header .header-dropdown-menu__detail.is-single .header-dropdown-menu__item {
    display: inline;
    padding: 8px 18px;
    font-size: 14px;
    line-height: 32px;
    border-radius: 2px;
    cursor: pointer
}

.ws-web-header .header-dropdown-menu__detail.is-single .header-dropdown-menu__item a {
    color: #fff
}

.ws-web-header .header-dropdown-menu__detail.is-single .header-dropdown-menu__item:hover a {
    color: #2b66ff
}

.ws-web-header .header-dropdown-menunav {
    background-color: #fff;
    text-align: center
}

.ws-web-header .header-dropdown-menunav ul {
    min-width: 100%
}

.ws-web-header .header-dropdown-menunav a {
    display: block;
    line-height: 30px;
    text-align: center;
    color: #262626
}

.ws-web-header .header-dropdown-menunav a:hover {
    color: #2b66ff
}

.ws-web-topnav-list {
    float: left;
    margin-left: 40px
}

.ws-web-topnav-list>li {
    float: left
}

.ws-web-topnav-list>li:hover .ws-web-topnav__item-name {
    color: #2b66ff;
    text-decoration: none
}

.ws-web-topnav-list>li.is-active .ws-web-topnav__nav-dropdown {
    display: block
}

.ws-web-topnav-list>li .ws-web-topnav__item-name {
    display: block;
    line-height: 60px;
    min-width: 46px;
    padding: 0 20px;
    font-size: 16px;
    color: #262626;
    text-align: center;
    white-space: nowrap;
    cursor: pointer
}

.ws-web-topnav-list>li .ws-web-topnav__item-name .menu-tag {
    position: relative;
    vertical-align: bottom;
    margin-left: 8px;
    margin-right: 4px;
    padding: 2px 5px;
    height: 20px;
    background: linear-gradient(148deg,#fab471,#ff2b2b);
    border-radius: 2px;
    font-size: 12px;
    color: #fff
}

.ws-web-topnav-list>li .ws-web-topnav__item-name .menu-tag:before {
    content: "";
    position: absolute;
    display: block;
    left: -6px;
    top: 5px;
    width: 8px;
    height: 7px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAJCAYAAAD+WDajAAAAAXNSR0IArs4c6QAAAJNJREFUGBlj/F9j4sDAyPyZgVnuMmPD6l8MSIDxf4OZGsPvvycZ/jNwMzAyXAbKnQPiswxMTGcZQQr/15h6MPz/txWogAnEhwEwh7Hl9A4GBqZymCCMBuuEcf5XmSwGmhMD46MYw8DGk8rAwHgaJomiEyT4v8FaiuH3jzNA+yUxJMEKao3NGf4yHISZgEH/rzaOBwDE8idmFDrTSQAAAABJRU5ErkJggg==)
}

.ws-web-topnav-list>li .ws-web-topnav__item-name.is-active {
    color: #2b66ff
}

.ws-web-topnav-list>li .ws-web-topnav__item-name:hover {
    color: #2b66ff;
    text-decoration: none
}

.ws-web-toptool-list {
    float: left;
    font-size: 16px
}

.ws-web-toptool-list:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.ws-web-toptool-list>li {
    float: left
}

.ws-web-toptool-list>li>a {
    color: #262626;
    display: inline-block;
    height: 60px;
    line-height: 60px;
    padding: 0 20px
}

.ws-web-toptool-list>li>a:hover {
    color: #2b66ff
}

.ws-web-toptool-list>li:last-child a {
    padding-right: 0
}

.ws-web-toplan {
    position: relative
}

.ws-web-toplan__current {
    color: #fff;
    display: block;
    height: 60px;
    line-height: 60px;
    padding: 0 16px;
    cursor: pointer
}

.ws-web-toplan__current:hover {
    color: #2b66ff
}

.ws-web-toplan__current i {
    border-color: #fff transparent transparent;
    border-style: solid;
    border-width: 5px 4px;
    display: inline-block;
    vertical-align: -2px
}

.ws-web-toplan:hover .ws-web-toplan__drop {
    display: block
}

.ws-web-toplan__drop {
    display: none;
    position: absolute;
    right: 0;
    top: 60px;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    border-radius: 2px
}

.ws-web-toplan__drop:before {
    content: "";
    position: absolute;
    border-color: transparent transparent #fff;
    border-style: solid;
    border-width: 5px 4px;
    display: inline-block;
    top: -10px;
    right: 16px
}

.ws-web-toplan__drop .header-language-list {
    background: #fff;
    line-height: 30px;
    display: block
}

.ws-web-toplan__drop .header-language-list p {
    cursor: pointer;
    padding: 0 16px;
    white-space: nowrap
}

.ws-web-toplan__drop .header-language-list p:hover {
    color: #2b66ff
}

.mask-bg,.mask-container {
    width: 100%;
    height: 100%
}

.mask-bg {
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.6)
}

.mask-content {
    position: fixed;
    width: 510px;
    border: 1px solid #ccc;
    text-align: center;
    top: calc(50% - 255px);
    left: calc(50% - 255px);
    background: #fff;
    border-radius: 2px
}

.mask-content .mask-content-title {
    font-size: 16px;
    color: rgba(0,0,0,.85);
    line-height: 24px;
    text-align: left;
    padding: 12px 24px;
    border-bottom: 1px solid rgba(0,0,0,.1)
}

.mask-content .mask-content-title .close {
    float: right;
    cursor: pointer
}

.mask-content .mask-content-info {
    text-align: left;
    padding-bottom: 32px
}

.mask-content .mask-content-info:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.mask-content .mask-content-info .mask-content-info-item {
    width: 170px;
    text-align: center;
    float: left;
    margin-top: 32px
}

.mask-content .mask-content-info .mask-content-info-item .circle {
    display: inline-block;
    padding: 18px 11px;
    vertical-align: top;
    background-repeat: no-repeat;
    background-size: contain;
    border-radius: 50px;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35)
}

.mask-content .mask-content-info .mask-content-info-item .circle img {
    width: 68px;
    height: 48px
}

.mask-content .mask-content-info .mask-content-info-item p {
    font-size: 14px;
    color: rgba(0,0,0,.65);
    line-height: 21px;
    padding-top: 16px
}

.main_footer {
    position: relative;
    width: 100%;
    bottom: 0;
    padding: 15px 0 40px;
    background: linear-gradient(90deg,#edfaff,#c7e9fe 35%,#edfaff 65%,#c7e9fe);
    color: #525252;
    overflow: hidden;
    z-index: 1
}

.main_footer .footer_content {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding-top: 20px
}

.main_footer .footer_content:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.main_footer .footer_content .footer_left {
    float: left;
    width: 230px;
    font-family: MicrosoftYaHei-Bold,MicrosoftYaHei
}

.main_footer .footer_content .footer_left .contact_us {
    margin-bottom: 23px;
    font-size: 16px;
    line-height: 21px;
    color: #000
}

.main_footer .footer_content .footer_left .contact_us_info {
    font-size: 24px;
    line-height: 42px;
    color: #000
}

.main_footer .footer_content .footer_left .contact_us_button {
    margin-top: 12px;
    width: 152px;
    height: 45px;
    border-radius: 2px;
    font-size: 16px;
    color: #525252;
    line-height: 21px;
    border: 1px solid #525252
}

.main_footer .footer_content .footer_left .contact_us_button:hover {
    color: #2b66ff;
    background-color: transparent!important
}

.main_footer .footer_content .footer_center ul.ws_service_list {
    border-left: 1px solid hsla(0,0%,100%,.1);
    border-right: 1px solid hsla(0,0%,100%,.1);
    margin-bottom: 78px;
    padding-left: 67px;
    padding-right: 68px
}

.main_footer .footer_content .footer_center ul.ws_service_list li.ws_service_list_item {
    margin-right: 77px;
    display: inline-block;
    width: 80px;
    padding: 0;
    box-sizing: border-box;
    vertical-align: top
}

.main_footer .footer_content .footer_center ul.ws_service_list li.ws_service_list_item:nth-child(4n+1) {
    width: 120px
}

.main_footer .footer_content .footer_center ul.ws_service_list li.ws_service_list_item:nth-child(4n) {
    margin-right: 0
}

.main_footer .footer_content .footer_center ul.ws_service_list li.ws_service_list_item h3 {
    margin-bottom: 20px;
    font-size: 16px;
    font-family: MicrosoftYaHei-Bold,MicrosoftYaHei;
    font-weight: 400;
    color: #000;
    line-height: 21px;
    white-space: nowrap
}

.main_footer .footer_content .footer_center ul.ws_service_list li.ws_service_list_item ul.ws_service_sublist {
    margin-top: 24px
}

.main_footer .footer_content .footer_center ul.ws_service_list li.ws_service_list_item ul.ws_service_sublist li {
    margin-bottom: 8px
}

.main_footer .footer_content .footer_center ul.ws_service_list li.ws_service_list_item ul.ws_service_sublist li:last-child {
    margin-bottom: 0
}

.main_footer .footer_content .footer_center ul.ws_service_list li.ws_service_list_item ul.ws_service_sublist li a {
    transition: all .3s linear;
    letter-spacing: 0;
    font-size: 14px;
    color: #525252;
    line-height: 21px;
    white-space: nowrap
}

.main_footer .footer_content .footer_center ul.ws_service_list li.ws_service_list_item ul.ws_service_sublist li a:hover {
    color: #2b66ff
}

.main_footer .footer_content .footer_center ul.ws_service_list li.ws_service_list_item_code {
    float: left;
    width: 14.28571429%;
    padding: 0;
    box-sizing: border-box;
    text-align: center;
    margin-top: 23px;
    min-width: 100px
}

.main_footer .footer_content .footer_center {
    float: left;
    width: 728px
}

.main_footer .footer_content .footer_right {
    float: left;
    box-sizing: border-box;
    padding-left: 40px
}

.main_footer .footer_content .footer_right>h3 {
    margin-bottom: 24px;
    font-size: 16px;
    font-family: MicrosoftYaHei-Bold,MicrosoftYaHei;
    color: #000;
    line-height: 21px
}

.main_footer .footer_content .footer_right .contact_us_code {
    font-size: 12px;
    color: #525252;
    line-height: 18px;
    margin-top: 6px
}

.main_footer .footer_content .footer_right .footer_right_contact {
    display: inline-block;
    text-align: center
}

.main_footer .footer_content .footer_right .footer_right_contact .footer_right_contact_code {
    float: left;
    margin-right: 18px
}

.main_footer .footer_content .footer_right .footer_right_contact .footer_right_contact_code:last-child {
    margin-right: 0
}

.main_footer .footer_content .footer_list {
    padding: 20px 0 11px
}

.main_footer .footer_content .footer_list ul {
    width: 100%;
    display: inline-block;
    text-align: center;
    border-top: 1px solid rgba(75,75,75,.2);
    border-bottom: 1px solid rgba(75,75,75,.2);
    font-size: 0
}

.main_footer .footer_content .footer_list ul li {
    display: inline-block;
    line-height: 52px;
    margin-right: 12px;
    letter-spacing: 0;
    font-size: 12px;
    font-weight: 400;
    color: #000
}

.main_footer .footer_content .footer_list ul li img {
    margin-right: 10px;
    vertical-align: middle
}

.main_footer .footer_content .footer_list ul li a {
    color: #000
}

.main_footer .footer_content .footer_list ul li a:hover {
    color: #2b66ff
}

.main_footer .footer_content .copy_right {
    text-align: center;
    letter-spacing: 0;
    font-size: 12px;
    font-weight: 400;
    color: #aaa;
    white-space: pre-line
}

.main_footer .footer_content_mini {
    display: none
}

.aftersale-dialog .el-dialog__body {
    text-align: center;
    padding: 10px 20px;
    color: #525252
}

.aftersale-dialog .el-dialog__body p {
    margin-bottom: 20px
}

.aftersale-dialog .el-dialog__footer {
    padding: 10px 20px;
    background: #f7f7f7
}

.anim-client-scroll-x {
    -webkit-animation: scrollX 20s linear infinite;
    animation: scrollX 20s linear infinite
}

@-webkit-keyframes scrollX {
    0% {
        margin: 0
    }

    to {
        margin-left: -100%
    }
}

@keyframes scrollX {
    0% {
        margin: 0
    }

    to {
        margin-left: -100%
    }
}

.common-empty {
    padding: 60px 0;
    overflow: hidden
}

.common-empty .common-empty-content {
    min-width: 455px;
    margin: 100px auto;
    text-align: center
}

.common-empty .common-empty-content img {
    height: 64px;
    width: 64px
}

.common-empty .common-empty-content p {
    line-height: 24px;
    color: #999;
    font-size: 18px;
    color: rgba(0,0,0,.65);
    letter-spacing: 0;
    text-align: center
}

.common-empty .common-empty-content a {
    color: #2b66ff
}

.common-empty .common-empty-content a:hover {
    text-decoration: underline
}

.el-message {
    min-width: 380px;
    box-sizing: border-box;
    border-radius: 4px;
    border: 1px solid #ebeef5;
    position: fixed;
    left: 50%;
    top: 20px;
    transform: translateX(-50%);
    background-color: #edf2fc;
    transition: opacity .3s,transform .4s,top .4s;
    overflow: hidden;
    padding: 15px 15px 15px 20px;
    display: flex;
    align-items: center
}

.mobile .el-message {
    min-width: 90%
}

.el-message.is-center {
    justify-content: center
}

.el-message.is-closable .el-message__content {
    padding-right: 16px
}

.el-message p {
    margin: 0
}

.el-message--info .el-message__content {
    color: #909399
}

.el-message--success {
    background-color: #f0f9eb;
    border-color: #e1f3d8
}

.el-message--success .el-message__content {
    color: #67c23a
}

.el-message--warning {
    background-color: #fdf6ec;
    border-color: #faecd8
}

.el-message--warning .el-message__content {
    color: #e6a23c
}

.el-message--error {
    background-color: #fef0f0;
    border-color: #fde2e2
}

.el-message--error .el-message__content {
    color: #f56c6c
}

.el-message__icon {
    margin-right: 10px
}

.el-message__content {
    padding: 0;
    font-size: 14px;
    line-height: 1
}

.el-message__content:focus {
    outline-width: 0
}

.el-message__closeBtn {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    cursor: pointer;
    color: #c0c4cc;
    font-size: 16px
}

.el-message__closeBtn:focus {
    outline-width: 0
}

.el-message__closeBtn:hover {
    color: #909399
}

.el-message .el-icon-success {
    color: #67c23a
}

.el-message .el-icon-error {
    color: #f56c6c
}

.el-message .el-icon-info {
    color: #909399
}

.el-message .el-icon-warning {
    color: #e6a23c
}

.el-message-fade-enter,.el-message-fade-leave-active {
    opacity: 1;
    transform: translate(-50%,-100%)
}

.markdown-item.markdown-body {
    font-family: PingFangSC,helvetica neue,hiragino sans gb,arial,microsoft yahei ui,microsoft yahei,simsun,"sans-serif";
    color: rgba(0,0,0,.8);
    font-size: 14px
}

.markdown-item.markdown-body h1,.markdown-item.markdown-body h2,.markdown-item.markdown-body h3,.markdown-item.markdown-body h4,.markdown-item.markdown-body h5,.markdown-item.markdown-body h6 {
    color: #000;
    font-weight: 700;
    line-height: 1
}

.markdown-item.markdown-body h2 {
    font-size: 20px;
    border-bottom: none;
    margin-top: 30px;
    margin-bottom: 16px
}

.markdown-item.markdown-body h3 {
    margin-top: 30px;
    margin-bottom: 16px;
    padding-left: 14px;
    font-size: 20px;
    font-weight: 700;
    color: #000;
    border-left: 2px solid #2b66ff
}

.markdown-item.markdown-body h4 {
    font-size: 16px
}

.markdown-item.markdown-body h5 {
    font-size: 14px
}

.markdown-item.markdown-body h6 {
    font-size: 12px
}

.markdown-item.markdown-body a {
    color: #2b66ff
}

.markdown-item.markdown-body a:hover {
    text-decoration: underline
}

.markdown-item.markdown-body ol,.markdown-item.markdown-body ul {
    padding-left: 17px;
    list-style-position: outside;
    list-style-type: none
}

.markdown-item.markdown-body ul li {
    list-style: disc outside none;
    list-style: initial;
    margin: 4px 0
}

.markdown-item.markdown-body ol li {
    list-style-type: decimal;
    margin: 5px 0
}

.markdown-item.markdown-body hr {
    height: 1px;
    margin: 16px 0
}

.markdown-item.markdown-body .hljs-center {
    text-align: center
}

.markdown-item.markdown-body .hljs-right {
    text-align: right
}

.markdown-item.markdown-body blockquote {
    border-left: 6px solid #d9d9d9;
    color: rgba(0,0,0,.65);
    padding-left: 16px
}

.markdown-item.markdown-body.ws-product-recommend-document h2,.markdown-item.markdown-body.ws-product-recommend-document h3,.markdown-item.markdown-body.ws-product-recommend-document h4,.markdown-item.markdown-body.ws-product-recommend-document h5,.markdown-item.markdown-body.ws-product-recommend-document h6 {
    border: none
}

.markdown-item.markdown-body.ws-product-recommend-document h2 {
    margin-top: 0;
    margin-bottom: 12px;
    padding-bottom: 0
}

.markdown-item.markdown-body.ws-product-recommend-document p {
    color: #000;
    margin-bottom: 8px
}

.markdown-item.markdown-body.ws-product-recommend-document p s {
    color: #bbb
}

.markdown-item.markdown-body.ws-product-recommend-document p .desc {
    display: inline-block;
    margin-bottom: 6px;
    font-size: 14px;
    line-height: 19px;
    color: rgba(0,0,0,.65)
}

.markdown-item.markdown-body.ws-product-recommend-document p .price {
    font-size: 30px;
    font-family: din;
    font-weight: 700;
    color: #2b66ff;
    line-height: 36px
}

.markdown-item.markdown-body.ws-product-recommend-document p img {
    vertical-align: sub
}

.markdown-item.markdown-body.ws-home-activity-document p {
    margin-bottom: 10px;
    font-size: 14px;
    color: #000;
    line-height: 19px
}

.markdown-item.markdown-body.ws-home-activity-document p:last-child {
    margin-top: 22px
}

.markdown-item.markdown-body.ws-home-activity-document p s {
    color: #bbb
}

.markdown-item.markdown-body.ws-home-activity-document p .desc {
    font-size: 14px;
    line-height: 19px;
    color: rgba(0,0,0,.65)
}

.markdown-item.markdown-body.ws-home-activity-document p .price {
    font-size: 30px;
    font-family: din;
    font-weight: 700;
    color: #2b66ff;
    line-height: 36px
}

.markdown-item.markdown-body.ws-home-activity-document p img {
    vertical-align: middle
}

.markdown-item.markdown-body.ws-activity-desc p {
    margin-bottom: 10px;
    color: #262728;
    line-height: 19px
}

.markdown-item.markdown-body.ws-activity-desc p:last-child,.markdown-item.markdown-body.ws-activity-price p:last-child {
    margin-bottom: 0
}

.markdown-item.markdown-body.ws-activity-price s {
    color: #bbb
}

.markdown-item.markdown-body.ws-activity-price .coin {
    font-size: 16px;
    font-family: din;
    font-weight: 700;
    color: #2b66ff;
    line-height: 19px
}

.markdown-item.markdown-body.ws-activity-price .price {
    font-size: 30px;
    font-family: din;
    font-weight: 700;
    color: #2b66ff;
    line-height: 36px
}

.markdown-item.markdown-body table thead tr {
    background-color: #f0f7ff;
    border: 1px solid #cfe3ff
}

.markdown-item.markdown-body table thead th {
    font-weight: 700;
    text-align: left;
    white-space: nowrap
}

.markdown-item.markdown-body table tbody tr:nth-child(2n) {
    background: #f0f7ff;
    border: 1px solid #cfe3ff
}

.ws-link a {
    display: block
}

.ws-shop-price ins {
    text-decoration: none
}

.ws-shop-price del,.ws-shop-price s {
    color: #bbb
}

.ws-shop-price .new-price {
    color: #ffa54f
}

.ws-shop-price .new-price em {
    font-size: 22px;
    font-family: din;
    font-weight: 700;
    color: #ffa54f;
    line-height: 36px;
    font-style: normal
}

.ws-shop-price .old-price {
    margin-left: 10px;
    font-size: 14px;
    color: #bbb;
    line-height: 19px
}

.ws-web-home-main {
    padding: 30px 0 0
}

.ws-web-home-main-wrap {
    width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between
}

.ws-web-home-main__left {
    width: 320px
}

.ws-web-home-main__left:hover {
    position: relative;
    z-index: 100
}

.ws-web-home-main__right {
    width: 850px
}

.ws-web-usershow {
    width: 850px;
    height: 165px;
    background: #fff;
    box-shadow: 0 0 11px 0 rgba(22,84,155,.09);
    border-radius: 6px;
    padding: 38px 50px;
    box-sizing: border-box;
    display: flex
}

.ws-web-usershow .button__info {
    background: #fff;
    border: 1px solid #bababa
}

.ws-web-usershow__login-btn {
    width: 130px
}

.ws-web-usershow__login-btn .button {
    display: block;
    margin-bottom: 22px
}

.ws-web-usershow__user {
    display: flex;
    align-items: center;
    justify-content: center
}

.ws-web-usershow__user img {
    width: 64px;
    height: 64px
}

.ws-web-usershow__user h5 {
    font-size: 16px;
    margin-bottom: 5px
}

.ws-web-usershow__user .authentication-msg--warn {
    color: #ff4f36
}

.ws-web-usershow__user .authentication-msg--warn a {
    color: #2b66ff
}

.ws-web-usershow__user .authentication-msg--success {
    color: #27d180
}

.ws-web-usershow__user-info {
    margin-left: 10px
}

.ws-web-usershow__coupon {
    flex: 1;
    background: #f4faff;
    margin: 0 20px;
    display: flex;
    padding: 20px 30px;
    align-items: center;
    justify-content: space-between
}

.ws-web-usershow__wallet {
    white-space: nowrap
}

.ws-web-usershow__wallet p {
    margin: 10px 0;
    font-size: 14px
}

.ws-web-usershow__wallet p a {
    color: #ffa54f;
    font-weight: 700
}

.ws-web-usershow__wallet-button {
    width: 130px
}

.ws-web-usershow__wallet-button .button {
    width: 130px;
    margin: 5px 0
}

.ws-web-usershow__intro {
    flex: 1;
    padding: 6px 60px;
    color: #2b66ff;
    line-height: 26px;
    background: #f4faff;
    margin: 0 40px
}

.ws-web-usershow__scan-qr {
    text-align: center;
    margin-top: -16px;
    margin-bottom: -10px
}

.ws-web-usershow__scan-qr img {
    width: 74px
}

.ws-web-top-product {
    box-shadow: 0 0 11px 0 rgba(22,84,155,.09);
    background: #fff;
    border-radius: 6px
}

.ws-web-top-product__title {
    height: 60px;
    background: linear-gradient(0deg,#94c4ff,#2b66ff);
    border-radius: 6px 6px 0 0
}

.ws-web-top-product__title h3 {
    padding-top: 18px;
    font-size: 18px;
    line-height: 24px;
    color: #fff;
    text-align: center
}

.ws-web-top-product__content {
    position: relative;
    height: 525px
}

.ws-web-top-product__content:hover .ws-web-top-product__list.has-more {
    height: auto;
    position: absolute;
    z-index: 9;
    overflow: visible;
    left: 0;
    top: 0;
    right: 0
}

.ws-web-top-product__content:hover .ws-web-top-product__list.has-more+.ws-web-top-product__more-mask {
    display: none
}

.ws-web-top-product__detail {
    position: absolute;
    top: 0;
    left: 100%;
    overflow-y: auto;
    background: #fff;
    border-radius: 0 6px 6px 0;
    box-shadow: 0 0 11px 0 rgba(22,84,155,.09);
    width: 320px;
    font-size: 14px;
    padding: 30px 20px 10px;
    box-sizing: border-box
}

.ws-web-top-product__detail span {
    display: inline-block;
    width: 120px;
    padding: 0 5px 0 10px;
    margin-bottom: 25px;
    color: #333;
    vertical-align: top
}

.ws-web-top-product__item-wrap {
    position: relative;
    padding: 11px 30px 12px 0
}

.ws-web-top-product__list {
    border-radius: 0 0 6px 6px;
    padding: 0 30px;
    position: relative;
    z-index: 2;
    height: 100%;
    overflow: hidden
}

.ws-web-top-product__list.has-more {
    background-color: #fff
}

.ws-web-top-product__list li {
    border-bottom: 1px solid #e9e9e9;
    position: relative
}

.ws-web-top-product__list li.is-active {
    border-bottom-color: transparent
}

.ws-web-top-product__list li.is-active .svg-icon-contain,.ws-web-top-product__list li.is-active h4 {
    color: #2b66ff
}

.ws-web-top-product__list li.is-active:before {
    content: "";
    display: block;
    position: absolute;
    left: -30px;
    top: -1px;
    bottom: 0;
    right: -30px;
    box-shadow: 0 0 11px 0 rgba(22,84,155,.09);
    background: #fff;
    border-radius: 0 0 6px 6px
}

.ws-web-top-product__list li.is-active:after {
    content: "";
    display: block;
    position: absolute;
    right: -50px;
    width: 50px;
    height: 100%;
    top: 0;
    background: #fff
}

.ws-web-top-product__list li.no-children.is-active:after {
    display: none
}

.ws-web-top-product__list li:last-child {
    border-bottom: none
}

.ws-web-top-product__list .svg-icon-contain {
    position: absolute;
    right: 0;
    top: 50%;
    font-size: 14px;
    color: #bfbfbf;
    margin-top: -7px
}

.ws-web-top-product__list h4 {
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 8px
}

.ws-web-top-product__list p {
    color: #999;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5
}

.ws-web-top-product__more-mask {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 40px;
    background: linear-gradient(hsla(0,0%,100%,0),hsla(0,0%,100%,.6) 30%,#fff);
    z-index: 2;
    border-radius: 6px
}

.web-home-banner {
    width: 100%;
    height: 100px
}

.web-home-banner .ws_wrap {
    position: absolute;
    width: 100%;
    background: #fff;
    overflow: hidden;
    z-index: 1
}

.web-home-banner .ws_wrap h1,.web-home-banner .ws_wrap h2,.web-home-banner .ws_wrap h3,.web-home-banner .ws_wrap h4,.web-home-banner .ws_wrap h5,.web-home-banner .ws_wrap h6,.web-home-banner .ws_wrap p,.web-home-banner .ws_wrap ul {
    margin: 0;
    padding: 0;
    font-weight: 400;
    outline: 0;
    list-style: none
}

.web-home-banner .ws_wrap .ws_box_row {
    width: 100%;
    max-width: 1200px;
    height: 100px;
    margin: 0 auto
}

.web-home-banner .ws_wrap .ws_box_row li.ws_box_colum {
    float: left;
    width: 25%;
    transition: all .3s linear;
    word-break: break-all;
    min-width: 300px
}

.web-home-banner .ws_wrap .ws_box_row li.ws_box_colum a {
    box-sizing: border-box;
    position: relative;
    display: block;
    height: 100px;
    padding: 24px 0 28px 68px;
    border-left: 1px solid;
    border-color: hsla(0,0%,100%,.06);
    transition: all .3s;
    text-decoration: none;
    max-width: 300px;
    margin: 0 auto;
    cursor: pointer
}

.web-home-banner .ws_wrap .ws_box_row li.ws_box_colum a.last {
    border-right: 1px solid;
    border-color: hsla(0,0%,100%,.06)
}

.web-home-banner .ws_wrap .ws_box_row li.ws_box_colum a img {
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 50px
}

.web-home-banner .ws_wrap .ws_box_row li.ws_box_colum a .m_view_img {
    display: none
}

.web-home-banner .ws_wrap .ws_box_row li.ws_box_colum a h2 {
    height: 21px;
    margin-bottom: 4px;
    margin-left: 10px;
    margin-right: 10px;
    color: #fff;
    font-size: 16px;
    color: rgba(0,0,0,.85);
    letter-spacing: 0;
    overflow: hidden;
    font-weight: 500
}

.web-home-banner .ws_wrap .ws_box_row li.ws_box_colum a p {
    margin-left: 10px;
    margin-right: 10px;
    line-height: 19px;
    font-size: 14px;
    color: rgba(0,0,0,.5);
    letter-spacing: 0;
    overflow: hidden
}

.ws-web-service-activity .content {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 51px 0 79px;
    position: relative;
    height: 534px;
    display: flex;
    flex-flow: row nowrap;
    justify-content: center
}

.ws-web-service-activity .content .content-left {
    width: 298px;
    height: 100%
}

.ws-web-service-activity .content .content-left .card-item__img a {
    display: block
}

.ws-web-service-activity .content .content-left .card-item__img a.null-link {
    cursor: auto
}

.ws-web-service-activity .content .content-left .card-item__img a img {
    width: 100%;
    height: 534px
}

.ws-web-service-activity .content .content-right {
    height: 100%;
    width: 900px;
    background-color: #fff
}

.ws-web-service-activity .content .card {
    position: relative;
    height: 100%;
    box-shadow: 0 2px 16px 0 rgba(216,221,225,.7);
    border-right: none
}

.ws-web-service-activity .content .card:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.ws-web-service-activity .content .card-item {
    position: relative;
    float: left;
    box-sizing: border-box;
    padding: 27px 15px 0 30px;
    width: 300px;
    height: 50%;
    border-right: 1px solid rgba(216,221,225,.7);
    border-bottom: 1px solid rgba(216,221,225,.7)
}

.ws-web-service-activity .content .card-item:nth-child(3n) {
    border-right: none
}

.ws-web-service-activity .content .card-item .title {
    margin-bottom: 11px;
    text-align: left;
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    color: #262728;
    text-shadow: 0 2px 16px rgba(216,221,225,.7)
}

.ws-web-service-activity .content .card-item:hover {
    box-shadow: 0 0 15px 0 rgba(0,0,0,.1);
    transition: box-shadow .3s ease-out
}

.ws-web-service-activity .content .card-item .button-group {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    transition: all .3s;
    height: 40px
}

.ws-web-service-activity .content .card-item .button-group .button {
    padding-top: 11px;
    padding-bottom: 10px;
    height: 40px;
    line-height: 19px;
    text-align: center;
    font-size: 14px;
    border: none;
    border-radius: 0;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ws-web-service-activity .content .card-item .button-group .button.ws-link {
    padding: 0
}

.ws-web-service-activity .content .card-item .button-group .button.ws-link a {
    padding-top: 11px;
    padding-bottom: 10px;
    color: #fff
}

.web-home-banner {
    position: relative;
    width: 850px;
    height: 390px;
    overflow: hidden;
    box-shadow: 0 0 11px 0 rgba(22,84,155,.09);
    border-radius: 6px;
    margin-bottom: 30px
}

.web-home-banner ul.product_list {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 11
}

.web-home-banner ul.product_list li.produce_box {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0
}

.web-home-banner ul.product_list li.produce_box.show .text-box {
    height: 200px;
    opacity: 1
}

.web-home-banner ul.product_list li.produce_box.show h2.txt_info {
    -webkit-animation: opacity .6s linear .3s both
}

.web-home-banner ul.product_list li.produce_box.show .product_btn {
    animation: opacity .5s linear .7s both;
    -webkit-animation: opacity .5s linear .7s both
}

.web-home-banner ul.product_list li.produce_box i.bannerBg {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1;
    background-size: cover;
    background-position: 50%
}

.web-home-banner ul.product_list li.produce_box .text-box {
    padding-left: 30px;
    padding-top: 86px;
    position: relative;
    z-index: 9;
    margin: 0 auto
}

.web-home-banner ul.product_list li.produce_box .text-box p {
    text-align: left
}

.web-home-banner ul.product_list li.produce_box .text-box p.txt_info_title {
    margin: 0 0 44px;
    font-size: 30px;
    color: #fff;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
    max-width: 400px;
    font-weight: 400;
    line-height: 45px;
    min-height: 45px
}

.web-home-banner ul.product_list li.produce_box .text-box p.txt_info_des {
    font-weight: 400;
    max-width: 600px;
    letter-spacing: 0;
    font-size: 16px;
    color: #fff;
    line-height: 32px;
    word-break: break-all;
    min-height: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: 46px
}

.web-home-banner ul.product_list li.produce_box .text-box p.btn_area {
    display: inline-block;
    white-space: nowrap
}

.web-home-banner ul.product_list li.produce_box .text-box.is-align-center {
    text-align: center
}

.web-home-banner ul.product_list li.produce_box .text-box.is-align-center .txt_info_title {
    max-width: 1200px;
    min-height: 102px;
    margin: 0 0 8px;
    font-size: 68px;
    font-weight: 400;
    line-height: 102px;
    text-align: center
}

.web-home-banner ul.product_list li.produce_box .text-box.is-align-center .txt_info_des {
    font-size: 20px;
    color: #fff;
    line-height: 30px;
    margin: 0 auto 40px;
    text-align: center
}

.web-home-banner ul.product_list li.produce_box .text-box.is-align-center .btn_area {
    position: relative;
    top: -30px
}

.web-home-banner ul.product_list li.produce_box .text-box .product_btn {
    display: inline-block;
    text-align: center;
    transition: all .3s;
    border-radius: 25px;
    margin-right: 10px;
    margin-left: 10px;
    overflow: hidden;
    font-weight: 500;
    padding: 12px 37px;
    font-size: 16px;
    color: #fff;
    line-height: 24px
}

.web-home-banner ul.product_list li.produce_box .text-box .product_btn.deep {
    color: #fff;
    background: linear-gradient(0,#ff9201,#ff4f02)
}

.web-home-banner ul.product_list li.produce_box .text-box .product_btn.deep:hover {
    background: linear-gradient(0,#ffb826,#ff7133)
}

.web-home-banner ul.product_list li.produce_box .text-box .product_btn.deep:active {
    background: linear-gradient(0,#e87600,#eb4700)
}

.web-home-banner ul.product_list li.produce_box .text-box .product_btn.light {
    border: 1px solid #fff;
    background: transparent;
    color: #fff
}

.web-home-banner ul.product_list li.produce_box .text-box .product_btn.light:hover {
    color: #ffa54f;
    border: 1px solid #ffa54f
}

.web-home-banner ul.product_list li.produce_box .text-box .product_btn.light:active {
    color: #ff4f02;
    border: 1px solid #ff4f02
}

.web-home-banner ul.product_list li.produce_box .text-box .product_btn.white {
    background-color: #fff;
    color: #ffa54f
}

.web-home-banner ul.product_list li.produce_box .text-box .product_btn.white:hover {
    color: #fff;
    background: linear-gradient(0,#ffb826,#ff7133)
}

.web-home-banner ul.product_list li.produce_box .text-box .product_btn.white:active {
    background: linear-gradient(0,#e87600,#eb4700)
}

.web-home-banner ul.product_list li.produce_box .text-box .product_btn:first-child {
    margin-left: 0
}

.web-home-banner ul.product_list li.produce_box .text-box .product_btn:last-child {
    margin-right: 0
}

.web-home-banner .web-home-banner__indicator {
    position: absolute;
    width: 100%;
    height: 3px;
    left: 50%;
    bottom: 20px;
    z-index: 19;
    transform: translate(-50%)
}

.web-home-banner .web-home-banner__indicator .btns_content .btns_area {
    position: relative;
    float: left;
    margin-left: 50%;
    transform: translate(-50%);
    -webkit-transform: translate(-50%)
}

.web-home-banner .web-home-banner__indicator .btns_content .btns_area:after {
    content: "";
    clear: both
}

.web-home-banner .web-home-banner__indicator .btns_content .btns_area a {
    float: left;
    width: 36px;
    height: 25px;
    margin: 0 10px
}

.web-home-banner .web-home-banner__indicator .btns_content .btns_area a i {
    display: block;
    width: 100%;
    height: 3px;
    background: hsla(0,0%,100%,.3);
    border-radius: 2px
}

.web-home-banner .web-home-banner__indicator .btns_content .btns_area .btns_active_line {
    position: absolute;
    width: 36px;
    height: 2px;
    left: 10px;
    top: 0;
    border-radius: 2px;
    background: #f2f2f2;
    transition: left .3s;
    -webkit-transition: left .3s;
    cursor: pointer
}

.home-section__title {
    text-align: center;
    margin-bottom: 35px
}

.home-section__title h2 {
    font-size: 40px;
    line-height: 60px;
    font-weight: 500
}

.home-section__title p {
    margin-top: 10px;
    font-size: 18px;
    color: #636e80;
    line-height: 24px
}

.home-section__title.theme-light h2,.home-section__title.theme-light p {
    color: #fff
}

.ws-node {
    text-align: center;
    background: linear-gradient(90deg,#326adb,#326adb 33%,#2161c9 66%,#2161c9);
    position: relative;
    height: auto;
    overflow: hidden;
    min-width: 1200px
}

.ws-node.home-section {
    padding: 0
}

.ws-node .ws-node-video {
    height: 100%;
    width: 100%;
    pointer-events: none;
    position: absolute
}

.ws-node .ws-node-video video {
    height: 100%
}

.ws-node .ws-node-content {
    width: 1200px;
    padding: 40px 0;
    margin: 0 auto;
    position: relative
}

.ws-node .ws-node-title {
    margin-bottom: 90px
}

.ws-node .ws-node-title h2 {
    font-weight: 500;
    margin: 20px 0;
    font-size: 48px;
    color: #fff;
    line-height: 60px;
    letter-spacing: 3px
}

.ws-node .ws-node-title p {
    margin-top: 10px;
    font-size: 20px;
    color: #fff;
    letter-spacing: 0
}

.ws-node .ws_serve_head_mini {
    display: none
}

.ws-node .ws-node-list-wrap {
    text-align: left
}

.ws-node ul.ws-node-list {
    padding: 50px;
    display: inline-grid;
    grid-template-columns: repeat(3,1fr);
    grid-gap: 40px;
    background-color: rgba(45,117,255,.6);
    border-radius: 20px
}

.ws-node ul.ws-node-list li {
    text-align: left
}

.ws-node ul.ws-node-list li h3 {
    font-family: babasNeue;
    margin: 0;
    font-weight: 400;
    font-size: 40px;
    color: #3dffef;
    line-height: 1.5em
}

.ws-node ul.ws-node-list li h3 span {
    font-family: Oswald;
    font-size: 30px
}

.ws-node ul.ws-node-list li p {
    letter-spacing: 0;
    margin: 0;
    text-align: left;
    font-size: 18px;
    color: #fff;
    line-height: 24px
}

@-webkit-keyframes ripple {
    0% {
        opacity: 0;
        transform: scale(.1)
    }

    5% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: scale(1)
    }
}

.ws-web-home-video {
    position: relative;
    overflow: hidden;
    padding-top: 40px;
    padding-bottom: 40px
}

.ws-web-home-video .title {
    display: inline-block;
    height: 38px;
    background: #e8ecee;
    border-radius: 28px;
    text-align: center;
    padding: 4px;
    margin-bottom: 42px
}

.ws-web-home-video .title span {
    display: inline-block;
    height: 38px;
    line-height: 38px;
    border-radius: 23px;
    font-size: 15px;
    padding: 0 20px;
    cursor: pointer
}

.ws-web-home-video .title span.is-acitve {
    background: linear-gradient(270deg,#ffa707,#ff7b2c);
    color: #fff
}

.ws-web-home-video .content {
    max-width: 1200px;
    margin: 0 auto;
    text-align: center
}

.ws-web-home-video .ws-web-home-video__item {
    height: 450px
}

.ws-web-home-video .ws-web-home-video__item span {
    display: block;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%
}

.ws-web-home-video .ws-web-home-video__item iframe {
    width: 100%;
    height: 100%;
    border: 0
}

.ws-web-home-client {
    position: relative;
    overflow: hidden;
    background-size: cover;
    background-color: #252f42;
    background-repeat: no-repeat
}

.ws-web-home-client .content {
    width: 100%;
    max-width: 1200px;
    height: 660px;
    margin: 0 auto
}

.ws-web-home-client .content .title {
    margin: 48px 0 35px;
    font-size: 32px;
    text-align: center;
    line-height: 42px;
    color: #fff
}

.ws-web-home-client .content .tab-pane {
    text-align: center
}

.ws-web-home-client .content .tab-pane .tab-pane-item {
    overflow: hidden;
    width: 120px;
    padding: 8px 5px;
    height: 40px;
    line-height: 21px;
    font-size: 16px;
    border-radius: 3px;
    border: 1px solid hsla(0,0%,100%,.6)
}

.ws-web-home-client .content .tab-pane .tab-pane-item:not(.is-active):hover {
    background-color: transparent;
    color: #2b66ff;
    border-color: #2b66ff
}

.ws-web-home-client .content .tab-pane .tab-pane-item.is-active {
    border-color: #2b66ff
}

.ws-web-home-client .content .tab-content {
    display: flex;
    flex-flow: column wrap;
    height: 385px
}

.ws-web-home-client .content .tab-content .tab-content-item {
    padding-top: 30px;
    width: 304px;
    height: 188px;
    background-size: cover;
    background-color: #0b101a;
    background-repeat: no-repeat;
    box-sizing: border-box;
    text-align: center
}

.ws-web-home-client .content .tab-content .tab-content-item .logo-wrap {
    width: 260px;
    height: 70px;
    line-height: 70px;
    margin: 0 auto 20px;
    text-align: center
}

.ws-web-home-client .content .tab-content .tab-content-item .logo-wrap .logo {
    vertical-align: bottom;
    max-width: 260px;
    max-height: 70px
}

.ws-web-home-client .content .tab-content .tab-content-item .desc {
    margin-bottom: 30px;
    line-height: 19px;
    font-size: 14px;
    color: #fff
}

.ws-web-home-client .content .tab-content .tab-content-item .related {
    text-align: left;
    line-height: 26px
}

.ws-web-home-client .content .tab-content .tab-content-item .related-title {
    display: inline-block;
    font-size: 12px;
    line-height: 16px;
    color: #fff;
    margin-left: 17px;
    margin-right: 10px
}

.ws-web-home-client .content .tab-content .tab-content-item .related-list {
    display: inline-block
}

.ws-web-home-client .content .tab-content .tab-content-item .related-list-item {
    width: 102px;
    padding: 4px 0 3px;
    white-space: nowrap;
    margin-right: 6px;
    height: 26px;
    line-height: 16px;
    border-radius: 2px;
    font-size: 12px;
    border: 1px solid hsla(0,0%,100%,.8)
}

.ws-web-home-client .content .tab-content .tab-content-item .related-list-item:hover {
    background-color: transparent;
    color: #2b66ff;
    border-color: #2b66ff
}

.ws-web-home-client .content .tab-content .tab-content-item:nth-child(3) {
    padding-top: 50px;
    width: 576px;
    height: 385px;
    margin: 0 8px
}

.ws-web-home-client .content .tab-content .tab-content-item:nth-child(3) .logo-wrap {
    width: 424px;
    height: 100px;
    line-height: 100px
}

.ws-web-home-client .content .tab-content .tab-content-item:nth-child(3) .logo {
    max-width: 424px;
    max-height: 100px
}

.ws-web-home-client .content .tab-content .tab-content-item:nth-child(3) .related {
    text-align: center
}

.ws-web-home-client .content .tab-content .tab-content-item:nth-child(3) .related-title {
    display: block;
    margin: 0 0 20px;
    font-size: 16px
}

.ws-web-home-client .content .tab-content .tab-content-item:nth-child(3) .related-title:after {
    content: ""
}

.ws-web-home-client .content .tab-content .tab-content-item:nth-child(3) .related-list .button {
    margin-right: 32px;
    border-radius: 2px;
    height: 36px;
    line-height: 19px;
    padding: 8px 5px;
    width: 120px;
    font-size: 14px
}

.ws-web-home-client .content .tab-content .tab-content-item:nth-child(3) .related-list .button:last-child {
    margin-right: 0
}

.ws-web-home-client .content .tab-content .tab-content-item:first-child,.ws-web-home-client .content .tab-content .tab-content-item:nth-child(4) {
    margin-bottom: 8px
}

.ws-web-home-client .content .tab-content .tab-content-item.center {
    padding-top: 0;
    display: flex;
    flex-flow: column nowrap;
    justify-content: center
}

.ws-web-home-client .content .tab-content .tab-content-item.center .logo-wrap {
    height: auto;
    line-height: normal;
    margin-bottom: 0
}

.ws-web-home-client .content .tab-content .tab-content-item.center .logo-wrap .logo {
    max-height: 188px
}

.ws-web-home-client .content .tab-content .tab-content-item.center:nth-child(3) .logo-wrap {
    margin-bottom: 20px
}

.ws-web-home-client .content .tab-content .tab-content-item.center:nth-child(3) .logo-wrap .logo {
    max-height: 345px
}

.ws-web-home-client .content .tab-content .tab-content-item.center .desc {
    margin-bottom: 0
}

.ws-web-home-news {
    box-sizing: border-box;
    padding-top: 49px;
    padding-bottom: 70px;
    max-height: 620px;
    background: #fff;
    background: url(http://www.haoio.cn/nuxt-static/img/home-news-bg.afcee52.png) no-repeat;
    background-size: cover
}

.ws-web-home-news .title {
    height: 52px;
    margin-bottom: 44px;
    text-align: center;
    font-size: 30px;
    color: #fff;
    line-height: 60px;
    letter-spacing: 2px
}

.ws-web-home-news .content {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    text-align: center
}

.ws-web-home-news .content .news-content .news-item {
    display: inline-block;
    width: 368px;
    margin-right: 48px;
    text-align: left;
    vertical-align: top;
    cursor: pointer
}

.ws-web-home-news .content .news-content .news-item:last-child {
    margin-right: 0
}

.ws-web-home-news .content .news-content .news-item img {
    display: block;
    width: 368px;
    height: 208px
}

.ws-web-home-news .content .news-content .news-item .news-item-container {
    padding: 16px 0
}

.ws-web-home-news .content .news-content .news-item .news-item-container .news-item-title {
    margin: 0 0 4px;
    line-height: 24px;
    font-size: 16px;
    color: #fff
}

.ws-web-home-news .content .news-content .news-item .news-item-container .news-item-title:hover {
    color: #2b66ff
}

.ws-web-home-news .content .news-content .news-item .news-item-container .news-item-desc {
    margin: 0 0 16px;
    color: hsla(0,0%,100%,.5);
    line-height: 21px;
    font-size: 14px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-all
}

.ws-web-home-news .content .news-content .news-item .news-item-container .news-item-time {
    margin-top: 16px;
    color: hsla(0,0%,100%,.5);
    line-height: 21px;
    font-size: 14px
}

.ws-web-home-news .btn-container {
    margin-top: 50px;
    padding: 0;
    font-size: 18px;
    color: #fff;
    line-height: 24px;
    text-align: center
}

.ws-web-home-news .btn-container a {
    color: #fff
}

.ws-web-service-product .content {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding-top: 48px;
    padding-bottom: 70px
}

.ws-web-service-product .content .pane:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.ws-web-service-product .content .pane .pane-item {
    position: relative;
    float: left;
    margin-top: 12px;
    margin-right: 12px;
    padding: 24px 39px 0 21px;
    width: 291px;
    height: 160px;
    background: #fff;
    box-shadow: 0 2px 10px 0 hsla(0,0%,70.6%,.5);
    border-radius: 2px;
    box-sizing: border-box
}

.ws-web-service-product .content .pane .pane-item:nth-child(4n) {
    margin-right: 0
}

.ws-web-service-product .content .pane .pane-item .title {
    margin-bottom: 16px;
    text-align: left;
    font-size: 18px;
    line-height: 24px;
    color: #000
}

.ws-web-service-product .content .pane .pane-item .desc {
    font-size: 14px;
    line-height: 19px;
    color: rgba(0,0,0,.65)
}

.ws-web-service-product .content .pane .pane-item button {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 45px;
    font-size: 16px;
    line-height: 21px;
    border: none;
    color: #fff;
    background-color: #2b66ff;
    opacity: 0;
    cursor: pointer;
    transition: all .3s;
    outline: none
}

.ws-web-service-product .content .pane .pane-item:hover {
    box-shadow: 0 0 15px 0 rgba(0,0,0,.1);
    transition: box-shadow .3s ease-out
}

.ws-web-service-product .content .pane .pane-item:hover button {
    opacity: 1
}

.ws-web-register {
    position: relative;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat
}

.ws-web-register .content {
    position: relative;
    padding-left: 50px;
    max-width: 1200px;
    margin: 0 auto;
    height: 180px;
    display: flex;
    flex-flow: column;
    justify-content: center;
    overflow: hidden;
    box-sizing: border-box
}

.ws-web-register .title {
    margin-bottom: 16px;
    font-size: 36px;
    color: #fff;
    line-height: 47px
}

.ws-web-register .sub-title {
    width: 624px;
    font-size: 24px;
    color: #fff;
    line-height: 31px
}

.ws-web-register .text {
    display: inline-block;
    width: 100%
}

.ws-web-register .button {
    position: absolute;
    top: 50%;
    right: 17px;
    margin-top: -30px;
    padding: 14px 55px;
    font-size: 24px;
    line-height: 31px;
    box-sizing: border-box;
    color: #fff;
    border: 1px solid #fff;
    background: transparent;
    font-weight: lighter
}

.ws-web-register .button:hover {
    background: #fff;
    color: #2b66ff
}

.ws-web-home-safe {
    padding-top: 50px;
    background-color: #f7fafe
}

.ws-web-home-safe .ws-web-home-safe_container {
    max-width: 1200px;
    margin: 0 auto;
    overflow: hidden
}

.ws-web-home-safe .ws-web-home-safe_container ul.performance {
    max-width: 1200px;
    margin: 36px auto 64px;
    width: 100%;
    text-align: center
}

.ws-web-home-safe .ws-web-home-safe_container ul.performance li {
    display: inline-block;
    width: 33%
}

.ws-web-home-safe .ws-web-home-safe_container ul.performance li .performance_node {
    width: auto;
    height: 102px
}

.ws-web-home-safe .ws-web-home-safe_container ul.performance li .performance_node h3 {
    font-family: babasNeue;
    margin: 0;
    font-weight: 400;
    font-size: 60px;
    line-height: 40px;
    color: #595959
}

.ws-web-home-safe .ws-web-home-safe_container ul.performance li .performance_node h3 small {
    font-size: 32px
}

.ws-web-home-safe .ws-web-home-safe_container ul.performance li .performance_node .description {
    line-height: 19px;
    font-size: 14px;
    color: rgba(0,0,0,.65);
    letter-spacing: 0;
    margin: 0;
    height: 40px
}

.ws-web-home-safe .ws-web-home-safe_container ul.performance li .performance_node .description span {
    display: flex;
    max-width: 215px;
    margin: 0 auto;
    justify-content: center
}

.ws-web-home-safe .ws-web-home-safe_container ul.performance li .performance_node .seperate {
    margin-bottom: 10px
}

.ws-web-home-safe .ws-web-home-safe_container ul.performance li .performance_node .seperate span {
    width: 60px;
    border-top: 2px solid #2a49c3;
    display: inline-block
}

.ws-web-home-safe .ws-web-home-safe_container h1 {
    font-size: 40px;
    color: rgba(0,0,0,.85);
    line-height: 60px;
    letter-spacing: 3px;
    margin-bottom: 30px;
    font-weight: 400;
    text-align: center;
    margin-top: 10px
}

.ws-web-home-safe .ws-web-home-safe_container .authentication {
    width: 100%;
    max-width: 1200px;
    display: inline-block;
    margin: 0 auto;
    border-top: 1px solid rgba(0,0,0,.1);
    padding-top: 10px
}

.ws-web-home-safe .ws-web-home-safe_container .authentication div.btn-more {
    text-align: center;
    margin: 30px 0 70px;
    width: 100%;
    display: inline-block
}

.ws-web-home-safe .ws-web-home-safe_container .authentication div.btn-more a {
    width: 80px;
    height: 30px;
    font-size: 18px;
    color: rgba(0,0,0,.65);
    line-height: 30px;
    cursor: pointer
}

.ws-web-home-safe .ws-web-home-safe_container .authentication li.authentication_colum {
    float: left;
    width: 25%;
    transition: all .3s linear;
    word-break: break-all;
    min-width: 300px;
    margin-top: 6px
}

.ws-web-home-safe .ws-web-home-safe_container .authentication li.authentication_colum a {
    box-sizing: border-box;
    position: relative;
    display: block;
    height: 100px;
    padding: 24px 0 28px 68px;
    border-left: 1px solid;
    border-color: hsla(0,0%,100%,.06);
    transition: all .3s;
    text-decoration: none;
    max-width: 300px;
    margin: 0 auto
}

.ws-web-home-safe .ws-web-home-safe_container .authentication li.authentication_colum a.last {
    border-right: 1px solid;
    border-color: hsla(0,0%,100%,.06)
}

.ws-web-home-safe .ws-web-home-safe_container .authentication li.authentication_colum a img {
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    height: 70px
}

.ws-web-home-safe .ws-web-home-safe_container .authentication li.authentication_colum a .m_view_img {
    display: none
}

.ws-web-home-safe .ws-web-home-safe_container .authentication li.authentication_colum a h2 {
    height: 21px;
    margin-bottom: 4px;
    margin-left: 10px;
    margin-right: 10px;
    font-size: 16px;
    color: rgba(0,0,0,.85);
    letter-spacing: 0;
    overflow: hidden;
    font-weight: 500
}

.ws-web-home-safe .ws-web-home-safe_container .authentication li.authentication_colum a p {
    margin: 10px 20px 0 25px;
    line-height: 24px;
    font-size: 16px;
    color: rgba(0,0,0,.5);
    letter-spacing: 0;
    overflow: hidden
}

.ws-web-service {
    margin-top: 27px
}

.ws-web-service>.title {
    text-align: center;
    font-size: 32px;
    color: #000;
    line-height: 44px
}

.ws-web-service>.tab {
    margin-top: 34px;
    height: 40px;
    text-align: center;
    border-bottom: 1px solid #d6d6d6
}

.ws-web-service>.tab .center {
    display: inline-block
}

.ws-web-service .content-bg {
    position: relative;
    z-index: 100;
    background-image: url(http://www.haoio.cn/nuxt-static/img/service-bg.848686d.png);
    background-size: cover;
    background-repeat: no-repeat
}

.ws-web-service .content-bg .content {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto
}

.help_contents {
    padding-bottom: 119px;
    overflow: hidden
}

.help_contents .help_wrap {
    max-width: 1200px;
    margin: 0 auto;
    font-size: 0
}

.help_contents .help_wrap .help_item {
    box-sizing: border-box;
    padding: 0 40px;
    vertical-align: top
}

.help_contents .help_wrap .help_item:first-child h4 {
    padding-top: 50px
}

.help_contents .help_wrap .help_item h4 {
    padding: 34px 0 12px;
    position: relative;
    font-size: 20px;
    line-height: 26px;
    color: #000
}

.help_contents .help_wrap .help_item h4:after {
    content: "";
    height: 1px;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    box-sizing: border-box;
    background: #d8d8d8
}

.help_contents .help_wrap .help_item ul.help_detail {
    padding: 18px 0 0;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start
}

.help_contents .help_wrap .help_item ul.help_detail li {
    margin-right: 130px;
    margin-bottom: 16px;
    width: 120px
}

.help_contents .help_wrap .help_item ul.help_detail li:nth-child(5n) {
    margin-right: 0
}

.help_contents .help_wrap .help_item ul.help_detail li a {
    font-size: 14px;
    line-height: 30px;
    color: rgba(0,0,0,.65);
    text-decoration: none;
    transition: all .3s linear
}

.help_contents .help_wrap .help_item ul.help_detail li a:hover {
    color: #2b66ff
}

.help_search_input {
    box-sizing: border-box;
    position: relative;
    margin: 0 auto;
    max-width: 776px
}

.help_search_input h3 {
    font-size: 32px;
    color: hsla(0,0%,100%,.95);
    letter-spacing: 0;
    text-align: center;
    font-weight: 500;
    line-height: 1.3em;
    margin: 0 0 24px
}

.help_search_input .search_wrap {
    display: flex;
    padding-bottom: 20px;
    overflow: hidden
}

.help_search_input .search_wrap input {
    flex-grow: 1;
    height: 50px;
    line-height: 19px;
    padding: 5px 15px 5px 35px;
    color: rgba(0,0,0,.75);
    font-size: 14px;
    letter-spacing: 0;
    background: #fff;
    border: none;
    box-sizing: border-box;
    border-radius: 24px 0 0 24px
}

.help_search_input .search_wrap input::-webkit-input-placeholder {
    color: rgba(0,0,0,.3)
}

.help_search_input .search_wrap input:-moz-placeholder,.help_search_input .search_wrap input::-moz-placeholder {
    color: rgba(0,0,0,.3)
}

.help_search_input .search_wrap input:-ms-input-placeholder {
    color: rgba(0,0,0,.3)
}

.help_search_input .search_wrap .search_btn {
    width: 110px;
    padding: 13px 0;
    text-decoration: none;
    line-height: 24px;
    font-size: 18px;
    color: #fff;
    text-align: center;
    cursor: pointer;
    border-radius: 0 24px 24px 0
}

.help_search_input .search_recommend a {
    display: inline-block;
    margin-right: 10px;
    line-height: 22px;
    text-decoration: none;
    transition: all .3s linear;
    font-size: 14px;
    color: hsla(0,0%,100%,.85);
    letter-spacing: 0
}

.help_search_input .search_recommend a:hover {
    color: #2b66ff
}

.help_header .help_search_input {
    padding-top: 60px
}

h1,h2,h3,h4,h5,h6,p,ul {
    margin: 0;
    padding: 0;
    font-weight: 400;
    outline: 0;
    list-style: none
}

.help_Search .search_tabs {
    height: 59px;
    border-bottom: 1px solid #e8e8e8;
    font-size: 0
}

.help_Search .search_tabs .search_tabs_btn {
    max-width: 1000px;
    margin: 0 auto;
    justify-content: space-between
}

.help_Search .search_tabs .search_tabs_btn a {
    display: inline-block;
    padding: 0 20px;
    height: 58px;
    line-height: 60px;
    text-align: center;
    -moz-text-align-last: center;
    text-align-last: center;
    cursor: pointer;
    border-bottom: 4px solid transparent;
    text-decoration: none;
    transition: border .3s;
    font-size: 16px;
    color: rgba(0,0,0,.65);
    letter-spacing: 0
}

.help_Search .search_tabs .search_tabs_btn a.active {
    border-bottom: 3px solid #1394ff
}

.help_Search .search_container {
    height: 100%;
    margin-top: 41px
}

.help_Search .search_container .search_contents {
    max-width: 1000px;
    margin: 0 auto
}

.help_Search .search_container .search_contents p.search_tip {
    line-height: 18px;
    padding: 20px 0;
    font-size: 12px;
    color: #666
}

.help_Search .search_container .search_contents p.search_tip span {
    color: #1394ff
}

.help_Search .search_container .search_contents ul.search_results li {
    margin-bottom: 40px
}

.help_Search .search_container .search_contents ul.search_results li h2 {
    line-height: 20px;
    font-size: 16px;
    font-weight: 700;
    color: #1394ff
}

.help_Search .search_container .search_contents ul.search_results li h2 a {
    text-decoration: none;
    font-size: 18px;
    color: rgba(0,0,0,.95);
    letter-spacing: 0;
    text-align: justify;
    font-weight: 500
}

.help_Search .search_container .search_contents ul.search_results li h2 a em {
    color: #ff4f36
}

.help_Search .search_container .search_contents ul.search_results li p.from {
    line-height: 17px;
    margin: 6px 0;
    font-size: 14px;
    color: rgba(0,0,0,.5);
    letter-spacing: 0;
    text-align: justify
}

.help_Search .search_container .search_contents ul.search_results li p.from a {
    cursor: pointer
}

.help_Search .search_container .search_contents ul.search_results li p.from a:hover {
    color: #666;
    text-decoration: none
}

.help_Search .search_container .search_contents ul.search_results li p.from span {
    margin: 0 5px
}

.help_Search .search_container .search_contents ul.search_results li p.des {
    margin: 16px 0;
    font-size: 14px;
    color: rgba(0,0,0,.65);
    letter-spacing: 0;
    text-align: justify;
    line-height: 19px
}

.help_Search .search_container .search_contents ul.search_results li p.des a {
    color: rgba(0,0,0,.65)
}

.help_Search .search_container .search_contents ul.search_results li p.des a em {
    color: #ff4f36
}

.help_Search .search_container .search_contents ul.search_results li p.des a:hover {
    color: #666;
    text-decoration: none
}

.help_Search .search_container .search_contents ul.search_results li p.source {
    font-size: 14px;
    color: rgba(0,0,0,.5);
    letter-spacing: 0;
    text-align: justify
}

.help_Search .search_container .search_contents ul.search_results li p.source span a,.help_Search .search_container .search_contents ul.search_results li p.source span span {
    color: rgba(0,0,0,.5)
}

.help_Search .search_container .ws-pagination {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 0 20px
}

@media screen and (max-width: 768px) {
    .help_Search .search_tabs .search_tabs_btn {
        overflow-x:scroll;
        display: flex
    }

    .help_Search .search_tabs .search_tabs_btn a {
        width: 25%;
        min-width: 90px
    }

    .help_Search .search_tabs .search_tabs_btn a:nth-child(3) {
        min-width: 115px
    }

    .help_Search .search_tabs .search_tabs_btn::-webkit-scrollbar {
        width: 0
    }

    .help_Search .search_tabs .search_tabs_btn::-o-scrollbar {
        width: 0
    }

    .help_Search .search_tabs .search_tabs_btn::-moz-scrollbar {
        width: 0
    }

    .help_Search .search_container {
        margin-top: 30px
    }

    .help_Search .search_container .search_contents {
        padding: 0 30px
    }

    .help_Search .search_container .search_contents ul.search_results li p.des a {
        word-break: break-all
    }
}

.help_container {
    position: relative;
    max-width: 1200px;
    margin: 0 auto 60px;
    padding-top: 20px;
    display: flex
}

.help_container:after {
    content: "";
    display: block;
    clear: both
}

.help_container .scrollBar::-webkit-scrollbar {
    width: 8px;
    height: 4px;
    background-color: transparent
}

.help_container .scrollBar::-webkit-scrollbar-track {
    border-radius: 5px;
    background-color: transparent
}

.help_container .scrollBar::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background-color: #a6a9af
}

.help_container .help_menus {
    width: 200px;
    position: relative;
    padding-top: 42px
}

.help_container .help_menus.is-fixed {
    position: fixed;
    top: 0;
    left: auto;
    z-index: 1
}

.help_container .help_menus.is-fixed+.help_doc {
    margin-left: 226px
}

.help_container .help_menus a {
    color: #262626
}

.help_container .help_menus a:hover {
    color: #2b66ff
}

.help_container .help_menus .help-menus__back {
    height: 40px;
    line-height: 40px;
    padding: 0 16px
}

.help_container .help_menus .help-menus__title {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 42px;
    line-height: 42px;
    padding: 0 20px;
    font-size: 16px;
    background-color: #2b66ff;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.help_container .help_menus .help-menus__title a {
    position: absolute;
    right: 16px;
    transition: all .3s linear;
    color: #fff
}

.help_container .help_menus .help-menus__directory {
    border-left: 1px solid #e0e2e5;
    border-right: 1px solid #e0e2e5;
    border-bottom: 1px solid #e0e2e5;
    margin-bottom: -1px;
    height: auto;
    overflow-y: auto;
    background-color: #f5f8fa
}

.help_container .help_menus .help-menus__directory .ctree-tree-node__drop {
    display: none
}

.help_container .help_menus .help-menus__directory .ctree-tree-search__action-wrapper {
    padding: 0 2px
}

.help_container .help_menus .help-menus__directory .ctree-tree__scroll-area {
    overflow-x: hidden;
    display: block
}

.help_container .help_menus .help-menus__directory .ctree-tree__scroll-area::-webkit-scrollbar {
    width: 4px;
    background-color: #f7f7f7
}

.help_container .help_menus .help-menus__directory .ctree-tree__scroll-area::-webkit-scrollbar-thumb {
    border-radius: 2.5px;
    background: #d7d8d9;
    width: 4px
}

.help_container .help_menus .help-menus__directory .ctree-tree-node__square {
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -10px
}

.help_container .help_menus .help-menus__directory .ctree-tree-node__title {
    padding: 0;
    height: auto;
    margin: 0
}

.help_container .help_menus .help-menus__directory .is-childnode,.help_container .help_menus .help-menus__directory .is-topnode {
    display: block;
    line-height: 1.5;
    word-break: break-all;
    white-space: normal
}

.help_container .help_menus .help-menus__directory .is-topnode {
    padding: 11px 19px 12px 20px;
    border-bottom: 1px solid #eee
}

.help_container .help_menus .help-menus__directory .is-childnode {
    padding: 12px 19px 11px 30px;
    background-color: #fff;
    color: rgba(0,0,.65)
}

.help_container .help_menus .help-menus__directory .is-childnode:hover {
    color: #2b66ff
}

.help_container .help_menus .help-menus__directory .disabled,.help_container .help_menus .help-menus__directory .disabled:hover {
    cursor: default;
    color: #ccc
}

.help_container .help_menus .help-menus__directory .is-active {
    background-color: #cfe3ff
}

.help_container .help_menus .help-menus__directory .is-active:before {
    content: "";
    position: absolute;
    height: 100%;
    width: 2px;
    left: 0;
    top: 0;
    background: #2b66ff
}

.help_container .help_menus .help-menus__directory .ctree-tree-node__expand:after {
    width: 5px;
    height: 5px;
    border: 1px solid #777;
    border-top: none;
    border-left: none;
    transform: rotate(45deg);
    top: 50%;
    left: 50%;
    margin-top: -3px;
    margin-left: -3px
}

.help_container .help_menus .help-menus__directory .ctree-tree-node__expand_active {
    transform: rotate(180deg)
}

.help_container .help_menus .help-menus__directory .ctree-tree-node__node-body {
    position: relative;
    display: block\0;
    -ms-flex: none
}

.help_container .help_menus.fixed {
    position: fixed;
    top: 0;
    z-index: 11;
    min-height: auto
}

.help_container .help_doc {
    flex: 1;
    position: relative;
    width: 934px;
    margin-left: 26px;
    z-index: inherit;
    background-color: #fff;
    border-radius: 6px;
    padding: 20px
}

.help_container .help_doc .help_doc_path {
    font-size: 14px
}

.help_container .help_doc .help_doc_path i {
    margin: 0 4px;
    font-size: 12px;
    vertical-align: middle
}

.help_container .help_doc .help_doc_path a {
    color: #2b66ff;
    text-decoration: none;
    vertical-align: middle
}

.help_container .help_doc .help_doc_path a:hover {
    color: #548aff
}

.help_container .help_doc .skipArticle {
    padding-top: 8px;
    border-top: 1px solid #c2cad8;
    overflow: hidden;
    margin-top: 60px
}

.help_container .help_doc .skipArticle a {
    line-height: 20px;
    font-size: 14px;
    text-decoration: none;
    color: #595959
}

.help_container .help_doc .skipArticle a:hover {
    color: #2b66ff
}

.help_container .help_doc .skipArticle a.previous {
    float: left
}

.help_container .help_doc .skipArticle a.next {
    float: right
}

.help_container .help_menu_contents {
    position: absolute;
    display: none;
    width: 0;
    opacity: 0;
    top: 0;
    left: 201px;
    z-index: 1
}

.help_container .help_menu_contents.show {
    opacity: 1;
    background: #fff;
    box-shadow: 0 2px 14px 0 rgba(173,190,204,.35)
}

.help_container .help_menu_contents.fixed,.help_container .help_menu_contents.fixed-view {
    position: fixed;
    top: 0;
    overflow-x: hidden;
    height: calc(100% - 30px);
    z-index: 11
}

.help_container .help_menu_contents.fixed-view {
    margin-left: 232px
}

.help_container .help_menu_contents .contents_list_container {
    border: 1px solid #e7ebf3;
    background-color: #fff;
    max-height: 476px;
    overflow: auto;
    white-space: nowrap;
    padding: 10px 16px 5px
}

.help_container .help_menu_contents .contents_list_container .document-menus__column {
    display: inline-block;
    width: 174px;
    vertical-align: top;
    padding: 10px
}

.help_container .help_menu_contents .contents_list_container .document-menus__column h3 {
    line-height: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #d9d9d9;
    font-weight: 500;
    text-align: left;
    font-size: 16px;
    color: rgba(0,0,0,.95);
    letter-spacing: 0
}

.help_container .help_menu_contents .contents_list_container .document-menus__column-detail {
    margin-bottom: 16px
}

.help_container .help_menu_contents .contents_list_container::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.help_container .help_menu_contents .contents_list_container::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: #dfe8f6
}

.help_container .help_menu_contents .contents_list_container__search {
    padding-left: 10px;
    margin-bottom: 8px;
    display: flex
}

.help_container .help_menu_contents .contents_list_container__search input {
    display: block;
    border: 0;
    padding: 0 0 0 5px
}

.help_container .help_menu_contents .contents_list_container__info {
    padding-left: 10px;
    color: #999
}

.help_container .help_menu_contents .contents_list_container ul {
    overflow: hidden;
    font-size: 0;
    padding-top: 10px
}

.help_container .help_menu_contents .contents_list_container ul li {
    vertical-align: top;
    margin: 5px 0
}

.help_container .help_menu_contents .contents_list_container ul li a.contents_item {
    display: block;
    line-height: 20px;
    text-decoration: none;
    font-size: 14px;
    transition: all .3s linear;
    color: rgba(0,0,0,.65);
    letter-spacing: 0;
    text-align: justify;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.help_container .help_menu_contents .contents_list_container ul li a.contents_item:hover {
    color: #2b66ff
}

.help_container .api-center__menu-search {
    background: #fff;
    border: 1px solid #eee;
    padding: 4px 8px;
    display: flex
}

.help_container .api-center__menu-search input {
    display: block;
    border: 0;
    padding: 0 0 0 5px;
    width: 100%
}

.document-detail {
    padding-top: 24px
}

.document-cate-detail-header__bg {
    height: 60px;
    background: url(http://www.haoio.cn/nuxt-static/img/document-headbg.4c3c37c.png) no-repeat #4b5058;
    background-position: auto 100%
}

.document-detail__header {
    padding-bottom: 16px
}

.api-panel__head .title,.document-detail__title {
    font-size: 24px;
    color: #262626;
    margin: 0;
    line-height: 1.3125em;
    font-weight: 400;
    word-break: break-all
}

.document-detail__update {
    margin-top: 8px;
    color: #999;
    font-size: 12px
}

.document-detail__markdown .markdown-body img {
    cursor: zoom-in
}

.document-detail__markdown code.hljs {
    display: inline
}

.document-detail-wrap {
    padding-right: 154px;
    position: relative
}

.document-detail-wrap .document-catemenu {
    position: absolute;
    top: -22px;
    width: 160px;
    right: 0
}

.document-detail-wrap .document-catemenu h3 {
    margin: 0;
    line-height: 40px;
    padding-left: 8px;
    color: #595959;
    font-weight: 400
}

.document-detail-wrap .document-catemenu__list {
    margin-left: 8px;
    border-left: 1px solid rgba(0,0,0,.1);
    padding-left: 8px
}

.document-detail-wrap .document-catemenu__list li {
    line-height: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    cursor: pointer
}

.document-detail-wrap .document-catemenu__list li.is-active,.document-detail-wrap .document-catemenu__list li:hover {
    color: #2b66ff
}

.api-panel__body .api-sub__title {
    color: #262626;
    line-height: 1.3125em;
    font-weight: 400;
    margin: 16px 0
}

.help_header {
    height: 260px;
    background: url(http://www.haoio.cn/nuxt-static/img/document-searchbg.718bd06.png) no-repeat 0;
    background-size: cover;
    overflow: hidden
}

.help_header.is-result {
    height: 192px
}

.product_banner {
    display: flex;
    height: 464px;
    background-color: #172030;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover
}

.product_banner .product_banner_main {
    position: relative;
    width: 100%;
    max-width: 1200px;
    height: 100%;
    margin: 0 auto
}

.product_banner .product_banner_main .product_banner_content {
    float: left;
    width: 684px;
    height: 100%
}

.product_banner .product_banner_main .product_banner_content h2.banner_title {
    margin: 80px 0 24px;
    color: #fff;
    height: 47px;
    font-size: 36px;
    line-height: 47px
}

.product_banner .product_banner_main .product_banner_content p.banner_des {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    /*! autoprefixer: ignore next */
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    font-size: 16px;
    color: #fff;
    line-height: 30px
}

.product_banner .product_banner_main .product_banner_content .detail {
    position: absolute;
    bottom: 110px
}

.product_banner .product_banner_main .product_banner_content .detail .ws-link {
    display: inline-block
}

.product_banner .product_banner_main .product_banner_content .detail a {
    position: relative;
    display: inline-block;
    text-decoration: none;
    width: 130px;
    height: 42px;
    line-height: 42px;
    margin-right: 12px;
    font-size: 16px;
    text-align: center;
    transition: all .1s linear;
    box-sizing: border-box;
    vertical-align: top
}

.product_banner .product_banner_main .product_banner_content .detail .button_links_0,.product_banner .product_banner_main .product_banner_content .detail .ws-link.button_links_0 a {
    color: #fff;
    background: linear-gradient(0,#ff9201,#ff4f02);
    border-radius: 24px
}

.product_banner .product_banner_main .product_banner_content .detail .button_links_0:active,.product_banner .product_banner_main .product_banner_content .detail .button_links_0:hover,.product_banner .product_banner_main .product_banner_content .detail .ws-link.button_links_0 a:active,.product_banner .product_banner_main .product_banner_content .detail .ws-link.button_links_0 a:hover {
    background: linear-gradient(0,#ffb826,#ff7133)
}

.product_banner .product_banner_main .product_banner_content .detail .button_links_1,.product_banner .product_banner_main .product_banner_content .detail .ws-link.button_links_1 a {
    border: 1px solid #fff;
    color: #fff;
    border-radius: 24px
}

.product_banner .product_banner_main .product_banner_content .detail .button_links_1:hover,.product_banner .product_banner_main .product_banner_content .detail .ws-link.button_links_1 a:hover {
    background-color: #ff6e01;
    border: 1px solid #ff6e01;
    color: #fff
}

.product_banner .product_banner_main .product_banner_content .detail .button_links_2,.product_banner .product_banner_main .product_banner_content .detail .ws-link.button_links_2 a {
    color: #fff
}

.product_banner .product_banner_main .product_banner_content .detail .button_links_2:hover,.product_banner .product_banner_main .product_banner_content .detail .ws-link.button_links_2 a:hover {
    color: #ff6e01
}

.product_banner .product_banner_main .product_banner_content .detail .button_links_3 {
    width: auto;
    color: #ff6e01
}

.product_banner .product_banner_main .product_banner_content .detail .button_links_3:hover:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0;
    bottom: 6px;
    background-color: #ff6e01
}

.product_banner .product_banner_main .product_banner_pic {
    position: relative;
    float: right;
    margin-top: 20px;
    width: 600px;
    height: 406px;
    overflow: hidden
}

.product_banner .product_banner_main .product_banner_pic img {
    position: absolute;
    right: 0
}

.solution-advantage {
    background-color: #fff
}

.solution-advantage h2.solution-advantage__title {
    padding-top: 60px;
    text-align: center;
    font-size: 32px;
    font-weight: 500;
    color: #fff;
    line-height: 48px;
    margin-bottom: -150px
}

.solution-advantage .solution-advantage__content {
    max-width: 100%;
    margin: 42px auto 0;
    font-size: 14px;
    background: #fff;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    border-radius: 2px;
    position: relative;
    bottom: -150px;
    display: flex;
    width: 100;
    align-items: stretch;
    flex-wrap: wrap
}

.solution-advantage .solution-advantage__content .solution-advantage__content-item {
    display: table-cell;
    min-height: 300px;
    vertical-align: top;
    border-right: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
    padding-bottom: 30px
}

.solution-advantage .solution-advantage__content .solution-advantage__content-item .solution-advantage__content-item-icon-block {
    width: 100%;
    margin-top: 58px;
    height: 50px;
    text-align: center
}

.solution-advantage .solution-advantage__content .solution-advantage__content-item .solution-advantage__content-item-icon-block .solution-advantage__content-item-icon {
    display: inline-block;
    width: 50px;
    height: 50px
}

.solution-advantage .solution-advantage__content .solution-advantage__content-item .solution-advantage__content-item-icon-block img {
    width: 50px;
    height: 50px
}

.solution-advantage .solution-advantage__content .solution-advantage__content-item .solution-advantage__content-item-title {
    overflow: hidden;
    text-align: center;
    padding: 0 40px;
    margin-top: 36px;
    height: 24px;
    word-break: break-all;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 20px;
    color: rgba(0,0,0,.85);
    line-height: 24px
}

.solution-advantage .solution-advantage__content .solution-advantage__content-item .solution-advantage__content-item-description {
    margin-top: 18px;
    font-size: 14px;
    line-height: 21px;
    color: rgba(0,0,0,.5);
    padding: 0 40px;
    word-break: break-all;
    overflow: hidden
}

.solution-advantage .solution-advantage__content .solution-advantage__content-item-small {
    width: 299px
}

.solution-advantage .solution-advantage__content .solution-advantage__content-item-middle {
    width: 291.5px
}

.solution-advantage .solution-advantage__content .solution-advantage__hidden-mr {
    margin-right: 0
}

.solution-advantage .center {
    text-align: center
}

.solution-advantage-bg {
    background-color: #192754;
    background-image: url(http://www.haoio.cn/nuxt-static/img/solution-advantage-union.2f6f2f3.png);
    background-repeat: no-repeat;
    background-position: 0 0
}

.solution-arch {
    padding: 60px 0 42px;
    overflow: hidden;
    background: #f7fafe
}

.solution-arch h2.solution-arch__title {
    padding: 0 0 20px;
    font-weight: 500;
    text-align: center;
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 42px;
    margin-bottom: 60px
}

.solution-arch .solution-arch__container .solution-arch__content {
    max-width: 1210px;
    margin: 0 auto;
    border-top: 1px solid rgba(19,148,255,.12);
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    font-size: 0;
    border-radius: 10px;
    background-color: #fff;
    padding: 40px;
    box-sizing: border-box
}

.solution-arch .solution-arch__container .solution-arch__content .solution-arch__block {
    display: block;
    width: 720px;
    height: 100%;
    float: left;
    margin-right: 40px;
    display: flex;
    align-items: center
}

.solution-arch .solution-arch__container .solution-arch__content .solution-arch__block .solution-arch__image {
    display: block;
    width: 720px
}

.solution-arch .solution-arch__container .solution-arch__content .solution-arch__text {
    width: 100%;
    display: block;
    float: left;
}

.solution-arch .solution-arch__container .solution-arch__content .solution-arch__text .solution-arch__markdown-item-title {
    font-size: 20px;
    color: rgba(0,0,0,.85);
    line-height: 40px;
    height: 40px;
    margin-bottom: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.solution-arch .solution-arch__container .solution-arch__content .solution-arch__text .solution-arch__markdown-item-description {
    margin-bottom: 32px
}

.scene-tabs {
    margin: 0 auto;
    max-width: 1200px
}

.scene-tabs ul.tabs_item {
    margin-top: 40px
}

.scene-tabs ul.tabs_item.is-small li {
    width: 150px
}

.scene-tabs ul.tabs_item li {
    display: inline-block;
    width: 220px;
    padding-bottom: 10px;
    vertical-align: top;
    cursor: pointer;
    transition: color .3s linear;
    font-size: 16px;
    color: rgba(0,0,0,.65);
    line-height: 24px;
    max-width: 200px;
    height: 86px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.scene-tabs ul.tabs_item li:first-child {
    margin-left: 0
}

.scene-tabs ul.tabs_item li:last-child {
    margin-right: 0
}

.scene-tabs ul.tabs_item li.active {
    color: #2b66ff
}

.scene-tabs ul.tabs_item li.active .item_pic {
    display: none!important
}

.scene-tabs ul.tabs_item li.active .item_pic_hover {
    display: block!important
}

.scene-tabs ul.tabs_item li.active span.border_bottom {
    border-bottom: 4px solid #2b66ff
}

.scene-tabs ul.tabs_item li:hover {
    color: #2b66ff
}

.scene-tabs ul.tabs_item li:hover .item_pic {
    display: none!important
}

.scene-tabs ul.tabs_item li:hover .item_pic_hover {
    display: block!important
}

.scene-tabs ul.tabs_item li .item_pic {
    display: block;
    margin: 4px auto
}

.scene-tabs ul.tabs_item li .item_pic_hover {
    display: none;
    margin: 4px auto
}

.scene-tabs ul.tabs_item li .border_bottom {
    position: relative;
    top: 10px;
    margin: 0 auto;
    width: 40px;
    display: block
}

.scene-tabs .text_center {
    text-align: center
}

.scene-tabs .scenarios_container .scenarios_content {
    display: none;
    max-width: 1200px;
    margin: 0 auto;
    border-top: 1px solid rgba(19,148,255,.12);
    font-size: 0;
    border-radius: 10px;
    background-color: #fff
}

.scene-tabs .scenarios_container .scenarios_content.active {
    display: block;
    border-radius: 10px
}

.background-white {
    background-color: #fff
}

.background-gray {
    background-color: #f7fafe
}

.solution-usage {
    padding: 60px 0 42px;
    overflow: hidden
}

.solution-usage h2.solution-usage__title {
    padding: 0 0 20px;
    font-weight: 500;
    text-align: center;
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 42px;
    margin-bottom: 60px
}

.solution-usage .solution-usage__container .solution-usage__content {
    max-width: 1200px;
    margin: 0 auto;
    font-size: 0;
    padding: 40px 0;
    box-sizing: border-box;
    border-radius: 6px
}

.solution-usage .solution-usage__container .solution-usage__content .solution-usage__image {
    display: block;
    width: 720px;
    height: 460px;
    float: left;
    margin-right: 40px
}

.solution-usage .solution-usage__container .solution-usage__content .solution-usage__text {
    width: 360px;
    height: 460px;
    display: block;
    float: left
}

.ws-web-product_function h2.ws-web-product_function_title {
    padding-top: 30px;
    text-align: center;
    font-weight: 500;
    font-size: 32px;
    color: #262626;
    line-height: 48px
}

.ws-web-product_function .ws-web-product_function_content {
    max-width: 100%;
    margin: 42px auto 0;
    font-size: 0;
    position: relative;
    display: flex;
    width: 100%;
    align-items: stretch;
    flex-wrap: wrap;
    justify-content: space-around
}

.ws-web-product_function .ws-web-product_function_content .ws-web-product_function_item {
    padding: 36px 30px;
    min-height: 292px;
    vertical-align: top;
    width: 330px;
    margin-bottom: 30px;
    border-radius: 6px;
    background: #fff;
    text-align: center
}

.ws-web-product_function .ws-web-product_function_content .ws-web-product_function_item span {
    display: inline-block;
    width: 80px;
    height: 80px;
    vertical-align: bottom;
    margin-bottom: 20px
}

.ws-web-product_function .ws-web-product_function_content .ws-web-product_function_item span img.item_pic {
    display: block;
    margin: 8px auto
}

.ws-web-product_function .ws-web-product_function_content .ws-web-product_function_item h3.item_title {
    text-align: center;
    word-break: break-all;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 400;
    white-space: nowrap;
    width: 100%;
    margin: 0 auto;
    font-size: 20px;
    color: rgba(0,0,0,.85);
    line-height: 24px
}

.ws-web-product_function .ws-web-product_function_content .ws-web-product_function_item p.item_des {
    width: 100%;
    margin: 0 auto;
    text-align: left;
    font-size: 14px;
    color: rgba(0,0,0,.5);
    line-height: 21px;
    word-break: break-all;
    height: 63px;
    overflow: hidden
}

.ws-web-product_function .ws-web-product_function_content .ws-web-product_function_item .product-function__markdown-item-description {
    text-align: left;
    margin-top: 16px;
    overflow: hidden
}

.sliders {
    position: relative
}

.sliders .sliders__body {
    position: relative;
    max-width: 1200px;
    margin: 0 auto
}

.sliders .sliders__body .sliders__banner {
    max-width: 1200px;
    padding: 0 4px 4px;
    box-sizing: border-box;
    display: block;
    position: relative;
    overflow: hidden;
    font-family: MicrosoftYaHei
}

.sliders .sliders__body .sliders__banner ul.sliders__list {
    list-style: none;
    overflow: hidden;
}

.sliders .sliders__body .sliders__banner li.sliders__item {
    float: left;
    width: 368px;
    height: 369px;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    border-radius: 6px;
    margin-right: 44px;
    margin-bottom:30px;
}

.sliders .sliders__body .sliders__banner li.sliders__item .sliders__image {
    width: 368px;
    height: 208px;
    display: block;
    border-radius: 6px 6px 0 0
}

.sliders .sliders__body .sliders__banner li.sliders__item .sliders__text-area {
    padding: 24px 32px 32px;
    background-color: #fff
}

.sliders .sliders__body .sliders__banner li.sliders__item .sliders__text-area .sliders__title {
    width: 304px;
    height: 30px;
    text-align: center;
    font-size: 20px;
    color: rgba(0,0,0,.85);
    line-height: 30px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.sliders .sliders__body .sliders__banner li.sliders__item .sliders__text-area .sliders__description {
    width: 304px;
    height: 63px;
    font-size: 14px;
    color: rgba(0,0,0,.5);
    overflow: hidden;
    line-height: 21px;
    margin-top: 12px;
    word-break: break-all
}

.sliders .sliders__body .sliders__button {
    width: 40px;
    height: 100px;
    position: absolute;
    cursor: pointer;
    min-height: 0;
    background-color: rgba(0,0,0,.1)
}

.sliders .sliders__body .sliders__button .sliders__arrows {
    width: 16px;
    height: 16px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    position: relative
}

.sliders .sliders__body .sliders__button .sliders__arrow-left {
    transform: rotate(-135deg);
    top: 40px;
    left: 16px
}

.sliders .sliders__body .sliders__button .sliders__arrow-right {
    transform: rotate(45deg);
    top: 40px;
    left: 8px
}

.sliders .sliders__body .sliders__button-dark {
    background: rgba(0,0,0,.5)
}

.sliders .sliders__body .sliders__button-dark:hover {
    background: #2b66ff
}

.sliders .sliders__body .sliders__button-light {
    background: rgba(0,0,0,.1)
}

.sliders .sliders__body .sliders__left {
    top: 135px;
    left: -60px
}

.sliders .sliders__body .sliders__right {
    top: 135px;
    right: -60px
}

.scroll-bar {
    position: relative;
    width: 76px
}

.scroll-bar .scroll-bar__body {
    position: relative;
    max-width: 76px;
    padding: 34px 0 0
}

.scroll-bar .scroll-bar__body .scroll-bar__banner {
    max-width: 76px;
    box-sizing: border-box;
    display: block;
    height: 400px;
    position: relative;
    overflow: hidden;
    background-color: #fff;
    font-family: MicrosoftYaHei
}

.scroll-bar .scroll-bar__body .scroll-bar__banner ul.scroll-bar__list {
    list-style: none;
    height: 1000px;
    width: 76px;
    position: absolute;
    top: 32px
}

.scroll-bar .scroll-bar__body .scroll-bar__banner li.scroll-bar__item {
    width: 76px;
    height: 40px;
    padding: 8px 8px 0 16px;
    box-sizing: border-box;
    font-size: 14px;
    font-family: MicrosoftYaHei;
    color: rgba(0,0,0,.5);
    line-height: 21px;
    border-left: 1px solid rgba(0,0,0,.1)
}

.scroll-bar .scroll-bar__body .scroll-bar__banner li.scroll-bar__item .scroll-bar__item-text {
    cursor: pointer
}

.scroll-bar .scroll-bar__body .scroll-bar__banner li.scroll-bar__item .scroll-bar__item-text.active {
    color: #2a49c3
}

.scroll-bar .scroll-bar__body .scroll-bar__button {
    width: 24px;
    height: 24px;
    position: absolute;
    cursor: pointer;
    min-height: 0;
    box-sizing: border-box;
    border: 1px solid #ccc;
    background-color: rgba(0,0,0,.1)
}

.scroll-bar .scroll-bar__body .scroll-bar__button .scroll-bar__arrows {
    width: 6px;
    height: 6px;
    border-top: 2px solid #111;
    border-right: 2px solid #111;
    position: relative
}

.scroll-bar .scroll-bar__body .scroll-bar__button .scroll-bar__arrow-top {
    transform: rotate(-45deg);
    top: 8px;
    left: 7px
}

.scroll-bar .scroll-bar__body .scroll-bar__button .scroll-bar__arrow-bottom {
    transform: rotate(135deg);
    top: 5px;
    left: 7px
}

.scroll-bar .scroll-bar__body .scroll-bar__button-light {
    background: #fff
}

.scroll-bar .scroll-bar__body .scroll-bar__button-dark {
    background: rgba(0,0,0,.1)
}

.scroll-bar .scroll-bar__body .scroll-bar__button-dark .scroll-bar__arrows {
    border-top: 2px solid #ccc;
    border-right: 2px solid #ccc
}

.scroll-bar .scroll-bar__body .scroll-bar__top {
    top: 0;
    left: 25px
}

.scroll-bar .scroll-bar__body .scroll-bar__bottom {
    top: 445px;
    left: 25px
}

.event-line ul li {
    position: relative;
    padding: 12px 0 8px 16px;
    line-height: 18px;
    border-left: 1px solid #d9d9d9;
    color: #999;
    font-family: MicrosoftYaHei
}

.event-line ul li .event-line__title {
    color: rgba(0,0,0,.85);
    line-height: 30px;
    margin-bottom: 16px;
    font-size: 20px
}

.event-line ul li .event-line__description {
    line-height: 21px;
    margin-bottom: 24px;
    font-size: 14px
}

.event-line ul li .event-line__description .event-line__description-date {
    float: left;
    margin-right: 32px;
    color: rgba(0,0,0,.5)
}

.event-line ul li .event-line__description .event-line__description-detail {
    color: rgba(0,0,0,.85);
    overflow: hidden;
    word-break: break-all
}

.event-line ul li .node-icon {
    position: absolute;
    left: -9px;
    top: 19px;
    width: 18px;
    height: 18px;
    background-image: url(http://www.haoio.cn/nuxt-static/img/blue-icon.d1c1e12.png)
}

.info-collect {
    position: relative;
    overflow: hidden;
    background-color: #82a0ef;
    height: 598px
}

.info-collect .bg-img {
    position: absolute;
    width: 1920px;
    height: 598px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1
}

.info-collect input::-webkit-input-placeholder {
    color: #fff
}

.info-collect input:-moz-placeholder,.info-collect input::-moz-placeholder {
    color: #fff
}

.info-collect input:-ms-input-placeholder {
    color: #fff
}

.info-collect .info-collect-wrapper {
    position: absolute;
    width: 100%;
    z-index: 1
}

.info-collect .info-collect-main {
    display: flex;
    align-items: center;
    width: 1200px;
    box-sizing: border-box;
    padding: 83px 145px;
    margin: 0 auto
}

.info-collect .info-collect-main .info-collect-form {
    width: 370px;
    text-align: center
}

.info-collect .info-collect-main .info-collect-form .info-collect-form_title {
    font-size: 32px;
    font-weight: 400;
    line-height: 45px;
    color: #fff;
    margin-bottom: 8px
}

.info-collect .info-collect-main .info-collect-form .info-collect-form_desc {
    margin-bottom: 24px;
    font-size: 14px;
    color: #fff;
    line-height: 20px
}

.info-collect .info-collect-main .info-collect-form .form-control {
    margin-bottom: 18px
}

.info-collect .info-collect-main .info-collect-form .form-control input {
    border: 1px solid #fff;
    width: 274px;
    padding: 12px;
    background: transparent;
    color: #fff
}

.info-collect .info-collect-main .info-collect-form .form-control.verify-code-input img {
    vertical-align: top
}

.info-collect .info-collect-main .info-collect-form .form-control.verify-code-input input {
    vertical-align: top;
    display: inline-block;
    margin-right: 10px;
    width: 180px
}

.info-collect .submit-button {
    outline: none;
    width: 300px;
    height: 40px;
    text-align: center;
    color: #fff;
    background-color: #2b66ff;
    border: 1px solid #2b66ff;
    cursor: pointer
}

.info-collect .submit-button:hover {
    background-color: #548aff;
    border-color: #548aff
}

.info-collect .conf-button {
    margin-top: 10px;
    white-space: nowrap;
    overflow: hidden;
    padding: 0 15px;
    text-overflow: ellipsis;
    outline: none;
    width: 300px;
    height: 40px;
    text-align: center;
    color: #fff;
    background: linear-gradient(90deg,#e78f1b,#db9108);
    box-shadow: 0 4px 16px 0 rgba(4,27,124,.15);
    border: none;
    cursor: pointer;
    font-size: 16px
}

.quick-start {
    background: url(http://www.haoio.cn/nuxt-static/img/quick-start-bg.aefb690.png) no-repeat;
    background-size: cover;
    padding-top: 47px;
    box-sizing: border-box
}

.quick-start-content {
    max-width: 1200px;
    margin: 0 auto;
    height: 374px
}

.quick-start-content>.title {
    margin-bottom: 16px;
    text-align: center;
    font-size: 32px;
    line-height: 42px;
    color: #000
}

.quick-start-content .card {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    border-right: none
}

.quick-start-content .card-item-wrap {
    position: relative;
    width: 220px;
    height: 218px;
    line-height: 198px;
    margin: 0 14px;
    padding-bottom: 20px;
    box-sizing: border-box
}

.quick-start-content .card-item-wrap:first-child {
    margin-left: 0
}

.quick-start-content .card-item-wrap:last-child {
    margin-right: 0
}

.quick-start-content .card-item-wrap:before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50px;
    transform: translateX(-50%);
    width: 80px;
    height: 30px;
    background: #fff;
    border-radius: 10px;
    z-index: 15
}

.quick-start-content .card-item-wrap .card-item-circle {
    position: absolute;
    left: 50%;
    top: 20px;
    transform: translateX(-50%);
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 12px 0 rgba(219,223,225,.7);
    z-index: 1
}

.quick-start-content .card-item-wrap .card-item-order {
    position: absolute;
    width: 100%;
    top: 31px;
    line-height: 42px;
    text-align: center;
    font-size: 36px;
    font-family: DINAlternate-Bold,DINAlternate;
    font-weight: 700;
    color: #2b66ff;
    z-index: 20
}

.quick-start-content .card-item-wrap .card-item-bg {
    position: relative;
    display: inline-block;
    vertical-align: bottom;
    text-align: center;
    padding: 0 17px;
    width: 220px;
    height: 138px;
    background: #fff;
    box-shadow: 0 2px 12px 0 rgba(219,223,225,.7);
    box-sizing: border-box;
    z-index: 2
}

.quick-start-content .card-item-wrap .card-item-bg .card-item-title {
    margin-top: 24px;
    margin-bottom: 8px;
    font-size: 18px;
    color: #000;
    line-height: 24px
}

.quick-start-content .card-item-wrap .card-item-bg .card-item-desc {
    font-size: 14px;
    color: rgba(0,0,0,.65);
    line-height: 22px;
    text-align: left
}

.quick-start-content .card-item-wrap .card-item-bg:hover,.quick-start-content .card-item-wrap .card-item-bg:hover .card-item-circle {
    box-shadow: 0 0 10px 0 rgba(0,0,0,.1);
    transition: box-shadow .3s ease-out;
    border-top-color: #2b66ff
}

.quick-start-content .card-item-wrap .card-item-bg:hover .card-item-title {
    color: #2b66ff
}

.quick-start-content .card-item-wrap .card-item-arrow {
    position: absolute;
    right: -23px;
    top: 122px;
    width: 17px;
    height: 12px
}

.quick-start-content .card-item-wrap .card-item-rocket {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: -1;
    max-width: 94px;
    max-height: 94px
}

.recommend-buy {
    padding-top: 50px;
    box-sizing: border-box
}

.recommend-buy-content {
    max-width: 1200px;
    margin: 0 auto;
    height: 466px
}

.recommend-buy-content .title {
    margin-bottom: 36px;
    text-align: center;
    font-size: 30px;
    line-height: 40px;
    color: #000
}

.recommend-buy-content .card {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    border-right: none
}

.recommend-buy-content .card-item {
    position: relative;
    width: 294px;
    height: 350px;
    padding: 36px 16px 0 26px;
    margin-right: 8px;
    background: #fff;
    box-shadow: 0 2px 10px 0 rgba(43,102,255,.11);
    box-sizing: border-box;
    border-top: 2px solid transparent;
    border-radius: 6px
}

.recommend-buy-content .card-item:last-child {
    margin-right: 0
}

.recommend-buy-content .card-item:hover {
    box-shadow: 0 0 15px 0 rgba(0,0,0,.1);
    transition: box-shadow .3s ease-out
}

.recommend-buy-content .card-item .button-group {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60px;
    transition: all .3s;
    display: flex;
    flex-flow: row nowrap
}

.recommend-buy-content .card-item .button-group .button {
    flex: 1 1 0%;
    padding-top: 20px;
    height: 60px;
    line-height: 20px;
    text-align: center;
    font-size: 20px;
    border: none;
    border-radius: 0 0 6px 6px;
    background: url(http://www.haoio.cn/nuxt-static/img/recommend-buy-bg.3a76f1f.png) no-repeat;
    background-size: cover
}

.recommend-buy-content .card-item .button-group .button:hover {
    background-image: url(http://www.haoio.cn/nuxt-static/img/recommend-buy-hover-bg.b5f3a6a.png)
}

.recommend-buy-content .card-item .button-group .ws-link.button {
    padding: 0
}

.recommend-buy-content .card-item .button-group .ws-link.button a {
    padding-top: 11px;
    padding-bottom: 10px;
    color: #fff
}

.section_content {
    padding-top: 50px;
    background-color: #fff;
    background: url(http://www.haoio.cn/nuxt-static/img/product-customer-case.41e8a23.png) no-repeat;
    background-size: cover
}

.section_content .section_container {
    max-width: 1250px;
    margin: 0 auto;
    overflow: hidden
}

.section_content .section_container h2 {
    margin-bottom: 36px;
    font-size: 32px;
    color: #262626;
    text-align: center;
    line-height: 48px
}

.section_content .section_container.customer_case h2 {
    color: #fff
}

.section_content .customer_case .customer_case_content ul {
    margin-bottom: 71px;
    text-align: center;
    font-size: 0
}

.section_content .customer_case .customer_case_content ul li {
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    width: 200px;
    height: 90px;
    margin: 0 25px;
    background-color: #fff
}

.section_content .customer_case .customer_case_content ul li img {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    max-width: 100%;
    max-height: 100%
}

.ws-web-document-help {
    padding-top: 50px;
    padding-bottom: 70px;
    background-color: #fff;
    box-sizing: border-box
}

.ws-web-document-help-title {
    text-align: center;
    font-size: 30px;
    color: #000;
    line-height: 40px
}

.ws-web-document-help-menu {
    margin-top: 46px
}

.ws-web-document-help-menu .help-list {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center
}

.ws-web-document-help-menu .help-list-item {
    margin-left: 134px;
    padding-right: 187px;
    border-right: 1px solid rgba(216,221,225,.7)
}

.ws-web-document-help-menu .help-list-item:first-child {
    margin-left: 0
}

.ws-web-document-help-menu .help-list-item:last-child {
    padding-right: 0;
    border-right: none
}

.ws-web-document-help-menu .help-list-item h3 {
    font-size: 20px;
    color: #262728;
    line-height: 26px
}

.ws-web-document-help-menu .help-list-item-sublist {
    margin-top: 16px;
    list-style: none
}

.ws-web-document-help-menu .help-list-item-sublist li {
    position: relative;
    margin-bottom: 8px;
    padding-left: 12px;
    font-size: 14px;
    line-height: 21px
}

.ws-web-document-help-menu .help-list-item-sublist li a {
    color: rgba(0,0,0,.8)
}

.ws-web-document-help-menu .help-list-item-sublist li a:hover {
    color: #2b66ff
}

.ws-web-document-help-menu .help-list-item-sublist li:last-child {
    margin-bottom: 0
}

.ws-web-document-help-menu .help-list-item-sublist li:before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background-color: rgba(0,0,0,.3)
}

.ws-web-product_advantage {
    min-height: 540px;
    padding-bottom: 50px;
    box-sizing: border-box;
    background: #f5faff
}

.ws-web-product_advantage h2.ws-web-product_advantage_title {
    padding-top: 50px;
    text-align: center;
    font-size: 32px;
    color: #262626;
    line-height: 48px;
    font-weight: 500
}

.ws-web-product_advantage .ws-web-product_advantage_desc {
    margin: 16px auto;
    text-align: center;
    font-size: 14px;
    max-width: 1200px;
    color: #262626;
    white-space: pre-line
}

.ws-web-product_advantage .ws-web-product_advantage_content {
    max-width: 1200px;
    margin: 36px auto 0;
    font-size: 0
}

.ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item {
    display: inline-block;
    width: calc(50% - 6px);
    padding: 20px 16px;
    margin-bottom: 12px;
    vertical-align: top;
    box-sizing: border-box
}

.ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item:nth-child(odd) {
    margin-right: 6px
}

.ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item:nth-child(2n) {
    margin-left: 6px
}

.ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item .advantage_img {
    padding: 25px;
    display: inline-block;
    vertical-align: top;
    background-repeat: no-repeat;
    background-size: contain
}

.ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item .advantage_img img {
    margin-bottom: -11px
}

.ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item .advantage_content {
    width: calc(100% - 124px);
    height: 100%;
    display: inline-flex;
    flex-flow: column nowrap;
    justify-content: center;
    text-align: left;
    padding-left: 20px
}

.ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item .advantage_content h3.item_title {
    margin-top: 4px;
    font-size: 22px;
    color: rgba(0,0,0,.85);
    line-height: 30px
}

.ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item .advantage_content p.item_des {
    margin-top: 9px;
    font-size: 14px;
    color: rgba(0,0,0,.65);
    line-height: 21px;
    word-break: break-all;
    overflow: hidden
}

.ws-web-product_function {
    background-size: cover
}

.ws-web-product_function h2.product_function_title {
    padding: 60px 0 42px;
    font-weight: 400;
    text-align: center;
    font-size: 32px;
    line-height: 48px;
    color: hsla(0,0%,100%,.85)
}

.ws-web-product_function .product_function_content {
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: 70px
}

.ws-web-product_function .product_function_content ul.product_function_list {
    border-radius: 6px;
    box-shadow: 0 0 15px rgba(0,104,228,.1);
    border-top: none
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area.active .product_function_item {
    border: 1px solid #548aff;
    border-radius: 6px
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area.active .product_function_item .arrow {
    transform: rotate(180deg);
    color: #2b66ff
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area.active .item_detail {
    display: block;
    transition: max-height .1s
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area.active .item_pic {
    display: none!important
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area.active .item_pic_hover {
    display: inline-block!important
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area:not(.active):hover .product_function_item {
    border-color: #2b66ff
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .item_pic {
    display: inline-block
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .item_pic_hover {
    display: none
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .product_function_item {
    position: relative;
    padding: 26px 34px;
    cursor: pointer;
    background-color: #fff;
    border-radius: 6px;
    border: 1px solid #fff
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .product_function_item .arrow {
    font-size: 16px;
    float: right;
    margin-right: 5px;
    line-height: 40px;
    color: #bfbfbf;
    transition: transform .3s
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .product_function_item .product_function_item_content {
    display: inline-block;
    width: calc(100% - 75px)
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .product_function_item .product_function_item_content h3.item_title {
    margin-bottom: 4px;
    margin-left: 16px;
    font-size: 16px;
    font-weight: 700;
    color: rgba(0,0,0,.85);
    line-height: 24px
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .product_function_item .product_function_item_content p.item_des {
    color: #666;
    margin-left: 16px;
    font-size: 14px;
    color: rgba(0,0,0,.5);
    line-height: 21px
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .product_function_item .product_function_item_content i {
    position: absolute;
    top: 50%;
    right: 40px;
    margin-top: -13px;
    font-size: 24px;
    color: #595959;
    transition: transform .5s
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .item_detail {
    height: 100%;
    display: block;
    padding: 25px 20px 25px 95px;
    overflow: hidden;
    background-color: #c2deff
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .item_detail ul.product_function_list {
    padding: 16px 0 16px 20px;
    background-color: #f6fafe
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .item_detail ul.product_function_list>li {
    width: calc(100% - 84px);
    line-height: 20px;
    margin-bottom: 20px;
    color: #666;
    font-size: 14px
}

.ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .item_detail ul.product_function_list>li:before {
    content: "• ";
    color: #bbb
}

.ws-web-product_function-deep h2.product_function_title {
    color: #262626
}

.ws-web-product_function-light {
    background: #fff;
    background-size: cover
}

.ws-web-product_function-light h2.product_function_title {
    color: rgba(0,0,0,.85)
}

.usage_item_container {
    max-width: 1200px;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    border-radius: 6px
}

.usage_item_container .application_img {
    position: relative;
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding: 36px 26px;
    vertical-align: top;
    -webkit-animation: fadeInUp 1.4s both;
    animation: fadeInUp 1.4s both;
    justify-content: center;
    align-self: center;
    align-items: center;
    border-right: 1px solid #d9d9d9
}

.usage_item_container .application_img:after {
    content: "";
    position: absolute;
    width: 0;
    height: 100%;
    top: 0;
    right: 0;
    background-color: #e4f3ff;
    z-index: 1
}

.usage_item_container .application_img.fill {
    width: 100%
}

.usage_item_container .application_img.fill:after {
    width: 0
}

.usage_item_container .application_img img {
    max-width: 745px;
    cursor: pointer
}

.usage_item_container .usage_item {
    -webkit-animation: fadeInUp 1.4s both;
    animation: fadeInUp 1.4s both;
    display: block;
    box-sizing: border-box;
    width: 100%;
    vertical-align: top
}

.usage_item_container .usage_item:before {
    content: "";
    position: absolute;
    width: 0;
    height: 100%;
    top: 0;
    left: -1px;
    background-color: #e4f3ff;
    z-index: 1
}

.usage_item_container .usage_item.fill {
    width: auto;
    margin: 30px 45px
}

.usage_item_container .usage_item.fill:before {
    width: 0
}

.usage_item_container .usage_item.nothing {
    width: 0;
    overflow: hidden
}

.usage_item_container .usage_item.nothing:before {
    width: 0
}

.usage_item_container .usage_item .item_content {
    padding: 42px 26px 42px 26px;
}

.usage_item_container .usage_item .item_content .item_detail {
    padding-bottom: 32px
}

.usage_item_container .usage_item .item_content .item_detail h3.item_title {
    font-weight: 500;
    font-size: 20px;
    color: rgba(0,0,0,.85);
    line-height: 30px
}

.usage_item_container .usage_item .item_content .item_detail .item_info p.item_des {
    line-height: 21px;
    padding-top: 10px;
    font-size: 14px;
    color: #666
}

.usage_item_container .usage_item .item_content .item_detail .item_info ul.item_disc_list {
    margin-top: 15px
}

.usage_item_container .usage_item .item_content .item_detail .item_info ul.item_disc_list li {
    padding-left: 5px;
    line-height: 25px;
    background: none;
    font-size: 14px;
    color: #666
}

.usage_item_container .usage_item .item_content .item_detail .item_info ul.item_disc_list li:before {
    content: "• ";
    color: #bbb
}

.usage_item_container .usage_item .item_content .item_detail ul.item_list_num {
    padding-top: 10px
}

.usage_item_container .usage_item .item_content .item_detail ul.item_list_num li {
    line-height: 21px;
    font-size: 14px;
    color: #666
}

.usage_item_container .usage_item .item_content .item_detail ul.item_list_link {
    padding-top: 8px;
    line-height: 25px;
    white-space: normal;
    word-break: break-all;
    font-size: 0;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap
}

.usage_item_container .usage_item .item_content .item_detail ul.item_list_link li {
    display: inline-block;
    line-height: 21px
}

.usage_item_container .usage_item .item_content .item_detail ul.item_list_link li a {
    margin: 0 15px 15px 0;
    padding: 8px 20px;
    border-radius: 18px;
    vertical-align: middle;
    display: inline-block;
    border: 1px solid #ffa54f;
    font-size: 12px;
    color: #ffa54f;
    line-height: 18px
}

.usage_item_container .usage_item .item_content .item_detail ul.item_list_link li a:hover {
    border: 1px solid #ff6c1d;
    color: #fff;
    background: #ff6c1d
}

.usage_item_container .usage_item .item_content .item_detail ul.item_list_article {
    padding-top: 10px;
    margin-left: -16px
}

.usage_item_container .usage_item .item_content .item_detail ul.item_list_article li {
    padding-bottom: 12px
}

.usage_item_container .usage_item .item_content .item_detail ul.item_list_article li h4 {
    position: relative;
    padding-left: 16px;
    font-weight: 500;
    font-size: 14px;
    color: rgba(0,0,0,.5);
    line-height: 21px
}

.usage_item_container .usage_item .item_content .item_detail ul.item_list_article li h4 span {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 12px;
    color: rgba(0,0,0,.3)
}

.usage_item_container .usage_item .item_content .item_detail ul.item_list_article li p {
    line-height: 25px;
    font-size: 14px;
    color: #959595;
    padding-left: 10px
}

.usage_item_container .usage_item .item_content .item_detail ul.item_list_article li:last-child {
    padding-bottom: 0
}

.usage_item_container .usage_item .item_content .product-use__markdown-item-description {
    margin-bottom: 32px
}

.usage_item_container .userage-item-feature__content {
    max-width: 1200px;
    margin: 60px auto 0;
    text-align: center
}

.usage_item_container .userage-item-feature__content .userage-item-feature__item {
    display: inline-block;
    width: 33.33333333%;
    margin-bottom: 70px;
    vertical-align: top;
    text-align: center
}

.usage_item_container .userage-item-feature__content .userage-item-feature__item.col_3 {
    width: 33.33333333%
}

.usage_item_container .userage-item-feature__content .userage-item-feature__item.col_4 {
    width: 25%
}

.usage_item_container .userage-item-feature__content .userage-item-feature__item span {
    display: inline-block;
    width: 80px;
    height: 80px;
    vertical-align: bottom
}

.usage_item_container .userage-item-feature__content .userage-item-feature__item span img.item_pic {
    display: block;
    margin: 0 auto
}

.usage_item_container .userage-item-feature__content .userage-item-feature__item .item_title {
    margin: 24px auto 12px;
    font-weight: 700;
    text-align: center;
    font-size: 16px;
    color: rgba(0,0,0,.85);
    line-height: 1.5;
    word-break: break-all;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 80%
}

.usage_item_container .userage-item-feature__content .userage-item-feature__item .item_des {
    width: 80%;
    margin: 0 auto;
    text-align: center;
    font-size: 14px;
    color: rgba(0,0,0,.5);
    line-height: 21px;
    word-break: break-all;
    overflow: hidden;
    white-space: pre-wrap
}

.scenarios_primary {
    padding: 48px 0 70px;
    overflow: hidden;
    background: #f5faff
}

.scenarios_primary h2.scenarios_title {
    margin-bottom: 37px;
    text-align: center;
    font-size: 32px;
    color: #262626;
    line-height: 42px
}

.scenarios_tabs {
    margin: 0 auto;
    max-width: 1200px
}

.scenarios_tabs ul.tabs_item.is-small li {
    width: 150px
}

.scenarios_tabs ul.tabs_item li {
    display: inline-block;
    width: 220px;
    padding-bottom: 10px;
    vertical-align: top;
    cursor: pointer;
    transition: color .3s linear;
    font-size: 16px;
    color: #262626;
    line-height: 24px;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.scenarios_tabs ul.tabs_item li:first-child {
    margin-left: 0
}

.scenarios_tabs ul.tabs_item li:last-child {
    margin-right: 0
}

.scenarios_tabs ul.tabs_item li.active {
    color: #2b66ff
}

.scenarios_tabs ul.tabs_item li.active .item_pic {
    display: none!important
}

.scenarios_tabs ul.tabs_item li.active .item_pic_hover {
    display: block!important
}

.scenarios_tabs ul.tabs_item li.active span.border_bottom {
    border-bottom: 4px solid #2b66ff
}

.scenarios_tabs ul.tabs_item li:hover {
    color: #2b66ff
}

.scenarios_tabs ul.tabs_item li:hover .item_pic {
    display: none!important
}

.scenarios_tabs ul.tabs_item li:hover .item_pic_hover {
    display: block!important
}

.scenarios_tabs ul.tabs_item li .item_pic {
    display: block;
    margin: 4px auto
}

.scenarios_tabs ul.tabs_item li .item_pic_hover {
    display: none;
    margin: 4px auto
}

.scenarios_tabs ul.tabs_item li .border_bottom {
    position: relative;
    top: 10px;
    margin: 0 auto;
    width: 40px;
    display: block
}

.scenarios_tabs .text_center {
    text-align: center
}

.scenarios_tabs .scenarios_container {
    padding-top: 30px
}

.scenarios_tabs .scenarios_container .scenarios_content {
    max-width: 1200px;
    margin: 0 auto;
    font-size: 0;
    border-radius: 6px
}

.scenarios_tabs .scenarios_container .scenarios_content.active {
    display: block;
    border-radius: 10px
}

.markdown-item .markdown-item-content {
    font-size: 14px;
    color: rgba(0,0,0,.85);
    line-height: 21px;
    padding: 0 20px;
}

.markdown-item table.ws-table {
    display: table
}

table.ws-table tr th {
    font-size: 16px;
    padding: 15px 10px
}

.ws-table-hightlight--row tr:hover td,.ws-table__cell--hover {
    background: rgba(255,169,123,.15)
}

.markdown-item.markdown-body table.ws-table tr:nth-child(2n) {
    background: transparent
}

table.ws-table.is-zebra tr:nth-child(odd) {
    background: #f0f7ff
}

.cm-markdown-view {
    padding: 60px 0 42px
}

.cm-markdown-view .cm-markdown-view__title {
    padding: 0 0 20px;
    font-weight: 500;
    text-align: center;
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 42px;
    margin-bottom: 60px
}

.cm-markdown-view .cm-markdown-view__content {
    max-width: 1210px;
    margin: 0 auto
}

.ws-web-page__fix-nav {
    background: #fff;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    width: 100%
}

.ws-web-page__fix-nav--fixed {
    position: fixed;
    top: 0;
    z-index: 100
}

.ws-web-page__fix-nav .fix-nav-contain {
    width: 1200px;
    margin: 0 auto;
    text-align: center
}

.ws-web-page__fix-nav .fix-nav-contain a {
    margin: 0 40px;
    font-size: 16px;
    line-height: 60px;
    display: inline-block;
    color: rgba(0,0,0,.65);
    position: relative
}

.ws-web-page__fix-nav .fix-nav-contain a span {
    position: absolute;
    width: 100%;
    height: 4px;
    display: none;
    left: 0;
    bottom: 0;
    background-color: #2b66ff
}

.ws-web-page__fix-nav .fix-nav-contain a:hover {
    color: #2b66ff
}

.ws-web-page__fix-nav .fix-nav-contain a:hover span {
    display: block
}

.ws-web-page__fix-nav .fix-nav-contain a.is-active {
    color: #2b66ff;
    font-weight: 700
}

.ws-web-page__fix-nav .fix-nav-contain a.is-active span {
    display: block
}

.ws-web-page__fix-nav.is-tab-mode {
    position: absolute;
    left: 0;
    width: 150px;
    top: 15px;
    transition: width .3s
}

.ws-web-page__fix-nav.is-tab-mode.ws-web-page__fix-nav--fixed {
    position: fixed;
    z-index: 100
}

.ws-web-page__fix-nav.is-tab-mode .fix-nav-contain {
    width: auto;
    padding: 10px;
    text-align: left
}

.ws-web-page__fix-nav.is-tab-mode .fix-nav-contain a {
    display: block;
    line-height: 1.5;
    margin: 10px 0;
    padding-left: 7px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.ws-web-page__fix-nav.is-tab-mode .fix-nav-contain a.is-active,.ws-web-page__fix-nav.is-tab-mode .fix-nav-contain a:hover {
    border-left: 2px solid #2b66ff;
    font-weight: 700;
    padding-left: 5px
}

.ws-web-page__fix-nav.is-tab-mode .fix-nav-contain a span {
    display: none
}

.ws-web-page__fix-nav.is-tab-mode:hover {
    width: 300px
}

.mobile .ws-web-page__fix-nav.is-tab-mode {
    position: static
}

.mobile .ws-web-page__fix-nav.is-tab-mode.ws-web-page__fix-nav {
    background: transparent!important;
    box-shadow: none
}

.ws-web-beian__banner {
    box-sizing: border-box;
    text-align: center;
    background: #000;
    height: 284px;
    color: #fff;
    padding-top: 80px;
    background: url(http://www.haoio.cn/nuxt-static/img/ba-banner.eac8dac.png) no-repeat 50%;
    background-size: cover
}

.ws-web-beian__banner .common-section-title {
    margin-bottom: 17px
}

.ws-web-beian__banner h2 {
    color: #fff;
    line-height: 57px;
    font-size: 38px
}

.ws-web-beian__banner p {
    margin-bottom: 22px;
    font-size: 18px;
    line-height: 27px
}

.ws-web-beian__banner .button {
    width: 120px;
    height: 36px;
    font-size: 16px;
    color: #fff;
    line-height: 24px;
    background: #2b66ff;
    border-radius: 2px
}

.ws-web-beian .beian-step {
    padding: 70px 0
}

.ws-web-beian .beian-step h3 {
    margin-bottom: 54px
}

.ws-web-beian .beian-step__list {
    width: 1200px;
    margin: 0 auto
}

.ws-web-beian .beian-step__list:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.ws-web-beian .beian-step__list li {
    float: left;
    width: 208px;
    padding-right: 40px;
    box-sizing: content-box;
    text-align: center;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAYCAMAAAC/Wk/yAAABZVBMVEX/ejP/ezX/fTf/fTj/fzv/gDz/g0D/g0H/h0f/iUr/i03/jE7/jE//jVD/jlL/k1n/lFv/mmP/m2b/oW//o3H/qXz/q37/roP/r4T/r4X/sIX/sIb/sIf/sYj/sYn/son/s4v/s4z/tI3/tY//to//t5D/t5H/uZT/upb/u5j/vJj/vZv/v57/wJ//waH/w6T/xaf/xqj/yKv/yaz/yq3/y6//zbP/0bn/0rn/07v/1cD/1sH/2MT/2sb/28f/28j/3Mr/4ND/4NH/4dH/4tL/4tP/5Nb/5Nf/5dj/5tj/5tn/5tr/59r/59v/6Nz/6N3/6d7/6t//6uD/6+D/6+H/7eP/7eT/7uX/7ub/7+f/8Oj/8On/8er/8uz/8+z/8+3/9O7/9O//9fD/9vL/9/L/9/P/9/T/+PT/+PX/+fb/+ff/+vf/+vj/+/j/+/n/+/r//Pr//Pv//fz//f3//v3//v7///9MJPwNAAABOUlEQVQoz82TV1PCUBCFF3vvbcWKvfeCvS6oBBsgwQooYBCUSPj9PuzqTLgvvmmevjNz7iTnnBso/PKBPzZGfIbIJ9eaJdhd41eMUfImWRoTuGIyzkPlkfLqGHnirFPTuPDBuOQo31G+Me6hGFNmDmfTjOslpW4lTNJLj0y5RZx6YdwucywrqY1TumPKr+J4lPGwAmaUejIa6ZzYcuOoHNKqYMQq7vHdTyHBLXRFmIK14FQK1+lMSrx34T6T1QV1RUZLJy3LGB7CTSazA+pv7EYrRH4p8GoA95je2qDxwR4mH6ALmeSkt0cmSbRA87M9tXlJgU/GA2efT4Zvgta0vcfcOQUlxy4OBiRbA7Tn7MtkNQqLbwOHdabraujPF18zuhWZwDFZstAJk8o1M19/dDj1TbHj//LPfAFgTo1KUNc05QAAAABJRU5ErkJggg==) no-repeat right 50px
}

.ws-web-beian .beian-step__list li:last-child {
    background: none;
    padding-right: 0
}

.ws-web-beian .beian-guide {
    padding: 70px 0;
    background: #f7fafe
}

.ws-web-beian .beian-guide h3 {
    margin-bottom: 40px
}

.ws-web-beian .beian-guide__body {
    width: 1200px;
    margin: 0 auto
}

.ws-web-beian .beian-guide__list {
    margin: 0 -10px
}

.ws-web-beian .beian-guide__list:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.ws-web-beian .beian-guide__list>li {
    display: inline-block;
    width: 205px;
    padding: 40px;
    margin: 0 10px 10px;
    background: url(http://www.haoio.cn/nuxt-static/img/ba-guide-bg.d9ad4a4.png) no-repeat 100% 100% #fff;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    border-radius: 2px;
    vertical-align: top
}

.ws-web-beian .beian-guide__list h4 {
    font-size: 16px;
    color: rgba(0,0,0,.85);
    margin-bottom: 12px;
    font-weight: 500
}

.ws-web-beian .beian-guide__list ul {
    margin-bottom: 12px;
    list-style: disc;
    padding-left: 1em;
    min-height: 84px
}

.ws-web-beian .beian-guide__list ul li {
    font-size: 14px
}

.ws-web-beian .beian-guide__link-more a {
    font-size: 14px;
    line-height: 24px;
    color: rgba(0,0,0,.5);
    display: inline-block
}

.ws-web-beian .beian-guide__link-more a .svg-icon-contain {
    font-size: 12px;
    vertical-align: .15em
}

.ws-web-beian .beian-guide__link-more a:hover {
    color: #2b66ff
}

.ws-web-beian .beian-province-rules {
    padding: 70px 0
}

.ws-web-beian .beian-province-rules h3 {
    margin-bottom: 60px
}

.ws-web-beian .beian-province-rules__body {
    width: 1200px;
    margin: 0 auto
}

.ws-web-beian .beian-province-rules__body:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.ws-web-beian .beian-province-rules__body .province-map {
    float: left;
    width: 682px
}

.ws-web-beian .beian-province-rules__body .province-rule {
    float: right;
    width: 400px
}

.ws-web-beian .beian-province-rules__body .province-rule>h4 {
    font-size: 16px;
    color: rgba(0,0,0,.85);
    line-height: 24px;
    margin-bottom: 24px
}

.ws-web-beian .beian-province-rules__body .province-rule__type:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.ws-web-beian .beian-province-rules__body .province-rule__type h5 {
    float: left;
    text-align: center;
    cursor: pointer;
    width: 198px;
    height: 34px;
    line-height: 34px;
    border-radius: 0 2px 2px 0;
    border: 1px solid rgba(0,0,0,.1);
    font-size: 14px;
    font-weight: 500;
    color: rgba(0,0,0,.5)
}

.ws-web-beian .beian-province-rules__body .province-rule__type h5:first-child {
    border-radius: 2px 0 0 2px
}

.ws-web-beian .beian-province-rules__body .province-rule__type h5.is-active {
    background: #2b66ff;
    border-color: #2b66ff;
    color: #fff
}

.ws-web-beian .beian-province-rules__body .province-rule__detail {
    padding: 10px;
    overflow-y: auto;
    height: 420px
}

.ws-web-report_banner {
    background: url(http://www.haoio.cn/nuxt-static/img/report-banner-bg.012118b.png) no-repeat 50%;
    height: 215px;
    background-size: cover;
    padding-top: 70px
}

.ws-web-report_banner .title {
    font-weight: 400;
    padding-bottom: 4px;
    font-size: 36px;
    line-height: 54px
}

.ws-web-report_banner .desc,.ws-web-report_banner .title {
    text-align: center;
    color: #fff;
    text-shadow: 0 2px 10px rgba(0,0,0,.35)
}

.ws-web-report_banner .desc {
    max-width: 677px;
    margin: 0 auto;
    padding-bottom: 60px;
    font-size: 16px;
    line-height: 24px
}

.ws-web-report-list__banner {
    background: url(http://www.haoio.cn/nuxt-static/img/report-list-banner.9ab2c4d.png) no-repeat 50%;
    background-size: cover
}

.ws-web-report-list__body {
    width: 1200px;
    margin: 0 auto
}

.ws-web-report-list .report-list-type {
    border-bottom: 1px solid rgba(0,0,0,.1)
}

.ws-web-report-list .report-list-type:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.ws-web-report-list .report-list-type h3 {
    font-size: 16px;
    font-weight: 400;
    color: rgba(0,0,0,.65);
    line-height: 21px;
    padding: 16px 27px;
    position: relative;
    float: left;
    cursor: pointer
}

.ws-web-report-list .report-list-type h3.is-active,.ws-web-report-list .report-list-type h3:hover {
    color: #2b66ff
}

.ws-web-report-list .report-list-type h3.is-active:after,.ws-web-report-list .report-list-type h3:hover:after {
    content: "";
    display: block;
    position: absolute;
    width: 40px;
    height: 3px;
    background-color: #2b66ff;
    left: 50%;
    bottom: 0;
    margin-left: -20px
}

.ws-web-report-list .annoucement-banner {
    width: 100%;
    background: url(http://www.haoio.cn/nuxt-static/img/annoucement.a27fcd1.png) no-repeat;
    background-size: auto 100%;
    background-position: 50%;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover
}

.ws-web-report-list .annoucement-banner-text {
    display: inline-block;
    font-size: 36px;
    font-family: FZLTHJW--GB1-0,FZLTHJW--GB1;
    font-weight: 400;
    color: hsla(0,0%,100%,.95);
    line-height: 41px
}

.ws-web-report-list .company-management-banner {
    width: 100%;
    background: url(http://www.haoio.cn/nuxt-static/img/company-management-banner.16f3ded.png) no-repeat 50%;
    background-size: cover;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center
}

.ws-web-report-list .company-management-banner-text {
    display: inline-block;
    font-size: 36px;
    font-family: FZLTHJW--GB1-0,FZLTHJW--GB1;
    font-weight: 400;
    color: hsla(0,0%,100%,.95);
    line-height: 41px
}

.ws-web-report-list .law-banner {
    width: 100%;
    background: url(http://www.haoio.cn/nuxt-static/img/service-annoucement.9b1311a.png) no-repeat;
    background-position: 50%;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center
}

.ws-web-report-list .law-banner-text {
    display: inline-block;
    font-size: 36px;
    font-family: FZLTHJW--GB1-0,FZLTHJW--GB1;
    font-weight: 400;
    color: hsla(0,0%,100%,.95);
    line-height: 41px
}

.ws-web-read-list__news {
    width: 100%;
    background: url(http://www.haoio.cn/nuxt-static/img/news.aa7df89.png) no-repeat;
    background-position: 50%;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover
}

.ws-web-read-list__news-text {
    display: inline-block;
    font-size: 36px;
    font-family: FZLTHJW--GB1-0,FZLTHJW--GB1;
    font-weight: 400;
    color: hsla(0,0%,100%,.95);
    line-height: 41px
}

.ws-web-read-list__read-banner {
    background: url(http://www.haoio.cn/nuxt-static/img/report-read.5daed89.png) no-repeat 50%;
    background-size: cover
}

.ws-web-read-list__body {
    width: 1200px;
    margin: 0 auto
}

.news-detail .news-detail__main-pannel {
    width: 1200px;
    margin: 0 auto;
    font-size: 14px;
    font-family: MicrosoftYaHei;
    padding: 43px 0 65px
}

.news-detail .news-detail__main-pannel .news-detail__navigation {
    line-height: 20px
}

.news-detail .news-detail__main-pannel .news-detail__navigation a {
    color: #2a49c3
}

.news-detail .news-detail__main-pannel .news-detail__title {
    margin-top: 32px;
    font-size: 30px;
    font-family: MicrosoftYaHei;
    color: rgba(0,0,0,.95);
    line-height: 40px
}

.news-detail .news-detail__main-pannel .news-detail__date {
    margin-top: 8px;
    color: rgba(0,0,0,.65);
    line-height: 19px
}

.news-detail .news-detail__main-pannel .news-detail__essay {
    margin-top: 31px;
    padding: 0 0 80px;
    border-bottom: 1px solid rgba(0,0,0,.1)
}

.news-detail .news-detail__main-pannel .news-detail__essay .markdown-item-content {
    color: rgba(0,0,0,.65)!important
}

.news-detail .news-detail__main-pannel .news-detail__footer {
    margin-top: 8px
}

.news-detail .news-detail__main-pannel .news-detail__footer .news-detail__footer-previous {
    float: left
}

.news-detail .news-detail__main-pannel .news-detail__footer .news-detail__footer-next {
    float: right;
    word-break: break-all;
    display: flex
}

.news-detail .news-detail__main-pannel .news-detail__footer a {
    line-height: 21px;
    text-decoration: none;
    transition: all .3s linear;
    font-size: 14px;
    color: rgba(0,0,0,.65);
    letter-spacing: 0;
    text-align: justify
}

.news-detail .news-detail__main-pannel .news-detail__footer a:hover {
    color: #2b66ff
}

.wangsu-events .wangsu-events__top {
    width: 100%;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center
}

.wangsu-events .wangsu-events__top .wangsu-events__top-text {
    display: inline-block;
    font-size: 36px;
    font-family: FZLTHJW--GB1-0,FZLTHJW--GB1;
    font-weight: 400;
    color: hsla(0,0%,100%,.95);
    line-height: 41px
}

.wangsu-events .wangsu-events__top-event {
    background: url(http://www.haoio.cn/nuxt-static/img/events.94ba62f.png) no-repeat;
    background-size: auto 100%;
    background-position: 50%;
    background-size: cover
}

.wangsu-events .wangsu-events__top-honor {
    background: url(http://www.haoio.cn/nuxt-static/img/honors.f60cfd8.png) no-repeat;
    background-size: auto 100%;
    background-position: 50%;
    background-size: cover
}

.wangsu-events .wangsu-events__main {
    max-width: 1200px;
    margin: 0 auto;
    min-height: 500px;
    padding: 40px 0
}

.wangsu-events .wangsu-events__scroll-bar {
    position: relative;
    float: left;
    margin-left: 8px
}

.wangsu-events .wangsu-events__scroll-bar.fixed {
    top: 130px;
    position: fixed;
    z-index: 9
}

.wangsu-events .wangsu-events__event-line {
    float: right;
    width: 1045px
}

.employ {
    font-family: MicrosoftYaHei
}

.employ .ws-web-page__fix-nav {
    margin-bottom: 8px;
    background: #fff;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35)
}

.employ .fix-nav-contain {
    width: 1200px;
    margin: 0 auto;
    text-align: center
}

.employ .fix-nav-contain a {
    margin: 0 40px;
    font-size: 16px;
    line-height: 60px;
    display: inline-block;
    color: rgba(0,0,0,.65);
    position: relative;
    cursor: pointer
}

.employ .fix-nav-contain a span {
    position: absolute;
    width: 62.5%;
    height: 3px;
    display: none;
    left: 18.75%;
    bottom: 0;
    background-color: #2a49c3
}

.employ .fix-nav-contain a:hover {
    color: #2a49c3
}

.employ .fix-nav-contain a:hover span {
    display: block
}

.employ .fix-nav-contain a.is-active {
    color: #2a49c3
}

.employ .fix-nav-contain a.is-active span {
    display: block
}

.employ .employ__process {
    background: #fff;
    padding: 64px 0 68px
}

.employ .employ__process .employ__process-panel {
    width: 1200px;
    margin: 0 auto;
    text-align: center
}

.employ .employ__process .employ__process-panel .employ__process-title {
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px
}

.employ .employ__process .employ__process-panel .employ__process-content {
    padding: 60px 0 40px 140px
}

.employ .employ__process .employ__process-panel .employ__process-content .employ__process-content-node {
    width: 138px;
    text-align: center;
    float: left
}

.employ .employ__process .employ__process-panel .employ__process-content .employ__process-content-node .employ__process-content-node-block {
    width: 100px;
    height: 100px;
    background: #fff;
    display: inline-block
}

.employ .employ__process .employ__process-panel .employ__process-content .employ__process-content-node .employ__process-content-node-title {
    margin: 24px 0 0;
    font-size: 20px;
    color: rgba(0,0,0,.85);
    line-height: 30px
}

.employ .employ__process .employ__process-panel .employ__process-content .employ__process-content-node .employ__process-content-node-date {
    margin: 8px 0 0;
    font-size: 16px;
    color: rgba(0,0,0,.85);
    line-height: 24px
}

.employ .employ__process .employ__process-panel .employ__process-content .employ__process-content-arrow-block {
    width: 123px;
    height: 96px;
    float: left;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    display: flex
}

.employ .employ__process .employ__process-panel .employ__process-content .employ__process-content-arrow-block .employ__process-content-arrow-block-img {
    width: 40px;
    height: 24px
}

.employ .employ__apply-button {
    width: 120px;
    height: 36px;
    background: linear-gradient(180deg,#2a49c3,#2a49c3);
    border-radius: 2px;
    border: none;
    font-size: 16px;
    color: #fff;
    cursor: pointer
}

.employ .employ__care {
    background: #f7fafe;
    position: relative
}

.employ .employ__care .employ__care-background {
    position: absolute;
    right: 0;
    bottom: 0
}

.employ .employ__care .employ__care-panel {
    width: 1200px;
    margin: 0 auto;
    padding: 64px 0;
    text-align: center
}

.employ .employ__care .employ__care-panel .employ__care-panel-title {
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px
}

.employ .employ__care .employ__care-panel .employ__care-panel-content {
    margin: 60px 0 0
}

.employ .employ__care .employ__care-panel .employ__care-panel-content :last-child {
    margin-right: 0!important
}

.employ .employ__care .employ__care-panel .employ__care-panel-content :nth-child(2n) {
    margin: 94px 0 0
}

.employ .employ__care .employ__care-panel .employ__care-panel-content .employ__care-panel-content-node {
    width: 160px;
    height: 188px;
    background: #fff;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    float: left;
    margin-right: 48px
}

.employ .employ__care .employ__care-panel .employ__care-panel-content .employ__care-panel-content-node .employ__care-panel-content-node-image {
    width: 160px;
    height: 148px
}

.employ .employ__care .employ__care-panel .employ__care-panel-content .employ__care-panel-content-node .employ__care-panel-content-node-text {
    font-size: 16px;
    line-height: 40px;
    height: 40px;
    color: rgba(0,0,0,.65);
    margin: 0
}

.employ .employ__care .employ__care-panel .employ__care-panel-apply {
    margin: 40px 0 0
}

.employ .employ__connect {
    background: url(http://www.haoio.cn/nuxt-static/img/connect.1b2dbe7.png) no-repeat;
    background-size: auto 100%;
    background-position: 50%;
    height: 696px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover
}

.employ .employ__connect .employ__connect-panel {
    width: 1200px;
    margin: 0 auto;
    padding: 64px 0;
    text-align: center
}

.employ .employ__connect .employ__connect-panel .employ__connect-panel-title {
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px
}

.employ .employ__connect .employ__connect-panel .employ__connect-panel-content {
    margin: 60px 0 0
}

.employ .employ__connect .employ__connect-panel .employ__connect-panel-content .employ__connect-panel-content-description {
    font-size: 16px;
    color: rgba(0,0,0,.65);
    line-height: 24px;
    text-align: center
}

.employ .employ__connect .employ__connect-panel .employ__connect-panel-content .employ__connect-panel-content-qrcode {
    padding: 16px 0 0
}

.employ .employ__connect .employ__connect-panel .employ__connect-panel-content .employ__connect-panel-content-qrcode .employ__connect-panel-content-qrcode-text {
    color: rgba(0,0,0,.5);
    line-height: 30px;
    font-size: 14px
}

.employ .employ__join {
    width: 100%;
    background: url(http://www.haoio.cn/nuxt-static/img/join.4dd9188.png) no-repeat;
    background-size: auto 100%;
    background-position: 50%;
    height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover
}

.employ .employ__join .employ__join-text {
    width: 450px;
    height: 105px;
    text-align: center
}

.employ .employ__join .employ__join-text .employ__join-text-title {
    font-size: 48px;
    font-family: MicrosoftYaHei;
    color: #fff;
    line-height: 72px;
    text-shadow: 0 2px 10px rgba(0,0,0,.35)
}

.employ .employ__join .employ__join-text .employ__join-text-description {
    font-size: 22px;
    font-family: MicrosoftYaHei;
    color: #fff;
    line-height: 33px;
    text-shadow: 0 2px 10px rgba(0,0,0,.35)
}

.investment .investment__header {
    width: 100%;
    background: url(http://www.haoio.cn/nuxt-static/img/investment.d68a25d.png) no-repeat;
    background-size: auto 100%;
    background-position: 50%;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover
}

.investment .investment__header .investment__header-text {
    display: inline-block;
    font-size: 36px;
    font-family: FZLTHJW--GB1-0,FZLTHJW--GB1;
    font-weight: 400;
    color: hsla(0,0%,100%,.95);
    line-height: 41px
}

.investment .color-blue {
    color: #2a49c3
}

.investment .color-red {
    color: #ff4f36
}

.investment .investment__body {
    padding: 53px 0 0;
    font-family: MicrosoftYaHei
}

.investment .investment__body .investment__body-header {
    text-align: center;
    font-size: 16px;
    color: rgba(0,0,0,.5);
    line-height: 24px
}

.investment .investment__body .investment__body-header .investment__body-header-blue {
    color: #2a49c3;
    margin: 8px 0 0
}

.investment .investment__body .investment__body-content {
    width: 556px;
    margin: 0 auto;
    padding: 30px 0 70px
}

.investment .investment__body .investment__body-content .investment__body-form-item {
    height: 70px
}

.investment .investment__body .investment__body-content .investment__body-form-item .investment__body-form-item-label {
    float: left;
    width: 98px;
    margin-right: 24px;
    height: 40px;
    line-height: 40px;
    text-align: right
}

.investment .investment__body .investment__body-content .investment__body-form-item .investment__body-form-item-input {
    float: left;
    color: rgba(0,0,0,.65);
    line-height: 21px
}

.investment .investment__body .investment__body-content .investment__body-form-item .investment__body-form-item-input input {
    height: 40px;
    background: #fff;
    border-radius: 2px;
    border: 1px solid rgba(0,0,0,.15);
    width: 432px;
    line-height: 40px;
    font-size: 14px;
    padding: 0 16px;
    box-sizing: border-box
}

.investment .investment__body .investment__body-content .investment__body-form-item .investment__body-form-item-input .investment__body-form-item-hint {
    color: #ff4f36;
    margin: 2px 0 0
}

.investment .investment__body .investment__body-content .investment__body-form-item .investment__body-form-item-input .investment__body-form-item-input-radio {
    float: left;
    margin: 11px 43px 0 0;
    cursor: pointer
}

.investment .investment__body .investment__body-content .investment__body-form-item .investment__body-form-item-input .investment__body-form-item-input-radio .investment__body-form-item-input-radio-button {
    width: 16px;
    height: 16px;
    background: #fff;
    border: 1px solid #d9d9d9;
    border-radius: 50%;
    text-align: center;
    position: relative;
    float: left
}

.investment .investment__body .investment__body-content .investment__body-form-item .investment__body-form-item-input .investment__body-form-item-input-radio .investment__body-form-item-input-radio-button .is-active.investment__body-form-item-input-radio-button-select {
    width: 8px;
    height: 8px;
    background: #2a49c3;
    border-radius: 50%;
    display: inline-block;
    position: absolute;
    top: 4px;
    left: 4px
}

.investment .investment__body .investment__body-content .investment__body-form-item .investment__body-form-item-input .investment__body-form-item-input-radio .investment__body-form-item-input-radio-text {
    float: left;
    margin: 0 0 0 10px;
    line-height: 19px
}

.investment .investment__body .investment__body-content .investment__body-form-radio {
    height: 64px
}

.investment .investment__body .investment__body-content .investment__body-form-agreement {
    text-align: center;
    margin-top: 10px
}

.investment .investment__body .investment__body-content .investment__body-form-agreement a {
    color: #2a49c3
}

.investment .investment__body .investment__body-content .investment__body-form-button {
    text-align: center;
    margin-top: 19px
}

.investment .investment__body .investment__body-content .investment__body-form-button button {
    width: 120px;
    height: 36px;
    background: #2a49c3;
    border-radius: 2px;
    border: none;
    font-size: 16px;
    color: #fff
}

.investment .investment__body .investment__body-address {
    background: #f7fafe;
    padding: 70px 0;
    box-sizing: border-box
}

.investment .investment__body .investment__body-address .investment__body-address-content {
    width: 1083px;
    margin: 0 auto;
    height: 375px;
    background: #fff
}

.investment .investment__body .investment__body-address .investment__body-address-content .investment__body-address-map {
    float: left;
    width: 653px
}

.investment .investment__body .investment__body-address .investment__body-address-content .investment__body-address-description {
    float: left;
    padding: 32px 0 32px 37px
}

.investment .investment__body .investment__body-address .investment__body-address-content .investment__body-address-description .investment__body-address-description-title {
    font-size: 20px;
    color: rgba(0,0,0,.85);
    line-height: 30px;
    margin: 0 0 16px
}

.investment .investment__body .investment__body-address .investment__body-address-content .investment__body-address-description .investment__body-address-description-line {
    color: rgba(0,0,0,.65);
    line-height: 21px;
    margin-bottom: 8px
}

.investment .investment__body .investment__body-address .investment__body-address-content .investment__body-address-description .investment__body-address-description-qrcode {
    color: rgba(0,0,0,.65);
    line-height: 21px;
    margin: 4px 0 0
}

.report-list-content__header {
    background-color: #f7fafe
}

.product-list-cover-wrap {
    padding: 24px 0
}

.product-list-cover-wrap .product-list-cover li {
    padding: 14px 0;
    border-bottom: 1px solid rgba(0,0,0,.1)
}

.product-list-cover-wrap .product-list-cover li:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.product-list-cover-wrap .product-list-cover__image {
    float: left;
    width: 193px;
    height: 109px;
    margin-right: 16px
}

.product-list-cover-wrap .product-list-cover__image img {
    width: 193px;
    height: 109px
}

.product-list-cover-wrap .product-list-cover__info {
    overflow: hidden
}

.product-list-cover-wrap .product-list-cover__info-title {
    display: inline-block;
    padding: 0 20px;
    width: 840px;
    word-wrap: break-word;
    word-break: break-all;
    cursor: pointer
}

.product-list-cover-wrap .product-list-cover__info-title a:link,.product-list-cover-wrap .product-list-cover__info-title a:visited {
    color: #262626
}

.product-list-cover-wrap .product-list-cover__info-title a:hover {
    color: #2b66ff
}

.product-list-cover-wrap .product-list-cover__info-desc {
    font-size: 14px;
    margin-bottom: 8px
}

.product-list-cover-wrap .product-list-cover__info-time {
    color: rgba(0,0,0,.5)
}

.news-pagination {
    margin: 24px 0;
    text-align: right
}

.news-pagination button {
    text-align: center;
    background: #fff;
    border-radius: 2px;
    border: 1px solid #ccc
}

.news-pagination button:disabled {
    background: #f4f4f4;
    border-radius: 2px;
    border: 1px solid #ddd
}

.news-pagination .btn-prev {
    padding-right: 6px
}

.news-pagination .btn-next {
    padding-left: 6px
}

.news-pagination .el-pager li {
    background: #fff;
    border-radius: 2px;
    border: 1px solid #ccc;
    min-width: 28px;
    padding: 0 4px;
    margin: 0 4px;
    font-weight: 400;
    color: #ccc
}

.news-pagination .el-pager li.active,.news-pagination .el-pager li:hover {
    border-color: #2b66ff;
    color: #2a49c3
}

.news-pagination .el-pager li.active+li {
    border-left: 1px solid #ccc
}

.news-pagination .el-pager li.active+li:hover {
    border-left-color: #2b66ff
}

.btn-container {
    text-align: center;
    font-size: 20px;
    color: rgba(0,0,0,.65);
    line-height: 30px;
    padding-top: 40px;
    padding-bottom: 16px
}

.ws-web-company_introduction {
    padding: 56px 0 64px
}

.ws-web-company_introduction .title {
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px;
    font-weight: 400;
    text-align: center;
    padding-bottom: 60px
}

.ws-web-company_introduction .content {
    width: 1200px;
    text-align: center;
    margin: 0 auto
}

.ws-web-company_introduction .content .content-left {
    width: 389px;
    margin: 0;
    display: inline-block;
    vertical-align: top;
    text-align: left
}

.ws-web-company_introduction .content .content-left img {
    width: 389px;
    height: 520px
}

.ws-web-company_introduction .content .content-right {
    width: 613px;
    margin-left: 78px;
    margin-top: 60px;
    display: inline-block;
    text-align: left;
    height: 332px;
    word-break: break-all;
    font-size: 16px;
    color: rgba(0,0,0,.65);
    line-height: 24px;
    background: #fff;
    box-shadow: 0 2px 8px 0 rgba(42,73,195,.17);
    border-radius: 2px;
    border: 1px solid rgba(42,73,195,.1);
    padding: 45px 22px 33px 44px
}

.ws-web-company_introduction .content .content-right .title {
    font-family: babasNeue;
    text-align: center;
    margin-bottom: 15px;
    padding-bottom: 0;
    text-transform: uppercase;
    display: inline-block;
    font-size: 36px;
    font-weight: 400;
    color: #2a49c3;
    line-height: 43px;
    border-bottom: 3px solid #374dbf
}

.ws-web-company_introduction .content .content-right .content-right-desc {
    font-weight: 400;
    font-size: 23px;
    color: rgba(0,0,0,.65);
    line-height: 33px
}

.ws-web-core_strength {
    min-width: 1200px;
    padding: 0 0 70px;
    margin: 0 auto;
    background: url(http://www.haoio.cn/nuxt-static/img/core-strength-bg.36abd90.png) no-repeat 50%;
    background-size: cover
}

.ws-web-core_strength .title {
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px;
    font-weight: 400;
    text-align: center;
    padding-bottom: 40px
}

.ws-web-core_strength .panel {
    height: 222px;
    margin: 0 auto;
    background-color: #1f3256
}

.ws-web-core_strength .panel .panel-left {
    color: #fff;
    vertical-align: top;
    display: inline;
    height: 100px;
    width: 50%;
    float: left;
    text-align: right;
    padding-top: 61px
}

.ws-web-core_strength .panel .panel-left .panel-left-no {
    font-family: babasNeue;
    font-size: 82px;
    font-weight: 400;
    color: #fff;
    line-height: 99px;
    padding-right: 82px
}

.ws-web-core_strength .panel .panel-left .panel-left-desc {
    display: inline-block;
    font-weight: 500;
    padding-right: 12px;
    font-size: 24px;
    color: #fff;
    line-height: 31px;
    vertical-align: super
}

.ws-web-core_strength .panel .panel-right {
    float: left;
    height: 222px;
    width: 50%;
    background: url(http://www.haoio.cn/nuxt-static/img/core-strength-panel.2c4d20e.png) no-repeat 0
}

.ws-web-core_strength .content {
    text-align: left;
    background-color: #fff;
    height: 340px;
    width: 860px;
    padding: 86px 122px;
    margin: 70px auto 60px
}

.ws-web-core_strength .content .content-item {
    display: inline-block;
    vertical-align: top;
    text-align: left;
    width: 207px;
    padding: 0 24px;
    margin: 0 -3px
}

.ws-web-core_strength .content .content-item .content-item-title {
    font-family: babasNeue;
    font-size: 60px;
    font-weight: 400;
    color: #2a49c3;
    line-height: 72px;
    margin-bottom: 11px;
    display: inline-block
}

.ws-web-core_strength .content .content-item .content-item-desc {
    word-break: break-all;
    font-weight: 400;
    font-size: 20px;
    color: rgba(0,0,0,.65);
    line-height: 28px
}

.ws-web-development_operation {
    text-align: center;
    padding-top: 70px;
    overflow: hidden;
    background: #fff
}

.ws-web-development_operation .title {
    font-weight: 500;
    margin-bottom: 8px;
    letter-spacing: 3px;
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px
}

.ws-web-development_operation .desc {
    margin-bottom: 60px;
    letter-spacing: 0;
    font-size: 16px;
    color: rgba(0,0,0,.5);
    line-height: 24px
}

.ws-web-development_operation ul.ws-node-list {
    max-width: 1200px;
    margin: 99px auto 70px;
    width: 100%
}

.ws-web-development_operation ul.ws-node-list li {
    display: inline-block;
    width: 16.66666667%;
    height: 102px;
    text-align: left
}

.ws-web-development_operation ul.ws-node-list li h3 {
    font-family: babasNeue;
    margin: 0;
    font-size: 52px;
    font-weight: 400;
    color: rgba(0,0,0,.65);
    line-height: 78px
}

.ws-web-development_operation ul.ws-node-list li h3 small {
    font-size: 32px;
    color: rgba(0,0,0,.65);
    line-height: 48px;
    margin-left: 5px
}

.ws-web-development_operation ul.ws-node-list li p {
    letter-spacing: 0;
    margin: 0;
    text-align: left;
    font-size: 16px;
    color: rgba(0,0,0,.65);
    line-height: 24px
}

.ws-web-development_operation ul.ws-node-list li .node-num-bg-circle {
    background: url(http://www.haoio.cn/nuxt-static/img/development-operation-bg-circle.3e1b771.png) no-repeat;
    width: 120px;
    height: 120px;
    position: relative;
    display: block;
    top: -126px;
    right: -25px
}

.ws-web-development_operation .node-map .map-bg {
    position: relative;
    width: 100%;
    max-width: 1200px;
    height: 593px;
    margin: 0 auto 30px;
    background: url(http://www.haoio.cn/nuxt-static/img/development-operation-bg.cd89ba3.png) no-repeat;
    background-size: cover
}

.ws-web-development_operation .node-map .map-bg .point-area {
    position: absolute;
    width: 22px;
    height: 22px;
    transition: opacity .5s ease-out
}

.ws-web-development_operation .node-map .map-bg .point-area .point-name {
    position: absolute;
    top: 35px;
    height: 65px;
    text-indent: -9999px
}

.ws-web-development_operation .node-map .map-bg .point-area .point-dot-blue {
    position: absolute;
    width: 8px;
    height: 8px;
    margin: auto;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    background-color: #2b66ff;
    border-radius: 50%;
    background-clip: padding-box
}

.ws-web-development_operation .node-map .map-bg .point-area .point-dot-yellow {
    position: absolute;
    width: 8px;
    height: 8px;
    margin: auto;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: #ffac34;
    background-clip: padding-box;
    z-index: 2;
    transform: rotate(45deg)
}

.ws-web-development_operation .node-map .map-bg .point-area .point-blue {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0
}

.ws-web-development_operation .node-map .map-bg .point-area .point-blue:after {
    display: block;
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 50%;
    border: 2px solid #2b66ff;
    opacity: 0
}

.ws-web-development_operation .node-map .map-bg .point-area .point-yellow {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    transform: rotate(45deg)
}

.ws-web-development_operation .node-map .map-bg .point-area .point-yellow:after {
    display: block;
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 2px solid #ffac34;
    opacity: 0
}

.ws-web-development_operation .node-map .map-bg .point-area .point-10:after {
    -webkit-animation: ripple 4.5s ease-out 225ms infinite;
    animation: ripple 4.5s ease-out 225ms infinite
}

.ws-web-development_operation .node-map .map-bg .point-area .point-40:after {
    -webkit-animation: ripple 4.5s ease-out .9s infinite;
    animation: ripple 4.5s ease-out .9s infinite
}

.ws-web-development_operation .node-map .map-bg .point-area .point-80:after {
    -webkit-animation: ripple 4.5s ease-out 1.8s infinite;
    animation: ripple 4.5s ease-out 1.8s infinite
}

.ws-web-development_operation .node-map .map-bg .point-area .point-shadow:after {
    box-shadow: inset 0 0 5em rgba(19,71,255,.16)
}

.ws-web-introduction_banner {
    background: url(http://www.haoio.cn/nuxt-static/img/company-introduce-banner.7c20a26.png) no-repeat 50%;
    height: 110px;
    background-size: cover;
    padding-top: 70px
}

.ws-web-introduction_banner .title {
    font-weight: 400;
    text-align: center;
    padding-bottom: 8px;
    font-size: 36px;
    color: #fff;
    line-height: 47px;
    margin-top: -25px
}

.ws-web-introduction_banner .desc {
    text-align: center;
    max-width: 950px;
    margin: 0 auto;
    padding-bottom: 60px;
    font-size: 18px;
    color: #fff;
    line-height: 27px
}

.report-list-content {
    padding: 24px 0
}

.report-list-content__header {
    height: 52px;
    line-height: 52px;
    background-color: #dae5ff
}

.report-list-content__header--title {
    display: inline-block;
    padding: 0 20px;
    width: 840px
}

.report-list-content__header--ctrl,.report-list-content__header--time {
    display: inline-block;
    padding: 0 20px;
    width: 120px
}

.report-list-content__header--ctrl {
    text-align: center
}

.report-list-content__header--title-long {
    display: inline-block;
    padding: 0 20px;
    width: 960px
}

.report-list-content__header--time-long {
    display: inline-block;
    padding: 0 20px;
    width: 150px
}

.report-list-content__body .report-list>li {
    padding: 14px 0 13px;
    border-bottom: 1px solid rgba(0,0,0,.1)
}

.report-list-content__body .report-list--title {
    display: inline-block;
    padding: 0 20px;
    width: 840px;
    word-wrap: break-word;
    word-break: break-all;
    cursor: pointer
}

.report-list-content__body .report-list--time {
    display: inline-block;
    padding: 0 20px;
    color: #7f7f7f;
    width: 120px
}

.report-list-content__body .report-list--ctrl {
    display: inline-block;
    padding: 0 20px;
    width: 120px;
    text-align: center
}

.report-list-content__body .report-list--ctrl i {
    margin: 0 5px
}

.report-list-content__body .report-list--ctrl a {
    color: #2b66ff
}

.report-list-content__body .report-list--ctrl a:hover {
    color: #548aff;
    cursor: pointer
}

.report-list-content__body .report-list--title-long {
    display: inline-block;
    padding: 0 20px;
    width: 960px;
    word-wrap: break-word;
    word-break: break-all
}

.report-list-content__body .report-list--title-long:hover {
    cursor: pointer
}

.report-list-content__body .report-list--time-long {
    display: inline-block;
    padding: 0 20px;
    color: #7f7f7f;
    width: 150px
}

.news-list-cover-wrap {
    padding: 24px 0
}

.news-list-cover-wrap .news-list-cover li {
    padding: 24px 0;
    border-bottom: 1px solid rgba(0,0,0,.1)
}

.news-list-cover-wrap .news-list-cover li:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.news-list-cover-wrap .news-list-cover__image {
    float: left;
    width: 193px;
    height: 109px;
    margin-right: 16px
}

.news-list-cover-wrap .news-list-cover__image img {
    width: 193px;
    height: 109px
}

.news-list-cover-wrap .news-list-cover__info {
    overflow: hidden
}

.news-list-cover-wrap .news-list-cover__info-title {
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 8px;
    font-weight: 500
}

.news-list-cover-wrap .news-list-cover__info-title a:link,.news-list-cover-wrap .news-list-cover__info-title a:visited {
    color: #262626
}

.news-list-cover-wrap .news-list-cover__info-title a:hover {
    color: #2b66ff
}

.news-list-cover-wrap .news-list-cover__info-desc {
    font-size: 14px;
    margin-bottom: 8px
}

.news-list-cover-wrap .news-list-cover__info-time {
    color: rgba(0,0,0,.5)
}

.news-pagination.el-pagination {
    margin: 24px 0;
    text-align: right
}

.news-pagination.el-pagination button {
    text-align: center;
    background: #fff;
    border-radius: 2px;
    border: 1px solid #ccc
}

.news-pagination.el-pagination button:disabled {
    background: #f4f4f4;
    border-radius: 2px;
    border: 1px solid #ddd
}

.news-pagination.el-pagination .btn-prev {
    padding-right: 6px
}

.news-pagination.el-pagination .btn-next {
    padding-left: 6px
}

.news-pagination.el-pagination .el-pager li {
    background: #fff;
    border-radius: 2px;
    border: 1px solid #ccc;
    min-width: 28px;
    padding: 0 4px;
    margin: 0 4px;
    font-family: 微软雅黑;
    font-weight: 400;
    color: #ccc
}

.news-pagination.el-pagination .el-pager li.active,.news-pagination.el-pagination .el-pager li:hover {
    border-color: #2b66ff;
    color: #2b66ff
}

.news-pagination.el-pagination .el-pager li.active+li {
    border-left: 1px solid #ccc
}

.news-pagination.el-pagination .el-pager li.active+li:hover {
    border-left-color: #2b66ff
}

.law-contract__main {
    width: 1000px;
    margin: 0 auto;
    padding: 60px 0
}

.law-contract__main li,.law-contract__main p {
    color: rgba(0,0,0,.65)
}

.ws-web-price {
    background: #eaf2fb
}

.ws-web-price .arrow-item {
    border: 8px solid transparent;
    display: inline-block;
    width: 0;
    height: 0
}

.ws-web-price .arrow-item.arrow-item__down {
    border-top-color: rgba(0,0,0,.65);
    border-bottom: 0
}

.ws-web-price-content {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    padding: 16px 0
}

.ws-web-price-content .top-tab {
    height: 78px;
    line-height: 78px;
    background: #fff;
    box-shadow: 0 2px 6px 0 hsla(0,0%,87.1%,.4)
}

.ws-web-price-content .top-tab .switch-product {
    padding-left: 36px;
    min-width: 221px;
    border-right: 1px solid #d8d8d8;
    box-sizing: border-box;
    color: #2b66ff
}

.ws-web-price-content .top-tab .switch-product>img {
    display: inline-block;
    width: 30px;
    height: 30px;
    vertical-align: middle
}

.ws-web-price-content .top-tab .switch-product .product-title {
    vertical-align: middle;
    margin-left: 12px;
    margin-right: 6px;
    font-size: 24px;
    color: #000;
    line-height: 78px
}

.ws-web-price-content .top-tab .switch-product-arrow {
    float: right;
    margin-right: 36px;
    font-size: 15px;
    cursor: pointer
}

.ws-web-price-content .top-tab .switch-product-arrow.is-active {
    transform: rotate(180deg)
}

.ws-web-price-content .top-tab .show-detail {
    margin-right: 36px;
    font-size: 14px;
    color: rgba(0,0,0,.65);
    line-height: 78px;
    cursor: pointer
}

.ws-web-price-content .top-tab .show-detail:hover {
    color: #2b66ff
}

.ws-web-price-content.menu-collapse .switch-menu {
    height: 0;
    padding-top: 0;
    padding-bottom: 0;
    border: 0;
    margin-bottom: 0;
    opacity: 0;
    visibility: hidden;
    border-color: transparent;
    background-color: transparent
}

.ws-web-price-content .switch-menu {
    max-height: 221px;
    padding: 30px 40px 20px;
    box-sizing: border-box;
    background: #fff;
    box-shadow: 0 4px 10px 0 rgba(0,0,0,.1);
    position: absolute;
    width: 460px;
    transition: all .1s ease
}

.ws-web-price-content .switch-menu-item {
    margin-bottom: 10px;
    float: left;
    width: 170px;
    padding-right: 20px;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ws-web-price-content .switch-menu-item a {
    color: rgba(0,0,0,.65)
}

.ws-web-price-content .switch-menu-item a:hover {
    color: #2b66ff
}

.ws-web-price-content .price-content {
    margin-top: 16px;
    padding: 5px 35px 32px;
    background: #fff;
    box-shadow: 0 2px 6px 0 hsla(0,0%,87.1%,.5);
    min-height: 400px;
    border-radius: 6px
}

.ws-web-price-content .markdown-item.markdown-body hr {
    margin: 0 -35px
}

.ws-web-page__content {
    width: 1000px;
    margin: 0 auto;
    padding: 60px 0
}

.ws-web-page__content .ws-web-page__title {
    text-align: center;
    font-size: 30px;
    line-height: 40px;
    color: rgba(0,0,0,.95)
}

.ws-web-page__content li,.ws-web-page__content p {
    color: rgba(0,0,0,.65)
}

.activity-combo {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 70px
}

.activity-combo.theme-black .content .title {
    color: #fff
}

.activity-combo.theme-white .content .title {
    color: #000
}

.activity-combo .content {
    max-width: 1200px;
    margin: 0 auto
}

.activity-combo .content .title {
    padding-top: 40px;
    text-align: center;
    font-size: 30px;
    line-height: 42px
}

.activity-combo .content .desc {
    margin-top: 16px;
    text-align: center;
    font-size: 16px;
    color: #666;
    line-height: 22px
}

.activity-combo .content .desc .rule {
    margin-left: 8px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 400;
    color: #2b66ff;
    line-height: 20px
}

.activity-combo .content .desc .rule:before {
    content: "?";
    display: inline-block;
    width: 15px;
    height: 15px;
    font-size: 12px;
    line-height: 16px;
    border: 1px solid #2b66ff;
    border-radius: 50%;
    transform: scale(.75);
    vertical-align: text-top
}

.activity-combo .content .modules {
    margin-top: 40px;
    display: flex;
    flex-flow: row nowrap;
    justify-content: center
}

.activity-combo .content .modules>div {
    margin-right: 16px;
    width: 288px;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 6px;
    overflow: hidden
}

.activity-combo .content .modules>div:last-child {
    margin-right: 0
}

.activity-combo .content .modules>div.modules-img img {
    vertical-align: top;
    width: 100%;
    height: 100%
}

.activity-combo .content .modules>div.modules-item {
    position: relative;
    padding-bottom: 50px;
    box-shadow: 0 2px 10px 0 hsla(0,0%,83.9%,.5);
    border-radius: 6px;
    overflow: hidden
}

.activity-combo .content .modules>div.modules-item .modules-item__title {
    padding-left: 17px;
    height: 100px;
    line-height: 100px;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(http://www.haoio.cn/nuxt-static/img/recommend-buy-header-bg.c93f92c.png)
}

.activity-combo .content .modules>div.modules-item .modules-item__title .modules-item__divider {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 5px;
    background: linear-gradient(90deg,#fff2de,#f9da9f);
    box-shadow: 0 2px 10px 0 hsla(0,0%,83.9%,.5);
    content: ""
}

.activity-combo .content .modules>div.modules-item .modules-item__title .modules-item__tag {
    position: absolute;
    top: 0;
    right: 0;
    width: 120px;
    height: 38px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #a73831;
    line-height: 38px;
    background: linear-gradient(90deg,#fbe0b5,#f9da9f);
    border-bottom-left-radius: 83px
}

.activity-combo .content .modules>div.modules-item .modules-item__select {
    position: relative;
    box-shadow: 0 2px 10px 0 hsla(0,0%,83.9%,.5),0 2px 6px 0 rgba(0,0,0,.1)
}

.activity-combo .content .modules>div.modules-item .modules-item__select .option-label {
    position: absolute;
    top: 0;
    left: 22px;
    line-height: 45px;
    color: #262728;
    z-index: 1
}

.activity-combo .content .modules>div.modules-item .modules-item__select .el-select {
    width: 100%
}

.activity-combo .content .modules>div.modules-item .modules-item__select .el-select .el-input {
    box-sizing: border-box;
    padding-left: 110px
}

.activity-combo .content .modules>div.modules-item .modules-item__select .el-select .el-input.is-focus {
    background: #f5f5f6;
    box-shadow: 0 2px 10px 0 hsla(0,0%,83.9%,.5)
}

.activity-combo .content .modules>div.modules-item .modules-item__button {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    line-height: 50px;
    height: 50px;
    cursor: pointer;
    font-size: 16px;
    color: #fff;
    text-align: center;
    text-shadow: 0 2px 10px hsla(0,0%,83.9%,.5);
    background: url(http://www.haoio.cn/nuxt-static/img/recommend-buy-bg.3a76f1f.png) no-repeat;
    background-size: cover
}

.activity-combo .content .modules>div.modules-item .modules-item__button:hover {
    background-image: url(http://www.haoio.cn/nuxt-static/img/recommend-buy-hover-bg.b5f3a6a.png)
}

.activity-combo .content .modules>div.modules-item .modules-item__button a {
    color: #fff
}

.activity-combo .content .modules>div.modules-item .modules-item__label {
    padding-left: 22px;
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start
}

.activity-combo .content .modules>div.modules-item .modules-item__label li {
    height: 21px;
    box-sizing: border-box;
    margin-right: 8px;
    padding: 3px 7px;
    font-size: 11px;
    color: #ea3a3a;
    line-height: 15px;
    border-radius: 2px
}

.activity-combo .content .modules>div.modules-item .modules-item__label li.style1 {
    background: #ea3a3a;
    color: #fff;
    box-shadow: 0 2px 10px 0 hsla(0,0%,83.9%,.5)
}

.activity-combo .content .modules>div.modules-item .modules-item__label li.style2 {
    box-shadow: 0 2px 10px 0 hsla(0,0%,83.9%,.5);
    border: 1px solid #ea3a3a
}

.activity-combo .content .modules>div.modules-item .modules-item__label li:last-child {
    margin-right: 0
}

.activity-combo .content .modules>div.modules-item .ws-activity-desc {
    padding: 20px 20px 0 22px
}

.activity-combo .content .modules>div.modules-item .ws-activity-price {
    padding: 14px 20px 20px 22px
}

.activity-combo .content .modules>div.modules-item .ws-activity-price p:last-child {
    margin-bottom: 0
}

.activity-combo .combo-mask-container {
    width: 100%;
    height: 100%
}

.activity-combo .combo-mask-bg {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.5);
    z-index: 20
}

.activity-combo .combo-mask-content {
    position: fixed;
    top: calc(50% - 263px);
    left: calc(50% - 263px);
    padding: 0 26px 26px;
    width: 526px;
    box-sizing: border-box;
    background: #fff;
    z-index: 100
}

.activity-combo .combo-mask-content .combo-mask-content-title {
    padding: 34px 0 32px;
    font-size: 20px;
    font-weight: 400;
    color: #000;
    line-height: 28px
}

.activity-combo .combo-mask-content .combo-mask-content-title .close {
    float: right;
    cursor: pointer
}

.activity-combo .combo-mask-content .combo-mask-content-info {
    max-height: 380px;
    overflow: auto
}

.activity-combo .combo-mask-content .combo-mask-content-info::-webkit-scrollbar {
    width: 4px
}

.activity-combo .combo-mask-content .combo-mask-content-info::-webkit-scrollbar-thumb {
    width: 4px;
    background: #dfe8f6;
    border-radius: 2px
}

.activity-combo .combo-mask-content .combo-mask-content-info::-webkit-scrollbar-track {
    width: 4px;
    background: #f4f4f4;
    border-radius: 2px
}

.activity-combo .combo-mask-content .combo-mask-content-info .ws-activity-rule {
    padding-right: 26px
}

.activity-combo .combo-mask-content .combo-mask-content-button {
    margin-top: 21px;
    float: right;
    width: 90px;
    height: 36px;
    font-size: 14px;
    color: #fff;
    line-height: 36px;
    text-align: center;
    background: #2b66ff;
    cursor: pointer
}

.activity-combo .combo-mask-content .combo-mask-content-button:hover {
    color: #fff;
    background: #548aff
}

.ws-web-activity .ws-activity-banner {
    height: 350px
}

.start-quick-start .content {
    max-width: 1200px;
    margin: 0 auto
}

.start-quick-start .content>h3 {
    text-align: center;
    margin-top: 50px;
    font-size: 30px;
    color: #000;
    line-height: 40px
}

.start-quick-start .content>p {
    text-align: center;
    margin-top: 12px;
    font-size: 16px;
    font-weight: 400;
    color: #666;
    line-height: 22px
}

.start-quick-start .content .card-list {
    padding-top: 46px;
    padding-bottom: 55px;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start
}

.start-quick-start .content .card-list-item {
    margin-right: 16px;
    margin-bottom: 16px;
    padding: 30px 26px 26px 23px;
    width: 389px;
    height: 180px;
    background: #fff;
    box-shadow: 0 2px 5px -4px rgba(0,0,0,.5),0 2px 16px 0 rgba(0,0,0,.16);
    border-radius: 6px;
    box-sizing: border-box;
    border: 1px solid transparent
}

.start-quick-start .content .card-list-item a {
    display: block;
    height: 100%
}

.start-quick-start .content .card-list-item h4 {
    margin-bottom: 12px;
    font-size: 20px;
    font-weight: 700;
    color: #000;
    line-height: 26px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.start-quick-start .content .card-list-item p {
    font-size: 16px;
    color: rgba(0,0,0,.65);
    line-height: 30px;
    height: 90px;
    overflow: hidden
}

.start-quick-start .content .card-list-item:nth-child(3n) {
    margin-right: 0
}

.start-quick-start .content .card-list-item:hover {
    border-color: #2b66ff
}

.start-quick-start .content .card-list-item:hover h4 {
    color: #2b66ff
}

.ws-web-start .start-banner {
    height: 330px
}

.ws-web-certification_authority {
    padding: 70px 0 0;
    margin: 0 auto;
    background-color: #f7fafe
}

.ws-web-certification_authority .title {
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px;
    font-weight: 400;
    text-align: center;
    padding-bottom: 60px
}

.ws-web-certification_authority .content {
    text-align: center;
    margin-bottom: 38px
}

.ws-web-certification_authority .content .content-row {
    display: inline-block;
    text-align: left;
    margin-bottom: 32px;
    min-width: 1248px
}

.ws-web-certification_authority .content .content-row .content-item {
    display: inline-block;
    width: 368px;
    height: 174px;
    margin: 0 24px;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    border-radius: 2px;
    background-color: #fff;
    text-align: center
}

.ws-web-certification_authority .content .content-row .content-item .license-img {
    width: 162px;
    height: 90px;
    margin-top: 20px
}

.ws-web-certification_authority .content .content-row .content-item .license-img-trust {
    width: 162px;
    height: 90px;
    margin-top: 20px;
    margin-left: 46px
}

.ws-web-certification_authority .content .content-row .content-item .cloud-trust {
    right: -50px;
    position: relative;
    top: -62px
}

.ws-web-certification_authority .content .content-row .content-item .desc {
    font-size: 18px;
    color: rgba(0,0,0,.85);
    line-height: 30px;
    margin-top: 10px
}

.ws-web-certification_authority .certification-authority-img {
    background: url(http://www.haoio.cn/nuxt-static/img/certification-authority-bg.b2e4e9a.png) no-repeat 50%;
    height: 376px;
    background-size: cover;
    padding: 70px 0
}

.ws-web-certification_authority .certification-authority-img .certification-container {
    width: 994px;
    height: 376px;
    margin: 0 auto;
    display: flex
}

.ws-web-certification_authority .certification-authority-img .certification-container .certification-container-title {
    font-size: 30px;
    color: hsla(0,0%,100%,.85);
    line-height: 48px;
    margin: 164px 56px 164px 0;
    display: inline-block
}

.ws-web-certification_authority .certification-authority-img .certification-container .certification-container-desc {
    width: 434px;
    height: 288px;
    display: inline-block;
    padding: 44px 97px;
    background-color: #fff
}

.ws-web-certification_authority .certification-authority-img .certification-container .certification-container-desc li {
    font-size: 16px;
    color: rgba(0,0,0,.65);
    line-height: 24px;
    margin-bottom: 12px;
    width: 418px
}

.ws-web-certification_authority .certification-authority-img .certification-container .certification-container-desc li .dot {
    width: 4px;
    height: 4px;
    background: rgba(0,0,0,.35);
    display: block;
    position: relative;
    left: -10px;
    top: 14px;
    border-radius: 5px
}

.ws-web-company_license {
    padding: 70px 0 38px
}

.ws-web-company_license .title {
    font-weight: 400;
    text-align: center;
    padding-bottom: 60px;
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px
}

.ws-web-company_license .content-row {
    text-align: center;
    margin-bottom: 32px
}

.ws-web-company_license .content-row .content-item {
    display: inline-block;
    width: 518px;
    height: 98px;
    margin: 0 24px;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    background: url(http://www.haoio.cn/nuxt-static/img/company-license-bg.12e69d4.png) no-repeat 100%;
    background-position: 95%
}

.ws-web-company_license .content-row .content-item span {
    font-size: 20px;
    color: rgba(0,0,0,.85);
    line-height: 30px;
    display: block;
    margin: 34px auto 34px 48px;
    text-align: left
}

.ws-web-qualification_banner {
    background: url(http://www.haoio.cn/nuxt-static/img/compliance-qualification-banner.6d4eab3.png) no-repeat 50%;
    height: 105px;
    background-size: cover;
    padding-top: 75px
}

.ws-web-qualification_banner .title {
    text-align: center;
    padding-bottom: 8px;
    font-size: 36px;
    font-weight: 400;
    color: hsla(0,0%,100%,.95);
    line-height: 41px
}

.ws-web-qualification_banner .desc {
    text-align: center;
    max-width: 950px;
    margin: 0 auto;
    padding-bottom: 60px;
    font-size: 20px;
    color: hsla(0,0%,100%,.5);
    line-height: 30px
}

.ws-web-union_organization {
    text-align: center;
    padding-top: 70px;
    overflow: hidden;
    background: #f7fafe
}

.ws-web-union_organization .title {
    font-weight: 500;
    margin-bottom: 60px;
    letter-spacing: 3px;
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px
}

.ws-web-union_organization .content {
    text-align: center;
    margin-bottom: 38px
}

.ws-web-union_organization .content .content-row {
    display: inline-block;
    text-align: left;
    margin-bottom: 32px;
    min-width: 1248px
}

.ws-web-union_organization .content .content-row .content-item {
    display: inline-block;
    width: 285px;
    height: 158px;
    margin: 0 10px;
    text-align: center
}

.ws-web-union_organization .content .content-row .content-item .organization-img {
    width: 100%;
    height: 112px
}

.ws-web-union_organization .content .content-row .content-item .desc {
    font-size: 18px;
    color: rgba(0,0,0,.85);
    line-height: 30px;
    margin-top: 13px
}

.ws-web-assurance_banner {
    background: url(http://www.haoio.cn/nuxt-static/img/service-assurance-banner.3023e5b.png) no-repeat 50%;
    height: 105px;
    background-size: cover;
    padding-top: 75px
}

.ws-web-assurance_banner .title {
    text-align: center;
    padding-bottom: 8px;
    font-size: 36px;
    font-weight: 400;
    color: hsla(0,0%,100%,.95);
    line-height: 41px
}

.ws-web-assurance_banner .desc {
    text-align: center;
    max-width: 950px;
    margin: 0 auto;
    padding-bottom: 60px;
    font-size: 20px;
    color: hsla(0,0%,100%,.5);
    line-height: 30px
}

.ws-web-service_advantage {
    text-align: center;
    padding-top: 70px;
    overflow: hidden;
    background: #f7fafe
}

.ws-web-service_advantage .title {
    font-weight: 500;
    margin-bottom: 60px;
    letter-spacing: 3px;
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px
}

.ws-web-service_advantage .content {
    text-align: center;
    margin-bottom: 38px
}

.ws-web-service_advantage .content .content-row {
    display: inline-block;
    text-align: left;
    margin-bottom: 32px;
    min-width: 1248px
}

.ws-web-service_advantage .content .content-row .content-item {
    display: inline-block;
    width: 286px;
    height: 100px;
    margin: 0 85px;
    text-align: center
}

.ws-web-service_advantage .content .content-row .content-item .circle {
    display: inline-block;
    padding: 22px 25px;
    vertical-align: top;
    background-repeat: no-repeat;
    background-size: contain;
    border-radius: 50px;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35)
}

.ws-web-service_advantage .content .content-row .content-item .circle .organization-img {
    width: 50px;
    height: 50px
}

.ws-web-service_advantage .content .content-row .content-item .desc {
    font-size: 18px;
    color: rgba(0,0,0,.85);
    line-height: 30px;
    margin-top: 37px;
    display: inline-block;
    margin-left: 24px
}

.ws-web-service_advantage .content .content-row .content-item:first-child {
    margin-left: 0
}

.ws-web-service_advantage .content .content-row .content-item:last-child {
    margin-right: 0
}

@keyframes ripple {
    0% {
        opacity: 0;
        transform: scale(.1)
    }

    5% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: scale(1)
    }
}

.ws-web-service_compare {
    padding: 70px 0
}

.ws-web-service_compare .title {
    font-weight: 400;
    text-align: center;
    padding-bottom: 60px;
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px
}

.ws-web-service_compare .content {
    text-align: center
}

.ws-web-service_compare .content .table {
    width: 1200px;
    max-width: 100%;
    background-color: transparent;
    border-spacing: 0;
    border-collapse: collapse;
    margin: 0 auto
}

.ws-web-service_compare .content .table thead tr {
    border-bottom: 1px solid rgba(42,73,195,.3)
}

.ws-web-service_compare .content .table thead tr th {
    vertical-align: bottom;
    text-align: left;
    background-color: rgba(42,73,195,.15);
    font-size: 14px;
    color: rgba(0,0,0,.65);
    line-height: 20px;
    padding: 10px 0
}

.ws-web-service_compare .content .table thead tr td,.ws-web-service_compare .content .table thead tr th {
    line-height: 1.42857143;
    vertical-align: top;
    text-align: center
}

.ws-web-service_compare .content .table tbody tr th {
    background-color: rgba(42,73,195,.15);
    font-size: 14px;
    color: #515256;
    line-height: 20px
}

.ws-web-service_compare .content .table tbody tr td {
    font-size: 14px;
    color: rgba(0,0,0,.65);
    line-height: 20px
}

.ws-web-service_compare .content .table tbody tr td,.ws-web-service_compare .content .table tbody tr th {
    padding: 20px 43px;
    line-height: 1.42857143;
    vertical-align: middle;
    border-bottom: 1px solid #fff;
    text-align: center
}

.ws-web-service_compare .content .table-striped tbody tr:nth-of-type(2n) td {
    background-color: rgba(42,73,195,.03)
}

.ws-web-service_mode {
    padding: 70px 0 0
}

.ws-web-service_mode .title {
    font-weight: 400;
    text-align: center;
    padding-bottom: 60px;
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px
}

.ws-web-service_mode .content-row {
    text-align: center;
    margin-bottom: 70px;
    min-width: 1345px
}

.ws-web-service_mode .content-row .content-item {
    display: inline-block;
    max-width: 128px;
    min-width: 87px;
    height: 126px;
    margin: 0 116px;
    text-align: center;
    vertical-align: bottom;
    cursor: pointer
}

.ws-web-service_mode .content-row .content-item span {
    display: block;
    text-align: center;
    font-size: 20px;
    color: rgba(0,0,0,.85);
    line-height: 30px;
    margin-top: 16px
}

.ws-web-service_mode .content-row .content-item:hover span {
    color: #2b66ff
}

.ws-web-service_mode .content-row .content-item-img {
    width: 590px;
    height: 239px;
    margin: 0 10px;
    display: inline-block
}

.ws-web-service_mode .content-row .content-item-img-left {
    text-align: left;
    vertical-align: bottom;
    background: url(http://www.haoio.cn/nuxt-static/img/hot-line.d3173b3.png) no-repeat
}

.ws-web-service_mode .content-row .content-item-img-left h3 {
    margin: 32px auto 48px 56px;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    line-height: 30px
}

.ws-web-service_mode .content-row .content-item-img-left p {
    margin: 16px auto 0 56px;
    font-size: 16px;
    color: #fff;
    line-height: 21px
}

.ws-web-service_mode .content-row .content-item-img-right {
    text-align: left;
    color: #fff;
    background: url(http://www.haoio.cn/nuxt-static/img/sale-after.8c99082.png) no-repeat
}

.ws-web-service_mode .content-row .content-item-img-right h3 {
    margin: 32px auto 16px 56px;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    line-height: 30px
}

.ws-web-service_mode .content-row .content-item-img-right img {
    margin-left: 56px
}

.ws-web-service_mode .content-row .content-item-img-right p {
    margin: 8px auto 0 56px;
    font-size: 14px;
    color: #fff;
    line-height: 21px
}

.ws-web-service_plan {
    padding: 70px 0 0;
    margin: 0 auto;
    background-color: #f7fafe
}

.ws-web-service_plan .title {
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px;
    font-weight: 400;
    text-align: center;
    padding-bottom: 60px
}

.ws-web-service_plan .content {
    text-align: center
}

.ws-web-service_plan .content .content-row {
    display: inline-block;
    text-align: left;
    margin-bottom: 70px;
    min-width: 1220px
}

.ws-web-service_plan .content .content-row .content-item {
    display: inline-block;
    width: 221px;
    height: 244px;
    padding: 40px 32px;
    margin: 0 10px;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    border-radius: 2px;
    background-color: #fff;
    text-align: center;
    vertical-align: top
}

.ws-web-service_plan .content .content-row .content-item .license-img {
    width: 50px;
    height: 50px
}

.ws-web-service_plan .content .content-row .content-item h3 {
    font-size: 16px;
    color: rgba(0,0,0,.85);
    line-height: 24px;
    margin-top: 30px
}

.ws-web-service_plan .content .content-row .content-item .desc {
    margin-top: 12px;
    font-size: 14px;
    color: rgba(0,0,0,.5);
    line-height: 21px;
    text-align: left
}

.ws-web-case_banner {
    background: url(http://www.haoio.cn/nuxt-static/img/customer-case-banner.d313e06.png) no-repeat 50%;
    height: 245px;
    background-size: cover;
    padding-top: 40px
}

.ws-web-case_banner .title {
    font-weight: 400;
    text-align: center;
    padding-bottom: 2px;
    font-size: 36px;
    color: #fff;
    line-height: 54px;
    margin-top: 48px
}

.ws-web-case_banner .desc {
    text-align: center;
    max-width: 470px;
    margin: 0 auto;
    padding-bottom: 60px;
    font-size: 16px;
    color: #fff;
    line-height: 24px
}

.customer-case-detail__header {
    width: 100%;
    background-position: 50%;
    height: 285px;
    display: flex;
    align-items: center;
    justify-content: center
}

.customer-case-detail__header-bg-honda {
    background: url(http://www.haoio.cn/nuxt-static/img/honda.f852b3d.png) no-repeat
}

.customer-case-detail__header-bg-adidas {
    background: url(http://www.haoio.cn/nuxt-static/img/adidas.06e4a6e.png) no-repeat
}

.customer-case-detail__header-bg-pingan {
    background: url(http://www.haoio.cn/nuxt-static/img/pingan.cd9d57c.png) no-repeat
}

.customer-case-detail__header-bg-henan {
    background: url(http://www.haoio.cn/nuxt-static/img/henan.cfdaea7.png) no-repeat
}

.customer-case-detail__header-bg-huya {
    background: url(http://www.haoio.cn/nuxt-static/img/huya.5d2b95b.png) no-repeat
}

.customer-case-detail__header-bg-xishanju {
    background: url(http://www.haoio.cn/nuxt-static/img/xishanju.d81b785.png) no-repeat
}

.customer-case-detail__header-text {
    font-size: 32px;
    font-family: MicrosoftYaHei;
    color: #fff;
    line-height: 48px;
    text-shadow: 0 2px 10px rgba(0,0,0,.35)
}

.customer-case-detail__body {
    font-family: MicrosoftYaHei;
    padding: 70px 80px 70px 0;
    min-height: 800px;
    width: 1366px;
    margin: 0 auto;
    box-sizing: border-box
}

.customer-case-detail__body-sidebar {
    float: left;
    width: 450px;
    padding: 0 70px 0 83px;
    box-sizing: border-box
}

.customer-case-detail__body-sidebar-logo {
    width: 296px;
    height: 150px;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    border-radius: 2px
}

.customer-case-detail__body-sidebar-logo--honda {
    background: url(http://www.haoio.cn/nuxt-static/img/honda-logo.57260a1.png) no-repeat
}

.customer-case-detail__body-sidebar-logo--adidas {
    background: url(http://www.haoio.cn/nuxt-static/img/adidas-logo.8a56cdc.png) no-repeat
}

.customer-case-detail__body-sidebar-logo--pingan {
    background: url(http://www.haoio.cn/nuxt-static/img/pingan-logo.3667168.png) no-repeat
}

.customer-case-detail__body-sidebar-logo--henan {
    background: url(http://www.haoio.cn/nuxt-static/img/henan-logo.7198d2e.png) no-repeat
}

.customer-case-detail__body-sidebar-logo--huya {
    background: url(http://www.haoio.cn/nuxt-static/img/huya-logo.ef9d637.png) no-repeat
}

.customer-case-detail__body-sidebar-logo--xishanju {
    background: url(http://www.haoio.cn/nuxt-static/img/xishanju-logo.e5427cc.png) no-repeat
}

.customer-case-detail__body-sidebar-company {
    font-size: 20px;
    color: rgba(0,0,0,.85);
    line-height: 30px;
    margin: 36px 0 0
}

.customer-case-detail__body-sidebar-type {
    margin: 24px 0 0
}

.customer-case-detail__body-sidebar-type-title {
    font-size: 14px;
    color: rgba(0,0,0,.5);
    line-height: 21px
}

.customer-case-detail__body-sidebar-type-description {
    font-size: 16px;
    color: rgba(0,0,0,.85);
    line-height: 24px;
    margin: 8px 0 0
}

.customer-case-detail__body-sidebar-related {
    margin: 24px 0 0
}

.customer-case-detail__body-sidebar-related-title {
    font-size: 14px;
    color: rgba(0,0,0,.5);
    line-height: 21px
}

.customer-case-detail__body-sidebar-related-description {
    font-size: 16px;
    color: #2b66ff;
    line-height: 24px
}

.customer-case-detail__body-sidebar-related-description-item {
    margin: 8px 0 0
}

.customer-case-detail__body-content {
    overflow: hidden
}

.customer-case-detail__body-content-header {
    height: 36px;
    font-size: 24px;
    font-family: MicrosoftYaHei;
    color: rgba(0,0,0,.85);
    line-height: 36px
}

.customer-case-detail__body-content-header-title {
    float: left;
    margin: 0 20px 0 0
}

.customer-case-detail__body-content-header-line {
    overflow: hidden;
    border-bottom: 1px solid rgba(0,0,0,.1);
    height: 19px
}

.customer-case-detail__body-content-description {
    background: #f7fafe;
    padding: 24px;
    margin: 24px 0 0
}

.customer-case-detail__body-content-why {
    margin: 70px 0 0
}

.customer-case-detail__body-content-why-bg {
    width: 100%;
    margin: 24px 0 0;
    background-position: 50%;
    padding: 60px 130px;
    box-sizing: border-box;
    color: rgba(0,0,0,.65);
    line-height: 21px;
    word-break: break-all
}

.customer-case-detail__body-content-why-bg-honda {
    background: url(http://www.haoio.cn/nuxt-static/img/honda-bg.2bb35c8.png) no-repeat;
    height: 292px
}

.customer-case-detail__body-content-why-bg-adidas {
    background: url(http://www.haoio.cn/nuxt-static/img/adidas-bg.2779114.png) no-repeat;
    height: 391px
}

.customer-case-detail__body-content-why-bg-pingan {
    background: url(http://www.haoio.cn/nuxt-static/img/pingan-bg.071998d.png) no-repeat;
    height: 291px
}

.customer-case-detail__body-content-why-bg-henan {
    background: url(http://www.haoio.cn/nuxt-static/img/henan-bg.4d86fd6.png) no-repeat;
    height: 312px
}

.customer-case-detail__body-content-why-bg-huya {
    background: url(http://www.haoio.cn/nuxt-static/img/huya-bg.756bb6e.png) no-repeat;
    height: 270px
}

.customer-case-detail__body-content-why-bg-xishanju {
    background: url(http://www.haoio.cn/nuxt-static/img/xishanju-bg.7a12423.png) no-repeat;
    height: 291px
}

.customer-case-detail__body-content-why-text {
    width: 100%;
    box-sizing: border-box;
    color: rgba(0,0,0,.65);
    line-height: 21px;
    word-break: break-all;
    padding: 0 0 0 20px
}

.customer-case-detail__body-content-why-text p {
    position: relative
}

.customer-case-detail__body-content-why-text p .vertical-line {
    width: 2px;
    height: 8px;
    background: rgba(0,0,0,.4);
    border-radius: 1px;
    display: block;
    position: absolute;
    left: -12px;
    top: 8px;
    z-index: 1000
}

.customer-case-detail__body-content-result {
    margin: 70px 0 0
}

.customer-case-detail__body-content-logo--honda-bg {
    background: url(http://www.haoio.cn/nuxt-static/img/honda-bg.2bb35c8.png) no-repeat
}

.ws-web-industry_case {
    background: url(http://www.haoio.cn/nuxt-static/img/industry-case-bg.0d14981.png) no-repeat 50%;
    background-size: cover;
    padding: 70px 0 0;
    margin: 0 auto
}

.ws-web-industry_case .title {
    font-weight: 400;
    text-align: center;
    padding-bottom: 60px;
    font-size: 32px;
    color: #fff;
    line-height: 48px
}

.ws-web-industry_case .content {
    text-align: center
}

.ws-web-industry_case .content .industryList {
    width: 1000px;
    margin: 0 auto
}

.ws-web-industry_case .content .industryList ul {
    width: 100%;
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    color: #717181;
    font-size: 16px;
    line-height: 60px
}

.ws-web-industry_case .content .industryList ul li {
    text-align: center;
    cursor: pointer;
    font-size: 18px;
    color: #fff;
    line-height: 27px;
    margin: 0 9px;
    padding: 4px 14px;
    opacity: .8;
    border: 1px solid #fff
}

.ws-web-industry_case .content .industryList ul li.active {
    background: #3066ef;
    border: 1px solid #3066ef
}

.ws-web-industry_case .content .industryList ul li:hover {
    color: #3066ef;
    opacity: .8;
    background-color: transparent;
    border: 1px solid #3066ef
}

.ws-web-industry_case .content .tabCon {
    width: 1016px;
    margin: 0 auto;
    color: #999;
    font-size: 14px
}

.ws-web-industry_case .content .tabCon .content-row {
    text-align: left;
    display: inline-block;
    margin-bottom: 55px;
    margin-top: 25px;
    width: 100%
}

.ws-web-industry_case .content .tabCon .content-row .license-img {
    width: 220px;
    height: 82px;
    margin: 15px 17px
}

.ws-web-selected_cases {
    padding: 70px 0 0
}

.ws-web-selected_cases .title {
    font-weight: 400;
    text-align: center;
    font-size: 32px;
    color: rgba(0,0,0,.85);
    line-height: 48px;
    margin-bottom: -60px
}

.ws-web-selected_cases .content {
    padding-top: 120px;
    background: url(http://www.haoio.cn/nuxt-static/img/selected-cases-bg.3ca2e82.png) no-repeat 50%;
    background-size: 100%
}

.ws-web-selected_cases .content .content-row {
    text-align: center;
    padding-bottom: 70px;
    min-width: 1345px
}

.ws-web-selected_cases .content .content-row .content-item-little {
    display: inline-block;
    width: 235px;
    height: 383px;
    margin: 0 7px;
    text-align: center;
    vertical-align: bottom
}

.ws-web-selected_cases .content .content-row .content-item-little .content-item-little-img {
    background: #fff;
    box-shadow: 0 2px 10px 0 rgba(5,16,28,.25);
    width: 235px;
    height: 184px
}

.ws-web-selected_cases .content .content-row .content-item-little .content-item-little-img .content-item-little-huya {
    width: 159px;
    height: 63px;
    margin: 61px 38px 60px
}

.ws-web-selected_cases .content .content-row .content-item-little .content-item-little-img .content-item-little-west {
    width: 130px;
    height: 57px;
    margin: 64px 52px 63px 53px
}

.ws-web-selected_cases .content .content-row .content-item-little .content-item-little-img .content-item-little-adidas {
    width: 98px;
    height: 76px;
    margin: 47px 59px 47px 60px
}

.ws-web-selected_cases .content .content-row .content-item-little .content-item-little-img .content-item-little-broadcast {
    width: 116px;
    height: 89px;
    margin: 38px 46px 37px 47px
}

.ws-web-selected_cases .content .content-row .content-item-little .content-item-little-img .content-item-little-hover {
    position: relative;
    width: 235px;
    height: 184px;
    top: -190px;
    display: none
}

.ws-web-selected_cases .content .content-row .content-item-little .content-item-little-img .content-item-little-hover a {
    border-radius: 2px;
    border: 1px solid #2a49c3;
    font-size: 16px;
    color: #2a49c3;
    line-height: 30px;
    background-color: transparent;
    margin-top: 122px;
    cursor: pointer;
    display: inline-block;
    padding: 0 16px
}

.ws-web-selected_cases .content .content-row .content-item-little .content-item-little-img:hover .content-item-little-huya {
    margin: 48px 38px 73px
}

.ws-web-selected_cases .content .content-row .content-item-little .content-item-little-img:hover .content-item-little-west {
    margin: 43px 52px 84px 53px
}

.ws-web-selected_cases .content .content-row .content-item-little .content-item-little-img:hover .content-item-little-adidas {
    margin: 34px 59px 74px 60px
}

.ws-web-selected_cases .content .content-row .content-item-little .content-item-little-img:hover .content-item-little-broadcast {
    margin: 23px 46px 72px 47px
}

.ws-web-selected_cases .content .content-row .content-item-little .content-item-little-img:hover .content-item-little-hover {
    display: block
}

.ws-web-selected_cases .content .content-row .content-item-big {
    display: inline-block;
    width: 343px;
    height: 383px;
    margin: 0 8px;
    text-align: center;
    vertical-align: bottom;
    box-shadow: 0 2px 10px 0 rgba(5,16,28,.25)
}

.ws-web-selected_cases .content .content-row .content-item-big .content-item-little-honda {
    width: 260px;
    height: 49px;
    margin-top: 167px
}

.ws-web-selected_cases .content .content-row .content-item-big .content-item-little-safe {
    width: 165px;
    height: 82px;
    margin-top: 148px
}

.ws-web-selected_cases .content .content-row .content-item-big .content-item-big-hover {
    position: relative;
    width: 343px;
    height: 383px;
    top: -130px;
    display: none;
    padding-top: 144px
}

.ws-web-selected_cases .content .content-row .content-item-big .content-item-big-hover p {
    font-size: 16px;
    color: #fff;
    line-height: 30px;
    width: 176px;
    margin: 0 auto
}

.ws-web-selected_cases .content .content-row .content-item-big .content-item-big-hover a {
    background-color: transparent;
    margin-top: 36px;
    border-radius: 2px;
    border: 1px solid #fff;
    font-size: 16px;
    color: #fff;
    line-height: 30px;
    cursor: pointer;
    display: inline-block;
    padding: 0 16px
}

.ws-web-selected_cases .content .content-row .content-item-big:hover .content-item-little-honda {
    margin-top: 75px
}

.ws-web-selected_cases .content .content-row .content-item-big:hover .content-item-little-safe {
    margin-top: 47px
}

.ws-web-selected_cases .content .content-row .content-item-big:hover .content-item-big-hover {
    display: block
}

.ws-web-selected_cases .content .content-row .content-item-gagc {
    background: url(http://www.haoio.cn/nuxt-static/img/gagc-bg.ae3b2e2.png) no-repeat 50%;
    background-size: 100%
}

.ws-web-selected_cases .content .content-row .content-item-safe {
    background: url(http://www.haoio.cn/nuxt-static/img/safe-bg.37c1144.png) no-repeat 50%;
    background-size: 100%
}

.ws-web-selected_cases .content .content-row .content-item-img {
    width: 590px;
    height: 239px;
    margin: 0 10px;
    display: inline-block
}

.ws-chat-fixed-tirgger-button {
    width: 20px;
    height: 20px;
    margin: 20px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    background-image: url(http://www.haoio.cn/nuxt-static/img/ai-support.9172f09.svg);
    cursor: pointer;
    transition: width .3s ease
}

.ws-chat-session-modal {
    position: fixed;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,.3);
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    border-radius: 2px
}

.ws-chat-session-modal__header {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 50px;
    padding: 12px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    flex-shrink: 0;
    background-image: linear-gradient(90deg,rgba(249,251,255,.8),rgba(226,236,254,.8));
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px)
}

.ws-chat-session-modal__title {
    font-size: 14px;
    color: var(--pt-global-subtitle-text-color);
    line-height: 46px;
    padding: 0 4px
}

.ws-chat-session-modal__title img {
    vertical-align: middle
}

.ws-chat-session-modal__title-text {
    display: inline-block;
    vertical-align: middle
}

.ws-chat-session-modal__extra {
    margin-left: 16px;
    display: flex;
    align-items: center;
    padding: 4px
}

.ws-chat-session-modal__extra span {
    padding: 0;
    font-size: 16px;
    width: 16px;
    height: 16px;
    line-height: 16px;
    color: var(--pt-global-color-gray-8);
    cursor: pointer
}

.ws-chat-session-modal__extra span+span {
    margin-left: 16px
}

.ws-chat-session-modal__content {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    flex: 1;
    overflow: hidden;
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    padding-top: 5px
}

.ws-chat-session-modal__iframe {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border-width: 0
}

.ws-chat-session-modal__dragbox {
    display: contents;
    background: transparent
}

.ws-chat-session-modal__dragbox-trigger {
    display: block;
    position: absolute;
    z-index: 1;
    background: transparent
}

.ws-chat-session-modal__dragbox-trigger.is-b:hover,.ws-chat-session-modal__dragbox-trigger.is-t:hover {
    cursor: n-resize
}

.ws-chat-session-modal__dragbox-trigger.is-l:hover,.ws-chat-session-modal__dragbox-trigger.is-r:hover {
    cursor: e-resize
}

.ws-chat-session-modal__dragbox-trigger.is-lt {
    z-index: 2
}

.ws-chat-session-modal__dragbox-trigger.is-lt:hover {
    cursor: nw-resize
}

.ws-chat-session-modal__dragbox-trigger.is-lb {
    z-index: 2
}

.ws-chat-session-modal__dragbox-trigger.is-lb:hover {
    cursor: sw-resize
}

.ws-chat-session-modal__dragbox-trigger.is-rt {
    z-index: 2
}

.ws-chat-session-modal__dragbox-trigger.is-rt:hover {
    cursor: ne-resize
}

.ws-chat-session-modal__dragbox-trigger.is-rb {
    z-index: 2
}

.ws-chat-session-modal__dragbox-trigger.is-rb:hover {
    cursor: se-resize
}

.ws-chat-session-modal.is-draggable .ws-chat-session-modal__header:hover {
    cursor: move
}

.portal-mobi-header {
    width: 100%
}

.portal-mobi-header.is-open {
    position: fixed;
    top: 0;
    bottom: 0;
    background-color: rgba(0,0,0,.75)
}

.portal-mobi-header__wrap {
    position: relative;
    padding: 14px 16px;
    height: 50px;
    background-color: #fff;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box
}

.portal-mobi-header__logo {
    width: 120px;
    height: 100%;
    font-size: 20px;
    line-height: 29px
}

.portal-mobi-header__logo a {
    color: #fff
}

.portal-mobi-header__logo img {
    max-height: 100%
}

.portal-mobi-header__language-list {
    margin: 20px 0;
    padding: 0 10px
}

.portal-mobi-header__language-list:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.portal-mobi-header__language-list .btn-language {
    display: inline-block;
    padding: 6px 15px;
    background: #2b66ff;
    color: #fff;
    width: 45%;
    border: none;
    height: 31px
}

.portal-mobi-header__language-list .btn-language:first-child {
    float: left
}

.portal-mobi-header__language-list .btn-language:last-child {
    float: right
}

.portal-mobi-header__tools .svg-icon-contain {
    line-height: 28px;
    font-size: 20px;
    color: #262626;
    margin: 0 8px
}

.portal-mobi-header__cell-link {
    padding: 0 15px!important;
    background: none!important;
    background-color: #3b3b3b!important
}

.portal-mobi-header__cell-link .nut-cell-box {
    background: none!important;
    border-bottom: 1px solid #444;
    min-height: 40px!important
}

.portal-mobi-header__cell-link .nut-cell-box .nut-icon {
    color: #fff!important;
    width: 14px!important
}

.portal-mobi-header__nav-wrap {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    overflow-y: auto
}

.portal-mobi-header__user-drawer {
    background-color: #383838
}

.portal-mobi-header__user {
    padding: 15px 10px
}

.portal-mobi-header__user .button {
    background-color: #2b66ff;
    text-align: center;
    width: 48%;
    padding: 6px 0
}

.portal-mobi-header__user .button.btn-register {
    float: left
}

.portal-mobi-header__user .button.btn-login {
    float: right
}

.portal-mobi-header .authentication-msg {
    display: inline-block;
    font-size: 14px;
    margin: 0 5px
}

.portal-mobi-header .authentication-msg i {
    margin-right: 5px
}

.portal-mobi-header .authentication-msg a {
    color: #fff;
    display: inline-block;
    height: auto;
    line-height: normal;
    padding: 0
}

.portal-mobi-header .authentication-msg .authentication-msg--warn {
    color: orange
}

.portal-mobi-header .authentication-msg .authentication-msg--warn a {
    text-decoration: underline;
    color: orange
}

.portal-mobi-header .authentication-msg .authentication-msg--success {
    color: green
}

.portal-mobi-header .mobi-nav-list {
    background-color: #fff
}

.portal-mobi-header .mobi-nav-list li.is-open .icon-menudrop {
    transform: rotate(-90deg)
}

.portal-mobi-header .mobi-nav-list__item-name {
    color: #595959;
    display: block;
    padding: 16px;
    margin: 0 16px;
    position: relative;
    font-size: 15px;
    border-bottom: 1px solid #bfbfbf
}

.portal-mobi-header .mobi-nav-list .icon-menudrop {
    position: absolute;
    right: 16px;
    transform: rotate(90deg);
    transition: transform .3s
}

.mobi-header-lang {
    background-color: hsla(0,0%,100%,.95);
    font-size: 13px
}

.mobi-header-lang a {
    padding: 8px 48px;
    display: block;
    color: #595959
}

.mobi-header-lang a.is-active {
    color: #2b66ff
}

.mobi-header-products {
    background-color: hsla(0,0%,100%,.95);
    font-size: 13px
}

.mobi-header-products__list li.is-active .mobi-header-products__item-children {
    position: static;
    display: block
}

.mobi-header-products__list li.is-active .svg-icon-contain {
    transform: rotate(-90deg)
}

.mobi-header-products__item-name {
    padding: 8px 48px;
    position: relative
}

.mobi-header-products__item-name .svg-icon-contain {
    position: absolute;
    right: 32px;
    top: 8px;
    transition: transform .3s;
    transform: rotate(90deg)
}

.mobi-header-products__item-children {
    background-color: #f0f4fa;
    display: none;
    transition: all .3s
}

.mobi-header-products__item-children p a {
    display: block;
    color: #7f7f7f;
    padding: 8px 32px 8px 60px
}

.portal-mobi-toplan {
    position: relative
}

.portal-mobi-toplan__user {
    padding: 10px
}

.portal-mobi-toplan__current {
    color: #fff;
    height: 30px;
    line-height: 30px;
    cursor: pointer
}

.portal-mobi-toplan__current:hover {
    color: #2b66ff
}

.portal-mobi-toplan__current i {
    border-color: #fff transparent transparent;
    border-style: solid;
    border-width: 5px 4px;
    display: inline-block;
    vertical-align: -2px
}

.portal-mobi-toplan:hover .ws-web-toplan__drop,.portal-mobi-toplan:hover .ws-web-toplan__logout {
    display: block
}

.portal-mobi-toplan__drop {
    display: none;
    position: absolute;
    right: 0;
    top: 60px;
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    border-radius: 2px;
    z-index: 1
}

.portal-mobi-toplan__drop:before {
    content: "";
    position: absolute;
    border-color: transparent transparent #fff;
    border-style: solid;
    border-width: 5px 4px;
    display: inline-block;
    top: -10px;
    right: 16px
}

.portal-mobi-toplan__logout a {
    color: #fff
}

.portal-mobi-toplan.ws-web-toplan__user {
    float: right
}

.portal-mobi-toplan.ws-web-toplan__user .ws-web-toplan__current {
    display: inline-block;
    height: 60px;
    line-height: 60px;
    padding: 0;
    font-size: 16px
}

.portal-mobi-toplan.ws-web-toplan__user .ws-web-toplan__current .svg-icon-contain {
    margin-right: 10px;
    vertical-align: sub;
    font-size: 26px
}

.portal-mobi-footer {
    color: #525252;
    font-size: 12px;
    padding: 5px 10px 15px;
    background: linear-gradient(90deg,#edfaff,#c7e9fe 35%,#edfaff 65%,#c7e9fe)
}

.portal-mobi-footer a {
    color: #525252!important
}

.portal-mobi-footer__service_list {
    list-style: none
}

.portal-mobi-footer__service_list_item {
    padding: 10px 0;
    border-bottom: 1px solid rgba(75,75,75,.2)
}

.portal-mobi-footer__service_list_item:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.portal-mobi-footer__service_list_item h3 {
    font-size: 14px;
    color: #000;
    margin-bottom: 5px
}

.portal-mobi-footer__service_list_item li {
    margin-right: 10px;
    float: left
}

.portal-mobi-footer__contactUs {
    padding: 10px 0;
    border-bottom: 1px solid rgba(75,75,75,.2)
}

.portal-mobi-footer__contactUs h3 {
    font-size: 14px;
    color: #000;
    margin-bottom: 5px
}

.portal-mobi-footer__contactUs .ws_service_sublist li {
    float: left;
    margin-right: 10px
}

.portal-mobi-footer__record {
    padding: 10px 0;
    text-align: center
}

.portal-mobi-footer__copy-right {
    color: #aaa;
    text-align: center
}

@media screen and (max-width: 768px) {
    .mobile .aftersale-dialog .el-dialog__header {
        padding:15px 15px 10px
    }

    .mobile .aftersale-dialog .el-dialog__header .el-dialog__title {
        font-size: 18px
    }

    .mobile .aftersale-dialog .el-dialog__body p {
        margin-bottom: 15px
    }

    .mobile .aftersale-dialog .el-dialog__footer .cancel-btn,.mobile .aftersale-dialog .el-dialog__footer .confirm-btn {
        width: 80px
    }
}

.mobile .nut-collapse-item .collapse-item .collapse-icon {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAA4klEQVRYR+2V0Q2DMAxE7bBN2YcZUjFE6RComYF92m1IqiBFAhGwnUaiH+YT7PPTxTkQLn7w4vmgAOqAOvB/Dozja2ganKy1n5oZ4Zy7zXPo+v4+rHU3DsThaMwDEN8GfFcLIg73YCYIoQ3eP9cQG4B1YS0ISnO3A1SD5Fg4Wtkl5DRSIFyNw1vAFciBSHpPr6FEKIFIe8gckAhKahMwCRALOcKcmtxxsQAoiNLhUZcNcAQR36eQKckOEUAOYrE1hLZkuNiB7KYvKuXRLXZgBwEAv/w3igGoJOR+VwB1QB1QB74DNewh2yXT6wAAAABJRU5ErkJggg0KLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLTk1Mjc2MDYwNTU3MzQyMzA2NjUzMTMwNS0tDQo=)
}

.mobile .nut-tab {
    padding: 0;
    border: 0
}

.mobile .nut-cell .nut-cell-title {
    color: #fff
}

.mobile .nut-subsidenavbar .sub-sidenavbar-list {
    overflow: hidden
}

.mobile .nut-subsidenavbar .item-title {
    font-size: 14px;
    color: #9b9ea0;
    border-bottom: 1px solid #444;
    background-color: #3b3b3b
}

.mobile .nut-subsidenavbar .item-title .sidenavbar-title {
    color: #fff
}

.mobile .nut-subsidenavbar .sidenavbar-icon i {
    color: #fff!important
}

.mobile .nut-swiper .nut-swiper-pagination .swiper-pagination-bullet {
    height: 2px;
    width: 20px;
    border-radius: inherit
}

.mobile .nut-icon {
    width: 14px;
    height: 14px
}

.mobile .btn-more {
    margin-top: 5px
}

.mobile .btn-more a {
    font-size: 16px!important
}

@media screen and (max-width: 768px) {
    .mobile .investment__header {
        height:120px;
        font-size: 30px
    }

    .mobile .investment__header>div,.mobile .investment__header>h2 {
        font-size: 30px!important;
        padding: 0 16px
    }

    .mobile .investment .investment__body-header p {
        font-size: 14px;
        text-align: left;
        padding: 0 15px
    }

    .mobile .investment .investment__body-header p .investment__body-header-blue {
        text-align: center
    }

    .mobile .investment .investment__body {
        padding: 20px 0 0;
        width: auto
    }

    .mobile .investment .investment__body .investment__body-header .investment__body-header-blue {
        text-align: center
    }

    .mobile .investment .investment__body .investment__body-content {
        padding: 0 15px 10px;
        width: auto
    }

    .mobile .investment .investment__body .investment__body-content .investment__body-form-item {
        height: auto
    }

    .mobile .investment .investment__body .investment__body-content .investment__body-form-item .investment__body-form-item-label {
        float: none;
        text-align: left
    }

    .mobile .investment .investment__body .investment__body-content .investment__body-form-item .investment__body-form-item-input {
        float: none
    }

    .mobile .investment .investment__body .investment__body-content .investment__body-form-item .investment__body-form-item-input input {
        width: 100%
    }

    .mobile .investment .investment__body .investment__body-content .investment__body-form-item .investment__body-form-item-input input.verify-code-input {
        width: 60%
    }

    .mobile .investment .investment__body .investment__body-address {
        padding: 10px 15px
    }

    .mobile .investment .investment__body .investment__body-address .investment__body-address-content {
        width: auto;
        height: auto
    }

    .mobile .investment .investment__body .investment__body-address .investment__body-address-content .investment__body-address-map {
        float: none;
        width: 100%
    }

    .mobile .investment .investment__body .investment__body-address .investment__body-address-content .investment__body-address-map img {
        width: 100%
    }

    .mobile .investment .investment__body .investment__body-address .investment__body-address-content .investment__body-address-description {
        padding: 16px 10px
    }

    .mobile .investment .investment__body .investment__body-address .investment__body-address-content .investment__body-address-description .investment__body-address-description-investorRelations,.mobile .investment .investment__body .investment__body-address .investment__body-address-content .investment__body-address-description .investment__body-address-description-qrcode {
        text-align: center
    }

    .mobile .investment .verify-code-pic {
        width: 30%
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-page__contactUs .ws-web-contactUs__banner {
        height:120px
    }

    .mobile .ws-web-page__contactUs .ws-web-contactUs__banner .ws-web-contactUs__banner-tit {
        font-size: 30px
    }

    .mobile .ws-web-page__contactUs .ws-web-contactUs__map {
        padding: 0 20px;
        height: auto;
        width: auto
    }

    .mobile .ws-web-page__contactUs .ws-web-contactUs__map img {
        width: 100%
    }

    .mobile .ws-web-page__contactUs .ws-web-contactUs__body {
        padding: 10px 0
    }

    .mobile .ws-web-page__contactUs .ws-web-contactUs__body .ws-web-contactUs__tit {
        font-weight: 400;
        font-size: 26px;
        margin-bottom: 10px
    }

    .mobile .ws-web-page__contactUs .ws-web-contactUs__body .ws-web-contactUs__list {
        width: auto;
        margin: 0 16px
    }

    .mobile .ws-web-page__contactUs .ws-web-contactUs__body li {
        width: 100%;
        margin: 0 0 10px;
        height: auto
    }

    .mobile .ws-web-page__contactUs .ws-web-contactUs__body li p {
        margin-top: 5px;
        font-size: 14px
    }

    .mobile .ws-web-page__contactUs .ws-web-contactUs__body li :before {
        background-size: contain;
        width: 27px;
        left: 15px;
        top: 9px
    }

    .mobile .ws-web-page__contactUs .ws-web-contactUs__body li .tit {
        padding-left: 26px;
        font-size: 16px
    }
}

@media screen and (max-width: 768px) {
    .mobile .news-detail .news-detail__main-pannel {
        padding:16px;
        width: auto
    }

    .mobile .news-detail .news-detail__main-pannel .news-detail__title {
        font-weight: 400;
        font-size: 20px;
        margin-top: 16px;
        line-height: 1.5
    }

    .mobile .news-detail .news-detail__main-pannel .news-detail__essay {
        margin-top: 32px;
        padding-bottom: 32px
    }

    .mobile .news-detail__footer .news-detail__footer-next,.mobile .news-detail__footer .news-detail__footer-previous {
        float: none
    }
}

@media screen and (max-width: 768px) {
    .mobile .wangsu-events__main {
        padding:16px 0
    }

    .mobile .wangsu-events .wangsu-events__top {
        height: 120px;
        font-size: 30px
    }

    .mobile .wangsu-events .wangsu-events__top>div,.mobile .wangsu-events .wangsu-events__top>h2 {
        font-size: 30px!important;
        padding: 0 16px
    }

    .mobile .wangsu-events .wangsu-events__event-line {
        float: none;
        padding: 0 20px;
        width: auto
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-company_introduction {
        padding:16px 0
    }

    .mobile .ws-web-company_introduction .content {
        width: 100%
    }

    .mobile .ws-web-company_introduction .content .content-left {
        display: none;
        width: 224px;
        margin-right: -43px
    }

    .mobile .ws-web-company_introduction .content .content-left img {
        width: 100%;
        height: auto
    }

    .mobile .ws-web-company_introduction .content .content-right {
        margin: 0 16px;
        padding: 20px;
        width: auto;
        height: auto
    }

    .mobile .ws-web-company_introduction .content .content-right .title {
        font-size: 26px
    }

    .mobile .ws-web-company_introduction .content .content-right .content-right-desc {
        font-size: 16px;
        line-height: 1.2
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-introduction_banner {
        padding-top:0;
        height: 120px;
        font-size: 30px
    }

    .mobile .ws-web-introduction_banner>div,.mobile .ws-web-introduction_banner>h2 {
        font-size: 30px!important;
        padding: 0 16px
    }

    .mobile .ws-web-core_strength {
        min-width: 100%;
        padding: 0 0 15px;
        background-image: none;
        background-color: #1f3256
    }

    .mobile .ws-web-core_strength .panel {
        height: auto;
        padding-bottom: 16px;
        overflow: hidden
    }

    .mobile .ws-web-core_strength .panel .panel-left {
        padding-top: 16px;
        text-align: center;
        width: 100%;
        height: auto
    }

    .mobile .ws-web-core_strength .panel .panel-left .panel-left-desc {
        font-size: 16px;
        text-align: center
    }

    .mobile .ws-web-core_strength .panel .panel-left .panel-left-no {
        display: block;
        padding-right: 0;
        font-size: 66px;
        line-height: 1.2em
    }

    .mobile .ws-web-core_strength .panel .panel-right {
        display: none
    }

    .mobile .ws-web-core_strength .content {
        margin: 0 15px;
        padding: 16px 0 5px 10px;
        width: auto;
        height: auto
    }

    .mobile .ws-web-core_strength .content hr {
        display: none
    }

    .mobile .ws-web-core_strength .content .content-item {
        width: 100%;
        display: flex;
        box-sizing: border-box;
        padding: 0;
        margin-bottom: 10px
    }

    .mobile .ws-web-core_strength .content .content-item .content-item-title-wrapper {
        padding-right: 5px;
        border-right: 2px solid #374dbf;
        width: 72px;
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        justify-content: flex-end
    }

    .mobile .ws-web-core_strength .content .content-item .content-item-title-wrapper .content-item-title {
        line-height: 1;
        text-align: center;
        font-size: 24px!important;
        margin-bottom: 0
    }

    .mobile .ws-web-core_strength .content .content-item .content-item-desc {
        padding-left: 5px;
        flex: 1 1 auto;
        display: flex;
        align-items: center;
        word-break: break-all;
        white-space: normal;
        font-size: 12px;
        line-height: 1.2
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-development_operation {
        padding:20px 16px 16px
    }

    .mobile .ws-web-development_operation .title {
        font-size: 20px;
        line-height: 25px
    }

    .mobile .ws-web-development_operation .desc {
        margin-bottom: 30px;
        line-height: 1.5;
        font-size: 14px
    }

    .mobile .ws-web-development_operation ul.ws-node-list {
        margin: 16px 0
    }

    .mobile .ws-web-development_operation ul.ws-node-list li {
        width: 50%;
        height: auto;
        float: left
    }

    .mobile .ws-web-development_operation ul.ws-node-list li h3 {
        font-size: 32px;
        line-height: 45px
    }

    .mobile .ws-web-development_operation ul.ws-node-list li p {
        font-size: 14px
    }

    .mobile .ws-web-development_operation ul.ws-node-list li .node-num-bg-circle {
        display: none
    }

    .mobile .ws-web-development_operation .node-map {
        overflow: auto
    }

    .mobile .ws-web-development_operation .node-map .map-bg {
        width: 1200px
    }

    .mobile .is-en .ws-web-development_operation ul.ws-node-list li {
        display: block;
        width: auto;
        float: none;
        padding-bottom: 10px;
        height: auto
    }

    .mobile .is-en .ws-web-development_operation ul.ws-node-list li h3 {
        line-height: 60px
    }

    .mobile .is-en .ws-web-development_operation ul.ws-node-list li p {
        min-height: 0;
        width: auto;
        padding-right: 16px
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-introduction_banner .title {
        line-height:120px;
        margin-top: 0
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-report-list__banner {
        height:120px;
        font-size: 30px
    }

    .mobile .ws-web-report-list__banner>div,.mobile .ws-web-report-list__banner>h2 {
        font-size: 30px!important;
        padding: 0 16px
    }

    .mobile .ws-web-report-list__banner>h2 {
        line-height: 120px
    }

    .mobile .ws-web-report-list__body {
        width: auto;
        margin: 0 10px
    }

    .mobile .ws-web-report-list__body.annoucement-list .report-list-content {
        padding-top: 10px
    }

    .mobile .ws-web-report-list__body.annoucement-list .report-list-content__header {
        display: none
    }

    .mobile .ws-web-report-list__body.annoucement-list .report-list>li {
        padding: 10px 0;
        display: block
    }

    .mobile .ws-web-report-list__body.annoucement-list .report-list>li .report-list--title {
        display: block;
        width: 100%;
        padding: 0 10px
    }

    .mobile .ws-web-report-list__body.annoucement-list .report-list>li .report-list--time {
        padding: 0 10px
    }

    .mobile .ws-web-report-list .report-list-type h3 {
        margin: 6px 0;
        padding: 2px 10px
    }

    .mobile .ws-web-report-list .report-list-type h3.is-active:after,.mobile .ws-web-report-list .report-list-type h3:hover:after {
        left: -99999px
    }

    .mobile .ws-web-report-list .report-list-type h3.is-active {
        border-left: 2px solid #2b66ff
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-read-list .single-title-banner {
        height:120px;
        font-size: 30px
    }

    .mobile .ws-web-read-list .single-title-banner>div,.mobile .ws-web-read-list .single-title-banner>h2 {
        font-size: 30px!important;
        padding: 0 16px
    }

    .mobile .ws-web-read-list .single-title-banner h2 {
        line-height: 120px
    }

    .mobile .ws-web-read-list__blog,.mobile .ws-web-read-list__news {
        height: 120px;
        font-size: 30px
    }

    .mobile .ws-web-read-list__blog>div,.mobile .ws-web-read-list__blog>h2,.mobile .ws-web-read-list__news>div,.mobile .ws-web-read-list__news>h2 {
        font-size: 30px!important;
        padding: 0 16px
    }

    .mobile .ws-web-read-list__body {
        padding: 0 20px;
        width: auto
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-report_banner {
        height:auto;
        padding: 32px 16px
    }

    .mobile .ws-web-report_banner .title {
        font-size: 30px;
        line-height: 1.5em
    }

    .mobile .ws-web-report_banner .desc {
        line-height: 1.5em;
        font-size: 14px;
        padding-bottom: 0
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-internet_security {
        padding:10px 16px;
        min-width: auto
    }

    .mobile .ws-web-internet_security .title {
        font-size: 26px
    }

    .mobile .ws-web-internet_security .desc {
        font-size: 14px;
        padding-bottom: 10px
    }

    .mobile .ws-web-internet_security .content .content-left {
        margin: 0;
        width: 100%
    }

    .mobile .ws-web-internet_security .content .content-left img {
        width: 100%;
        height: auto
    }

    .mobile .ws-web-internet_security .content .content-left .content-left-item {
        margin: 10px 0
    }

    .mobile .ws-web-internet_security .content .content-right {
        width: 100%;
        margin: 0
    }

    .mobile .ws-web-internet_security .content .content-right .content-right-item:last-child {
        text-align: center
    }

    .mobile .ws-web-internet_security .content .content-right .content-right-item .read-right-more {
        float: none
    }

    .mobile .ws-web-internet_security .content .content-right .content-right-item .content-right-time {
        margin: 0 0 20px
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-live_video {
        padding:16px;
        box-sizing: border-box;
        min-width: 100%
    }

    .mobile .ws-web-live_video .title {
        font-size: 26px
    }

    .mobile .ws-web-live_video .desc {
        font-size: 14px;
        padding-bottom: 10px
    }

    .mobile .ws-web-live_video .content {
        margin: 0
    }

    .mobile .ws-web-live_video .content .content-item {
        width: 100%;
        height: auto;
        margin: 0 0 20px
    }

    .mobile .ws-web-live_video .content .content-item .content-item-container {
        padding: 10px 16px
    }

    .mobile .ws-web-live_video .content .content-item .content-item-container .content-item-title {
        margin-bottom: 10px
    }

    .mobile .ws-web-live_video .content .content-item .content-item-container .content-item-desc {
        margin-bottom: 5px
    }

    .mobile .ws-web-live_video .content .content-item img {
        width: 100%;
        height: auto
    }

    .mobile .ws-web-live_video .btn-container {
        padding-top: 0;
        font-size: 14px
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-internet_develop {
        padding:16px;
        min-width: auto
    }

    .mobile .ws-web-internet_develop .title {
        font-size: 26px
    }

    .mobile .ws-web-internet_develop .desc {
        font-size: 14px;
        padding-bottom: 10px
    }

    .mobile .ws-web-internet_develop .content {
        margin: 0
    }

    .mobile .ws-web-internet_develop .content .content-item {
        width: 100%;
        height: auto;
        margin: 0 0 20px;
        box-shadow: 0 2px 8px 0 rgba(173,190,204,.35)
    }

    .mobile .ws-web-internet_develop .content .content-item img {
        width: 100%;
        height: auto
    }

    .mobile .ws-web-internet_develop .content .content-item .content-item-container {
        padding: 10px 16px
    }

    .mobile .ws-web-internet_develop .content .content-item .content-item-container .content-item-title {
        margin-bottom: 10px
    }

    .mobile .ws-web-internet_develop .content .content-item .content-item-container .content-item-desc {
        margin-bottom: 5px
    }

    .mobile .ws-web-internet_develop .btn-container {
        padding-top: 0;
        font-size: 14px
    }
}

@media screen and (max-width: 768px) {
    .mobile .report-list-content__header--time {
        width:300px
    }

    .mobile .report-list-content__body .report-list--time {
        padding: 0 20px;
        width: 300px
    }

    .mobile .news-list-cover-wrap {
        padding: 0
    }

    .mobile .news-list-cover-wrap.with-nav {
        float: none;
        width: auto
    }

    .mobile .news-list-cover-wrap .news-list-cover li {
        padding: 16px 0
    }

    .mobile .news-list-cover-wrap .news-list-cover li a:link,.mobile .news-list-cover-wrap .news-list-cover li a:visited {
        color: #595959
    }

    .mobile .news-list-cover-wrap .news-list-cover__info-title {
        font-size: 16px;
        line-height: 1.2
    }

    .mobile .news-list-cover-wrap .news-list-cover__image,.mobile .news-list-cover-wrap .news-list-cover__image img {
        width: 155px;
        height: 90px
    }
}

.portal-mobi-home-banner {
    background: #091535
}

.portal-mobi-home-banner .nut-swiper {
    height: 150px
}

@media screen and (max-width: 360px) {
    .portal-mobi-home-banner .nut-swiper {
        height:126px
    }
}

.portal-mobi-home-banner .nut-swiper-slide {
    box-sizing: border-box;
    padding: 16px
}

.portal-mobi-home-banner .nut-swiper-slide>a {
    display: block;
    height: 100%
}

.portal-mobi-home-banner .nut-swiper-slide img {
    width: 100%;
    height: 100%
}

.portal-mobi-home-banner .nut-swiper-slide .text-info .txt-info-title {
    line-height: 1.2;
    color: #fff;
    font-size: 20px
}

.portal-mobi-home-banner .nut-swiper-slide .text-info .txt-info-des {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin-top: 10px;
    font-size: 12px;
    line-height: 1.6;
    color: #fff
}

@media screen and (max-width: 320px) {
    .portal-mobi-home-banner .nut-swiper-slide .text-info .txt-info-des {
        -webkit-line-clamp:1
    }
}

.portal-mobi-home-banner .btn_area {
    margin-top: 10px;
    display: block;
    white-space: nowrap;
    text-align: left
}

.portal-mobi-home-banner .product_btn {
    display: inline-block;
    text-align: left;
    transition: all .3s;
    border-radius: 25px;
    margin-right: 10px;
    margin-left: 10px;
    overflow: hidden;
    font-weight: 500;
    padding: 5px 15px;
    font-size: 12px;
    color: #fff;
    line-height: 16px
}

.portal-mobi-home-banner .product_btn.deep {
    color: #fff;
    background: linear-gradient(0deg,#ff9201,#ff4f02)
}

.portal-mobi-home-banner .product_btn.deep:hover {
    opacity: .5
}

.portal-mobi-home-banner .product_btn.white {
    background-color: #fff;
    color: #ffa54f
}

.portal-mobi-home-banner .product_btn.white:hover {
    color: #ff6c1d
}

.portal-mobi-home-banner .product_btn.light {
    border: 1px solid #ffa54f;
    background: transparent;
    color: #ffa54f
}

.portal-mobi-home-banner .product_btn.light:hover {
    background: #ff6c1d;
    border: 1px solid #ff6c1d
}

.portal-mobi-home-banner .product_btn:hover {
    text-decoration: none;
    border: 1px solid #ff6c1d
}

.portal-mobi-home-banner .product_btn:first-child {
    margin-left: 0
}

.portal-mobi-home-banner .product_btn:last-child {
    margin-right: 0
}

.portal-mobi-home-safe {
    padding: 0 10px 10px;
    background-color: #f7fafe
}

.portal-mobi-home-safe_container {
    margin: 0 auto;
    overflow: hidden
}

.portal-mobi-home-safe_container ul.performance {
    margin-top: 20px;
    text-align: center
}

.portal-mobi-home-safe_container ul.performance li .performance_node {
    height: auto;
    display: flex;
    margin-bottom: 10px
}

.portal-mobi-home-safe_container ul.performance li .performance_node h3 {
    flex: 0 0 auto;
    margin: 0;
    display: none;
    align-items: center;
    justify-content: flex-end;
    font-weight: 400;
    padding-right: 5px;
    border-right: 2px solid #2a49c3;
    width: 50px;
    font-size: 16px;
    line-height: 20px
}

.portal-mobi-home-safe_container ul.performance li .performance_node .description {
    border-left: 2px solid #2a49c3;
    padding-left: 5px;
    text-align: left;
    flex: 1 1 auto;
    line-height: 18px;
    font-size: 12px;
    color: rgba(0,0,0,.65);
    letter-spacing: 0;
    margin: 0
}

.portal-mobi-home-safe_container ul.performance li .performance_node .seperate {
    margin-bottom: 5px
}

.portal-mobi-home-safe_container ul.performance li .performance_node .seperate span {
    width: 60px;
    border-top: 2px solid #2a49c3;
    display: inline-block
}

.portal-mobi-home-safe_container h1 {
    font-size: 20px;
    font-weight: 400;
    color: #373d41;
    text-align: center;
    margin-top: 20px
}

.portal-mobi-home-safe_container .authentication {
    width: 100%;
    display: inline-block
}

.portal-mobi-home-safe_container .authentication div.btn-more {
    text-align: center;
    width: 100%;
    display: inline-block;
    margin-bottom: 8px
}

.portal-mobi-home-safe_container .authentication div.btn-more a {
    width: 80px;
    font-size: 12px;
    color: rgba(0,0,0,.65);
    line-height: 30px;
    cursor: pointer
}

.portal-mobi-home-safe_container .authentication li.authentication_colum {
    float: left;
    width: 25%;
    transition: all .3s linear;
    margin-top: 5px
}

.portal-mobi-home-safe_container .authentication li.authentication_colum a {
    box-sizing: border-box;
    position: relative;
    display: block;
    height: 55px;
    padding: 8px 0 28px 68px;
    border-left: 1px solid;
    border-color: hsla(0,0%,100%,.06);
    transition: all .3s;
    text-decoration: none;
    max-width: 300px;
    margin: 0 auto
}

.portal-mobi-home-safe_container .authentication li.authentication_colum a.last {
    border-right: 1px solid;
    border-color: hsla(0,0%,100%,.06)
}

.portal-mobi-home-safe_container .authentication li.authentication_colum a img {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    height: 50px
}

.portal-mobi-home-safe_container .authentication li.authentication_colum a .m_view_img {
    display: none
}

.portal-mobi-home-safe_container .authentication li.authentication_colum a h2 {
    height: 21px;
    margin-bottom: 4px;
    margin-left: 10px;
    margin-right: 10px;
    font-size: 16px;
    color: rgba(0,0,0,.85);
    letter-spacing: 0;
    overflow: hidden;
    font-weight: 500
}

.portal-mobi-home-safe_container .authentication li.authentication_colum a p {
    margin: 2px 0 0 8px;
    line-height: 18px;
    font-size: 12px;
    color: rgba(0,0,0,.5);
    letter-spacing: 0;
    overflow: hidden
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-home-news {
        max-height:auto;
        padding: 20px 15px
    }

    .mobile .ws-web-home-news .title {
        height: auto;
        line-height: 1;
        font-size: 20px;
        font-weight: 400;
        margin-bottom: 20px
    }

    .mobile .ws-web-home-news .content .btn-container {
        margin-top: 5px
    }

    .mobile .ws-web-home-news .content .btn-container a {
        font-size: 16px
    }

    .mobile .ws-web-home-news .content .news-content .news-item {
        width: 100%;
        margin-right: 0
    }

    .mobile .ws-web-home-news .content .news-content .news-item a {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        margin-bottom: 10px
    }

    .mobile .ws-web-home-news .content .news-content .news-item a img {
        width: 33.33333333%;
        height: auto
    }

    .mobile .ws-web-home-news .content .news-content .news-item a .news-item-container {
        width: 66.66666667%;
        padding: 0 0 0 10px
    }

    .mobile .ws-web-home-news .content .news-content .news-item a .news-item-container .news-item-title {
        font-size: 14px
    }

    .mobile .ws-web-home-news .content .news-content .news-item a .news-item-container .news-item-time {
        font-size: 12px;
        margin-top: 0
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-register {
        padding:16px;
        height: auto;
        background-position: 0;
        background-size: auto 100%
    }

    .mobile .ws-web-register .button {
        position: absolute;
        top: auto;
        bottom: 0;
        right: 50%;
        padding: 0 22px;
        font-size: 14px;
        line-height: 28px;
        transform: translateX(50%);
        box-sizing: border-box;
        color: #fff;
        border: 1px solid #fff;
        background: transparent;
        font-weight: lighter
    }

    .mobile .ws-web-register .title {
        font-size: 20px;
        line-height: 1;
        margin-bottom: 15px
    }

    .mobile .ws-web-register .sub-title {
        margin-bottom: 40px;
        line-height: 1.4;
        font-size: 14px;
        width: 100%;
        word-break: break-word;
        white-space: pre-line
    }

    .mobile .ws-web-register .content {
        height: auto;
        padding-left: 0
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-quick-nav {
        top:-8px;
        padding: 0 16px
    }

    .mobile .ws-web-quick-nav .content .pane {
        margin-bottom: 10px;
        justify-content: left
    }

    .mobile .ws-web-quick-nav .content .pane .swiper-slide {
        height: 70px;
        padding-left: 5px;
        padding-right: 5px;
        box-sizing: border-box
    }

    .mobile .ws-web-quick-nav .content .pane .pane-item {
        height: 70px;
        padding: 8px 0 8px 12px;
        flex: none;
        box-sizing: border-box
    }

    .mobile .ws-web-quick-nav .content .pane .pane-item .ws-link {
        height: 100%
    }

    .mobile .ws-web-quick-nav .content .pane .pane-item .ws-link a .logo {
        width: 55px;
        height: 55px
    }

    .mobile .ws-web-quick-nav .content .pane .pane-item .ws-link a .text {
        width: calc(100% - 72px)
    }

    .mobile .ws-web-quick-nav .content .pane .pane-item .ws-link a .text .title {
        margin-bottom: 3px;
        font-size: 1.1em
    }

    .mobile .ws-web-quick-nav .content .pane .pane-item .ws-link a .text .desc {
        font-size: 12px
    }

    .mobile .ws-web-quick-nav .content .pane .pane-item .ws-link a .ws-tag {
        transform: scale(.75);
        top: -21px;
        right: -24px
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-service {
        margin-top:10px
    }

    .mobile .ws-web-service .title {
        padding: 0 16px;
        font-size: 16px;
        line-height: 1.5
    }

    .mobile .ws-web-service .tab {
        margin-top: 15px;
        height: 30px
    }

    .mobile .ws-web-service .tab .el-tabs__item {
        padding: 0 20px;
        font-size: 14px;
        font-size: 1.05rem
    }

    .mobile .ws-web-service .tab .el-tabs__active-bar {
        top: 30px
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content {
        height: auto;
        padding: 15px 16px 18px;
        flex-flow: row wrap;
        box-sizing: border-box
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-left {
        width: 100%
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-left .card-item__img {
        margin-bottom: 16px;
        line-height: 0;
        font-size: 0
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-left .card-item__img a img {
        height: auto
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-right {
        width: 100%;
        background-color: transparent
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-right .card {
        width: 100%;
        box-shadow: none
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-right .card .card-item {
        margin-bottom: 16px;
        width: 100%;
        padding: 12px 16px 0 15px;
        background-color: #fff;
        border-right: none;
        border-bottom: none;
        box-shadow: 0 2px 16px 0 rgb(216 221 3.21428571%)
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-right .card .card-item:last-child {
        margin-bottom: 0
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-right .card .card-item .ws-tag {
        transform: scale(.75);
        top: -21px;
        right: -24px
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-right .card .card-item .title {
        margin-bottom: 8px;
        padding: 0;
        font-size: 1.1em
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-right .card .card-item .markdown-item {
        height: 150px;
        border-right: none;
        border-bottom: none
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-right .card .card-item .markdown-item p {
        margin-bottom: 3px
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-right .card .card-item .markdown-item p:last-child {
        margin-top: 6px
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-right .card .card-item .markdown-item p .new-price em {
        font-size: 26px;
        line-height: 26px
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-right .card .card-item .button-group {
        opacity: 1;
        height: 30px
    }

    .mobile .ws-web-service .content-bg .ws-web-service-activity .content .content-right .card .card-item .button-group .button.button__primary {
        padding-top: 7px;
        padding-bottom: 6px;
        height: 30px;
        line-height: 15px
    }

    .mobile .ws-web-service .content-bg .ws-web-service-product .content {
        padding: 3px 16px 16px;
        box-sizing: border-box
    }

    .mobile .ws-web-service .content-bg .ws-web-service-product .content .pane .pane-item {
        width: 100%;
        height: 124px;
        padding: 12px 22px 34px 14px;
        margin-right: 0
    }

    .mobile .ws-web-service .content-bg .ws-web-service-product .content .pane .pane-item .ws-tag {
        transform: scale(.75);
        top: -21px;
        right: -24px
    }

    .mobile .ws-web-service .content-bg .ws-web-service-product .content .pane .pane-item .title {
        margin-bottom: 6px;
        padding: 0;
        font-size: 1.1em
    }

    .mobile .ws-web-service .content-bg .ws-web-service-product .content .pane .pane-item .desc {
        font-size: .9em
    }

    .mobile .ws-web-service .content-bg .ws-web-service-product .content .pane .pane-item a button {
        height: 34px;
        font-size: 1.1em;
        opacity: 1
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-home-client {
        background-position:50%
    }

    .mobile .ws-web-home-client .content {
        height: auto;
        padding: 0 16px 16px;
        box-sizing: border-box
    }

    .mobile .ws-web-home-client .content .title {
        margin: 20px 0;
        line-height: 20px;
        font-size: 20px
    }

    .mobile .ws-web-home-client .content .nut-collapse-item {
        margin-bottom: 10px
    }

    .mobile .ws-web-home-client .content .collapse-content {
        display: flex;
        flex-flow: wrap
    }

    .mobile .ws-web-home-client .content .tab-content-item {
        margin-bottom: 8px;
        width: calc(50% - 4px);
        height: 90px;
        background-position: 50%;
        box-sizing: border-box
    }

    .mobile .ws-web-home-client .content .tab-content-item:first-child,.mobile .ws-web-home-client .content .tab-content-item:nth-child(4) {
        margin-right: 8px
    }

    .mobile .ws-web-home-client .content .tab-content-item:nth-child(3) {
        width: 100%;
        margin-right: 0;
        background-size: cover
    }

    .mobile .ws-web-home-client .content .tab-content-item .logo-wrap {
        width: 100%;
        line-height: 90px
    }

    .mobile .ws-web-home-client .content .tab-content-item .logo-wrap .logo {
        width: 100%;
        vertical-align: sub
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-salearea__banner {
        background:none!important;
        padding: 20px 20px 10px;
        width: auto;
        height: auto
    }

    .mobile .ws-web-salearea__banner h4 {
        font-size: 16px;
        margin-bottom: 10px
    }

    .mobile .ws-web-salearea-item {
        width: auto;
        flex-direction: column
    }

    .mobile .ws-web-salearea__tab-title {
        overflow-x: auto;
        white-space: nowrap
    }

    .mobile .ws-web-salearea__tab-content>ul {
        padding: 20px
    }

    .mobile .ws-web-salearea__tab-content>ul.is-type4>li {
        height: auto;
        padding-bottom: 24px
    }

    .mobile .ws-web-salearea__tab-content>ul.is-type4 .ws-web-salearea__shop-foot {
        display: flex;
        align-items: center;
        justify-content: space-between
    }

    .mobile .ws-web-salearea__tab-content>ul.is-type4 .ws-web-salearea__shop-desc {
        height: auto
    }

    .mobile .ws-web-salearea__tab-content>ul.is-type4 .ws-web-salearea__button-group {
        margin-top: 0
    }

    .mobile .ws-web-salearea__tab-content>ul.is-type4 .ws-web-salearea__price {
        display: block;
        height: auto
    }

    .mobile .ws-web-salearea__tab-content>ul.is-type8>li {
        height: auto
    }

    .mobile .ws-web-salearea__tab-content>ul.is-type8 .ws-web-salearea__shop-foot {
        display: flex;
        align-items: center;
        justify-content: space-between
    }

    .mobile .ws-web-salearea__tab-content>ul>li {
        float: none;
        width: auto;
        margin: 8px;
        padding: 16px 16px 10px
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-company_license {
        padding:16px 0
    }

    .mobile .ws-web-company_license .title {
        font-size: 26px;
        padding-bottom: 16px
    }

    .mobile .ws-web-company_license .content-row {
        margin-bottom: auto
    }

    .mobile .ws-web-company_license .content-row .content-item {
        display: block;
        min-width: auto;
        width: auto;
        height: auto;
        margin: 0 20px 10px
    }

    .mobile .ws-web-company_license .content-row .content-item span {
        font-size: 16px;
        color: rgba(0,0,0,.85);
        line-height: 1.2;
        padding: 20px 10px;
        display: block;
        margin: auto;
        text-align: left
    }
}

.portal-mobi-certification_authority {
    padding: 16px 0 0;
    margin: 0 auto;
    background-color: #f7fafe
}

.portal-mobi-certification_authority .title {
    font-size: 26px;
    color: rgba(0,0,0,.85);
    line-height: 48px;
    font-weight: 400;
    text-align: center;
    padding-bottom: 16px
}

.portal-mobi-certification_authority .content {
    padding: 0 6px 0 16px;
    text-align: left
}

.portal-mobi-certification_authority .content:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    overflow: hidden;
    clear: both
}

.portal-mobi-certification_authority .content .content-item {
    position: relative;
    float: left;
    width: calc(50% - 30px);
    box-shadow: 0 2px 8px 0 rgba(173,190,204,.35);
    border-radius: 2px;
    background-color: #fff;
    text-align: center;
    padding: 10px 10px 20px;
    margin-right: 10px;
    margin-bottom: 10px
}

.portal-mobi-certification_authority .content .content-item .license-img {
    width: 80px!important
}

.portal-mobi-certification_authority .content .content-item .license-img-trust {
    width: 80px
}

.portal-mobi-certification_authority .content .content-item .cloud-trust {
    width: 30px;
    position: absolute;
    top: 0;
    right: 0
}

.portal-mobi-certification_authority .content .content-item .desc {
    font-size: 12px;
    color: rgba(0,0,0,.85);
    line-height: 1.5;
    min-height: 36px;
    margin-top: 10px
}

.portal-mobi-certification_authority .certification-authority-img {
    background: url(http://www.haoio.cn/nuxt-static/img/certification-authority-bg.b2e4e9a.png) no-repeat 100%;
    height: 100%;
    background-size: cover;
    padding: 20px 0
}

.portal-mobi-certification_authority .certification-authority-img .certification-container {
    width: auto;
    height: 100%;
    margin: 0 16px;
    display: block;
    text-align: center
}

.portal-mobi-certification_authority .certification-authority-img .certification-container .certification-container-title {
    text-align: center;
    font-size: 26px;
    color: hsla(0,0%,100%,.85);
    line-height: inherit;
    margin: 0 0 20px;
    display: block
}

.portal-mobi-certification_authority .certification-authority-img .certification-container .certification-container-desc {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: 100%;
    display: inline-block;
    padding: 20px;
    background-color: #fff;
    text-align: left
}

.portal-mobi-certification_authority .certification-authority-img .certification-container .certification-container-desc li {
    width: 100%;
    font-size: 14px;
    color: rgba(0,0,0,.65);
    line-height: 1.5em;
    margin-bottom: 10px
}

.portal-mobi-certification_authority .certification-authority-img .certification-container .certification-container-desc li .dot {
    width: 4px;
    height: 4px;
    background: rgba(0,0,0,.35);
    display: block;
    position: relative;
    left: -10px;
    top: 14px;
    border-radius: 5px
}

.is-en .portal-mobi-certification_authority .content .content-item .desc {
    height: 53px
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-union_organization {
        padding-top:20px
    }

    .mobile .ws-web-union_organization .title {
        font-size: 26px;
        margin-bottom: 20px;
        line-height: 1.5em
    }

    .mobile .ws-web-union_organization .content {
        min-width: 100%;
        margin-bottom: 10px
    }

    .mobile .ws-web-union_organization .content .content-row {
        margin-bottom: 0;
        min-width: 100%
    }

    .mobile .ws-web-union_organization .content .content-row .content-item {
        width: 50%;
        float: left;
        height: auto;
        margin: 0;
        box-sizing: border-box;
        border: 10px solid transparent;
        border-top: none
    }

    .mobile .ws-web-union_organization .content .content-row .content-item .organization-img {
        height: auto
    }

    .mobile .ws-web-union_organization .content .content-row .content-item .desc {
        font-size: 14px;
        margin-top: 0;
        line-height: 1.5em
    }

    .mobile .is-en .ws-web-union_organization .title {
        font-size: 20px;
        line-height: 1.3em
    }

    .mobile .is-en .ws-web-union_organization .content .content-row .content-item .desc {
        font-size: 12px
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-qualification_banner {
        padding-top:37px;
        font-size: 30px;
        height: 120px;
        box-sizing: border-box
    }

    .mobile .ws-web-qualification_banner .title {
        font-size: 30px
    }
}

@media screen and (max-width: 768px) {
    .mobile .product_banner {
        height:auto;
        background-position: 67%;
        background-size: cover
    }

    .mobile .product_banner .product_banner_main {
        padding: 16px
    }

    .mobile .product_banner .product_banner_main .product_banner_content {
        width: 100%
    }

    .mobile .product_banner .product_banner_main .product_banner_content h2.banner_title {
        margin-top: 0;
        margin-bottom: 10px;
        height: auto;
        line-height: 36px;
        font-size: 30px
    }

    .mobile .product_banner .product_banner_main .product_banner_content p.banner_des {
        line-height: 1.5;
        font-size: 14px;
        color: #fff;
        display: block;
        overflow: visible;
        overflow: initial
    }

    .mobile .product_banner .product_banner_main .product_banner_content .detail {
        margin-top: 12px;
        position: static
    }

    .mobile .product_banner .product_banner_main .product_banner_content .detail a {
        margin-bottom: 10px;
        margin-right: 10px;
        width: auto;
        padding: 0 16px;
        height: 32px;
        line-height: 32px;
        font-size: 14px
    }

    .mobile .product_banner .product_banner_main .product_banner_content .detail a:last-child {
        margin-bottom: 0
    }
}

@media screen and (max-width: 768px) {
    .mobile .quick-start {
        padding-top:0;
        margin-bottom: 0
    }

    .mobile .quick-start-content {
        height: auto
    }

    .mobile .quick-start-content>.title {
        font-size: 26px;
        line-height: 1.4;
        padding: 22px 0 0;
        margin-bottom: 0
    }

    .mobile .quick-start-content .card {
        flex-flow: row wrap
    }

    .mobile .quick-start-content .card-item-wrap {
        margin: 0;
        width: 90%;
        height: auto;
        line-height: 163px
    }

    .mobile .quick-start-content .card-item-wrap .card-item-bg {
        margin-top: 58px;
        padding-bottom: 24px;
        width: 100%;
        height: auto
    }

    .mobile .quick-start-content .card-item-wrap .card-item-arrow {
        top: auto;
        bottom: -2px;
        right: 50%;
        transform: translateX(50%) rotate(90deg)
    }
}

@media screen and (max-width: 768px) {
    .mobile .recommend-buy {
        padding-top:0
    }

    .mobile .recommend-buy-content {
        height: auto
    }

    .mobile .recommend-buy-content .title {
        font-size: 26px;
        line-height: 1.4;
        padding: 22px 0;
        margin-bottom: 0
    }

    .mobile .recommend-buy-content .card {
        flex-flow: row wrap;
        padding: 0 16px
    }

    .mobile .recommend-buy-content .card-item {
        width: 100%;
        height: auto;
        margin-bottom: 16px;
        margin-right: 0;
        padding: 20px 15px 0
    }

    .mobile .recommend-buy-content .card-item .ws-tag {
        top: -5px
    }

    .mobile .recommend-buy-content .card-item .markdown-item {
        line-height: normal
    }

    .mobile .recommend-buy-content .card-item .markdown-item-content br {
        display: none
    }

    .mobile .recommend-buy .card-item .button-group {
        position: static;
        margin-top: 5px;
        width: calc(100% + 30px);
        margin-left: -15px
    }
}

@media screen and (max-width: 768px) {
    .mobile .section_content {
        padding-top:0
    }

    .mobile .section_content .section_container h2 {
        font-size: 26px;
        line-height: 1.4;
        padding: 22px 0;
        margin-bottom: 0
    }

    .mobile .section_content .customer_case .customer_case_content ul {
        margin-bottom: 10px;
        padding: 0 16px;
        text-align: left
    }

    .mobile .section_content .customer_case .customer_case_content ul li {
        margin: 0;
        width: calc(50% - 5px)
    }

    .mobile .section_content .customer_case .customer_case_content ul li:nth-child(odd) {
        margin-right: 10px
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-document-help {
        padding-top:0;
        padding-bottom: 0
    }

    .mobile .ws-web-document-help .common-content-wrap {
        width: 100%
    }

    .mobile .ws-web-document-help-title {
        font-size: 26px;
        line-height: 1.4;
        padding: 22px 0
    }

    .mobile .ws-web-document-help-menu {
        margin-top: 0
    }

    .mobile .ws-web-document-help-menu .help-list {
        display: block;
        padding: 0 16px
    }

    .mobile .ws-web-document-help-menu .help-list-item {
        margin-left: 0;
        margin-bottom: 18px;
        padding-right: 0;
        width: 100%;
        border-right: none
    }

    .mobile .ws-web-document-help-menu .help-list-item ul.help-list-item-sublist {
        margin-top: 10px;
        padding-left: 5%;
        display: flex;
        flex-flow: row wrap
    }

    .mobile .ws-web-document-help-menu .help-list-item ul.help-list-item-sublist li {
        margin-bottom: 5px;
        width: 50%;
        box-sizing: border-box
    }

    .mobile .ws-web-document-help-menu .help-list-item ul.help-list-item-sublist li .ws-link a {
        word-break: break-all;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical
    }

    .mobile .ws-web-document-help-menu .help-list-item h3 {
        padding-bottom: 10px;
        border-bottom: 1px solid rgba(216,221,225,.7);
        font-size: 20px
    }

    .mobile .ws-web-document-help-menu .help-list-item .help-list-item-sublist {
        padding-left: 20%
    }
}

@media screen and (max-width: 768px) {
    .mobile .cm-markdown-view {
        padding:20px 0
    }

    .mobile .cm-markdown-view .cm-markdown-view__title {
        padding: 22px 0;
        font-size: 26px
    }

    .mobile .cm-markdown-view .cm-markdown-view__content {
        padding: 0 16px
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-product_advantage {
        height:auto;
        padding: 0 16px
    }

    .mobile .ws-web-product_advantage .ws-web-product_advantage_title {
        font-size: 26px;
        line-height: 1.4;
        padding: 22px 0
    }

    .mobile .ws-web-product_advantage .ws-web-product_advantage_content {
        margin: 0 auto
    }

    .mobile .ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item {
        padding: 10px;
        width: 100%;
        height: auto
    }

    .mobile .ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item:nth-child(odd) {
        margin-right: 0
    }

    .mobile .ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item:nth-child(2n) {
        margin-left: 0
    }

    .mobile .ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item .advantage_img {
        padding: 6px
    }

    .mobile .ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item .advantage_img img {
        width: 30px;
        height: 30px
    }

    .mobile .ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item .advantage_content {
        width: calc(100% - 60px);
        padding-left: 16px
    }

    .mobile .ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item .advantage_content p.item_des {
        margin-top: 0
    }

    .mobile .ws-web-product_advantage .ws-web-product_advantage_content .ws-web-product_advantage_item .advantage_content h3.item_title {
        line-height: 1.4;
        margin: 0 0 6px;
        font-size: 16px
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-product_function-wrap {
        padding-bottom:16px
    }

    .mobile .ws-web-product_function_wrapper {
        padding-bottom: 0!important
    }

    .mobile .ws-web-product_function-ng {
        background: transparent
    }

    .mobile .ws-web-product_function h2.ws-web-product_function_title {
        line-height: 30px;
        font-size: 26px;
        color: rgba(0,0,0,.85);
        margin: 10px 0;
        padding-top: 16px
    }

    .mobile .ws-web-product_function .ws-web-product_function_content {
        width: 100%;
        position: static;
        box-shadow: none;
        margin-top: 16px;
        padding: 0 16px;
        box-sizing: border-box
    }

    .mobile .ws-web-product_function .ws-web-product_function_content .ws-web-product_function_item {
        min-height: auto;
        border-right: none;
        padding: 16px 16px 0;
        width: 100%
    }

    .mobile .ws-web-product_function .ws-web-product_function_content .ws-web-product_function_item.col_3,.mobile .ws-web-product_function .ws-web-product_function_content .ws-web-product_function_item.col_4 {
        width: 100%
    }

    .mobile .ws-web-product_function .ws-web-product_function_content .ws-web-product_function_item span {
        width: 40px;
        height: 40px;
        margin-bottom: 16px
    }

    .mobile .ws-web-product_function .ws-web-product_function_content .ws-web-product_function_item span img {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-product_function-light h2.product_function_title {
        font-size:26px;
        line-height: 1.4;
        padding: 22px 0
    }

    .mobile .ws-web-product_function .product_function_content {
        padding: 0 16px
    }

    .mobile .ws-web-product_function .product_function_content ul.product_function_list {
        border: none;
        box-shadow: none
    }

    .mobile .ws-web-product_function .product_function_content ul.product_function_list li.product_function_area:hover .item_pic_hover {
        vertical-align: top
    }

    .mobile .ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .item_pic {
        vertical-align: top;
        float: left
    }

    .mobile .ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .item_pic_hover {
        float: left
    }

    .mobile .ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .product_function_item {
        padding: 10px 16px;
        box-shadow: none;
        border-right: none
    }

    .mobile .ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .product_function_item .arrow {
        margin-right: 0
    }

    .mobile .ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .item_detail {
        padding: 16px
    }

    .mobile .ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .item_detail ul {
        padding: 0 0 0 16px;
        margin-bottom: 0
    }

    .mobile .ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .item_detail ul li {
        width: 100%;
        margin-bottom: 0
    }

    .mobile .ws-web-product_function .product_function_content ul.product_function_list li.product_function_area .item_detail ul li:before {
        content: normal
    }

    .mobile .ws-web-product_function-deep h2.product_function_title {
        font-size: 26px;
        padding: 20px 0;
        line-height: 1.5em
    }
}

@media screen and (max-width: 768px) {
    .mobile .scenarios_primary {
        padding:0;
        overflow: hidden;
        background-color: #fff
    }

    .mobile .scenarios_primary h2.scenarios_title {
        font-size: 26px;
        line-height: 1.4;
        padding: 22px 0;
        text-align: center;
        margin-bottom: 0
    }
}

@media screen and (max-width: 768px) {
    .mobile .scenarios_tabs ul.tabs_item {
        display:flex;
        flex-flow: row wrap
    }

    .mobile .scenarios_tabs ul.tabs_item li {
        flex: 1;
        overflow: visible;
        overflow: initial;
        padding: 8px;
        font-size: 12px;
        line-height: 1.2;
        white-space: normal;
        height: auto;
        word-break: break-word;
        min-width: 50px
    }

    .mobile .scenarios_tabs ul.tabs_item li img {
        width: 24px;
        height: 24px
    }

    .mobile .scenarios_tabs .scenarios_content .application_item_container {
        display: block
    }
}

@media screen and (max-width: 768px) {
    .mobile .application_img {
        padding:16px;
        width: auto
    }

    .mobile .application_img img {
        width: 100%
    }

    .mobile .usage_item {
        width: auto;
        padding: 0 16px
    }

    .mobile .userage-item-feature__content {
        text-align: center
    }

    .mobile .usage_item_container .userage-item-feature__content {
        margin: 0 0 20px
    }

    .mobile .usage_item_container .userage-item-feature__content:after {
        content: "";
        display: block;
        font-size: 0;
        height: 0;
        overflow: hidden;
        clear: both
    }

    .mobile .usage_item_container .userage-item-feature__content .userage-item-feature__item {
        float: none;
        margin-bottom: 10px;
        width: auto
    }

    .mobile .usage_item_container .userage-item-feature__content .userage-item-feature__item .item_title {
        margin: 10px auto
    }

    .mobile .usage_item_container .userage-item-feature__content .userage-item-feature__item span {
        width: 20px;
        height: 20px;
        vertical-align: top;
        margin-right: 5px
    }

    .mobile .usage_item_container .userage-item-feature__content .userage-item-feature__item .item_pic {
        width: 20px;
        height: auto
    }

    .mobile .usage_item_container .userage-item-feature__content .userage-item-feature__item .item_des {
        width: auto;
        padding: 0 16px;
        text-align: left
    }

    .mobile .usage_item_container .application_img,.mobile .usage_item_container .usage_item {
        width: 100%
    }

    .mobile .usage_item_container .usage_item .item_content {
        padding: 0
    }

    .mobile .usage_item_container .usage_item .item_content .product-use__markdown-item-description {
        margin-bottom: 10px
    }
}

@media screen and (max-width: 768px) {
    .mobile .info-collect {
        height:auto
    }

    .mobile .info-collect .bg-img {
        position: inherit;
        width: 100%;
        height: auto;
        transform: none;
        vertical-align: top;
        left: 0
    }

    .mobile .info-collect .info-collect-wrapper {
        position: inherit
    }

    .mobile .info-collect .info-collect-wrapper .info-collect-main {
        width: 100%;
        padding: 16px;
        justify-content: center!important
    }

    .mobile .info-collect .info-collect-wrapper .info-collect-main .info-collect-form .form-control {
        margin-bottom: 10px
    }

    .mobile .info-collect .info-collect-wrapper .info-collect-main .info-collect-form .info-collect-form_title {
        font-size: 26px;
        font-weight: 500;
        line-height: 1.4
    }

    .mobile .info-collect .info-collect-wrapper .info-collect-main .info-collect-form .info-collect-form_desc {
        margin-bottom: 10px
    }
}

@media screen and (max-width: 768px) {
    .mobile .scene-tabs ul.tabs_item {
        display:flex;
        flex-flow: row wrap;
        margin-top: 16px
    }

    .mobile .scene-tabs ul.tabs_item li {
        flex: 1;
        padding: 8px;
        font-size: 12px;
        height: 60px;
        white-space: pre-line;
        word-break: break-word;
        line-height: 1.5em;
        min-width: 50px
    }

    .mobile .scene-tabs ul.tabs_item li img {
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 768px) {
    .mobile .solution-arch {
        padding:16px 0
    }

    .mobile .solution-arch h2.solution-arch__title {
        line-height: 1.2;
        margin: 0;
        padding: 0;
        font-size: 26px
    }

    .mobile .solution-arch .solution-arch__container .solution-arch__content {
        padding: 10px;
        margin: 16px
    }

    .mobile .solution-arch .solution-arch__container .solution-arch__content .solution-arch__block,.mobile .solution-arch .solution-arch__container .solution-arch__content .solution-arch__block .solution-arch__image {
        width: 100%
    }

    .mobile .solution-arch .solution-arch__container .solution-arch__content .solution-arch__text {
        margin-top: 16px;
        min-height: auto;
        width: auto
    }

    .mobile .solution-arch .solution-arch__container .solution-arch__content .solution-arch__text .solution-arch__markdown-item-description {
        margin-bottom: 10px
    }
}

@media screen and (max-width: 768px) {
    .mobile .solution-usage {
        padding:16px 0
    }

    .mobile .solution-usage h2.solution-usage__title {
        padding: 0;
        margin-bottom: 10px;
        font-size: 26px
    }

    .mobile .solution-usage .solution-usage__container .solution-usage__content {
        font-size: medium;
        padding: 0 16px
    }

    .mobile .solution-usage .portal-mobi-sliders .portal-mobi-sliders__item .portal-mobi-sliders__text-area {
        padding: 16px
    }

    .mobile .solution-usage .portal-mobi-sliders__description {
        font-size: 14px
    }

    .mobile .solution-usage .nut-swiper.horizontal .nut-swiper-pagination {
        bottom: 5px
    }
}

@media screen and (max-width: 768px) {
    .mobile .sliders .sliders__body .sliders__banner {
        overflow:auto
    }

    .mobile .sliders .sliders__body .sliders__banner .sliders__list {
        position: static
    }
}

@media screen and (max-width: 768px) {
    .mobile .common-empty {
        padding:70px 0
    }

    .mobile .common-empty .common-empty-content {
        min-width: auto;
        margin: 0 auto;
        text-align: center
    }

    .mobile .common-empty .common-empty-content p {
        font-size: 13px;
        color: rgba(0,0,0,.85)
    }
}

.mobile .mobile-cate-show {
    padding-left: 16px
}

.mobile .mobile-cate-show .svg-icon-contain {
    font-size: 16px
}

.mobile .help_container {
    padding-top: 16px;
    margin-bottom: 0;
    display: block
}

.mobile .help_container .help_menus {
    float: none;
    width: auto;
    height: 100%;
    padding-top: 5px;
    overflow-y: auto
}

.mobile .help_container .help_doc {
    padding: 16px;
    margin-left: 0;
    width: auto
}

.mobile .help_container .help_doc .skipArticle {
    margin-top: 20px
}

.mobile .help_container .help_doc .skipArticle a {
    float: none;
    display: block;
    margin-bottom: 0
}

.mobile .document-detail-wrap {
    padding-right: 0
}

.mobile .document-detail {
    padding-top: 16px
}

.mobile .document-detail .document-detail__markdown .document-detail__header {
    padding-bottom: 10px
}

.mobile .document-detail .document-detail__markdown .document-detail__header .document-detail__title {
    font-size: 20px
}

.mobile .document-detail .document-detail__markdown .document-detail__header .document-detail__update {
    margin-top: 6px
}

.mobile .document-detail .document-detail__markdown .markdown-item-content p {
    margin-bottom: 8px
}

.mobile .document-detail .document-detail__markdown .markdown-item-content h2 {
    margin-top: 20px;
    margin-bottom: 8px;
    font-weight: 400
}

.mobile .document-catemenu {
    display: none
}

.mobile .search_tabs {
    height: 40px;
    line-height: 40px
}

.mobile .search-tabs__menu {
    font-size: 14px;
    padding: 0 20px
}

.mobile .search-tabs__menu-name {
    display: block
}

.mobile .help_Search .search_tabs .search_tabs_btn a {
    padding: 0 16px;
    font-size: 14px;
    height: 40px;
    line-height: 38px
}

@media screen and (max-width: 768px) {
    .help_Search .search_tabs .search_tabs_btn {
        overflow-x:scroll;
        display: flex
    }

    .help_Search .search_tabs .search_tabs_btn::-webkit-scrollbar {
        width: 0
    }

    .help_Search .search_tabs .search_tabs_btn::-o-scrollbar {
        width: 0
    }

    .help_Search .search_tabs .search_tabs_btn::-moz-scrollbar {
        width: 0
    }

    .help_Search .search_container {
        margin-top: 20px
    }

    .help_Search .search_container .search_contents {
        padding: 0 20px
    }

    .help_Search .search_container .search_contents ul.search_results p.des a {
        word-break: break-word
    }
}

.mobile .help_header_search {
    height: auto;
    min-height: 220px
}

.mobile .help_header {
    height: auto;
    min-height: 150px
}

.mobile .help_search_input {
    padding: 30px 16px
}

.mobile .help_search_input h3 {
    margin-bottom: 20px;
    font-size: 26px
}

.mobile .help_search_input .search_wrap input {
    height: 32px
}

.mobile .help_search_input .search_wrap .search_btn {
    width: 60px;
    padding: 7px 0;
    line-height: 18px;
    font-size: 15px
}

@media screen and (max-width: 768px) {
    .mobile .activity-combo {
        padding-bottom:20px
    }

    .mobile .activity-combo .content {
        padding: 0 16px
    }

    .mobile .activity-combo .content .title {
        padding-top: 20px;
        line-height: 1.5;
        font-size: 16px
    }

    .mobile .activity-combo .content .desc {
        margin-top: 5px;
        font-size: 12px
    }

    .mobile .activity-combo .content .desc .rule {
        margin-left: 2px;
        display: block
    }

    .mobile .activity-combo .content .modules {
        margin-top: 0;
        flex-flow: row wrap;
        justify-self: start
    }

    .mobile .activity-combo .content .modules .modules-img {
        margin: 8px 0;
        width: 100%
    }

    .mobile .activity-combo .content .modules .modules-item {
        margin-right: 0;
        margin-bottom: 16px;
        width: 100%;
        padding-bottom: 35px
    }

    .mobile .activity-combo .content .modules .modules-item:last-child {
        margin-bottom: 0
    }

    .mobile .activity-combo .content .modules .modules-item .modules-item__title {
        height: 45px;
        line-height: 52px;
        font-size: 16px;
        background-position: bottom
    }

    .mobile .activity-combo .content .modules .modules-item .modules-item__title .modules-item__tag {
        width: 90px;
        height: 28px;
        line-height: 28px;
        font-size: 14px
    }

    .mobile .activity-combo .content .modules .modules-item .modules-item__select .option-label {
        line-height: 32px
    }

    .mobile .activity-combo .content .modules .modules-item .modules-item__select .el-select .el-input__inner {
        height: 32px;
        line-height: 32px
    }

    .mobile .activity-combo .content .modules .modules-item .modules-item__select .el-select .el-input__icon {
        line-height: 32px
    }

    .mobile .activity-combo .content .modules .modules-item .ws-activity-desc {
        padding: 10px 15px 0 8vw
    }

    .mobile .activity-combo .content .modules .modules-item .ws-activity-desc .markdown-item-content p {
        margin-bottom: 2px;
        font-size: 13px
    }

    .mobile .activity-combo .content .modules .modules-item .ws-activity-desc .markdown-item-content p:last-child {
        margin-bottom: 6px!important
    }

    .mobile .activity-combo .content .modules .modules-item .modules-item__label {
        padding-left: 8vw
    }

    .mobile .activity-combo .content .modules .modules-item .ws-activity-price {
        padding: 6px 12px 0 8vw
    }

    .mobile .activity-combo .content .modules .modules-item .ws-activity-price .new-price em {
        font-size: 26px;
        line-height: 26px
    }

    .mobile .activity-combo .content .modules .modules-item .modules-item__button {
        height: 35px;
        line-height: 35px;
        font-size: 15px
    }

    .mobile .activity-combo .combo-mask-container .combo-mask-content {
        width: 85vw;
        top: 40px;
        left: 7%;
        padding: 14px
    }

    .mobile .activity-combo .combo-mask-container .combo-mask-content .combo-mask-content-title {
        padding: 10px 0;
        font-size: 16px
    }

    .mobile .activity-combo .combo-mask-container .combo-mask-content .combo-mask-content-info .markdown-item {
        padding-right: 14px
    }

    .mobile .activity-combo .combo-mask-container .combo-mask-content .combo-mask-content-button {
        margin-top: 14px;
        width: 70px;
        height: 30px;
        line-height: 30px
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-activity .ws-activity-banner {
        background:none;
        display: inline;
        display: initial
    }

    .mobile .ws-web-activity .ws-activity-banner img {
        vertical-align: top;
        width: 100%
    }

    .mobile .ws-web-activity .ws-activity-banner .product_banner_main {
        box-sizing: border-box
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-price-content {
        padding:8px 0
    }

    .mobile .ws-web-price-content .top-tab {
        height: auto;
        line-height: 2.5em;
        position: relative
    }

    .mobile .ws-web-price-content .top-tab .switch-product {
        width: 100%;
        padding-left: .4em;
        min-width: 0;
        border-right: none;
        border-bottom: 1px solid #d8d8d8
    }

    .mobile .ws-web-price-content .top-tab .switch-product img {
        width: 20px;
        height: 20px
    }

    .mobile .ws-web-price-content .top-tab .switch-product .product-title {
        margin-left: 5px;
        margin-right: 4px;
        line-height: 2.5em;
        font-size: 1.2em
    }

    .mobile .ws-web-price-content .top-tab .switch-product .switch-product-arrow {
        margin-right: .4em
    }

    .mobile .ws-web-price-content .top-tab .switch-product .switch-product-arrow .arrow-item {
        border-width: .4em
    }

    .mobile .ws-web-price-content .top-tab .show-detail {
        padding-left: 16px;
        line-height: 2.6em;
        font-size: .9em;
        float: left
    }

    .mobile .ws-web-price-content .switch-menu {
        width: 100%;
        padding: 8px 10px 6px;
        top: 101px
    }

    .mobile .ws-web-price-content .switch-menu .switch-menu-item {
        margin-bottom: 6px;
        width: 100%;
        box-sizing: border-box;
        font-size: 1.1em
    }

    .mobile .ws-web-price-content .markdown-item {
        margin-top: 8px;
        padding: 5px 16px 22px
    }

    .mobile .ws-web-price-content .markdown-item .markdown-item-content {
        overflow: hidden
    }

    .mobile .ws-web-price-content .markdown-item .markdown-item-content h2 {
        margin-top: 20px;
        margin-bottom: 8px
    }

    .mobile .ws-web-price-content .markdown-item .markdown-item-content p {
        margin-bottom: 8px
    }

    .mobile .ws-web-price-content .markdown-item .markdown-item-content h4 {
        margin-top: 16px;
        margin-bottom: 8px
    }

    .mobile .ws-web-price-content .markdown-item .markdown-item-content ul {
        margin-bottom: 8px
    }

    .mobile .ws-web-price-content .markdown-item .markdown-item-content table td,.mobile .ws-web-price-content .markdown-item .markdown-item-content table th {
        padding: 3px 6px
    }
}

@media screen and (max-width: 768px) {
    .mobile .start-quick-start .content {
        padding:0 16px
    }

    .mobile .start-quick-start .content .title {
        margin-top: 20px;
        line-height: 20px;
        font-size: 20px
    }

    .mobile .start-quick-start .content>p {
        margin-top: 6px;
        font-size: 12px
    }

    .mobile .start-quick-start .content .card-list {
        padding-top: 20px;
        padding-bottom: 15px
    }

    .mobile .start-quick-start .content .card-list .card-list-item {
        margin-right: 0;
        margin-bottom: 8px;
        height: auto;
        padding: 10px 15px 12px 14px
    }

    .mobile .start-quick-start .content .card-list .card-list-item:last-child {
        margin-bottom: 0
    }

    .mobile .start-quick-start .content .card-list .card-list-item h4 {
        margin-bottom: 6px;
        font-size: 16px;
        font-weight: 400
    }

    .mobile .start-quick-start .content .card-list .card-list-item p {
        height: auto;
        line-height: 1.5;
        font-size: 13px
    }
}

@media screen and (max-width: 768px) {
    .mobile .ws-web-page__content {
        width:auto;
        margin: 0 auto;
        padding: 16px
    }

    .mobile .ws-web-page__content .ws-web-page__title {
        text-align: center;
        font-size: 26px;
        line-height: 38px
    }
}