@font-face {
    font-family: swiper-icons;
    src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
    font-weight: 400;
    font-style: normal
}

:root {
    --swiper-theme-color: #007aff
}

.swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1
}

.swiper-container-employee {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1
}

.swiper-container-vertical > .swiper-wrapper {
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box
}

.swiper-container-android .swiper-slide, .swiper-wrapper {
    transform: translateZ(0)
}

.swiper-container-multirow > .swiper-wrapper {
    flex-wrap: wrap
}

.swiper-container-multirow-column > .swiper-wrapper {
    flex-wrap: wrap;
    flex-direction: column
}

.swiper-container-free-mode > .swiper-wrapper {
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform
}

.swiper-slide-invisible-blank {
    visibility: hidden
}

.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide {
    height: auto
}

.swiper-container-autoheight .swiper-wrapper {
    align-items: flex-start;
    transition-property: transform, height
}

.swiper-container-3d {
    perspective: 1200px
}

.swiper-container-3d .swiper-cube-shadow, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-wrapper {
    transform-style: preserve-3d
}

.swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-container-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(270deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(90deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-3d .swiper-slide-shadow-top {
    background-image: linear-gradient(0deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-3d .swiper-slide-shadow-bottom {
    background-image: linear-gradient(180deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-css-mode > .swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar {
    display: none
}

.swiper-container-css-mode > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: start start
}

.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper {
    scroll-snap-type: x mandatory
}

.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper {
    scroll-snap-type: y mandatory
}

:root {
    --swiper-navigation-size: 44px
}

.swiper-button-next, .swiper-button-prev {
    position: absolute;
    top: 50%;
    width: calc(var(--swiper-navigation-size) / 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(-1 * var(--swiper-navigation-size) / 2);
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color, var(--swiper-theme-color))
}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
    opacity: .35;
    cursor: auto;
    pointer-events: none
}

.swiper-button-next:after, .swiper-button-prev:after {
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    text-transform: none;
    font-variant: normal;
    line-height: 1
}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    left: 10px;
    right: auto
}

.swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after {
    content: "prev"
}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    right: 10px;
    left: auto
}

.swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after {
    content: "next"
}

.swiper-button-next.swiper-button-white, .swiper-button-prev.swiper-button-white {
    --swiper-navigation-color: #fff
}

.swiper-button-next.swiper-button-black, .swiper-button-prev.swiper-button-black {
    --swiper-navigation-color: #000
}

.swiper-button-lock {
    display: none
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: opacity .3s;
    transform: translateZ(0);
    z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 10px;
    left: 0;
    width: 100%
}

.swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transform: scale(.33);
    position: relative
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active, .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    transform: scale(.33)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    transform: scale(.33)
}

.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 100%;
    background: #000;
    opacity: .2
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--swiper-pagination-color, var(--swiper-theme-color))
}

.swiper-container-vertical > .swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    transform: translate3d(0, -50%, 0)
}

.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 6px 0;
    display: block
}

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    transform: translateY(-50%);
    width: 8px
}

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    display: inline-block;
    transition: transform .2s, top .2s
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 4px
}

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap
}

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: transform .2s, left .2s
}

.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: transform .2s, right .2s
}

.swiper-pagination-progressbar {
    background: rgba(0, 0, 0, .25);
    position: absolute
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transform-origin: left top
}

.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    transform-origin: right top
}

.swiper-container-horizontal > .swiper-pagination-progressbar, .swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0
}

.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-container-vertical > .swiper-pagination-progressbar {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0
}

.swiper-pagination-white {
    --swiper-pagination-color: #fff
}

.swiper-pagination-black {
    --swiper-pagination-color: #000
}

.swiper-pagination-lock {
    display: none
}

.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0, 0, 0, .1)
}

.swiper-container-horizontal > .swiper-scrollbar {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%
}

.swiper-container-vertical > .swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%
}

.swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0, 0, 0, .5);
    border-radius: 10px;
    left: 0;
    top: 0
}

.swiper-scrollbar-cursor-drag {
    cursor: move
}

.swiper-scrollbar-lock {
    display: none
}

.swiper-zoom-container {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center
}

.swiper-zoom-container > canvas, .swiper-zoom-container > img, .swiper-zoom-container > svg {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain
}

.swiper-slide-zoomed {
    cursor: move
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    transform-origin: 50%;
    animation: swiper-preloader-spin 1s linear infinite;
    box-sizing: border-box;
    border-radius: 50%;
    border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
    border-top: 4px solid transparent
}

.swiper-lazy-preloader-white {
    --swiper-preloader-color: #fff
}

.swiper-lazy-preloader-black {
    --swiper-preloader-color: #000
}

@keyframes swiper-preloader-spin {
    to {
        transform: rotate(1turn)
    }
}

.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
    transition-timing-function: ease-out
}

.swiper-container-fade .swiper-slide {
    pointer-events: none;
    transition-property: opacity
}

.swiper-container-fade .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-cube {
    overflow: visible
}

.swiper-container-cube .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1;
    visibility: hidden;
    transform-origin: 0 0;
    width: 100%;
    height: 100%
}

.swiper-container-cube .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
    transform-origin: 100% 0
}

.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-next + .swiper-slide, .swiper-container-cube .swiper-slide-prev {
    pointer-events: auto;
    visibility: visible
}

.swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-cube .swiper-slide-shadow-top {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-container-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .6;
    -webkit-filter: blur(50px);
    filter: blur(50px);
    z-index: 0
}

body, html {
    -webkit-locale: auto
}

html {
    --smart-font-family: "FF Mark"
}

html[lang^=zh-] {
    --smart-font-family: "-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji"
}

#__next, body {
    scroll-behavior: smooth;
    font-family: Frutiger Neue LT Pro
}

html[lang=zh-CN] body {
    font-family: "-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji"
}

#__next {
    width: 100%;
    height: 100%
}


.pangle-section {
    transition: background-color .4s ease-in-out
}

.pangle-section.dark-mode, .pangle-section.dark-mode ~ .pangle-section.follow-dark-mode:not(.break-follow), .pangle-section.dark-mode ~ :not(.break-follow) ~ .pangle-section.follow-dark-mode:not(.break-follow) {
    background-color: #141e28
}

.pangle-section.dark-mode ~ .break-follow ~ .pangle-section.follow-dark-mode {
    background-color: transparent
}

.ant-btn.btn-invert, .btn-invert {
    border-color: #1890ff;
    color: #1890ff;
    background: #fff
}

.ant-btn.btn-invert:hover, .btn-invert:hover {
    border-color: #40a9ff;
    color: #40a9ff
}

.homepage-advantage {
    height: 614px;
    padding: 16px 20px
}

.homepage-advantage .container {
    height: 100%;
    text-align: center
}

.homepage-advantage .container .titleContent {
    margin: 0 auto;
    opacity: 0;
    transform: translateY(60px)
}

.homepage-advantage .container .titleContent h3 {
    font-size: 16px;
    line-height: 19px;
    margin-bottom: 16px
}

.homepage-advantage .container .titleContent h2 {
    font-size: 40px;
    line-height: 49px;
    margin-bottom: 0
}

.homepage-advantage .container .CT-titleContent-enter {
    opacity: 0;
    transform: translateY(60px)
}

.homepage-advantage .container .CT-titleContent-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: all 1s ease-out
}

.homepage-advantage .container .CT-titleContent-enter-done {
    opacity: 1;
    transform: translateY(0)
}

.homepage-advantage .container .jsonContent {
    padding-top: 72px;
    display: flex;
    justify-content: space-between;
    width: 1140px;
    height: 241px;
    margin: 0 auto
}

.homepage-advantage .container .jsonContent .advantageBox {
    width: 300;
    height: 241px
}

.homepage-advantage .container .jsonContent .advantageBox .advantageContainer {
    width: 120px;
    height: 12px;
    margin: 0 auto
}

.homepage-advantage .container .jsonContent .advantageBox .CT-advantageJson-appear {
    opacity: .8
}

.homepage-advantage .container .jsonContent .advantageBox .CT-advantageJson-appear-active {
    opacity: 1;
    transition: all 1s ease-out
}

.homepage-advantage .container .jsonContent .advantageBox .advantageText {
    opacity: 0;
    transform: translateY(60px)
}

.homepage-advantage .container .jsonContent .advantageBox .advantageText .advantageTitle {
    margin-top: 16px;
    font-size: 24px;
    line-height: 29px;
    text-align: center;
    color: #222;
    margin-bottom: 16px;
    font-weight: 600;
    /* font-family: var(--smart-font-family, "FF Mark") */
}

.homepage-advantage .container .jsonContent .advantageBox .advantageText .quadrangleMini {
    margin: 0 auto;
    width: 32px;
    height: 2px;
    background-color: #258162;
    transform: skew(-45deg)
}

.homepage-advantage .container .jsonContent .advantageBox .advantageText .advantageAbstract {
    margin-top: 16px;
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    width: 310px;
    height: 66px;
    text-align: left;
    color: #666
}

.homepage-advantage .container .jsonContent .advantageBox .CT-advantageText-enter {
    opacity: 0;
    transform: translateY(60px)
}

.homepage-advantage .container .jsonContent .advantageBox .CT-advantageText-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: all 1s ease-out
}

.homepage-advantage .container .jsonContent .advantageBox .CT-advantageText-enter-done {
    margin-top: 110px;
    opacity: 1;
    transform: translateY(0)
}

.homepage-adStyle {
    height: 760px;
    background-color: transparent
}

.homepage-adStyle .container-CN {
    height: 760px;
    text-align: center
}

.homepage-adStyle .container-CN .titleContent {
    position: relative;
    z-index: 1;
    width: 700px;
    /* padding-top: 80px; */
    margin: 0 auto;
    margin-bottom: 10vh;
}

.homepage-adStyle .container-CN .titleContent .ad-style-title {
    display: block;
    margin-bottom: 0;
    font-size: 32px;
    line-height: 32px;
    font-weight: 500;
    color: #fff
}

.homepage-adStyle .container-CN .titleContent .ad-style-subtitle {
    display: block;
    margin-bottom: 0;
    margin-top: 30px;
    font-size: 14px;
    line-height: 16px;
    font-weight: 200;
    color: hsla(0, 0%, 100%, .65);
}

.homepage-adStyle .container-CN .titleContent .CT-h1-appear {
    opacity: 0;
    transform: translateY(100px)
}

.homepage-adStyle .container-CN .titleContent .CT-h1-appear-active {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .6s ease-out, transform 1s ease-out
}

.homepage-adStyle .container-CN .titleContent .CT-h1-appear-done {
    opacity: 1;
    transform: translateY(0)
}

.homepage-adStyle .container-CN .titleContent .viewDetails {
    display: inline-block;
    position: relative;
    margin-top: 24px;
    font-size: 16px;
    color: hsla(0, 0%, 100%, .65);
    opacity: 0;
    transform: translateY(32px)
}

.homepage-adStyle .container-CN .titleContent .viewDetails img {
    margin-top: -3px
}

.homepage-adStyle .container-CN .titleContent .CT-viewDetails-exit {
    opacity: 0;
    transform: translateY(32px);
    transition: all 1.5s ease-out
}

.homepage-adStyle .container-CN .titleContent .CT-viewDetails-exit-active {
    opacity: 1;
    transform: translateY(0);
    transition: all 1.5s ease-out
}

.homepage-adStyle .container-CN .titleContent .CT-viewDetails-exit-done {
    opacity: 1;
    transform: translateY(0)
}

.homepage-adStyle .container-CN .titleContentLayer:after {
    content: "";
    position: absolute;
    z-index: 2;
    background-color: #fff;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    cursor: auto
}

.homepage-adStyle .container-CN .mainContent {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    height: 480px
}

.homepage-adStyle .container-CN .mainContent .quadrangleContent {
    position: absolute;
    z-index: 1;
    margin: 0 auto;
    width: 1200px;
    height: 480px
}

.homepage-adStyle .container-CN .mainContent .quadrangleContent .quadrangle {
    display: inline-block;
    height: 480px;
    width: 240px;
    position: relative
}

.homepage-adStyle .container-CN .mainContent .quadrangleContent .quadrangle-Left {
    background-color: #1b242d;
    margin-right: 480px;
    transform: translateX(2px)
}

.homepage-adStyle .container-CN .mainContent .quadrangleContent .quadrangle-Right {
    background-color: #1b242d;
    transform: translateX(-2px)
}

.homepage-adStyle .container-CN .mainContent .quadrangleContent .quadrangle-Left:after, .homepage-adStyle .container-CN .mainContent .quadrangleContent .quadrangle-Right:before {
    content: "";
    position: absolute;
    top: 0;
    width: 0;
    height: 0
}

.homepage-adStyle .container-CN .mainContent .quadrangleContent .quadrangle-Left:after {
    left: 100%;
    border-top: 480px solid #1b242d;
    border-right: 480px solid transparent
}

.homepage-adStyle .container-CN .mainContent .quadrangleContent .quadrangle-Right:before {
    right: 100%;
    border-bottom: 480px solid #1b242d;
    border-left: 480px solid transparent
}

.homepage-adStyle .container-CN .mainContent .quadrangleContent .CT-quadrangleLeft-enter, .homepage-adStyle .container-CN .mainContent .quadrangleContent .CT-quadrangleRight-enter {
    opacity: 0;
    transform: translateY(20px)
}

.homepage-adStyle .container-CN .mainContent .quadrangleContent .CT-quadrangleLeft-enter-active, .homepage-adStyle .container-CN .mainContent .quadrangleContent .CT-quadrangleRight-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: all 1s ease-out
}

.homepage-adStyle .container-CN .mainContent .quadrangleContent .CT-quadrangleLeft-exit, .homepage-adStyle .container-CN .mainContent .quadrangleContent .CT-quadrangleRight-exit {
    opacity: 1;
    transform: translateX(0)
}

.homepage-adStyle .container-CN .mainContent .quadrangleContent .CT-quadrangleLeft-exit-active {
    opacity: 0;
    transform: translateX(-70px);
    transition: all 1.5s ease-out
}

.homepage-adStyle .container-CN .mainContent .quadrangleContent .CT-quadrangleRight-exit-active {
    opacity: 0;
    transform: translateX(70px);
    transition: all 1.5s ease-out
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent {
    position: absolute;
    z-index: 3;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    width: 640px;
    height: 400px
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup {
    display: flex;
    justify-content: space-between;
    height: 200px;
    width: 320px;
    padding: 26px 8px;
    opacity: 0;
    transform: translateY(20px)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox {
    height: 148px;
    width: 148px
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon {
    margin: 0 auto;
    width: 60px;
    height: 120px;
    background-position: 50%;
    cursor: pointer;
    transition: all .3s ease-out
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox h2 {
    margin-top: 20px;
    margin-bottom: 0;
    font-size: 12px;
    line-height: 12px;
    font-weight: 500;
    text-align: center;
    transition: all .3s ease-out;
    color: hsla(0, 0%, 100%, .65)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox h3 {
    margin-top: 8px;
    margin-bottom: 0;
    font-size: 12px;
    line-height: 12px;
    font-weight: 500;
    text-align: center;
    color: hsla(0, 0%, 100%, .35);
    opacity: 0
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIconClick {
    transition: all .3s ease-out
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon:hover ~ h2, .homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIconClick ~ h2 {
    transform: scale(1.33333);
    color: hsla(0, 0%, 100%, .85)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon:hover ~ h3, .homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIconClick ~ h3 {
    opacity: 1
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-fullscreen {
    background-image: url(../images/fullscreen_unacitve.png)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-immersionvideo {
    background-image: url(../images/deep_video_unactive.png)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-playable {
    background-image: url(../images/interact_unactive.png)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-stimulatevideo {
    background-image: url(../images/motivation_video_unactive.png)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-displayscreen {
    background-image: url(../images/open_screen_unactive.png)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-infostream {
    background-image: url(../images/origin_info_unactive.png)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-tablescreen {
    background-image: url(../images/insert_screen_unactive.png)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-banner {
    background-image: url(../images/banner_unactive.png)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-fullscreen.minPhoneIconClick, .homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-fullscreen:hover {
    background-image: url(../images/fullscreen_acitve.png)!important;
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-immersionvideo.minPhoneIconClick, .homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-immersionvideo:hover {
    background-image: url(../images/deep_video_active.png)!important;
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-infostream.minPhoneIconClick, .homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-infostream:hover {
    background-image: url(../images/origin_info_active.png)!important;
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-playable.minPhoneIconClick, .homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-playable:hover {
    background-image: url(../images/interact_active.png)!important;
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-stimulatevideo.minPhoneIconClick, .homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-stimulatevideo:hover {
    background-image: url(../images/motivation_video_active.png)!important;
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-displayscreen.minPhoneIconClick, .homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-displayscreen:hover {
    background-image: url(../images/open_screen_active.png)!important;
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-tablescreen.minPhoneIconClick, .homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-tablescreen:hover {
    background-image: url(../images/insert_screen_active.png)!important;
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-banner.minPhoneIconClick, .homepage-adStyle .container-CN .mainContent .minPhoneContent .minPhoneGroup .minPhoneBox .minPhoneIcon-banner:hover {
    background-image: url(../images/banner_active.png)!important;
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-LowLeft-enter, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-LowRight-enter, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-TopLeft-enter, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-TopRight-enter {
    opacity: 0;
    transform: translateY(20px)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-TopLeft-enter-active, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-TopRight-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: all .8s ease-out 1s
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-TopLeft-enter-done, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-TopRight-enter-done {
    opacity: 1;
    transform: translateY(0)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-LowLeft-enter-active, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-LowRight-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: all .8s ease-out 1.3s
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-LowLeft-enter-done, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-LowRight-enter-done {
    opacity: 1;
    transform: translateY(0)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-LowLeft-exit, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-LowRight-exit, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-TopLeft-exit, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-TopRight-exit {
    opacity: 1;
    transform: translateX(0)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-LowLeft-exit-active, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-TopLeft-exit-active {
    opacity: 1;
    transform: translateX(-196px);
    transition: all 1.2s ease-out
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-LowLeft-exit-done, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-TopLeft-exit-done {
    opacity: 1;
    transform: translateX(-196px)
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-LowRight-exit-active, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-TopRight-exit-active {
    opacity: 1;
    transform: translateX(196px);
    transition: all 1.2s ease-out
}

.homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-LowRight-exit-done, .homepage-adStyle .container-CN .mainContent .minPhoneContent .CT-minPhoneGroup-TopRight-exit-done {
    opacity: 1;
    transform: translateX(196px)
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent {
    position: absolute;
    z-index: 2;
    margin: 0 auto;
    perspective: 1200px
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent .maxPhoneIcon {
    border-radius: 25px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    transition: background-image .3s ease-out
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent .CT-maxPhoneIcon-appear {
    opacity: 0;
    transform: rotateX(30deg)
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent .CT-maxPhoneIcon-appear-active {
    opacity: 1;
    transform: rotate(0);
    transition: transform 1.5s cubic-bezier(.26, 1, .48, 1) .5s, opacity 1.2s linear .8s
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent .CT-maxPhoneIcon-appear-done {
    opacity: 1;
    transform: rotate(0)
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent .maxPhoneIcon-fullscreen {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/FullScreen.ae23e93b.png)
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent .maxPhoneIcon-immersionvideo {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/ImmersionVideo.34503735.jpeg)
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent .maxPhoneIcon-playable {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/Playable.0be3886a.jpeg)
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent .maxPhoneIcon-stimulatevideo {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/StimulateVideo.7c6f6bb9.jpeg)
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent .maxPhoneIcon-displayscreen {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/DisplayScreen.0124213e.jpeg)
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent .maxPhoneIcon-infostream {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/InfoStream.a2210045.jpeg)
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent .maxPhoneIcon-tablescreen {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/TableScreen.85c207a8.jpeg)
}

.homepage-adStyle .container-CN .mainContent .maxPhoneContent .maxPhoneIcon-banner {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/Banner.0664163b.jpeg)
}

.homepage-adStyle .container-CN .mainContentLayer:after {
    content: "";
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0
}

.homepage-adStyle .container-US {
    height: 760px;
    width: 960px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: 80px
}

.homepage-adStyle .container-US .left-phone {
    position: relative;
    opacity: 0;
    transform: translateY(100px)
}

.homepage-adStyle .container-US .left-phone .title {
    width: 505px;
    min-height: 112px;
    font-weight: 600;
    font-size: 40px;
    line-height: 140%;
    color: #fff;
    margin-bottom: 24px
}

.homepage-adStyle .container-US .left-phone .desc {
    width: 412px;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: hsla(0, 0%, 100%, .65);
    margin-bottom: 24px
}

.homepage-adStyle .container-US .left-phone .more {
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    color: #fff;
    margin-bottom: 60px;
    cursor: pointer;
    display: inline-block
}

.homepage-adStyle .container-US .left-phone .phone-contain {
    display: flex
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box {
    width: 122px;
    height: 146px;
    margin-right: 8px
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box .phone {
    width: 100%;
    height: 110px;
    text-align: center;
    font-weight: 500;
    font-size: 12px;
    line-height: 18px;
    color: hsla(0, 0%, 100%, .65);
    box-sizing: border-box;
    padding-top: 130px;
    transition: background-image .3s ease-out;
    background-repeat: no-repeat;
    background-size: 100% 100%
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:first-child .phone {
    background-image: url(../images/fullscreen_unacitve.png);
    object-fit: fill;
    background-position: 50%
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(2) .phone {
    background-image: url(../images/deep_video_unactive.png);
    object-fit: fill;
    background-position: 50%
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(3) .phone {
    background-image: url(../images/origin_info_unactive.png);
    object-fit: fill;
    background-position: 50%
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(4) .phone {
    background-image: url(../images/interact_unactive.png);
    object-fit: fill;
    background-position: 50%
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(5) .phone {
    background-image: url(../images/motivation_video_unactive.png);
    object-fit: fill;
    background-position: 50%
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(6) .phone {
    background-image: url(../images/open_screen_unactive.png);
    object-fit: fill;
    background-position: 50%
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(7) .phone {
    background-image: url(../images/origin_info_unactive.png);
    object-fit: fill;
    background-position: 50%
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(8) .phone {
    background-image: url(../images/insert_screen_unactive.png);
    object-fit: fill;
    background-position: 50%
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(9) .phone {
    background-image: url(../images/banner_unactive.png);
    object-fit: fill;
    background-position: 50%
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:first-child .phone.active, .homepage-adStyle .container-US .left-phone .phone-contain .phone-box:first-child .phone:hover {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTM2IiBoZWlnaHQ9IjEzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB4PSIzOC4yNSIgeT0iMTIuNzUiIHdpZHRoPSI1OS41IiBoZWlnaHQ9IjExMC41IiByeD0iMS40MTciIGZpbGw9IiNCNUM5RDciLz48cmVjdCB4PSI0My45MTciIHk9IjE4LjQxNyIgd2lkdGg9IjQ4LjE2NyIgaGVpZ2h0PSI4Mi4xNjciIHJ4PSIxLjQxNyIgZmlsbD0iI2ZmZiIvPjxwYXRoIGZpbGw9IiNGRjBCMEIiIGQ9Ik00Ni43NSAyMS4yNWg0Mi41djc2LjVoLTQyLjV6Ii8+PHBhdGggZD0iTTcwLjgzMyA1OS41bC01LjMxMyAzLjY4di03LjM2bDUuMzEzIDMuNjh6IiBmaWxsPSIjZmZmIi8+PHJlY3QgeD0iNjMuNzUiIHk9IjEwNy42NjciIHdpZHRoPSI4LjUiIGhlaWdodD0iOC41IiByeD0iMS40MTciIGZpbGw9IiNmZmYiLz48L3N2Zz4=);
    cursor: pointer;
    color: #fff
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(2) .phone.active, .homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(2) .phone:hover {
    background-image: url(../images/deep_video_active.png);
    cursor: pointer;
    color: #fff
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(3) .phone.active, .homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(3) .phone:hover {
    background-image: url(../images/origin_info_active.png);
    cursor: pointer;
    color: #fff
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(4) .phone.active, .homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(4) .phone:hover {
    background-image: url(../images/interact_active.png);
    cursor: pointer;
    color: #fff
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(5) .phone.active, .homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(5) .phone:hover {
    background-image: url(../images/motivation_video_active.png);
    cursor: pointer;
    color: #fff
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(6) .phone.active, .homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(6) .phone:hover {
    background-image: url(../images/open_screen_active.png);
    cursor: pointer;
    color: #fff
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(7) .phone.active, .homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(7) .phone:hover {
    background-image: url(../images/insert_screen_active.png);
    cursor: pointer;
    color: #fff
}

.homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(8) .phone.active, .homepage-adStyle .container-US .left-phone .phone-contain .phone-box:nth-child(8) .phone:hover {
    background-image: url(../images/banner_active.png);
    cursor: pointer;
    color: #fff
}

.homepage-adStyle .container-US .large-phone {
    width: 222px;
    height: 481px;
    border: 8px solid grey;
    border-radius: 25px;
    margin-right: 111px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    transition: background-image .3s ease-out
}

.homepage-adStyle .container-US .fullscreen {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/FullScreen.ae23e93b.png)
}

.homepage-adStyle .container-US .immersionvideo {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/ImmersionVideo.34503735.jpeg)
}

.homepage-adStyle .container-US .playable {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/Playable.0be3886a.jpeg)
}

.homepage-adStyle .container-US .stimulatevideo {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/StimulateVideo.7c6f6bb9.jpeg)
}

.homepage-adStyle .container-US .displayscreen {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/DisplayScreen.0124213e.jpeg)
}

.homepage-adStyle .container-US .infostream {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/InfoStream.a2210045.jpeg)
}

.homepage-adStyle .container-US .tablescreen {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/TableScreen.85c207a8.jpeg)
}

.homepage-adStyle .container-US .banner {
    background-image: url(https://sf6-scmcdn-tos.pstatp.com/obj/goofy/ad/pangle/homepage/_next/static/assets/images/Banner.0664163b.jpeg)
}

.homepage-adStyle .container-US .CT-left-phone-enter {
    opacity: 0;
    transform: translateY(100px)
}

.homepage-adStyle .container-US .CT-left-phone-enter-active, .homepage-adStyle .container-US .CT-left-phone-enter-done {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .6s ease-out, transform 1s ease-out
}

.homepage-adStyle .container-US .CT-maxPhoneIcon-appear {
    opacity: 0;
    transform: translateY(100px)
}

.homepage-adStyle .container-US .CT-maxPhoneIcon-appear-active {
    opacity: 1;
    transform: translateY(0);
    transition: all .6s ease-out .4s
}

.phone-preview {
    position: relative;
    overflow: hidden;
    width: 240px;
    height: 500px
}

.phone-preview .static-phone-area {
    position: absolute;
    overflow: hidden;
    height: 100%;
    width: 100%;
    background-image: url(../images/homepage_phone_border.png);
    background-position: 50% 50%;
    background-size: 100%;
    background-repeat: no-repeat
}

.phone-preview .preview-image, .phone-preview .preview-video {
    position: absolute;
    width: 91.2% !important;
    height: 95.4% !important;
    top: 2%;
    left: 0;
    border-radius: 4%;
    right: 0;
    margin: 0 auto;
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover
}

.phone-preview .preview-fade-enter {
    opacity: 0
}

.phone-preview .preview-fade-enter-active, .phone-preview .preview-fade-exit {
    opacity: 1
}

.phone-preview .preview-fade-exit-active {
    opacity: 0
}

.phone-preview .preview-fade-enter-active, .phone-preview .preview-fade-exit-active {
    transition: opacity .4s
}

.mobile-page .phone-preview {
    width: 4.56rem;
    height: 0;
    padding-bottom: 208.33333333%
}

.home-resolve {
    height: 574px;
    padding: 126px 0 62px;
    background-color: transparent
}

.home-resolve .container {
    margin: 0 auto 62px;
    width: 980px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    opacity: 0;
    transform: translateY(60px)
}

.home-resolve .container .resolve-left {
    box-sizing: border-box;
    width: 440px
}

.home-resolve .container .resolve-left .resolve-headline {
    font-style: normal;
    font-weight: 500;
    font-size: 40px;
    line-height: 140%;
    color: #222;
    margin-bottom: 32px
}

.home-resolve .container .resolve-left .icons {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 48px
}

.home-resolve .container .resolve-left .icons .icon {
    width: 80px;
    height: 130px;
    color: #222;
    vertical-align: middle;
    padding-bottom: 10px;
    border-radius: 10px;
    text-align: center
}

.home-resolve .container .resolve-left .icons .icon span {
    display: inline-block;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    line-height: 22px;
    position: relative;
    top: 12px
}

.home-resolve .container .resolve-left .icons .icon:hover {
    transition: all .3s ease-in-out;
    cursor: pointer;
    color: #258162;
}

.home-resolve .container .resolve-left .icons .icon:first-child {
    /* background: url(../images/xiecheng_icon.png) no-repeat; */
    background-size: 65px;
    background-position: 8px 8px
}

.home-resolve .container .resolve-left .icons .icon:nth-child(2) {
    /* background: url(../images/beike_icon.png) no-repeat; */
    background-size: 65px;
    background-position: 8px 8px
}

.home-resolve .container .resolve-left .icons .icon:nth-child(3) {
    /* background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01Mi43MTQgMjUuMTQzaC0yLjQyOHYxNy4xNDNIMjcuNDI5djIuNDI4YTEgMSAwIDAwMSAxaDI1LjI4NVYyNi4xNDNhMSAxIDAgMDAtMS0xeiIgZmlsbD0iI0Q4REVFMiIvPjxwYXRoIGQ9Ik00NC41NzIgNDUuNzE0aDkuMTQydjYuMDg5YS41LjUgMCAwMS0uODA3LjM5NWwtOC4zMzUtNi40ODR6IiBmaWxsPSIjRDhERUUyIi8+PHBhdGggZD0iTTE4LjI4NiA0MEg5LjE0M3Y2Ljg5OGEuNS41IDAgMDAuODMuMzc2TDE4LjI4NSA0MHoiIGZpbGw9IiNBMkEyQTIiLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTEwLjE0MyAxMC4yODZhMSAxIDAgMDAtMSAxVjQwSDQ3YTEgMSAwIDAwMS0xVjExLjI4NmExIDEgMCAwMC0xLTFIMTAuMTQzem0xMS41NzIgMTIuNTcxaC00LjU3MnY0LjU3Mmg0LjU3MnYtNC41NzJ6bTkuMTQyIDBoLTQuNTcxdjQuNTcyaDQuNTcxdi00LjU3MnptNC41NzIgMEg0MHY0LjU3MmgtNC41N3YtNC41NzJ6IiBmaWxsPSIjQTJBMkEyIi8+PC9zdmc+) no-repeat; */
    background-position: 8px 8px
}

.home-resolve .container .resolve-left .icons .icon:nth-child(4) {
    /* background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3QgeD0iMTIuNTcxIiB5PSIxMi41NzIiIHdpZHRoPSIzOC44NTciIGhlaWdodD0iMzguODU3IiByeD0iMS4xNDMiIGZpbGw9IiNBMkEyQTIiLz48cGF0aCBkPSJNMjcuNDI5IDIxLjcxNHYyMC41NzJMMzguODU3IDMyIDI3LjQzIDIxLjcxNHoiIGZpbGw9IiNEOERFRTIiLz48L3N2Zz4=) no-repeat; */
    background-position: 8px 8px
}

.home-resolve .container .resolve-left .icons .icon:nth-child(5) {
    /* background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3QgeD0iMTIuNTcxIiB5PSIxMi41NzIiIHdpZHRoPSIxNy4xNDMiIGhlaWdodD0iMTcuMTQzIiByeD0iMS4xNDMiIGZpbGw9IiNBMkEyQTIiLz48cmVjdCB4PSIzNC4yODYiIHk9IjEyLjU3MiIgd2lkdGg9IjE3LjE0MyIgaGVpZ2h0PSIxNy4xNDMiIHJ4PSI4LjU3MSIgZmlsbD0iI0Q4REVFMiIvPjxyZWN0IHg9IjEyLjU3MSIgeT0iMzQuMjg2IiB3aWR0aD0iMTcuMTQzIiBoZWlnaHQ9IjE3LjE0MyIgcng9IjEuMTQzIiBmaWxsPSIjQTJBMkEyIi8+PHJlY3QgeD0iMzQuMjg2IiB5PSIzNC4yODYiIHdpZHRoPSIxNy4xNDMiIGhlaWdodD0iMTcuMTQzIiByeD0iMS4xNDMiIGZpbGw9IiNBMkEyQTIiLz48L3N2Zz4=) no-repeat; */
    background-position: 8px 8px
}

.home-resolve .container .resolve-left .icons .icon:first-child.active, .home-resolve .container .resolve-left .icons .icon:first-child:hover {
    /* background: url(../images/xiecheng_icon.png) no-repeat; */
    background-size: 65px;
    background-position: 8px 8px
}

.home-resolve .container .resolve-left .icons .icon:nth-child(2).active, .home-resolve .container .resolve-left .icons .icon:nth-child(2):hover {
    /* background: url(../images/beike_icon.png) no-repeat; */
    background-size: 65px;
    background-position: 8px 8px
}

.home-resolve .container .resolve-left .icons .icon:nth-child(3).active, .home-resolve .container .resolve-left .icons .icon:nth-child(3):hover {
    /* background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01Mi43MTQgMjUuMTQzaC0yLjQyOHYxNy4xNDNIMjcuNDI5djIuNDI4YTEgMSAwIDAwMSAxaDI1LjI4NVYyNi4xNDNhMSAxIDAgMDAtMS0xeiIgZmlsbD0iI0Q4REVFMiIvPjxwYXRoIGQ9Ik00NC41NzIgNDUuNzE0aDkuMTQydjYuMDg5YS41LjUgMCAwMS0uODA3LjM5NWwtOC4zMzUtNi40ODR6IiBmaWxsPSIjRDhERUUyIi8+PHBhdGggZD0iTTE4LjI4NiA0MEg5LjE0M3Y2Ljg5OGEuNS41IDAgMDAuODMuMzc2TDE4LjI4NSA0MHoiIGZpbGw9IiNGRjAwMTciLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTEwLjE0MyAxMC4yODZhMSAxIDAgMDAtMSAxVjQwSDQ3YTEgMSAwIDAwMS0xVjExLjI4NmExIDEgMCAwMC0xLTFIMTAuMTQzem0xMS41NzIgMTIuNTcxaC00LjU3MnY0LjU3Mmg0LjU3MnYtNC41NzJ6bTkuMTQyIDBoLTQuNTcxdjQuNTcyaDQuNTcxdi00LjU3MnptNC41NzIgMEg0MHY0LjU3MmgtNC41N3YtNC41NzJ6IiBmaWxsPSIjRkYwMDE3Ii8+PC9zdmc+) no-repeat; */
    background-position: 8px 8px
}

.home-resolve .container .resolve-left .icons .icon:nth-child(4).active, .home-resolve .container .resolve-left .icons .icon:nth-child(4):hover {
    /* background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3QgeD0iMTIuNTcxIiB5PSIxMi41NzIiIHdpZHRoPSIzOC44NTciIGhlaWdodD0iMzguODU3IiByeD0iMS4xNDMiIGZpbGw9IiNGRjAwMTciLz48cGF0aCBkPSJNMjcuNDI5IDIxLjcxNHYyMC41NzJMMzguODU3IDMyIDI3LjQzIDIxLjcxNHoiIGZpbGw9IiNEOERFRTIiLz48L3N2Zz4=) no-repeat; */
    background-position: 8px 8px
}

.home-resolve .container .resolve-left .icons .icon:nth-child(5).active, .home-resolve .container .resolve-left .icons .icon:nth-child(5):hover {
    /* background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3QgeD0iMTIuNTcxIiB5PSIxMi41NzIiIHdpZHRoPSIxNy4xNDMiIGhlaWdodD0iMTcuMTQzIiByeD0iMS4xNDMiIGZpbGw9IiNGRjAwMTciLz48cmVjdCB4PSIzNC4yODYiIHk9IjEyLjU3MiIgd2lkdGg9IjE3LjE0MyIgaGVpZ2h0PSIxNy4xNDMiIHJ4PSI4LjU3MSIgZmlsbD0iI0Q4REVFMiIvPjxyZWN0IHg9IjEyLjU3MSIgeT0iMzQuMjg2IiB3aWR0aD0iMTcuMTQzIiBoZWlnaHQ9IjE3LjE0MyIgcng9IjEuMTQzIiBmaWxsPSIjRkYwMDE3Ii8+PHJlY3QgeD0iMzQuMjg2IiB5PSIzNC4yODYiIHdpZHRoPSIxNy4xNDMiIGhlaWdodD0iMTcuMTQzIiByeD0iMS4xNDMiIGZpbGw9IiNGRjAwMTciLz48L3N2Zz4=) no-repeat; */
    background-position: 8px 8px
}

.home-resolve .container .resolve-left .icons .active {
    transition: all .5s ease-in;
    background-color: #fff;
    color: #258162;
    box-shadow: 0 4px 48px rgba(0, 0, 0, .16)
}

.home-resolve .container .resolve-left .icons .active span {
    font-weight: 500
}

.home-resolve .container .resolve-left .more {
    width: 140px;
    height: 44px;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    border: 1px solid #ff0017;
    border-radius: 2px;
    position: relative;
    z-index: 9
}

.home-resolve .container .resolve-left .more:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 44px;
    background: #ff0017;
    transition: width .2s ease-in;
    z-index: -1
}

.home-resolve .container .resolve-left .more:hover {
    color: #fff
}

.home-resolve .container .resolve-left .more:hover:after {
    width: 100%
}

.home-resolve .container .resolve-content {
    display: none
}

.home-resolve .container .resolve-content.resolve-content-active {
    display: block
}

.home-resolve .container .resolve-right {
    box-sizing: border-box;
    border-radius: 15px;
    width: 280px;
    height: 370px;
    margin-top: 230px;
    background-color: #fff;
    box-shadow: 0 4px 24px 0 hsla(0, 0%, 86.3%, .45);
    padding: 48px 61px 48px 40px;
    position: relative
}

.home-resolve .container .resolve-right .count {
    font-family: Clarity Mono;
    font-size: 16px;
    line-height: 19px;
    color: #d8dee2;
    margin-bottom: 32px
}

.home-resolve .container .resolve-right .count span {
    display: inline-block;
    font-size: 40px;
    line-height: 47px
}

.home-resolve .container .resolve-right .title {
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 25px;
    color: #222;
    margin-bottom: 34px;
    position: relative
}

.home-resolve .container .resolve-right .title:after {
    content: "";
    width: 28px;
    height: 2px;
    background-color: #258162;
    transform: skewX(-30deg);
    position: absolute;
    left: 0;
    top: 41px
}

.home-resolve .container .resolve-right .desc {
    width: 175px;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 180%;
    color: #666;
}

.home-resolve .container .resolve-right .img-box {
    width: 350px;
    position: absolute;
    top: -200px;
    left: -250px;
    transition: background-image .5s ease-in-out;
    display: none
}

.home-resolve .container .resolve-right .img-box.resolve-img-active {
    display: block
}

.home-resolve .container .resolve-right .CT-slide-count-enter {
    opacity: 0;
    transform: translateY(15px)
}

.home-resolve .container .resolve-right .CT-slide-count-exit, .home-resolve .container .resolve-right .CT-slide-count-exit-active {
    transition: all .01s ease;
    opacity: 0
}

.home-resolve .container .resolve-right .CT-slide-count-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: all .5s ease-in-out
}

.home-resolve .container .resolve-right .CT-slide-count-enter-done {
    opacity: 1;
    transform: translateY(0)
}

.home-resolve .container .resolve-right .CT-slide-left-enter {
    opacity: 0;
    transform: translateX(30px)
}

.home-resolve .container .resolve-right .CT-slide-left-enter-active {
    opacity: 1;
    transform: translateX(0);
    transition: all .5s ease-in-out
}

.home-resolve .container .resolve-right .CT-slide-left-enter-done {
    opacity: 1;
    transform: translateX(0)
}

.home-resolve .container .resolve-right .CT-slide-left-exit {
    opacity: 1
}

.home-resolve .container .resolve-right .CT-slide-left-exit-active {
    opacity: 0;
    transition: all .1s ease-out
}

.home-resolve .container .resolve-right .CT-slide-left-exit-done, .home-resolve .container .resolve-right .preview-fade-enter {
    opacity: 0
}

.home-resolve .container .resolve-right .preview-fade-enter-active, .home-resolve .container .resolve-right .preview-fade-exit {
    opacity: 1
}

.home-resolve .container .resolve-right .preview-fade-exit-active {
    opacity: 0
}

.home-resolve .container .resolve-right .preview-fade-enter-active, .home-resolve .container .resolve-right .preview-fade-exit-active {
    transition: opacity .3s
}

.home-resolve .CT-container-enter {
    opacity: 0;
    transform: translateY(60px)
}

.home-resolve .CT-container-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: all 1s ease-out
}

.home-resolve .CT-container-enter-done {
    opacity: 1;
    transform: translateY(0)
}

.home-case {
    height: 720px;
    font-style: normal;
    position: relative;
    background-color: #fff
}

.home-case .container {
    padding-top: 80px;
    opacity: 0;
    transform: translateY(60px)
}

.home-case .container .title {
    font-weight: 600;
    font-size: 40px;
    line-height: 140%;
    text-align: center;
    color: #000;
    margin-bottom: 6px
}

.home-case .container .swiper-container {
    max-width: 1280px;
    height: 450px;
    box-sizing: border-box
}

.home-case .container .swiper-container .swiper-wrapper .swiper-slide-active, .home-case .container .swiper-container .swiper-wrapper .swiper-slide-next {
    opacity: 1
}

.home-case .container .swiper-container .swiper-wrapper .swiper-slide-active {
    box-shadow: 12px 12px 12px 12px rgb(0 0 0 / 12%)
}

.home-case .container .swiper-container .swiper-wrapper .swiper-slide-next {
    box-shadow: 0 4px 36px rgba(0, 0, 0, .1)
}

.home-case .container .swiper-container .swiper-pagination {
    position: absolute;
    width: 5px;
    height: 160px;
    left: 50%;
    top: 50%;
    transform: translate3d(536px, -50%, 0)
}

.home-case .container .swiper-container .swiper-pagination-bullets {
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.home-case .container .swiper-container .swiper-pagination-bullets .swiper-pagination-bullet {
    cursor: pointer;
    width: 5px;
    height: 24px;
    background-color: #d8dee2;
    border-radius: 0;
    transform: skewY(-30deg);
    opacity: 1
}

.home-case .container .swiper-container .swiper-pagination-bullets .swiper-pagination-bullet-active {
    position: relative
}

.home-case .container .swiper-container .swiper-pagination-bullets .swiper-pagination-bullet-active:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #ff0017;
    padding-bottom: 0;
    animation: progress 3s linear
}

@keyframes progress {
    0% {
        height: 0%
    }

    to {
        height: 100%
    }
}

.home-case .CT-container-enter {
    opacity: 0;
    transform: translateY(60px)
}

.home-case .CT-container-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: all 1s ease-out
}

.home-case .CT-container-enter-done {
    opacity: 1;
    transform: translateY(0)
}

.home-case .home-case-item {
    width: 960px;
    height: 427px!important;
    margin: 0 auto;
    background-color: #fff;
    border-radius: 2px;
    opacity: 0;
    position: relative;
    display: flex;
    margin-top: 20px;
}

.home-case .home-case-item .case-detail {
    width: 400px;
    height: 100%;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
    object-fit: cover;
    flex: none
}

.home-case .home-case-item .slide-item-right {
    padding-left: 30px
}

.home-case .home-case-item .slide-item-right .case-icon {
    width: 80px;
    height: 80px;
    border: 1px solid #d8dee2;
    box-sizing: border-box;
    border-radius: 16px;
    margin-bottom: 24px;
    margin-top: 30px
}

.home-case .home-case-item .slide-item-right .title {
    font-weight: 600;
    font-size: 24px;
    line-height: 25px;
    color: #000;
    margin-bottom: 34px;
    text-align: start;
    position: relative;
    font-family: var(--smart-font-family, "FF Mark")
}

.home-case .home-case-item .slide-item-right .title:after {
    content: "";
    width: 28px;
    height: 2px;
    left: 0;
    top: 41px;
    position: absolute;
    background-color: #258162;
    transform: skewX(-30deg)
}

.home-case .home-case-item .slide-item-right .comment {
    font-weight: 400;
    font-size: 14px;
    line-height: 180%;
    color: #666;
    margin-bottom: 16px;
    margin-right: 24px
}

.home-case .home-case-item .slide-item-right .comment-detail {
    margin-bottom: 0
}

.home-case .home-case-item .slide-item-right .comment-by {
    font-weight: 500
}

.home-case .home-case-item .slide-item-right .slider-footer .growth-item {
    display: inline-block;
    margin-right: 48px
}

.home-case .home-case-item .slide-item-right .slider-footer .growth-item .growth-item-result {
    font-family: Clarity Mono;
    font-size: 0;
    color: #ff0017;
    margin-bottom: 8px
}

.home-case .home-case-item .slide-item-right .slider-footer .growth-item .growth-item-result span {
    font-size: 36px;
    line-height: 42px;
    vertical-align: bottom
}

.home-case .home-case-item .slide-item-right .slider-footer .growth-item .growth-item-result em {
    font-size: 16px;
    line-height: 24px;
    font-style: normal;
    margin-left: 4px;
    vertical-align: middle
}

.home-case .home-case-item .slide-item-right .slider-footer .growth-item .growth-item-desc {
    font-weight: 400;
    font-size: 14px;
    line-height: 14px;
    color: #999
}

.home-case.home-case-cn-region .home-case-item .case-icon {
    margin-top: 48px;
    margin-bottom: 32px
}

.home-content {
    height: 900px;
    background-color: transparent;
    padding: 64px 0 50px;
    box-sizing: border-box
}

.home-content .container .anli-item, .home-content .container .items {
    opacity: 0;
    transform: translateY(200px)
}

.home-content .container .title {
    font-style: normal;
    font-weight: 600;
    font-size: 40px;
    line-height: 140%;
    text-align: center;
    color: #000;
    margin-bottom: 16px
}

.home-content .container .desc {
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 180%;
    text-align: center;
    color: #666
}

.home-content .container .items {
    margin: 30px auto 275px;
    width: 1130px;
    max-width: 1280px;
    display: flex;
    justify-content: space-between
}

.home-content .container .items .item {
    margin-top: 80px;
    width: 356px;
    height: 410px;
    padding: 60px 15px 0 46px;
    position: relative;
    box-sizing: border-box;
    background-color: #fff;
    transform: skewY(25deg);
    box-shadow: 0 4px 24px 0 hsla(0, 0%, 86.3%, .45);
    border-radius: 5px
}

.home-content .container .items .item:hover {
    cursor: pointer;
    transition: all .3s ease-in;
    background-color: #42ca9c
}

.home-content .container .items .item:hover .item-content {
    transition: opacity 1s ease-in;
    z-index: 99
}

.home-content .container .items .item:hover .item-content .item-title {
    color: #fff
}

.home-content .container .items .item:hover .item-content .item-title:after {
    background: #fff
}

.home-content .container .items .item:hover .item-content .item-desc {
    color: #fff
}

.home-content .container .items .item:hover .item-content .item-foot {
    color: #fff;
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTE2IDBIMHYxNmgxNlYweiIgZmlsbD0iI2ZmZiIgZmlsbC1vcGFjaXR5PSIuMDEiLz48cGF0aCBkPSJNMTQgOEgyIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMS4zMzMiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPjxwYXRoIGQ9Ik0xMCA0bDQgNC00IDQiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIxLjMzMyIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+) no-repeat;
    background-position: 60px 1px
}

.home-content .container .items .item .item-content {
    transform: skewY(-25deg);
    height: 250px;
    padding-top: 51px;
    padding-bottom: 100px;
    padding-right: 25px;
    /* position: relative */
}
.home-content .container .items .item:nth-child(Odd) .item-content img{
    position: absolute;
    top:-50px;
    left: -25px;
    width: 105px;
    height: 95px;
}
.home-content .container .items .item:nth-child(even) .item-content img{
    position: absolute;
    top:-45px;
    right: 0px;
    width: 135px;
    height: 95px;
}
.home-content .container .items .item:nth-child(Odd) .item-content .img{
    position: absolute;
    top:-50px;
    left: -25px;
    width: 105px;
    height: 95px;
}
.home-content .container .items .item:nth-child(even) .item-content .img{
    position: absolute;
    top:-45px;
    right: 0px;
    width: 135px;
    height: 95px;
}

.home-content .container .items .item .item-content:after {
    content: "";
    background-repeat: no-repeat;
    background-position: right -20px bottom 0;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 1;
    position: absolute;
    z-index: -1
}

.home-content .container .items .item .item-content .item-title {
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 29px;
    color: #000;
    z-index: 99;
    position: relative;
    margin-bottom: 37px
}

.home-content .container .items .item .item-content .item-title:after {
    position: absolute;
    top: 45px;
    left: 0;
    content: "";
    width: 28px;
    height: 2px;
    transform: skewX(-30deg);
    background: #258162;
}

.home-content .container .items .item .item-content .item-desc {
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 180%;
    color: #666;
    margin-bottom: 32px
}

.home-content .container .items .item .item-content .item-foot {
    font-size: 14px;
    line-height: 20px;
    color: #999;
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTE2IDBIMHYxNmgxNlYweiIgZmlsbD0iI2ZmZiIgZmlsbC1vcGFjaXR5PSIuMDEiLz48cGF0aCBkPSJNMTQgOEgyIiBzdHJva2U9IiM5OTkiIHN0cm9rZS13aWR0aD0iMS4zMzMiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPjxwYXRoIGQ9Ik0xMCA0bDQgNC00IDQiIHN0cm9rZT0iIzk5OSIgc3Ryb2tlLXdpZHRoPSIxLjMzMyIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+) no-repeat;
    background-position: 60px 1px
}

.home-content .container .items .item:first-child .item-content:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIwIiBoZWlnaHQ9IjIyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTExMCAxNzIuODU3YzM0LjcxNSAwIDYyLjg1Ny0yOC4xNDIgNjIuODU3LTYyLjg1N1MxNDQuNzE1IDQ3LjE0MiAxMTAgNDcuMTQyIDQ3LjE0MyA3NS4yODUgNDcuMTQzIDExMGMwIDM0LjcxNSAyOC4xNDIgNjIuODU3IDYyLjg1NyA2Mi44NTd6bTE1LjcxNC03OC41NzJIOTAuMzU3djM1LjM1N2gzNS4zNTdWOTQuMjg1eiIgZmlsbD0iI0Y0RjRGNCIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTEwIDE3Mi44NTdjMzQuNzE1IDAgNjIuODU3LTI4LjE0MiA2Mi44NTctNjIuODU3UzE0NC43MTUgNDcuMTQyIDExMCA0Ny4xNDIgNDcuMTQzIDc1LjI4NSA0Ny4xNDMgMTEwYzAgMzQuNzE1IDI4LjE0MiA2Mi44NTcgNjIuODU3IDYyLjg1N3ptMTUuNzE0LTc4LjU3Mkg5MC4zNTd2MzUuMzU3aDM1LjM1N1Y5NC4yODV6IiBmaWxsPSIjRjRGNEY0Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNjUgOTQuMjg2YzIxLjY5NyAwIDM5LjI4Ni0xNy41ODggMzkuMjg2LTM5LjI4NSAwLTIxLjY5Ny0xNy41ODktMzkuMjg2LTM5LjI4Ni0zOS4yODYtMjEuNjk3IDAtMzkuMjg2IDE3LjU4OS0zOS4yODYgMzkuMjg2IDAgMjEuNjk3IDE3LjU4OSAzOS4yODUgMzkuMjg2IDM5LjI4NXptOS44MjEtNDkuMTA2aC0xOS42NDN2MTkuNjQzaDE5LjY0M1Y0NS4xOHoiIGZpbGw9IiNGNEY0RjQiLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTEyNi4xMzUgNDkuMjMzYzIxLjc0OCA1Ljc2IDM4Ljg3MyAyMi44ODUgNDQuNjMyIDQ0LjYzMy0xLjg4Mi4yNzctMy44MDguNDItNS43NjcuNDItMjEuNjk3IDAtMzkuMjg2LTE3LjU4OC0zOS4yODYtMzkuMjg1IDAtMS45Ni4xNDQtMy44ODYuNDIxLTUuNzY4eiIgZmlsbD0iI2ZmZiIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNTEuMDcyIDIwMC4zNTdjMTcuMzU3IDAgMzEuNDI4LTE0LjA3MSAzMS40MjgtMzEuNDI4IDAtMTcuMzU4LTE0LjA3LTMxLjQyOS0zMS40MjgtMzEuNDI5cy0zMS40MjkgMTQuMDcxLTMxLjQyOSAzMS40MjljMCAxNy4zNTcgMTQuMDcxIDMxLjQyOCAzMS40MjkgMzEuNDI4em03Ljg1Ny0zOS4yODVINDMuMjE0djE1LjcxNUg1OC45M3YtMTUuNzE1eiIgZmlsbD0iI0Y0RjRGNCIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNTMuNTA2IDEzNy41OTNjMTUuNDE2IDEuMTgxIDI3LjcyIDEzLjQ4NSAyOC45IDI4LjkwMmE2My4xMiA2My4xMiAwIDAxLTI4LjktMjguOTAyeiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==);
    background-position: right -16px top -10px
}
.home-content .container .items .item:nth-child(4) .item-content:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIwIiBoZWlnaHQ9IjIyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTExMCAxNzIuODU3YzM0LjcxNSAwIDYyLjg1Ny0yOC4xNDIgNjIuODU3LTYyLjg1N1MxNDQuNzE1IDQ3LjE0MiAxMTAgNDcuMTQyIDQ3LjE0MyA3NS4yODUgNDcuMTQzIDExMGMwIDM0LjcxNSAyOC4xNDIgNjIuODU3IDYyLjg1NyA2Mi44NTd6bTE1LjcxNC03OC41NzJIOTAuMzU3djM1LjM1N2gzNS4zNTdWOTQuMjg1eiIgZmlsbD0iI0Y0RjRGNCIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTEwIDE3Mi44NTdjMzQuNzE1IDAgNjIuODU3LTI4LjE0MiA2Mi44NTctNjIuODU3UzE0NC43MTUgNDcuMTQyIDExMCA0Ny4xNDIgNDcuMTQzIDc1LjI4NSA0Ny4xNDMgMTEwYzAgMzQuNzE1IDI4LjE0MiA2Mi44NTcgNjIuODU3IDYyLjg1N3ptMTUuNzE0LTc4LjU3Mkg5MC4zNTd2MzUuMzU3aDM1LjM1N1Y5NC4yODV6IiBmaWxsPSIjRjRGNEY0Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNjUgOTQuMjg2YzIxLjY5NyAwIDM5LjI4Ni0xNy41ODggMzkuMjg2LTM5LjI4NSAwLTIxLjY5Ny0xNy41ODktMzkuMjg2LTM5LjI4Ni0zOS4yODYtMjEuNjk3IDAtMzkuMjg2IDE3LjU4OS0zOS4yODYgMzkuMjg2IDAgMjEuNjk3IDE3LjU4OSAzOS4yODUgMzkuMjg2IDM5LjI4NXptOS44MjEtNDkuMTA2aC0xOS42NDN2MTkuNjQzaDE5LjY0M1Y0NS4xOHoiIGZpbGw9IiNGNEY0RjQiLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTEyNi4xMzUgNDkuMjMzYzIxLjc0OCA1Ljc2IDM4Ljg3MyAyMi44ODUgNDQuNjMyIDQ0LjYzMy0xLjg4Mi4yNzctMy44MDguNDItNS43NjcuNDItMjEuNjk3IDAtMzkuMjg2LTE3LjU4OC0zOS4yODYtMzkuMjg1IDAtMS45Ni4xNDQtMy44ODYuNDIxLTUuNzY4eiIgZmlsbD0iI2ZmZiIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNTEuMDcyIDIwMC4zNTdjMTcuMzU3IDAgMzEuNDI4LTE0LjA3MSAzMS40MjgtMzEuNDI4IDAtMTcuMzU4LTE0LjA3LTMxLjQyOS0zMS40MjgtMzEuNDI5cy0zMS40MjkgMTQuMDcxLTMxLjQyOSAzMS40MjljMCAxNy4zNTcgMTQuMDcxIDMxLjQyOCAzMS40MjkgMzEuNDI4em03Ljg1Ny0zOS4yODVINDMuMjE0djE1LjcxNUg1OC45M3YtMTUuNzE1eiIgZmlsbD0iI0Y0RjRGNCIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNTMuNTA2IDEzNy41OTNjMTUuNDE2IDEuMTgxIDI3LjcyIDEzLjQ4NSAyOC45IDI4LjkwMmE2My4xMiA2My4xMiAwIDAxLTI4LjktMjguOTAyeiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==);
    background-position: right -16px top 25px
}
 
.home-content .container .items .item:first-child:hover .item-content:after , .home-content .container .items .item:nth-child(4):hover .item-content:after {
    opacity: .24
}

.home-content .container .items .item:nth-child(even) {
    transform: skewY(-25deg)
}

.home-content .container .items .item:nth-child(even) .item-content {
    /* padding-top: 36.1px; */
    transform: skewY(25deg);
    margin-top:12px;
}

.home-content .container .items .item:nth-child(2) .item-content:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIwIiBoZWlnaHQ9IjIyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48Y2lyY2xlIGN4PSI1OS41ODMiIGN5PSI1OC45MjkiIHI9IjMxLjQyOSIgZmlsbD0iI0Y0RjRGNCIvPjxjaXJjbGUgY3g9IjE2MS43MjciIGN5PSIxNjEuMDcxIiByPSIzMS40MjkiIGZpbGw9IiNGNEY0RjQiLz48Y2lyY2xlIGN4PSIxNjEuNzI2IiBjeT0iNTguOTI5IiByPSIyMy41NzEiIGZpbGw9IiNGNEY0RjQiLz48Y2lyY2xlIGN4PSI1OS41ODQiIGN5PSIxNjEuMDcxIiByPSIyMy41NzEiIGZpbGw9IiNGNEY0RjQiLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTEzMC4yOTggNjYuNzg1SDY3LjQ0MXY2Mi44NTdoMjMuNTcydjIzLjU3M2g2Mi44NTdWOTAuMzU3aC0yMy41NzJWNjYuNzg1em0wIDIzLjU3Mkg5MS4wMTN2MzkuMjg1aDM5LjI4NVY5MC4zNTd6IiBmaWxsPSIjRjRGNEY0Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNTMuODY4IDEzMC42MzV2MjIuNThoLTIyLjU4YzIuODQzLTExLjA0MyAxMS41MzctMTkuNzM3IDIyLjU4LTIyLjU4em0tNjMuODQ1LTYzLjg1Qzg3LjE4IDc3LjgzIDc4LjQ4NSA4Ni41MjUgNjcuNDQgODkuMzY3VjY2Ljc4NWgyMi41ODJ6IiBmaWxsPSIjZmZmIi8+PC9zdmc+);
    background-position: right -10px bottom -21px
}

.home-content .container .items .item:nth-child(2):hover .item-content:after {
    opacity: .24
}

.home-content .container .items .item:nth-child(3) .item-content:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIwIiBoZWlnaHQ9IjIyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTg3LjA4NCA4MC4xNDhWNDMuNTQybDQ1LjgzMyAzOS4wOTN2NTQuNzNsLTQ1LjgzNCAzOS4wOTN2LTM2LjYwNkwxMjEuNDU5IDExMCA4Ny4wODQgODAuMTQ4em0xMDAuODMzLTQ4LjA2NWgtNTV2MTU1LjgzNGg1NVYzMi4wODN6bS01NSA1MC41NTFMMTY1IDExMGwtMzIuMDgzIDI3LjM2NnYtNTQuNzN6IiBmaWxsPSIjRjRGNEY0Ii8+PG1hc2sgaWQ9ImEiIG1hc2tVbml0cz0idXNlclNwYWNlT25Vc2UiIHg9IjM0IiB5PSIzMiIgd2lkdGg9IjU0IiBoZWlnaHQ9IjE1NiI+PHBhdGggdHJhbnNmb3JtPSJtYXRyaXgoLTEgMCAwIDEgODcuMDg0IDMyLjA4MykiIGZpbGw9IiNDNEM0QzQiIGQ9Ik0wIDBoNTIuNzA4djE1NS44MzNIMHoiLz48L21hc2s+PGcgbWFzaz0idXJsKCNhKSI+PHBhdGggZD0iTTEyMS40NTggMTEwTDM0LjM3NSAzNC4zNzV2NDUuODMzTDY4Ljc1IDExMGwtMzQuMzc1IDI5Ljc5MnY0NS44MzNMMTIxLjQ1OCAxMTB6IiBmaWxsPSIjRjRGNEY0Ii8+PC9nPjwvc3ZnPg==);
    background-position: right -17px top -8px
}

.home-content .container .items .item:nth-child(3):hover .item-content:after {
    opacity: .24
}

.home-content .container .content-overseas {
    margin: 56px auto;
    width: 1200px;
    max-width: 1280px;
    display: flex;
    justify-content: space-between;
    box-sizing: border-box
}

.home-content .container .content-overseas .content-img {
    border-top-left-radius: 2px;
    border-top-right-radius: 2px
}

.home-content .container .content-overseas .item-US {
    width: 384px;
    height: 470px;
    background: #fafafa;
    border-radius: 2px;
    font-style: normal;
    box-shadow: 0 4px 32px rgba(0, 0, 0, .1);
    cursor: pointer;
    transition: transform .3s ease-in-out
}

.home-content .container .content-overseas .item-US:hover {
    box-shadow: 0 4px 64px rgba(0, 0, 0, .12);
    transform: translateY(-12px)
}

.home-content .container .content-overseas .item-US img {
    width: 100%;
    height: 200px;
    object-fit: cover
}

.home-content .container .content-overseas .item-US .title-box {
    position: relative
}

.home-content .container .content-overseas .item-US .title-box .title-US {
    margin: 34px 0;
    padding-left: 32px;
    padding-right: 32px;
    font-weight: 500;
    font-size: 24px;
    line-height: 29px;
    color: #000;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: break-word;
    word-wrap: break-word;
    -webkit-line-clamp: 2;
    height: 58px
}

.home-content .container .content-overseas .item-US .title-box:after {
    position: absolute;
    bottom: -16px;
    left: 32px;
    content: "";
    width: 28px;
    height: 2px;
    transform: skewX(-30deg);
    background: #ff0017
}

.home-content .container .content-overseas .item-US .desc-US {
    padding-left: 32px;
    padding-right: 32px;
    margin-bottom: 42px;
    font-weight: 300;
    font-size: 14px;
    line-height: 180%;
    color: #666;
    height: 50px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: break-word;
    word-wrap: break-word;
    -webkit-line-clamp: 2
}

.home-content .container .content-overseas .item-US .foot-US {
    padding-left: 32px;
    font-size: 14px;
    line-height: 20px;
    color: #999
}

.home-content .container .content-overseas .item-US .foot-US img {
    width: 16px;
    height: 16px;
    margin-left: 5px;
    margin-top: -1px
}

.home-content .container .see-all {
    display: block;
    margin: 26px auto 80px;
    border: 1px solid #ff0017;
    border-radius: 2px;
    width: 140px;
    height: 44px;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    color: #ff0017;
    position: relative;
    z-index: 9
}

.home-content .container .see-all:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 44px;
    background: #ff0017;
    transition: width .2s ease-in;
    z-index: -1
}

.home-content .container .see-all:hover {
    color: #fff
}

.home-content .container .see-all:hover:after {
    width: 100%
}

.home-content .container .img-skeleton {
    width: 100%;
    height: 200px;
    display: flex;
    align-content: center;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px
}

.home-content .container .item-skeleton .skeleton-content {
    margin-top: 34px;
    padding: 0 32px
}

.home-content .CT-container-enter {
    opacity: 0;
    transform: translateY(60px)
}

.home-content .CT-container-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: all 1s ease-out
}

.home-content .CT-container-enter-done {
    opacity: 1;
    transform: translateY(0)
}

.banner-bottom {
    background: linear-gradient(0deg, #19242e 290px, #fafafa 0);
    padding-top: 80px
}

.banner-bottom.banner-bottom-US {
    background: linear-gradient(0deg, #19242e 280px, #fff 0)
}

.banner-bottom .container .bottomCard-resource {
    opacity: 0;
    transform: translateY(60px)
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-CN {
    margin: 0 auto;
    text-align: center;
    width: 1200px
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-CN .resource-headline {
    font-size: 40px;
    line-height: 56px;
    margin-bottom: 0
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-CN .resource-container {
    margin-top: 56px;
    margin-bottom: 120px;
    display: flex;
    justify-content: space-between
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-CN .resource-container .resource-card {
    background-color: #fff;
    height: 296px;
    padding-top: 40px;
    box-shadow: 0 4px 32px rgba(0, 0, 0, .1);
    position: relative
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-CN .resource-container .resource-card .resource-title {
    position: relative;
    z-index: 2;
    font-weight: 500;
    font-size: 24px;
    line-height: 34px;
    margin-bottom: 0
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-CN .resource-container .resource-card .resource-text {
    position: relative;
    z-index: 2;
    padding-top: 12px;
    font-size: 14px;
    line-height: 20px;
    color: #666;
    margin-bottom: 0
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-CN .resource-container .resource-card .resource-img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-US {
    margin: 0 auto;
    text-align: center
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-US .resource-container {
    margin-top: 30px;
    margin-bottom: 110px;
    display: flex;
    justify-content: center
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-US .resource-container .resource-card {
    height: 460px;
    padding: 0 76px
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-US .resource-container .resource-card:nth-child(odd) {
    border-right: 1px solid #ebedef
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-US .resource-container .resource-card .resource-img {
    height: 300px
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-US .resource-container .resource-card .resource-title {
    font-weight: 500;
    font-size: 40px;
    line-height: 48px;
    margin-bottom: 12px
}

.banner-bottom .container .bottomCard-resource .bottomCard-resource-US .resource-container .resource-card .resource-text {
    font-size: 16px;
    line-height: 24px;
    width: 420px;
    color: #666;
    margin-bottom: 32px
}

.banner-bottom .container .CT-bottomCard-resource-enter {
    opacity: 0;
    transform: translateY(60px)
}

.banner-bottom .container .CT-bottomCard-resource-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: all 1s ease-out
}

.banner-bottom .container .CT-bottomCard-resource-enter-done {
    opacity: 1;
    transform: translateY(0)
}
