.sep-container a:hover {
    color: #fff
}

.swiper {
    position: relative;
    overflow: hidden;
    z-index: 1;
    display: block
}

.swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1
}

.XWDetails .btn--search,
.colour .btn--search,
.container .btn--search {
    display: inline-block;
    width: 50px;
    height: 60px;
    vertical-align: middle;
    cursor: pointer;
    margin-right: 16px;
    background: url(../images/search-button.png) center no-repeat
}

.CPDetails .btn--search,
.white .btn--search {
    display: inline-block;
    width: 50px;
    height: 60px;
    background: url(../images/search_btn1.png) center no-repeat;
    vertical-align: middle;
    cursor: pointer;
    margin-right: 16px
}

.swiper-container-no-flexbox .swiper-slide {
    float: left
}

.swiper-container-vertical>.swiper-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.swiper-container-multirow>.swiper-wrapper {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.swiper-container-free-mode>.swiper-wrapper {
    -webkit-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    -webkit-transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform, -webkit-transform
}

.swiper-slide-invisible-blank {
    visibility: hidden
}

.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
    height: auto
}

.swiper-container-autoheight .swiper-wrapper {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-transition-property: height, -webkit-transform;
    -o-transition-property: transform, height;
    transition-property: transform, height, -webkit-transform
}

.swiper-container-3d {
    -webkit-perspective: 1200px;
    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 {
    -webkit-transform-style: preserve-3d;
    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: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
    background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: -o-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-container-3d .swiper-slide-shadow-right {
    background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
    background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: -o-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-container-3d .swiper-slide-shadow-top {
    background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
    background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-container-3d .swiper-slide-shadow-bottom {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-container-wp8-horizontal,
.swiper-container-wp8-horizontal>.swiper-wrapper {
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.swiper-container-wp8-vertical,
.swiper-container-wp8-vertical>.swiper-wrapper {
    -ms-touch-action: pan-x;
    touch-action: pan-x
}

.swiper-button-next,
.swiper-button-prev {
    position: absolute;
    top: 50%;
    width: 27px;
    height: 44px;
    margin-top: -22px;
    z-index: 10;
    cursor: pointer;
    background-size: 27px 44px;
    background-position: center;
    background-repeat: no-repeat
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity: .35;
    cursor: auto;
    pointer-events: none
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
    left: 10px;
    right: auto
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
    right: 10px;
    left: auto
}

.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")
}

.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")
}

.swiper-button-prev.swiper-button-black,
.swiper-container-rtl .swiper-button-next.swiper-button-black {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")
}

.swiper-button-next.swiper-button-black,
.swiper-container-rtl .swiper-button-prev.swiper-button-black {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")
}

.swiper-button-lock {
    display: none
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    -webkit-transition: opacity .3s;
    -o-transition: opacity .3s;
    transition: opacity .3s;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 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 {
    -webkit-transform: scale(.33);
    -ms-transform: scale(.33);
    transform: scale(.33);
    position: relative
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    -webkit-transform: scale(.66);
    -ms-transform: scale(.66);
    transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    -webkit-transform: scale(.33);
    -ms-transform: scale(.33);
    transform: scale(.33)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    -webkit-transform: scale(.66);
    -ms-transform: scale(.66);
    transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    -webkit-transform: scale(.33);
    -ms-transform: scale(.33);
    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;
    -webkit-box-shadow: none;
    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: #007aff
}

.swiper-container-vertical>.swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    -webkit-transform: translate3d(0, -50%, 0);
    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%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 8px
}

.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    display: inline-block;
    -webkit-transition: top .2s, -webkit-transform .2s;
    transition: transform .2s, top .2s, -webkit-transform .2s;
    -o-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%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    white-space: nowrap
}

.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    -webkit-transition: left .2s, -webkit-transform .2s;
    transition: transform .2s, left .2s, -webkit-transform .2s;
    -o-transition: transform .2s, left .2s
}

.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    -webkit-transition: right .2s, -webkit-transform .2s;
    transition: transform .2s, right .2s, -webkit-transform .2s;
    -o-transition: transform .2s, right .2s
}

.swiper-pagination-progressbar {
    background: rgba(0, 0, 0, .25);
    position: absolute
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: #007aff;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top
}

.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    -webkit-transform-origin: right top;
    -ms-transform-origin: right top;
    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-bullet-active {
    background: #fff
}

.swiper-pagination-progressbar.swiper-pagination-white {
    background: rgba(255, 255, 255, .25)
}

.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill {
    background: #fff
}

.swiper-pagination-black .swiper-pagination-bullet-active {
    background: #000
}

.swiper-pagination-progressbar.swiper-pagination-black {
    background: rgba(0, 0, 0, .25)
}

.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill {
    background: #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: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: 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%;
    -o-object-fit: contain;
    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;
    -webkit-transform-origin: 50%;
    -ms-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-animation: 1s steps(12, end) infinite swiper-preloader-spin;
    animation: 1s steps(12, end) infinite swiper-preloader-spin
}

.swiper-lazy-preloader:after {
    display: block;
    content: '';
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background-position: 50%;
    background-size: 100%;
    background-repeat: no-repeat
}

.swiper-lazy-preloader-white:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
}

@-webkit-keyframes swiper-preloader-spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes swiper-preloader-spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

.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 {
    -webkit-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.swiper-container-fade .swiper-slide {
    pointer-events: none;
    -webkit-transition-property: opacity;
    -o-transition-property: opacity;
    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;
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    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 {
    -webkit-transform-origin: 100% 0;
    -ms-transform-origin: 100% 0;
    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
}

.swiper-container-flip {
    overflow: visible
}

.swiper-container-flip .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1
}

.swiper-container-flip .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-top {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-container-coverflow .swiper-wrapper {
    -ms-perspective: 1200px
}

@font-face {
    font-family: commoniconFont;
    src: url('data:font/woff2;charset=utf-8;base64,d09GMgABAAAAABIwAA0AAAAAH4AAABHYAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP0ZGVE0cGh4GYACDYhEICq4ko3kLPAABNgIkA14EIAWFAgeCWRsvGSMDwcYBIEgeJfurBO5Qdys6IE6lIitn8aUiIEv3eKDMJZQ1nmN+jZBkdnja5r+jWkThcEQebSZxVqNiYALDyOmydOk6XFX6XXR/+ef7xd0z+xbLhxCjEMWmJlmbDww/HGyzIndOdh2aysyeVdZMkDWR5Jt8CdTGa9ARXTFF3tfmVco5iSZ3bYE8iCSWBer931pqdwIAOm8LOsKUlKsxPzMH82ePaHOFCSG6gnBVFS7hvSuhJFBpVF9lnag0lZpcV/HS2ReX8lwKYEKN300uBgBAjeC/lQhJUh8iEwC2EWmIeCNmo2NBH6vhgAML4S4+AA8ApgNzAQAwFTpBb0AA0vYb47EpBpmDVoEjz8Ebcu9eDMXYu2DkmZAmXrBjda0PZANwV4PobBw4ousSTx+b9hw8J6Py4EVOKUCoSGky2JRgNfhFyctRL7tf3nn56Q259wE4MJ5zsZDnEc9TFdLPPT4W/gP/hr/BX+Bn8FP4FtwDd8Mn4OPwPng3PJ+3lzuLa+HGcNVengACihsiSMtMwQgAZ4JfHgjgl6Hez3WsgEQo1iTi/HTymjNxOgFgdSwGeiyBtsaOECABMiBagqGLVvVhYnhcCocl1NXrKVBoIp3OYdOIBybDk2RCIi8Ck87nE3xDxXxvjz4wDYwVNCGZHMqXUih0sg+PxhJtQhCP8jdJxZJmppajBw1eu7W7W3WgG8+ecKrndMO6HmjkihuPmLL6hmLWWngWhzdzrlfXbi4yB1l9cqflc+ExvGZ1eSm6CtZfv3HDsOlSTw9lgu92/x29qDj73/6RCrv2wrMWLVq4YcOBPUEnegIWL/dd8Gnrgp2HVxwKWrlh4cYag8o8PEjAD3vvA+L7bHAaHqjskFUpOZQyJNVr2agZDfm+5lPFdVMRVj2viOlB8PoAuUx0LhdlLuBI3Qh7CpO5zCNcZqgMGZfSAt5gjwD5Wmys+Wcs1BLLPYlm78eNkJkFpaTcB8IdGCia8YJIAfl32w/IHDJk5SBkJYoLMMAyYssZAndAHgYQNKkD5UyxFDcMbEiF244E7kJl/Bixhv88T3X/zs+xF7juNVYFOQqJA+gqJPyEz7eHA1kQAOLQioAfnkV+DH7ec4/N2idge2+BJveWb0OJ3dfeo0/+lEqlMfJwdOff6SbZTpVHcfmuO8b2INv0DbJgVIc/00J2ojjKaok2T2yfm2veYkY1JT9/9BJuZySjV6RzHTr8oUhvh8xcFS0b+3yYpqQlEzWM65iHomYsh1CIBAHzPEGSeSQjheVHY9pq+WAaumiSKpMvcFwZQB2CLlnMxtJ5Y1sFjzhgs1GHrIZ653avtP+gQ7euNlabH78eTu2+azCrEkccRCvYvmJqEOZvnkU/xbx/ILNxRRQbXer/26+OI8D+LcEG+hA/Yk/I44OPsf1j+8WKZ8KVHfLfeOi79iEofUqZWkz4fxWmLIro92jffc0HJAgga34N7uJCPvLYpPJqrGV1CB5tZIpl9KL+gHRUfO2K9kIXNq0ZMgIIQmi/TuWsSq5iHkTB1gi8TdC9tjp3UD+wXztEfZ8w8SXIfu7qj1up6+JZsiAgV02XqQOAN1NWWLBuQZg8p8B6Fpcp7yxcir+5Q4e0/Qf0cx2xhpGOSCcX4lKMjMwmS3SyqzycDZ765WvSsuepxZSVxf49E9vnOmqn8hHD28dO+pq/9rsGsrGWRdaoF/N+rLoDmVwUekq9nJmGPmy4/VeGgZE52WrGPW9bu7/0tSIZkfar3wcEAdo3490YTzEEzCGMBXuNdIYjUE70jbAVg8uQWShYe39pKb6fSoW74Upt5hOEgKE7o6yGaPazmo4bInWyKJeyYNmWM7rjT6bxXnd4pTOSeTbiHYQsdScYVe2JZp8rlbeTDbHw+n57NNvxJJhmwTuv7rVFMq2nKpE2qPn67ELE5ezZ5Lskdka/sGy4CLujO7tqypQTA34lvr8Dd76lW77vBj8PBsIgQHpSrhIK3O7e4f4CtjtB9m6EfSzUZnoX39Os8r7qmUHNsxSMXeZq5VjtpBgy50hP9CWKo4xEXZ7XG1PllMrnZUj7EjwCbV+70qSSVIhCbDqmfrpTnXvSMkM+IIteNBbd8/4RiuuOiB+GJM1kkkrKvl5GCSd0nYe812LX1bpH03Yaur+xD1ibrRDImo/TjasJLTu2flvzZVPQ6sW18SC7CgcOrSjUzOaQro0V8sB+41JlIzjzNGjBM1XRE31y7ni9rwz0QDucikIxqNwkniELn5cJuozlv+s0Vfsy7sXeCCjhhG6TeE2F+ji0mwLZu0ddwk+482Gd4GPahfQ8+QBhMviefdSH4Z/wo8QJ9iT2M3m8m9kdhnWkDdX+c8foWr02LND8tZ/p6o+Kq9a4NY016QiX+ShrVAyPaZtTiFdkvqRv2ZtUccmraW+QNbKUfDKuA0Rs2UYWykXrr406aNIKzvoh2GboGvXX/uR1fXOfzkoIpe0+utj7xL4E4Fdo2kPhHAGC8kPh7XWLhDSTLv9ict+0hQGYuVn5eZkuJmBYM/Pys8Ilg3bWYI28uAhRvsmut/NyqEaMojuJkeWTpouPG0qnmIO8Xykt5ixneV1S91kUKlqgFBt0ybqwcIjw7M039sqygwcRwYAx8ZHKwc/+Eb4lLC2QxGMzC/yGo/x0qjp9oKggONTkZSEZqTH/5g2k1VMLhW5rguXKgq82DdbBeul1vlH3dZcAezsT7ZOBG0zJHiQnB257Gd128GvKSKQsJbQGlUKZdJFal5gUahf5i+95GSQrSivKKoVJzcne0Zb4SE8FHARijR/rciKblMqiyZOLlHbkih0pUhLwt0LsVxD7hiPeNzyCFZ7Gj885gc+dQwuOTMKr47CzbuzvHascgf8SSCWQBane4plnrwOmqQGyhxWHBpeEluLlGFxPy6FuHIYn7bRIzexgjzOtgnG3d1ZsH93DWDoORyAT9fl0TPhOWMs9iMGeZnbIw52cxq0mj4LgTuGEJ21zfPECEYke+j27aAXi3RgixpI5xpln0MHBM7KvO8a+8vT3r2dunKhy2tG0qNO3sNKy+RNBFKRlWZlf1SoLiqgXqlFEZVFvUqvMqGqBq4ZUM63i261F+8ULxftFq5POonlo4e9Othw/jq/jZ12K5i2E9XYrEBCghaxpE0dlLk0A3yRkVf1LH57WJON3buItr+gYOjSMk2WkWYS+Q5dvG+JrEdKMnKywKbUdFct5mzr5sqa04en/BDGHypVWXtHF9leaJ5bExMF2QV8H8Idy+wrqaxITLU80r8Zf4hUpreWH+tDURSE1D1qK0fD36xgJEU2O2CEA8MTxzHXvw9HilgeFCUVqKsjiXFy27J5yPzLpsH4XZ73ynixH1iEwBJRus0RZamupAe9mjt1vS74XEaQlkpMv4Sjq1narCyK3d5qpoUDbsYY9TzGPbeqRS+9zlG+oud4jeL0RuHw5MC1mqYUu5UvplqUzOnHsU/K0ylfy3qRee2R44NqFTg/WfciwmYb0NYMt/h0q9G5CU4I5pqnGNLI6NroxoULoElTU7o5HbTZK2wRqEDNPbGX6DaV+rsnM+L+ii2/zKc4PUKclaQy6JL0m3RBuyhnGudIY4MzOsdvrVd+uSqbmZERcv1JtWunAIfVLTg3RxltimmqMccnNBdzEFLnJCCJH4FetOskz8czJDSGlIUVFxRV6n4GFuTK09H7oihKsNySb73nxJ+O1Aosg8OreYn2aLjVVl6bfk6DBDOvF97ADgGN4drbNtiFAfQDoHR/fhqJtk9ABy3dMcvuhhwJy/P1zqhw4Z5X72LwWhOlgMV1BBQF51gBboMsjUBrkkZPQnrdE1fE5VI++jLVY4HF0UXPWoOAMznnOxiUNdLIg0BrwA37dxkX1sIBbkf9TPJofKELm3QtR3JttYyXoaMs1wywP8gUlJf8LQU5Qj8wTprWe6thOF3vn5ngXwEZdgr/QeH4AsfMGcmSOUbsq0zuFk0xvtBKMnlk8WgspDcI1vL07ZOOyHddainx450SIwZ/MGPjlovG3Qdrb3f4UDOy/7ZX3fQE6v2uj3TzpUiYz0CJHuJqZRjww0yO5UPplfYakEYen3KOwM5F2W8G0Lebf0wBbIvN/S0DJl6ZhyXfI5BIaPWh6ixmlHssN26pvrAuWYcHyitvrD4/xr3dQGq/NaiJxHtcv7tnZRPJ77GtsHXcEZZZRjV0pwtO3DsRG+V+tTyHJ01amiE7fPPhWNF0tvyxXGR8P7u1kc8J74uCgh3Sw4ewItjwZvDap2aP4o9jmeo/Dgue9BmLZjnebxPQ9psPv5D5stNM9+B50+1hbkTy0OdjqN7TT/N5fl5MW9GQuCMwLCMgPwgQJ0P9LSdcFj1JF80WpjwQzR8zMHZHr8+jQAySujObBZ9NLx5bRJbCUXhotvsBVg88yr3b1PDWsgrfqveaqeWpeZ8d1Q4DWnpHs0o3BMhNr2tIkGRJblVWTrfJL8E/Mi0cHmfyFRRHtAVv8+4VLCZjlPNKVT9m5tuz+OhN3h/SHzdeEJZrHa72TJ0dXLxkcoMadKzYRgfj545mcxIGRCc5BCc6BkVMGRiU4o+ihRQ8GeUWYhhUMST64MFGWJM9PbQ8rqXybCVlkZll6Gyqsxkio3Bmfn8nw5RnI8cMMZx8XgzNbMHsDaQB6F6stiArNVlksquwEDiZEd49/w8cR6ghxhjj4Tvrqg3GOktjKvI7RjoD8HlGVF3Ahr6fA2uUYffayMZXOkpjLq8H1hHQzEqdQGBFTemmEU5eemiGbNElW++kyIhyl6YjJwwM87gQCl5XtZbD5bMbekWfAp//Jv5sCnC/CaXN9JD7tnKPYAbq8uMvopqraGTE5JQtSdUaDOdOSwjXqpc4BkXLvTythzvIuaVLqkDiZWe4s9GxDXKqfyud3cjg/FS9UbSon5yHbNME1zpSaZZIYxalN47nLKJqfOou7A8srCeRZ8z8oRpXRcmErjT2T328tsdUY/hg28JRROjraUaQD8nb5+bQ0m9A5zynIE8j1Qs2M286jXpC1y9+/0cBGbjEPN9IXSP346O3h7Ha2NWsyer3LY+54gsBpPmdlBVehUl6ST5p744aN1fx0XiJkPyIruP0oPl3qG9fIuUzqRlQlZT+1V6YkmpY9Kn98rfzRMlPilCvan2UlKqSbdJnTmCmSxuSBqGVl75YsScFLnq+orKg4L2+XXQAR027GtiGKMlCgSVElotoE7ZoEDWZY41aZlYRqjlQuPHr/QFjxQ27MkJu+pzyXm5ADG03R526ojovdCSoXAtDnj1r2s62fP3+U/uNnNefZgVuHCyscc/tev3r+ej2QfO3ZR986RV4zxQaxP/SZ5bdKF/UjwQkBOaD3/148jdgRDElg9sGQhqHibn5IAsAiWpU89oBKyArAAXQRcjLgEwcZQVIIsMfZSnQy5EnGtigH+vf6N54AysFZbcQAYK0aMCKyuEoE/QVkmiKkRBWAXgCusrsPlz1TzVQIkEC6igFE4ELsVfxIxEH8QhUPqOAgEiD+jkoBWlH3pgJPnQALINwRAMoAqBBgFaViAAPkIxbiGxAH8RNUPPCuCwkQf1algDxPI1GBUl9g1syhXL96ehVxFQaWdqvUoJ4TrueBCyspgpsi4JcAB4zj7pXNwaVVrXLNwNPzp7v/9KF0HodmLdwjxflnyC9w3v3m/Q1+XkmCqPc+eR47tmjjEnCR3Y9Td2rGWDfZ44PQHWojNhy0xs1YDVh5dY0hcNFm55Y2V0C/fs4z9fT+ZHrCzPImpzAAfcNvaBSRb1zMGXLYUGWcdnAi1e70TM9EjEMlx1POBYhAQgADxS+zGbuTs4vD1c1y9/D04oHNE4cXb1w8MD6fNcBdf/akS3+Hu6IBfwKhHXFgQ2u1+9gO09REcLX2SxVu+skIdpqpvd6fUFnurvIumvsHHGz6cxBZxCo37/vSRWgRNS2tDRTvvF/zU6v+AcnTqn/fIh90bl6n4SPrgGt2N7mJ86AB7np/YmmVO4gulPLm5ob+p3VshPWN9Ap3rVsX+vMe9ZisLFZ1dzSHDreyvIFQ1fnA4wLaJjvLTi4dsKlr4FL5oNYGAAAA') format('woff2'), url('data:font/woff;charset=utf-8;base64,d09GRgABAAAAABYwAA0AAAAAH4AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAWFAAAABoAAAAclfKZQ0dERUYAABX0AAAAHgAAAB4AKQAjT1MvMgAAAaQAAABGAAAAYDw2TdxjbWFwAAACOAAAAKQAAAHiBWjztGdhc3AAABXsAAAACAAAAAj//wADZ2x5ZgAAAxgAABCkAAAXJCDd+25oZWFkAAABMAAAADEAAAA2I9u2N2hoZWEAAAFkAAAAIAAAACQITAQFaG10eAAAAewAAABJAAAAXkZrBqdsb2NhAAAC3AAAADwAAAA8VpxdYG1heHAAAAGEAAAAHwAAACABMAEIbmFtZQAAE7wAAAFGAAACgl6CAQJwb3N0AAAVBAAAAOgAAAFZPDkCKHjaY2BkYGAA4q8uL1jj+W2+MnCzMIDAA3VLWRj9/9//BpYC5gYgl4OBCSQKAC9BCw4AAAB42mNgZGBgbvjfwBDDUvT/HwMDSwEDUAQFCAEAiUQFWnjaY2BkYGCQZfjDwMkAAkxAzAWEDAz/wXwGACTEAjkAeNpjYGFhYZzAwMrAwNTJdIaBgaEfQjO+ZjBi5ACKMrAyM2AFAWmuKQwHnjG85mRu+N/AwMB8h6ERKMyIpESBgREAZcIMkgAAeNpjYYAAxlAGBpai//9YgGwglgLiVCBuAGJvqJgDlLZlYWAUBtKtQFqNhfH/fxaIEV0MiQySDKEMa5kYGEIZsxkaGBoAy/MLVQAAAHjaY2BgYGaAYBkGRgYQuAPkMYL5LAwHgLQOgwKQxfOM4RnnM+5ngs9En6k8U3tm9Mz8mfUz32f+zyKfxT6rfh77ounFlRe3X3x8zfn/PwMDXLUIVLXZM6tnPlhUc/z/L8Us+Vvyl+RXyc+STyWfSN6UvCZ5RfKI5GHJXZLbJWdJ7BSfKu4ibieuKSoMdSHRgJGNAa6FkQlIMKErYBj2AAC4gEjjAAAAAAAAAAAA4AHyAkgDCgM6A4ADugROBMYFGAUsBaAFtAcoB/QI0glCCXQKAgp2CuILAgtEC2YLfAuSeNqVWHtwXNdZP4/72Oe9e3fvY+9d7euu9t5daXcl7VPy6mU9bdmWZUuRLdeR7MSxTOM0iRnixHFStWkm1HjCTAkMJSlkOh2nr2QoUEhKpzhAYQjMNDymU0KnA6EDBRPakpZ/iFZ85678SIfCIN35zjnf/c6555zvO9/vdxYJO52d17mH6CU0hu5C59Ej6Ar6NYRwCktYlHi7wrkV3KiPc61xbKSwocvwwtCbE7jZaqaIoUsE1Gms03HqVmjOlmiKacYxBesUkThRcGCI1jil+jh2RInouJoimiphp1GvkJztwMhVXVMF9iEH2vUm/USPwZmqfXxjY2UqP75wdHE+rgRld2bzQ+PJOT0Qo5TylOOUrJyORBOtUg8lPj/P0bicUf4z0bQ5XR2eO1xcvLQ2rPuz9cyeSw9+4INaXgpEBKoY9oA99nAmRBSpObd02SnQbG9Pmovjrx346OnhrJMtL2wMZVIwtY17tbg2247FVHxJH53amxicrpghyss95b2V1Exd3zN79J4FLUBCIUORw4mwGSCiEBIoj6VUXDI1IySGBEnsvKqMzB8pZgcToUxzenZqdECywqE0XvVpSijf19/rZE0hVG64472JoSTf+THtb/RxtFhxyY8LB8/P2jZOpYv7hzMpJ/2Z0/emLJrQx+Z1U0MUoZ0tDtEtlET70e+B5xzXGcAV7Dq2CC4UVM9rVXBfq9mo8/WWbsC/pjJpVD0JZatZq+qi4KmHBAPGcB3mYegGzhMFELuP44mcIwo5u1EfgM81DL3mjQ9+hMFaze6g7HMuuNiLFNZBwqoggpNbzVv/MDVQgbWE6Y9EgfNR99mTG29unHzWLRRuV9/bSAhhRQhwvBLL04AUivipn4+oQQETfk8yhfmHNu5uDhMBY8kXqmBsxwI85QkXDftsvxQSe/ySFDQVwQ8WmAQVkSPwVu6J+kI8EbhA1C/7AoRwGV0IUj2uUhjXKms+LiBIhl8mHPfgK8UNniunsrnn8Q9Saigq/sQcveq5kZFD8xwv8L5Qo6dPt7DgC0V0EXNcQErqmYalDubIyPD6qc7fUb6lpvNazKSYpyoViF9IiUGBqpyIRV4sD0uUEkwFTqUiFnhMKFgo6aAq+gZ4KeIL+1q5kOrDMLifJ7xfDwkc5QQhoNrVyNXNufFywaqfvorgjyILxD+Rt1AJNVELYqTaHMP1Cs5lbQlriprCtWx1nJ0+G0JAALXTUHgImrym6nnBdvNNMDB4ej2iF+eK22dAwENeAKFn9FJm+0ymhBfyq3m8oHcejZainVfUOHnBjHVewf26/KPibKEwW+wcLc4U4ZF1XU6XSmn80hu6/sY7sv5MMPgNSfoGmytB9+28Sp+n6zDTJ2GmFWKzROTFiSh4YdVi4QJRDUEHgceCy2U6ncUqC9ymE4MTIAoyyz/QNWezswDhCi/H8QR2vbeiwyKQtTxZH4eshDWRRa6MuxFMc2TxqRefWiSxCF/Q4pQEgtGEYfp8vZqmzA480R69PDCraFqvXzSNRDQYIDSuFfhIKiS6ZriYrskaz/uc5DlXGVKcc0lX5HlNrqWLYdMVQ+BcXXUln8BzchC3z14+28ZBGYLHJzmaDhHYv3r1yJGrq+Z4erBSrSeGZJNSS5LMo3YyXaulk/ZRUw5blJryUKJerQymxzuvy9HVk5WRviCnmf6Q7CjRvBzymxoX7BseOLkalcPhvpJbiqhh3ZKD8vyFyckLc5GgbOlhNdJfKPWFuj7YgnjZgtQSQiZCWdvFkJOrBtZVAUKj3sLNqq5CVNIjanh7Xepxw+TTUmJ7QU1IUHETEihZzelhNaenx2GthMta3vgHdv6cvkYbKIbyCMUgR2EINsCMChFEP3ZselPVrBBPcUrT8APaKAg54O9x8lLn652va23tllrFxT1aV4l/GzSdX2KvpLzTEwiCMW5r+DjYdz4B6g9pe4pY9ZQsf6Ikh8g/oiAyUA5mk602AYWytqDqvCdrnobeUS/Rz0YtK/recZD0K14RvUPVrZMrVt6C5ztWrwVP541uE74noMmd36TX6RKKoyzag6bRSXQfQvmqbkAWVoV+gFgIVrbVcO4gq7Ivs+9isMgyi1zWs/Cwso1/wuJ/H4O8WVsMzoRjsfBMcPHsYrDTw+r4u8HFWnZgYGpgoDMBBvi7TNvp8UxuWu8a4A//HyO8OTEUs2JDE7vFJNNNDeCt/4+6G4c3se0wWvKQjeWoCmZJqwtrHCwW1tSPd7EJiAqkBTjHgDTS7ilmGMZ0qiikGBSxEXI2nH8Xf2mkOL5v4vxH7h9Ppx6YP4GDv1BnuWnwyXePTN6b6OlbqJQW+qeHo5KvtrzxYCRF/St7SguluE+0kr7cxPnJhZ+NH5zG1T1zyQvz0xemJx+ev+fcva/OnbgYMjJ66PzSxLUTdx+rLvZXDldGVmQ+q2yubBSFaHRyqbK40RdOR8Tw6NzMham1/fkptt6xna/RP6TTKIVqCPFus4uhXvpiSK57SNtsGcyTuM4SmIfgKnttM0P66ktl02y1Tp76zqmTreFhqDy4MDPdfCmY1N77o0r50OKri4fKlVsV/qXm9MzCgzdtoVNz2DTLLwW0JH7t5PtMWQWcgGM7f00tWkY8Qn7c8mOXnO28fAK/3Fk+gbfw8onOMtQQh57e+TP6OG0jCSVQAzyIsF3BdTbllEcEKLgRkAdwp84Q2xnrLsiL3py34CTY5fJD3iu2OC/ca96K2SuC5i7OzbVHr3pyrrpSra6cYaLzmGw0aqsnNhVVVZb3zRX7DIl8XlH7inP7lpnu3NpqraHhobmLVx/L5bsS/8FubxDv/a0ekTfXjtXqqq1Br/nloGJymhJcnofBNFut146tbQYVje2HA/tRvrkfLmwJfsvbBfzynfvh29nZeZuLUwdV4Kw/jX4DfRn9CXob/RcMAatmi2OI1brtbnHIgzwvzj2ve2au00XCnOdu+G84t/kU2xuty+KAdXmMDkZhpyCFY+x8yLhLt/Ta0C5LY9Z6GzhZXgLO3+qqGdB6yMq+IOIukYQx2nioepMTGt4kumyu1mTwCzzRs5S6F4U23iWFjECyAXJChQACE2bPbg4CeVsl1Eo18xVLJ7wSjMVnKsfXB21HlSgh4T/9nZi+srI2tS+djCt9qYI11T5ycCEcX506OjTsx6Jc8SX6S+PDTiIejlLOFynzkxU7EwIu5wul7Urq+cTGyNgRjgciRQM8P1O3s41kxcZSICoUOtcCIT4SiMZyalrE4QD1SzgwlK1b8c5Xg2G9NxTzifUcDYaLRsjPia2gZPl8YBqQelhJ+UeSc25Q6z+YTPVwXG+qdcB3u9Ufn8xLUma0ZBGiVvb2yuFsu2wSquHnezMFKyWJARwvJWNBOZJaHxioN9xeNfDIFdg5q1ydGh0pZOOvD5dcQ8Oiapbri1jLjI2FU9V8TQ0FI64c9UsBVSKJTM7UAnEaMNJz+FplJixHOGAcviBPpJAvmh5cepjnA5Ly8TWiqEFgkFw0OReQSSiwXk7B/anzFcqb0VQ25VB/OpKPpp2HYwKJpWVDIDgWiT6jRDAR0nFrLJOsRtOEz8TNcaheUy2eYMnKxrQ+1+IxDrNqP8vZfsjZT3k5u4unA6iN5uFe+Sj6FUC43WzNsKh1Rz33U+r8T9HjnEdVkzi7W7J8LnhE1uAZkVUgpcTghgkwDpdKJdvQwBICtY21lEd+sxpDwzEABohccqMYNc3o+8W/97EaE+/s6iwTR/8HJfng3qgV7TwetWLTjdW4VV4cIJ+sHavVji2kG+ntsyDo1ntb6Z6UO4nBEj8dM2NjmbFobBoAD57r3eLO530qcn09HI2G17tyqDI03YkOrTQ4XDteJ6R+vLZdSlaT8ODnnltZSVTlyKlwNBbe6MpknFEOJIJfvg1+6UU+pKB96B70MfQs+lXvLsD2UNVdrwCIhHxM3IZ3y/MSEWyV4R3/CXwLgVJkF4hYMQAMBE54mt05vQzD8sIuodaFPPBzAOZufvIufB5857wUNoChR95jVmwetVs1/K5mWkXb/i0m+kzyN6WlcyOR84tLa2dWl4eqc9Npzs+FuJ+LZZVE3CdFBP3Eo1NGTyxzgqci76fGyPiLHMXhJi9impYtdd+lffsuPXtpHx7ezhCO/3Cpb//CsYMfX5ePzM4cFkksaFiRdIwXl/AfS4YhqZb1xd2S9JpFyypYFc00iya2On9Z3ThQ5un+i7bdX9y3f3Xu8erJoB8Y+x4qUihoYxle+wYhJ4UOVO6/DMmnP0kxFik/unlpc3Rsc7Ry8nG4aa5dXhgf682PnBkjvb0XZ1MJwsGFjxSuGz1xI2l0JQIsvbLzu/QRehT4uIYGwXtdLPV2GKLcvcnt6C4oNG5TA83jBgxtu670sr4HFl1mQVBxtlicPcpEMeG6TddNhIOlxtnJY7XqyrG/OLZSrR2b2KyXg+HFmb1OoV0+VBsZqR0qtwvO3hk8W5jzuh6dK3zLabG71/Ynfamh9TNXnrrvOHSFMY7f99SVM+sDGR+dLzhT04sbm4eX6uVyfWnp7Mbi9JRTAN5zGp2mHyG/DjkjAWvbJa2MCIiwTu+Sxu4ffrhx7Nmel6JRibwGnPM//BEfJ37ve4FYwo+1zg0/PtU9MTvBaAz0/kTU37nRuRGA+Pchc+cH9O8pBW7lwh4Oof1oGd2N1tkJMNjPUDe3R2ztRrnjpQyXTYNNSGTCIyfARhiFZD9o3GJkjKvlu/wETGq3ajlyzQhK9z23fPcL5YG8PZV7LGZHEqYaDB7aO7MZixuFTPrbaiZdiBsq+Yei+8zBI9NThw5NTR8xehR73Wymc50nQroeilrxz3klpB2ik+kHJg5NzSzNjA5XNkd5kfDUsfc/0Zv/gOHGTcdYMfMwtNF5Z6o9PG1nLzxzIWPznL++WhhsntZMXbO0rmS5gUN3wX3vC9SAnWmhGXQE9sSotdhiZUadCWRWibBcSiCzjpN21x/sdiQqsAU8UAWl7vBVj5Z5dK2ZvbOBq1d+/kqo1wwvrqVafYbR10ptf/NmbW0xbPbi729/08yTrEkGoch38rDMnGniTcUraeDKFbAKLUKHZOfzyW7XJF5ltcVwzvw3O975TDxPsB3HJy1ny4zexTbqfQJh9PLO9+lRGkFT7DYxgJu3yJbRPSXd360mMIuDW81WVzJjdmyMW006Eu6ViNnTan+x3UqYBFoyD2yD90XDihTT3Uws5ecb/ROtdKo10d/g/alYxtVjkhKO+gRCOQEn+tbsUwuLfZVK/+H9G9m1/qqbjkUw1iKm5hYrWX9Ikf1Ahgj1hF9WQv5spehqZkTDOBJLu+A/TNDOX9F/of3AtRHwT5bH2WGBpNCib6Q7p2CDwvjezqfCZi6MT6Xwi2wvOy90PsV8Al3QXTtb4P8t1Mcyi+Mq+q0LxW7eNjQAg5t8vaHU2E9GGv3cxMUa7gdW/Vkg2f2ssmKacTM/mc9PHpjIvzx+/wT+VsHpvLh2cH8J/vYf/NLBhf4S9/uBwtThadeddslXpx7a+2W2Bnw/+hnyi+SXUQwa9SGgsTB9YLHsJ0a2HnLmXSEUFd4Nh38oKGEBP4nxD0UlBAo76L1h69hCX6CXyRacdsgiWlY0Wq5I3tq+Rk48PXrjn9v4+l1Pt//1xii6abt129YQ3ZaBbbK+/emPtW/cuMP2vwG5pdiweNp9kM1Kw0AUhc/0T21BxILrWRVBSH+WpbtC3blwUddtOklbkkyYTAtdunXlA7j1MXwAn0Fw5YN4Gq8IFZqQyzfn3nNmJgAu8QmFn6eNa2GFU9wJV3CCWLhK/VG4Rn4RrqOFN+EG9Q/hJm7USLiFtnpmgqqdcdUp0/ascIGRcAXneBCuUrfCNfKTcB1XeBVuUH8XbmKKL+EWOmqJMRwMZvCsC2jMsWNdIWRuhqisHhg7M/Nmoec7vQptFtmM4r+pv9Y942JskDDacWniTTJzRy1HWlOmORQc2bc0+gjQo2xcsbKZ7ge9o/Zb2rMy4vCeBbY85oCqp1Hzc7SnpInEGF4hIWvkZW9NJaQeMNZkxv3+lWIbD7yPdORsqifc1iSJ1bmzaxN6Di/LPXIM0eUbHaQH5eFTjnmfD7vdSAKC0Kb4Bg9qcIcAAHjabU5bboMwEGRoMC2Blr5f6hH8kaOkF4gMdp2NLLsYLEJPX6ehUlR1pdGuZndnJkmTYxXJ//UWgSRFijMskIEhxzkuUGCJEhUucYUa17jBLe5wjwc84gnPeMFruSdrhNWjosZlo/NG5pMLOxI27Tqmg7ANVdKFxihu1MfAV6wVJIUtSY/c8L71StlcxodtEKx3oQ+umCUGF5ZSWW0Cb93nVHwFN9PZj+HCU0d5HGOKVb6RdJAphPdufCe9HdhxVTVk6ABuyKp0va53ZP2vw56EYzHhRLY85eu5b+KB1dNfImb5BtQqYFkAAAAB//8AAgABAAAADAAAABYAAAACAAEAAwAcAAEABAAAAAIAAAAAeNpjYGBgZACCq0vUOUD0A3VLWRgNADQ7BGQAAA==') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

[class*=" icon-"],
[class^=icon-] {
    font-family: commoniconFont;
    line-height: 1;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

@font-face {
    font-family: iconfont;
    src: url(../font/font_2684660_6vnathitti8.woff2) format('woff2'), url(../font/font_2684660_6vnathitti8.woff) format('woff'), url(../font/font_2684660_6vnathitti8.ttf) format('truetype');
    font-display: swap
}

.iconfont {
    font-family: iconfont !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icon_icon-test:before {
    content: "\e649"
}

.icon_screen:before {
    content: "\e647"
}

.icon_caidan:before {
    content: "\eaf1"
}

.icon_jia:before {
    content: "\ed21"
}

.icon_nav1:before {
    content: "\e77d"
}

.icon_nav2:before {
    content: "\e645"
}

.icon_shengyinjingyin:before {
    content: "\eca9"
}

.icon_shengyin:before {
    content: "\e643"
}

.icon_youjiantou:before {
    content: "\e63f"
}

.icon_zuojiantou:before {
    content: "\e641"
}

.icon_fenxiang2:before {
    content: "\e86e"
}

.icon_tuichuquanping:before {
    content: "\e63d"
}

.icon_quanping:before {
    content: "\e634"
}

.icon_fenxiang:before {
    content: "\e639"
}

.icon_jiantou15_right:before {
    content: "\e632"
}

.icon_24gf-playCircle:before {
    content: "\ea82"
}

.icon_denglu-mimabukejian:before {
    content: "\e630"
}

.icon_zhihu:before {
    content: "\ea8b"
}

.icon_icon_bilibili:before {
    content: "\e62f"
}

.icon_sousuo4:before {
    content: "\e62e"
}

.icon_sousuo3:before {
    content: "\e6a7"
}

.icon_bofang_o:before {
    content: "\eb5e"
}

.icon_gouwuchekong:before {
    content: "\e62d"
}

.icon_shezhi:before {
    content: "\e62c"
}

.icon_more1:before {
    content: "\e71b"
}

.icon_youtube:before {
    content: "\e76c"
}

.icon_wenhao2:before {
    content: "\e646"
}

.icon_wuzhangai:before {
    content: "\e638"
}

.icon_fanhui:before {
    content: "\e6ff"
}

.icon_wenhao1:before {
    content: "\e627"
}

.icon_wenhao:before {
    content: "\e644"
}

.icon_chuanshu:before {
    content: "\e65d"
}

.icon_phone_1:before {
    content: "\e629"
}

.icon_jiantou-you:before {
    content: "\e62b"
}

.icon_linkedin:before {
    content: "\e642"
}

.icon_youtube1:before {
    content: "\e8a7"
}

.icon_go_top1:before {
    content: "\e625"
}

.icon_xihuan2:before {
    content: "\e8c3"
}

.icon_shoucang1:before {
    content: "\e622"
}

.icon_dianzan1:before {
    content: "\e668"
}

.icon_xihuan1:before {
    content: "\e637"
}

.icon_tips:before {
    content: "\e687"
}

.icon_xiaoxi1:before {
    content: "\e61c"
}

.icon_delete:before {
    content: "\e718"
}

.icon_edit:before {
    content: "\e61f"
}

.icon_x2:before {
    content: "\e795"
}

.icon_duihao:before {
    content: "\e6c6"
}

.icon_yanjing:before {
    content: "\e648"
}

.icon_xiaoxi:before {
    content: "\e66c"
}

.icon_pingjia:before {
    content: "\e636"
}

.icon_good:before {
    content: "\e62a"
}

.icon_fenxiang1:before {
    content: "\e61b"
}

.icon_xiaochengxu:before {
    content: "\e63e"
}

.icon_home:before {
    content: "\e61a"
}

.icon_jiantou14_down:before {
    content: "\e6cd"
}

.icon_link:before {
    content: "\e618"
}

.icon_weizhi2:before {
    content: "\e633"
}

.icon_user2:before {
    content: "\e613"
}

.icon_jianyi:before {
    content: "\e6cf"
}

.icon_youxiang1:before {
    content: "\e66b"
}

.icon_rili:before {
    content: "\e8cf"
}

.icon_yueduliang:before {
    content: "\e6a0"
}

.icon_linkedin2:before {
    content: "\ee48"
}

.icon_user:before {
    content: "\e63c"
}

.icon_sousuo2:before {
    content: "\e679"
}

.icon_wangluo:before {
    content: "\e7b5"
}

.icon_jiantou14_right:before {
    content: "\e611"
}

.icon_mima:before {
    content: "\e60f"
}

.icon_anquan:before {
    content: "\ec4d"
}

.icon_shouji:before {
    content: "\e610"
}

.icon_jiantou6_left:before {
    content: "\eb8c"
}

.icon_jiantou13_right:before {
    content: "\e619"
}

.icon_xiazai3:before {
    content: "\e794"
}

.icon_instagram:before {
    content: "\e737"
}

.icon_linkedin1:before {
    content: "\e6c1"
}

.icon_guanbi:before {
    content: "\e623"
}

.icon_bofang3:before {
    content: "\e63b"
}

.icon_icon_jiantou12_right:before {
    content: "\e60e"
}

.icon_shangjiantou:before {
    content: "\e60b"
}

.icon_shangjiantou1:before {
    content: "\e60d"
}

.icon_xiazai2:before {
    content: "\e617"
}

.icon_weizhi:before {
    content: "\e78b"
}

.icon_jiantou11_left:before {
    content: "\e76b"
}

.icon_jiantou11_right:before {
    content: "\e8dc"
}

.icon_dingwei:before {
    content: "\e8c4"
}

.icon_douyin:before {
    content: "\e8db"
}

.icon_yuanquanjiantou:before {
    content: "\e61e"
}

.icon_stop:before {
    content: "\e650"
}

.icon_bofang2:before {
    content: "\e87c"
}

.icon_pengyouquan:before {
    content: "\e621"
}

.icon_xiaohongshu:before {
    content: "\e609"
}

.icon_dianhua1:before {
    content: "\e631"
}

.icon_bofang1:before {
    content: "\e624"
}

.icon_liuyan:before {
    content: "\e60a"
}

.icon_shijian:before {
    content: "\e64d"
}

.icon_dianhua:before {
    content: "\e616"
}

.icon_youxiang:before {
    content: "\e608"
}

.icon_xiazai1:before {
    content: "\e620"
}

.icon_wendang1:before {
    content: "\e69c"
}

.icon_address1:before {
    content: "\e67e"
}

.icon_jiantou10_left:before {
    content: "\e768"
}

.icon_jiantou10_right:before {
    content: "\e607"
}

.icon_zuizuo3_left:before {
    content: "\e767"
}

.icon_zuiyou3_right:before {
    content: "\e604"
}

.icon_top1:before {
    content: "\e612"
}

.icon_x:before {
    content: "\e688"
}

.icon_jiantou9_left:before {
    content: "\e6e0"
}

.icon_jiantou9_right:before {
    content: "\e766"
}

.icon_jiantou8_left:before {
    content: "\e6a5"
}

.icon_zuizuo2_right:before {
    content: "\e606"
}

.icon_zuizuo2_left:before {
    content: "\e763"
}

.icon_jiantou8_right:before {
    content: "\e764"
}

.icon_zuizuo1_left:before {
    content: "\e70f"
}

.icon_zuizuo1_right:before {
    content: "\e762"
}

.icon_yanjing1:before {
    content: "\e605"
}

.icon_position_small1:before {
    content: "\e603"
}

.icon_qq:before {
    content: "\e760"
}

.icon_jiantou7_right:before {
    content: "\e71a"
}

.icon_jiantou7_left:before {
    content: "\e602"
}

.icon_home1:before {
    content: "\e601"
}

.icon_gouwu:before {
    content: "\e65c"
}

.icon_yonghu:before {
    content: "\e719"
}

.icon_sousuo1:before {
    content: "\e640"
}

.icon_jiantou6_right:before {
    content: "\e628"
}

.icon_jiantou5_left:before {
    content: "\e60c"
}

.icon_jiantou5_right:before {
    content: "\e702"
}

.icon_wechat:before {
    content: "\e701"
}

.icon_weibo:before {
    content: "\e626"
}

.icon_facebook:before {
    content: "\e653"
}

.icon_twitter:before {
    content: "\e615"
}

.icon_jiantou4_right:before {
    content: "\e6f3"
}

.icon_jiantou4_left:before {
    content: "\e76a"
}

.icon_jiantou3_up:before {
    content: "\e769"
}

.icon_jiantou3_right:before {
    content: "\e651"
}

.icon_jiantou3_left:before {
    content: "\e6ba"
}

.icon_jiantou3_down:before {
    content: "\e761"
}

.icon_jiantou2_left:before {
    content: "\e6b9"
}

.icon_jiantou2_right:before {
    content: "\e614"
}

.icon_zanting:before {
    content: "\e63a"
}

.icon_bofang:before {
    content: "\e635"
}

.icon_sousuo:before {
    content: "\e61d"
}

.icon_yuyan:before {
    content: "\e600"
}

.icon_jiantou1_right:before {
    content: "\e6b7"
}

.icon_jiantou1_left:before {
    content: "\e6b8"
}

.social-share .social-share-icon {
    top: 10px;
    opacity: 1;
    -o-transition: .2s
}

.social-share .social-share-icon:not(:first-child) {
    margin-top: 15px
}

.social-share .social-share-icon:nth-child(2) {
    -webkit-transition-delay: 0.2s;
    -o-transition-delay: 0.2s;
    transition-delay: 0.2s
}

.social-share .social-share-icon:nth-child(3) {
    -webkit-transition-delay: 0.4s;
    -o-transition-delay: 0.4s;
    transition-delay: 0.4s
}

.social-share .icon-weibo:hover {
    color: #ff763b
}

.social-share .icon-tencent {
    border-color: #56b6e7;
    color: #666
}

.social-share .icon-qq:hover {
    color: #56b6e7
}

.social-share .icon-facebook {
    border-color: #44619d
}

.social-share .icon-twitter {
    border-color: #55acee
}

.social-share .icon-wechat:hover {
    color: #7bc549
}

.social-share .icon-wechat .wechat-qrcode {
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.social-share .icon-wechat .wechat-qrcode .qrcode {
    text-align: center;
    width: 105px;
    margin: 10px auto
}

.social-share .icon-wechat .wechat-qrcode .qrcode img {
    width: 150px;
    height: 150px;
    margin: 0 auto
}

.social-share .icon-wechat .wechat-qrcode .qrcode table {
    margin: 0 !important
}

.wechat-qrcode {
    display: none;
    border: 1px solid #eee;
    position: fixed;
    z-index: 999;
    top: 50%;
    left: 50%;
    width: 200px;
    height: 190px;
    margin-top: -96px;
    margin-left: -100px;
    color: #666;
    font-size: 12px;
    text-align: center;
    background-color: #fff;
    -webkit-box-shadow: 0 2px 10px #aaa;
    box-shadow: 0 2px 10px #aaa;
    -webkit-transition: .2s;
    transition: .2s;
    -webkit-tansition: all 350ms;
    -moz-transition: 350ms
}

.wechat-qrcode.bottom {
    top: 40px;
    left: -84px
}

.wechat-qrcode.bottom:after {
    display: none
}

.wechat-qrcode h4 {
    font-weight: 400;
    height: 26px;
    line-height: 26px;
    font-size: 12px;
    background-color: #f3f3f3;
    margin: 0;
    padding: 0;
    color: #777
}

.wechat-qrcode .qrcode {
    width: 105px;
    margin: 10px auto
}

.wechat-qrcode .qrcode table {
    margin: 0 !important
}

.wechat-qrcode .help p {
    font-weight: 400;
    line-height: 16px;
    padding: 0;
    margin: 0;
    width: 100%
}

.wechat-qrcode .closeWechat {
    position: absolute;
    right: 5px;
    top: 5px;
    width: 16px;
    height: 16px;
    z-index: 9;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    cursor: pointer
}

.wechat-qrcode .closeWechat:after {
    width: 2px;
    height: 100%;
    position: absolute;
    left: 50%;
    margin-left: -1px;
    content: '';
    display: block;
    background: #666
}

.wechat-qrcode .closeWechat::before {
    width: 100%;
    height: 2px;
    position: absolute;
    top: 50%;
    margin-top: -1px;
    content: '';
    display: block;
    background: #666
}

.icon-douyin:before {
    content: "\e8db"
}

.icon-bilibili-line:before {
    content: "\e75d"
}

.icon-world:before {
    content: "\e609"
}

.icon-double-left-1:before {
    content: "\e615"
}

.icon-jinrujiantouxiao:before {
    content: "\e8d4"
}

.icon-jinrujiantou:before {
    content: "\e8f1"
}

.icon-jiantou_xiangyou:before {
    content: "\eb08"
}

.icon-jiantou_xiangzuo:before {
    content: "\eb09"
}

.icon-igw-l-screen:before {
    content: "\e626"
}

.icon-guanbi:before {
    content: "\e614"
}

.icon-youjiantou:before {
    content: "\e637"
}

.icon-zuojiantou:before {
    content: "\e63b"
}

.icon-weibo:before {
    content: "\e64c"
}

.icon-weixin1:before {
    content: "\e64f"
}

.icon-qq:before {
    content: "\e611"
}

.icon-xinlangweibo:before {
    content: "\e600"
}

.icon-weixin:before {
    content: "\e67b"
}

.icon-QQ:before {
    content: "\e882"
}

.icon-riqi:before {
    content: "\e64d"
}

.icon-_didian:before {
    content: "\e659"
}

.icon-youjian:before {
    content: "\e60b"
}

.icon-dianhua:before {
    content: "\e632"
}

.icon-arrowRight:before {
    content: "\e65d"
}

.icon-caidan:before {
    content: "\e624"
}

.icon-denglu-copy:before {
    content: "\e63a"
}

.icon-sousuo:before {
    content: "\e636"
}

@font-face {
    font-family: socialshare;
    src: url(../font/socialshare.eot);
    src: url(../font/socialshare.woff) format("woff"), url(../font/socialshare.ttf) format("truetype"), url(../font/font/socialshare.svg) format("svg");
    font-display: swap
}

.social-share {
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
    font-family: socialshare;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale
}

.social-share * {
    font-family: socialshare
}

.social-share .icon-tencent:before {
    content: "\f07a"
}

.social-share .icon-qq:before {
    content: "\f11a"
}

.social-share .icon-weibo:before {
    content: "\f12a"
}

.social-share .icon-wechat:before {
    content: "\f09a"
}

.social-share .icon-douban:before {
    content: "\f10a"
}

.social-share .icon-heart:before {
    content: "\f20a"
}

.social-share .icon-like:before {
    content: "\f00a"
}

.social-share .icon-qzone:before {
    content: "\f08a"
}

.social-share .icon-linkedin:before {
    content: "\f01a"
}

.social-share .icon-diandian:before {
    content: "\f05a"
}

.social-share .icon-facebook:before {
    content: "\f03a"
}

.social-share .icon-google:before {
    content: "\f04a"
}

.social-share .icon-twitter:before {
    content: "\f06a"
}

.social-share a {
    position: relative;
    text-decoration: none;
    margin-right: .5208vw;
    display: inline-block;
    outline: 0
}

.social-share a:last-child {
    margin-right: 0
}

.social-share .social-share-icon {
    position: relative;
    display: inline-block;
    width: 2.6042vw;
    height: 2.6042vw;
    font-size: 1.0938vw;
    border-radius: 50%;
    line-height: 2.6042vw;
    color: #666;
    text-align: center;
    -webkit-transition: background .6s ease-out;
    transition: background .6s ease-out;
    background-color: #f4f4f4
}

.social-share .social-share-icon:hover {
    background: #666;
    color: #fff
}

.social-share .icon-weibo {
    color: #666
}

.social-share .icon-weibo:hover {
    background: #ff763b;
    border-color: #f06463
}

.social-share .icon-tencent:hover {
    background: #56b6e7;
    border-color: #56b6e7
}

.social-share .icon-qq {
    color: #666
}

.social-share .icon-qq:hover {
    background: #56b6e7
}

.social-share .icon-qzone {
    color: #fff;
    border-color: #e19d3c;
    background: #e19d3c
}

.social-share .icon-qzone:hover {
    background: #e19d3c
}

.social-share .icon-douban {
    color: #33b045;
    border-color: #33b045
}

.social-share .icon-douban:hover {
    background: #33b045
}

.social-share .icon-linkedin {
    color: #0077b5;
    border-color: #0077b5
}

.social-share .icon-linkedin:hover {
    background: #0077b5
}

.social-share .icon-facebook {
    color: #000
}

.social-share .icon-facebook:hover {
    background: #44619d
}

.social-share .icon-google {
    color: #db4437;
    border-color: #db4437
}

.social-share .icon-google:hover {
    background: #db4437
}

.social-share .icon-twitter {
    color: #000
}

.social-share .icon-twitter:hover {
    background: #55acee;
    border-color: #55acee
}

.social-share .icon-diandian {
    color: #307dca;
    border-color: #307dca
}

.social-share .icon-diandian:hover {
    background: #307dca
}

.social-share .icon-wechat {
    position: relative;
    color: #666
}

.social-share .icon-wechat:hover {
    background: #47b262;
    border-color: #47b262
}

.social-share .icon-wechat .wechat-qrcode {
    display: none;
    border: 1px solid #eee;
    position: absolute;
    z-index: 99;
    top: -205px;
    left: -84px;
    width: 200px;
    height: 192px;
    color: #666;
    font-size: 12px;
    text-align: center;
    background-color: #fff;
    -webkit-box-shadow: 0 2px 10px #aaa;
    box-shadow: 0 2px 10px #aaa;
    -webkit-transition: .2s;
    transition: .2s;
    -webkit-tansition: all 350ms;
    -moz-transition: 350ms
}

.social-share .icon-wechat .wechat-qrcode.bottom {
    top: 40px;
    left: -84px
}

.social-share .icon-wechat .wechat-qrcode.bottom:after {
    display: none
}

.social-share .icon-wechat .wechat-qrcode h4 {
    font-weight: 400;
    height: 26px;
    line-height: 26px;
    font-size: 12px;
    background-color: #f3f3f3;
    margin: 0;
    padding: 0;
    color: #777
}

.social-share .icon-wechat .wechat-qrcode .help p {
    font-weight: 400;
    line-height: 16px;
    padding: 0;
    margin: 0
}

.social-share .icon-wechat .wechat-qrcode:after {
    content: '';
    position: absolute;
    left: 50%;
    margin-left: -6px;
    bottom: -13px;
    width: 0;
    height: 0;
    border-width: 8px 6px 6px;
    border-style: solid;
    border-color: #fff transparent transparent
}

.social-share .icon-wechat:hover .wechat-qrcode {
    display: block
}

@media (max-width:992px) {
    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavBtn {
        width: 20% !important
    }

    .social-share .social-share-icon {
        width: 30px;
        height: 30px;
        line-height: 30px;
        font-size: 15px;
        margin-right: 6px
    }

    .social-share .icon-wechat .wechat-qrcode {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .social-share .icon-wechat .wechat-qrcode:after {
        display: none
    }
}

@font-face {
    font-family: MONTSERRAT-MEDIUM;
    src: url(../font/MONTSERRAT-MEDIUM.otf);
    font-display: swap
}

@font-face {
    font-family: MONTSERRAT-REGULAR;
    src: url(../font/MONTSERRAT-REGULAR.otf);
    font-display: swap
}

@font-face {
    font-family: Catamaran-Regular;
    src: url(../font/Catamaran-Regular.ttf);
    font-display: swap
}

.Solar.solarwhite .text .title html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none
}

blockquote,
body,
button,
code,
dd,
div,
dl,
dt,
fieldset,
form,
h1,
h2,
h3,
h4,
h5,
h6,
img,
input,
legend,
li,
ol,
p,
pre,
select,
td,
textarea,
th,
ul {
    padding: 0;
    margin: 0;
    font-weight: 400
}

body,
button,
input,
select,
textarea {
    font: 14px/1.5 HarmonyOS Sans SC, OPPOSans, PingFang SC, Source Han Sans, Microsoft YaHei;
    color: #333
}

img {
    border: 0
}

table {
    border-spacing: 0;
    border-collapse: collapse;
    border-spacing: 0;
    max-width: 100%
}

table td,
table th {
    border: 1px solid #ccc;
    padding: 16px 0
}

*,
:after,
:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-repeat: no-repeat
}

a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects;
    outline: 0;
    color: #333;
    text-decoration: none
}

a:hover {
    background-repeat: no-repeat;
    text-decoration: none
}

a,
button,
input[type=button],
input[type=reset],
input[type=submit],
label {
    cursor: pointer
}

[type=checkbox],
[type=radio] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0
}

input[type=button],
input[type=password],
input[type=reset],
input[type=submit],
input[type=text],
select,
textarea {
    outline-style: none;
    -webkit-appearance: none;
    resize: none;
    border: none;
    -webkit-border-radius: 0;
    border-radius: 0
}

textarea {
    overflow: auto;
    vertical-align: top;
    resize: none
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 rgba(255, 255, 255, 0) inset !important;
    -webkit-box-flex-color: #333;
    box-shadow: 0 0 0 1000px #fff inset !important
}

* {
    outline: 0;
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.auto_1600 {
    margin: auto;
    width: 83.33333333333333vw
}

.auto_1440 {
    margin: auto;
    width: 75vw
}

.auto_1300 {
    margin: auto;
    width: 67.8vw
}

.auto_1000 {
    margin: auto;
    width: 52.08333333333333vw
}

@media(min-width:1921px) {
    .auto_1600 {
        width: 1600px
    }

    .auto_1440 {
        width: 1440px
    }

    .auto_1300 {
        width: 1300px
    }

    .auto_1000 {
        width: 1000px
    }
}

@media(max-width:992px) {

    .auto_1000,
    .auto_1300,
    .auto_1440,
    .auto_1600 {
        width: 95%
    }
}

.columns {
    display: flex
}

.move {
    display: none
}

@media(max-width:768px) {
    .pc {
        display: none !important
    }

    .move {
        display: block
    }
}

.image {
    overflow: hidden
}

.image img {
    transition: transform 1s;
    width: 100%;
    height: auto
}

input,
select,
textarea {
    border-radius: 0;
    -webkit-border-radius: 0;
    color: #878787;
    font-family: Arial;
    background: 0 0;
    border: none;
    margin: 0;
    padding: 0
}

button,
input,
input:focus,
select,
textarea {
    outline: 0
}

input:-internal-autofill-previewed,
input:-internal-autofill-selected {
    -webkit-text-fill-color: #999 !important;
    -webkit-transition: background-color 99999999s ease-in-out !important;
    -o-transition: background-color 99999999s ease-in-out !important;
    transition: background-color 99999999s ease-in-out !important
}

.banner_ .image img {
    animation: 8s linear infinite amplify;
    -webkit-animation: 8s infinite amplify
}

@-webkit-keyframes amplify {

    0%,
    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    50% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05)
    }
}

@keyframes amplify {

    0%,
    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    50% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05)
    }
}

.bgimage img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1
}

.bgimage video {
    width: 100%
}

.SeeMore {
    margin: 0 auto;
    text-align: center;
    border-radius: 50px;
    color: #fff;
    font-size: var(--font-size15);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: .3s;
    width: 135px;
    padding: 7px 0;
    border: 1px solid rgba(255, 255, 255, .8)
}

.SeeMore img {
    width: 12px;
    margin: 0 7px 0 0;
    object-fit: contain
}

.SeeMore:hover {
    background: var(--vi-color);
    transition: .3s
}

@media(min-width:768px) {
    .SeeMore {
        width: 10.9375vw;
        padding: .78125vw .520833vw .78125vw 0;
        border: .104167vw solid rgba(255, 255, 255, .8);
        font-weight: 500;
        font-family: MONTSERRAT-REGULAR
    }

    .SeeMore img {
        margin: 0 .520833vw 0 0;
        width: 1.145833vw
    }
}

@media(min-width:1600px) {
    .SeeMore {
        width: 210px;
        padding: 15px 10px 15px 0;
        border: 2px solid rgba(255, 255, 255, .8)
    }

    .SeeMore img {
        margin: 0 10px 0 0;
        width: 22px
    }
}

.amplify:hover .image img {
    transform: scale(1.05)
}

.slick-dots {
    text-align: center
}

.slick-dots li {
    position: relative;
    display: inline-block;
    margin: 0 5px
}

.slick-dots li button {
    background: #0071bc3f;
    display: block;
    font-size: 0;
    padding: 4px;
    border: 0;
    border-radius: 50px
}

li.slick-active button {
    background: #0071bc
}

.tanchuang {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(0 0 0 / 30%);
    visibility: hidden;
    opacity: 0;
    transition: .5s
}

.tanchuang.on {
    visibility: unset;
    opacity: 1;
    transition: .5s
}

.tanchuang .view {
    width: 80%;
    margin: auto;
    text-align: right
}

.tanchuang .shiping {
    display: flex;
    align-items: center;
    justify-items: center
}

#video1 {
    width: 100%;
    display: block
}

.icon-guanbi {
    font-size: var(--font-size20);
    color: #fff;
    cursor: pointer
}

.title {
    font-size: var(--font-size38);
    font-weight: 600;
    line-height: 1;
    color: #333
}

.tanchuang.iframe .shiping,
.tanchuang.iframe .view {
    height: 100%
}

.tanchuang.iframe .view iframe {
    width: 100%;
    height: 100%
}

@media(min-width:768px) {
    .tanchuang {
        padding: 7.813vw 0
    }

    .tanchuang .shiping #video1 {
        max-height: 32.291667vw;
        background: #000
    }

    html {
        --font-size12: .78125vw;
        --font-size13: .833333vw;
        --font-size14: .885417vw;
        --font-size15: .9375vw;
        --font-size16: .989583vw;
        --font-size17: 1.041667vw;
        --font-size18: 1.041667vw;
        --font-size19: 1.145833vw;
        --font-size20: 1.197917vw;
        --font-size21: 1.25vw;
        --font-size22: 1.302083vw;
        --font-size23: 1.354167vw;
        --font-size24: 1.40625vw;
        --font-size25: 1.458333vw;
        --font-size26: 1.510417vw;
        --font-size27: 1.5625vw;
        --font-size28: 1.614583vw;
        --font-size29: 1.666667vw;
        --font-size30: 1.71875vw;
        --font-size32: 1.822917vw;
        --font-size34: 1.927083vw;
        --font-size35: 1.979167vw;
        --font-size36: 2.03125vw;
        --font-size38: 2.135417vw;
        --font-size40: 2.239583vw;
        --font-size42: 2.34375vw;
        --font-size45: 2.5vw;
        --font-size46: 2.552083vw;
        --font-size48: 1.09375vw;
        --font-size50: 2.760417vw;
        --font-size54: 2.96875vw;
        --font-size56: 3.072917vw;
        --font-size60: 3.28125vw;
        --font-size64: 3.489583vw;
        --font-size70: 3.802083vw;
        --font-size73: 3.802083vw;
        --font-size78: 4.21875vw;
        --font-size80: 4.322917vw;
        --font-size90: 4.84375vw;
        --font-size139: 7.395833vw;
        --font-size160: 8.489583vw
    }
}

@media(min-width:1200px) {
    html {
        --font-size12: 0.625vw;
        --font-size13: 0.677vw;
        --font-size14: 0.729vw;
        --font-size15: 0.781vw;
        --font-size16: 0.833vw;
        --font-size17: 0.885vw;
        --font-size18: 0.938vw;
        --font-size19: 0.99vw;
        --font-size20: 1.042vw;
        --font-size21: 1.094vw;
        --font-size22: 1.146vw;
        --font-size23: 1.198vw;
        --font-size24: 1.25vw;
        --font-size25: 1.302vw;
        --font-size26: 1.354vw;
        --font-size27: 1.406vw;
        --font-size28: 1.458vw;
        --font-size29: 1.51vw;
        --font-size30: 1.563vw;
        --font-size32: 1.667vw;
        --font-size34: 1.771vw;
        --font-size35: 1.823vw;
        --font-size36: 1.875vw;
        --font-size38: 1.979vw;
        --font-size40: 2.083vw;
        --font-size42: 2.188vw;
        --font-size45: 2.344vw;
        --font-size46: 2.396vw;
        --font-size48: 2.5vw;
        --font-size50: 2.604vw;
        --font-size54: 2.813vw;
        --font-size56: 2.917vw;
        --font-size60: 3.125vw;
        --font-size64: 3.333vw;
        --font-size70: 3.646vw;
        --font-size73: 3.802vw;
        --font-size78: 4.063vw;
        --font-size80: 4.166667vw;
        --font-size90: 4.688vw;
        --font-size139: 7.239583vw;
        --font-size160: 8.333333vw
    }
}

@media(min-width:1600px) {
    html {
        --font-size12: 12px;
        --font-size13: 13px;
        --font-size14: 14px;
        --font-size15: 15px;
        --font-size16: 16px;
        --font-size17: 17px;
        --font-size18: 18px;
        --font-size19: 19px;
        --font-size20: 20px;
        --font-size21: 21px;
        --font-size22: 22px;
        --font-size23: 23px;
        --font-size24: 24px;
        --font-size25: 25px;
        --font-size26: 26px;
        --font-size27: 27px;
        --font-size28: 28px;
        --font-size29: 29px;
        --font-size30: 30px;
        --font-size32: 32px;
        --font-size34: 34px;
        --font-size35: 35px;
        --font-size36: 36px;
        --font-size38: 38px;
        --font-size40: 40px;
        --font-size42: 42px;
        --font-size45: 45px;
        --font-size46: 46px;
        --font-size48: 48px;
        --font-size50: 50px;
        --font-size54: 54px;
        --font-size56: 56px;
        --font-size60: 60px;
        --font-size64: 64px;
        --font-size70: 70px;
        --font-size73: 73px;
        --font-size78: 78px;
        --font-size80: 80px;
        --font-size90: 90px;
        --font-size139: 139px;
        --font-size160: 160px
    }
}

.Landing {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: #252627;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    text-align: center
}

.Landing .svg {
    animation: 1s fadeInUp;
    -webkit-animation: 1s fadeInUp;
    position: relative
}

.Landing .svg path {
    animation: 3s linear forwards opacity2;
    -webkit-animation: 3s opacity2;
    opacity: 0
}

.Landing .svg svg path:nth-child(2) {
    animation-delay: .5s
}

.Landing .svg svg path:nth-child(3) {
    animation-delay: .7s
}

.Landing .svg svg path:nth-child(4) {
    animation-delay: .9s
}

.Landing .svg svg path:nth-child(5) {
    animation-delay: 1.1s
}

.Landing .svg svg path:nth-child(6) {
    animation-delay: 1.3s
}

.Landing .svg svg path:nth-child(7) {
    animation-delay: 1.5s
}

.Landing .svg svg path:nth-child(8) {
    animation-delay: 1.7s
}

.Landing .svg svg path:nth-child(9) {
    animation-delay: 1.9s
}

.Landing .svg svg path:nth-child(10) {
    animation-delay: 2.1s
}

@-webkit-keyframes opacity2 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes opacity2 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@media(max-width:768px) {
    .SeeMore {
        margin: 0 auto 80px
    }

    .tanchuang .view {
        width: 100%
    }

    .icon-guanbi {
        font-size: 18px
    }

    .tanchuang .shiping,
    .tanchuang.iframe .view {
        height: auto
    }

    .tanchuang.iframe .view iframe {
        width: 100%;
        height: 300px
    }

    html {
        --font-size12: 12px;
        --font-size13: 12px;
        --font-size14: 12px;
        --font-size15: 12px;
        --font-size16: 13px;
        --font-size17: 14px;
        --font-size18: 14px;
        --font-size19: 15px;
        --font-size20: 15px;
        --font-size21: 16px;
        --font-size22: 16px;
        --font-size23: 18px;
        --font-size24: 18px;
        --font-size25: 18px;
        --font-size26: 18px;
        --font-size27: 18px;
        --font-size28: 18px;
        --font-size29: 18px;
        --font-size30: 18px;
        --font-size32: 18px;
        --font-size34: 18px;
        --font-size35: 18px;
        --font-size36: 18px;
        --font-size38: 18px;
        --font-size40: 18px;
        --font-size42: 18px;
        --font-size45: 20px;
        --font-size46: 20px;
        --font-size48: 20px;
        --font-size50: 20px;
        --font-size54: 20px;
        --font-size56: 20px;
        --font-size60: 22px;
        --font-size64: 22px;
        --font-size70: 22px;
        --font-size73: 22px;
        --font-size78: 22px;
        --font-size80: 22px;
        --font-size90: 22px;
        --font-size139: 25px;
        --font-size160: 30px
    }

    .Landing {
        z-index: 100
    }

    .Landing>div {
        padding: 0 0 20px
    }

    .Landing .svg svg {
        width: 102px;
        min-width: 102px;
        position: absolute;
        top: -43px;
        right: -5px
    }

    .Landing .svg img {
        max-width: unset;
        width: 189px
    }
}

.indexBanner {
    overflow: hidden;
    position: relative;
    z-index: 15;
    background: #2c2f33
}

.indexBanner .image {
    aspect-ratio: 1920/800
}

@media (max-width:768px) {
    .indexBanner .image {
        aspect-ratio: 750/971
    }
}

.indexBanner>i {
    width: 100%;
    height: 11.625vw;
    position: absolute;
    background: linear-gradient(180deg, rgb(0 0 0 / 30%), transparent);
    z-index: 2
}

.indexBanner.on {
    opacity: 1;
    visibility: unset
}

.indexBanner.on .banner .list:first-child .image img {
    position: relative;
    z-index: 0
}

.indexBanner .list {
    position: relative
}

.indexBanner .list.swiper-slide-next .image {
    transform: translate(60%, 60%);
    transition: transform 1.5s, opacity 1.5s;
    opacity: 0;
    visibility: hidden
}

.indexBanner .list.swiper-slide-prev .image {
    transform: translate(-60%, -60%);
    transition: transform 1.5s, opacity 1.5s;
    opacity: 0;
    visibility: hidden
}

.indexBanner .list.swiper-slide-active .image,
.indexBanner .list:first-child .image {
    transform: translate(0, 0);
    transition: transform .8s, opacity .8s;
    opacity: 1;
    visibility: visible
}

.indexBanner .columns {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    display: none;
    z-index: 1;
    opacity: 0
}

.indexBanner .columns.on {
    opacity: 1
}

.indexBanner .list:first-child .columns,
.indexBanner .swiper-slide-active.on .columns {
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1
}

@media (max-width:992px) {

    .indexBanner .list:first-child .columns,
    .indexBanner .swiper-slide-active.on .columns {
        display: block
    }
}

.indexBanner .swiper-slide-active.on .columns a {
    display: flex;
    height: 100%;
    text-indent: 1em;
    align-items: center;
    margin: inherit
}

.indexBanner .columns .title {
    font-size: var(--font-size48);
    color: #fff;
    line-height: 1;
    text-align: left
}

.indexBanner .columns .text_content {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    width: 50%;
    max-width: 840px;
    margin-left: 4%
}

.indexBanner .columns .Htitle {
    font-size: var(--font-size24);
    color: #fff;
    line-height: 1;
    width: 70%;
    text-align: left
}

.indexBanner .columns .Htitle span span {
    display: block;
    color: #fb7d20;
    font-size: var(--font-size21);
    margin-top: 10px
}

.indexBanner .columns .intro {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size20);
    color: #fff
}

.indexBanner .columns .intro>div {
    display: flex;
    align-items: center
}

.indexBanner .swiper-pagination-bullet {
    border-radius: 50px;
    opacity: .2;
    background: #fff
}

.indexBanner .swiper-pagination-bullet-active {
    opacity: 1
}

.indexBanner .SeeMore {
    background: var(--vi-color)
}

.indexBanner .SeeMore:hover {
    box-shadow: 0 0 13px 0 #ffffffb0
}

@media ((max-width:992px)) {
    .indexBanner .columns .text_content {
        display: block;
        max-width: none;
        margin: auto;
        width: 90%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .indexBanner .columns .Htitle {
        margin: 20px auto;
        text-align: center;
        width: 100%
    }

    .indexBanner .swiper-slide-active.on .columns a {
        margin-top: 0
    }
}

@media(max-width:768px) {
    .indexBanner>i {
        display: none
    }

    .indexBanner .columns .title {
        font-size: var(--font-size40);
        line-height: 1;
        margin: 0 0 6px;
        font-size: 25px
    }

    .indexBanner .columns .Htitle {
        margin: 20px 0 5px;
        font-size: var(--font-size22);
        line-height: 1.2
    }

    .indexBanner .columns .intro {
        margin: 0 0 15px
    }

    .indexBanner .columns .intro>div {
        margin: 0 10px
    }

    .indexBanner .columns .intro>div img {
        margin: 0 8px 0 0;
        width: 12px
    }

    .indexBanner .swiper-pagination {
        bottom: 20px
    }

    .indexBanner .swiper-pagination-bullet {
        width: 11px;
        height: 3px
    }

    .indexBanner .swiper-pagination-bullet-active {
        width: 16px
    }
}

@media(min-width:768px) {
    .Landing>div {
        padding: 0 0 2.083vw
    }

    .Landing .svg svg {
        width: 5.313vw;
        top: -2.24vw;
        right: -.417vw
    }

    .Landing .svg img {
        width: 9.844vw;
        margin: -.781vw -5.156vw 0 0;
        max-width: unset
    }

    .indexBanner .columns .Htitle {
        margin: 1.041667vw 0
    }

    .indexBanner .columns .intro {
        margin: 0 0 1.5625vw
    }

    .indexBanner .columns .intro>div {
        margin: 0 1.041667vw
    }

    .indexBanner .columns .intro>div img {
        margin: 0 .416667vw 0 0;
        width: 1.145833vw
    }

    .indexBanner .swiper-pagination {
        bottom: 2.864583vw
    }

    .indexBanner .swiper-pagination-bullet {
        width: 1.197917vw;
        height: .208333vw
    }

    .indexBanner .swiper-pagination-bullet-active {
        width: 2.34375vw;
        height: .208333vw;
        margin: 0 .15625vw
    }
}

@media(min-width:1600px) {
    .Landing>div {
        padding: 0 0 40px
    }

    .Landing .svg svg {
        width: 102px;
        position: absolute;
        top: -43px;
        right: -8px
    }

    .Landing .svg img {
        width: 189px;
        margin: auto
    }

    .indexBanner .columns .Htitle {
        margin: 30px 0
    }

    .indexBanner .columns .intro {
        margin: 0 0 30px
    }

    .indexBanner .columns .intro>div {
        margin: 0 20px
    }

    .indexBanner .columns .intro>div img {
        margin: 0 8px 0 0;
        width: 22px
    }

    .indexBanner .swiper-pagination {
        bottom: 55px
    }

    .indexBanner .swiper-pagination-bullet {
        width: 23px;
        height: 4px
    }

    .indexBanner .swiper-pagination-bullet-active {
        width: 45px;
        height: 4px;
        margin: 0 3px
    }
}

.Safety {
    position: relative;
    overflow: hidden
}

.indexHtitle {
    font-weight: 400;
    font-size: var(--font-size20);
    color: #9d9d9d;
    display: flex;
    align-items: center;
    font-family: MONTSERRAT-REGULAR
}

.indexHtitle span {
    display: block;
    line-height: 1;
    position: relative;
    overflow: hidden
}

.indexHtitle span i {
    content: '';
    position: absolute;
    top: 0;
    left: -3px;
    width: 30px;
    height: 30px;
    z-index: 5;
    transition: 1s;
    transform: rotate(0);
    -webkit-animation-name: indexrotate;
    animation-name: indexrotate;
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards
}

.Safety .indexHtitle span i,
.indexSolution .indexHtitle span i {
    background: linear-gradient(180deg, #252628 50%, transparent 50%)
}

.indexNews .indexHtitle span i,
.indexProduct .indexHtitle span i {
    background: linear-gradient(180deg, #fff 50%, transparent 50%)
}

@-webkit-keyframes indexrotate {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(180deg)
    }
}

@keyframes indexrotate {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(180deg)
    }
}

.Safety .indexHtitle {
    color: #fff
}

.indexHtitle span img {
    display: block
}

.Safety .Htitle {
    justify-content: center
}

.Safety .title {
    font-size: var(--font-size60);
    color: #fff
}

.Safety .title span:nth-child(2) {
    color: var(--vi-color)
}

.Safety .intro {
    font-size: var(--font-size18);
    color: #fff;
    line-height: 1.5;
    text-align: center
}

.Safety .video {
    position: relative;
    width: 100%;
    cursor: pointer;
    clip-path: inset(5% 22% round 500px);
    transition: .5s
}

.Safety .video iframe,
.Safety .video video {
    width: 100%
}

.Safety .video .icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.Safety .video .icon>div {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center
}

.Safety .video .icon>div .bgimage img {
    z-index: 0
}

.ios_video {
    display: none
}

.Safety>.bgimage>img.safety-poster {
    position: relative;
    z-index: 0;
    width: 100%;
    height: auto !important;
    display: block;
    object-fit: cover
}

.foutind {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    pointer-events: none
}

.SeeMore1 {
    background: var(--vi-color)
}

@media(max-width:768px) {
    .pc_video {
        display: none
    }

    .ios_video {
        display: block
    }

    .Safety .Htitle {
        padding: 0 0 15px
    }

    .indexHtitle {
        font-size: 19px
    }

    .indexHtitle span {
        padding: 0 5px 0 0
    }

    .Safety .title {
        padding: 0 0 15px;
        line-height: unset;
        font-size: 24px
    }

    .Safety .title span {
        text-align: center
    }

    .Safety .intro {
        padding: 0 0 30px
    }

    .Safety>.bgimage img {
        height: calc(100% - 35px);
        background: #252627
    }

    .Safety .video {
        clip-path: inset(0)
    }

    .Safety .video video {
        width: 100%
    }

    .Safety .video iframe {
        height: 220px
    }

    .Safety .video .icon>div {
        width: 50px;
        height: 50px
    }

    .Safety .video .icon .img {
        width: 10px;
        margin: 0 0 4px 4px;
        object-fit: contain
    }

    .indexHtitle span img {
        height: 11px;
        margin: 1px 0 0
    }

    .Safety .intro br {
        display: none
    }
}

@media(min-width:768px) {
    .Safety .Htitle {
        padding: 0 0 3.125vw
    }

    .indexHtitle span {
        padding: 0 .520833vw 0 0
    }

    .Safety .title {
        padding: 0 0 3.125vw
    }

    .Safety .intro {
        padding: 0 0 5.208333vw
    }

    .Safety>.bgimage img {
        height: calc(100% - 4.375vw)
    }

    .Safety .video iframe {
        height: 36.458333vw
    }

    .Safety .video .icon>div {
        width: 6.510417vw;
        height: 6.510417vw
    }

    .Safety .video .icon .img {
        width: 1.09375vw
    }

    .indexHtitle span img {
        height: .78125vw;
        object-fit: contain
    }
}

@media(min-width:1600px) {
    .Safety .Htitle {
        padding: 0 0 50px
    }

    .indexHtitle span {
        padding: 0 10px 0 0
    }

    .Safety .title {
        padding: 0 0 50px
    }

    .Safety .intro {
        padding: 0 0 100px
    }

    .Safety>.bgimage img {
        height: calc(100% - 84px)
    }

    .Safety .video iframe {
        height: 700px
    }

    .Safety .video .icon>div {
        width: 125px;
        height: 125px
    }

    .Safety .video .icon .img {
        width: 21px
    }

    .indexHtitle span img {
        height: 15px
    }
}

.indexProduct {
    overflow: hidden
}

.indexProduct .Htitle {
    color: #9d9d9d;
    display: flex;
    align-items: center
}

.indexProduct .title {
    font-size: var(--font-size60);
    color: #3b3b3b
}

.indexProduct .title span {
    margin: 0
}

.indexProduct .title span:nth-child(3) {
    color: var(--vi-color)
}

.indexProduct .columns {
    align-items: end;
    justify-content: space-between
}

.indexProduct .columns .button {
    border-radius: 50%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center
}

.indexProduct .columns .button span {
    width: 2px;
    height: 50px;
    background: #9aa5b1;
    opacity: .1;
    transform: rotate(30deg)
}

.indexProduct .columns .button a i {
    font-size: var(--font-size18);
    color: #c5e227;
    font-weight: 600
}

.indexProduct .columns .button a.button-next {
    transform: rotate(180deg)
}

.indexProduct .columns .button a.button-next i {
    color: var(--vi-color)
}

.indexProduct ul {
    border-left: 1px solid #e5e5e5
}

.indexProduct ul::before {
    content: '';
    height: 100%;
    width: 1px;
    background: #e5e5e5;
    position: absolute;
    right: 0;
    top: 0
}

.indexProduct ul li {
    position: relative;
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5
}

.authentication ul {
    border: none
}

#authentication ul li {
    border: none;
    text-align: center;
    position: relative;
    padding-bottom: 15%
}

#authentication ul li img {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 80%;
    height: 80%;
    object-fit: cover;
    transition: .3s;
    transform: translate(-50%, -50%)
}

#authentication ul li img:hover {
    transform: translate(-50%, -50%) scale(1.1)
}

#authentication ul::before {
    display: none
}

.indexProduct ul li .text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: space-between;
    z-index: 2
}

.indexProduct ul li .text .title {
    font-weight: 500;
    font-size: var(--font-size20);
    color: #3b3b3b;
    font-family: MONTSERRAT-REGULAR
}

.indexProduct ul li .text .intro {
    font-size: var(--font-size18);
    color: #3b3b3b;
    line-height: 1.2;
    opacity: .4
}

.indexProduct ul li:hover .text .intro {
    font-family: MONTSERRAT-REGULAR
}

.indexProduct ul li .text .icon {
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
    opacity: 0;
    background: #fff;
    transition: .3s;
    flex-shrink: 0
}

.indexProduct ul li .bgimage {
    visibility: hidden;
    opacity: 0;
    transition: .3s
}

.indexProduct ul li:hover .bgimage,
.indexProduct ul li:hover .icon {
    visibility: unset;
    opacity: 1;
    transition: .3s
}

.indexProduct ul li:hover .title {
    color: #fff
}

.indexProduct ul li:hover .intro {
    color: #fff;
    opacity: .4
}

.indexProduct ul li .icon:hover {
    background: var(--vi-color)
}

.indexProduct ul li .icon:hover img {
    filter: grayscale(100%) brightness(500%)
}

.indexProduct ul li .image {
    position: relative;
    z-index: 1
}

#Honor ul li .image {
    padding-bottom: 145%
}

#Honor ul li .image img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover;
    padding: 0
}

.indexProduct .swiper-pagination {
    position: unset;
    justify-content: center;
    margin: 20px 0 0;
    display: none
}

.indexProduct .swiper-pagination-bullet {
    width: 11px;
    height: 3px;
    margin: 0 3px;
    border-radius: 50px;
    opacity: .2;
    background: var(--vi-color)
}

.indexProduct .swiper-pagination-bullet-active {
    width: 16px;
    opacity: 1
}

.invest_list {
    margin-top: 3vw;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap
}

.invest_list .invest_item {
    width: 48%
}

.invest_list .invest_item a {
    position: relative;
    overflow: hidden;
    display: block;
    padding-bottom: 11%;
    width: 55%;
    bottom: -30px
}

.invest_list .invest_item a img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover
}

.invest_list .invest_item .invest_text {
    margin-top: 20px;
    box-shadow: 0 0 10px 2px rgb(0 0 0 / 20%);
    border-radius: 15px;
    padding: 10px
}

@media(max-width:768px) {
    .invest_list {
        flex-direction: column
    }

    .invest_list .invest_item {
        width: 100%;
        margin-bottom: 30px
    }

    .indexProduct {
        padding: 35px 0
    }

    .authentication .title,
    .indexProduct .title {
        padding: 10px 0 0;
        line-height: 1.2;
        font-size: 24px
    }

    .indexProduct .columns .button {
        display: none
    }

    .indexProduct ul {
        margin: 40px -5% 0 0;
        padding: 0 100px 0 0
    }

    .indexProduct ul li {
        height: auto
    }

    .indexProduct ul li .text {
        padding: 20px
    }

    .indexProduct ul li .text .title {
        padding: 0 0 6px;
        font-size: 18px;
        font-weight: 700
    }

    .indexProduct ul li .text .intro {
        font-size: 16px
    }

    .indexProduct ul li .text .icon {
        width: 30px;
        height: 30px
    }

    .indexProduct ul li .text .icon img {
        width: 12px
    }

    .indexProduct ul li .image img {
        padding: 100px 20px 20px
    }

    .indexProduct .swiper-pagination {
        display: flex
    }

    #Honor {
        padding-bottom: 0
    }
}

@media(min-width:768px) {
    .indexProduct ul li .image {
        padding: 6.770833vw 1.5625vw 1.5625vw
    }

    #Honor ul li .image {
        padding: 0 0 145%
    }

    .indexProduct ul li .image img {
        height: 24.583333vw;
        object-fit: contain
    }

    .indexProduct {
        padding: 6.25vw 0 5.208333vw
    }

    .indexProduct .title {
        padding: 1.5625vw 0 0
    }

    .indexProduct .columns .button {
        width: 6.510417vw;
        height: 6.510417vw;
        margin: 0 0 2.083333vw
    }

    .indexProduct .columns .button a.button-prev {
        margin: -1.041667vw .520833vw 0
    }

    .indexProduct .columns .button a.button-next {
        margin: 1.041667vw .520833vw 0
    }

    .indexProduct ul {
        margin: 1.510417vw 0 0
    }

    .indexProduct ul li .text {
        padding: 2.083333vw
    }

    .indexProduct ul li .text .title {
        padding: 0 0 .625vw
    }

    .indexProduct ul li .text .icon {
        width: 3.333333vw;
        height: 3.333333vw
    }

    .indexProduct ul li .text .icon img {
        width: .9375vw
    }
}

@media(min-width:1600px) {
    .indexProduct ul li .image {
        padding: 130px 30px 30px
    }

    #Honor ul li .image {
        padding-top: 0
    }

    .indexProduct ul li .image img {
        height: 472px
    }

    .indexProduct {
        padding: 120px 0 100px
    }

    .indexProduct .title {
        padding: 30px 0 0
    }

    .indexProduct .columns .button {
        width: 125px;
        height: 125px;
        margin: 0 0 40px
    }

    .indexProduct .columns .button a.button-prev {
        margin: -20px 10px 0
    }

    .indexProduct .columns .button a.button-next {
        margin: 20px 10px 0
    }

    .indexProduct ul {
        margin: 25px 0 0
    }

    .indexProduct ul li .text {
        padding: 40px
    }

    .indexProduct ul li .text .title {
        padding: 0 0 12px
    }

    .indexProduct ul li .text .icon {
        width: 64px;
        height: 64px
    }

    .indexProduct ul li .text .icon img {
        width: 18px
    }
}

.indexSolution {
    position: relative;
    overflow: hidden
}

.indexSolution .title {
    font-size: var(--font-size60);
    color: #fff
}

.indexSolution .title span {
    margin: 0;
    color: #fff
}

.indexSolution .title span:nth-child(2) {
    color: #ed6f32
}

.indexSolution .swiper .swiper-slide {
    text-align: center;
    cursor: pointer
}

.indexSolution .swiper .swiper-slide .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 100%
}

.indexSolution .swiper .swiper-slide .icon img {
    max-height: 100%;
    height: 100%
}

.indexSolution .swiper .swiper-slide .icon img:nth-child(2) {
    opacity: 0;
    visibility: hidden;
    position: absolute
}

.indexSolution .swiper .swiper-slide.on .icon img:first-child,
.indexSolution .swiper .swiper-slide:hover .icon img:first-child {
    opacity: 0;
    visibility: hidden
}

.indexSolution .swiper .swiper-slide.on .icon img:nth-child(2),
.indexSolution .swiper .swiper-slide:hover .icon img:nth-child(2) {
    opacity: 1;
    visibility: unset
}

.indexSolution .swiper .swiper-slide .img {
    display: none;
    animation: 2.5s infinite float1;
    -webkit-animation: 2.5s infinite float1
}

.indexSolution .swiper .swiper-slide.on .img {
    display: block
}

@-webkit-keyframes float1 {

    0%,
    to {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }

    50% {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes float1 {

    0%,
    to {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }

    50% {
        -webkit-transform: none;
        transform: none
    }
}

.indexSolution .swiper .swiper-slide i {
    background: #fff;
    border-radius: 50%;
    display: block;
    margin: auto
}

.indexSolution .swiper .swiper-slide .Stitle {
    font-weight: 300;
    font-size: var(--font-size18);
    color: #fff;
    opacity: .5;
    line-height: 1.2;
    transition: .3s
}

.indexSolution .swiper .swiper-slide.on .Stitle,
.indexSolution .swiper .swiper-slide:hover .Stitle {
    opacity: 1;
    transition: .3s
}

.SolutionTop {
    position: relative
}

.SolutionTop::before {
    width: 100%;
    height: 1px;
    background: rgba(255, 255, 255, .2);
    position: absolute;
    left: 0;
    content: ''
}

.indexSolution ul {
    overflow: unset
}

.indexSolution ul li {
    width: 100%
}

.indexSolution ul li a {
    display: flex;
    align-items: center
}

.indexSolution ul .text .title {
    font-weight: 500;
    font-size: var(--font-size36);
    color: #fff;
    line-height: 1.1;
    font-family: MONTSERRAT-REGULAR
}

.indexSolution ul .text .intro {
    font-weight: 300;
    font-size: var(--font-size18);
    color: #fff;
    line-height: 1.4;
    opacity: .6
}

.indexSolution ul .text .SeeMore {
    background: #fc6c0f;
    border-color: transparent
}

.indexSolution ul .text .SeeMore:hover {
    background: 0 0;
    border-color: #fc6c0f
}

@media(max-width:768px) {
    .indexSolution {
        padding: 35px 0 40px
    }

    .indexSolution .Htitle {
        padding: 0 0 15px;
        line-height: 1
    }

    .indexSolution .title {
        padding: 0 0 30px;
        line-height: 1.2;
        font-size: 24px
    }

    .indexSolution dl {
        padding: 0 70px 20px 0
    }

    .indexSolution .swiper .swiper-slide .Stitle {
        padding: 8px 0 0;
        min-height: 46px;
        line-height: unset;
        font-size: 16px
    }

    .indexSolution .swiper .swiper-slide .icon {
        height: 25px;
        margin: 20px 0 0
    }

    .indexSolution .swiper .swiper-slide .img img {
        width: 10px;
        margin: 0
    }

    .indexSolution .swiper .swiper-slide i {
        width: 7px;
        height: 7px
    }

    .SolutionTop::before {
        top: 3px
    }

    .indexSolution ul {
        padding: 0
    }

    .indexSolution ul .image {
        width: 100%;
        min-width: 100%
    }

    .indexSolution ul .text {
        padding: 0;
        max-width: 100%
    }

    .indexSolution ul .text .intro {
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        font-size: 16px
    }

    .indexSolution ul .text .title {
        line-height: unset;
        padding: 18px 0;
        font-size: 18px;
        font-weight: 700
    }

    .indexSolution ul .text .SeeMore {
        margin: 20px 0 0
    }

    .indexSolution ul li a {
        display: block
    }

    @-webkit-keyframes float1 {

        0%,
        to {
            -webkit-transform: translate3d(0, 5px, 0);
            transform: translate3d(0, 5px, 0)
        }

        50% {
            -webkit-transform: none;
            transform: none
        }
    }

    @keyframes float1 {

        0%,
        to {
            -webkit-transform: translate3d(0, 5px, 0);
            transform: translate3d(0, 5px, 0)
        }

        50% {
            -webkit-transform: none;
            transform: none
        }
    }
}

@media(min-width:768px) {
    .indexSolution {
        padding: 4.6875vw 0 5.208333vw
    }

    .indexSolution .Htitle {
        padding: 0 0 1.5625vw
    }

    .indexSolution .title {
        padding: 0 0 3.385417vw
    }

    .indexSolution dl {
        padding: 0 0 3.645833vw
    }

    .indexSolution .swiper .swiper-slide .Stitle {
        padding: .885417vw 0 0;
        min-height: 3.177083vw;
        line-height: unset
    }

    .indexSolution .swiper .swiper-slide .icon {
        height: 2.5vw;
        margin: 1.979167vw 0 0
    }

    .indexSolution .swiper .swiper-slide .img img {
        width: .833333vw;
        margin: .520833vw 0 0
    }

    .indexSolution .swiper .swiper-slide i {
        width: .364583vw;
        height: .364583vw
    }

    .SolutionTop::before {
        top: .15625vw
    }

    .indexSolution ul {
        padding: 0 16.666667vw
    }

    .indexSolution ul .image {
        width: 25.364583vw;
        min-width: 25.364583vw
    }

    .indexSolution ul .text {
        padding: 0 2.604167vw 2.604167vw 4.6875vw;
        max-width: 100%;
        flex: 1
    }

    .indexSolution ul .text .title {
        padding: 0 0 1.822917vw
    }

    .indexSolution ul .text .SeeMore {
        margin: 2.34375vw 0 0
    }

    @-webkit-keyframes float1 {

        0%,
        to {
            -webkit-transform: translate3d(0, .520833vw, 0);
            transform: translate3d(0, .520833vw, 0)
        }

        50% {
            -webkit-transform: none;
            transform: none
        }
    }

    @keyframes float1 {

        0%,
        to {
            -webkit-transform: translate3d(0, .520833vw, 0);
            transform: translate3d(0, .520833vw, 0)
        }

        50% {
            -webkit-transform: none;
            transform: none
        }
    }

    .indexSolution ul li .amplify {
        transition: 2s;
        z-index: 1;
        position: relative
    }

    .indexSolution ul li.swiper-slide-prev .amplify {
        transform: translateX(144%);
        transition: 2s
    }

    .indexSolution ul li.swiper-slide-prev .text {
        transform: translateX(-82%);
        transition: 2s
    }
}

@media(min-width:1200px) {
    .indexSolution ul .text {
        max-width: 37.5vw
    }
}

@media(min-width:1600px) {
    .indexSolution {
        padding: 90px 0 100px
    }

    .indexSolution .Htitle {
        padding: 0 0 30px
    }

    .indexSolution .title {
        padding: 0 0 65px
    }

    .indexSolution dl {
        padding: 0 0 70px
    }

    .indexSolution .swiper .swiper-slide .Stitle {
        padding: 17px 0 0;
        min-height: 61px
    }

    .indexSolution .swiper .swiper-slide .icon {
        height: 48px;
        margin: 38px 0 0
    }

    .indexSolution .swiper .swiper-slide .img img {
        width: 16px;
        margin: 10px 0 0
    }

    .indexSolution .swiper .swiper-slide i {
        width: 7px;
        height: 7px
    }

    .SolutionTop::before {
        top: 3px
    }

    .indexSolution ul {
        padding: 0 320px;
        width: 1920px;
        margin: auto
    }

    .indexSolution ul .image {
        width: 487px;
        min-width: 487px
    }

    .indexSolution ul .text {
        padding: 0 50px 50px 90px;
        max-width: 720px
    }

    .indexSolution ul .text .title {
        padding: 0 0 35px
    }

    .indexSolution ul .text .SeeMore {
        margin: 45px 0 0
    }

    @-webkit-keyframes float1 {

        0%,
        to {
            -webkit-transform: translate3d(0, 10px, 0);
            transform: translate3d(0, 10px, 0)
        }

        50% {
            -webkit-transform: none;
            transform: none
        }
    }

    @keyframes float1 {

        0%,
        to {
            -webkit-transform: translate3d(0, 10px, 0);
            transform: translate3d(0, 10px, 0)
        }

        50% {
            -webkit-transform: none;
            transform: none
        }
    }
}

.indexNews {
    position: relative
}

.indexNews .Htitle {
    color: #9d9d9d;
    line-height: 1
}

.indexNews .title {
    font-size: var(--font-size60);
    color: #3b3b3b
}

.indexNews .title span {
    margin: 0
}

.indexNews .title span:nth-child(2) {
    color: #ed6f32
}

.indexNews .left a {
    position: relative;
    display: block;
    height: 100%
}

.indexNews .left a .image {
    position: relative;
    padding-bottom: 73%
}

.indexNews .left a .image img {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    object-fit: cover
}

.indexNews .left .text {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: linear-gradient(0deg, #000000a6, transparent)
}

.indexNews .left .Stitle {
    font-weight: 500;
    font-size: var(--font-size14);
    color: #fff;
    font-family: MONTSERRAT-REGULAR
}

.indexNews .left .intro {
    font-weight: 500;
    font-size: var(--font-size22);
    color: #fff;
    line-height: 1.25;
    font-family: MONTSERRAT-REGULAR
}

.indexNews .right {
    flex: 1
}

.indexNews .right a {
    display: flex;
    align-items: center;
    position: relative
}

.indexNews .right a:not(:last-child):after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #ccc
}

.indexNews .right a:not(:last-child)::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 1px;
    background: var(--vi-color);
    transition: 1s;
    z-index: 1
}

.indexNews .right a:hover:before {
    width: 100%;
    transition: 1s
}

.indexNews .right a:first-child {
    padding-top: 0
}

.indexNews .right a:last-child {
    padding-bottom: 0
}

.indexNews .right a .image {
    position: relative;
    padding-bottom: 17%
}

.indexNews .right a .image img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover
}

.indexNews .right a .text {
    flex: 1
}

.indexNews .right a .text .Stitle {
    font-weight: 500;
    font-size: var(--font-size14);
    color: var(--vi-color);
    font-family: MONTSERRAT-REGULAR
}

.indexNews .right a .text .intro {
    font-weight: 500;
    font-size: var(--font-size22);
    color: #333;
    line-height: 1.25;
    font-family: MONTSERRAT-REGULAR;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.indexNews .right a .text .date {
    font-weight: 500;
    font-size: var(--font-size15);
    color: #a9a9a9;
    font-family: MONTSERRAT-REGULAR
}

@media(max-width:768px) {
    .indexNews {
        padding: 35px 0;
        overflow: hidden
    }

    .indexNews .columns {
        display: block
    }

    .indexNews .left {
        width: 100%;
        min-width: 100%;
        margin: 0 50px 0 0
    }

    .indexNews .title {
        padding: 15px 0 30px;
        font-weight: 700;
        font-size: 24px
    }

    .indexNews .left .intro br {
        display: none
    }

    .indexNews .left .text {
        padding: 20px 15px;
        background: linear-gradient(0deg, #00000085, transparent)
    }

    .indexNews .left .Stitle {
        padding: 0 0 5px
    }

    .indexNews .right a {
        padding: 20px 0 !important
    }

    .indexNews .right a:last-child {
        padding-bottom: 0 !important
    }

    .indexNews .right a .image {
        min-width: 150px;
        width: 150px;
        margin: 0 0 0 15px
    }

    .indexNews .right a .text {
        padding: 0
    }

    .indexNews .right a .text .intro {
        margin: 7px 0 10px
    }
}

@media(min-width:768px) {
    .indexNews {
        padding: 5.208333vw 0 6.25vw
    }

    .indexNews .left {
        width: 41.145833vw;
        min-width: 41.145833vw;
        margin: 0 2.604167vw 0 0
    }

    .indexNews .title {
        padding: 1.822917vw 0 3.385417vw
    }

    .indexNews .left .text {
        position: absolute;
        padding: 2.604167vw 2.083333vw
    }

    .indexNews .left .Stitle {
        padding: 0 0 .520833vw
    }

    .indexNews .right a {
        padding: 2.395833vw 0
    }

    .indexNews .right a .image {
        min-width: 11.5625vw;
        width: 11.5625vw
    }

    .indexNews .right a .text {
        padding: 0 2.604167vw 0 0
    }

    .indexNews .right a .text .intro {
        margin: .520833vw 0 1.041667vw
    }
}

@media(min-width:1600px) {
    .indexNews {
        padding: 100px 0 120px
    }

    .indexNews .left {
        width: 790px;
        min-width: 790px;
        margin: 0 50px 0 0
    }

    .indexNews .title {
        padding: 30px 0 60px
    }

    .indexNews .left .text {
        position: absolute;
        padding: 50px 40px
    }

    .indexNews .left .Stitle {
        padding: 0 0 10px
    }

    .indexNews .right a {
        padding: 46px 0
    }

    .indexNews .right a .image {
        min-width: 222px;
        width: 222px
    }

    .indexNews .right a .text {
        padding: 0 50px 0 0
    }

    .indexNews .right a .text .intro {
        margin: 10px 0 20px
    }
}

.indexModule {
    overflow: hidden
}

.indexModule ul {
    display: grid
}

.indexModule ul li a {
    display: block;
    height: 100%;
    position: relative
}

.indexModule ul li a .image {
    height: 100%
}

.indexModule ul li a .image img {
    height: 100%;
    object-fit: cover
}

.indexModule ul li a .text {
    position: absolute;
    display: flex;
    flex-direction: column;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%
}

.indexModule ul li:first-child a .text {
    background: linear-gradient(0deg, #00000070, transparent 40%)
}

.indexModule ul li a .Htitle {
    flex: 1;
    color: #fff;
    font-weight: 500;
    font-family: MONTSERRAT-REGULAR
}

.indexModule ul li a .Stitle {
    font-weight: 500;
    font-size: var(--font-size28);
    color: #fff;
    font-family: MONTSERRAT-REGULAR
}

.indexModule ul li a .intro {
    font-weight: 300;
    font-size: var(--font-size18);
    color: #fff;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.indexModule ul li:first-child {
    grid-row-start: 1;
    grid-row-end: 3
}

.indexModule ul li:nth-child(2) .SeeMore,
.indexModule ul li:nth-child(3) .SeeMore {
    display: none
}

.indexModule ul li .Htitle {
    font-weight: 500;
    font-size: var(--font-size18)
}

.indexModule ul li:nth-child(2) .Htitle,
.indexModule ul li:nth-child(2) .Stitle,
.indexModule ul li:nth-child(2) .intro {
    color: #333
}

.indexModule ul li:nth-child(4) {
    grid-column-start: 4;
    grid-column-end: 2
}

.indexModule ul li .SeeMore {
    border: unset;
    background: rgba(40, 35, 36, .8)
}

.indexModule ul li a:hover .SeeMore {
    background: var(--vi-color)
}

.indexModule ul li:nth-child(2) a:hover .Stitle,
.indexModule ul li:nth-child(3) a:hover .Stitle {
    color: var(--vi-color);
    transition: .2s
}

@media(max-width:768px) {
    .indexModule {
        padding: 35px 0
    }

    .indexModule ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between
    }

    .indexModule ul li a .Stitle {
        padding: 0 0 7px
    }

    .indexModule ul li:nth-child(2),
    .indexModule ul li:nth-child(3) {
        width: calc(50% - 5px)
    }

    .indexModule ul li:nth-child(2) .Stitle,
    .indexModule ul li:nth-child(3) .Stitle {
        padding: 0 0 10px;
        font-size: 16px;
        font-weight: 700
    }

    .indexModule ul li {
        height: auto;
        margin: 0 0 10px
    }

    .indexModule ul li:first-child a .text {
        padding: 20px 15px;
        background: linear-gradient(0deg, #0000008c, transparent 50%)
    }

    .indexModule ul li:first-child {
        height: auto;
        min-height: 100%
    }

    .indexModule ul li .SeeMore {
        margin: 15px 0 0
    }

    .indexModule ul li a .Htitle {
        font-size: 12px
    }

    .indexModule ul li:nth-child(2) .text,
    .indexModule ul li:nth-child(3) .text,
    .indexModule ul li:nth-child(4) .text {
        padding: 20px 15px
    }

    .indexModule ul li a .intro {
        line-height: unset
    }
}

@media(min-width:768px) {
    .indexModule {
        padding: 6.25vw 0 5.729167vw
    }

    .indexModule ul {
        grid-template-columns: 49% 24% 24%;
        grid-gap: 1.241667vw
    }

    .indexModule ul li a .Stitle {
        padding: 0 0 .78125vw
    }

    .indexModule ul li:nth-child(2) .Stitle,
    .indexModule ul li:nth-child(3) .Stitle {
        padding: 0 0 .9375vw
    }

    .indexModule ul li {
        height: 20.052083vw
    }

    .indexModule ul li:first-child a .text {
        padding: 1.770833vw 1.5625vw
    }

    .indexModule ul li:first-child {
        height: 41.145833vw
    }

    .indexModule ul li .SeeMore {
        margin: 1.5625vw 0 0
    }

    .indexModule ul li:nth-child(2) .text,
    .indexModule ul li:nth-child(3) .text {
        padding: 2.083333vw 2.083333vw 2.864583vw
    }

    .indexModule ul li:nth-child(4) .text {
        padding: 1.770833vw
    }
}

@media(min-width:1600px) {
    .indexModule {
        padding: 120px 0 110px
    }

    .indexModule ul {
        grid-template-columns: 49% 24% 24%;
        grid-gap: 20px
    }

    .indexModule ul li a .Stitle {
        padding: 0 0 15px
    }

    .indexModule ul li:nth-child(2) .Stitle,
    .indexModule ul li:nth-child(3) .Stitle {
        padding: 0 0 18px
    }

    .indexModule ul li {
        height: 385px
    }

    .indexModule ul li:first-child a .text {
        padding: 34px 30px
    }

    .indexModule ul li:first-child {
        height: 790px
    }

    .indexModule ul li .SeeMore {
        margin: 30px 0 0
    }

    .indexModule ul li:nth-child(2) .text,
    .indexModule ul li:nth-child(3) .text {
        padding: 40px 40px 55px
    }

    .indexModule ul li:nth-child(4) .text {
        padding: 34px
    }
}

.Mainbottom {
    position: relative
}

.Mainbottom .columns .input {
    position: relative;
    border-radius: 50px;
    overflow: hidden
}

.Mainbottom .columns input {
    font-weight: 300;
    font-size: var(--font-size15);
    color: #434343;
    background: #fff
}

.Mainbottom .columns .input .submit {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--vi-color);
    cursor: pointer
}

.Mainbottom .columns input::-webkit-input-placeholder {
    color: rgba(67, 67, 67, .4)
}

.Mainbottom .columns input:-moz-placeholder {
    color: rgba(67, 67, 67, .4)
}

.Mainbottom .columns input::-moz-placeholder {
    color: rgba(67, 67, 67, .4)
}

.Mainbottom .columns input:-ms-input-placeholder {
    color: rgba(67, 67, 67, .4)
}

.Mainbottom .columns .left dl {
    display: flex;
    align-items: center
}

.Mainbottom .columns .left dl dd a {
    border-radius: 50px
}

.Mainbottom .columns .left dl dd a:hover {
    background: var(--vi-color)
}

.Mainbottom .columns .left dl img {
    width: 100%
}

.Mainbottom .columns .left .intro {
    font-weight: 500;
    font-size: var(--font-size18);
    color: #fff;
    font-family: MONTSERRAT-REGULAR
}

.Mainbottom .columns .right {
    flex: 1
}

.Mainbottom .columns .right ul {
    display: flex;
    justify-content: space-between
}

.Mainbottom .columns .right ul li a {
    font-weight: 400;
    font-size: var(--font-size16);
    color: #7b7f85;
    display: block;
    transition: .3s
}

.Mainbottom .columns .right ul li a:first-child {
    font-size: var(--font-size20);
    color: #fff;
    line-height: 1;
    font-family: MONTSERRAT-REGULAR;
    text-transform: capitalize
}

.Mainbottom .columns .right ul li a:hover {
    color: #fff;
    transition: .3s
}

.Mainbottom .Copyright {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: 1px solid rgba(255, 255, 255, .1)
}

.Mainbottom .Copyright a,
.Mainbottom .Copyright span {
    font-weight: 400;
    font-size: var(--font-size16);
    color: #fff;
    opacity: .7
}

.Mainbottom .Copyright a:hover {
    opacity: 1
}

@media(max-width:768px) {
    .Mainbottom {
        padding: 30px 0
    }

    .Mainbottom .columns .right {
        display: none
    }

    .Mainbottom .columns .left {
        width: 100%;
        text-align: center
    }

    .Mainbottom .columns .left .logo img {
        height: 38px
    }

    .Mainbottom .columns .left .intro {
        padding: 12px 0 16px
    }

    .Mainbottom .columns input {
        padding: 0 20px;
        height: 37px
    }

    .Mainbottom .columns .input .submit {
        width: 55px
    }

    .Mainbottom .columns .input .submit img {
        width: 15px
    }

    .Mainbottom .columns .left dl {
        margin: 18px 0 10px;
        justify-content: center
    }

    .Mainbottom .columns .left dl dd a {
        width: 32px;
        display: block;
        border: 1px solid rgba(255, 255, 255, .3);
        margin: 0 5px
    }

    .Mainbottom .columns .left dl dd a:hover {
        border: 1px solid rgba(255, 255, 255, 0)
    }

    .Mainbottom .Copyright {
        border-top: 0;
        display: block
    }

    .Mainbottom .Copyright a,
    .Mainbottom .Copyright span {
        font-size: 12px
    }
}

@media(min-width:768px) {
    .Mainbottom .columns {
        padding: 3.75vw 0 5.208333vw
    }

    .Mainbottom .columns input {
        width: 18.90625vw;
        height: 2.239583vw;
        padding: 0 1.197917vw
    }

    .Mainbottom .columns .input .submit {
        width: 3.541667vw
    }

    .Mainbottom .columns .input .submit img {
        width: .989583vw;
        margin: 0 .260417vw 0 0
    }

    .Mainbottom .columns .left .logo img {
        height: 2.760417vw
    }

    .Mainbottom .columns .left {
        width: 18.90625vw;
        min-width: 18.90625vw
    }

    .Mainbottom .columns .left dl {
        margin: 1.302083vw 0 0
    }

    .Mainbottom .columns .left dl dd a {
        width: 2.552083vw;
        display: block;
        border: .104167vw solid rgba(255, 255, 255, .3);
        margin: 0 .520833vw 0 0
    }

    .Mainbottom .columns .left dl dd a:hover {
        border: .104167vw solid rgba(255, 255, 255, 0)
    }

    .Mainbottom .columns .left .intro {
        padding: 1.041667vw 0
    }

    .Mainbottom .columns .right {
        margin: 0 0 0 9.21875vw
    }

    .Mainbottom .columns .right ul li:not(:last-child) {
        margin: 0 2.604167vw 0 0
    }

    .Mainbottom .columns .right ul li a:not(:last-child) {
        margin: 0 0 .78125vw
    }

    .Mainbottom .columns .right ul li a:first-child {
        margin: 1.302083vw 0 1.458333vw
    }

    .Mainbottom .Copyright {
        padding: 2.34375vw 0 2.083333vw
    }

    .Mainbottom .Copyright span {
        margin: 0 .260417vw
    }
}

@media(min-width:1600px) {
    .Mainbottom .columns {
        padding: 72px 0 100px
    }

    .Mainbottom .columns input {
        width: 363px;
        height: 43px;
        padding: 0 23px
    }

    .Mainbottom .columns .input .submit {
        width: 68px
    }

    .Mainbottom .columns .input .submit img {
        width: 19px;
        margin: 0 5px 0 0
    }

    .Mainbottom .columns .left {
        width: 363px;
        min-width: 363px
    }

    .Mainbottom .columns .left .logo img {
        height: 53px;
        object-fit: contain;
    }

    .Mainbottom .columns .left dl {
        margin: 25px 0 0
    }

    .Mainbottom .columns .left .link {
        background-color: var(--vi-color);
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 50px;
        color: #fff;
        padding: 10px 20px;
        width: fit-content;
        margin-top: 20px;
        border: 2px solid var(--vi-color);
        transition: .3s
    }

    .Mainbottom .columns .left .link:hover {
        background-color: transparent
    }

    .Mainbottom .columns .left dl dd a {
        width: 49px;
        display: block;
        border: 2px solid rgba(255, 255, 255, .3);
        margin: 0 10px 0 0
    }

    .Mainbottom .columns .left dl dd a:hover {
        border: 2px solid rgba(255, 255, 255, 0)
    }

    .Mainbottom .columns .left .intro {
        padding: 20px 0
    }

    .Mainbottom .columns .right {
        margin: 0 0 0 177px
    }

    .Mainbottom .columns .right ul li:not(:last-child) {
        margin: 0 50px 0 0
    }

    .Mainbottom .columns .right ul li a:not(:last-child) {
        margin: 0 0 15px
    }

    .Mainbottom .columns .right ul li a:first-child {
        margin: 25px 0 28px
    }

    .Mainbottom .Copyright {
        padding: 45px 0 40px
    }

    .Mainbottom .Copyright a,
    .Mainbottom .Copyright span {
        margin: 0 5px
    }
}

.bannerInner {
    position: relative;
    z-index: 7
}

.bannerInner .images video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover
}

.bannerInner .images img {
    animation: 8s linear infinite amplify;
    -webkit-animation: 8s infinite amplify
}

.bannerInner .text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center
}

.bannerInner .text .title {
    font-size: var(--font-size64);
    color: #fff
}

.bannerInner .text .intro {
    font-size: var(--font-size18);
    color: #fff
}

.bannerInner .mouse {
    position: absolute;
    width: 100%;
    text-align: center
}

.bannerInner .mouse .icon img {
    margin: auto
}

.bannerInner .mouse .icon:nth-child(2) {
    animation: 6s infinite float;
    -webkit-animation: 6s infinite float
}

.microinverter .bannerInner .text .title {
    font-size: 56px
}

.microinverter .bannerInner .text .intro {
    font-size: 40px;
    margin-top: 1em;
    padding-top: 0
}

.banner_title {
    font-family: Catamaran-Regular;
    font-weight: 700
}

.module1 {
    margin-top: 87px
}

.module1 .title {
    font-weight: 700;
    font-size: 45px;
    color: #333;
    line-height: 1.5;
    text-align: center;
    margin-bottom: 36px;
    padding-bottom: 25px;
    position: relative
}

.module1 .title::before {
    position: absolute;
    left: 50%;
    content: ' ';
    width: 100px;
    height: 3px;
    background-color: #fb7d20;
    bottom: 0;
    transform: translateX(-50%)
}

.module1 .text_content {
    font-weight: 400;
    font-size: 18px;
    color: #333;
    line-height: 1.7;
    text-align: center
}

.module1 .text_content p:nth-child(2) {
    margin-top: 30px
}

.module1 .link {
    text-align: center;
    width: 150px;
    height: 40px;
    background: #f77f30;
    border-radius: 20px;
    font-weight: 400;
    font-size: 14px;
    color: #fff;
    line-height: 40px;
    display: block;
    margin: 40px auto 0
}

.module2 {
    margin-top: 100px;
    margin-bottom: 113px
}

.module2 li {
    display: flex;
    justify-content: space-between;
    margin-bottom: 50px;
    align-items: center
}

.module2 li:nth-child(2n) {
    flex-direction: row-reverse
}

.module2 .info {
    width: 47%;
    position: relative;
    padding-left: 15px
}

.module2 li .info::before {
    position: absolute;
    left: 0;
    content: ' ';
    width: 5px;
    height: 45px;
    background-color: #fb7d20;
    bottom: 8px
}

.module2 li:nth-child(2n) .info {
    padding-left: 0;
    padding-right: 15px
}

.module2 li:nth-child(2n) .info::before {
    left: auto;
    right: 0
}

.module2 .info .title {
    font-weight: 700;
    font-size: 34px;
    color: #f67f2f;
    font-family: Catamaran-Regular
}

.module2 .info .content {
    white-space: pre-line;
    margin-top: 22px;
    font-weight: 400;
    font-size: 16px;
    color: #333;
    line-height: 30px
}

.module2 .info .content p {
    display: inline-block;
    text-align: justify
}

.module2 .info .link {
    background: #f77f30;
    border-radius: 20px;
    font-weight: 400;
    font-size: 14px;
    color: #fff;
    padding: 10px 30px;
    display: inline-block;
    margin-top: 15px
}

.module2 .video_warp {
    position: relative;
    padding-bottom: 26%;
    width: 47%;
    border-radius: 20px;
    overflow: hidden
}

.module2 .video_warp img,
.module2 .video_warp video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover
}

.introduce_warp {
    background-color: #f2f6fb
}

.introduce_warp .title {
    font-weight: 700;
    font-size: 45px;
    text-align: center;
    width: 70%;
    margin: 0 auto 28px;
    position: relative;
    line-height: 1.5;
    padding-bottom: 25px;
    padding-top: 5%
}

.introduce_warp .title::before {
    position: absolute;
    left: 50%;
    content: ' ';
    width: 100px;
    height: 3px;
    background-color: #fb7d20;
    bottom: 0;
    transform: translateX(-50%)
}

.introduce_warp .text_warp {
    white-space: pre-line;
    text-align: center;
    margin: 0 auto 60px;
    font-weight: 400;
    font-size: 18px;
    color: #333;
    line-height: 30px
}

.introduce ul {
    display: flex;
    justify-content: space-evenly
}

.introduce ul li {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    max-width: 32%
}

.introduce ul li img {
    max-width: 100%;
    height: auto
}

.introduce ul li p {
    margin-top: 28px;
    font-weight: 400;
    font-size: 22px;
    color: #333;
    text-align: center
}

.introduce .link {
    background: #f77f30;
    border-radius: 20px;
    font-weight: 400;
    font-size: 14px;
    color: #fff;
    padding: 10px 30px;
    display: block;
    width: 152px;
    margin: 58px auto 70px
}

.introduce.video_warp {
    position: relative;
    padding-bottom: 40%;
    width: 72vw;
    border-radius: 20px;
    overflow: hidden
}

.introduce.video_warp video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover
}

.recommend_warp {
    background-color: #f67f2f;
    padding: 0 0 80px;
    margin-top: 150px
}

.about_icon_warp {
    background-color: #1a5287;
    padding: 0 0 80px;
    margin-top: 150px
}

.recommend_warp .title {
    font-weight: 700;
    font-size: 45px;
    color: #fff
}

.recommend_warp ul {
    display: flex;
    justify-content: space-between;
    align-items: start;
    margin-top: 50px
}

.recommend_warp ul li {
    width: 32%
}

.easy .recommend_warp ul li {
    width: 24%
}

.recommend_warp ul .video_warp {
    position: relative;
    width: 100%;
    padding-bottom: 67%;
    border-radius: 20px;
    overflow: hidden
}

.recommend_warp ul .video_warp img,
.recommend_warp ul .video_warp video {
    transition: .3s;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover
}

.about_icon_warp ul {
    flex-wrap: wrap;
    margin-top: 0
}

.about_icon_warp ul .video_warp {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40%;
    padding-bottom: 40%
}

.about_icon_warp ul .video_warp img {
    max-width: 120px;
    margin: 0 auto;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    height: auto
}

.about_icon_warp ul .content_warp {
    width: 100%
}

.about_icon_warp ul .content_warp p {
    margin-top: 0
}

.recommend_warp ul li p {
    font-weight: 400;
    font-size: 22px;
    color: #fff;
    line-height: 40px;
    padding: 0 5%;
    text-align: center
}

.recommend_warp.recommend_product {
    background-color: #fff;
    margin-top: 0
}

.recommend_warp.recommend_product .title {
    color: #333
}

.recommend_warp.recommend_product img {
    transition: .3s
}

.recommend_warp.recommend_product li .video_warp:hover img {
    transform: scale(1.1)
}

.recommend_warp.recommend_product li p:hover a {
    color: #f77f30
}

.tsun {
    padding-top: 93px;
    padding-bottom: 76px;
    text-align: center
}

.tsun .title {
    margin-bottom: 30px;
    padding-bottom: 15px;
    line-height: 1.5;
    position: relative
}

.tsun .title::before {
    position: absolute;
    left: 50%;
    content: ' ';
    width: 100px;
    height: 3px;
    background-color: #fb7d20;
    bottom: 0;
    transform: translateX(-50%)
}

.tsun .content {
    font-weight: 400;
    font-size: 18px;
    color: #333;
    width: 75%;
    margin: 0 auto;
    line-height: 1.7
}

.tsun .link {
    background: #f77f30;
    border-radius: 20px;
    font-weight: 400;
    font-size: 14px;
    color: #fff;
    padding: 10px 30px;
    display: block;
    width: 152px;
    margin: 46px auto 0
}

@media(max-width:768px) {
    .bannerInner .images img {
        height: 250px;
        object-fit: cover
    }

    .bannerInner .mouse {
        display: none
    }

    .bannerInner .text .intro {
        padding: 10px 0 0
    }
}

@media(min-width:768px) {
    .bannerInner .text .title span:nth-child(2) {
        color: rgba(255, 255, 255, 0);
        text-stroke: 1px #FFFFFF;
        -webkit-text-stroke: 1px #FFFFFF;
        font-size: var(--font-size64)
    }

    .bannerInner .text .intro {
        padding: .520833vw 0 0
    }

    .bannerInner .mouse {
        bottom: 1.666667vw
    }

    .bannerInner .mouse .icon:first-child {
        margin: 0 0 2.864583vw;
        width: auto;
        height: auto;
        display: block
    }

    .bannerInner .mouse .icon:nth-child(2) img {
        width: .989583vw
    }

    @-webkit-keyframes float {

        0%,
        to {
            -webkit-transform: translate3d(0, -1.041667vw, 0);
            transform: translate3d(0, -1.041667vw, 0)
        }

        50% {
            -webkit-transform: none;
            transform: none
        }
    }

    @keyframes float {

        0%,
        to {
            -webkit-transform: translate3d(0, -1.041667vw, 0);
            transform: translate3d(0, -1.041667vw, 0)
        }

        50% {
            -webkit-transform: none;
            transform: none
        }
    }
}

@media(min-width:1600px) {
    .bannerInner .text .intro {
        padding: 10px 0 0
    }

    .bannerInner .mouse {
        bottom: 32px
    }

    .bannerInner .mouse .icon:first-child {
        margin: 0 0 55px;
        width: auto;
        height: auto;
        display: block
    }

    .bannerInner .mouse .icon:nth-child(2) img {
        width: 19px
    }

    @-webkit-keyframes float {

        0%,
        to {
            -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0)
        }

        50% {
            -webkit-transform: none;
            transform: none
        }
    }

    @keyframes float {

        0%,
        to {
            -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0)
        }

        50% {
            -webkit-transform: none;
            transform: none
        }
    }
}

.TopColumn {
    position: sticky;
    top: -1px;
    z-index: 4;
    background: #fff;
    transition: 1s;
    border-top: 1px solid #f7f7f7;
    margin: -1px 0 0
}

.TopColumn ul {
    display: flex;
    width: 100%;
    overflow: auto
}

.TopColumn ul li {
    min-width: max-content
}

.TopColumn ul::-webkit-scrollbar {
    height: 2px;
    background-color: #dfdfdf
}

.TopColumn ul::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, .1);
    border-radius: 6px;
    background-color: #dfdfdf
}

.TopColumn ul::-webkit-scrollbar-thumb {
    border-radius: 2px;
    -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, .1);
    background: var(--vi-color)
}

.TopColumn ul li a {
    font-size: var(--font-size16);
    color: #3b3b3b;
    display: block;
    min-width: max-content;
    position: relative;
    font-family: MONTSERRAT-REGULAR
}

.TopColumn ul li.on a {
    background: var(--vi-color);
    color: #fff
}

.TopColumn ul li:not(:last-child) a::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #f5f7f9
}

.TopColumn ul li a:hover::after,
.TopColumn ul li.on a::after {
    display: none
}

.Product {
    background: #f2f4f5
}

.Product .columns {
    align-items: flex-start
}

.Product .left {
    position: sticky
}

.Product .left a {
    display: block;
    font-weight: 500;
    font-size: var(--font-size14);
    border-radius: 50px
}

.Product .left .on a {
    background: var(--vi-color);
    color: #fff;
    font-family: MONTSERRAT-REGULAR
}

.Product .left a:hover {
    background: var(--vi-color);
    color: #fff
}

.Product .right {
    border-left: 1px dashed rgba(212, 215, 217, .5);
    flex: 1
}

.Product .right dl {
    display: flex;
    flex-wrap: wrap;
    width: 100%
}

.Product .right dl .swiper {
    width: 100%
}

.Product .right dl dt {
    font-weight: 600;
    font-size: var(--font-size38);
    color: #333;
    width: 100%
}

.Product .right dl dd {
    background: #fff;
    text-align: center
}

.Product .right .image {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding-bottom: 57%
}

.Product .right .image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    position: absolute;
    left: 0;
    top: 0
}

.Product .right .title {
    font-size: var(--font-size19);
    color: #3b3b3b;
    display: block
}

.Product .right .intro {
    font-weight: 400;
    font-size: var(--font-size14);
    color: #3b3b3b;
    opacity: .6
}

.Product .right .SeeMore {
    color: var(--vi-color);
    font-size: var(--font-size12);
    border: 2px solid rgba(255, 255, 255, 0)
}

.Product .right dd a:hover .SeeMore {
    color: #fff;
    background: var(--vi-color)
}

.Product .right dd a:hover .SeeMore img {
    filter: grayscale(100%) brightness(500%)
}

@media(max-width:768px) {
    .TopColumn {
        position: unset;
        border-top: 0 solid #f7f7f7
    }

    .TopColumn ul {
        padding: 0 0 5px;
        margin: 0 0 5px
    }

    .TopColumn ul li a {
        padding: 10px 25px
    }

    .Product {
        padding: 35px 0 0
    }

    .Product .columns {
        display: block
    }

    .Product .left {
        min-width: 318px;
        width: 318px;
        top: 150px;
        display: none
    }

    .Product .left a {
        width: 247px;
        padding: 14px 30px;
        margin: 0 0 20px
    }

    .Product .right {
        padding: 0;
        border-left: 0 dashed rgba(212, 215, 217, .5)
    }

    .Product .right dl dt {
        margin: 0 0 20px;
        line-height: unset
    }

    .Product .right dl dd {
        width: 100%;
        margin: 0 0 20px
    }

    .Product .right dl:not(:last-child) {
        margin: 0 0 15px
    }

    .Product .right dl dd:nth-child(3n+1) {
        margin-right: 0
    }

    .Product .right .image {
        height: 200px
    }

    .Product .right .text {
        padding: 0 20px 30px
    }

    .Product .right .title {
        padding: 0 0 15px
    }

    .Product .right .SeeMore {
        margin: 20px auto 0;
        color: #fff;
        background: var(--vi-color)
    }

    .Product .right .SeeMore img {
        width: 12px;
        filter: grayscale(100%) brightness(500%)
    }
}

@media(min-width:768px) {
    .TopColumn ul li a:hover {
        background: var(--vi-color);
        color: #fff
    }

    .TopColumn ul li a {
        padding: 1.563vw 2.083333vw
    }

    .Product {
        padding: 4.583333vw 0
    }

    .Product .left {
        min-width: 16.5625vw;
        width: 16.5625vw;
        top: 7.8125vw
    }

    .Product .left a {
        width: 15.104167vw;
        padding: .729167vw 1.5625vw;
        margin: 0 0 1.041667vw
    }

    .Product .right {
        padding: 0 0 0 4.947917vw
    }

    .Product .right dl dt {
        margin: 0 0 1.822917vw
    }

    .Product .right dl dd {
        width: calc(33.33% - .416667vw);
        margin: 0 .625vw .625vw 0
    }

    .Product .right dl:not(:last-child) {
        margin: 0 0 3.385417vw
    }

    .Product .right dl dd:nth-child(3n+1) {
        margin-right: 0
    }

    .Product .right .image {
        height: 14.84375vw
    }

    .Product .right .text {
        padding: 0 2.604167vw 1.5625vw
    }

    .Product .right .title {
        padding: 0 0 .78125vw
    }

    .Product .right .SeeMore {
        margin: 2.083333vw auto 0
    }

    .Product .right .SeeMore img {
        width: .729vw
    }
}

@media(min-width:1600px) {
    .TopColumn ul li a {
        padding: 30px 40px
    }

    .TopColumn ul li a::after {
        width: 2px;
        height: 24px
    }

    .Product {
        padding: 88px 0
    }

    .Product .left {
        min-width: 318px;
        width: 318px;
        top: 150px
    }

    .Product .left a {
        width: 290px;
        padding: 14px 30px;
        margin: 0 0 20px
    }

    .Product .right {
        padding: 0 0 0 95px
    }

    .Product .right dl dt {
        margin: 0 0 35px
    }

    .Product .right dl dd {
        width: calc(33.33% - 8px);
        margin: 0 12px 12px 0
    }

    .Product .right dl:not(:last-child) {
        margin: 0 0 65px
    }

    .Product .right dl dd:nth-child(3n+1) {
        margin-right: 0
    }

    .Product .right .image {
        height: 285px
    }

    .Product .right .text {
        padding: 0 50px 30px
    }

    .Product .right .title {
        padding: 0 0 15px
    }

    .Product .right .SeeMore {
        margin: 40px auto 0
    }

    .Product .right .SeeMore img {
        width: 14px
    }
}

.bannerDetails {
    position: relative
}

.bannerDetails .text {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.bannerDetails .text .title {
    font-size: var(--font-size50);
    color: #333
}

.bannerDetails .text .title span {
    margin: 0;
    font-family: unset;
    font-weight: 600
}

.bannerDetails .text .intro {
    font-weight: 400;
    font-size: var(--font-size16);
    color: #333;
    line-height: 1.4;
    opacity: .8
}

.bannerDetails .text .number {
    font-weight: 800;
    font-size: var(--font-size20);
    color: #333;
    padding-bottom: 10px
}

.bannerDetails .text .image {
    flex: 1;
    overflow: unset;
    display: flex;
    align-items: center;
    justify-content: center
}

.bannerDetails .text .image img {
    width: auto
}

.bannerDetails .text .button {
    display: flex
}

.bannerDetails .text .button a {
    background: rgba(252, 108, 15, 0);
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: var(--font-size14);
    color: var(--vi-color);
    transition: .3s
}

.bannerDetails .text .button a:hover {
    color: #fff;
    background: var(--vi-color);
    transition: .3s
}

.bannerDetails .text .button a:hover img {
    filter: grayscale(100%) brightness(500%)
}

.Highlights .title {
    font-size: var(--font-size45);
    color: #333
}

.Highlights ul {
    display: flex;
    text-align: center;
    flex-wrap: wrap
}

.Highlights ul li {
    background: #f5f7f9
}

.Highlights ul li .intro {
    font-weight: 600;
    font-size: var(--font-size18);
    color: #333;
    line-height: 1.3
}

@media(max-width:768px) {
    .bannerDetails .images img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        object-fit: cover
    }

    .bannerDetails .text {
        position: unset;
        padding: 35px 0
    }

    .bannerDetails .text .title {
        padding: 0 0 20px
    }

    .bannerDetails .columns {
        display: block
    }

    .bannerDetails .text .left {
        max-width: 100%;
        width: 100%
    }

    .bannerDetails .text .image {
        padding: 30px 0 10px;
        margin: 0;
        overflow: hidden
    }

    .bannerDetails .text .image img {
        -webkit-box-reflect: unset
    }

    .bannerDetails .text .button {
        margin: 25px 0 0
    }

    .bannerDetails .text .button a {
        width: 50%;
        height: 34px;
        border: 1px solid var(--vi-color);
        margin: 0 15px 0 0
    }

    .bannerDetails .text .button a:nth-child(2) {
        width: 50%
    }

    .bannerDetails .text .button a img {
        margin: 0 10px 0 0
    }

    .bannerDetails .text .button a:first-child img {
        width: 15px
    }

    .bannerDetails .text .button a:nth-child(2) img {
        width: 12px
    }

    .Highlights {
        padding: 35px 0 15px
    }

    .Highlights .title {
        padding: 0 0 20px
    }

    .Highlights ul li .intro br {
        display: none
    }

    .Highlights ul li {
        width: 100%;
        margin: 0 0 20px;
        padding: 20px 15px
    }

    .Highlights ul li:nth-child(3n) {
        margin-right: 0
    }

    .Highlights ul li .icon img {
        width: 50px;
        margin: 0 0 10px
    }
}

@media(min-width:768px) {
    .bannerDetails .text .title {
        padding: 0 0 1.041667vw
    }

    .bannerDetails .text .left {
        max-width: 33.291667vw;
        width: 33.291667vw
    }

    .bannerDetails .text .image {
        padding: 0 0 0 7.8125vw;
        margin: 0 0 -4.427083vw
    }

    .bannerDetails .text .image img {
        max-height: 20.833333vw
    }

    .bannerDetails .text .button {
        margin: 2.604167vw 0 0
    }

    .bannerDetails .text .button a {
        width: 9.166667vw;
        height: 2.96875vw;
        border: .104167vw solid var(--vi-color);
        margin: 0 .78125vw 0 0
    }

    .bannerDetails .text .button a:nth-child(2) {
        width: 9.895833vw
    }

    .bannerDetails .text .button a img {
        margin: 0 .677083vw 0 0
    }

    .bannerDetails .text .button a:first-child img {
        width: 1.145833vw
    }

    .bannerDetails .text .button a:nth-child(2) img {
        width: .989583vw
    }

    .Highlights {
        padding: 4.166667vw 0 5.729167vw
    }

    .Highlights .title {
        padding: 0 0 2.864583vw
    }

    .Highlights ul li {
        width: calc(33.33% - (2.604167vw / 3));
        margin: 0 1.302083vw 1.302083vw 0;
        padding: 1.5625vw 2.604167vw 2.604167vw
    }

    .Highlights ul li:nth-child(3n) {
        margin-right: 0
    }

    .Highlights ul li .icon img {
        width: 4.6875vw;
        margin: 0 0 1.875vw
    }
}

@media(min-width:1600px) {
    .bannerDetails .text .image img {
        max-height: 400px
    }

    .bannerDetails .text .title {
        padding: 0 0 20px
    }

    .bannerDetails .text .left {
        max-width: 650px;
        width: 650px
    }

    .bannerDetails .text .image {
        padding: 0 0 0 150px;
        margin: 0 0 -85px
    }

    .bannerDetails .text .button {
        margin: 50px 0 0
    }

    .bannerDetails .text .button a {
        width: 176px;
        height: 57px;
        border: 2px solid var(--vi-color);
        margin: 0 15px 0 0
    }

    .bannerDetails .text .button a:nth-child(2) {
        width: 190px
    }

    .bannerDetails .text .button a img {
        margin: 0 13px 0 0
    }

    .bannerDetails .text .button a:first-child img {
        width: 22px
    }

    .bannerDetails .text .button a:nth-child(2) img {
        width: 19px
    }

    .Highlights {
        padding: 80px 0 110px
    }

    .Highlights .title {
        padding: 0 0 55px
    }

    .Highlights ul li {
        width: calc(33.33% - (50px / 3));
        margin: 0 25px 25px 0;
        padding: 30px 50px 50px
    }

    .Highlights ul li:nth-child(3n) {
        margin-right: 0
    }

    .Highlights ul li .icon img {
        width: 90px;
        margin: 0 0 36px
    }
}

.Technical {
    position: relative;
    background: #fefefe
}

.Technical .title {
    font-size: var(--font-size45);
    color: #333
}

.Technical .table {
    background: rgba(255, 255, 255, .05);
    border: 1px solid;
    background: rgb(255, 255, 255, .18);
    backdrop-filter: blur(10px)
}

.Technical table {
    max-width: 100%
}

.Technical table tr td {
    font-size: var(--font-size16);
    color: #fff;
    border: 0 solid #ccc;
    border-right: 1px solid rgba(0, 0, 0, .3);
    border-bottom: 1px solid rgba(0, 0, 0, .3)
}

.Technical table tr td:not(:first-child) {
    text-align: center
}

.Technical table tr td:last-child {
    border-right: 0px solid rgba(255, 255, 255, .3)
}

.Technical table.video_table tr:first-child td {
    font-weight: 600
}

.Technical table.video_table:first-child tr {
    display: flex;
    flex-direction: column;
    height: auto !important
}

.Technical table.video_table:first-child tr td {
    width: 100% !important;
    height: auto !important
}

.Technical table.video_table:first-child col {
    width: 100% !important
}

.Technical table.video_table:first-child tr iframe {
    min-height: 200px
}

@media(max-width:768px) {
    .Technical {
        padding: 35px 0
    }

    .Technical .title {
        padding: 0 0 20px
    }

    .Technical .table {
        padding: 20px;
        border-radius: 10px;
        box-shadow: 0 0 43px 0 rgba(59, 59, 59, .1)
    }

    .Technical .table>div {
        overflow: auto
    }

    .Technical table {
        width: 700px
    }

    .Technical table tr:first-child td {
        padding: 12px 0
    }

    .Technical table tr td {
        padding: 16px 0;
        width: auto
    }
}

@media(min-width:768px) {
    .Technical {
        padding: 5.208333vw 0 5.729167vw
    }

    .Technical .title {
        padding: 0 0 3.90625vw
    }

    .Technical .table {
        padding: 2.96875vw 4.010417vw 3.854167vw;
        border-radius: 1.041667vw;
        box-shadow: 0 0 2.239583vw 0 rgba(59, 59, 59, .1)
    }

    .Technical table tr:first-child td {
        padding: .625vw 0
    }

    .Technical table tr td {
        padding: .833333vw 0;
        width: auto
    }
}

@media(min-width:1600px) {
    .Technical {
        padding: 50px 0 110px
    }

    .Technical .title {
        padding: 0 0 75px
    }

    .Technical .table {
        padding: 57px 77px 74px;
        border-radius: 20px;
        box-shadow: 0 0 43px 0 rgba(59, 59, 59, .1)
    }

    .Technical table tr:first-child td {
        padding: 12px 0
    }

    .Technical table tr td {
        padding: 16px 0
    }
}

.Product1 .right {
    padding: 0;
    border-left: unset;
    width: 100%
}

.Product1 .right dl dt {
    font-size: var(--font-size45);
    line-height: 1
}

.Product1 .right .title {
    font-size: var(--font-size22);
    min-height: 5em
}

.Product1 .right .intro {
    font-size: var(--font-size16)
}

.Product1 .swiper-pagination-bullet-active {
    background: var(--vi-color)
}

@media(max-width:768px) {
    .Product1 {
        padding: 35px 0 30px
    }

    .Product1 .swiper-container-horizontal>.swiper-pagination-bullets,
    .Product1 .swiper-pagination-custom,
    .swiper-pagination-fraction {
        bottom: 24px
    }

    .Product1 .right dl dd {
        margin: 0 20px 0 0 !important
    }

    .Product1 .right .text {
        padding: 10px 20px 60px
    }

    .Product1 .swiper-pagination-bullet {
        width: 8px;
        height: 8px
    }
}

@media(min-width:768px) {
    .Product1 {
        padding: 4.6875vw 0 5.208333vw
    }

    .Product1 .right .title {
        padding: 0 0 1.302083vw
    }

    .Product1 .right .SeeMore {
        margin: 3.125vw auto 0;
        font-size: var(--font-size13)
    }

    .Product1 .right .SeeMore img {
        width: .833333vw
    }

    .Product1 .right .text {
        padding: 1vw 2.604167vw 2.083333vw
    }

    .Product1 .right dl dd {
        width: calc(33.33% - .833333vw);
        margin: 0 .833333vw .833333vw 0 !important
    }

    .Product1 .right dl dt {
        margin: 0 0 4.166667vw
    }

    .Product1 .swiper-container-horizontal>.swiper-pagination-bullets,
    .Product1 .swiper-pagination-custom,
    .swiper-pagination-fraction {
        bottom: 1.25vw
    }

    .Product1 .swiper-pagination-bullet {
        width: .416667vw;
        height: .416667vw
    }

    .Solar.solarwhite .text .intro,
    .Solar.solarwhite .text .title {
        color: #fff
    }
}

@media(min-width:1600px) {
    .Product1 {
        padding: 90px 0 100px
    }

    .Product1 .right .title {
        padding: 0 0 25px
    }

    .Product1 .right .SeeMore {
        margin: 0 auto;
        font-size: var(--font-size13)
    }

    .Product1 .right .SeeMore img {
        width: 16px
    }

    .Product1 .right .text {
        padding: 20px 50px 40px
    }

    .Product1 .right dl dd {
        width: calc(33.33% - 16px);
        margin: 0 16px 16px 0 !important
    }

    .Product1 .right dl dt {
        margin: 0 0 80px
    }

    .Product1 .swiper-container-horizontal>.swiper-pagination-bullets,
    .Product1 .swiper-pagination-custom,
    .swiper-pagination-fraction {
        bottom: 24px
    }

    .Product1 .swiper-pagination-bullet {
        width: 8px;
        height: 8px
    }
}

.Solar {
    position: relative
}

.Solar .text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%
}

.Solar .text .title {
    font-size: var(--font-size56);
    color: #333;
    line-height: 1.2;
    max-width: 60%
}

.Solar .text .intro {
    font-size: var(--font-size18);
    color: #666;
    line-height: 1.4;
    max-width: 52%
}

@media(max-width:768px) {
    .Solar .text {
        padding: 30px 0;
        position: unset;
        background: #fbfbfb
    }

    .Solar .text .title {
        padding: 0 0 20px;
        max-width: 100%;
        line-height: unset
    }

    .Solar .text .title br {
        display: none
    }

    .Solar .text .intro {
        max-width: 100%
    }
}

@media(min-width:768px) {
    .Solar .text {
        padding: 6.770833vw 0
    }

    .Solar .text .title {
        padding: 0 0 1.041667vw;
        max-width: 100%
    }
}

@media(min-width:1200px) {
    .Solar .text .title {
        max-width: 60%
    }
}

@media(min-width:1600px) {
    .Solar .text {
        padding: 130px 0
    }

    .Solar .text .title {
        padding: 0 0 20px
    }
}

.features .title {
    font-weight: 600;
    font-size: var(--font-size45);
    color: #333
}

.features ul {
    display: grid
}

.features ul li {
    position: relative
}

.features ul li .image {
    height: 100%
}

.features ul li .image img {
    height: 100%;
    object-fit: cover
}

.features ul li:first-child {
    grid-row-start: 1;
    grid-row-end: 3
}

.features ul li .text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column
}

.features ul li .text .icon {
    flex: 1;
    width: 100%;
    text-align: right
}

.features ul li .text span {
    font-weight: 600;
    font-size: var(--font-size73);
    color: rgba(255, 255, 255, 0);
    text-stroke: 1px #FFFFFF;
    opacity: .3;
    -webkit-text-stroke: 1px #FFFFFF
}

.features ul li .text .intro {
    font-size: var(--font-size22);
    color: #fff;
    font-family: MONTSERRAT-REGULAR
}

@media(max-width:768px) {
    .features {
        padding: 35px 0
    }

    .features .title {
        padding: 0 0 20px
    }

    .features ul {
        display: grid;
        grid-template-columns: auto;
        grid-gap: 20px
    }

    .features ul li {
        grid-row-start: unset !important;
        grid-row-end: unset !important
    }

    .features ul li .image img {
        height: 200px
    }

    .features ul li .text .intro {
        min-height: 60px;
        margin: 10px 0 0
    }

    .features ul li .text .intro br {
        display: none
    }

    .features ul li .text .icon {
        padding: 25px 35px 0
    }

    .features ul li .text .icon img {
        width: 40px
    }

    .features ul li .text .list {
        padding: 0 20px 20px
    }
}

@media(min-width:768px) {
    .features {
        padding: 4.166667vw 0 5.729167vw
    }

    .features .title {
        padding: 0 0 2.604167vw
    }

    .features ul {
        display: grid;
        grid-template-columns: 27.083333vw 27.083333vw 27.083333vw;
        grid-gap: 1.041667vw
    }

    .features ul li .text .intro {
        min-height: 3.125vw
    }

    .features ul li .text .icon {
        padding: 1.302083vw 1.822917vw 0
    }

    .features ul li .text .icon img {
        width: 3.489583vw
    }

    .features ul li .text .list {
        padding: 0 2.34375vw 1.5625vw
    }
}

@media(min-width:1600px) {
    .features {
        padding: 80px 0 110px
    }

    .features .title {
        padding: 0 0 50px
    }

    .features ul {
        display: grid;
        grid-template-columns: auto auto auto;
        grid-gap: 20px
    }

    .features ul li .text .intro {
        min-height: 60px
    }

    .features ul li .text .icon {
        padding: 25px 35px 0
    }

    .features ul li .text .icon img {
        width: 67px
    }

    .features ul li .text .list {
        padding: 0 45px 30px
    }
}

.Downloads {
    background: #f2f4f5
}

.Downloads .left dt,
.Downloads .left span {
    font-weight: 600;
    font-size: var(--font-size22);
    color: #333;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer
}

.Downloads .left dl {
    display: none
}

.Downloads .left dt i {
    font-size: var(--font-size16);
    color: rgba(51, 51, 51, .5);
    font-weight: 600;
    transition: .3s
}

.Downloads .left .on dt i {
    transform: rotate(180deg);
    transition: .3s
}

.Downloads .left dd .layui-form-radio>* {
    font-weight: 400;
    font-size: var(--font-size14);
    color: #333;
    line-height: 1.5;
    padding: 5px 0
}

.Downloads .left dd .layui-form-radio {
    margin: 0;
    width: 100%
}

.Downloads .left dd .layui-form-radio:hover>* {
    color: var(--vi-color)
}

.Downloads .left dd .layui-icon-circle:before {
    content: "";
    background: #dedfe1;
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center
}

.Downloads .left dd .layui-form-radioed .layui-icon-circle:before {
    background: url('../images/55.png') center/100% 100% no-repeat #fc6c0f
}

.Downloads .left dd .layui-form-radioed.layui-form-radio>* {
    color: var(--vi-color)
}

.Downloads .layui-form-checkbox[lay-skin=primary]>i {
    width: 12px;
    height: 12px;
    font-size: 8px;
    line-height: 10px;
    transform: translateY(-50%);
    top: 46%
}

.Downloads .layui-form-checked[lay-skin=primary]>i {
    border-color: var(--vi-color) !important;
    background-color: var(--vi-color)
}

.Downloads .layui-form-checkbox[lay-skin=primary]:hover>i {
    border-color: var(--vi-color)
}

.Downloads .layui-form-checkbox[lay-skin=primary]>div {
    font-weight: 400;
    font-size: var(--font-size14);
    color: #333;
    line-height: 1.5;
    padding: 5px 0
}

.Downloads .layui-form-checkbox[lay-skin=primary]:hover>div {
    color: var(--vi-color)
}

.Downloads .right {
    flex: 1
}

.Downloads .right ul li {
    background: #fff;
    border: 1px solid #fc6C0F00;
    display: flex;
    justify-content: space-between
}

.Downloads .right ul li a {
    display: flex;
    align-items: center
}

.Downloads .right ul li a:first-child {
    flex: 1
}

.Downloads .right ul li a .icon {
    display: flex;
    justify-content: center
}

.Downloads .right ul li .text {
    flex: 1;
    border-left: 1px solid #f5f7f9
}

.Downloads .right ul li .text .date {
    font-weight: 400;
    font-size: var(--font-size12);
    color: #333;
    opacity: .8
}

.Downloads .right ul li .text .intro {
    font-size: var(--font-size18);
    color: #3b3b3b;
    margin: 5px 0 0;
    font-family: MONTSERRAT-REGULAR
}

.Downloads .right ul li .iconButton {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    border: 1px solid rgba(252, 108, 15, .5)
}

.Downloads .right ul li:hover {
    box-shadow: 0 3px 18px 0 rgba(252, 108, 15, .19);
    border: 1px solid var(--vi-color)
}

.Downloads .right ul li:hover .text .intro {
    color: var(--vi-color)
}

.Downloads .right ul li:hover .iconButton {
    background: var(--vi-color)
}

.Downloads .right ul li:hover .iconButton img {
    filter: grayscale(100%) brightness(500%)
}

@media(max-width:768px) {
    .Downloads .layui-form-checkbox[lay-skin=primary] {
        width: 100%
    }

    .Downloads .layui-form-checkbox[lay-skin=primary]>i {
        width: 12px;
        height: 12px;
        font-size: 12px;
        line-height: 10px;
        top: 50%
    }

    .Downloads .layui-form-checkbox[lay-skin=primary]>div {
        padding: 5px 0
    }

    .Downloads {
        padding: 35px 0
    }

    .Downloads .columns {
        display: block
    }

    .Downloads .columns .filterBtn {
        background: #fff;
        font-size: 18px;
        padding: 5px 30px;
        display: flex;
        justify-content: flex-end;
        align-items: baseline;
        margin: 0 0 20px
    }

    .Downloads .columns .filterBtn i {
        margin: 0 0 0 20px;
        font-size: 20px
    }

    .Downloads .left {
        width: 100%;
        min-width: 100%;
        position: fixed;
        background: #ccc;
        bottom: 0;
        left: 0;
        z-index: 10;
        height: 100%;
        align-items: flex-end;
        background: #0000004f;
        display: none
    }

    .Downloads .left>div>div {
        max-height: 70vh;
        overflow: auto
    }

    .Downloads .left>div {
        width: 100%;
        background: #fff;
        padding: 30px 5%
    }

    .Downloads .left>div .title {
        font-size: 16px;
        display: flex;
        justify-content: space-between;
        border-bottom: 1px solid #ccc;
        padding: 0 0 10px;
        margin: 0 0 20px
    }

    .Downloads .left>div .title i {
        font-size: 20px;
        color: #000;
        font-weight: 500
    }

    .Downloads .left dt {
        width: 100%
    }

    .Downloads .left dl {
        padding: 15px 0 0;
        width: 100%
    }

    .Downloads .left dd {
        margin: 6px 0 0
    }

    .Downloads .left .list {
        padding: 0 0 20px;
        overflow: hidden
    }

    .Downloads .left dt i {
        margin: 0 0 0 20px
    }

    .Downloads .left dd .layui-icon-circle:before {
        width: 12px;
        height: 12px
    }

    .Downloads .right ul {
        margin: 0 0 30px
    }

    .Downloads .right ul li {
        margin: 0 0 20px
    }

    .Downloads .right ul li a .icon {
        width: 55px
    }

    .Downloads .right ul li a .icon img {
        width: 25px
    }

    .Downloads .right ul li .text {
        padding: 15px 10px
    }

    .Downloads .right ul li .text .intro {
        margin: 5px 0 0
    }

    .Downloads .right ul li .iconButton {
        display: none
    }
}

@media(min-width:768px) {
    .Downloads .layui-form-checkbox[lay-skin=primary]>i {
        width: .625vw;
        height: .625vw;
        font-size: .625vw;
        line-height: .520833vw
    }

    .Downloads .layui-form-checkbox[lay-skin=primary]>div {
        padding: .260417vw 0
    }

    .Downloads {
        padding: 4.6875vw 0 4.166667vw
    }

    .Downloads .left {
        width: 21.354167vw;
        min-width: 21.354167vw
    }

    .Downloads .left dt {
        width: 11.458333vw
    }

    .Downloads .left dl {
        padding: .78125vw 0 0;
        width: 12.5vw
    }

    .Downloads .left dd {
        margin: .3125vw 0 0
    }

    .Downloads .left .list {
        padding: 0 0 1.041667vw
    }

    .Downloads .left dt i {
        margin: 0 0 0 1.041667vw
    }

    .Downloads .left dd .layui-icon-circle:before {
        width: .625vw;
        height: .625vw
    }

    .Downloads .right ul {
        margin: 0 0 2.916667vw
    }

    .Downloads .right ul li {
        margin: 0 0 .833333vw
    }

    .Downloads .right ul li a .icon {
        width: 5.520833vw
    }

    .Downloads .right ul li a .icon img {
        width: 1.614583vw
    }

    .Downloads .right ul li .text {
        padding: 1.041667vw 2.083333vw 1.25vw
    }

    .Downloads .right ul li .text .intro {
        margin: .260417vw 0 0
    }

    .Downloads .right ul li .iconButton {
        margin: 0 1.71875vw;
        width: 4.53125vw;
        height: 2.03125vw
    }

    .Downloads .right ul li .iconButton img {
        width: 1.09375vw
    }
}

@media(min-width:1600px) {
    .Downloads .layui-form-checkbox[lay-skin=primary]>i {
        width: 12px;
        height: 12px;
        font-size: 8px;
        line-height: 10px
    }

    .Downloads .layui-form-checkbox[lay-skin=primary]>div {
        padding: 5px 0
    }

    .Downloads {
        padding: 90px 0 80px
    }

    .Downloads .left {
        width: 410px;
        min-width: 410px
    }

    .Downloads .left dt {
        width: 220px
    }

    .Downloads .left dl {
        padding: 15px 0 0;
        width: 240px
    }

    .Downloads .left dd {
        margin: 6px 0 0
    }

    .Downloads .left .list {
        padding: 0 0 20px
    }

    .Downloads .left dt i {
        margin: 0 0 0 20px
    }

    .Downloads .left dd .layui-icon-circle:before {
        width: 12px;
        height: 12px
    }

    .Downloads .right ul {
        margin: 0 0 56px
    }

    .Downloads .right ul li {
        margin: 0 0 16px
    }

    .Downloads .right ul li a .icon {
        width: 106px
    }

    .Downloads .right ul li a .icon img {
        width: 31px
    }

    .Downloads .right ul li .text {
        padding: 20px 40px 24px
    }

    .Downloads .right ul li .text .intro {
        margin: 5px 0 0
    }

    .Downloads .right ul li .iconButton {
        margin: 0 33px;
        width: 87px;
        height: 39px
    }

    .Downloads .right ul li .iconButton img {
        width: 21px
    }
}

.VideoCenter {
    border-top: 1px solid #f2f4f5;
    overflow: hidden
}

.VideoCenter .Top dl {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 0 0 1px;
    margin: 0 0 1px
}

.VideoCenter .Top dl dt {
    font-size: var(--font-size18);
    color: #333;
    font-family: MONTSERRAT-REGULAR
}

.VideoCenter .Top dl a {
    display: block;
    min-width: max-content
}

.VideoCenter .Top dl .layui-anim.layui-icon {
    display: none
}

.VideoCenter .Top dl .layui-form-radio {
    padding: 0;
    margin: 0;
    line-height: 1.8
}

.VideoCenter .Top dl .layui-form-radio>* {
    border-radius: 50px;
    margin: 0;
    font-weight: 400;
    font-size: var(--font-size16);
    color: #666;
    border: 1px solid rgba(140, 140, 140, .3)
}

.VideoCenter .Top dl .layui-form-radio.layui-form-radioed>*,
.VideoCenter .Top dl dd:hover .layui-form-radio>* {
    background: #fb6c0f;
    color: #fff;
    border-radius: 50px;
    border: 1px solid rgba(140, 140, 140, 0)
}

.VideoCenter ul {
    display: grid
}

.VideoCenter ul li:first-child {
    grid-column-start: 1;
    grid-column-end: 3
}

.VideoCenter ul li a {
    position: relative;
    display: block
}

.VideoCenter ul li .image img {
    object-fit: cover
}

.VideoCenter ul li .text {
    width: 100%;
    display: flex;
    justify-content: space-between
}

.VideoCenter ul li .text .intro {
    font-size: var(--font-size18);
    color: #3b3b3b
}

.VideoCenter ul li .text .icon {
    background: #fc6c0f;
    box-shadow: 0 2px 17px 0 rgba(252, 108, 15, .5);
    border: 0 solid #fff;
    border-radius: 50%;
    position: relative;
    z-index: 1
}

.VideoCenter ul li:first-child .text,
.VideoCenter ul li:nth-child(2) .text {
    align-items: center;
    position: absolute;
    bottom: 0;
    left: 0
}

.VideoCenter ul li:first-child .text .icon,
.VideoCenter ul li:nth-child(2) .text .icon {
    background: rgba(252, 108, 15, 0);
    border: 1px solid #fff;
    box-shadow: unset
}

.VideoCenter ul li:first-child .text .intro,
.VideoCenter ul li:nth-child(2) .text .intro {
    color: #fff;
    margin: 0
}

.VideoCenter ul li:first-child a:hover .icon,
.VideoCenter ul li:nth-child(2) a:hover .icon {
    background: #fc6c0f;
    box-shadow: 0 2px 17px 0 rgba(252, 108, 15, .5);
    border: 0 solid #fff
}

@media(max-width:768px) {
    .VideoCenter {
        padding: 35px 0
    }

    .VideoCenter .Top dl {
        flex-wrap: unset;
        overflow: auto
    }

    .VideoCenter .Top dl dt {
        margin: 0;
        min-width: max-content
    }

    .VideoCenter .Top dl dd {
        margin: 0 0 0 10px;
        min-width: max-content
    }

    .VideoCenter .Top dl .layui-form-radio>* {
        padding: 2px 20px
    }

    .VideoCenter ul {
        display: block;
        margin: 0
    }

    .VideoCenter ul li {
        margin: 20px 0 0
    }

    .VideoCenter ul li .text .icon {
        width: 40px;
        min-width: 40px;
        height: 40px;
        margin: -20px 22px 0 0
    }

    .VideoCenter ul li:first-child .text .icon,
    .VideoCenter ul li:nth-child(2) .text .icon {
        margin: 0
    }

    .VideoCenter ul li:first-child .text,
    .VideoCenter ul li:nth-child(2) .text {
        padding: 20px;
        background: linear-gradient(0deg, #000, transparent)
    }

    .VideoCenter ul li .text .intro br {
        display: none
    }

    .VideoCenter ul li .text .intro {
        padding: 0 35px 0 0;
        margin: 15px 0
    }

    .VideoCenter ul li .image img {
        height: 200px
    }
}

@media(min-width:768px) {
    .VideoCenter {
        padding: 4.375vw 0 3.438vw
    }

    .VideoCenter .Top dl dt {
        margin: 0 0 1.042vw
    }

    .VideoCenter .Top dl dd {
        margin: 0 0 1.042vw 1.042vw
    }

    .VideoCenter .Top dl .layui-form-radio>* {
        padding: .46875vw 1.25vw
    }

    .VideoCenter ul {
        grid-template-columns: 27.344vw 27.344vw 27.344vw;
        grid-gap: 0.521vw;
        margin: 1.563vw 0 0
    }

    .VideoCenter ul li .text .icon {
        width: 2.656vw;
        min-width: 2.656vw;
        height: 2.656vw;
        margin: -1.328vw 1.146vw 0 0
    }

    .VideoCenter ul li:first-child .text .icon,
    .VideoCenter ul li:nth-child(2) .text .icon {
        margin: 0
    }

    .VideoCenter ul li:first-child .text,
    .VideoCenter ul li:nth-child(2) .text {
        padding: 1.563vw 2.083vw
    }

    .VideoCenter ul li .text .intro {
        padding: 0 1.823vw 0 0;
        margin: .781vw 0
    }

    .VideoCenter ul li .image img {
        height: 31.719vw
    }
}

@media(min-width:1600px) {
    .VideoCenter {
        padding: 84px 0 66px
    }

    .VideoCenter .Top dl dt {
        margin: 0 0 20px
    }

    .VideoCenter .Top dl dd {
        margin: 0 0 20px 20px
    }

    .VideoCenter .Top dl .layui-form-radio>* {
        padding: 9px 24px
    }

    .VideoCenter ul {
        grid-template-columns: auto auto auto;
        grid-gap: 10px;
        margin: 30px 0 0
    }

    .VideoCenter ul li .text .icon {
        width: 51px;
        min-width: 51px;
        height: 51px;
        margin: -25.5px 22px 0 0
    }

    .VideoCenter ul li:first-child .text .icon,
    .VideoCenter ul li:nth-child(2) .text .icon {
        margin: 0
    }

    .VideoCenter ul li:first-child .text,
    .VideoCenter ul li:nth-child(2) .text {
        padding: 30px 40px
    }

    .VideoCenter ul li .text .intro {
        padding: 0 35px 0 0;
        margin: 15px 0
    }

    .VideoCenter ul li .image img {
        height: 609px
    }
}

.Balcony {
    position: relative;
    overflow: hidden
}

.Balcony ul.swiper1 li {
    position: relative
}

.Balcony ul.swiper1 li .title {
    position: absolute;
    font-size: var(--font-size90);
    line-height: 1.1;
    color: #fff;
    background: linear-gradient(180deg, #fff 25%, #ffffff00);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    animation: 1s linear fadeInUp;
    -webkit-animation: 1s fadeInUp;
    display: none
}

.Balcony ul.swiper1 li.on .title {
    display: block
}

.Balcony .text {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.Balcony .text .auto_1600,
.Balcony ul.swiper2 {
    height: 100%
}

.Balcony ul.swiper2 .image img {
    height: 100%;
    object-fit: contain
}

.Balcony ul.swiper2 li {
    background: #fff;
    display: flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0);
    cursor: pointer;
    background: rgb(255 255 255 / 75%);
    backdrop-filter: blur(16px)
}

.Balcony ul.swiper2 li a {
    display: flex;
    align-items: center
}

.Balcony ul.swiper2 li .title {
    font-size: var(--font-size18);
    color: #333;
    line-height: unset;
    font-weight: 500;
    font-family: MONTSERRAT-REGULAR;
    margin-left: -26px
}

.Balcony ul.swiper2 li.on {
    border: 1px solid #fb6c0f;
    background: rgb(255 255 255 / 100%)
}

.Balcony ul.swiper2 li.on .title,
.Balcony ul.swiper2 li:hover .title {
    color: var(--vi-color)
}

@media(max-width:768px) {
    .Balcony ul.swiper1 li .title {
        position: unset;
        color: #000;
        -webkit-text-fill-color: unset;
        padding: 20px 5% 0;
        text-align: center;
        font-size: 20px;
        animation: .5s fadeInUp;
        -webkit-animation: .5s fadeInUp
    }

    .Balcony .text {
        padding: 20px 0 35px;
        position: unset
    }

    .Balcony ul.swiper2 {
        width: auto;
        padding: 0 50px 0 0
    }

    .Balcony ul.swiper2 .image {
        width: 70px;
        min-width: 70px;
        margin: 0 15px 0 0;
        height: 60px
    }

    .Balcony ul.swiper2 li {
        padding: 10px 20px;
        border-radius: 10px;
        border: 1px solid rgb(212 212 212);
        min-height: 60px;
        height: auto
    }
}

@media(min-width:768px) {
    .Balcony ul.swiper2 li:hover {
        border: 1px solid #fb6c0f
    }

    .Balcony ul.swiper1 li .title {
        top: 4.0625vw;
        left: 36.458333vw
    }

    .Balcony .text {
        padding: 4.166667vw 0
    }

    .Balcony ul.swiper2 {
        width: 19.270833vw
    }

    .Balcony ul.swiper2 .image {
        width: 6.25vw;
        min-width: 6.25vw;
        margin: 0 1.041667vw 0 0;
        height: 3.125vw
    }

    .Balcony ul.swiper2 li {
        padding: 1.302083vw 1.041667vw;
        border-radius: 1.041667vw
    }
}

@media(min-width:1600px) {
    .Balcony ul.swiper1 li .title {
        top: 78px;
        left: 700px
    }

    .Balcony .text {
        padding: 80px 0
    }

    .Balcony ul.swiper2 {
        width: 370px
    }

    .Balcony ul.swiper2 .image {
        width: 120px;
        min-width: 120px;
        margin: 0 20px 0 0;
        height: 60px
    }

    .Balcony ul.swiper2 li {
        padding: 25px 20px;
        border-radius: 20px
    }
}

.features2 ul li:nth-child(3) {
    grid-row-start: 2
}

.features2 ul li:nth-child(4) {
    grid-row-start: 1;
    grid-row-end: 3
}

.features3 ul li:first-child {
    grid-row-start: unset;
    grid-row-end: unset
}

.VideoCenter .layui-flow-more {
    width: 100%;
    grid-column-start: 1;
    grid-column-end: 4;
    padding: auto;
    font-size: var(--font-size16)
}

.VideoCenter .layui-flow-more>* {
    font-size: var(--font-size14)
}

.VideoCenter .layui-flow-more a {
    line-height: 3
}

.VideoCenter .layui-flow-more a cite {
    background: #fc6c0f;
    color: #fff;
    border-radius: 50px
}

.VideoCenter .layui-flow-more a i {
    font-size: unset;
    line-height: 1
}

.FAQS {
    background: #f2f4f5
}

.FAQS ul {
    display: flex;
    flex-wrap: wrap
}

.FAQS ul li {
    background: url('../images/60.png') center/100% 100% no-repeat;
    position: relative
}

.FAQS ul .title {
    font-size: var(--font-size20);
    color: #333;
    line-height: 1.5;
    display: flex;
    align-items: flex-start;
    justify-content: space-between
}

.FAQS ul .title i {
    font-size: var(--font-size16)
}

.FAQS ul .intro {
    font-weight: 400;
    font-size: var(--font-size17);
    color: #666;
    line-height: 1.2
}

.FAQS ul li>div:nth-child(2) {
    display: flex
}

.FAQS ul li>div:nth-child(2)>span {
    color: #3b3b3b;
    font-weight: 600;
    display: block;
    min-width: max-content;
    font-size: var(--font-size17)
}

.FAQS ul li .icon {
    position: absolute
}

.FAQS ul li:hover {
    background: url('../images/61.png') center/100% 100% no-repeat
}

.FAQS ul li:hover .title {
    color: var(--vi-color)
}

@media(max-width:768px) {
    .VideoCenter .layui-flow-more {
        margin: 15px 0 0
    }

    .VideoCenter .layui-flow-more a cite {
        padding: 0 35px;
        line-height: 2.7
    }

    .VideoCenter .layui-flow-more a i {
        width: 25px
    }

    .FAQS {
        padding: 35px 0
    }

    .FAQS ul {
        margin: 0 0 10px
    }

    .FAQS ul li {
        padding: 30px 20px;
        width: 100%;
        margin: 0 0 20px
    }

    .FAQS ul .title {
        margin: 0;
        padding: 0 0 0 40px;
        line-height: unset;
        align-items: center
    }

    .FAQS ul li>div:nth-child(2) {
        margin: 10px 0 0;
        display: block
    }

    .FAQS ul li:nth-child(2n) {
        margin-right: 0
    }

    .FAQS ul li>div:nth-child(2)>span {
        margin: 0 0 8px
    }

    .FAQS ul .intro {
        line-height: unset
    }

    .FAQS ul li .icon {
        top: 10px;
        left: 0
    }

    .FAQS ul li .icon img {
        width: 59px
    }
}

@media(min-width:768px) {
    .VideoCenter .layui-flow-more {
        margin: 1.563vw 0 0
    }

    .VideoCenter .layui-flow-more a cite {
        padding: 0 1.823vw
    }

    .VideoCenter .layui-flow-more a i {
        width: 1.719vw
    }

    .FAQS {
        padding: 4.25vw 0 4.01vw
    }

    .FAQS ul li {
        padding: 1.302083vw 2.604167vw 1.041667vw 2.1875vw;
        width: calc(50% - (4.01vw / 2))
    }

    .FAQS ul .title {
        margin: 0;
        padding: 0 0 0 2.083vw
    }

    .FAQS ul li>div:nth-child(2) {
        margin: 2.083333vw 0 0
    }

    .FAQS ul .title i {
        margin: .364583vw 0 0
    }

    .FAQS ul li:nth-child(2n) {
        margin-right: 0
    }

    .FAQS ul li>div:nth-child(2)>span {
        margin: 0 .729167vw 0 0
    }

    .FAQS ul li .icon {
        top: .416667vw;
        left: 1.041667vw
    }

    .FAQS ul li .icon img {
        width: 3.125vw
    }
}

@media(min-width:1600px) {
    .VideoCenter .layui-flow-more {
        margin: 30px 0 0
    }

    .VideoCenter .layui-flow-more a cite {
        padding: 0 35px
    }

    .VideoCenter .layui-flow-more a i {
        width: 33px
    }

    .FAQS {
        padding: 120px 0 77px
    }

    .FAQS ul li {
        padding: 25px 50px 20px 42px;
        width: calc(50% - (77px / 2))
    }

    .FAQS ul .title {
        margin: 0;
        padding: 0 0 0 40px
    }

    .FAQS ul li>div:nth-child(2) {
        margin: 40px 0 0
    }

    .FAQS ul .title i {
        margin: 7px 0 0
    }

    .FAQS ul li:nth-child(2n) {
        margin-right: 0
    }

    .FAQS ul li>div:nth-child(2)>span {
        margin: 0 14px 0 0
    }

    .FAQS ul li .icon {
        top: 8px;
        left: 20px
    }

    .FAQS ul li .icon img {
        width: 60px
    }
}

.Service .Network {
    position: relative;
    padding: 4.739583vw 0
}

.Service .Network .prompt {
    font-size: var(--font-size16);
    position: absolute
}

.Service .Network .columns {
    justify-content: space-between;
    align-items: center
}

.Service .Network .list dl {
    background: #fff;
    animation: .5s linear fadeInUp;
    -webkit-animation: 1s fadeInUp;
    display: none;
    box-sizing: content-box
}

.Service .Network .list dl.on {
    display: block
}

.Service .Network .list dl dt {
    font-weight: 600;
    font-size: var(--font-size28);
    color: #3b3b3b
}

.Service .Network .list dl dd>div:first-child {
    display: flex;
    align-items: center
}

.Service .Network .list dl dd span {
    font-size: var(--font-size18);
    color: #3b3b3b;
    display: inline-block
}

.Service .Network .list dl dd .intro {
    font-weight: 400;
    font-size: var(--font-size16);
    color: #3b3b3b;
    opacity: .6
}

.Service .Network ul li .title {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: var(--font-size14);
    color: #3b3b3b;
    display: none;
    min-width: max-content
}

.Service .Network ul li {
    position: absolute;
    z-index: 2;
    cursor: pointer
}

.Service .Network ul li .dian {
    position: relative
}

.Service .Network ul li i {
    background: #fff;
    border-radius: 50%;
    position: relative;
    z-index: 3;
    display: block
}

.Service .Network ul li span:first-child {
    background: #fc6c0f;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    transform: translate(-50%, -50%)
}

.Service .Network ul li span:nth-child(2),
.Service .Network ul li span:nth-child(3),
.Service .Network ul li span:nth-child(4) {
    content: '';
    z-index: 10;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    border: 1px solid #fc6c0f;
    opacity: .3;
    -webkit-animation: 3s linear .8s infinite scale1;
    animation: 3s linear infinite scale1;
    transform: translate(-50%, -50%);
    display: none
}

.Service .Network ul li span:nth-child(3) {
    animation-delay: 1s
}

.Service .Network ul li span:nth-child(4) {
    animation-delay: 2s
}

.Service .Network ul li.on span {
    display: block !important
}

.Service .Network ul li.on span:first-child {
    display: none
}

.Service .Network ul li.on .title {
    color: var(--vi-color);
    display: block
}

.Service .Network .images {
    position: relative;
    overflow: hidden
}

.Service .Network .images .image img {
    width: 49.479167vw
}

.Service .botton dd {
    cursor: pointer
}

.Service .botton dd>div:first-child {
    display: flex;
    align-items: center
}

.Service .botton dd span:first-child {
    border-radius: 50%;
    border: 1px solid #999;
    display: inline-block
}

.Service .botton dd span:nth-child(2) {
    height: 1px;
    display: inline-block;
    background: linear-gradient(45deg, rgba(178, 178, 178, .8) 0, transparent 65%)
}

.Service .botton dd .index {
    font-size: var(--font-size24);
    color: #999;
    line-height: 1;
    font-weight: 600
}

.Service .botton dd .title {
    font-weight: 400;
    font-size: var(--font-size19);
    color: #999
}

.Service .botton dd.on .index,
.Service .botton dd.on .title {
    color: var(--vi-color)
}

.Service .botton dd.on span:first-child {
    border: unset;
    background: var(--vi-color)
}

.Service .botton dd.on span:nth-child(2) {
    background: linear-gradient(45deg, var(--vi-color), transparent)
}

@media(max-width:768px) {
    .Service .Network {
        display: flex;
        flex-direction: column-reverse;
        padding: 30px 0
    }

    .Service .Network .prompt {
        font-size: 14px;
        position: unset;
        padding: 20px
    }

    .Service .Network .images {
        position: relative;
        margin: 25px 0 10px
    }

    .Service .Network .list {
        position: unset
    }

    .Service .Network .list dl {
        max-width: 100%;
        padding: 20px;
        min-height: 300px
    }

    .Service .Network .list dl dt {
        padding: 0
    }

    .Service .Network .list dl dd {
        padding: 20px 0 0
    }

    .Service .Network .list dl dd img {
        width: 16px;
        margin: 0 9px 0 0
    }

    .Service .Network .list dl dd .intro {
        line-height: unset;
        padding: 8px 0 0
    }

    .Service .Network ul li i {
        width: 4px;
        height: 4px
    }

    .Service .Network ul li .title {
        padding: 0 20px 0 0;
        transform: translateX(-100%) translateY(-50%);
        opacity: 0
    }

    .Service .Network ul li.on .title {
        opacity: 1;
        padding: 0 40px
    }

    .Service .Network ul li span:first-child {
        width: 10px;
        height: 10px
    }

    .Service .Network ul li span:nth-child(2),
    .Service .Network ul li span:nth-child(3),
    .Service .Network ul li span:nth-child(4) {
        width: 5px;
        height: 5px
    }

    @keyframes scale1 {
        0% {
            width: 5px;
            height: 5px;
            background: rgba(252, 108, 15, .5);
            opacity: .3
        }

        70% {
            opacity: .3
        }

        100% {
            width: 35px;
            height: 35px;
            background: rgba(252, 108, 15, 0);
            opacity: 0
        }
    }

    @-webkit-keyframes scale1 {
        0% {
            width: 5px;
            height: 5px;
            background: rgba(252, 108, 15, .5);
            opacity: .3
        }

        70% {
            opacity: .3
        }

        100% {
            width: 35px;
            height: 35px;
            background: rgba(252, 108, 15, 0);
            opacity: 0
        }
    }

    .Service .botton {
        padding: 35px 0
    }

    .Service .botton dd span:first-child {
        min-width: 13px;
        width: 13px;
        height: 13px;
        margin: 0 8px 0 0
    }

    .Service .botton dd span:nth-child(2) {
        width: 266px
    }

    .Service .botton dd .index {
        padding: 15px 0 10px
    }

    .Service .Network .columns {
        display: block
    }

    .Service .Network .images .image img {
        width: 100%
    }
}

@media(min-width:768px) {
    .Service .Network .prompt {
        bottom: 3.125vw;
        right: 7.8125vw
    }

    .Service .Network .list dl {
        max-width: 28.646vw;
        padding: 2.604vw 2.604vw 3.125vw 2.083vw;
        width: 28.646vw;
        min-height: 17.708333vw
    }

    .Service .Network .list dl dt {
        padding: 0 0 .781vw
    }

    .Service .Network .list dl dd {
        padding: 1.823vw 0 0
    }

    .Service .Network .list dl dd img {
        width: .833vw;
        margin: 0 .469vw 0 0
    }

    .Service .Network .list dl dd .intro {
        line-height: 1.1;
        padding: .26vw 0 0
    }

    .Service .Network ul li i {
        width: .208vw;
        height: .208vw
    }

    .Service .Network ul li .title {
        padding: 0 0 0 1.042vw
    }

    .Service .Network ul li:nth-child(6) .title {
        right: 0
    }

    .Service .Network ul li.on .title {
        padding: 0 0 0 2.865vw
    }

    .Service .Network ul li:nth-child(6).on .title {
        padding: 0 2.865vw 0 0
    }

    .Service .Network ul li span:first-child {
        width: .885vw;
        height: .885vw
    }

    .Service .Network ul li span:nth-child(2),
    .Service .Network ul li span:nth-child(3),
    .Service .Network ul li span:nth-child(4) {
        width: .26vw;
        height: .26vw
    }

    @keyframes scale1 {
        0% {
            width: .26vw;
            height: .26vw;
            background: rgba(252, 108, 15, .5);
            opacity: .3
        }

        70% {
            opacity: .3
        }

        100% {
            width: 5.729vw;
            height: 5.729vw;
            background: rgba(252, 108, 15, 0);
            opacity: 0
        }
    }

    @-webkit-keyframes scale1 {
        0% {
            width: .26vw;
            height: .26vw;
            background: rgba(252, 108, 15, .5);
            opacity: .3
        }

        70% {
            opacity: .3
        }

        100% {
            width: 5.729vw;
            height: 5.729vw;
            background: rgba(252, 108, 15, 0);
            opacity: 0
        }
    }

    .Service .botton {
        padding: 2.865vw 0 7.5vw
    }

    .Service .botton dd span:first-child {
        min-width: .677vw;
        width: .677vw;
        height: .677vw;
        margin: 0 .417vw 0 0
    }

    .Service .botton dd span:nth-child(2) {
        width: 13.854vw
    }

    .Service .botton dd .index {
        padding: 1.563vw 0 1.042vw
    }
}

@media(min-width:1600px) {
    .Service .Network .prompt {
        bottom: 60px;
        right: 150px
    }

    .Service .Network .list dl {
        max-width: 550px;
        padding: 50px 50px 60px 40px;
        min-height: 340px
    }

    .Service .Network .list dl dt {
        padding: 0 0 15px
    }

    .Service .Network .list dl dd {
        padding: 35px 0 0
    }

    .Service .Network .list dl dd img {
        width: 16px;
        margin: 0 9px 0 0
    }

    .Service .Network .list dl dd .intro {
        line-height: 1.1;
        padding: 5px 0 0
    }

    .Service .Network ul li i {
        width: 4px;
        height: 4px
    }

    .Service .Network ul li .title {
        padding: 0 0 0 20px
    }

    .Service .Network ul li.on .title {
        padding: 0 0 0 55px
    }

    .Service .Network ul li:nth-child(6).on .title {
        padding: 0 55px 0 0
    }

    .Service .Network ul li span:first-child {
        width: 17px;
        height: 17px
    }

    .Service .Network ul li span:nth-child(2),
    .Service .Network ul li span:nth-child(3),
    .Service .Network ul li span:nth-child(4) {
        width: 5px;
        height: 5px
    }

    @keyframes scale1 {
        0% {
            width: 5px;
            height: 5px;
            background: rgba(252, 108, 15, .5);
            opacity: .3
        }

        70% {
            opacity: .3
        }

        100% {
            width: 110px;
            height: 110px;
            background: rgba(252, 108, 15, 0);
            opacity: 0
        }
    }

    @-webkit-keyframes scale1 {
        0% {
            width: 5px;
            height: 5px;
            background: rgba(252, 108, 15, .5);
            opacity: .3
        }

        70% {
            opacity: .3
        }

        100% {
            width: 110px;
            height: 110px;
            background: rgba(252, 108, 15, 0);
            opacity: 0
        }
    }

    .Service .botton {
        padding: 55px 0 144px
    }

    .Service .botton dd span:first-child {
        min-width: 13px;
        width: 13px;
        height: 13px;
        margin: 0 8px 0 0
    }

    .Service .botton dd span:nth-child(2) {
        width: 266px
    }

    .Service .botton dd .index {
        padding: 30px 0 20px
    }
}

.ContactUs .Top {
    position: relative
}

.ContactUs .Top .text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.ContactUs .Top .text .title {
    font-weight: 600;
    font-size: var(--font-size28);
    color: #fff;
    line-height: 2
}

.ContactUs .Top .text dl dd>div:first-child {
    display: flex;
    align-items: center
}

.ContactUs .Top .text dl dd img {
    filter: grayscale(100%) brightness(500%)
}

.ContactUs .Top .text dl dd {
    display: flex;
    max-width: 60%;
    align-items: baseline;
    flex-wrap: wrap
}

.ContactUs .Top .text dl dd span {
    font-size: var(--font-size18);
    color: #fff
}

.ContactUs .Top .text dl dd .intro {
    font-size: var(--font-size16);
    color: #fff;
    opacity: .6;
    flex: 1;
    display: flex;
    align-items: center;
    font-family: MONTSERRAT-REGULAR
}

.ContactUs ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
    z-index: 1
}

.ContactUs ul li {
    position: relative
}

.ContactUs ul li .title {
    font-size: var(--font-size28);
    color: #3b3b3b;
    line-height: 1.5
}

.ContactUs ul li dd {
    display: flex;
    align-items: baseline
}

.ContactUs ul li dd>div:first-child {
    display: flex;
    align-items: center
}

.ContactUs ul li dd span {
    font-size: var(--font-size18);
    color: #3b3b3b
}

.ContactUs ul li dd .intro {
    font-size: var(--font-size16);
    color: #3b3b3b;
    opacity: .6;
    font-family: MONTSERRAT-REGULAR
}

@media(max-width:768px) {
    .ContactUs {
        padding: 35px 0 15px;
        background: #f2f4f5
    }

    .ContactUs .Top {
        margin: 0 0 20px
    }

    .ContactUs .Top .text {
        padding: 30px 0 0;
        position: unset
    }

    .ContactUs .Top .text .title {
        padding: 0 0 20px;
        color: #333
    }

    .ContactUs .Top .text dl dd img {
        width: 13px;
        margin: 0 9px 0 0;
        filter: unset
    }

    .ContactUs .Top .text dl dd {
        padding: 0 0 20px;
        max-width: 100%;
        align-items: unset
    }

    .ContactUs .Top .text dl dd span {
        color: #333
    }

    .ContactUs .Top .text dl dd:first-child {
        padding: 0 0 10px;
        display: block
    }

    .ContactUs .Top .text dl dd:first-child .intro {
        padding: 10px 0
    }

    .ContactUs .Top .text dl dd .intro {
        margin: 0 0 0 10px;
        color: #333;
        line-height: 1.6;
        font-size: 14px
    }

    .ContactUs ul li {
        padding: 20px;
        width: 100%;
        margin: 0 0 24px
    }

    .ContactUs ul li .icon {
        text-align: right;
        margin: 0 0 -30px
    }

    .ContactUs ul li .icon img {
        width: 28px
    }

    .ContactUs ul li .title {
        padding: 15px 0 0;
        line-height: unset
    }

    .ContactUs ul li dd:first-child {
        display: block
    }

    .ContactUs ul li dd {
        padding: 15px 0 0;
        align-items: unset
    }

    .ContactUs ul li dd img {
        width: 13px;
        margin: 0 9px 0 0
    }

    .ContactUs ul li dd .intro {
        margin: 0 0 0 10px;
        font-size: 14px
    }

    .ContactUs ul li dd:first-child .intro {
        margin: 10px 0 0
    }
}

@media(min-width:768px) {
    .ContactUs {
        padding: 4.688vw 0;
        background: #f2f4f5
    }

    .ContactUs .Top {
        margin: 0 0 1.979vw
    }

    .ContactUs .Top .text {
        padding: 2.688vw 5.417vw
    }

    .ContactUs .Top .text .title {
        padding: 0 0 2.604vw
    }

    .ContactUs .Top .text dl dd img {
        width: .833vw;
        margin: 0 .469vw 0 0
    }

    .ContactUs .Top .text dl dd {
        padding: 0 0 1.042vw
    }

    .ContactUs .Top .text dl dd:first-child {
        padding: 0 0 .521vw
    }

    .ContactUs .Top .text dl dd .intro {
        margin: 0 0 0 .521vw
    }

    .ContactUs ul li {
        padding: 3.125vw 2.083vw 3.125vw 3.125vw;
        width: calc(50% - .625vw);
        margin: 0 0 1.25vw
    }

    .ContactUs ul li .icon img {
        width: 2.5vw
    }

    .ContactUs ul li .smtitle {
        font-size: var(--font-size16)
    }

    .ContactUs ul li dd {
        padding: 1.146vw 0 0
    }

    .ContactUs ul li dd img {
        width: .833vw;
        margin: 0 .469vw 0 0
    }

    .ContactUs ul li dd .intro {
        margin: 0 0 0 .521vw;
        min-height: 1.25vw
    }
}

@media(min-width:1600px) {
    .ContactUs {
        padding: 90px 0;
        background: #f2f4f5
    }

    .ContactUs .Top {
        margin: 0 0 38px
    }

    .ContactUs .Top .text {
        padding: 45px 104px
    }

    .ContactUs .Top .text .title {
        padding: 0 0 50px
    }

    .ContactUs .Top .text dl dd img {
        width: 16px;
        margin: 0 9px 0 0
    }

    .ContactUs .Top .text dl dd {
        padding: 0 0 20px
    }

    .ContactUs .Top .text dl dd:first-child {
        padding: 0 0 10px
    }

    .ContactUs .Top .text dl dd .intro {
        margin: 0 0 0 10px
    }

    .ContactUs ul li {
        padding: 60px 40px 60px 60px;
        width: calc(50% - 12px);
        margin: 0 0 24px
    }

    .ContactUs ul li .icon img {
        width: 48px
    }

    .ContactUs ul li dd {
        padding: 22px 0 0
    }

    .ContactUs ul li dd img {
        width: 16px;
        margin: 0 9px 0 0
    }

    .ContactUs ul li dd .intro {
        margin: 0 0 0 10px;
        min-height: 24px
    }
}

.Development {
    padding: 100px 0 130px
}

.Development ul li {
    display: flex;
    align-items: center
}

.Development ul li:last-child {
    margin-bottom: 0
}

.Development ul li:nth-child(2n) {
    flex-direction: row-reverse
}

.Development ul li .title {
    font-size: var(--font-size36);
    color: #333
}

.Development ul li .intro {
    font-weight: 400;
    font-size: var(--font-size16);
    color: #666;
    line-height: 1.5;
    text-align: justify
}

@media(max-width:768px) {
    .Development {
        padding: 35px 0
    }

    .Development ul li {
        margin: 0 0 35px;
        display: block
    }

    .Development ul li .title {
        padding: 0 0 20px
    }

    .Development ul li .image {
        width: auto;
        min-width: 100%;
        margin: 0 0 20px
    }

    .Development ul li:nth-child(2n) .image {
        margin: 0 0 20px
    }
}

@media(min-width:768px) {
    .Development {
        padding: 5.208vw 0 6.771vw
    }

    .Development ul li {
        margin: 0 0 3.854vw
    }

    .Development ul li .title {
        padding: 0 0 1.927vw
    }

    .Development ul li .image {
        width: 51.667vw;
        min-width: 51.667vw;
        margin: 0 4.896vw 0 0
    }

    .Development ul li:nth-child(2n) .image {
        margin: 0 0 0 4.896vw
    }
}

@media(min-width:1600px) {
    .Development {
        padding: 100px 0 130px
    }

    .Development ul li {
        margin: 0 0 74px
    }

    .Development ul li .title {
        padding: 0 0 37px
    }

    .Development ul li .image {
        width: 992px;
        min-width: 992px;
        margin: 0 94px 0 0
    }

    .Development ul li:nth-child(2n) .image {
        margin: 0 0 0 94px
    }
}

.Activities .Top {
    position: relative
}

.Activities .Top li a {
    display: flex;
    align-items: center
}

.Activities .Top .date {
    font-size: var(--font-size13);
    color: #666;
    display: flex;
    align-items: center
}

.Activities .Top .title {
    font-size: var(--font-size30);
    color: #333;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.Activities .Top .intro {
    font-weight: 500;
    font-size: var(--font-size18);
    color: #666;
    line-height: 1.4;
    opacity: .8;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.Activities .Top .SeeMore {
    background: var(--vi-color);
    border: 2px solid rgba(255, 255, 255, 0);
    font-size: var(--font-size14)
}

.Activities .Top .SeeMore img {
    filter: grayscale(100%) brightness(500%)
}

.Activities .Top .SeeMore:hover {
    border: 2px solid var(--vi-color);
    background: #fff;
    color: var(--vi-color)
}

.Activities .Top .SeeMore:hover img {
    filter: unset
}

.Activities .swiper-pagination {
    width: auto
}

.Activities .swiper-pagination .swiper-pagination-bullet {
    background: #ced1d8;
    border-radius: 50%;
    opacity: 1
}

.Activities .swiper-pagination .swiper-pagination-bullet-active {
    background: var(--vi-color);
    border-radius: 50px
}

.Activities .Top a:hover .title {
    color: var(--vi-color)
}

.Activities .list ul {
    display: flex;
    flex-wrap: wrap
}

.Activities .list ul li {
    background: #fafafa
}

.Activities .list ul li .date {
    font-size: var(--font-size15);
    color: #666;
    display: flex;
    align-items: center
}

.Activities .list ul li .text .title {
    font-size: var(--font-size22);
    color: #333;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-family: MONTSERRAT-REGULAR;
    font-weight: 500
}

.Activities .list ul li .text i {
    font-size: var(--font-size18);
    font-weight: 600;
    display: block;
    transform: rotate(180deg);
    width: max-content
}

.Activities .list ul li:hover .text .title {
    color: var(--vi-color)
}

@media(max-width:768px) {
    .Activities .Top {
        padding: 35px 0
    }

    .Activities .Top li a {
        display: block
    }

    .Activities .Top .image {
        width: auto;
        min-width: auto;
        margin: 0;
        padding: 0 0 35px
    }

    .Activities .Top .date img {
        width: 12px;
        margin: 0 6px 0 0
    }

    .Activities .Top .title {
        margin: 10px 0 20px
    }

    .Activities .Top .SeeMore {
        margin: 20px 0
    }

    .Activities .Top .SeeMore img {
        width: 14px
    }

    .Activities .Top .SeeMore:hover {
        border: 2px solid var(--vi-color)
    }

    .Activities .swiper-pagination {
        left: 0;
        bottom: 0;
        width: 100%
    }

    .Activities .swiper-pagination .swiper-pagination-bullet {
        width: 6px;
        height: 6px;
        margin: 0 7px
    }

    .Activities .swiper-pagination .swiper-pagination-bullet-active {
        width: 41px
    }

    .Activities .list {
        padding: 35px 0
    }

    .Activities .list ul {
        padding: 0 0 10px
    }

    .Activities .list ul li .text {
        padding: 20px
    }

    .Activities .list ul li {
        width: 100%;
        margin: 0 0 20px
    }

    .Activities .list ul li:nth-child(3n) {
        margin-right: 0
    }

    .Activities .list ul li .date img {
        width: 15px;
        margin: 0 7px 0 0
    }

    .Activities .list ul li .text .title {
        margin: 15px 0
    }

    .Activities .list ul li .image {
        position: relative;
        padding-bottom: 56%
    }

    .Activities .list ul li .image img {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        object-fit: cover
    }
}

@media(min-width:768px) {
    .Activities .Top {
        padding: 4.167vw 0
    }

    .Activities .Top .image {
        width: 41.667vw;
        min-width: 41.667vw;
        margin: 0 0 0 6.771vw
    }

    .Activities .Top .date img {
        width: .729vw;
        margin: 0 .313vw 0 0
    }

    .Activities .Top .title {
        margin: .521vw 0 1.563vw
    }

    .Activities .Top .SeeMore {
        margin: 3.438vw 0
    }

    .Activities .Top .SeeMore img {
        width: 1.042vw
    }

    .Activities .Top .SeeMore:hover {
        border: .104vw solid var(--vi-color)
    }

    .Activities .swiper-pagination {
        width: auto;
        left: 31.146vw;
        bottom: 6.406vw
    }

    .Activities .swiper-pagination .swiper-pagination-bullet {
        width: .313vw;
        height: .313vw;
        margin: 0 .365vw
    }

    .Activities .swiper-pagination .swiper-pagination-bullet-active {
        width: 2.135vw
    }

    .Activities .list {
        padding: 3.646vw 0 3.438vw
    }

    .Activities .list ul {
        padding: 0 0 2.604vw
    }

    .Activities .list ul li .text {
        padding: 2.188vw 1.667vw
    }

    .Activities .list ul li {
        width: calc(33.33% - 1.042vw);
        margin: 0 1.042vw 1.771vw 0
    }

    .Activities .list ul li:nth-child(3n) {
        margin-right: 0
    }

    .Activities .list ul li .date img {
        width: .781vw;
        margin: 0 .365vw 0 0
    }

    .Activities .list ul li .text .title {
        margin: 1.146vw 0 1.667vw
    }

    .Activities .list ul li .image {
        position: relative;
        padding-bottom: 56%
    }

    .Activities .list ul li .image img {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        object-fit: cover
    }
}

@media(min-width:1600px) {
    .Activities .Top {
        padding: 80px 0
    }

    .Activities .Top .image {
        width: 800px;
        min-width: 800px;
        margin: 0 0 0 130px
    }

    .Activities .Top .date img {
        width: 14px;
        margin: 0 6px 0 0
    }

    .Activities .Top .title {
        margin: 10px 0 30px
    }

    .Activities .Top .SeeMore {
        margin: 66px 0
    }

    .Activities .Top .SeeMore img {
        width: 20px
    }

    .Activities .Top .SeeMore:hover {
        border: 2px solid var(--vi-color)
    }

    .Activities .swiper-pagination {
        width: auto;
        left: 598px;
        bottom: 123px
    }

    .Activities .swiper-pagination .swiper-pagination-bullet {
        width: 6px;
        height: 6px;
        margin: 0 7px
    }

    .Activities .swiper-pagination .swiper-pagination-bullet-active {
        width: 41px
    }

    .Activities .list {
        padding: 70px 0 66px
    }

    .Activities .list ul {
        padding: 0 0 50px
    }

    .Activities .list ul li .text {
        padding: 42px 32px
    }

    .Activities .list ul li {
        width: calc(33.33% - 20px);
        margin: 0 20px 34px 0
    }

    .Activities .list ul li:nth-child(3n) {
        margin-right: 0
    }

    .Activities .list ul li .date img {
        width: 15px;
        margin: 0 7px 0 0
    }

    .Activities .list ul li .text .title {
        margin: 22px 0 32px
    }

    .Activities .list ul li .image {
        position: relative;
        padding-bottom: 56%
    }

    .Activities .list ul li .image img {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        object-fit: cover
    }
}

.NewsDetails {
    position: relative;
    background: #f5f5f7
}

.NewsDetails .auto_1440 {
    position: relative;
    z-index: 1
}

.NewsDetails .bgimage img {
    height: auto;
    z-index: 0
}

.NewsDetails .top {
    display: flex;
    align-items: center
}

.NewsDetails .top a {
    display: flex;
    align-items: center;
    font-size: var(--font-size14);
    color: #4c505f
}

.NewsDetails .top a i {
    font-size: var(--font-size14)
}

.NewsDetails .top a:not(:first-child):hover {
    color: var(--vi-color)
}

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

.new_warp .left {
    flex: 0 0 25%;
    max-width: 25%;
    margin: 4.167vw 0 0;
    position: sticky;
    top: 90px;
    padding: 1% 0;
    border-bottom: 1px solid #cdcdcd
}

.new_warp .left .title {
    font-size: var(--font-size24);
    position: relative;
    cursor: pointer;
    background-color: #f67f2f;
    padding: 3% 4%;
    color: #fff
}

.new_warp .left .title i {
    position: absolute;
    right: 3%;
    top: 50%;
    transform: translateY(-50%) rotate(-90deg);
    font-size: 24px;
    transition: .3s
}

.new_warp .left ul {
    margin-top: 15px
}

.new_warp .left ul li {
    font-size: 16px;
    color: #333;
    padding: 5px 5px 5px 20px;
    margin-bottom: 5px;
    position: relative
}

.new_warp .left ul li a::before {
    content: ' ';
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    top: 50%;
    left: 3px;
    transform: translateY(-50%);
    background-color: #333;
    position: absolute
}

.new_warp .left ul li a:hover {
    text-decoration: underline
}

.new_warp .left ul li a.active {
    color: #fb6c0f
}

.new_warp .left ul li a.active::before {
    background-color: #fb6c0f
}

.DetailsPage {
    background: #fff;
    flex: 0 0 73.3333333333%;
    max-width: 73.3333333333%
}

.DetailsPage .title {
    font-size: var(--font-size46);
    color: #333;
    line-height: 1.3
}

.DetailsPage .columns {
    justify-content: space-between;
    align-items: center
}

.DetailsPage .columns .date {
    display: flex;
    align-items: center
}

.DetailsPage .columns .date span:first-child {
    font-weight: 400;
    font-size: var(--font-size12);
    color: #fff;
    background: #fb6c0f;
    display: block
}

.DetailsPage .columns .date span:nth-child(2) {
    font-weight: 600;
    font-size: var(--font-size12);
    color: #8e8e8e;
    display: block
}

.DetailsPage .columns .detailShare {
    display: flex;
    align-items: center
}

.DetailsPage .columns .detailShare span {
    font-weight: 600;
    font-size: var(--font-size14);
    color: #333
}

.DetailsPage .columns .detailShare a {
    top: 0;
    font-size: var(--font-size14);
    transition: none;
    color: #000
}

.DetailsPage .columns .detailShare a:hover {
    background: #fb6c0f;
    color: #fff
}

.DetailsPage .intro {
    font-weight: 300;
    font-size: var(--font-size17);
    color: #757575;
    line-height: 1.55
}

.DetailsPage .intro a[href] {
    color: #fb7d20
}

.DetailsPage .intro a:hover {
    text-decoration: underline
}

.DetailsPage .bottom {
    display: flex
}

.DetailsPage .bottom>div {
    display: block;
    background: #f5f5f7;
    color: #333;
    font-family: MONTSERRAT-REGULAR;
    font-weight: 400
}

.DetailsPage .bottom>div:not(:last-child) span {
    font-weight: 400;
    font-size: var(--font-size12);
    color: #fff;
    background: #fb6c0f;
    display: inline-block
}

.DetailsPage .bottom>div:not(:last-child) div {
    font-size: var(--font-size18);
    line-height: 1.45;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.DetailsPage .bottom>div:last-child,
.DetailsPage .bottom>div:last-child a {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size18);
    color: #333;
    line-height: 1.45
}

.DetailsPage .bottom>div:hover {
    color: var(--vi-color)
}

@media(max-width:768px) {
    .NewsDetails {
        padding: 35px 0;
        overflow: hidden
    }

    .NewsDetails .top {
        display: none
    }

    .NewsDetails .top a i {
        margin: 0 10px
    }

    .NewsDetails .top a img {
        width: 15px
    }

    .DetailsPage {
        margin: 0;
        padding: 20px 10px
    }

    .DetailsPage .columns {
        display: block
    }

    .DetailsPage .columns .detailShare {
        margin: 10px 0 0
    }

    .DetailsPage .title {
        padding: 0 0 17px
    }

    .DetailsPage .columns .detailShare a {
        margin: 0 0 0 14px;
        width: 34px;
        height: 34px;
        line-height: 34px
    }

    .DetailsPage .intro {
        padding: 20px 0
    }

    .DetailsPage .bottom {
        padding: 20px 0 0;
        display: block
    }

    .DetailsPage .bottom>div {
        border-radius: 6px;
        padding: 15px
    }

    .DetailsPage .columns .date span:first-child {
        border-radius: 2px;
        padding: 2px 8px;
        margin: 0 13px 0 0
    }

    .DetailsPage .bottom>div:not(:last-child) {
        margin: 0 0 10px;
        width: auto
    }

    .DetailsPage .bottom>div:not(:last-child) span {
        border-radius: 2px;
        padding: 2px 7px;
        margin: 0 13px 0 0
    }

    .DetailsPage .bottom>div:not(:last-child) div {
        padding: 10px 0 0
    }

    .DetailsPage .bottom>div:last-child img {
        width: 11px;
        margin: 0 15px 0 0
    }

    .DetailsPage .bottom>div:last-child span br {
        display: none
    }
}

@media(min-width:768px) {
    .NewsDetails {
        padding: 11.073vw 0 4.427vw;
        overflow: hidden
    }

    .NewsDetails .top a i {
        margin: 0 .521vw
    }

    .NewsDetails .top a img {
        width: .781vw
    }

    .DetailsPage {
        margin: 4.167vw 0 0;
        padding: 2.167vw
    }

    .DetailsPage .title {
        padding: 0 0 .885vw
    }

    .DetailsPage .columns .detailShare a {
        margin: 0 0 0 .729vw;
        width: 1.771vw;
        height: 1.771vw;
        line-height: 1.771vw
    }

    .DetailsPage .intro {
        padding: 4.063vw 0 4.688vw
    }

    .DetailsPage .bottom {
        padding: 3.438vw 0 1.042vw
    }

    .DetailsPage .bottom>div {
        border-radius: .625vw;
        padding: 1.771vw 2.344vw 2.344vw
    }

    .DetailsPage .columns .date span:first-child {
        border-radius: .104vw;
        padding: .104vw .416667vw;
        margin: 0 .677vw 0 0
    }

    .DetailsPage .bottom>div:not(:last-child) {
        margin: 0 1.302vw 0 0;
        width: 25.99vw
    }

    .DetailsPage .bottom>div:not(:last-child) span {
        border-radius: .104vw;
        padding: .104vw .365vw;
        margin: 0 .677vw 0 0
    }

    .DetailsPage .bottom>div:not(:last-child) div {
        padding: 1.042vw 0 0
    }

    .DetailsPage .bottom>div:last-child img {
        width: .833vw;
        margin: 0 1.146vw 0 0
    }
}

@media(min-width:1600px) {
    .NewsDetails {
        padding: 185px 0 85px;
        overflow: hidden
    }

    .NewsDetails .top a i {
        margin: 0 10px
    }

    .NewsDetails .top a img {
        width: 15px
    }

    .DetailsPage {
        margin: 80px 0 0;
        padding: 80px
    }

    .DetailsPage .title {
        padding: 0 0 17px
    }

    .DetailsPage .columns .detailShare a {
        margin: 0 0 0 14px;
        width: 34px;
        height: 34px;
        line-height: 34px
    }

    .DetailsPage .intro {
        padding: 78px 0 40px
    }

    .DetailsPage .bottom {
        padding: 66px 0 20px
    }

    .DetailsPage .bottom>div {
        border-radius: 12px;
        padding: 34px 45px 45px
    }

    .DetailsPage .columns .date span:first-child {
        border-radius: 2px;
        padding: 2px 8px;
        margin: 0 13px 0 0
    }

    .DetailsPage .bottom>div:not(:last-child) {
        margin: 0 25px 0 0;
        width: 499px
    }

    .DetailsPage .bottom>div:not(:last-child) span {
        border-radius: 2px;
        padding: 2px 7px;
        margin: 0 13px 0 0
    }

    .DetailsPage .bottom>div:not(:last-child) div {
        padding: 20px 0 0
    }

    .DetailsPage .bottom>div:last-child img {
        width: 16px;
        margin: 0 22px 0 0
    }
}

.talents {
    overflow: hidden
}

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

.talents .title {
    font-size: var(--font-size56);
    color: #333
}

.talents .navigation {
    display: flex;
    align-items: center
}

.talents .navigation a {
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ccc
}

.talents .navigation a i {
    font-size: var(--font-size14);
    font-weight: 600
}

.talents .navigation a:nth-child(2) {
    transform: rotate(180deg)
}

.talents .navigation a:hover {
    color: var(--vi-color)
}

.talents ul li {
    position: relative;
    width: 100%;
    height: auto
}

.talents ul .image img {
    height: 100%;
    object-fit: cover
}

.talents ul .swiper-slide-next .image {
    transition: 1s
}

.talents ul .intro {
    font-size: var(--font-size22);
    color: #333;
    position: absolute;
    bottom: 0;
    left: 0
}

.talents ul .swiper-slide-next .intro {
    display: block
}

.talents ul .swiper-slide-active .intro {
    width: 100%;
    color: #fff;
    display: flex;
    align-items: flex-end;
    background: linear-gradient(0deg, rgb(0 0 0 / 60%), transparent)
}

@media(max-width:768px) {
    .talents {
        padding: 35px 0
    }

    .talents .top {
        margin: 0 0 20px
    }

    .talents .navigation {
        display: none
    }

    .talents .navigation a {
        width: 67px;
        height: 37px;
        border: 2px solid #ccc;
        margin: 0 0 0 7px
    }

    .talents .navigation a:hover {
        border: 2px solid var(--vi-color)
    }

    .talents ul {
        margin: 0;
        padding: 0
    }

    .talents ul .image,
    .talents ul .swiper-slide-next .image {
        height: auto
    }

    .talents ul .intro {
        padding: 0 5px 63px
    }

    .talents ul .swiper-slide-active .intro {
        padding: 20px;
        min-height: unset
    }

    .talents .swiper-pagination {
        position: unset;
        display: flex;
        justify-content: center;
        margin: 20px 0 0
    }

    .talents .swiper-pagination-bullet {
        width: 6px;
        height: 6px
    }

    .talents .swiper-pagination-bullet-active {
        width: 41px;
        background: var(--vi-color);
        border-radius: 50px
    }
}

@media(min-width:768px) {
    .talents {
        padding: 4.688vw 0 5.208vw
    }

    .talents .top {
        margin: 0 0 2.344vw
    }

    .talents .navigation a {
        width: 3.49vw;
        height: 1.927vw;
        border: .104vw solid #ccc;
        margin: 0 0 0 .365vw
    }

    .talents .navigation a:hover {
        border: .104vw solid var(--vi-color)
    }

    .talents ul {
        margin: 0 -7.813vw 0 0;
        padding: 0 32.396vw 0 0
    }

    .talents ul .image {
        height: 27.344vw
    }

    .talents ul .swiper-slide-next .image {
        height: 21.927vw
    }

    .talents ul .intro {
        padding: 0 .26vw 3.281vw
    }

    .talents ul .swiper-slide-active .intro {
        padding: 1.563vw 2.604vw;
        min-height: 9.844vw
    }
}

@media(min-width:1600px) {
    .talents {
        padding: 90px 0 100px
    }

    .talents .top {
        margin: 0 0 45px
    }

    .talents .navigation a {
        width: 67px;
        height: 37px;
        border: 2px solid #ccc;
        margin: 0 0 0 7px
    }

    .talents .navigation a:hover {
        border: 2px solid var(--vi-color)
    }

    .talents ul {
        margin: 0 -150px 0 0;
        padding: 0 622px 0 0
    }

    .talents ul .image {
        height: 525px
    }

    .talents ul .swiper-slide-next .image {
        height: 421px
    }

    .talents ul .intro {
        padding: 0 5px 63px
    }

    .talents ul .swiper-slide-active .intro {
        padding: 30px 50px;
        min-height: 189px
    }
}

.label {
    position: relative
}

.label .images .image {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: 1s;
    z-index: -1
}

.label .images .image.on {
    visibility: unset;
    transition: .5s;
    opacity: 1
}

.label .images .image img {
    height: 100%;
    object-fit: cover
}

.label ul {
    display: flex
}

.label ul li {
    flex: 1;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

.label ul li .title {
    font-weight: 300;
    font-size: var(--font-size20);
    color: #fff
}

.label ul li:hover {
    background: rgba(251, 108, 15, .95)
}

@media(max-width:768px) {
    .label ul {
        display: block;
        padding: 35px 0
    }

    .label ul li {
        padding: 20px 0;
        border-bottom: 1px solid #cfcfcf4a
    }

    .label ul li .icon img {
        height: 35px;
        margin: 0 0 15px
    }
}

.JoinUs .title {
    font-size: var(--font-size56)
}

.JoinUs .select input {
    background: #fb6c0f;
    border-radius: 50px;
    border: 1px solid #fb6c0f;
    font-weight: 400;
    font-size: var(--font-size16);
    color: #fff
}

.JoinUs .layui-form-select .layui-edge {
    width: auto;
    height: auto;
    border-width: 0;
    font-size: var(--font-size12);
    transform: translateY(-25%);
    color: #fff;
    font-weight: 600
}

.JoinUs .layui-form-selected .layui-edge {
    transform: translateY(-25%) rotate(180deg);
    margin: 0
}

.JoinUs .select input::-webkit-input-placeholder {
    color: #fff
}

.JoinUs .select input:-moz-placeholder {
    color: #fff
}

.JoinUs .select input::-moz-placeholder {
    color: #fff
}

.JoinUs .select input:-ms-input-placeholder {
    color: #fff
}

.JoinUs .layui-form-select dl {
    top: 110%
}

.JoinUs .layui-form-select dl dd {
    font-size: var(--font-size14);
    line-height: 3
}

.JoinUs .search {
    position: relative
}

.JoinUs .search input {
    font-size: var(--font-size14);
    color: #666;
    background: #f5f5f5;
    border-radius: 50px
}

.JoinUs .search input::-webkit-input-placeholder {
    color: #666
}

.JoinUs .search input:-moz-placeholder {
    color: #666
}

.JoinUs .search input::-moz-placeholder {
    color: #666
}

.JoinUs .search input:-ms-input-placeholder {
    color: #666
}

.JoinUs .searchBtn {
    position: absolute;
    font-size: var(--font-size19);
    font-weight: 600;
    top: 50%;
    transform: translateY(-50%);
    background: #f5f5f5
}

.JoinUs ul li .top {
    display: flex;
    align-items: center;
    border: 1px solid #e5e5e5;
    cursor: pointer
}

.JoinUs ul li .top span:first-child {
    font-size: var(--font-size20);
    color: #333;
    font-weight: 600;
    display: block;
    flex: 1
}

.JoinUs ul li .top span:nth-child(2) {
    font-size: var(--font-size14);
    color: #858585;
    display: block
}

.JoinUs ul li .top span:nth-child(3) {
    display: flex;
    align-items: center;
    flex: 1;
    color: #333
}

.JoinUs ul li .top span:nth-child(3) img {
    font-size: var(--font-size14);
    color: #333
}

.JoinUs ul li .top span:nth-child(4) {
    font-size: var(--font-size20);
    color: #525252;
    font-weight: 600;
    transition: .5s
}

.JoinUs ul li .intro {
    font-size: var(--font-size16);
    color: rgba(51, 51, 51, .6);
    line-height: 1.25;
    background: #f9f9f9;
    display: none
}

.JoinUs ul li .intro b {
    color: #171a20
}

.JoinUs ul li .intro a.youxiang {
    font-family: MONTSERRAT-REGULAR;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(251, 108, 15, 0);
    border-radius: 50px;
    border: 1px solid #fb6c0f;
    color: #fb6c0f;
    transition: .2s
}

.JoinUs ul li .intro a.youxiang:hover {
    border: 1px solid #fb6C0F00;
    color: #fff;
    background: #fb6c0f;
    transition: .2s
}

.JoinUs ul li .intro a.youxiang:hover img {
    filter: grayscale(100%) brightness(500%)
}

.JoinUs ul li.on .top {
    background: #f2f4f5;
    border: 1px solid #f2f4f5
}

.JoinUs ul li.on .top span:last-child {
    color: #fb6c0f;
    transform: rotate(45deg);
    transition: .5s
}

@media(max-width:768px) {
    .JoinUs {
        padding: 35px 0
    }

    .JoinUs .columns {
        padding: 20px 0;
        display: block
    }

    .JoinUs .select input {
        min-width: auto;
        line-height: 40px;
        height: 40px;
        padding: 0 20px
    }

    .JoinUs .layui-form-select .layui-edge {
        right: 20px
    }

    .JoinUs .search {
        margin: 15px 0 0
    }

    .JoinUs .search input {
        width: 100%;
        height: 40px;
        padding: 0 25px
    }

    .JoinUs .searchBtn {
        right: 24px;
        padding: 10px 0 10px 20px
    }

    .JoinUs ul {
        padding: 0 0 10px
    }

    .JoinUs ul li {
        margin: 0 0 20px
    }

    .JoinUs ul li .top {
        padding: 20px;
        flex-wrap: wrap
    }

    .JoinUs ul li .top span:first-child {
        min-width: auto;
        padding: 0 50px 0 0
    }

    .JoinUs ul li .top span:nth-child(2) {
        min-width: auto;
        padding: 10px 0;
        width: 100%;
        display: block
    }

    .JoinUs ul li .top span:nth-child(3) img {
        width: 11px;
        margin: 0 10px 0 0
    }

    .JoinUs ul li .intro {
        padding: 20px
    }

    .JoinUs ul li .intro a.youxiang {
        height: 40px;
        line-height: 40px;
        padding: 0 5px;
        margin: 20px -10px 0;
        font-size: 12px;
        width: calc(100% + 20px)
    }

    .JoinUs ul li .intro a.youxiang img {
        width: 14px;
        margin: 0 10px 0 0
    }
}

@media(min-width:768px) {
    .label ul {
        height: 40.625vw
    }

    .label ul li .icon img {
        height: 3.385vw;
        margin: 0 0 .781vw
    }

    .JoinUs {
        padding: 5.208vw 0 3.958vw
    }

    .JoinUs .columns {
        padding: 2.916667vw 0 1.563vw
    }

    .JoinUs .select input {
        min-width: 12.396vw;
        line-height: 3.125vw;
        height: 3.125vw;
        padding: 0 1.042vw
    }

    .JoinUs .layui-form-select .layui-edge {
        right: 1.042vw
    }

    .JoinUs .search {
        margin: 0 0 0 .781vw
    }

    .JoinUs .search input {
        width: 22.292vw;
        height: 3.125vw;
        padding: 0 1.302vw
    }

    .JoinUs .searchBtn {
        right: 1.25vw;
        padding: .521vw 0 .521vw 1.042vw
    }

    .JoinUs ul {
        padding: 0 0 2.344vw
    }

    .JoinUs ul li {
        margin: 0 0 .521vw
    }

    .JoinUs ul li .top {
        padding: 1.354vw 1.979vw
    }

    .JoinUs ul li:hover .top {
        background: #f2f4f5;
        border: 1px solid #f2f4f5
    }

    .JoinUs ul li .top span:first-child {
        min-width: 20.833vw;
        padding: 0 2.604vw 0 0
    }

    .JoinUs ul li .top span:nth-child(2) {
        min-width: 21.354vw;
        padding: 0 2.604vw 0 0
    }

    .JoinUs ul li .top span:nth-child(3) img {
        width: .885vw;
        margin: 0 .521vw 0 0
    }

    .JoinUs ul li .intro {
        padding: 2.604vw 6.51vw 2.969vw 2.344vw
    }

    .JoinUs ul li .intro a.youxiang {
        height: 2.448vw;
        line-height: 2.448vw;
        padding: 0 1.146vw 0 1.563vw;
        margin: 2.604vw 0 0
    }

    .JoinUs ul li .intro a.youxiang img {
        width: .938vw;
        margin: 0 .729vw 0 0
    }
}

@media(min-width:1600px) {
    .label ul {
        height: 780px
    }

    .label ul li .icon img {
        height: 65px;
        margin: 0 0 15px
    }

    .JoinUs {
        padding: 100px 0 76px
    }

    .JoinUs .columns {
        padding: 56px 0 30px
    }

    .JoinUs .select input {
        min-width: 238px;
        line-height: 60px;
        height: 60px;
        padding: 0 20px
    }

    .JoinUs .layui-form-select .layui-edge {
        right: 20px
    }

    .JoinUs .search {
        margin: 0 0 0 15px
    }

    .JoinUs .search input {
        width: 428px;
        height: 60px;
        padding: 0 25px
    }

    .JoinUs .searchBtn {
        right: 24px;
        padding: 10px 0 10px 20px
    }

    .JoinUs ul {
        padding: 0 0 45px
    }

    .JoinUs ul li {
        margin: 0 0 10px
    }

    .JoinUs ul li .top {
        padding: 26px 38px
    }

    .JoinUs ul li .top span:first-child {
        min-width: 400px;
        padding: 0 50px 0 0
    }

    .JoinUs ul li .top span:nth-child(2) {
        min-width: 410px;
        padding: 0 50px 0 0
    }

    .JoinUs ul li .top span:nth-child(3) img {
        width: 17px;
        margin: 0 10px 0 0
    }

    .JoinUs ul li .intro {
        padding: 50px 125px 57px 45px
    }

    .JoinUs ul li .intro a.youxiang {
        height: 47px;
        line-height: 47px;
        padding: 0 22px 0 30px;
        margin: 50px 0 0
    }

    .JoinUs ul li .intro a.youxiang img {
        width: 18px;
        margin: 0 14px 0 0
    }
}

.leader {
    border-top: 1px solid #f2f4f5
}

.leader .top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column
}

.Capable ul li .title,
.leader .top .title {
    font-size: var(--font-size56);
    color: #1b1f26;
    line-height: 1.1;
    text-align: center;
    position: relative;
    padding-bottom: 20px
}

.Capable ul li .title::before,
.leader .top .title::before {
    position: absolute;
    content: ' ';
    max-width: 200px;
    width: 20%;
    height: 4px;
    background-color: #fb7d20;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%)
}

.leader .top .intro {
    font-weight: 400;
    font-size: var(--font-size20);
    color: #7a7a7a;
    line-height: 1.3;
    margin-top: 20px
}

.leader ul {
    display: flex
}

.leader ul li {
    position: relative;
    height: 100%
}

.leader ul li:last-child {
    margin-right: 0
}

.leader ul li .text {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%
}

.leader ul li .text .title {
    font-size: var(--font-size20);
    color: #fff;
    line-height: unset;
    font-family: MONTSERRAT-REGULAR;
    font-weight: 400
}

.leader ul li .text .intro {
    font-weight: 400;
    font-size: var(--font-size16);
    color: #fff;
    line-height: 1.3;
    display: none
}

.leader ul li:hover .text {
    background: var(--vi-color);
    transition: .5s
}

@media(max-width:768px) {
    .leader {
        padding: 30px 0 15px
    }

    .leader .top {
        display: block
    }

    .leader .top .title {
        max-width: 100%;
        width: 100%;
        padding: 0 0 15px;
        line-height: unset
    }

    .leader ul li .text .title {
        font-size: 18px
    }

    .leader .top .intro {
        max-width: 100%;
        width: 100%
    }

    .leader ul {
        padding: 35px 0 0;
        display: block
    }

    .leader ul li {
        width: 100%;
        margin: 0 0 20px
    }

    .leader ul li .image img {
        object-fit: cover
    }

    .leader ul li:first-child,
    .leader ul li:nth-child(3) {
        padding: 0
    }

    .leader ul li .text {
        padding: 30px 20px
    }

    .leader ul li .text .intro {
        padding: 20px 0 10px
    }
}

@media(min-width:768px) {
    .leader {
        padding: 5.729vw 0
    }

    .leader .top .intro,
    .leader .top .title {
        max-width: 100%;
        width: 100%
    }

    .leader ul {
        padding: 5.208vw 0 0
    }

    .leader ul li {
        width: calc(33.33% - 2.083vw);
        margin: 0 3.125vw 0 0
    }

    .leader ul li:first-child {
        padding: 5.781vw 0 0
    }

    .leader ul li:nth-child(3) {
        padding: 6.406vw 0 0
    }

    .leader ul li .text {
        padding: 3.385vw 2.344vw 2.083vw
    }

    .leader ul li .text .intro {
        padding: 1.042vw 0 .521vw
    }
}

@media(min-width:1600px) {
    .leader {
        padding: 110px 0
    }

    .leader .top .title {
        max-width: 100%;
        width: 100%;
        text-align: center
    }

    .leader .top .intro {
        max-width: 100%;
        width: 100%
    }

    .leader ul {
        padding: 100px 0 0
    }

    .leader ul li {
        width: calc(33.33% - 40px);
        margin: 0 60px 0 0
    }

    .leader ul li:first-child {
        padding: 111px 0 0
    }

    .leader ul li:nth-child(3) {
        padding: 123px 0 0
    }

    .leader ul li .text {
        padding: 65px 45px 40px
    }

    .leader ul li .text .intro {
        padding: 20px 0 10px
    }
}

.Capable {
    background: #f7f9fa;
    overflow: hidden
}

.Capable ul li {
    display: flex
}

.Capable ul li .text {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.Capable ul li .image {
    width: 50%
}

.Capable ul li .image img {
    height: 100%;
    object-fit: cover
}

.Capable ul li:nth-child(odd) {
    flex-direction: row-reverse
}

.Capable ul li .title {
    font-size: var(--font-size38);
    color: #3b3b3b;
    line-height: 1.15
}

.Capable ul li .intro {
    font-weight: 400;
    font-size: var(--font-size16);
    color: #7a7a7a;
    line-height: 1.35
}

.Global {
    position: relative;
    overflow: hidden
}

.Global .text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.Global .text .auto_1600 {
    height: 100%
}

.Global .columns {
    flex-direction: column;
    height: 100%
}

.Global .title {
    font-size: var(--font-size56);
    color: #333;
    font-weight: 400;
    font-family: MONTSERRAT-REGULAR
}

.Global .intro {
    font-size: var(--font-size16);
    flex: 1;
    font-weight: 400;
    font-size: var(--font-size16);
    color: #7a7a7a
}

.Global .date .years {
    display: flex;
    align-items: flex-end
}

.Global .date .years span:first-child {
    color: #fc6c0f;
    line-height: .8;
    display: inline-block;
    font-weight: 600
}

.Global .date .years span:nth-child(2) {
    font-weight: 600;
    font-size: var(--font-size19);
    color: #fc6c0f
}

.Global .date .Htitle {
    font-weight: 400;
    font-size: var(--font-size14);
    color: #333
}

@media(max-width:768px) {
    .Capable ul {
        margin: 0
    }

    .Capable ul li {
        display: none
    }

    .Capable ul li .text,
    .Capable ul li:nth-child(odd) .text {
        padding: 20px
    }

    .Capable ul li .intro {
        padding: 35px 0 0
    }

    .Global .text {
        position: unset
    }

    .Global .images {
        position: relative
    }

    .Global .columns {
        padding: 35px 0
    }

    .Global .title {
        padding: 0 0 20px;
        line-height: unset
    }

    .Global .intro {
        max-width: 100%
    }

    .Global .date .years {
        padding: 15px 0
    }

    .Global .date .years span:first-child {
        font-size: 65px
    }

    .Global .date .Htitle {
        padding: 0 15px
    }
}

@media(min-width:768px) {
    .Capable ul {
        margin: 0 -8.333vw
    }

    .Capable ul li .text {
        padding: 5.208vw 8.333vw 5.208vw 5.208vw
    }

    .Capable ul li:nth-child(odd) .text {
        padding: 5.208vw 5.208vw 5.208vw 8.333vw
    }

    .Capable ul li .intro {
        padding: 1.823vw 0 0
    }

    .Global .columns {
        padding: 4.688vw 0 4.167vw
    }

    .Global .title {
        padding: 0 0 1.563vw
    }

    .Global .intro {
        max-width: 62.5vw
    }

    .Global .date .years {
        padding: 0 0 .781vw
    }

    .Global .date .years span:first-child {
        font-size: 10.156vw
    }

    .Global .date .Htitle {
        padding: 0 1.302vw
    }
}

@media(min-width:1600px) {
    .Capable ul {
        margin: 0 -160px
    }

    .Capable ul li .text {
        padding: 100px 160px 100px 100px
    }

    .Capable ul li:nth-child(odd) .text {
        padding: 100px 100px 100px 160px
    }

    .Capable ul li .intro {
        padding: 35px 0 0
    }

    .Global .columns {
        padding: 90px 0 80px
    }

    .Global .title {
        padding: 0 0 30px
    }

    .Global .intro {
        max-width: 1200px
    }

    .Global .date .years {
        padding: 0 0 15px
    }

    .Global .date .years span:first-child {
        font-size: 195px
    }

    .Global .date .Htitle {
        padding: 0 25px
    }
}

.Global ul li .title {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: var(--font-size14);
    color: #333;
    min-width: max-content
}

.Global ul li {
    position: absolute;
    z-index: 2;
    cursor: pointer
}

.Global ul li .dian {
    position: relative
}

.Global ul li i {
    background: #fc6c0f;
    border-radius: 50%;
    position: relative;
    z-index: 3;
    display: block
}

.Global ul li span:first-child {
    background: #fc6c0f;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    transform: translate(-50%, -50%)
}

.Global ul li span:nth-child(2),
.Global ul li span:nth-child(3),
.Global ul li span:nth-child(4) {
    content: '';
    z-index: 10;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    border: 1px solid #fc6c0f;
    opacity: .3;
    -webkit-animation: 3s linear .8s infinite scale2;
    animation: 3s linear infinite scale2;
    transform: translate(-50%, -50%)
}

.Global ul li span:nth-child(3) {
    animation-delay: 1s
}

.Global ul li span:nth-child(4) {
    animation-delay: 2s
}

.Global ul li.on .title {
    color: var(--vi-color)
}

.Global .contact dl {
    position: absolute;
    z-index: 2;
    background: #fff;
    transform: translateX(-50%);
    opacity: 0;
    transition: .3s;
    visibility: hidden
}

.Global .contact dl.on {
    opacity: 1;
    transition: .3s;
    visibility: unset
}

.Global .contact dl dd,
.Global .contact dl dd>div:first-child {
    display: flex;
    align-items: center
}

@media(max-width:768px) {
    .Global .list dl {
        max-width: 550px;
        padding: 50px 50px 60px 40px
    }

    .Global .list dl dt {
        padding: 0 0 15px
    }

    .Global .list dl dd {
        padding: 35px 0 0
    }

    .Global .list dl dd img {
        width: 16px;
        margin: 0 9px 0 0
    }

    .Global .list dl dd .intro {
        line-height: 1.1;
        padding: 5px 0 0
    }

    .Global ul li i {
        width: 2px;
        height: 2px
    }

    .Global ul li .title {
        padding: 0 20px 0 0;
        left: 0;
        top: 50%;
        zoom: .8;
        transform: translateX(-100%) translateY(-50%)
    }

    .Global ul li span:first-child {
        width: 1px;
        height: 1px
    }

    .Global ul li span:nth-child(2),
    .Global ul li span:nth-child(3),
    .Global ul li span:nth-child(4) {
        width: 1px;
        height: 1px;
        -webkit-animation: 2s linear infinite scale2;
        animation: 2s linear infinite scale2
    }

    .Global ul li span:nth-child(4) {
        display: none
    }

    @keyframes scale2 {
        0% {
            width: 2px;
            height: 2px;
            background: rgba(252, 108, 15, .5);
            opacity: .6
        }

        30% {
            opacity: .6
        }

        100% {
            width: 15px;
            height: 15px;
            background: rgba(252, 108, 15, 0);
            opacity: 0
        }
    }

    @-webkit-keyframes scale2 {
        0% {
            width: 2px;
            height: 2px;
            background: rgba(252, 108, 15, .5);
            opacity: .6
        }

        30% {
            opacity: .6
        }

        100% {
            width: 15px;
            height: 15px;
            background: rgba(252, 108, 15, 0);
            opacity: 0
        }
    }

    .Global .contact dl {
        transform: unset;
        position: unset;
        padding: 0 5%;
        margin: 20px 0 0;
        width: 100%;
        display: none
    }

    .Global .contact dl.on {
        display: block
    }

    .Global .contact dl dd img {
        width: 13px;
        margin: 0 8px 0 0
    }

    .Global .contact dl dd .intro {
        margin: 0 0 0 8px
    }

    .Global .contact dl dd {
        padding: 7px 0
    }
}

@media(min-width:768px) {
    .Global .list dl {
        max-width: 28.646vw;
        padding: 2.604vw 2.604vw 3.125vw 2.083vw
    }

    .Global .list dl dt {
        padding: 0 0 .781vw
    }

    .Global .list dl dd {
        padding: 1.823vw 0 0
    }

    .Global .list dl dd img {
        width: .833vw;
        margin: 0 .469vw 0 0
    }

    .Global .list dl dd .intro {
        line-height: 1.1;
        padding: .26vw 0 0
    }

    .Global ul li i {
        width: .208vw;
        height: .208vw
    }

    .Global ul li .title {
        padding: 1.042vw 0 0
    }

    .Global ul li span:first-child {
        width: .208vw;
        height: .208vw
    }

    .Global ul li span:nth-child(2),
    .Global ul li span:nth-child(3),
    .Global ul li span:nth-child(4) {
        width: .26vw;
        height: .26vw
    }

    @keyframes scale2 {
        0% {
            width: .26vw;
            height: .26vw;
            background: rgba(252, 108, 15, .5);
            opacity: .6
        }

        30% {
            opacity: .6
        }

        100% {
            width: 3.125vw;
            height: 3.125vw;
            background: rgba(252, 108, 15, 0);
            opacity: 0
        }
    }

    @-webkit-keyframes scale2 {
        0% {
            width: .26vw;
            height: .26vw;
            background: rgba(252, 108, 15, .5);
            opacity: .6
        }

        30% {
            opacity: .6
        }

        100% {
            width: 3.125vw;
            height: 3.125vw;
            background: rgba(252, 108, 15, 0);
            opacity: 0
        }
    }

    .Global .contact dl {
        width: 26.041667vw;
        padding: 1.041667vw 1.5625vw;
        margin: 2.604167vw 0 0
    }

    .Global .contact dl dd {
        padding: .364583vw 0
    }

    .Global .contact dl dd img {
        width: .833333vw;
        margin: 0 .520833vw 0 0
    }

    .Global .contact dl dd .intro {
        margin: 0 0 0 .520833vw
    }
}

@media(min-width:1600px) {
    .Global .list dl {
        max-width: 550px;
        padding: 50px 50px 60px 40px
    }

    .Global .list dl dt {
        padding: 0 0 15px
    }

    .Global .list dl dd {
        padding: 35px 0 0
    }

    .Global .list dl dd img {
        width: 16px;
        margin: 0 9px 0 0
    }

    .Global .list dl dd .intro {
        line-height: 1.1;
        padding: 5px 0 0
    }

    .Global ul li i {
        width: 4px;
        height: 4px
    }

    .Global ul li .title {
        padding: 20px 0 0
    }

    .Global ul li span:first-child {
        width: 4px;
        height: 4px
    }

    .Global ul li span:nth-child(2),
    .Global ul li span:nth-child(3),
    .Global ul li span:nth-child(4) {
        width: 5px;
        height: 5px
    }

    @keyframes scale2 {
        0% {
            width: 5px;
            height: 5px;
            background: rgba(252, 108, 15, .5);
            opacity: .6
        }

        30% {
            opacity: .6
        }

        100% {
            width: 60px;
            height: 60px;
            background: rgba(252, 108, 15, 0);
            opacity: 0
        }
    }

    @-webkit-keyframes scale2 {
        0% {
            width: 5px;
            height: 5px;
            background: rgba(252, 108, 15, .5);
            opacity: .6
        }

        30% {
            opacity: .6
        }

        100% {
            width: 60px;
            height: 60px;
            background: rgba(252, 108, 15, 0);
            opacity: 0
        }
    }

    .Global .contact dl {
        width: 500px;
        padding: 20px 30px;
        margin: 50px 0 0
    }

    .Global .contact dl dd {
        padding: 7px 0
    }

    .Global .contact dl dd img {
        width: 16px;
        margin: 0 10px 0 0
    }

    .Global .contact dl dd .intro {
        margin: 0 0 0 10px
    }
}

.Milestones {
    overflow: hidden;
    position: relative
}

.Milestones .title {
    font-size: var(--font-size56);
    color: #333
}

.Milestones .intro {
    font-weight: 400;
    font-size: var(--font-size16);
    color: #7a7a7a
}

.Milestones ul li {
    height: auto;
    background: #fff
}

.Milestones ul li .logo {
    text-align: right
}

.Milestones ul li .title {
    font-size: var(--font-size60);
    color: #333;
    line-height: .8
}

.Milestones ul li .Htitle {
    font-weight: 600;
    font-size: var(--font-size18);
    color: #333;
    position: relative
}

.Milestones ul li .intro {
    font-size: var(--font-size16);
    color: #7a7a7a
}

.Milestones ul li .Htitle::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    left: 0;
    top: 50%;
    transform: translateY(-50%)
}

.Milestones dl {
    overflow: unset
}

.Milestones dl dd {
    flex: 1
}

.Milestones dl .Stitle {
    font-weight: 400;
    font-size: var(--font-size20);
    color: #333;
    display: inline-block
}

.Milestones dl dd:not(:first-child) .Stitle {
    transform: translateX(-45%)
}

.Milestones dl .dian span {
    display: block;
    position: relative
}

.Milestones dl .dian span:nth-child(2) {
    background: #fc6c0f;
    border-radius: 50%;
    position: relative;
    display: block
}

.Milestones dl .on .dian span:nth-child(2)::after,
.Milestones dl .on .dian span:nth-child(2)::before {
    content: '';
    background: #fc6c0f;
    opacity: .3;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 50%;
    -webkit-animation: 3s linear infinite scale3;
    animation: 3s linear infinite scale3
}

.Milestones dl .on .dian span:nth-child(2)::before {
    -webkit-animation-delay: 1.5s
}

.Milestones .swiper-pagination-progressbar {
    width: 100%;
    position: unset;
    background: #e1e6e1;
    height: 1px
}

.Milestones .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    width: 100%;
    background: #fc6c0f;
    transform: translate3d(0, 0, 0) scaleX(0) scaleY(1)
}

.Milestones dl .swiper-pagination span {
    width: 100%;
    background: #fc6c0f;
    display: block;
    height: 100%;
    transition-duration: .3s;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top
}

.Milestones .list {
    position: relative
}

.Milestones .list .swiper-button-next,
.Milestones .list .swiper-button-prev {
    background: unset;
    width: auto;
    bottom: 0;
    height: auto;
    top: unset;
    font-size: var(--font-size18);
    transform: translateY(40%);
    color: #fc6c0f;
    font-weight: 600
}

.Milestones .list .swiper-button-next {
    right: 0
}

.Milestones .list .swiper-button-prev {
    left: 0
}

@keyframes scale3 {
    0% {
        transform: scale(1)
    }

    100% {
        transform: scale(4);
        opacity: 0
    }
}

@-webkit-keyframes scale3 {
    0% {
        transform: scale(1)
    }

    100% {
        transform: scale(4);
        opacity: 0
    }
}

@media(max-width:768px) {
    .Milestones {
        padding: 35px 0
    }

    .Milestones .title {
        padding: 0 0 15px
    }

    .Milestones .intro {
        padding: 0 0 30px
    }

    .Milestones ul {
        margin: 0;
        padding: 0
    }

    #swiper_img .swiper-slide {
        width: 100%
    }

    .Milestones ul li {
        width: 100%;
        padding: 20px
    }

    .Milestones ul li .logo img {
        width: 50px
    }

    .Milestones ul li .title {
        padding: 0 0 20px 20px
    }

    .Milestones ul li .Htitle {
        padding: 0 0 0 20px;
        margin: 0 0 10px
    }

    .Milestones ul li .intro {
        padding: 0 0 0 20px
    }

    .Milestones ul li .intro br {
        display: none
    }

    .Milestones ul li .Htitle::after {
        width: 8px;
        height: 8px;
        border: 2px solid #fc6c0f
    }

    .Milestones dl {
        padding: 25px 0 0;
        width: 100%
    }

    .Milestones dl dd {
        width: 33.33%;
        flex: none
    }

    .Milestones dl dd .dian {
        display: flex;
        justify-content: center
    }

    .Milestones dl .Stitle {
        padding: 0 0 20px;
        display: block;
        transform: unset;
        text-align: center;
        margin: auto
    }

    .Milestones dl .on .Stitle {
        font-weight: 600
    }

    .Milestones dl dd:not(:first-child) .Stitle {
        display: block;
        transform: unset;
        text-align: center;
        margin: auto
    }

    .Milestones dl .dian span:nth-child(2) {
        width: 3px;
        height: 3px;
        margin: -2px 0 0
    }

    .Milestones dl .on .dian span:nth-child(2) {
        width: 6px;
        height: 6px;
        margin: -3.5px 0 0
    }

    .Milestones dl .on .dian span:nth-child(2)::after,
    .Milestones dl .on .dian span:nth-child(2)::before {
        width: 6px;
        height: 6px
    }

    .Milestones .swiper-pagination-progressbar {
        margin: -3px 0 0
    }

    .Milestones dl .swiper-pagination span {
        display: none
    }
}

@media(min-width:768px) {
    .Milestones {
        padding: 5.208vw 0 6.25vw
    }

    .Milestones .title {
        padding: 0 0 1.302vw
    }

    .Milestones .intro {
        padding: 0 0 3.646vw
    }

    .Milestones ul {
        margin: 0 -8.333vw 0 0;
        padding: 0 19.375vw 0 0
    }

    #swiper_img .swiper-slide {
        width: 35.573vw
    }

    .Milestones ul li {
        width: 35.573vw;
        padding: 1.563vw 2.292vw 4.167vw 3.385vw
    }

    .Milestones ul li .logo img {
        width: 3.594vw
    }

    .Milestones ul li .title {
        padding: .469vw 0 2.865vw 1.042vw
    }

    .Milestones ul li .Htitle {
        padding: 0 0 0 1.042vw;
        margin: 0 0 .521vw
    }

    .Milestones ul li .intro {
        padding: 0 0 0 1.042vw
    }

    .Milestones ul li .Htitle::after {
        width: .417vw;
        height: .417vw;
        border: .104vw solid #fc6c0f
    }

    .Milestones dl {
        padding: 3.906vw 0 0;
        margin: 0 2.604vw
    }

    .Milestones dl .Stitle {
        padding: 0 0 1.042vw
    }

    .Milestones dl .dian span:nth-child(2) {
        width: .156vw;
        height: .156vw;
        margin: -.104vw 0 0
    }

    .Milestones dl .on .dian span:nth-child(2) {
        width: .313vw;
        height: .313vw;
        margin: -.182vw 0 0
    }

    .Milestones dl .on .dian span:nth-child(2)::after,
    .Milestones dl .on .dian span:nth-child(2)::before {
        width: .313vw;
        height: .313vw
    }

    .Milestones .swiper-pagination-progressbar {
        margin: -.156vw 0 0
    }
}

@media(min-width:1600px) {
    .Milestones {
        padding: 100px 0 120px
    }

    .Milestones .title {
        padding: 0 0 25px
    }

    .Milestones .intro {
        padding: 0 0 70px
    }

    .Milestones ul {
        margin: 0 -160px 0 0;
        padding: 0 372px 0 0
    }

    #swiper_img .swiper-slide {
        width: 683px
    }

    .Milestones ul li {
        width: 683px;
        padding: 30px 44px 80px 65px
    }

    .Milestones ul li .logo img {
        width: 69px
    }

    .Milestones ul li .title {
        padding: 9px 0 55px 20px
    }

    .Milestones ul li .Htitle {
        padding: 0 0 0 20px;
        margin: 0 0 10px
    }

    .Milestones ul li .intro {
        padding: 0 0 0 20px
    }

    .Milestones ul li .Htitle::after {
        width: 8px;
        height: 8px;
        border: 2px solid #fc6c0f
    }

    .Milestones dl {
        padding: 75px 0 0;
        margin: 0 50px
    }

    .Milestones dl .Stitle {
        padding: 0 0 20px
    }

    .Milestones dl .dian span:nth-child(2) {
        width: 3px;
        height: 3px;
        margin: -2px 0 0
    }

    .Milestones dl .on .dian span:nth-child(2) {
        width: 6px;
        height: 6px;
        margin: -3.5px 0 0
    }

    .Milestones dl .on .dian span:nth-child(2)::after,
    .Milestones dl .on .dian span:nth-child(2)::before {
        width: 6px;
        height: 6px
    }

    .Milestones .swiper-pagination-progressbar {
        margin: -3px 0 0
    }
}

.monitoring {
    overflow: hidden
}

.monitoring .top {
    display: flex;
    justify-content: center
}

.monitoring .top .list {
    background: #f2f4f5;
    text-align: center;
    cursor: pointer
}

.monitoring .top .list .image {
    margin: auto
}

.monitoring .top .list .image img {
    width: auto
}

.monitoring .top .list .title {
    font-size: var(--font-size16);
    color: #333;
    line-height: unset
}

.monitoring .top .list.on,
.monitoring .top .list:hover {
    background: #fc6c0f
}

.monitoring .top .list.on .title,
.monitoring .top .list:hover .title {
    color: #fff
}

.monitoring ul li {
    position: relative
}

.monitoring ul li .content {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    animation: 2s linear fadeInUp;
    -webkit-animation: 2s fadeInUp
}

.monitoring ul li .content .img {
    flex: 1;
    text-align: center
}

.monitoring ul li .title {
    font-weight: 500;
    font-size: var(--font-size56);
    color: #fff;
    font-family: MONTSERRAT-REGULAR
}

.monitoring ul li .intro {
    font-weight: 400;
    font-size: var(--font-size20);
    color: #fff;
    line-height: 1.45;
    opacity: .8
}

.monitoring ul li .content a {
    border: 1px solid #fff;
    display: inline-block
}

.monitoring ul li .content a:hover {
    border: 1px solid var(--vi-color)
}

.monitoring ul li .switchRight {
    position: absolute;
    top: 50%;
    background: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    z-index: 1;
    cursor: pointer;
    transition: .3s
}

.monitoring ul li .switchRight:hover {
    box-shadow: 0 0 20px 0 #ef803a;
    transition: .3s
}

.monitoring ul li .switchRight .iconImg1 {
    background: #fff;
    border: 1px solid #373737
}

.monitoring ul li .content,
.monitoring ul li .list2 {
    display: none;
    position: relative
}

.monitoring ul li .list2>.image img,
.monitoring ul li>.image img {
    position: absolute;
    height: 100%;
    object-fit: cover
}

.monitoring ul li .content.on,
.monitoring ul li .list2.on {
    display: block
}

@media(max-width:768px) {
    .monitoring .top {
        width: 90%;
        padding: 15px 0;
        margin: 20px auto;
        justify-content: unset;
        overflow: auto
    }

    .monitoring .top .list {
        min-width: 80%;
        height: auto;
        padding: 20px;
        margin: 0 20px 0 0
    }

    .monitoring .top .list .image {
        width: auto
    }

    .monitoring .top .list .image img {
        height: 40px
    }

    .monitoring .top .list .title {
        padding: 15px 0 0
    }

    .monitoring ul li .image img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        z-index: -1
    }

    .monitoring ul li .content {
        padding: 35px 0;
        position: unset
    }

    .monitoring ul li .content .columns {
        display: block
    }

    .monitoring ul li:nth-child(2) .content {
        padding: 35px 0
    }

    .monitoring ul li .text {
        max-width: 100%;
        width: 100%;
        margin: 0;
        padding: 0
    }

    .monitoring ul li .text .icon {
        margin: 0 0 25px
    }

    .monitoring ul li .text .icon img {
        width: 40px
    }

    .monitoring ul li .content .img {
        padding: 30px 0 0
    }

    .monitoring ul li:first-child .content .img img {
        width: auto
    }

    .monitoring ul li:nth-child(2) .content .img img {
        width: 60%
    }

    .monitoring ul li .title {
        padding: 0 0 20px
    }

    .monitoring ul li .intro {
        padding: 0 0 35px
    }

    .monitoring ul li .content a {
        margin: 0 10px 0 0
    }

    .monitoring ul li .content a img {
        width: 120px
    }

    .monitoring ul li .switchRight {
        top: 65%;
        right: -69px;
        width: 138px;
        height: 138px;
        padding: 0 70px 0 10px
    }

    .monitoring ul li .switchRight .iconImg1 {
        border-radius: 6px;
        margin: 0 0 10px
    }

    .monitoring ul li .switchRight .iconImg1 img {
        width: 31px
    }

    .monitoring ul li .switchRight .iconImg2 img {
        width: 16px
    }
}

@media(min-width:768px) {
    .monitoring .top {
        padding: 3.646vw 0 2.604vw
    }

    .monitoring .top .list {
        width: 21.198vw;
        height: 11.875vw;
        padding: 1.823vw 1.302vw 1.302vw;
        margin: 0 .573vw
    }

    .monitoring .top .list .image {
        width: 9.375vw
    }

    .monitoring .top .list .image img {
        height: 5.729vw
    }

    .monitoring .top .list .title {
        padding: .781vw 0 0
    }

    .monitoring ul li .content {
        padding: 8.333vw 0 8.073vw
    }

    .monitoring ul li:nth-child(2) .content {
        padding: 5.208vw 0
    }

    .monitoring ul li .text {
        max-width: 36.458vw;
        width: 36.458vw;
        margin: 0 5.208vw 0 0;
        padding: 1.563vw 0 0
    }

    .monitoring ul li .text .icon {
        margin: 0 0 2.344vw
    }

    .monitoring ul li .text .icon img {
        width: 3.802vw
    }

    .monitoring ul li:first-child .content .img img {
        width: 32.969vw
    }

    .monitoring ul li:nth-child(2) .content .img img {
        width: 21.198vw
    }

    .monitoring ul li .title {
        padding: 0 0 1.563vw
    }

    .monitoring ul li .intro {
        padding: 0 0 4.948vw
    }

    .monitoring ul li .content a {
        margin: 0 .521vw 0 0;
        width: 7.135vw
    }

    .monitoring ul li .content a img {
        width: 7.135vw
    }

    .monitoring ul li .switchRight {
        top: 50%;
        right: -5.99vw;
        width: 12.396vw;
        height: 12.396vw;
        padding: 0 5.99vw 0 1.042vw
    }

    .monitoring ul li .switchRight .iconImg1 {
        border-radius: .573vw;
        margin: 0 0 .938vw
    }

    .monitoring ul li .switchRight .iconImg1 img {
        width: 2.656vw
    }

    .monitoring ul li .switchRight .iconImg2 img {
        width: .938vw
    }
}

@media(min-width:1600px) {
    .monitoring .top {
        padding: 70px 0 50px
    }

    .monitoring .top .list {
        width: 407px;
        height: 228px;
        padding: 35px 25px 25px;
        margin: 0 11px
    }

    .monitoring .top .list .image {
        width: 180px
    }

    .monitoring .top .list .image img {
        height: 110px
    }

    .monitoring .top .list .title {
        padding: 15px 0 0
    }

    .monitoring ul li .content {
        padding: 160px 0 155px
    }

    .monitoring ul li:nth-child(2) .content {
        padding: 100px 0
    }

    .monitoring ul li .text {
        max-width: 700px;
        width: 700px;
        margin: 0 100px 0 0;
        padding: 30px 0 0
    }

    .monitoring ul li .text .icon {
        margin: 0 0 45px
    }

    .monitoring ul li .text .icon img {
        width: 73px
    }

    .monitoring ul li:first-child .content .img img {
        width: 633px
    }

    .monitoring ul li:nth-child(2) .content .img img {
        width: 407px
    }

    .monitoring ul li .title {
        padding: 0 0 30px
    }

    .monitoring ul li .intro {
        padding: 0 0 95px
    }

    .monitoring ul li .content a {
        margin: 0 10px 0 0;
        width: 137px
    }

    .monitoring ul li .content a img {
        width: 137px
    }

    .monitoring ul li .switchRight {
        top: 50%;
        right: -115px;
        width: 238px;
        height: 238px;
        padding: 0 115px 0 20px
    }

    .monitoring ul li .switchRight .iconImg1 {
        border-radius: 11px;
        margin: 0 0 18px
    }

    .monitoring ul li .switchRight .iconImg1 img {
        width: 51px
    }

    .monitoring ul li .switchRight .iconImg2 img {
        width: 18px
    }
}

.module_HL1GBCD1 .layui-laypage {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0
}

.module_HL1GBCD1 .layui-laypage a,
.module_HL1GBCD1 .layui-laypage span {
    padding: 0;
    font-size: var(--font-size13);
    color: #353535;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f2f4f5;
    border: unset
}

.module_HL1GBCD1 .layui-laypage .layui-laypage-curr .layui-laypage-em {
    background-color: var(--vi-color)
}

.module_HL1GBCD1 .layui-laypage a:hover {
    background-color: var(--vi-color);
    color: #fff
}

.JoinUs .module_HL1GBCD1 .layui-laypage a,
.JoinUs .module_HL1GBCD1 .layui-laypage span {
    background: #fff
}

@media(max-width:768px) {

    .module_HL1GBCD1 .layui-laypage a,
    .module_HL1GBCD1 .layui-laypage span {
        display: none
    }

    .module_HL1GBCD1 .loadMore {
        text-align: center
    }

    .module_HL1GBCD1 .loadMore a {
        background: #fc6c0f;
        color: #fff;
        display: inline-block;
        margin: auto;
        padding: 7px 30px;
        font-size: 14px;
        border-radius: 50px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavList .mThreeNav dl dt {
        font-size: 12px;
        padding: 15px 55px;
        position: relative
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavList .mThreeNav dl:not(:last-child) {
        border-bottom: 1px solid #ebebeb
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNavList .mThreeNav dd {
        display: none
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNavList .mThreeNav dd a {
        display: block;
        padding: 15px;
        border-top: 1px solid #ebebeb;
        text-align: center
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNavList .mThreeNav dd a p {
        margin-top: 10px
    }
}

@media(min-width:768px) {

    .module_HL1GBCD1 .layui-laypage a,
    .module_HL1GBCD1 .layui-laypage span {
        margin: 0 .365vw;
        width: 2.5vw;
        height: 2.5vw
    }
}

@media(max-width:992px) {
    .new_warp {
        flex-direction: column
    }

    .new_warp .left {
        position: relative;
        top: 0;
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%
    }

    .DetailsPage {
        flex: 0 0 100%;
        max-width: 100%
    }
}

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 30px, 0);
        transform: translate3d(0, 30px, 0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 30px, 0);
        transform: translate3d(0, 30px, 0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}

@-webkit-keyframes incline {
    0% {
        opacity: .5;
        transform: rotate(15deg) translateY(100%)
    }

    to {
        opacity: 1;
        transform: rotate(0) translateY(0)
    }
}

@keyframes incline {
    0% {
        opacity: .5;
        transform: rotate(15deg) translateY(100%)
    }

    to {
        opacity: 1;
        transform: rotate(0) translateY(0)
    }
}

.incline {
    overflow: hidden
}

.incline a>span,
.incline h1,
.incline>span {
    -webkit-animation-name: incline;
    animation-name: incline;
    transform-origin: left;
    display: block;
    max-width: max-content;
    margin: auto;
    font-family: MONTSERRAT-REGULAR;
    font-weight: 500
}

.incline h1 {
    font-size: var(--font-size64);
    display: inline-block
}

@-webkit-keyframes rotate {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

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

    to {
        transform: rotate(360deg)
    }
}

.rotate {
    -webkit-animation-name: rotate;
    animation-name: rotate
}

@media(min-width:992px) {
    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .subNav {
        display: block;
        width: 22.395833vw;
        border-radius: .885417vw 0 0 .885417vw;
        padding: 1.822917vw 0 1.354167vw;
        max-height: 35.9375vw;
        overflow: auto;
        box-sizing: content-box
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .subNav::-webkit-scrollbar {
        width: .104167vw;
        background-color: #f6f6f6
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .subNav::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 .104167vw rgba(0, 0, 0, .1);
        border-radius: .3125vw;
        background-color: #f6f6f6
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .subNav::-webkit-scrollbar-thumb {
        border-radius: .104167vw;
        -webkit-box-shadow: inset 0 0 .104167vw rgba(0, 0, 0, .1);
        background: var(--vi-color)
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavList {
        max-width: 100%;
        padding: 0 0 .260417vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavList a {
        color: rgba(51, 51, 51, .5)
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .subNav .subNavList>a {
        text-align: left;
        padding: 1.041667vw 2.604167vw 1.041667vw 2.864583vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .subNav .subNavList.cur1>a,
    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .subNav .subNavList>a:hover {
        background: var(--vi-color);
        color: #fff
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox {
        background: #fff;
        flex: 1;
        margin: .364583vw 0 0;
        border-radius: 0 .885417vw .885417vw 0;
        padding: 2.864583vw 0 1.5625vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl {
        display: flex;
        flex-wrap: wrap
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dt {
        width: 100%;
        font-weight: 500;
        font-size: var(--font-size24);
        color: #333;
        margin: 0 0 1.302083vw;
        font-family: MONTSERRAT-MEDIUM
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dt div {
        width: 100%;
        font-weight: 400;
        font-size: var(--font-size16);
        color: #333;
        margin: .4vw 0;
        font-family: MONTSERRAT-MEDIUM
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav {
        margin: 0 .78125vw 0 3.125vw;
        padding: 0 2.864583vw 0 0;
        max-height: 34.375vw;
        overflow: auto !important
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav::-webkit-scrollbar {
        width: .104167vw;
        background-color: #f6f6f6
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 .104167vw rgba(0, 0, 0, .1);
        border-radius: .3125vw;
        background-color: #f6f6f6
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav::-webkit-scrollbar-thumb {
        border-radius: .104167vw;
        -webkit-box-shadow: inset 0 0 .104167vw rgba(0, 0, 0, .1);
        background: var(--vi-color)
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd {
        width: calc(33.33% - 1.041667vw);
        margin: 0 1.5625vw 1.5625vw 0
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd:nth-child(3n+1) {
        margin-right: 0
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd a {
        padding: 1.041667vw 1.041667vw .78125vw;
        font-size: var(--font-size14);
        color: #333;
        text-align: center;
        display: block;
        font-family: MONTSERRAT-MEDIUM;
        word-wrap: break-word
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd a .h1,
    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd a div .h2 {
        font-size: var(--font-size14);
        font-weight: unset;
        display: block;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd a div {
        display: block;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd a div:nth-child(2) {
        padding: .364583vw 0 0;
        opacity: .3
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd a img {
        height: 7.8125vw;
        object-fit: contain;
        margin: auto
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd a:first-child {
        background: #f6f6f6
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd:hover a div:first-child {
        color: var(--vi-color)
    }

    .header_bg .header {
        margin: 0 !important
    }
}

@media(min-width:1600px) {

    .module_HL1GBCD1 .layui-laypage a,
    .module_HL1GBCD1 .layui-laypage span {
        margin: 0 7px;
        width: 48px;
        height: 48px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .subNav {
        width: 430px;
        border-radius: 17px 0 0 17px;
        padding: 35px 0 26px;
        max-height: 690px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavList {
        padding: 0 0 5px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .subNav .subNavList>a {
        padding: 20px 50px 20px 55px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox {
        margin: 7px 0 0;
        border-radius: 0 17px 17px 0;
        padding: 55px 0 30px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dt {
        margin: 0 0 25px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav {
        margin: 0 15px 0 60px;
        padding: 0 55px 0 0;
        max-height: 660px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav::-webkit-scrollbar {
        width: 2px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd {
        width: calc(33.33% - 20px);
        margin: 0 30px 30px 0
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd a {
        padding: 20px 20px 15px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(2) .subNavMain .subNavBox .threeNavBox .threeNav dl dd a img {
        height: 150px
    }
}

@media(min-width:992px) {
    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .subNav {
        display: block;
        width: 22.395833vw;
        border-radius: .885417vw 0 0 .885417vw;
        padding: 1.822917vw 0 1.354167vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavList {
        max-width: 100%;
        padding: 0 0 .260417vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavList a {
        color: rgba(51, 51, 51, .5)
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .subNav .subNavList>a {
        text-align: left;
        padding: 1.041667vw 2.604167vw 1.041667vw 2.864583vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .subNav .subNavList.cur1>a,
    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .subNav .subNavList>a:hover {
        background: var(--vi-color);
        color: #fff
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox {
        background: #fff;
        flex: 1;
        margin: .364583vw 0 0;
        border-radius: 0 .885417vw .885417vw 0;
        padding: 2.864583vw 0 1.5625vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a {
        display: flex;
        padding: 0 3.125vw;
        margin: 0 0 1.041667vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .image {
        width: 13.020833vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .image img {
        height: 13.020833vw;
        object-fit: cover
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .text {
        flex: 1;
        padding: 0 5.208333vw 0 2.083333vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .text .title {
        font-size: var(--font-size25);
        line-height: unset;
        padding: .78125vw 0 .520833vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .text .intro {
        line-height: 1.5;
        font-size: var(--font-size16);
        font-family: MONTSERRAT-REGULAR;
        opacity: .8;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .text .SeeMore {
        line-height: 1;
        background: var(--vi-color);
        transition: .3s;
        margin: 1.5625vw 0 0 auto;
        border-color: #fc6c0f
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .text .SeeMore img {
        width: .729167vw;
        filter: grayscale(100%) brightness(500%)
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .text .SeeMore:hover {
        background: 0 0;
        border-color: #fc6c0f;
        color: #fc6c0f
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .text .SeeMore:hover img {
        filter: unset
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a:hover {
        background: #e3e3e700
    }
}

@media(min-width:1600px) {
    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .subNav {
        width: 430px;
        border-radius: 17px 0 0 17px;
        padding: 35px 0 26px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavList {
        padding: 0 0 5px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .subNav .subNavList>a {
        padding: 20px 50px 20px 55px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox {
        background: #fff;
        flex: 1;
        margin: .364583vw 0 0;
        border-radius: 0 .885417vw .885417vw 0;
        padding: 2.864583vw 0 1.5625vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a {
        padding: 0 60px;
        margin: 0 0 20px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .image {
        width: 250px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .image img {
        height: 250px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .text {
        padding: 0 100px 0 40px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .text .title {
        padding: 15px 0 10px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .text .SeeMore {
        margin: 30px 0 0 auto
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:nth-child(3) .subNavMain .subNavBox .threeNavBox .threeNav>a .text .SeeMore img {
        width: 14px
    }
}

.error {
    overflow: hidden;
    padding: 35 0 100px
}

.error .bgimage img {
    height: auto
}

.error .title {
    font-size: var(--font-size48);
    text-align: center;
    line-height: unset;
    font-family: MONTSERRAT-REGULAR;
    font-weight: 500
}

.error .intro {
    font-size: var(--font-size20);
    text-align: center;
    opacity: .5;
    padding: 20px 0
}

.error .meddium {
    display: flex;
    align-items: center;
    font-size: var(--font-size20);
    justify-content: center;
    margin: 0 0 40px
}

.error .meddium a {
    color: var(--vi-color);
    margin: 0 5px;
    background-image: linear-gradient(to right, currentColor 50%, hsla(230deg, 13%, 9%, .08) 50%);
    background-position: 100% 100%;
    background-repeat: no-repeat;
    background-size: 200% 1px;
    text-decoration: none;
    transition: background-position .2s
}

.error .meddium a:hover {
    background-position: 0 100%
}

.fof__animation svg {
    display: block;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto
}

#i-fof-browser {
    transform-origin: 260px 304px;
    animation: 4s infinite i-fof-browser
}

#i-fof-shadow {
    transform-origin: 282px 410px;
    animation: 4s infinite i-fof-shadow
}

@keyframes i-fof-browser {

    0%,
    100% {
        transform: translateY(0) scale(1)
    }

    50% {
        transform: translateY(-10%) scale(.9)
    }
}

@keyframes i-fof-shadow {

    0%,
    100% {
        transform: scale(1)
    }

    50% {
        transform: scale(.8)
    }
}

@media(max-width:768px) {
    .error {
        padding: 35px 0
    }

    .error .intro {
        padding: 12px 0
    }

    .error .meddium {
        margin: 0 0 25px
    }
}

@media(min-width:768px) {
    .error {
        padding: 9.375vw 0 5.208333vw
    }

    .error .intro {
        padding: 1.041667vw 0
    }

    .error .meddium {
        margin: 0 0 2.083333vw
    }

    .error .meddium a {
        margin: 0 .260417vw
    }

    .fof__animation svg {
        max-width: 27.083333vw
    }
}

@media(min-width:1600px) {
    .error {
        padding: 180px 0 100px
    }

    .error .intro {
        padding: 20px 0
    }

    .error .meddium {
        margin: 0 0 40px
    }

    .error .meddium a {
        margin: 0 5px
    }

    .fof__animation svg {
        max-width: 520px
    }
}

.PrivacyPolicy {
    font-size: var(--font-size18)
}

.tabulation {
    background: #f2f4f5
}

.tabulation .top .title {
    font-size: var(--font-size56);
    color: #333;
    font-family: MONTSERRAT-REGULAR;
    font-weight: 500
}

.tabulation .top .intro {
    font-weight: 200;
    font-size: var(--font-size16);
    color: #959595;
    line-height: 1.3
}

.tabulation .list dt {
    font-weight: 500;
    font-size: var(--font-size21);
    color: #fff;
    background: var(--vi-color);
    border-radius: 50px;
    display: inline-block;
    text-align: center
}

.tabulation .list dl {
    display: flex;
    flex-wrap: wrap
}

.tabulation .list dl dd {
    background: #fff;
    text-align: center
}

.tabulation .list dl dd .image img {
    width: auto;
    margin: auto;
    display: block;
    object-fit: contain
}

.tabulation .list dl dd .title {
    font-size: var(--font-size19);
    color: #3b3b3b;
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.tabulation .list dl dd .intro {
    font-weight: 400;
    font-size: var(--font-size14);
    color: #3b3b3b;
    opacity: .6;
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.tabulation .list dl dd .SeeMore {
    font-weight: 500;
    font-size: var(--font-size12);
    color: var(--vi-color)
}

.tabulation .list dl dd:hover .SeeMore {
    background: var(--vi-color);
    color: #fff
}

.tabulation .list dl dd:hover .SeeMore img {
    filter: grayscale(100%) brightness(500%)
}

.tabulation .list:last-child dl {
    padding: 0 !important
}

@media(max-width:768px) {
    .PrivacyPolicy {
        padding: 35px 0
    }

    .tabulation:last-child {
        padding: 0 0 35px
    }

    .tabulation .top {
        padding: 35px 0 25px
    }

    .tabulation .top .intro {
        padding: 15px 0 0;
        font-size: 14px;
        line-height: unset
    }

    .tabulation .list dt {
        padding: 10px 20px;
        margin: 0 0 20px;
        font-size: 14px;
        min-width: 180px
    }

    .tabulation .list dl .text {
        padding: 0 20px
    }

    .tabulation .list dl {
        padding: 0 0 15px
    }

    .tabulation .list dl dd {
        width: 100%;
        margin: 0 0 20px
    }

    .tabulation .list dl dd .image img {
        height: 200px;
        padding: 20px;
        position: a
    }

    .tabulation .list dl dd .title {
        margin: 0 0 15px
    }

    .tabulation .list dl dd .SeeMore {
        margin: 15px auto 20px;
        padding: 7px 0;
        border: 1px solid rgba(255, 255, 255, .8)
    }

    .tabulation .list dl dd .SeeMore img {
        width: 14px
    }

    .tabulation .list dl dd:hover .SeeMore {
        border: 1px solid rgba(255, 255, 255, 0)
    }
}

@media(min-width:768px) {
    .PrivacyPolicy {
        padding: 5.208333vw 0
    }

    .tabulation:last-child {
        padding: 0 0 4.6875vw
    }

    .tabulation .top {
        padding: 4.6875vw 0 3.645833vw
    }

    .tabulation .top .intro {
        padding: 1.822917vw 0 0
    }

    .tabulation .list dt {
        padding: .833333vw 1.041667vw;
        margin: 0 0 2.083333vw;
        min-width: 11.979167vw
    }

    .tabulation .list dl .text {
        padding: 0 1.041667vw
    }

    .tabulation .list dl {
        padding: 0 0 4.166667vw
    }

    .tabulation .list dl dd {
        width: calc(25% - (2.083333vw / 4));
        margin: 0 .520833vw .520833vw 0
    }

    .tabulation .list dl dd .image img {
        height: 11.979167vw;
        padding: 1.041667vw
    }

    .tabulation .list dl dd .title {
        margin: 0 0 .78125vw
    }

    .tabulation .list dl dd .SeeMore {
        margin: .9375vw auto 1.25vw;
        padding: .625vw .520833vw .625vw 0
    }

    .tabulation .list dl dd .SeeMore img {
        width: .729167vw
    }

    .tabulation .list dl dd:hover .SeeMore {
        border: .104167vw solid rgba(255, 255, 255, 0)
    }
}

@media(min-width:1600px) {
    .PrivacyPolicy {
        padding: 100px 0
    }

    .tabulation:last-child {
        padding: 0 0 90px
    }

    .tabulation .top {
        padding: 90px 0 70px
    }

    .tabulation .top .intro {
        padding: 35px 0 0
    }

    .tabulation .list dt {
        padding: 16px 20px;
        margin: 0 0 40px;
        min-width: 230px
    }

    .tabulation .list dl .text {
        padding: 0 20px
    }

    .tabulation .list dl {
        padding: 0 0 80px
    }

    .tabulation .list dl dd {
        width: calc(24% -(-20px / 4));
        margin: 0 10px 10px 0
    }

    .image_warp,
    .tabulation .list dl dd .image {
        position: relative;
        padding-bottom: 50%
    }

    .image_warp img,
    .tabulation .list dl dd .image img {
        padding: 20px;
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        object-fit: cover
    }

    .image_warp img {
        padding: 20px;
        position: absolute;
        width: 100% !important;
        height: 100% !important;
        left: 0;
        top: 0;
        object-fit: contain !important
    }

    .tabulation .list dl dd .title {
        margin: 0 0 15px
    }

    .tabulation .list dl dd .SeeMore {
        margin: 18px auto 24px;
        padding: 12px 10px 12px 0
    }

    .tabulation .list dl dd .SeeMore img {
        width: 14px
    }

    .tabulation .list dl dd:hover .SeeMore {
        border: 2px solid rgba(255, 255, 255, 0)
    }
}

.FAQS .problem {
    display: flex
}

.FAQS .problem ul li {
    width: 100%;
    background: url('../images/103.png') center/100% 100% no-repeat
}

.FAQS .problem ul li:hover {
    background: url('../images/104.png') center/100% 100% no-repeat
}

@media(max-width:768px) {
    .FAQS .problem {
        display: block
    }

    .FAQS .problem ul li {
        width: 100%;
        background: url('../images/60.png') center/100% 100% no-repeat
    }

    .FAQS .problem ul li:hover {
        background: url('../images/61.png') center/100% 100% no-repeat
    }
}

.OnlineMessage .title {
    font-size: var(--font-size45);
    text-align: center
}

.FAQS .problem>.title {
    font-size: var(--font-size45);
    text-align: center;
    margin-bottom: 20px
}

.OnlineMessage .intro {
    font-weight: 300;
    font-size: var(--font-size16);
    color: #333;
    opacity: .6;
    text-align: center
}

.OnlineMessage ul {
    margin: auto
}

.OnlineMessage ul li {
    display: flex;
    justify-content: space-between
}

.OnlineMessage ul li.textarea>div {
    width: 100%
}

.OnlineMessage ul li input,
.OnlineMessage ul li textarea {
    background: #eff0f3;
    border-radius: 10px;
    border: 1px solid #eaecef;
    font-weight: 300;
    font-size: var(--font-size16);
    color: #333
}

.OnlineMessage ul li input::-webkit-input-placeholder {
    color: #bcbcbc
}

.OnlineMessage ul li input:-moz-placeholder {
    color: #bcbcbc
}

.OnlineMessage ul li input::-moz-placeholder {
    color: #bcbcbc
}

.OnlineMessage ul li input:-ms-input-placeholder {
    color: #bcbcbc
}

.OnlineMessage ul li textarea::-webkit-input-placeholder {
    color: #bcbcbc
}

.OnlineMessage ul li textarea:-moz-placeholder {
    color: #bcbcbc
}

.OnlineMessage ul li textarea::-moz-placeholder {
    color: #bcbcbc
}

.OnlineMessage ul li textarea:-ms-input-placeholder {
    color: #bcbcbc
}

.OnlineMessage ul li .layui-input:focus,
.OnlineMessage ul li .layui-textarea:focus {
    border-color: var(--vi-color) !important;
    box-shadow: 0 0 0 0 rgba(22, 183, 119, 0)
}

.OnlineMessage ul li .layui-input:hover,
.OnlineMessage ul li .layui-textarea:hover {
    border-color: var(--vi-color) !important
}

.OnlineMessage ul li span {
    display: block;
    font-weight: 600;
    font-size: var(--font-size18);
    color: #333;
    line-height: 1
}

.OnlineMessage ul li input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #eff0f3 inset !important;
    -webkit-box-flex-color: #333
}

.OnlineMessage .button {
    background: var(--vi-color);
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    font-size: var(--font-size16);
    color: #fff;
    cursor: pointer
}

.OnlineMessage .button:hover {
    opacity: .8
}

@media(max-width:768px) {
    .OnlineMessage {
        padding: 35px 0
    }

    .OnlineMessage .title {
        padding: 0 0 15px
    }

    .OnlineMessage .intro {
        padding: 0;
        font-size: 14px
    }

    .OnlineMessage ul {
        max-width: 100%
    }

    .OnlineMessage ul li {
        display: block;
        margin: 0
    }

    .OnlineMessage ul li>div {
        width: 100%;
        margin: 20px 0 0
    }

    .OnlineMessage ul li input,
    .OnlineMessage ul li textarea {
        height: 42px;
        border-radius: 6px;
        padding: 0 20px
    }

    .OnlineMessage ul li textarea {
        height: 120px;
        padding: 20px
    }

    .OnlineMessage ul li span {
        padding: 0 0 10px
    }

    .OnlineMessage .button {
        width: 160px;
        height: 35px;
        margin: 25px auto 0
    }
}

@media(min-width:768px) {
    .FAQS .problem ul {
        margin: 0 0 .520833vw
    }

    .Downloads .problem .left {
        width: 22.916667vw;
        min-width: 22.916667vw
    }

    .OnlineMessage {
        padding: 3.802083vw 0 3.489583vw
    }

    .OnlineMessage .title {
        padding: 0 0 1.041667vw
    }

    .OnlineMessage .intro {
        padding: 0 0 2.083333vw
    }

    .OnlineMessage ul {
        max-width: 68.645833vw
    }

    .OnlineMessage ul li {
        margin: 1.822917vw 0 0
    }

    .OnlineMessage ul li>div {
        width: calc(50% - 1.041667vw)
    }

    .OnlineMessage ul li input,
    .OnlineMessage ul li textarea {
        height: 3.333333vw;
        border-radius: .520833vw;
        padding: 0 1.041667vw
    }

    .OnlineMessage ul li textarea {
        height: 7.864583vw;
        padding: 1.041667vw
    }

    .OnlineMessage ul li span {
        padding: 0 0 .885417vw
    }

    .OnlineMessage .button {
        width: 9.895833vw;
        height: 2.864583vw;
        margin: 2.083333vw auto 0
    }
}

@media(min-width:1600px) {
    .FAQS .problem ul {
        margin: 0 0 10px
    }

    .Downloads .problem .left {
        width: 440px;
        min-width: 440px
    }

    .OnlineMessage {
        padding: 73px 0 67px
    }

    .OnlineMessage .title {
        padding: 0 0 20px
    }

    .OnlineMessage .intro {
        padding: 0 0 40px
    }

    .OnlineMessage ul {
        max-width: 1318px
    }

    .OnlineMessage ul li {
        margin: 35px 0 0
    }

    .OnlineMessage ul li>div {
        width: calc(50% - 20px)
    }

    .OnlineMessage ul li input,
    .OnlineMessage ul li textarea {
        height: 64px;
        border-radius: 10px;
        padding: 0 20px
    }

    .OnlineMessage ul li textarea {
        height: 151px;
        padding: 20px
    }

    .OnlineMessage ul li span {
        padding: 0 0 17px
    }

    .OnlineMessage .button {
        width: 190px;
        height: 55px;
        margin: 40px auto 0
    }
}

html {
    --vi-color: rgba(251, 125, 32, 1);
    --title-color: #272727;
    --text-color: #4c505f;
    --content-Wdith-1200: 77.0833vw;
    --bigTitle-fontSize-1200: 2.3958vw;
    --bigTitle-lineheight-1200: 2.9167vw;
    --smallTitle-fontsize-1200: 1.5625vw;
    --smallTitle-lineheight-1200: 1.8229vw;
    --padding-1200: 5.7292vw 0vw;
    --text-fontsize-1200: 0.9375vw;
    --text-lineheight-1200: 1.4583vw;
    --content-Wdith-768: 81.25vw;
    --bigTitle-fontSize-768: 2.875vw;
    --bigTitle-lineheight-768: 3.5vw;
    --smallTitle-fontsize-768: 1.875vw;
    --smallTitle-lineheight-768: 2.1875vw;
    --padding-768: 6.875vw 0vw;
    --text-fontsize-768: 1.125vw;
    --text-lineheight-768: 1.75vw;
    --content-Wdith: 100%;
    --bigTitle-fontSize: 22px;
    --bigTitle-lineheight: 30px;
    --smallTitle-fontsize: 16px;
    --smallTitle-lineheight: 23px;
    --text-fontsize: 14px;
    --text-lineheight: 24px;
    --padding: 35px 0px
}

.module_hEWu4upOZcr0 .header .langBox {
    position: relative;
    padding: 0 .677083vw 0 0
}

.module_hEWu4upOZcr0 .header .langBox::after {
    position: absolute;
    top: calc(50% - 1px);
    right: 0;
    content: '';
    border-top: 6px solid rgba(251, 125, 32, .7);
    border-right: 4px solid #00000000;
    border-bottom: 4px solid #00000000;
    border-left: 4px solid #00000000
}

.module_hEWu4upOZcr0 .header .langBox .iconfont {
    font-size: var(--font-size20);
    color: #fb7d20;
    display: flex;
    align-items: center;
    cursor: pointer;
    text-transform: capitalize
}

.module_hEWu4upOZcr0 .header .langBox .iconfont span {
    font-size: var(--font-size14);
    margin: 0 0 0 4px;
    font: var(--font-size14) HarmonyOS Sans SC, OPPOSans, PingFang SC, Source Han Sans, Microsoft YaHei;
    color: #e0e1e4;
    font-weight: 700
}

.module_hEWu4upOZcr0 .header .langBox .Lhide {
    background-color: #fff;
    border-radius: 5px;
    position: absolute;
    top: 2.083333vw;
    right: 0;
    -webkit-box-shadow: 0 5px 5px #0000000d;
    box-shadow: 0 5px 5px #0000000d;
    display: none;
    padding: .520833vw 0;
    z-index: 1
}

.module_hEWu4upOZcr0 .header .langBox .Lhide a {
    padding: 0 .520833vw;
    line-height: 2;
    color: #333;
    margin-left: 0;
    display: inline-block;
    text-align: center
}

.module_hEWu4upOZcr0 .header .langBox .Lhide a:hover {
    background: #e3e3e7
}

@media (min-width:1260px) {
    .module_hEWu4upOZcr0 .header .langBox .Lhide {
        top: calc(100% + 12px)
    }
}

@media (max-width:992px) {
    .module_hEWu4upOZcr0 .header .langBox .iconfont {
        font-size: 16px;
        padding: 0 12px 0 0;
        color: #333
    }

    .module_hEWu4upOZcr0 .header .langBox .Lhide {
        top: 46px;
        padding: 5px 0
    }

    .module_hEWu4upOZcr0 .header .langBox .Lhide a {
        padding: 0 10px
    }
}

body {
    padding-top: 60px !important;
    position: relative;
    -webkit-transition: left .4s cubic-bezier(.4, .01, .165, .99);
    -o-transition: left .4s cubic-bezier(.4, .01, .165, .99);
    -moz-transition: left .4s cubic-bezier(.4, .01, .165, .99);
    transition: left .4s cubic-bezier(.4, .01, .165, .99);
    left: 0
}

.module_hEWu4upOZcr0 {
    position: relative;
    z-index: 99
}

.module_hEWu4upOZcr0 .header {
    background: #fff;
    box-shadow: 0 0 0 rgba(0, 0, 0, .1);
    height: 60px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: fixed;
    width: 100%;
    top: 0;
    -webkit-transition: left .4s cubic-bezier(.4, .01, .165, .99);
    -o-transition: left .4s cubic-bezier(.4, .01, .165, .99);
    -moz-transition: left .4s cubic-bezier(.4, .01, .165, .99);
    transition: left .4s cubic-bezier(.4, .01, .165, .99);
    left: 0;
    z-index: 4;
    transition: background-color .3s, box-shadow .3s, top .3s, margin .3s
}

.module_hEWu4upOZcr0 .header .commonMain {
    max-width: var(--content-Wdith);
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    box-sizing: content-box
}

.module_hEWu4upOZcr0 .header .navBox {
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.module_hEWu4upOZcr0 .header .navBox .navList {
    background: #fafafa;
    display: none;
    position: fixed;
    width: 260px;
    right: -260px;
    top: 0;
    bottom: 0;
    padding: 50px 0 0;
    overflow-y: auto;
    -webkit-transition: right .4s cubic-bezier(.4, .01, .165, .99);
    -o-transition: right .4s cubic-bezier(.4, .01, .165, .99);
    -moz-transition: right .4s cubic-bezier(.4, .01, .165, .99);
    transition: right .4s cubic-bezier(.4, .01, .165, .99)
}

.module_hEWu4upOZcr0 .header .navBox .navList .list {
    border-top: 1px solid #eff1f3
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .h3 a {
    padding: 0 25px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 50px;
    font-size: 14px;
    position: relative;
    color: #333;
    font-weight: 500;
    font-family: MONTSERRAT-REGULAR
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .h3 a::before {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    border: 1px solid #d8d8d8;
    margin-right: 15px
}

.module_hEWu4upOZcr0 .header .navBox .navList .list.cur {
    background: #fff
}

.module_hEWu4upOZcr0 .header .navBox .navList .list.cur .h3 a::before {
    background: #666;
    border-color: #666
}

.module_hEWu4upOZcr0 .header .navBox .navList .closeNavText a {
    visibility: hidden
}

.module_hEWu4upOZcr0 .header .haderOther {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.module_hEWu4upOZcr0 .header .haderOther .login {
    margin-left: 15px
}

.module_hEWu4upOZcr0 .header .haderOther .login .loginBtn {
    display: block;
    width: 21px;
    color: var(--vi-color);
    font-size: 21px
}

.module_hEWu4upOZcr0 .header .haderOther .login .user {
    display: none;
    font-size: 14px
}

.module_hEWu4upOZcr0 .header .haderOther .searchBox {
    margin-left: 15px;
    position: relative
}

.module_hEWu4upOZcr0 .header .haderOther .searchBox .searchBtn {
    display: block;
    width: 21px;
    color: #333;
    font-size: 21px
}

.module_hEWu4upOZcr0 .header .haderOther .navbtn {
    width: 26px;
    color: var(--vi-color);
    position: relative;
    cursor: pointer;
    margin-left: 15px;
    font-size: 26px
}

.module_hEWu4upOZcr0 .header .searchformMain {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: none;
    z-index: 99
}

.module_hEWu4upOZcr0 .header .searchformMain .searchform {
    background: #fff;
    padding: 10px 0 30px;
    position: relative;
    z-index: 99;
    -webkit-transition: opacity .8s cubic-bezier(.2, 1, .3, 1), -webkit-transform .8s cubic-bezier(.2, 1, .3, 1);
    transition: transform .8s cubic-bezier(.2, 1, .3, 1), opacity .8s cubic-bezier(.2, 1, .3, 1), -webkit-transform .8s cubic-bezier(.2, 1, .3, 1), -moz-transform .8s cubic-bezier(.2, 1, .3, 1), -o-transform .8s cubic-bezier(.2, 1, .3, 1);
    -o-transition: opacity .8s cubic-bezier(.2, 1, .3, 1), -o-transform .8s cubic-bezier(.2, 1, .3, 1);
    -moz-transition: transform .8s cubic-bezier(.2, 1, .3, 1), opacity .8s cubic-bezier(.2, 1, .3, 1), -moz-transform .8s cubic-bezier(.2, 1, .3, 1);
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 1px);
    -moz-transform: translate3d(0, -100%, 1px);
    transform: translate3d(0, -100%, 1px)
}

.module_hEWu4upOZcr0 .header .searchformMain .searchform form {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 1080px;
    margin: 0 auto;
    border-bottom: 2px solid #595959;
    width: 100%;
    padding: 20px 0;
    position: relative
}

.module_hEWu4upOZcr0 .header .searchformMain .searchform form input {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0 15px;
    font-size: 14px;
    color: #333;
    line-height: inherit;
    vertical-align: middle
}

.module_hEWu4upOZcr0 .header .searchformMain .searchform form button {
    left: 0;
    font-size: 20px;
    height: 100%;
    top: 0;
    background: 0 0;
    border: none;
    cursor: pointer
}

.module_hEWu4upOZcr0 .header .searchformMain .searchform form .closeSearch {
    cursor: pointer;
    right: 0;
    top: 0;
    height: 100%;
    font-size: 20px;
    color: #333
}

.module_hEWu4upOZcr0 .header .searchformMain .search_mask {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .6)
}

.module_hEWu4upOZcr0 .header .searchformMain.admission .searchform {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1
}

.module_hEWu4upOZcr0 .admissionheader {
    left: -260px
}

.module_hEWu4upOZcr0 .admissionheader .navBox .navList {
    right: 0
}

.hideScroll {
    overflow: hidden
}

.admissionBody {
    left: -260px
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavBtn {
    position: absolute;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: right;
    -webkit-justify-content: right;
    -moz-box-pack: right;
    -ms-flex-pack: right;
    justify-content: right;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 50px;
    top: 0;
    right: 0;
    padding-right: 25px
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavBtn i {
    width: 12px;
    height: 12px;
    display: block;
    position: relative
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavBtn i::after {
    content: '';
    width: 100%;
    height: 2px;
    background: #474747;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -1px
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavBtn i::before {
    content: '';
    width: 2px;
    height: 100%;
    background: #474747;
    position: absolute;
    left: 50%;
    top: 0;
    margin-left: -1px;
    -webkit-transition: .4s cubic-bezier(.4, .01, .165, .99);
    -o-transition: .4s cubic-bezier(.4, .01, .165, .99);
    -moz-transition: .4s cubic-bezier(.4, .01, .165, .99);
    transition: .4s cubic-bezier(.4, .01, .165, .99)
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain,
.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .threeNavBox {
    display: none
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavList {
    position: relative
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavList>a {
    padding: 15px 25px;
    border-top: 1px solid #ebebeb;
    background: #f6f6f6;
    display: block;
    font-family: MONTSERRAT-REGULAR
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavList>a::before {
    margin-right: 10px;
    font-family: commoniconFont
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavList .mThreeNav {
    display: none
}

.module_hEWu4upOZcr0 .header .navBox .navList .list.active h3 {
    background: #ebebeb
}

.module_hEWu4upOZcr0 .header .navBox .navList .list.active h3 a::before {
    background: #666;
    border-color: #666
}

.module_hEWu4upOZcr0 .header .navBox .navList .list.active .subNavBtn i::before {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNavList .threeNavBtn {
    position: absolute;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: right;
    -webkit-justify-content: right;
    -moz-box-pack: right;
    -ms-flex-pack: right;
    justify-content: right;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 40%;
    height: 45px;
    top: 0;
    right: 0;
    padding-right: 25px
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNavList .threeNavBtn i {
    width: 12px;
    height: 12px;
    display: block;
    position: relative
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNavList .threeNavBtn i::after {
    content: '';
    width: 100%;
    height: 2px;
    background: #474747;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -1px
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNavList .threeNavBtn i::before {
    content: '';
    width: 2px;
    height: 100%;
    background: #474747;
    position: absolute;
    left: 50%;
    top: 0;
    margin-left: -1px;
    -webkit-transition: .4s cubic-bezier(.4, .01, .165, .99);
    -o-transition: .4s cubic-bezier(.4, .01, .165, .99);
    -moz-transition: .4s cubic-bezier(.4, .01, .165, .99);
    transition: .4s cubic-bezier(.4, .01, .165, .99)
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNavList .mThreeNav a {
    display: block;
    padding: 15px 50px;
    border-top: 1px solid #ebebeb
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNavList .mThreeNav a::before {
    margin-right: 10px
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNavList.active1 .mThreeNav .on .threeNavBtn i::before,
.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNavList.active1>.threeNavBtn i::before {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

@media (min-width:768px) {
    .module_hEWu4upOZcr0 .header .searchformMain .searchform {
        padding: .625vw 0 3.125vw
    }

    .module_hEWu4upOZcr0 .header .searchformMain .searchform form {
        padding: 2.8125vw 0
    }

    .module_hEWu4upOZcr0 .header .searchformMain .searchform form input {
        margin: 0 1.875vw;
        font-size: 1.125vw
    }

    .module_hEWu4upOZcr0 .header .searchformMain .searchform form .closeSearch,
    .module_hEWu4upOZcr0 .header .searchformMain .searchform form button {
        font-size: 1.5vw
    }

    .module_hEWu4upOZcr0 .header .searchformMain .search_mask {
        background: rgba(0, 0, 0, 0)
    }
}

@media (min-width:992px) {
    body {
        padding-top: 0 !important
    }

    .module_hEWu4upOZcr0 .header {
        height: 9.1875vw;
        position: fixed;
        background: #ffffff00;
        box-shadow: 0 0 0 rgba(0, 0, 0, .1)
    }

    @-webkit-keyframes FadeDown {
        0% {
            opacity: 0;
            -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0)
        }

        100% {
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
            opacity: 1
        }
    }

    @keyframes FadeDown {
        0% {
            opacity: 0;
            -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0)
        }

        100% {
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
            opacity: 1
        }
    }

    .module_hEWu4upOZcr0 .header .commonMain {
        padding: 0 4.375vw 0 3.645833vw;
        align-items: flex-end
    }

    .module_hEWu4upOZcr0 .header .haderOther .navbtn {
        display: none
    }

    .module_hEWu4upOZcr0 .header .navBox .navList {
        padding: 0;
        width: auto;
        right: 0;
        background: 0 0;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        position: unset;
        overflow: visible;
        top: 0
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list {
        margin-left: 3.645833vw;
        padding: 0;
        border-top: none
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .h3 a {
        line-height: 2.96875vw;
        font-size: .833333vw;
        padding: 0
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .h3 a::before {
        display: none
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .h3 a::after {
        bottom: 0;
        width: 0;
        height: .1042vw;
        background: var(--vi-color);
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        content: '';
        position: absolute;
        -webkit-transition: .6s;
        -o-transition: .6s;
        -moz-transition: .6s;
        transition: .6s
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list.cur {
        background: 0 0
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:hover .h3 a {
        color: var(--vi-color)
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:hover .h3 a::after {
        width: 100%
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:first-child {
        margin-left: 0
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .closeNavText {
        display: none
    }

    .module_hEWu4upOZcr0 .header .haderOther .login {
        margin-left: 3.125vw
    }

    .module_hEWu4upOZcr0 .header .searchformMain .searchform {
        padding: .5208vw 0 2.6042vw
    }

    .module_hEWu4upOZcr0 .header .searchformMain .searchform form {
        padding: 2.3438vw 0
    }

    .module_hEWu4upOZcr0 .header .searchformMain .searchform form input {
        margin: 0 1.5625vw;
        font-size: .9375vw
    }

    .module_hEWu4upOZcr0 .header .searchformMain .searchform form .closeSearch,
    .module_hEWu4upOZcr0 .header .searchformMain .searchform form button {
        font-size: 1.25vw
    }

    .module_hEWu4upOZcr0 .header .haderOther .login .loginBtn {
        width: 1.0938vw;
        font-size: 1.0938vw
    }

    .module_hEWu4upOZcr0 .header .haderOther .login .user {
        font-size: .7292vw
    }

    .module_hEWu4upOZcr0 .header .haderOther .searchBox {
        margin-left: .7813vw
    }

    .module_hEWu4upOZcr0 .header .haderOther .searchBox .searchBtn {
        width: 1.0938vw;
        font-size: 1.0938vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavBtn {
        display: none
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain {
        position: absolute;
        min-width: 100%;
        left: 0;
        overflow: hidden;
        max-height: 0;
        display: block
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        overflow: hidden
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNav .subNavList>a {
        display: block;
        background: 0 0;
        border: none;
        font-size: .8333vw;
        padding: 0 .9375vw;
        position: relative;
        text-align: center;
        line-height: 1.4
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNav .subNavList>a:hover {
        color: var(--vi-color)
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNav .mThreeNav,
    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNav .threeNavBtn {
        display: none
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .threeNavBox {
        display: block;
        padding: 1.5625vw 0;
        position: relative
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .threeNavBox::before {
        content: '';
        width: .0521vw;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        background: #eae9f1
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .threeNavBox .threeNav {
        min-width: 13.5417vw;
        display: none;
        max-height: 31.25vw;
        overflow: auto;
        margin: 0 1.041667vw 0 0
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .threeNavBox .threeNav::-webkit-scrollbar {
        width: 2px;
        height: 16px;
        background-color: #dfdfdf
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .threeNavBox .threeNav::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, .1);
        border-radius: 6px;
        background-color: #dfdfdf
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .threeNavBox .threeNav::-webkit-scrollbar-thumb {
        border-radius: 2px;
        -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, .1);
        background: var(--vi-color)
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .threeNavBox .threeNav>a {
        display: block;
        line-height: 2.0833vw;
        padding: 0 2.0833vw;
        font-size: .8333vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .threeNavBox .threeNav>a:hover {
        background: #e3e3e7
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list:hover .subNavMain {
        max-height: 52.0833vw;
        -webkit-transition: .8s ease-in-out;
        -o-transition: .8s ease-in-out;
        -moz-transition: .8s ease-in-out;
        transition: .8s ease-in-out;
        left: 0
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavList>a::before {
        display: none
    }
}

.module_hEWu4upOZcr0 .header.on .logo img {
    filter: unset
}

.module_hEWu4upOZcr0 .header .logo img {
    height: 36px;
    object-fit: contain;
    width: 65px
}

@media(min-width:992px) {
    .module_hEWu4upOZcr0 .header .logo img {
        height: 2.604167vw;
        width: auto;
        object-fit: contain
    }

    .white .header .linkRight a,
    .white .header .topRight a,
    .white .module_hEWu4upOZcr0 .header .haderOther .searchBox .searchBtn,
    .white .module_hEWu4upOZcr0 .header .langBox .iconfont,
    .white .module_hEWu4upOZcr0 .header .navBox .navList .list .h3 a,
    .white .module_hEWu4upOZcr0 .header .navBox .navList .list .h3 a span {
        color: #fff
    }

    .white .module_hEWu4upOZcr0 .header .langBox::after {
        border-top: .3125vw solid #fff
    }

    .white .module_hEWu4upOZcr0 .header .navBox {
        background: rgba(255, 255, 255, .15);
        backdrop-filter: blur(16px)
    }

    .white .header .linkRight a img {
        filter: unset;
        object-fit: contain
    }

    .module_hEWu4upOZcr0 .header.on .haderOther .searchBox .searchBtn,
    .module_hEWu4upOZcr0 .header.on .langBox .iconfont,
    .module_hEWu4upOZcr0 .header.on .navBox .navList .list h3 a {
        color: #333
    }

    .module_hEWu4upOZcr0 .header.on {
        background: #fff;
        height: 4.166667vw
    }

    .CPDetails .module_hEWu4upOZcr0 .header .navBox {
        background: rgba(255, 255, 255, .15)
    }

    .XWDetails .module_hEWu4upOZcr0 .header .navBox {
        background: #fff
    }

    .header.on .topRight {
        display: none
    }

    .module_hEWu4upOZcr0 .header.on .logo a {
        zoom: .7
    }
}

.module_hEWu4upOZcr0 .header .logo a {
    display: block;
    position: relative
}

.module_hEWu4upOZcr0 .header .logo svg {
    position: absolute
}

.module_hEWu4upOZcr0.on .header .logo svg path {
    animation: .7s linear forwards opacity_;
    -webkit-animation: .7s opacity_;
    opacity: 0
}

.module_hEWu4upOZcr0 .header .logo svg path:nth-child(2) {
    animation-delay: 0
}

.module_hEWu4upOZcr0 .header .logo svg path:nth-child(3) {
    animation-delay: .1s
}

.module_hEWu4upOZcr0 .header .logo svg path:nth-child(4) {
    animation-delay: .2s
}

.module_hEWu4upOZcr0 .header .logo svg path:nth-child(5) {
    animation-delay: .3s
}

.module_hEWu4upOZcr0 .header .logo svg path:nth-child(6) {
    animation-delay: .4s
}

.module_hEWu4upOZcr0 .header .logo svg path:nth-child(7) {
    animation-delay: .5s
}

.module_hEWu4upOZcr0 .header .logo svg path:nth-child(8) {
    animation-delay: .6s
}

.module_hEWu4upOZcr0 .header .logo svg path:nth-child(9) {
    animation-delay: .7s
}

@-webkit-keyframes opacity_ {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes opacity_ {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.header .columns {
    flex-wrap: wrap;
    flex: 1
}

.header .topRight {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: right
}

.header .topRight>div {
    display: flex;
    align-items: center
}

.header .topRight a {
    font-weight: 700;
    font-size: var(--font-size16);
    opacity: .7;
    display: block;
    color: #fb7d20
}

.header .topRight>div a {
    font-weight: 700
}

.header .topRight>div a:hover {
    opacity: 1
}

.header .linkRight2 {
    position: relative
}

.header .linkRight2::before {
    position: absolute;
    left: 0;
    content: '';
    width: 1px;
    background: #6d9fca;
    opacity: .2
}

.header .linkRight a {
    display: flex;
    align-items: center;
    font-weight: 500;
    font-size: var(--font-size14);
    color: #333;
    justify-content: center;
    border-radius: 50px;
    font-family: MONTSERRAT-REGULAR
}

.header .linkRight a img {
    filter: grayscale(100%) brightness(33%)
}

.header .linkRight a:hover,
.header .linkRight1 a {
    background: #fb7d20;
    color: #fff
}

.header .linkRight a:hover img,
.header .linkRight1 a img {
    filter: unset
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .h3 a span {
    font-weight: 400;
    font-size: var(--font-size12);
    color: #000;
    opacity: .2
}

.module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNav .subNavList>a img {
    display: block
}

@media(max-width:992px) {
    .module_hEWu4upOZcr0 .header .navBox .navList .list {
        position: relative
    }

    .module_hEWu4upOZcr0 .header .logo img {
        filter: unset
    }

    .header .columns {
        flex-wrap: unset
    }

    .module_hEWu4upOZcr0 .header .logo svg {
        display: none
    }

    .module_hEWu4upOZcr0 .header {
        transition: .4s
    }

    .header .topRight>div {
        display: none
    }

    .header .topRight .langBox {
        display: block
    }

    .module_hEWu4upOZcr0 .header .navBox {
        width: auto
    }

    .module_hEWu4upOZcr0 .header .langBox::after {
        display: none
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .h3 a span {
        font-size: 14px;
        margin: 0 5px 0 0;
        display: none
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavList>a {
        display: flex;
        align-items: center;
        line-height: unset;
        padding: 15px 45px 15px 25px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavList>a img {
        width: 25px;
        margin: 0 10px 0 0
    }

    .header .linkRight {
        padding: 10px 0 0
    }

    .header .linkRight a img {
        height: 14px;
        margin: 0 10px 0 0;
        filter: unset
    }

    .header .linkRight1 a img {
        height: 15px
    }

    .header .linkRight a {
        width: 55%;
        justify-content: center;
        margin: auto;
        padding: 6px;
        background: #fb7d20;
        color: #fff
    }
}

@media(min-width:992px) {

    .module_hEWu4upOZcr0 .header .logo,
    .module_hEWu4upOZcr0 .header .logo a {
        width: 7.447917vw
    }

    .module_hEWu4upOZcr0 .header .navBox {
        backdrop-filter: blur(16px);
        border-radius: 50px;
        justify-content: right;
        margin: 0 0 0 1.145833vw
    }

    .module_hEWu4upOZcr0 .header .logo svg {
        width: 4.010417vw;
        top: -1.692708vw;
        right: -.260417vw
    }

    .header .topRight {
        margin: 0 0 .729vw;
        padding: 0 .572917vw 0 0
    }

    .header .topRight>div {
        margin: 0 1.822917vw 0 0
    }

    .header .topRight>div a {
        margin: 0 0 0 2.34375vw
    }

    .header .linkRight1 {
        padding: 0 4.6875vw 0 3.645833vw
    }

    .header .linkRight2 {
        padding: 0 3.90625vw
    }

    .header .linkRight2::before {
        top: .46875vw;
        width: .052083vw;
        height: 1.197917vw
    }

    .header .linkRight a {
        width: 7.8125vw;
        height: 2.03125vw
    }

    .header .linkRight a img {
        margin: 0 .364583vw 0 0;
        height: .9375vw;
        object-fit: contain
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .h3 a span {
        padding: 0 .416667vw 0 0
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNav .subNavList>a img {
        height: 2.604167vw;
        margin: 0 auto .9375vw
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNav {
        padding: 1.145833vw 0 1.354167vw;
        margin: .364583vw 0 0;
        border-radius: .885417vw;
        background: #fff;
        display: flex;
        justify-content: center;
        width: 100%;
        flex-wrap: wrap
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavList {
        padding: .520833vw 0;
        max-width: 18.229vw
    }

    .header .linkRight1 a img {
        height: .989583vw
    }

    .module_hEWu4upOZcr0 .header .langBox::after {
        border-top: .3125vw solid rgba(251, 125, 32, .7);
        border-right: .208333vw solid #00000000;
        border-bottom: .208333vw solid #00000000;
        border-left: .208333vw solid #00000000
    }
}

@media(max-width:992px) {

    .module2 li,
    .module2 li:nth-child(2n) {
        flex-direction: column-reverse
    }

    .module2 li>div.info,
    .module2 li>div.video_warp {
        width: 100%
    }

    .module2 .video_warp {
        padding-bottom: 56%
    }

    .microinverter .bannerInner .text .title,
    .recommend_warp .title {
        font-size: 30px
    }

    .microinverter .bannerInner .text .intro {
        font-size: 24px
    }

    .recommend_warp ul li p {
        font-size: 18px;
        line-height: 1.8
    }

    .module2 .info .title {
        margin-top: 20px
    }
}

@media(max-width:750px) {
    .module1 .title {
        font-size: 30px
    }

    .module2 .info .title {
        font-size: 28px
    }

    .introduce_warp .title {
        font-size: 30px
    }

    .leader .information {
        flex-direction: column
    }

    .leader .information .left_img {
        width: 80%;
        padding-bottom: 80%
    }

    .leader .information .information_info {
        width: 100% !important
    }
}

@media(max-width:450px) {

    .introduce_warp .title,
    .microinverter .bannerInner .text .title,
    .module1 .title,
    .recommend_warp .title {
        font-size: 22px
    }

    .module2 .info .title {
        font-size: 28px
    }

    .introduce_warp .title {
        font-size: 30px
    }

    .introduce ul li p,
    .microinverter .bannerInner .text .intro,
    .module1 .text_content,
    .recommend_warp ul li p,
    .tsun .content {
        font-size: 16px
    }

    .recommend_warp ul {
        flex-wrap: wrap;
        flex-direction: column
    }

    .recommend_warp ul li {
        width: 100%;
        max-width: 100%
    }
}

@media(min-width:1200px) {
    .module_hEWu4upOZcr0 .header .langBox::after {
        top: calc(50% - 1px)
    }
}

@media(min-width:1600px) {

    .module_hEWu4upOZcr0 .header .logo,
    .module_hEWu4upOZcr0 .header .logo a {
        width: 143px
    }

    .module_hEWu4upOZcr0 .header .logo svg {
        width: 77px;
        top: -32.5px;
        right: -5px
    }

    .header .columns {
        flex-wrap: wrap;
        flex: 1
    }

    .header .topRight {
        margin: 0 0 14px;
        padding: 0 11px 0 0
    }

    .header .topRight>div {
        display: flex;
        margin: 0 35px 0 0
    }

    .header .topRight>div a {
        margin: 0 0 0 45px
    }

    .module_hEWu4upOZcr0 .header .navBox {
        margin: 0 0 0 22px
    }

    .header .linkRight1 {
        padding: 0 90px 0 70px
    }

    .header .linkRight2 {
        padding: 0 75px
    }

    .header .linkRight2::before {
        top: 9px;
        height: 23px
    }

    .header .linkRight a {
        width: 150px;
        height: 39px;
        border-radius: 50px
    }

    .header .linkRight a img {
        margin: 0 7px 0 0;
        height: 18px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .h3 a span {
        padding: 0 8px 0 0;
        display: none
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNav .subNavList>a img {
        height: 50px;
        margin: 0 auto 18px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNav {
        padding: 22px 0 26px;
        margin: 7px 0 0;
        border-radius: 17px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavList {
        padding: 10px 0;
        max-width: 350px
    }

    .header .linkRight1 a img {
        height: 19px
    }

    .module_hEWu4upOZcr0 .header .langBox::after {
        top: calc(50% - 2px);
        border-top: 6px solid rgba(251, 125, 32, .7);
        border-right: 4px solid #00000000;
        border-bottom: 4px solid #00000000;
        border-left: 4px solid #00000000
    }

    .module_hEWu4upOZcr0 .header .langBox.rotated::after {
        transform: rotate(180deg);
        top: calc(38% - 5px)
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .threeNavBox .threeNav {
        max-height: 600px;
        overflow: auto;
        margin: 0 20px 0 0
    }

    html {
        --content-Wdith: 1750px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list {
        margin-left: 70px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list h3 a {
        font-size: 16px;
        line-height: 57px
    }

    .module_hEWu4upOZcr0 .header .navBox .navList .list .subNavMain .subNavBox .subNav .subNavList>a {
        font-size: 16px;
        padding: 0 40px
    }

    .module_hEWu4upOZcr0 .header .logo img {
        height: 50px
    }
}

blockquote,
body,
button,
dd,
div,
dl,
dt,
form,
h1,
h2,
h3,
h4,
h5,
h6,
input,
li,
ol,
p,
pre,
td,
textarea,
th,
ul {
    margin: 0;
    padding: 0;
    -webkit-tap-highlight-color: transparent
}

a:active,
a:hover {
    outline: 0
}

img {
    max-width: 100%;
    height: auto;
    display: inline-block;
    border: none;
    vertical-align: middle
}

li {
    list-style: none
}

h1,
h2,
h3,
h4 {
    font-weight: 700
}

h5,
h6 {
    font-weight: 500;
    font-size: 100%
}

button,
input,
select,
textarea {
    font-size: 100%
}

button,
input,
optgroup,
option,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
    outline: 0
}

pre {
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word
}

body {
    line-height: 1.6;
    color: rgba(0, 0, 0, .85);
    font: var(--font-size14) HarmonyOS Sans SC, OPPOSans, PingFang SC, Source Han Sans, Microsoft YaHei
}

hr {
    height: 0;
    line-height: 0;
    margin: 10px 0;
    padding: 0;
    border: none;
    border-bottom: 1px solid #eee;
    clear: both;
    overflow: hidden;
    background: 0 0
}

a cite {
    font-style: normal
}

.layui-border-box,
.layui-border-box * {
    box-sizing: border-box
}

.layui-box,
.layui-box * {
    box-sizing: content-box
}

.layui-clear {
    clear: both
}

.layui-clear:after {
    content: '\20';
    clear: both;
    display: block;
    height: 0
}

.layui-clear-space {
    word-spacing: -5px
}

.layui-inline {
    position: relative;
    display: inline-block;
    vertical-align: middle
}

.layui-edge {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width: 0;
    height: 0;
    border: 6px dashed transparent;
    overflow: hidden
}

.layui-edge-top {
    top: -4px;
    border-bottom-color: #999;
    border-bottom-style: solid
}

.layui-edge-right {
    border-left-color: #999;
    border-left-style: solid
}

.layui-edge-bottom {
    top: 2px;
    border-top-color: #999;
    border-top-style: solid
}

.layui-edge-left {
    border-right-color: #999;
    border-right-style: solid
}

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

.layui-disabled,
.layui-icon,
.layui-unselect {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none
}

.layui-disabled,
.layui-disabled:hover {
    color: #d2d2d2 !important;
    cursor: not-allowed !important
}

.layui-circle {
    border-radius: 100%
}

.layui-show {
    display: block !important
}

.layui-hide {
    display: none !important
}

.layui-show-v {
    visibility: visible !important
}

.layui-hide-v {
    visibility: hidden !important
}

@font-face {
    font-family: layui-icon;
    src: url(../font/iconfont.eot);
    src: url(../font/iconfont.woff2) format('woff2'), url(../font/iconfont.woff) format('woff'), url(../font/iconfont.ttf) format('truetype'), url(../font/font/iconfont.svg) format('svg');
    font-display: swap
}

.layui-icon {
    font-family: layui-icon !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.layui-icon-leaf:before {
    content: "\e701"
}

.layui-icon-folder:before {
    content: "\eabe"
}

.layui-icon-folder-open:before {
    content: "\eac1"
}

.layui-icon-gitee:before {
    content: "\e69b"
}

.layui-icon-github:before {
    content: "\e6a7"
}

.layui-icon-disabled:before {
    content: "\e6cc"
}

.layui-icon-moon:before {
    content: "\e6c2"
}

.layui-icon-error:before {
    content: "\e693"
}

.layui-icon-success:before {
    content: "\e697"
}

.layui-icon-question:before {
    content: "\e699"
}

.layui-icon-lock:before {
    content: "\e69a"
}

.layui-icon-eye:before {
    content: "\e695"
}

.layui-icon-eye-invisible:before {
    content: "\e696"
}

.layui-icon-backspace:before {
    content: "\e694"
}

.layui-icon-tips-fill:before {
    content: "\eb2e"
}

.layui-icon-test:before {
    content: "\e692"
}

.layui-icon-clear:before {
    content: "\e788"
}

.layui-icon-heart-fill:before {
    content: "\e68f"
}

.layui-icon-light:before {
    content: "\e748"
}

.layui-icon-music:before {
    content: "\e690"
}

.layui-icon-time:before {
    content: "\e68d"
}

.layui-icon-ie:before {
    content: "\e7bb"
}

.layui-icon-firefox:before {
    content: "\e686"
}

.layui-icon-at:before {
    content: "\e687"
}

.layui-icon-bluetooth:before {
    content: "\e689"
}

.layui-icon-chrome:before {
    content: "\e68a"
}

.layui-icon-edge:before {
    content: "\e68b"
}

.layui-icon-heart:before {
    content: "\e68c"
}

.layui-icon-key:before {
    content: "\e683"
}

.layui-icon-android:before {
    content: "\e684"
}

.layui-icon-mike:before {
    content: "\e6dc"
}

.layui-icon-mute:before {
    content: "\e685"
}

.layui-icon-gift:before {
    content: "\e627"
}

.layui-icon-windows:before {
    content: "\e67f"
}

.layui-icon-ios:before {
    content: "\e680"
}

.layui-icon-logout:before {
    content: "\e682"
}

.layui-icon-wifi:before {
    content: "\e7e0"
}

.layui-icon-rss:before {
    content: "\e808"
}

.layui-icon-email:before {
    content: "\e618"
}

.layui-icon-reduce-circle:before {
    content: "\e616"
}

.layui-icon-transfer:before {
    content: "\e691"
}

.layui-icon-service:before {
    content: "\e626"
}

.layui-icon-addition:before {
    content: "\e624"
}

.layui-icon-subtraction:before {
    content: "\e67e"
}

.layui-icon-slider:before {
    content: "\e714"
}

.layui-icon-print:before {
    content: "\e66d"
}

.layui-icon-export:before {
    content: "\e67d"
}

.layui-icon-cols:before {
    content: "\e610"
}

.layui-icon-screen-full:before {
    content: "\e622"
}

.layui-icon-screen-restore:before {
    content: "\e758"
}

.layui-icon-rate-half:before {
    content: "\e6c9"
}

.layui-icon-rate-solid:before {
    content: "\e67a"
}

.layui-icon-rate:before {
    content: "\e67b"
}

.layui-icon-cellphone:before {
    content: "\e678"
}

.layui-icon-vercode:before {
    content: "\e679"
}

.layui-icon-login-weibo:before {
    content: "\e675"
}

.layui-icon-login-qq:before {
    content: "\e676"
}

.layui-icon-login-wechat:before {
    content: "\e677"
}

.layui-icon-username:before {
    content: "\e66f"
}

.layui-icon-password:before {
    content: "\e673"
}

.layui-icon-refresh-3:before {
    content: "\e9aa"
}

.layui-icon-auz:before {
    content: "\e672"
}

.layui-icon-shrink-right:before {
    content: "\e668"
}

.layui-icon-spread-left:before {
    content: "\e66b"
}

.layui-icon-snowflake:before {
    content: "\e6b1"
}

.layui-icon-tips:before {
    content: "\e702"
}

.layui-icon-note:before {
    content: "\e66e"
}

.layui-icon-senior:before {
    content: "\e674"
}

.layui-icon-refresh-1:before {
    content: "\e666"
}

.layui-icon-refresh:before {
    content: "\e669"
}

.layui-icon-flag:before {
    content: "\e66c"
}

.layui-icon-theme:before {
    content: "\e66a"
}

.layui-icon-notice:before {
    content: "\e667"
}

.layui-icon-console:before {
    content: "\e665"
}

.layui-icon-website:before {
    content: "\e7ae"
}

.layui-icon-face-surprised:before {
    content: "\e664"
}

.layui-icon-set:before {
    content: "\e716"
}

.layui-icon-template:before {
    content: "\e663"
}

.layui-icon-app:before {
    content: "\e653"
}

.layui-icon-template-1:before {
    content: "\e656"
}

.layui-icon-home:before {
    content: "\e68e"
}

.layui-icon-female:before {
    content: "\e661"
}

.layui-icon-male:before {
    content: "\e662"
}

.layui-icon-tread:before {
    content: "\e6c5"
}

.layui-icon-praise:before {
    content: "\e6c6"
}

.layui-icon-rmb:before {
    content: "\e65e"
}

.layui-icon-more:before {
    content: "\e65f"
}

.layui-icon-camera:before {
    content: "\e660"
}

.layui-icon-cart-simple:before {
    content: "\e698"
}

.layui-icon-face-cry:before {
    content: "\e69c"
}

.layui-icon-face-smile:before {
    content: "\e6af"
}

.layui-icon-survey:before {
    content: "\e6b2"
}

.layui-icon-read:before {
    content: "\e705"
}

.layui-icon-location:before {
    content: "\e715"
}

.layui-icon-dollar:before {
    content: "\e659"
}

.layui-icon-diamond:before {
    content: "\e735"
}

.layui-icon-return:before {
    content: "\e65c"
}

.layui-icon-camera-fill:before {
    content: "\e65d"
}

.layui-icon-fire:before {
    content: "\e756"
}

.layui-icon-more-vertical:before {
    content: "\e671"
}

.layui-icon-cart:before {
    content: "\e657"
}

.layui-icon-star-fill:before {
    content: "\e658"
}

.layui-icon-prev:before {
    content: "\e65a"
}

.layui-icon-next:before {
    content: "\e65b"
}

.layui-icon-upload:before {
    content: "\e67c"
}

.layui-icon-upload-drag:before {
    content: "\e681"
}

.layui-icon-user:before {
    content: "\e770"
}

.layui-icon-file-b:before {
    content: "\e655"
}

.layui-icon-component:before {
    content: "\e857"
}

.layui-icon-find-fill:before {
    content: "\e670"
}

.layui-icon-loading:before {
    content: "\e63d"
}

.layui-icon-loading-1:before {
    content: "\e63e"
}

.layui-icon-add-1:before {
    content: "\e654"
}

.layui-icon-pause:before {
    content: "\e651"
}

.layui-icon-play:before {
    content: "\e652"
}

.layui-icon-video:before {
    content: "\e6ed"
}

.layui-icon-headset:before {
    content: "\e6fc"
}

.layui-icon-voice:before {
    content: "\e688"
}

.layui-icon-speaker:before {
    content: "\e645"
}

.layui-icon-fonts-del:before {
    content: "\e64f"
}

.layui-icon-fonts-html:before {
    content: "\e64b"
}

.layui-icon-fonts-code:before {
    content: "\e64e"
}

.layui-icon-fonts-strong:before {
    content: "\e62b"
}

.layui-icon-unlink:before {
    content: "\e64d"
}

.layui-icon-picture:before {
    content: "\e64a"
}

.layui-icon-link:before {
    content: "\e64c"
}

.layui-icon-face-smile-b:before {
    content: "\e650"
}

.layui-icon-align-center:before {
    content: "\e647"
}

.layui-icon-align-right:before {
    content: "\e648"
}

.layui-icon-align-left:before {
    content: "\e649"
}

.layui-icon-fonts-u:before {
    content: "\e646"
}

.layui-icon-fonts-i:before {
    content: "\e644"
}

.layui-icon-tabs:before {
    content: "\e62a"
}

.layui-icon-circle:before {
    content: "\e63f"
}

.layui-icon-radio:before {
    content: "\e643"
}

.layui-icon-share:before {
    content: "\e641"
}

.layui-icon-edit:before {
    content: "\e642"
}

.layui-icon-delete:before {
    content: "\e640"
}

.layui-icon-engine:before {
    content: "\e628"
}

.layui-icon-chart-screen:before {
    content: "\e629"
}

.layui-icon-chart:before {
    content: "\e62c"
}

.layui-icon-table:before {
    content: "\e62d"
}

.layui-icon-tree:before {
    content: "\e62e"
}

.layui-icon-upload-circle:before {
    content: "\e62f"
}

.layui-icon-templeate-1:before {
    content: "\e630"
}

.layui-icon-util:before {
    content: "\e631"
}

.layui-icon-layouts:before {
    content: "\e632"
}

.layui-icon-prev-circle:before {
    content: "\e633"
}

.layui-icon-carousel:before {
    content: "\e634"
}

.layui-icon-code-circle:before {
    content: "\e635"
}

.layui-icon-water:before {
    content: "\e636"
}

.layui-icon-date:before {
    content: "\e637"
}

.layui-icon-layer:before {
    content: "\e638"
}

.layui-icon-fonts-clear:before {
    content: "\e639"
}

.layui-icon-dialogue:before {
    content: "\e63a"
}

.layui-icon-cellphone-fine:before {
    content: "\e63b"
}

.layui-icon-form:before {
    content: "\e63c"
}

.layui-icon-file:before {
    content: "\e621"
}

.layui-icon-triangle-r:before {
    content: "\e623"
}

.layui-icon-triangle-d:before {
    content: "\e625"
}

.layui-icon-set-sm:before {
    content: "\e620"
}

.layui-icon-add-circle:before {
    content: "\e61f"
}

.layui-icon-layim-download:before {
    content: "\e61e"
}

.layui-icon-layim-uploadfile:before {
    content: "\e61d"
}

.layui-icon-404:before {
    content: "\e61c"
}

.layui-icon-about:before {
    content: "\e60b"
}

.layui-icon-layim-theme:before {
    content: "\e61b"
}

.layui-icon-down:before {
    content: "\e61a"
}

.layui-icon-up:before {
    content: "\e619"
}

.layui-icon-circle-dot:before {
    content: "\e617"
}

.layui-icon-set-fill:before {
    content: "\e614"
}

.layui-icon-search:before {
    content: "\e615"
}

.layui-icon-friends:before {
    content: "\e612"
}

.layui-icon-group:before {
    content: "\e613"
}

.layui-icon-reply-fill:before {
    content: "\e611"
}

.layui-icon-menu-fill:before {
    content: "\e60f"
}

.layui-icon-face-smile-fine:before {
    content: "\e60c"
}

.layui-icon-picture-fine:before {
    content: "\e60d"
}

.layui-icon-log:before {
    content: "\e60e"
}

.layui-icon-list:before {
    content: "\e60a"
}

.layui-icon-release:before {
    content: "\e609"
}

.layui-icon-add-circle-fine:before {
    content: "\e608"
}

.layui-icon-ok:before {
    content: "\e605"
}

.layui-icon-help:before {
    content: "\e607"
}

.layui-icon-chat:before {
    content: "\e606"
}

.layui-icon-top:before {
    content: "\e604"
}

.layui-icon-right:before {
    content: "\e602"
}

.layui-icon-left:before {
    content: "\e603"
}

.layui-icon-star:before {
    content: "\e600"
}

.layui-icon-download-circle:before {
    content: "\e601"
}

.layui-icon-close:before {
    content: "\1006"
}

.layui-icon-close-fill:before {
    content: "\1007"
}

.layui-icon-ok-circle:before {
    content: "\1005"
}

.layui-main {
    position: relative;
    width: 1160px;
    margin: 0 auto
}

.layui-header {
    position: relative;
    z-index: 1000;
    height: 60px
}

.layui-header a:hover {
    transition: .5s;
    -webkit-transition: .5s
}

.layui-side {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 999;
    width: 200px;
    overflow-x: hidden
}

.layui-side-scroll {
    position: relative;
    width: 220px;
    height: 100%;
    overflow-x: hidden
}

.layui-body {
    position: relative;
    left: 200px;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 900;
    width: auto;
    box-sizing: border-box
}

.layui-layout-body {
    overflow-x: hidden
}

.layui-layout-admin .layui-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: #23292e
}

.layui-layout-admin .layui-side {
    top: 60px;
    width: 200px;
    overflow-x: hidden
}

.layui-layout-admin .layui-body {
    position: absolute;
    top: 60px;
    padding-bottom: 44px
}

.layui-layout-admin .layui-main {
    width: auto;
    margin: 0 15px
}

.layui-layout-admin .layui-footer {
    position: fixed;
    left: 200px;
    right: 0;
    bottom: 0;
    z-index: 990;
    height: 44px;
    line-height: 44px;
    padding: 0 15px;
    box-shadow: -1px 0 4px rgb(0 0 0 / 12%);
    background-color: #fafafa
}

.layui-layout-admin .layui-logo {
    position: absolute;
    left: 0;
    top: 0;
    width: 200px;
    height: 100%;
    line-height: 60px;
    text-align: center;
    color: #16baaa;
    font-size: 16px;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%)
}

.layui-layout-admin .layui-header .layui-nav {
    background: 0 0
}

.layui-layout-left {
    position: absolute !important;
    left: 200px;
    top: 0
}

.layui-layout-right {
    position: absolute !important;
    right: 0;
    top: 0
}

.layui-container {
    position: relative;
    margin: 0 auto;
    box-sizing: border-box
}

.layui-fluid {
    position: relative;
    margin: 0 auto;
    padding: 0 15px
}

.layui-row:after,
.layui-row:before {
    content: "";
    display: block;
    clear: both
}

.layui-col-lg1,
.layui-col-lg10,
.layui-col-lg11,
.layui-col-lg12,
.layui-col-lg2,
.layui-col-lg3,
.layui-col-lg4,
.layui-col-lg5,
.layui-col-lg6,
.layui-col-lg7,
.layui-col-lg8,
.layui-col-lg9,
.layui-col-md1,
.layui-col-md10,
.layui-col-md11,
.layui-col-md12,
.layui-col-md2,
.layui-col-md3,
.layui-col-md4,
.layui-col-md5,
.layui-col-md6,
.layui-col-md7,
.layui-col-md8,
.layui-col-md9,
.layui-col-sm1,
.layui-col-sm10,
.layui-col-sm11,
.layui-col-sm12,
.layui-col-sm2,
.layui-col-sm3,
.layui-col-sm4,
.layui-col-sm5,
.layui-col-sm6,
.layui-col-sm7,
.layui-col-sm8,
.layui-col-sm9,
.layui-col-xl1,
.layui-col-xl10,
.layui-col-xl11,
.layui-col-xl12,
.layui-col-xl2,
.layui-col-xl3,
.layui-col-xl4,
.layui-col-xl5,
.layui-col-xl6,
.layui-col-xl7,
.layui-col-xl8,
.layui-col-xl9,
.layui-col-xs1,
.layui-col-xs10,
.layui-col-xs11,
.layui-col-xs12,
.layui-col-xs2,
.layui-col-xs3,
.layui-col-xs4,
.layui-col-xs5,
.layui-col-xs6,
.layui-col-xs7,
.layui-col-xs8,
.layui-col-xs9 {
    position: relative;
    display: block;
    box-sizing: border-box
}

.layui-col-xs1,
.layui-col-xs10,
.layui-col-xs11,
.layui-col-xs12,
.layui-col-xs2,
.layui-col-xs3,
.layui-col-xs4,
.layui-col-xs5,
.layui-col-xs6,
.layui-col-xs7,
.layui-col-xs8,
.layui-col-xs9 {
    float: left
}

.layui-col-xs1 {
    width: 8.33333333%
}

.layui-col-xs2 {
    width: 16.66666667%
}

.layui-col-xs3 {
    width: 25%
}

.layui-col-xs4 {
    width: 33.33333333%
}

.layui-col-xs5 {
    width: 41.66666667%
}

.layui-col-xs6 {
    width: 50%
}

.layui-col-xs7 {
    width: 58.33333333%
}

.layui-col-xs8 {
    width: 66.66666667%
}

.layui-col-xs9 {
    width: 75%
}

.layui-col-xs10 {
    width: 83.33333333%
}

.layui-col-xs11 {
    width: 91.66666667%
}

.layui-col-xs12 {
    width: 100%
}

.layui-col-xs-offset1 {
    margin-left: 8.33333333%
}

.layui-col-xs-offset2 {
    margin-left: 16.66666667%
}

.layui-col-xs-offset3 {
    margin-left: 25%
}

.layui-col-xs-offset4 {
    margin-left: 33.33333333%
}

.layui-col-xs-offset5 {
    margin-left: 41.66666667%
}

.layui-col-xs-offset6 {
    margin-left: 50%
}

.layui-col-xs-offset7 {
    margin-left: 58.33333333%
}

.layui-col-xs-offset8 {
    margin-left: 66.66666667%
}

.layui-col-xs-offset9 {
    margin-left: 75%
}

.layui-col-xs-offset10 {
    margin-left: 83.33333333%
}

.layui-col-xs-offset11 {
    margin-left: 91.66666667%
}

.layui-col-xs-offset12 {
    margin-left: 100%
}

@media screen and (max-width:767.98px) {
    .layui-container {
        padding: 0 15px
    }

    .layui-hide-xs {
        display: none !important
    }

    .layui-show-xs-block {
        display: block !important
    }

    .layui-show-xs-inline {
        display: inline !important
    }

    .layui-show-xs-inline-block {
        display: inline-block !important
    }
}

@media screen and (min-width:768px) {
    .layui-container {
        width: 720px
    }

    .layui-hide-sm {
        display: none !important
    }

    .layui-show-sm-block {
        display: block !important
    }

    .layui-show-sm-inline {
        display: inline !important
    }

    .layui-show-sm-inline-block {
        display: inline-block !important
    }

    .layui-col-sm1,
    .layui-col-sm10,
    .layui-col-sm11,
    .layui-col-sm12,
    .layui-col-sm2,
    .layui-col-sm3,
    .layui-col-sm4,
    .layui-col-sm5,
    .layui-col-sm6,
    .layui-col-sm7,
    .layui-col-sm8,
    .layui-col-sm9 {
        float: left
    }

    .layui-col-sm1 {
        width: 8.33333333%
    }

    .layui-col-sm2 {
        width: 16.66666667%
    }

    .layui-col-sm3 {
        width: 25%
    }

    .layui-col-sm4 {
        width: 33.33333333%
    }

    .layui-col-sm5 {
        width: 41.66666667%
    }

    .layui-col-sm6 {
        width: 50%
    }

    .layui-col-sm7 {
        width: 58.33333333%
    }

    .layui-col-sm8 {
        width: 66.66666667%
    }

    .layui-col-sm9 {
        width: 75%
    }

    .layui-col-sm10 {
        width: 83.33333333%
    }

    .layui-col-sm11 {
        width: 91.66666667%
    }

    .layui-col-sm12 {
        width: 100%
    }

    .layui-col-sm-offset1 {
        margin-left: 8.33333333%
    }

    .layui-col-sm-offset2 {
        margin-left: 16.66666667%
    }

    .layui-col-sm-offset3 {
        margin-left: 25%
    }

    .layui-col-sm-offset4 {
        margin-left: 33.33333333%
    }

    .layui-col-sm-offset5 {
        margin-left: 41.66666667%
    }

    .layui-col-sm-offset6 {
        margin-left: 50%
    }

    .layui-col-sm-offset7 {
        margin-left: 58.33333333%
    }

    .layui-col-sm-offset8 {
        margin-left: 66.66666667%
    }

    .layui-col-sm-offset9 {
        margin-left: 75%
    }

    .layui-col-sm-offset10 {
        margin-left: 83.33333333%
    }

    .layui-col-sm-offset11 {
        margin-left: 91.66666667%
    }

    .layui-col-sm-offset12 {
        margin-left: 100%
    }
}

@media screen and (min-width:992px) {
    .layui-container {
        width: 960px
    }

    .layui-hide-md {
        display: none !important
    }

    .layui-show-md-block {
        display: block !important
    }

    .layui-show-md-inline {
        display: inline !important
    }

    .layui-show-md-inline-block {
        display: inline-block !important
    }

    .layui-col-md1,
    .layui-col-md10,
    .layui-col-md11,
    .layui-col-md12,
    .layui-col-md2,
    .layui-col-md3,
    .layui-col-md4,
    .layui-col-md5,
    .layui-col-md6,
    .layui-col-md7,
    .layui-col-md8,
    .layui-col-md9 {
        float: left
    }

    .layui-col-md1 {
        width: 8.33333333%
    }

    .layui-col-md2 {
        width: 16.66666667%
    }

    .layui-col-md3 {
        width: 25%
    }

    .layui-col-md4 {
        width: 33.33333333%
    }

    .layui-col-md5 {
        width: 41.66666667%
    }

    .layui-col-md6 {
        width: 50%
    }

    .layui-col-md7 {
        width: 58.33333333%
    }

    .layui-col-md8 {
        width: 66.66666667%
    }

    .layui-col-md9 {
        width: 75%
    }

    .layui-col-md10 {
        width: 83.33333333%
    }

    .layui-col-md11 {
        width: 91.66666667%
    }

    .layui-col-md12 {
        width: 100%
    }

    .layui-col-md-offset1 {
        margin-left: 8.33333333%
    }

    .layui-col-md-offset2 {
        margin-left: 16.66666667%
    }

    .layui-col-md-offset3 {
        margin-left: 25%
    }

    .layui-col-md-offset4 {
        margin-left: 33.33333333%
    }

    .layui-col-md-offset5 {
        margin-left: 41.66666667%
    }

    .layui-col-md-offset6 {
        margin-left: 50%
    }

    .layui-col-md-offset7 {
        margin-left: 58.33333333%
    }

    .layui-col-md-offset8 {
        margin-left: 66.66666667%
    }

    .layui-col-md-offset9 {
        margin-left: 75%
    }

    .layui-col-md-offset10 {
        margin-left: 83.33333333%
    }

    .layui-col-md-offset11 {
        margin-left: 91.66666667%
    }

    .layui-col-md-offset12 {
        margin-left: 100%
    }
}

@media screen and (min-width:1200px) {
    .layui-container {
        width: 1150px
    }

    .layui-hide-lg {
        display: none !important
    }

    .layui-show-lg-block {
        display: block !important
    }

    .layui-show-lg-inline {
        display: inline !important
    }

    .layui-show-lg-inline-block {
        display: inline-block !important
    }

    .layui-col-lg1,
    .layui-col-lg10,
    .layui-col-lg11,
    .layui-col-lg12,
    .layui-col-lg2,
    .layui-col-lg3,
    .layui-col-lg4,
    .layui-col-lg5,
    .layui-col-lg6,
    .layui-col-lg7,
    .layui-col-lg8,
    .layui-col-lg9 {
        float: left
    }

    .layui-col-lg1 {
        width: 8.33333333%
    }

    .layui-col-lg2 {
        width: 16.66666667%
    }

    .layui-col-lg3 {
        width: 25%
    }

    .layui-col-lg4 {
        width: 33.33333333%
    }

    .layui-col-lg5 {
        width: 41.66666667%
    }

    .layui-col-lg6 {
        width: 50%
    }

    .layui-col-lg7 {
        width: 58.33333333%
    }

    .layui-col-lg8 {
        width: 66.66666667%
    }

    .layui-col-lg9 {
        width: 75%
    }

    .layui-col-lg10 {
        width: 83.33333333%
    }

    .layui-col-lg11 {
        width: 91.66666667%
    }

    .layui-col-lg12 {
        width: 100%
    }

    .layui-col-lg-offset1 {
        margin-left: 8.33333333%
    }

    .layui-col-lg-offset2 {
        margin-left: 16.66666667%
    }

    .layui-col-lg-offset3 {
        margin-left: 25%
    }

    .layui-col-lg-offset4 {
        margin-left: 33.33333333%
    }

    .layui-col-lg-offset5 {
        margin-left: 41.66666667%
    }

    .layui-col-lg-offset6 {
        margin-left: 50%
    }

    .layui-col-lg-offset7 {
        margin-left: 58.33333333%
    }

    .layui-col-lg-offset8 {
        margin-left: 66.66666667%
    }

    .layui-col-lg-offset9 {
        margin-left: 75%
    }

    .layui-col-lg-offset10 {
        margin-left: 83.33333333%
    }

    .layui-col-lg-offset11 {
        margin-left: 91.66666667%
    }

    .layui-col-lg-offset12 {
        margin-left: 100%
    }
}

@media screen and (min-width:1400px) {
    .layui-container {
        width: 1330px
    }

    .layui-hide-xl {
        display: none !important
    }

    .layui-show-xl-block {
        display: block !important
    }

    .layui-show-xl-inline {
        display: inline !important
    }

    .layui-show-xl-inline-block {
        display: inline-block !important
    }

    .layui-col-xl1,
    .layui-col-xl10,
    .layui-col-xl11,
    .layui-col-xl12,
    .layui-col-xl2,
    .layui-col-xl3,
    .layui-col-xl4,
    .layui-col-xl5,
    .layui-col-xl6,
    .layui-col-xl7,
    .layui-col-xl8,
    .layui-col-xl9 {
        float: left
    }

    .layui-col-xl1 {
        width: 8.33333333%
    }

    .layui-col-xl2 {
        width: 16.66666667%
    }

    .layui-col-xl3 {
        width: 25%
    }

    .layui-col-xl4 {
        width: 33.33333333%
    }

    .layui-col-xl5 {
        width: 41.66666667%
    }

    .layui-col-xl6 {
        width: 50%
    }

    .layui-col-xl7 {
        width: 58.33333333%
    }

    .layui-col-xl8 {
        width: 66.66666667%
    }

    .layui-col-xl9 {
        width: 75%
    }

    .layui-col-xl10 {
        width: 83.33333333%
    }

    .layui-col-xl11 {
        width: 91.66666667%
    }

    .layui-col-xl12 {
        width: 100%
    }

    .layui-col-xl-offset1 {
        margin-left: 8.33333333%
    }

    .layui-col-xl-offset2 {
        margin-left: 16.66666667%
    }

    .layui-col-xl-offset3 {
        margin-left: 25%
    }

    .layui-col-xl-offset4 {
        margin-left: 33.33333333%
    }

    .layui-col-xl-offset5 {
        margin-left: 41.66666667%
    }

    .layui-col-xl-offset6 {
        margin-left: 50%
    }

    .layui-col-xl-offset7 {
        margin-left: 58.33333333%
    }

    .layui-col-xl-offset8 {
        margin-left: 66.66666667%
    }

    .layui-col-xl-offset9 {
        margin-left: 75%
    }

    .layui-col-xl-offset10 {
        margin-left: 83.33333333%
    }

    .layui-col-xl-offset11 {
        margin-left: 91.66666667%
    }

    .layui-col-xl-offset12 {
        margin-left: 100%
    }
}

.layui-col-space1 {
    margin: -.5px
}

.layui-col-space1>* {
    padding: .5px
}

.layui-col-space2 {
    margin: -1px
}

.layui-col-space2>* {
    padding: 1px
}

.layui-col-space4 {
    margin: -2px
}

.layui-col-space4>* {
    padding: 2px
}

.layui-col-space5 {
    margin: -2.5px
}

.layui-col-space5>* {
    padding: 2.5px
}

.layui-col-space6 {
    margin: -3px
}

.layui-col-space6>* {
    padding: 3px
}

.layui-col-space8 {
    margin: -4px
}

.layui-col-space8>* {
    padding: 4px
}

.layui-col-space10 {
    margin: -5px
}

.layui-col-space10>* {
    padding: 5px
}

.layui-col-space12 {
    margin: -6px
}

.layui-col-space12>* {
    padding: 6px
}

.layui-col-space14 {
    margin: -7px
}

.layui-col-space14>* {
    padding: 7px
}

.layui-col-space15 {
    margin: -7.5px
}

.layui-col-space15>* {
    padding: 7.5px
}

.layui-col-space16 {
    margin: -8px
}

.layui-col-space16>* {
    padding: 8px
}

.layui-col-space18 {
    margin: -9px
}

.layui-col-space18>* {
    padding: 9px
}

.layui-col-space20 {
    margin: -10px
}

.layui-col-space20>* {
    padding: 10px
}

.layui-col-space22 {
    margin: -11px
}

.layui-col-space22>* {
    padding: 11px
}

.layui-col-space24 {
    margin: -12px
}

.layui-col-space24>* {
    padding: 12px
}

.layui-col-space25 {
    margin: -12.5px
}

.layui-col-space25>* {
    padding: 12.5px
}

.layui-col-space26 {
    margin: -13px
}

.layui-col-space26>* {
    padding: 13px
}

.layui-col-space28 {
    margin: -14px
}

.layui-col-space28>* {
    padding: 14px
}

.layui-col-space30 {
    margin: -15px
}

.layui-col-space30>* {
    padding: 15px
}

.layui-col-space32 {
    margin: -16px
}

.layui-col-space32>* {
    padding: 16px
}

.layui-padding-1 {
    padding: 4px !important
}

.layui-padding-2 {
    padding: 8px !important
}

.layui-padding-3 {
    padding: 16px !important
}

.layui-padding-4 {
    padding: 32px !important
}

.layui-padding-5 {
    padding: 48px !important
}

.layui-margin-1 {
    margin: 4px !important
}

.layui-margin-2 {
    margin: 8px !important
}

.layui-margin-3 {
    margin: 16px !important
}

.layui-margin-4 {
    margin: 32px !important
}

.layui-margin-5 {
    margin: 48px !important
}

.layui-btn,
.layui-input,
.layui-select,
.layui-textarea,
.layui-upload-button {
    outline: 0;
    -webkit-appearance: none;
    transition: .3s;
    -webkit-transition: .3s;
    box-sizing: border-box
}

.layui-elem-quote {
    margin-bottom: 10px;
    padding: 15px;
    line-height: 1.8;
    border-left: 5px solid #16b777;
    border-radius: 0 2px 2px 0;
    background-color: #fafafa
}

.layui-quote-nm {
    border-style: solid;
    border-width: 1px 1px 1px 5px;
    background: 0 0
}

.layui-elem-field {
    margin-bottom: 10px;
    padding: 0;
    border-width: 1px;
    border-style: solid
}

.layui-elem-field legend {
    margin-left: 20px;
    padding: 0 10px;
    font-size: 20px
}

.layui-field-title {
    margin: 16px 0;
    border-width: 1px 0 0
}

.layui-field-box {
    padding: 15px
}

.layui-field-title .layui-field-box {
    padding: 10px 0
}

.layui-progress {
    position: relative;
    height: 6px;
    border-radius: 20px;
    background-color: #eee
}

.layui-progress-bar {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    max-width: 100%;
    height: 6px;
    border-radius: 20px;
    text-align: right;
    background-color: #16b777;
    transition: .3s;
    -webkit-transition: .3s
}

.layui-progress-big,
.layui-progress-big .layui-progress-bar {
    height: 18px;
    line-height: 18px
}

.layui-progress-text {
    position: relative;
    top: -20px;
    line-height: 18px;
    font-size: 12px;
    color: #5f5f5f
}

.layui-progress-big .layui-progress-text {
    position: static;
    padding: 0 10px;
    color: #fff
}

.layui-collapse {
    border-width: 1px;
    border-style: solid;
    border-radius: 2px
}

.layui-colla-content,
.layui-colla-item {
    border-top-width: 1px;
    border-top-style: solid
}

.layui-colla-item:first-child {
    border-top: none
}

.layui-colla-title {
    position: relative;
    height: 42px;
    line-height: 42px;
    padding: 0 15px 0 35px;
    color: #333;
    background-color: #fafafa;
    cursor: pointer;
    font-size: 14px;
    overflow: hidden
}

.layui-colla-content {
    display: none;
    padding: 10px 15px;
    line-height: 1.6;
    color: #5f5f5f
}

.layui-colla-icon {
    position: absolute;
    left: 15px;
    top: 0;
    font-size: 14px
}

.layui-card {
    margin-bottom: 15px;
    border-radius: 2px;
    background-color: #fff;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05)
}

.layui-card:last-child {
    margin-bottom: 0
}

.layui-card-header {
    position: relative;
    height: 42px;
    line-height: 42px;
    padding: 0 15px;
    border-bottom: 1px solid #f8f8f8;
    color: #333;
    border-radius: 2px 2px 0 0;
    font-size: 14px
}

.layui-card-body {
    position: relative;
    padding: 10px 15px;
    line-height: 24px
}

.layui-card-body[pad15] {
    padding: 15px
}

.layui-card-body[pad20] {
    padding: 20px
}

.layui-card-body .layui-table {
    margin: 5px 0
}

.layui-card .layui-tab {
    margin: 0
}

.layui-panel {
    position: relative;
    border-width: 1px;
    border-style: solid;
    border-radius: 2px;
    box-shadow: 1px 1px 4px rgb(0 0 0 / 8%);
    background-color: #fff;
    color: #5f5f5f
}

.layui-panel-window {
    position: relative;
    padding: 15px;
    border-radius: 0;
    border-top: 5px solid #eee;
    background-color: #fff
}

.layui-auxiliar-moving {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: 0 0;
    z-index: 9999999999
}

.layui-scrollbar-hide {
    overflow: hidden !important
}

.layui-bg-red {
    background-color: #ff5722 !important;
    color: #fff !important
}

.layui-bg-orange {
    background-color: #ffb800 !important;
    color: #fff !important
}

.layui-bg-green {
    background-color: #16baaa !important;
    color: #fff !important
}

.layui-bg-cyan {
    background-color: #2f4056 !important;
    color: #fff !important
}

.layui-bg-blue {
    background-color: #1e9fff !important;
    color: #fff !important
}

.layui-bg-purple {
    background-color: #a233c6 !important;
    color: #fff !important
}

.layui-bg-black {
    background-color: #2f363c !important;
    color: #fff !important
}

.layui-bg-gray {
    background-color: #fafafa !important;
    color: #5f5f5f !important
}

.layui-badge-rim,
.layui-border,
.layui-colla-content,
.layui-colla-item,
.layui-collapse,
.layui-elem-field,
.layui-form-pane .layui-form-item[pane],
.layui-form-pane .layui-form-label,
.layui-input,
.layui-input-split,
.layui-panel,
.layui-quote-nm,
.layui-select,
.layui-tab-bar,
.layui-tab-card,
.layui-tab-title,
.layui-tab-title .layui-this:after,
.layui-textarea {
    border-color: #eee
}

.layui-border {
    border-width: 1px;
    border-style: solid;
    color: #5f5f5f !important
}

.layui-border-red {
    border-width: 1px;
    border-style: solid;
    border-color: #ff5722 !important;
    color: #ff5722 !important
}

.layui-border-orange {
    border-width: 1px;
    border-style: solid;
    border-color: #ffb800 !important;
    color: #ffb800 !important
}

.layui-border-green {
    border-width: 1px;
    border-style: solid;
    border-color: #16baaa !important;
    color: #16baaa !important
}

.layui-border-cyan {
    border-width: 1px;
    border-style: solid;
    border-color: #2f4056 !important;
    color: #2f4056 !important
}

.layui-border-blue {
    border-width: 1px;
    border-style: solid;
    border-color: #1e9fff !important;
    color: #1e9fff !important
}

.layui-border-purple {
    border-width: 1px;
    border-style: solid;
    border-color: #a233c6 !important;
    color: #a233c6 !important
}

.layui-border-black {
    border-width: 1px;
    border-style: solid;
    border-color: #2f363c !important;
    color: #2f363c !important
}

hr.layui-border-black,
hr.layui-border-blue,
hr.layui-border-cyan,
hr.layui-border-green,
hr.layui-border-orange,
hr.layui-border-purple,
hr.layui-border-red {
    border-width: 0 0 1px
}

.layui-timeline-item:before {
    background-color: #eee
}

.layui-text {
    line-height: 1.8;
    font-size: 14px
}

.layui-text h1,
.layui-text h2,
.layui-text h3,
.layui-text h4,
.layui-text h5,
.layui-text h6 {
    color: #3a3a3a
}

.layui-text h1 {
    font-size: 32px
}

.layui-text h2 {
    font-size: 24px
}

.layui-text h3 {
    font-size: 18px
}

.layui-text h4 {
    font-size: 16px
}

.layui-text h5 {
    font-size: 14px
}

.layui-text h6 {
    font-size: 13px
}

.layui-text ol,
.layui-text ul {
    padding-left: 15px
}

.layui-text ul li {
    margin-top: 5px;
    list-style-type: disc
}

.layui-text ol li {
    margin-top: 5px;
    list-style-type: decimal
}

.layui-text-em,
.layui-word-aux {
    color: #999 !important;
    padding-left: 5px !important;
    padding-right: 5px !important
}

.layui-text p {
    margin: 15px 0
}

.layui-text p:first-child {
    margin-top: 0
}

.layui-text p:last-child {
    margin-bottom: 0
}

.layui-text a:not(.layui-btn) {
    color: #01aaed
}

.layui-text a:not(.layui-btn):hover {
    text-decoration: underline
}

.layui-text blockquote:not(.layui-elem-quote) {
    padding: 5px 15px;
    border-left: 5px solid #eee
}

.layui-text pre>code:not(.layui-code) {
    padding: 15px;
    font-family: "Courier New", Consolas, "Lucida Console"
}

.layui-font-12 {
    font-size: 12px !important
}

.layui-font-13 {
    font-size: 13px !important
}

.layui-font-14 {
    font-size: 14px !important
}

.layui-font-16 {
    font-size: 16px !important
}

.layui-font-18 {
    font-size: 18px !important
}

.layui-font-20 {
    font-size: 20px !important
}

.layui-font-22 {
    font-size: 22px !important
}

.layui-font-24 {
    font-size: 24px !important
}

.layui-font-26 {
    font-size: 26px !important
}

.layui-font-28 {
    font-size: 28px !important
}

.layui-font-30 {
    font-size: 30px !important
}

.layui-font-32 {
    font-size: 32px !important
}

.layui-font-red {
    color: #ff5722 !important
}

.layui-font-orange {
    color: #ffb800 !important
}

.layui-font-green {
    color: #16baaa !important
}

.layui-font-cyan {
    color: #2f4056 !important
}

.layui-font-blue {
    color: #01aaed !important
}

.layui-font-purple {
    color: #a233c6 !important
}

.layui-font-black {
    color: #000 !important
}

.layui-font-gray {
    color: #c2c2c2 !important
}

.layui-btn {
    display: inline-block;
    vertical-align: middle;
    height: 38px;
    line-height: 38px;
    border: 1px solid transparent;
    padding: 0 18px;
    background-color: #16baaa;
    color: #fff;
    white-space: nowrap;
    text-align: center;
    font-size: 14px;
    border-radius: 2px;
    cursor: pointer;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none
}

.layui-btn:hover {
    opacity: .8;
    color: #fff
}

.layui-btn:active {
    opacity: 1
}

.layui-btn+.layui-btn {
    margin-left: 10px
}

.layui-btn-container {
    word-spacing: -5px
}

.layui-btn-container .layui-btn {
    margin-right: 10px;
    margin-bottom: 10px;
    word-spacing: normal
}

.layui-btn-container .layui-btn+.layui-btn {
    margin-left: 0
}

.layui-table .layui-btn-container .layui-btn {
    margin-bottom: 9px
}

.layui-btn-radius {
    border-radius: 100px
}

.layui-btn .layui-icon {
    padding: 0 2px;
    vertical-align: bottom
}

.layui-btn-primary {
    border-color: #d2d2d2;
    background: 0 0;
    color: #5f5f5f
}

.layui-btn-primary:hover {
    border-color: #16baaa;
    color: #333
}

.layui-btn-normal {
    background-color: #1e9fff
}

.layui-btn-warm {
    background-color: #ffb800
}

.layui-btn-danger {
    background-color: #ff5722
}

.layui-btn-checked {
    background-color: #16b777
}

.layui-btn-disabled,
.layui-btn-disabled:active,
.layui-btn-disabled:hover {
    border-color: #eee !important;
    background-color: #fbfbfb !important;
    color: #d2d2d2 !important;
    cursor: not-allowed !important;
    opacity: 1
}

.layui-btn-lg {
    height: 44px;
    line-height: 44px;
    padding: 0 25px;
    font-size: 16px
}

.layui-btn-sm {
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    font-size: 12px
}

.layui-btn-xs {
    height: 22px;
    line-height: 22px;
    padding: 0 5px;
    font-size: 12px
}

.layui-btn-xs i {
    font-size: 12px !important
}

.layui-btn-group {
    display: inline-block;
    vertical-align: middle;
    font-size: 0
}

.layui-btn-group .layui-btn {
    margin-left: 0 !important;
    margin-right: 0 !important;
    border-left: 1px solid rgba(255, 255, 255, .5);
    border-radius: 0
}

.layui-btn-group .layui-btn-primary {
    border-left: none
}

.layui-btn-group .layui-btn-primary:hover {
    border-color: #d2d2d2;
    color: #16baaa
}

.layui-btn-group .layui-btn:first-child {
    border-left: none;
    border-radius: 2px 0 0 2px
}

.layui-btn-group .layui-btn-primary:first-child {
    border-left: 1px solid #d2d2d2
}

.layui-btn-group .layui-btn:last-child {
    border-radius: 0 2px 2px 0
}

.layui-btn-group .layui-btn+.layui-btn {
    margin-left: 0
}

.layui-btn-group+.layui-btn-group {
    margin-left: 10px
}

.layui-btn-fluid {
    width: 100%
}

.layui-input,
.layui-select,
.layui-textarea {
    height: 38px;
    line-height: 1.3;
    border-width: 1px;
    border-style: solid;
    background-color: #fff;
    color: rgba(0, 0, 0, .85);
    border-radius: 2px
}

.layui-input::-webkit-input-placeholder,
.layui-select::-webkit-input-placeholder,
.layui-textarea::-webkit-input-placeholder {
    line-height: 1.3
}

.layui-input,
.layui-textarea {
    display: block;
    width: 100%;
    padding-left: 10px
}

.layui-input:hover,
.layui-textarea:hover {
    border-color: #d2d2d2 !important
}

.layui-input:focus,
.layui-textarea:focus {
    border-color: #fb6c0f !important;
    box-shadow: 0 0 0 3px rgba(22, 183, 119, .08)
}

.layui-textarea {
    position: relative;
    min-height: 100px;
    height: auto;
    line-height: 20px;
    padding: 6px 10px;
    resize: vertical
}

.layui-input[disabled],
.layui-textarea[disabled] {
    background-color: #fafafa
}

.layui-select {
    padding: 0 10px
}

.layui-form input[type=checkbox],
.layui-form input[type=radio],
.layui-form select {
    display: none
}

.layui-form [lay-ignore] {
    display: initial
}

.layui-form-item {
    position: relative;
    margin-bottom: 15px;
    clear: both
}

.layui-form-item:after {
    content: '\20';
    clear: both;
    display: block;
    height: 0
}

.layui-form-label {
    position: relative;
    float: left;
    display: block;
    padding: 9px 15px;
    width: 80px;
    font-weight: 400;
    line-height: 20px;
    text-align: right
}

.layui-form-label-col {
    display: block;
    float: none;
    padding: 9px 0;
    line-height: 20px;
    text-align: left
}

.layui-form-item .layui-inline {
    margin-bottom: 5px;
    margin-right: 10px
}

.layui-input-block,
.layui-input-inline {
    position: relative
}

.layui-input-block {
    margin-left: 110px;
    min-height: 36px
}

.layui-input-inline {
    display: inline-block;
    vertical-align: middle
}

.layui-form-item .layui-input-inline {
    float: left;
    width: 190px;
    margin-right: 10px
}

.layui-form-text .layui-input-inline {
    width: auto
}

.layui-form-mid {
    position: relative;
    float: left;
    display: block;
    padding: 9px 0 !important;
    line-height: 20px;
    margin-right: 10px
}

.layui-form-danger+.layui-form-select .layui-input,
.layui-form-danger:focus {
    border-color: #ff5722 !important;
    box-shadow: 0 0 0 3px rgba(255, 87, 34, .08)
}

.layui-input-prefix,
.layui-input-split,
.layui-input-suffix,
.layui-input-suffix .layui-input-affix {
    position: absolute;
    right: 0;
    top: 0;
    padding: 0 10px;
    width: 35px;
    height: 100%;
    text-align: center;
    transition: .3s;
    box-sizing: border-box
}

.layui-input-prefix {
    left: 0;
    border-radius: 2px 0 0 2px
}

.layui-input-suffix {
    right: 0;
    border-radius: 0 2px 2px 0
}

.layui-input-split {
    border-width: 1px;
    border-style: solid
}

.layui-input-prefix .layui-icon,
.layui-input-split .layui-icon,
.layui-input-suffix .layui-icon {
    position: relative;
    font-size: 16px;
    color: #5f5f5f;
    transition: .3s
}

.layui-input-group {
    position: relative;
    display: table;
    box-sizing: border-box
}

.layui-input-group>* {
    display: table-cell;
    vertical-align: middle;
    position: relative
}

.layui-input-group .layui-input {
    padding-right: 15px
}

.layui-input-group>.layui-input-prefix {
    width: auto;
    border-right: 0
}

.layui-input-group>.layui-input-suffix {
    width: auto;
    border-left: 0
}

.layui-input-group .layui-input-split {
    white-space: nowrap
}

.layui-input-wrap {
    position: relative;
    line-height: 38px
}

.layui-input-wrap .layui-input {
    padding-right: 35px
}

.layui-input-wrap .layui-input::-ms-clear,
.layui-input-wrap .layui-input::-ms-reveal {
    display: none
}

.layui-input-wrap .layui-input-prefix+.layui-input,
.layui-input-wrap .layui-input-prefix~* .layui-input {
    padding-left: 35px
}

.layui-input-wrap .layui-input-split+.layui-input,
.layui-input-wrap .layui-input-split~* .layui-input {
    padding-left: 45px
}

.layui-input-wrap .layui-input-prefix~.layui-form-select {
    position: static
}

.layui-input-wrap .layui-input-prefix,
.layui-input-wrap .layui-input-split,
.layui-input-wrap .layui-input-suffix {
    pointer-events: none
}

.layui-input-wrap .layui-input:hover+.layui-input-split {
    border-color: #d2d2d2
}

.layui-input-wrap .layui-input:focus+.layui-input-split {
    border-color: #16b777
}

.layui-input-wrap .layui-input.layui-form-danger:focus+.layui-input-split {
    border-color: #ff5722
}

.layui-input-wrap .layui-input-prefix.layui-input-split {
    border-width: 0 1px 0 0
}

.layui-input-affix {
    line-height: 38px
}

.layui-input-suffix .layui-input-affix {
    right: auto;
    left: -35px
}

.layui-input-affix .layui-icon {
    color: rgba(0, 0, 0, .8);
    pointer-events: auto !important;
    cursor: pointer
}

.layui-input-affix .layui-icon-clear {
    color: rgba(0, 0, 0, .3)
}

.layui-input-affix .layui-icon:hover {
    color: rgba(0, 0, 0, .6)
}

.layui-input-wrap .layui-input-number {
    width: 24px;
    padding: 0
}

.layui-input-wrap .layui-input-number .layui-icon {
    position: absolute;
    right: 0;
    width: 100%;
    height: 50%;
    line-height: normal;
    font-size: 12px
}

.layui-input-wrap .layui-input-number .layui-icon:before {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -6px;
    margin-left: -6px
}

.layui-input-wrap .layui-input-number .layui-icon-up {
    top: 0;
    border-bottom: 1px solid #eee
}

.layui-input-wrap .layui-input-number .layui-icon-down {
    bottom: 0
}

.layui-input-wrap .layui-input-number .layui-icon:hover {
    font-weight: 700
}

.layui-input-wrap .layui-input[type=number]::-webkit-inner-spin-button,
.layui-input-wrap .layui-input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none !important
}

.layui-input-wrap .layui-input[type=number] {
    -moz-appearance: textfield
}

.layui-input-wrap .layui-input[type=number].layui-input-number-out-of-range {
    color: #ff5722
}

.layui-form-select {
    position: relative;
    color: #5f5f5f
}

.layui-form-select .layui-input {
    padding-right: 30px;
    cursor: pointer
}

.layui-form-select .layui-edge {
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -3px;
    cursor: pointer;
    border-width: 6px;
    border-top-color: #c2c2c2;
    border-top-style: solid;
    transition: .3s;
    -webkit-transition: .3s
}

.layui-form-select dl {
    display: none;
    position: absolute;
    left: 0;
    top: 42px;
    padding: 5px 0;
    z-index: 899;
    min-width: 100%;
    border: 1px solid #eee;
    max-height: 300px;
    overflow-y: auto;
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 1px 1px 4px rgb(0 0 0 / 8%);
    box-sizing: border-box
}

.layui-form-select dl dd,
.layui-form-select dl dt {
    padding: 0 10px;
    line-height: 36px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.layui-form-select dl dt {
    font-size: 12px;
    color: #999
}

.layui-form-select dl dd {
    cursor: pointer
}

.layui-form-select dl dd:hover {
    background-color: #f8f8f8;
    -webkit-transition: .5s;
    transition: .5s
}

.layui-form-select .layui-select-group dd {
    padding-left: 20px
}

.layui-form-select dl dd.layui-select-tips {
    padding-left: 10px !important;
    color: #999
}

.layui-form-select dl dd.layui-this {
    background-color: #f8f8f8;
    color: #fb6c0f;
    font-weight: 700
}

.layui-form-select dl dd.layui-disabled {
    background-color: #fff
}

.layui-form-selected dl {
    display: block
}

.layui-form-selected .layui-edge {
    margin-top: -9px;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

:root .layui-form-selected .layui-edge {
    margin-top: -9px\0/IE9
}

.layui-form-selectup dl {
    top: auto;
    bottom: 42px
}

.layui-select-none {
    margin: 5px 0;
    text-align: center;
    color: #999
}

.layui-select-disabled .layui-disabled {
    border-color: #eee !important
}

.layui-select-disabled .layui-edge {
    border-top-color: #d2d2d2
}

.layui-form-checkbox {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    height: 30px;
    line-height: 30px;
    margin-right: 10px;
    padding-right: 30px;
    background-color: #fff;
    cursor: pointer;
    font-size: 0;
    -webkit-transition: .1s linear;
    transition: .1s linear;
    box-sizing: border-box
}

.layui-form-checkbox>* {
    display: inline-block;
    vertical-align: middle
}

.layui-form-checkbox>div {
    padding: 0 11px;
    font-size: 14px;
    border-radius: 2px 0 0 2px;
    background-color: #d2d2d2;
    color: #fff;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.layui-form-checkbox>div>.layui-icon {
    line-height: normal
}

.layui-form-checkbox:hover>div {
    background-color: #c2c2c2
}

.layui-form-checkbox>i {
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 100%;
    border: 1px solid #d2d2d2;
    border-left: none;
    border-radius: 0 2px 2px 0;
    color: rgba(255, 255, 255, 0);
    font-size: 20px;
    text-align: center;
    box-sizing: border-box
}

.layui-form-checkbox:hover>i {
    border-color: #c2c2c2;
    color: #c2c2c2
}

.layui-form-checked,
.layui-form-checked:hover {
    border-color: #16b777
}

.layui-form-checked:hover>div,
.layui-form-checked>div {
    background-color: #16b777
}

.layui-form-checked:hover>i,
.layui-form-checked>i {
    color: #16b777
}

.layui-form-item .layui-form-checkbox {
    margin-top: 4px
}

.layui-form-checkbox.layui-checkbox-disabled>div {
    background-color: #eee !important
}

.layui-form [lay-checkbox] {
    display: none
}

.layui-form-checkbox[lay-skin=primary] {
    height: auto !important;
    line-height: normal !important;
    min-width: 18px;
    min-height: 18px;
    border: none !important;
    margin-right: 0;
    padding-left: 24px;
    padding-right: 0;
    background: 0 0
}

.layui-form-checkbox[lay-skin=primary]>div {
    margin-top: -1px;
    padding-left: 0;
    padding-right: 15px;
    line-height: 18px;
    background: 0 0;
    color: #5f5f5f
}

.layui-form-checkbox[lay-skin=primary]>i {
    right: auto;
    left: 0;
    width: 16px;
    height: 16px;
    line-height: 14px;
    border: 1px solid #d2d2d2;
    font-size: 12px;
    border-radius: 2px;
    background-color: #fff;
    -webkit-transition: .1s linear;
    transition: .1s linear
}

.layui-form-checkbox[lay-skin=primary]:hover>i {
    border-color: #16b777;
    color: #fff
}

.layui-form-checked[lay-skin=primary]>i {
    border-color: #16b777 !important;
    background-color: #16b777;
    color: #fff
}

.layui-checkbox-disabled[lay-skin=primary]>div {
    background: 0 0 !important
}

.layui-form-checked.layui-checkbox-disabled[lay-skin=primary]>i {
    background: #eee !important;
    border-color: #eee !important
}

.layui-checkbox-disabled[lay-skin=primary]:hover>i {
    border-color: #d2d2d2
}

.layui-form-item .layui-form-checkbox[lay-skin=primary] {
    margin-top: 10px
}

.layui-form-checkbox[lay-skin=primary]>.layui-icon-indeterminate {
    border-color: #16b777
}

.layui-form-checkbox[lay-skin=primary]>.layui-icon-indeterminate:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 50%;
    height: 1px;
    margin: -1px auto 0;
    background-color: #16b777
}

.layui-form-switch {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    height: 24px;
    line-height: 22px;
    min-width: 44px;
    padding: 0 5px;
    margin-top: 8px;
    border: 1px solid #d2d2d2;
    border-radius: 20px;
    cursor: pointer;
    box-sizing: border-box;
    background-color: #fff;
    -webkit-transition: .1s linear;
    transition: .1s linear
}

.layui-form-switch>i {
    position: absolute;
    left: 5px;
    top: 3px;
    width: 16px;
    height: 16px;
    border-radius: 20px;
    background-color: #d2d2d2;
    -webkit-transition: .1s linear;
    transition: .1s linear
}

.layui-form-switch>div {
    position: relative;
    top: 0;
    margin-left: 21px;
    padding: 0 !important;
    text-align: center !important;
    color: #999 !important;
    font-style: normal !important;
    font-size: 12px
}

.layui-form-onswitch {
    border-color: #16b777;
    background-color: #16b777
}

.layui-form-onswitch>i {
    left: 100%;
    margin-left: -21px;
    background-color: #fff
}

.layui-form-onswitch>div {
    margin-left: 0;
    margin-right: 21px;
    color: #fff !important
}

.layui-checkbox-disabled {
    border-color: #eee !important
}

.layui-checkbox-disabled>div {
    color: #c2c2c2 !important
}

.layui-checkbox-disabled>i {
    border-color: #eee !important
}

.layui-checkbox-disabled:hover>i {
    color: #fff !important
}

.layui-form-radio {
    display: inline-block;
    vertical-align: middle;
    line-height: 28px;
    margin: 6px 10px 0 0;
    padding-right: 10px;
    cursor: pointer;
    font-size: 0
}

.layui-form-radio>* {
    display: inline-block;
    vertical-align: middle;
    font-size: 14px
}

.layui-form-radio>i {
    margin-right: 8px;
    font-size: 22px;
    color: #c2c2c2
}

.layui-form-radio:hover>*,
.layui-form-radioed,
.layui-form-radioed>i {
    color: #16b777
}

.layui-radio-disabled>i {
    color: #eee !important
}

.layui-radio-disabled>* {
    color: #c2c2c2 !important
}

.layui-form [lay-radio] {
    display: none
}

.layui-form-pane .layui-form-label {
    width: 110px;
    padding: 8px 15px;
    height: 38px;
    line-height: 20px;
    border-width: 1px;
    border-style: solid;
    border-radius: 2px 0 0 2px;
    text-align: center;
    background-color: #fafafa;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-sizing: border-box
}

.layui-form-pane .layui-input-inline {
    margin-left: -1px
}

.layui-form-pane .layui-input-block {
    margin-left: 110px;
    left: -1px
}

.layui-form-pane .layui-input {
    border-radius: 0 2px 2px 0
}

.layui-form-pane .layui-form-text .layui-form-label {
    float: none;
    width: 100%;
    border-radius: 2px;
    box-sizing: border-box;
    text-align: left
}

.layui-form-pane .layui-form-text .layui-input-inline {
    display: block;
    margin: 0;
    top: -1px;
    clear: both
}

.layui-form-pane .layui-form-text .layui-input-block {
    margin: 0;
    left: 0;
    top: -1px
}

.layui-form-pane .layui-form-text .layui-textarea {
    min-height: 100px;
    border-radius: 0 0 2px 2px
}

.layui-form-pane .layui-form-checkbox {
    margin: 4px 0 4px 10px
}

.layui-form-pane .layui-form-radio,
.layui-form-pane .layui-form-switch {
    margin-top: 6px;
    margin-left: 10px
}

.layui-form-pane .layui-form-item[pane] {
    position: relative;
    border-width: 1px;
    border-style: solid
}

.layui-form-pane .layui-form-item[pane] .layui-form-label {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    border-width: 0 1px 0 0
}

.layui-form-pane .layui-form-item[pane] .layui-input-inline {
    margin-left: 110px
}

@media screen and (max-width:450px) {
    .layui-form-item .layui-form-label {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap
    }

    .layui-form-item .layui-inline {
        display: block;
        margin-right: 0;
        margin-bottom: 20px;
        clear: both
    }

    .layui-form-item .layui-inline:after {
        content: '\20';
        clear: both;
        display: block;
        height: 0
    }

    .layui-form-item .layui-input-inline {
        display: block;
        float: none;
        left: -3px;
        width: auto !important;
        margin: 0 0 10px 112px
    }

    .layui-form-item .layui-input-inline+.layui-form-mid {
        margin-left: 110px;
        top: -5px;
        padding: 0
    }

    .layui-form-item .layui-form-checkbox {
        margin-right: 5px;
        margin-bottom: 5px
    }
}

.layui-laypage {
    display: inline-block;
    vertical-align: middle;
    margin: 10px 0;
    font-size: 0
}

.layui-laypage>a:first-child,
.layui-laypage>a:first-child em {
    border-radius: 2px 0 0 2px
}

.layui-laypage>a:last-child,
.layui-laypage>a:last-child em {
    border-radius: 0 2px 2px 0
}

.layui-laypage>:first-child {
    margin-left: 0 !important
}

.layui-laypage>:last-child {
    margin-right: 0 !important
}

.layui-laypage a,
.layui-laypage button,
.layui-laypage input,
.layui-laypage select,
.layui-laypage span {
    border: 1px solid #eee
}

.layui-laypage a,
.layui-laypage span {
    display: inline-block;
    vertical-align: middle;
    padding: 0 15px;
    height: 28px;
    line-height: 28px;
    margin: 0 -1px 5px 0;
    background-color: #fff;
    color: #333;
    font-size: 12px
}

.layui-laypage a[data-page] {
    color: #333
}

.layui-laypage a {
    text-decoration: none !important;
    cursor: pointer
}

.layui-laypage a:hover {
    color: #16baaa
}

.layui-laypage em {
    font-style: normal
}

.layui-laypage .layui-laypage-spr {
    color: #999;
    font-weight: 700
}

.layui-laypage .layui-laypage-curr {
    position: relative
}

.layui-laypage .layui-laypage-curr em {
    position: relative;
    color: #fff
}

.layui-laypage .layui-laypage-curr .layui-laypage-em {
    position: absolute;
    left: -1px;
    top: -1px;
    padding: 1px;
    width: 100%;
    height: 100%;
    background-color: #16baaa
}

.layui-laypage-em {
    border-radius: 2px
}

.layui-laypage-next em,
.layui-laypage-prev em {
    font-family: Sim sun;
    font-size: 16px
}

.layui-laypage .layui-laypage-count,
.layui-laypage .layui-laypage-limits,
.layui-laypage .layui-laypage-refresh,
.layui-laypage .layui-laypage-skip {
    margin-left: 10px;
    margin-right: 10px;
    padding: 0;
    border: none
}

.layui-laypage .layui-laypage-limits,
.layui-laypage .layui-laypage-refresh {
    vertical-align: top
}

.layui-laypage .layui-laypage-refresh i {
    font-size: 18px;
    cursor: pointer
}

.layui-laypage select {
    height: 22px;
    padding: 3px;
    border-radius: 2px;
    cursor: pointer
}

.layui-laypage .layui-laypage-skip {
    height: 30px;
    line-height: 30px;
    color: #999
}

.layui-laypage button,
.layui-laypage input {
    height: 30px;
    line-height: 30px;
    border-radius: 2px;
    vertical-align: top;
    background-color: #fff;
    box-sizing: border-box
}

.layui-laypage input {
    display: inline-block;
    width: 40px;
    margin: 0 10px;
    padding: 0 3px;
    text-align: center
}

.layui-laypage input:focus,
.layui-laypage select:focus {
    border-color: #16baaa !important
}

.layui-laypage button {
    margin-left: 10px;
    padding: 0 10px;
    cursor: pointer
}

.layui-flow-more {
    margin: 10px 0;
    text-align: center;
    color: #999;
    font-size: 14px;
    clear: both
}

.layui-flow-more a {
    height: 32px;
    line-height: 32px
}

.layui-flow-more a * {
    display: inline-block;
    vertical-align: top
}

.layui-flow-more a cite {
    padding: 0 20px;
    border-radius: 3px;
    background-color: #eee;
    color: #333;
    font-style: normal
}

.layui-flow-more a cite:hover {
    opacity: .8
}

.layui-flow-more a i {
    font-size: 30px;
    color: #737383
}

.layui-table {
    width: 100%;
    margin: 10px 0;
    background-color: #fff;
    color: #5f5f5f
}

.layui-table tr {
    transition: .3s;
    -webkit-transition: .3s
}

.layui-table th {
    text-align: left;
    font-weight: 600
}

.layui-table-mend {
    background-color: #fff
}

.layui-table-click,
.layui-table-hover,
.layui-table[lay-even] tbody tr:nth-child(2n) {
    background-color: #f8f8f8
}

.layui-table-checked {
    background-color: #dbfbf0
}

.layui-table-checked.layui-table-click,
.layui-table-checked.layui-table-hover {
    background-color: #abf8dd
}

.layui-table td,
.layui-table th,
.layui-table-col-set,
.layui-table-fixed-r,
.layui-table-grid-down,
.layui-table-header,
.layui-table-mend,
.layui-table-page,
.layui-table-tips-main,
.layui-table-tool,
.layui-table-total,
.layui-table-view,
.layui-table[lay-skin=line],
.layui-table[lay-skin=row] {
    border: 1px solid #eee
}

.layui-table td,
.layui-table th {
    position: relative;
    padding: 9px 15px;
    min-height: 20px;
    line-height: 20px;
    font-size: 14px
}

.layui-table[lay-skin=line] td,
.layui-table[lay-skin=line] th {
    border-width: 0 0 1px
}

.layui-table[lay-skin=row] td,
.layui-table[lay-skin=row] th {
    border-width: 0 1px 0 0
}

.layui-table[lay-skin=nob] td,
.layui-table[lay-skin=nob] th {
    border: none
}

.layui-table img {
    max-width: 100px
}

.layui-table[lay-size=lg] td,
.layui-table[lay-size=lg] th {
    padding: 15px 30px
}

.layui-table-view .layui-table[lay-size=lg] .layui-table-cell {
    height: 50px;
    line-height: 40px
}

.layui-table[lay-size=sm] td,
.layui-table[lay-size=sm] th {
    padding: 5px 10px;
    font-size: 12px
}

.layui-table-view .layui-table[lay-size=sm] .layui-table-cell {
    height: 30px;
    line-height: 20px;
    padding-top: 5px;
    padding-left: 11px;
    padding-right: 11px
}

.layui-table[lay-data],
.layui-table[lay-options] {
    display: none
}

.layui-table-box {
    position: relative;
    overflow: hidden
}

.layui-table-view {
    clear: both
}

.layui-table-view .layui-table {
    position: relative;
    width: auto;
    margin: 0;
    border: 0;
    border-collapse: separate
}

.layui-table-view .layui-table[lay-skin=line] {
    border-width: 0 1px 0 0
}

.layui-table-view .layui-table[lay-skin=row] {
    border-width: 0 0 1px
}

.layui-table-view .layui-table td,
.layui-table-view .layui-table th {
    padding: 0;
    border-top: none;
    border-left: none
}

.layui-table-view .layui-table th [lay-event],
.layui-table-view .layui-table th.layui-unselect .layui-table-cell span {
    cursor: pointer
}

.layui-table-view .layui-table td,
.layui-table-view .layui-table th span {
    cursor: default
}

.layui-table-view .layui-table td[data-edit] {
    cursor: text
}

.layui-table-view .layui-table td[data-edit]:hover:after {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    border: 1px solid #16b777;
    pointer-events: none;
    content: ""
}

.layui-table-view .layui-form-checkbox[lay-skin=primary] i {
    width: 18px;
    height: 18px;
    line-height: 16px
}

.layui-table-view .layui-form-radio {
    line-height: 0;
    padding: 0
}

.layui-table-view .layui-form-radio>i {
    margin: 0;
    font-size: 20px
}

.layui-table-init {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    z-index: 199
}

.layui-table-init .layui-icon {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -15px 0 0 -15px;
    font-size: 30px;
    color: #c2c2c2
}

.layui-table-header {
    border-width: 0 0 1px;
    overflow: hidden
}

.layui-table-header .layui-table {
    margin-bottom: -1px
}

.layui-table-column {
    position: relative;
    width: 100%;
    min-height: 41px;
    padding: 8px 16px;
    border-width: 0 0 1px
}

.layui-table-column .layui-btn-container {
    margin-bottom: -8px
}

.layui-table-column .layui-btn-container .layui-btn {
    margin-right: 8px;
    margin-bottom: 8px
}

.layui-table-tool .layui-inline[lay-event] {
    position: relative;
    width: 26px;
    height: 26px;
    padding: 5px;
    line-height: 16px;
    margin-right: 10px;
    text-align: center;
    color: #333;
    border: 1px solid #ccc;
    cursor: pointer;
    -webkit-transition: .5s;
    transition: .5s
}

.layui-table-tool .layui-inline[lay-event]:hover {
    border: 1px solid #999
}

.layui-table-tool-temp {
    padding-right: 120px
}

.layui-table-tool-self {
    position: absolute;
    right: 17px;
    top: 10px
}

.layui-table-tool .layui-table-tool-self .layui-inline[lay-event] {
    margin: 0 0 0 10px
}

.layui-table-tool-panel {
    position: absolute;
    top: 29px;
    left: -1px;
    z-index: 399;
    padding: 5px 0 !important;
    min-width: 150px;
    min-height: 40px;
    border: 1px solid #d2d2d2;
    text-align: left;
    overflow-y: auto;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12)
}

.layui-table-tool-panel li {
    padding: 0 10px;
    margin: 0 !important;
    line-height: 30px;
    list-style-type: none !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-transition: .5s;
    transition: .5s
}

.layui-table-tool-panel li .layui-form-checkbox[lay-skin=primary] {
    width: 100%;
    padding-left: 28px
}

.layui-table-tool-panel li:hover {
    background-color: #f8f8f8
}

.layui-table-tool-panel li .layui-form-checkbox[lay-skin=primary] i {
    position: absolute;
    left: 0;
    top: 0
}

.layui-table-tool-panel li .layui-form-checkbox[lay-skin=primary] span {
    padding: 0
}

.layui-table-tool .layui-table-tool-self .layui-table-tool-panel {
    left: auto;
    right: -1px
}

.layui-table-col-set {
    position: absolute;
    right: 0;
    top: 0;
    width: 20px;
    height: 100%;
    border-width: 0 0 0 1px;
    background-color: #fff
}

.layui-table-sort {
    width: 10px;
    height: 20px;
    margin-left: 5px;
    cursor: pointer !important
}

.layui-table-sort .layui-edge {
    position: absolute;
    left: 5px;
    border-width: 5px
}

.layui-table-sort .layui-table-sort-asc {
    top: 3px;
    border-top: none;
    border-bottom-style: solid;
    border-bottom-color: #b2b2b2
}

.layui-table-sort .layui-table-sort-asc:hover {
    border-bottom-color: #5f5f5f
}

.layui-table-sort .layui-table-sort-desc {
    bottom: 5px;
    border-bottom: none;
    border-top-style: solid;
    border-top-color: #b2b2b2
}

.layui-table-sort .layui-table-sort-desc:hover {
    border-top-color: #5f5f5f
}

.layui-table-sort[lay-sort=asc] .layui-table-sort-asc {
    border-bottom-color: #000
}

.layui-table-sort[lay-sort=desc] .layui-table-sort-desc {
    border-top-color: #000
}

.layui-table-cell {
    height: 38px;
    line-height: 28px;
    padding: 6px 15px;
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: border-box
}

.layui-table-cell .layui-form-checkbox[lay-skin=primary] {
    top: -1px;
    padding: 0
}

.layui-table-cell .layui-form-checkbox[lay-skin=primary]>div {
    padding-left: 24px
}

.layui-table-cell .layui-table-link {
    color: #01aaed
}

.layui-table-cell .layui-btn {
    vertical-align: inherit
}

.layui-table-cell[align=center] {
    -webkit-box-pack: center
}

.layui-table-cell[align=right] {
    -webkit-box-pack: end
}

.laytable-cell-checkbox,
.laytable-cell-numbers,
.laytable-cell-radio,
.laytable-cell-space {
    text-align: center;
    -webkit-box-pack: center
}

.layui-table-body {
    position: relative;
    overflow: auto;
    margin-right: -1px;
    margin-bottom: -1px
}

.layui-table-body .layui-none {
    line-height: 26px;
    padding: 30px 15px;
    text-align: center;
    color: #999
}

.layui-table-fixed {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 101
}

.layui-table-fixed .layui-table-body {
    overflow: hidden
}

.layui-table-fixed-l {
    box-shadow: 1px 0 8px rgba(0, 0, 0, .08)
}

.layui-table-fixed-r {
    left: auto;
    right: -1px;
    border-width: 0 0 0 1px;
    box-shadow: -1px 0 8px rgba(0, 0, 0, .08)
}

.layui-table-fixed-r .layui-table-header {
    position: relative;
    overflow: visible
}

.layui-table-mend {
    position: absolute;
    right: -49px;
    top: 0;
    height: 100%;
    width: 50px;
    border-width: 0 0 0 1px
}

.layui-table-tool {
    position: relative;
    width: 100%;
    min-height: 50px;
    line-height: 30px;
    padding: 10px 15px;
    border-width: 0 0 1px
}

.layui-table-tool .layui-btn-container {
    margin-bottom: -10px
}

.layui-table-total {
    margin-bottom: -1px;
    border-width: 1px 0 0;
    overflow: hidden
}

.layui-table-page {
    border-width: 1px 0 0;
    margin-bottom: -1px;
    white-space: nowrap;
    overflow: hidden
}

.layui-table-page>div {
    height: 26px
}

.layui-table-page .layui-laypage {
    margin: 0
}

.layui-table-page .layui-laypage a,
.layui-table-page .layui-laypage span {
    height: 26px;
    line-height: 26px;
    margin-bottom: 10px;
    border: none;
    background: 0 0
}

.layui-table-page .layui-laypage a,
.layui-table-page .layui-laypage span.layui-laypage-curr {
    padding: 0 12px
}

.layui-table-page .layui-laypage span {
    margin-left: 0;
    padding: 0
}

.layui-table-page .layui-laypage .layui-laypage-prev {
    margin-left: -11px !important
}

.layui-table-page .layui-laypage .layui-laypage-curr .layui-laypage-em {
    left: 0;
    top: 0;
    padding: 0
}

.layui-table-page .layui-laypage button,
.layui-table-page .layui-laypage input {
    height: 26px;
    line-height: 26px
}

.layui-table-page .layui-laypage input {
    width: 40px
}

.layui-table-page .layui-laypage button {
    padding: 0 10px
}

.layui-table-page select {
    height: 18px
}

.layui-table-pagebar {
    float: right;
    line-height: 23px
}

.layui-table-pagebar .layui-btn-sm {
    margin-top: -1px
}

.layui-table-pagebar .layui-btn-xs {
    margin-top: 2px
}

.layui-table-view select[lay-ignore] {
    display: inline-block
}

.layui-table-patch .layui-table-cell {
    padding: 0;
    width: 30px
}

.layui-table-edit {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 189;
    min-width: 100%;
    min-height: 100%;
    padding: 5px 14px;
    border-radius: 0;
    box-shadow: 1px 1px 20px rgba(0, 0, 0, .15);
    background-color: #fff
}

.layui-table-edit:focus {
    border-color: #16b777 !important
}

input.layui-input.layui-table-edit {
    height: 100%
}

select.layui-table-edit {
    padding: 0 0 0 10px;
    border-color: #d2d2d2
}

.layui-table-view .layui-form-checkbox,
.layui-table-view .layui-form-radio,
.layui-table-view .layui-form-switch {
    top: 0;
    margin: 0
}

.layui-table-view .layui-form-checkbox {
    top: -1px;
    height: 26px;
    line-height: 26px
}

.layui-table-view .layui-form-checkbox i {
    height: 26px
}

.layui-table-grid .layui-table-cell {
    overflow: visible
}

.layui-table-grid-down {
    position: absolute;
    top: 0;
    right: 0;
    width: 24px;
    height: 100%;
    padding: 5px 0;
    border-width: 0 0 0 1px;
    text-align: center;
    background-color: #fff;
    color: #999;
    cursor: pointer
}

.layui-table-grid-down .layui-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -8px 0 0 -8px;
    font-size: 14px
}

.layui-table-grid-down:hover {
    background-color: #fbfbfb
}

.layui-table-expanded {
    height: 95px
}

.layui-table-expanded .layui-table-cell,
.layui-table-view .layui-table[lay-size=lg] .layui-table-expanded .layui-table-cell,
.layui-table-view .layui-table[lay-size=sm] .layui-table-expanded .layui-table-cell {
    height: auto;
    max-height: 94px;
    white-space: normal;
    text-overflow: clip
}

.layui-table-cell-c {
    position: absolute;
    bottom: -10px;
    right: 50%;
    margin-right: -9px;
    width: 20px;
    height: 20px;
    line-height: 18px;
    cursor: pointer;
    text-align: center;
    background-color: #fff;
    border: 1px solid #eee;
    border-radius: 50%;
    z-index: 1000;
    transition: .3s;
    font-size: 14px
}

.layui-table-cell-c:hover {
    border-color: #16b777
}

.layui-table-expanded td:hover .layui-table-cell {
    overflow: auto
}

.layui-table-main>.layui-table>tbody>tr:last-child>td>.layui-table-cell-c {
    bottom: 0
}

body .layui-table-tips .layui-layer-content {
    background: 0 0;
    padding: 0;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .12)
}

.layui-table-tips-main {
    margin: -49px 0 0 -1px;
    max-height: 150px;
    padding: 8px 15px;
    font-size: 14px;
    overflow-y: scroll;
    background-color: #fff;
    color: #5f5f5f
}

.layui-table-tips-c {
    position: absolute;
    right: -3px;
    top: -13px;
    width: 20px;
    height: 20px;
    padding: 3px;
    cursor: pointer;
    background-color: #5f5f5f;
    border-radius: 50%;
    color: #fff
}

.layui-table-tips-c:hover {
    background-color: #777
}

.layui-table-tips-c:before {
    position: relative;
    right: -2px
}

.layui-table-tree-nodeIcon {
    max-width: 20px
}

.layui-table-tree-nodeIcon>* {
    width: 100%
}

.layui-table-tree-flexIcon,
.layui-table-tree-nodeIcon {
    margin-right: 2px
}

.layui-table-tree-flexIcon {
    cursor: pointer
}

.layui-upload-file {
    display: none !important;
    opacity: .01;
    filter: Alpha(opacity=1)
}

.layui-upload-list {
    margin: 11px 0
}

.layui-upload-choose {
    max-width: 200px;
    padding: 0 10px;
    color: #999;
    font-size: 14px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.layui-upload-drag {
    position: relative;
    display: inline-block;
    padding: 30px;
    border: 1px dashed #e2e2e2;
    background-color: #fff;
    text-align: center;
    cursor: pointer;
    color: #999
}

.layui-upload-drag .layui-icon {
    font-size: 50px;
    color: #16baaa
}

.layui-upload-drag[lay-over] {
    border-color: #16baaa
}

.layui-upload-form {
    display: inline-block
}

.layui-upload-iframe {
    position: absolute;
    width: 0;
    height: 0;
    border: 0;
    visibility: hidden
}

.layui-upload-wrap {
    position: relative;
    display: inline-block;
    vertical-align: middle
}

.layui-upload-wrap .layui-upload-file {
    display: block !important;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    font-size: 100px;
    width: 100%;
    height: 100%;
    opacity: .01;
    filter: Alpha(opacity=1);
    cursor: pointer
}

.layui-btn-container .layui-upload-choose {
    padding-left: 0
}

.layui-menu {
    position: relative;
    margin: 5px 0;
    background-color: #fff;
    box-sizing: border-box
}

.layui-menu * {
    box-sizing: border-box
}

.layui-menu li,
.layui-menu-body-title,
.layui-menu-body-title a {
    padding: 5px 15px;
    color: initial
}

.layui-menu li {
    position: relative;
    margin: 0 0 1px;
    line-height: 26px;
    color: rgba(0, 0, 0, .8);
    font-size: 14px;
    white-space: nowrap;
    cursor: pointer;
    transition: .3s
}

.layui-menu li:hover {
    background-color: #f8f8f8
}

.layui-menu li.layui-disabled,
.layui-menu li.layui-disabled * {
    background: 0 0 !important;
    color: #d2d2d2 !important;
    cursor: not-allowed !important
}

.layui-menu-item-parent:hover>.layui-menu-body-panel {
    display: block;
    animation-name: layui-fadein;
    animation-duration: .3s;
    animation-fill-mode: both;
    animation-delay: .2s
}

.layui-menu-item-group>.layui-menu-body-title,
.layui-menu-item-parent>.layui-menu-body-title {
    padding-right: 38px
}

.layui-menu .layui-menu-item-divider:hover,
.layui-menu .layui-menu-item-group:hover,
.layui-menu .layui-menu-item-none:hover {
    background: 0 0;
    cursor: default
}

.layui-menu .layui-menu-item-group>ul {
    margin: 5px 0 -5px
}

.layui-menu .layui-menu-item-group>.layui-menu-body-title {
    color: rgba(0, 0, 0, .35);
    user-select: none
}

.layui-menu .layui-menu-item-none {
    color: rgba(0, 0, 0, .35);
    cursor: default;
    text-align: center
}

.layui-menu .layui-menu-item-divider {
    margin: 5px 0;
    padding: 0;
    height: 0;
    line-height: 0;
    border-bottom: 1px solid #eee;
    overflow: hidden
}

.layui-menu .layui-menu-item-down:hover,
.layui-menu .layui-menu-item-up:hover {
    cursor: pointer
}

.layui-menu .layui-menu-item-up>.layui-menu-body-title {
    color: rgba(0, 0, 0, .8)
}

.layui-menu .layui-menu-item-up>ul {
    visibility: hidden;
    height: 0;
    overflow: hidden
}

.layui-menu .layui-menu-item-down>.layui-menu-body-title>.layui-icon-down {
    transform: rotate(180deg)
}

.layui-menu .layui-menu-item-up>.layui-menu-body-title>.layui-icon-up {
    transform: rotate(-180deg)
}

.layui-menu .layui-menu-item-down:hover>.layui-menu-body-title>.layui-icon,
.layui-menu .layui-menu-item-up>.layui-menu-body-title:hover>.layui-icon {
    color: #000
}

.layui-menu .layui-menu-item-down>ul {
    visibility: visible;
    height: auto
}

.layui-menu .layui-menu-item-checked,
.layui-menu .layui-menu-item-checked2 {
    background-color: #f8f8f8 !important;
    color: #16b777
}

.layui-menu .layui-menu-item-checked a,
.layui-menu .layui-menu-item-checked2 a {
    color: #16b777
}

.layui-menu .layui-menu-item-checked:after {
    position: absolute;
    right: -1px;
    top: 0;
    bottom: 0;
    border-right: 3px solid #16b777;
    content: ""
}

.layui-menu-body-title {
    position: relative;
    margin: -5px -15px;
    overflow: hidden;
    text-overflow: ellipsis
}

.layui-menu-body-title a {
    display: block;
    margin: -5px -15px;
    color: rgba(0, 0, 0, .8)
}

.layui-menu-body-title a:hover {
    transition: .3s
}

.layui-menu-body-title>.layui-icon {
    position: absolute;
    right: 15px;
    top: 50%;
    margin-top: -6px;
    line-height: normal;
    font-size: 14px;
    transition: .2s;
    -webkit-transition: .2s
}

.layui-menu-body-title>.layui-icon:hover {
    transition: .3s
}

.layui-menu-body-title>.layui-icon-right {
    right: 14px
}

.layui-menu-body-panel {
    display: none;
    position: absolute;
    top: -7px;
    left: 100%;
    z-index: 1000;
    margin-left: 13px;
    padding: 5px 0
}

.layui-menu-body-panel:before {
    content: "";
    position: absolute;
    width: 20px;
    left: -16px;
    top: 0;
    bottom: 0
}

.layui-menu-body-panel-left {
    left: auto;
    right: 100%;
    margin: 0 13px
}

.layui-menu-body-panel-left:before {
    left: auto;
    right: -16px
}

.layui-menu-lg li {
    line-height: 32px
}

.layui-menu-lg .layui-menu-body-title a:hover,
.layui-menu-lg li:hover {
    background: 0 0;
    color: #16b777
}

.layui-menu-lg li .layui-menu-body-panel {
    margin-left: 14px
}

.layui-menu-lg li .layui-menu-body-panel-left {
    margin: 0 15px
}

.layui-dropdown {
    position: absolute;
    left: -999999px;
    top: -999999px;
    z-index: 77777777;
    margin: 5px 0;
    min-width: 100px
}

.layui-dropdown:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 6px;
    left: 0;
    top: -6px
}

.layui-dropdown-shade {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: fixed;
    pointer-events: auto
}

.layui-nav {
    position: relative;
    padding: 0 15px;
    background-color: #2f363c;
    color: #fff;
    border-radius: 2px;
    font-size: 0;
    box-sizing: border-box
}

.layui-nav * {
    font-size: 14px
}

.layui-nav .layui-nav-item {
    position: relative;
    display: inline-block;
    margin-top: 0;
    list-style: none;
    vertical-align: middle;
    line-height: 60px
}

.layui-nav .layui-nav-item a {
    display: block;
    padding: 0 20px;
    color: rgba(255, 255, 255, .7);
    transition: .3s;
    -webkit-transition: .3s
}

.layui-nav .layui-this:after,
.layui-nav-bar {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 3px;
    background-color: #16b777;
    transition: .2s;
    -webkit-transition: .2s;
    pointer-events: none
}

.layui-nav-bar {
    z-index: 1000
}

.layui-nav[lay-bar=disabled] .layui-nav-bar {
    display: none
}

.layui-nav .layui-nav-item a:hover,
.layui-nav .layui-this a {
    color: #fff;
    text-decoration: none
}

.layui-nav .layui-this:after {
    top: auto;
    bottom: 0;
    width: 100%
}

.layui-nav-img {
    width: 30px;
    height: 30px;
    margin-right: 10px;
    border-radius: 50%
}

.layui-nav .layui-nav-more {
    position: absolute;
    top: 0;
    right: 3px;
    left: auto !important;
    margin-top: 0;
    font-size: 12px;
    cursor: pointer;
    transition: .2s;
    -webkit-transition: .2s
}

.layui-nav .layui-nav-mored,
.layui-nav-itemed>a .layui-nav-more {
    transform: rotate(180deg)
}

.layui-nav-child {
    display: none;
    position: absolute;
    left: 0;
    top: 65px;
    min-width: 100%;
    line-height: 36px;
    padding: 5px 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
    border: 1px solid #eee;
    background-color: #fff;
    z-index: 100;
    border-radius: 2px;
    white-space: nowrap;
    box-sizing: border-box
}

.layui-nav .layui-nav-child a {
    color: rgba(0, 0, 0, .8)
}

.layui-nav .layui-nav-child a:hover {
    background-color: #f8f8f8;
    color: rgba(0, 0, 0, .8)
}

.layui-nav-child dd {
    margin: 1px 0;
    position: relative
}

.layui-nav-child dd.layui-this {
    background-color: #f8f8f8;
    color: #000
}

.layui-nav-child dd.layui-this:after {
    display: none
}

.layui-nav-child-r {
    left: auto;
    right: 0
}

.layui-nav-child-c {
    text-align: center
}

.layui-nav.layui-nav-tree {
    width: 200px;
    padding: 0
}

.layui-nav-tree .layui-nav-item {
    display: block;
    width: 100%;
    line-height: 40px
}

.layui-nav-tree .layui-nav-item a {
    position: relative;
    height: 40px;
    line-height: 40px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.layui-nav-tree .layui-nav-item>a {
    padding-top: 5px;
    padding-bottom: 5px
}

.layui-nav-tree .layui-nav-more {
    right: 15px
}

.layui-nav-tree .layui-nav-item>a .layui-nav-more {
    padding: 5px 0
}

.layui-nav-tree .layui-nav-bar {
    width: 5px;
    height: 0;
    background-color: #16baaa
}

.layui-side .layui-nav-tree .layui-nav-bar {
    width: 2px
}

.layui-nav-tree .layui-nav-child dd.layui-this,
.layui-nav-tree .layui-nav-child dd.layui-this a,
.layui-nav-tree .layui-this,
.layui-nav-tree .layui-this>a,
.layui-nav-tree .layui-this>a:hover {
    background-color: #16baaa;
    color: #fff
}

.layui-nav-tree .layui-this:after {
    display: none
}

.layui-nav-itemed>a,
.layui-nav-tree .layui-nav-title a,
.layui-nav-tree .layui-nav-title a:hover {
    color: #fff !important
}

.layui-nav-tree .layui-nav-child {
    position: relative;
    z-index: 0;
    top: 0;
    border: none;
    background-color: rgba(0, 0, 0, .3);
    box-shadow: none
}

.layui-nav-tree .layui-nav-child dd {
    margin: 0
}

.layui-nav-tree .layui-nav-child a {
    color: rgba(255, 255, 255, .7)
}

.layui-nav-tree .layui-nav-child a:hover {
    background: 0 0;
    color: #fff
}

.layui-nav-itemed>.layui-nav-child,
.layui-nav-itemed>.layui-nav-child>.layui-this>.layui-nav-child {
    display: block
}

.layui-nav-side {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    overflow-x: hidden;
    z-index: 999
}

.layui-nav-tree.layui-bg-gray a,
.layui-nav.layui-bg-gray .layui-nav-item a {
    color: rgba(0, 0, 0, .8)
}

.layui-nav-tree.layui-bg-gray .layui-nav-itemed>a {
    color: #000 !important
}

.layui-nav.layui-bg-gray .layui-this a {
    color: #16b777
}

.layui-nav-tree.layui-bg-gray .layui-nav-child {
    padding-left: 11px;
    background: 0 0
}

.layui-nav-tree.layui-bg-gray .layui-nav-child dd.layui-this,
.layui-nav-tree.layui-bg-gray .layui-nav-child dd.layui-this a,
.layui-nav-tree.layui-bg-gray .layui-this,
.layui-nav-tree.layui-bg-gray .layui-this>a {
    background: 0 0 !important;
    color: #16b777 !important;
    font-weight: 700
}

.layui-nav-tree.layui-bg-gray .layui-nav-bar {
    background-color: #16b777
}

.layui-breadcrumb {
    visibility: hidden;
    font-size: 0
}

.layui-breadcrumb>* {
    font-size: 14px
}

.layui-breadcrumb a {
    color: #999 !important
}

.layui-breadcrumb a:hover {
    color: #16b777 !important
}

.layui-breadcrumb a cite {
    color: #5f5f5f;
    font-style: normal
}

.layui-breadcrumb span[lay-separator] {
    margin: 0 10px;
    color: #999
}

.layui-tab {
    margin: 10px 0;
    text-align: left !important
}

.layui-tab[overflow]>.layui-tab-title {
    overflow: hidden
}

.layui-tab .layui-tab-title {
    position: relative;
    left: 0;
    height: 40px;
    white-space: nowrap;
    font-size: 0;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    transition: .2s;
    -webkit-transition: .2s
}

.layui-tab .layui-tab-title li {
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    transition: .2s;
    -webkit-transition: .2s;
    position: relative;
    line-height: 40px;
    min-width: 65px;
    margin: 0;
    padding: 0 15px;
    text-align: center;
    cursor: pointer
}

.layui-tab .layui-tab-title li a {
    display: block;
    padding: 0 15px;
    margin: 0 -15px
}

.layui-tab-title .layui-this {
    color: #000
}

.layui-tab-title .layui-this:after {
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    width: 100%;
    height: 41px;
    border-width: 1px;
    border-style: solid;
    border-bottom-color: #fff;
    border-radius: 2px 2px 0 0;
    box-sizing: border-box;
    pointer-events: none
}

.layui-tab-bar {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
    width: 30px;
    height: 39px;
    line-height: 39px;
    border-width: 1px;
    border-style: solid;
    border-radius: 2px;
    text-align: center;
    background-color: #fff;
    cursor: pointer
}

.layui-tab-bar .layui-icon {
    position: relative;
    display: inline-block;
    top: 3px;
    transition: .3s;
    -webkit-transition: .3s
}

.layui-tab-item {
    display: none
}

.layui-tab-more {
    padding-right: 30px;
    height: auto !important;
    white-space: normal !important
}

.layui-tab-more li.layui-this:after {
    border-bottom-color: #eee;
    border-radius: 2px
}

.layui-tab-more .layui-tab-bar .layui-icon {
    top: -2px;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

:root .layui-tab-more .layui-tab-bar .layui-icon {
    top: -2px\0/IE9
}

.layui-tab-content {
    padding: 15px 0
}

.layui-tab-title li .layui-tab-close {
    position: relative;
    display: inline-block;
    width: 18px;
    height: 18px;
    line-height: 20px;
    margin-left: 8px;
    top: 1px;
    text-align: center;
    font-size: 14px;
    color: #c2c2c2;
    transition: .2s;
    -webkit-transition: .2s
}

.layui-tab-title li .layui-tab-close:hover {
    border-radius: 2px;
    background-color: #ff5722;
    color: #fff
}

.layui-tab-brief>.layui-tab-title .layui-this {
    color: #16baaa
}

.layui-tab-brief>.layui-tab-more li.layui-this:after,
.layui-tab-brief>.layui-tab-title .layui-this:after {
    border: none;
    border-radius: 0;
    border-bottom: 2px solid #16b777
}

.layui-tab-brief[overflow]>.layui-tab-title .layui-this:after {
    top: -1px
}

.layui-tab-card {
    border-width: 1px;
    border-style: solid;
    border-radius: 2px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .1)
}

.layui-tab-card>.layui-tab-title {
    background-color: #fafafa
}

.layui-tab-card>.layui-tab-title li {
    margin-right: -1px;
    margin-left: -1px
}

.layui-tab-card>.layui-tab-title .layui-this {
    background-color: #fff
}

.layui-tab-card>.layui-tab-title .layui-this:after {
    border-top: none;
    border-width: 1px;
    border-bottom-color: #fff
}

.layui-tab-card>.layui-tab-title .layui-tab-bar {
    height: 40px;
    line-height: 40px;
    border-radius: 0;
    border-top: none;
    border-right: none
}

.layui-tab-card>.layui-tab-more .layui-this {
    background: 0 0;
    color: #16b777
}

.layui-tab-card>.layui-tab-more .layui-this:after {
    border: none
}

.layui-timeline {
    padding-left: 5px
}

.layui-timeline-item {
    position: relative;
    padding-bottom: 20px
}

.layui-timeline-axis {
    position: absolute;
    left: -5px;
    top: 0;
    z-index: 10;
    width: 20px;
    height: 20px;
    line-height: 20px;
    background-color: #fff;
    color: #16b777;
    border-radius: 50%;
    text-align: center;
    cursor: pointer
}

.layui-timeline-axis:hover {
    color: #ff5722
}

.layui-timeline-item:before {
    content: "";
    position: absolute;
    left: 5px;
    top: 0;
    z-index: 0;
    width: 1px;
    height: 100%
}

.layui-timeline-item:first-child:before {
    display: block
}

.layui-timeline-item:last-child:before {
    display: none
}

.layui-timeline-content {
    padding-left: 25px
}

.layui-timeline-title {
    position: relative;
    margin-bottom: 10px;
    line-height: 22px
}

.layui-badge,
.layui-badge-dot,
.layui-badge-rim {
    position: relative;
    display: inline-block;
    padding: 0 6px;
    font-size: 12px;
    text-align: center;
    background-color: #ff5722;
    color: #fff;
    border-radius: 2px
}

.layui-badge {
    height: 18px;
    line-height: 18px
}

.layui-badge-dot {
    width: 8px;
    height: 8px;
    padding: 0;
    border-radius: 50%
}

.layui-badge-rim {
    height: 18px;
    line-height: 18px;
    border-width: 1px;
    border-style: solid;
    background-color: #fff;
    color: #5f5f5f
}

.layui-btn .layui-badge,
.layui-btn .layui-badge-dot {
    margin-left: 5px
}

.layui-nav .layui-badge,
.layui-nav .layui-badge-dot {
    position: absolute;
    top: 50%;
    margin: -5px 6px 0
}

.layui-nav .layui-badge {
    margin-top: -10px
}

.layui-tab-title .layui-badge,
.layui-tab-title .layui-badge-dot {
    left: 5px;
    top: -2px
}

.layui-carousel {
    position: relative;
    left: 0;
    top: 0;
    background-color: #f8f8f8
}

.layui-carousel>[carousel-item] {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.layui-carousel>[carousel-item]:before {
    position: absolute;
    content: '\e63d';
    left: 50%;
    top: 50%;
    width: 100px;
    line-height: 20px;
    margin: -10px 0 0 -50px;
    text-align: center;
    color: #c2c2c2;
    font-family: layui-icon !important;
    font-size: 30px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.layui-carousel>[carousel-item]>* {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #f8f8f8;
    transition-duration: .3s;
    -webkit-transition-duration: .3s
}

.layui-carousel-updown>* {
    -webkit-transition: up .3s ease-in-out;
    transition: up .3s ease-in-out
}

.layui-carousel-arrow {
    opacity: 0;
    position: absolute;
    left: 10px;
    top: 50%;
    margin-top: -18px;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    font-size: 20px;
    border: 0;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, .2);
    color: #fff;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    cursor: pointer
}

.layui-carousel-arrow[lay-type=add] {
    left: auto !important;
    right: 10px
}

.layui-carousel[lay-arrow=always] .layui-carousel-arrow {
    opacity: 1;
    left: 20px
}

.layui-carousel[lay-arrow=always] .layui-carousel-arrow[lay-type=add] {
    right: 20px
}

.layui-carousel[lay-arrow=none] .layui-carousel-arrow {
    display: none
}

.layui-carousel-arrow:hover,
.layui-carousel-ind ul:hover {
    background-color: rgba(0, 0, 0, .35)
}

.layui-carousel:hover .layui-carousel-arrow {
    opacity: 1;
    left: 20px
}

.layui-carousel:hover .layui-carousel-arrow[lay-type=add] {
    right: 20px
}

.layui-carousel-ind {
    position: relative;
    top: -35px;
    width: 100%;
    line-height: 0 !important;
    text-align: center;
    font-size: 0
}

.layui-carousel[lay-indicator=outside] {
    margin-bottom: 30px
}

.layui-carousel[lay-indicator=outside] .layui-carousel-ind {
    top: 10px
}

.layui-carousel[lay-indicator=outside] .layui-carousel-ind ul {
    background-color: rgba(0, 0, 0, .5)
}

.layui-carousel[lay-indicator=none] .layui-carousel-ind {
    display: none
}

.layui-carousel-ind ul {
    display: inline-block;
    padding: 5px;
    background-color: rgba(0, 0, 0, .2);
    border-radius: 10px;
    -webkit-transition-duration: .3s;
    transition-duration: .3s
}

.layui-carousel-ind ul li {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 0 3px;
    font-size: 14px;
    background-color: rgba(255, 255, 255, .5);
    border-radius: 50%;
    cursor: pointer;
    -webkit-transition-duration: .3s;
    transition-duration: .3s
}

.layui-carousel-ind ul li:hover {
    background-color: rgba(255, 255, 255, .7)
}

.layui-carousel-ind ul li.layui-this {
    background-color: #fff
}

.layui-carousel>[carousel-item]>.layui-carousel-next,
.layui-carousel>[carousel-item]>.layui-carousel-prev,
.layui-carousel>[carousel-item]>.layui-this {
    display: block
}

.layui-carousel>[carousel-item]>.layui-this {
    left: 0
}

.layui-carousel>[carousel-item]>.layui-carousel-prev {
    left: -100%
}

.layui-carousel>[carousel-item]>.layui-carousel-next {
    left: 100%
}

.layui-carousel>[carousel-item]>.layui-carousel-next.layui-carousel-left,
.layui-carousel>[carousel-item]>.layui-carousel-prev.layui-carousel-right {
    left: 0
}

.layui-carousel>[carousel-item]>.layui-this.layui-carousel-left {
    left: -100%
}

.layui-carousel>[carousel-item]>.layui-this.layui-carousel-right {
    left: 100%
}

.layui-carousel[lay-anim=updown] .layui-carousel-arrow {
    left: 50% !important;
    top: 20px;
    margin: 0 0 0 -18px
}

.layui-carousel[lay-anim=updown] .layui-carousel-arrow[lay-type=add] {
    top: auto !important;
    bottom: 20px
}

.layui-carousel[lay-anim=updown] .layui-carousel-ind {
    position: absolute;
    top: 50%;
    right: 20px;
    width: auto;
    height: auto
}

.layui-carousel[lay-anim=updown] .layui-carousel-ind ul {
    padding: 3px 5px
}

.layui-carousel[lay-anim=updown] .layui-carousel-ind li {
    display: block;
    margin: 6px 0
}

.layui-carousel[lay-anim=updown]>[carousel-item]>* {
    left: 0 !important
}

.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-this {
    top: 0
}

.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-carousel-prev {
    top: -100%
}

.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-carousel-next {
    top: 100%
}

.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-carousel-next.layui-carousel-left,
.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-carousel-prev.layui-carousel-right {
    top: 0
}

.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-this.layui-carousel-left {
    top: -100%
}

.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-this.layui-carousel-right {
    top: 100%
}

.layui-carousel[lay-anim=fade]>[carousel-item]>* {
    left: 0 !important
}

.layui-carousel[lay-anim=fade]>[carousel-item]>.layui-carousel-next,
.layui-carousel[lay-anim=fade]>[carousel-item]>.layui-carousel-prev {
    opacity: 0
}

.layui-carousel[lay-anim=fade]>[carousel-item]>.layui-carousel-next.layui-carousel-left,
.layui-carousel[lay-anim=fade]>[carousel-item]>.layui-carousel-prev.layui-carousel-right {
    opacity: 1
}

.layui-carousel[lay-anim=fade]>[carousel-item]>.layui-this.layui-carousel-left,
.layui-carousel[lay-anim=fade]>[carousel-item]>.layui-this.layui-carousel-right {
    opacity: 0
}

.layui-fixbar {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 999999
}

.layui-fixbar li {
    width: 50px;
    height: 50px;
    line-height: 50px;
    margin-bottom: 1px;
    text-align: center;
    cursor: pointer;
    font-size: 30px;
    background-color: #9f9f9f;
    color: #fff;
    border-radius: 2px;
    opacity: .95
}

.layui-fixbar li:hover {
    opacity: .85
}

.layui-fixbar li:active {
    opacity: 1
}

.layui-fixbar .layui-fixbar-top {
    display: none;
    font-size: 40px
}

body .layui-util-face {
    border: none;
    background: 0 0
}

body .layui-util-face .layui-layer-content {
    padding: 0;
    background-color: #fff;
    color: #5f5f5f;
    box-shadow: none
}

.layui-util-face .layui-layer-TipsG {
    display: none
}

.layui-util-face ul {
    position: relative;
    width: 372px;
    padding: 10px;
    border: 1px solid #d9d9d9;
    background-color: #fff;
    box-shadow: 0 0 20px rgba(0, 0, 0, .2)
}

.layui-util-face ul li {
    cursor: pointer;
    float: left;
    border: 1px solid #e8e8e8;
    height: 22px;
    width: 26px;
    overflow: hidden;
    margin: -1px 0 0 -1px;
    padding: 4px 2px;
    text-align: center
}

.layui-util-face ul li:hover {
    position: relative;
    z-index: 2;
    border: 1px solid #eb7350;
    background: #fff9ec
}

.layui-code {
    display: block;
    position: relative;
    padding: 15px;
    line-height: 20px;
    border: 1px solid #eee;
    border-left-width: 6px;
    background-color: #fff;
    color: #333;
    font-family: "Courier New", Consolas, "Lucida Console";
    font-size: 12px
}

.layui-transfer-box,
.layui-transfer-header,
.layui-transfer-search {
    border: 0 solid #eee
}

.layui-transfer-box {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    border-width: 1px;
    width: 200px;
    height: 360px;
    border-radius: 2px;
    background-color: #fff
}

.layui-transfer-box .layui-form-checkbox {
    width: 100%;
    margin: 0 !important
}

.layui-transfer-header {
    height: 38px;
    line-height: 38px;
    padding: 0 11px;
    border-bottom-width: 1px
}

.layui-transfer-search {
    position: relative;
    padding: 11px;
    border-bottom-width: 1px
}

.layui-transfer-search .layui-input {
    height: 32px;
    padding-left: 30px;
    font-size: 12px
}

.layui-transfer-search .layui-icon-search {
    position: absolute;
    left: 20px;
    top: 50%;
    line-height: normal;
    margin-top: -8px;
    color: #5f5f5f
}

.layui-transfer-active {
    margin: 0 15px;
    display: inline-block;
    vertical-align: middle
}

.layui-transfer-active .layui-btn {
    display: block;
    margin: 0;
    padding: 0 15px;
    background-color: #16b777;
    border-color: #16b777;
    color: #fff
}

.layui-transfer-active .layui-btn-disabled {
    background-color: #fbfbfb;
    border-color: #eee;
    color: #d2d2d2
}

.layui-transfer-active .layui-btn:first-child {
    margin-bottom: 15px
}

.layui-transfer-active .layui-btn .layui-icon {
    margin: 0;
    font-size: 14px !important
}

.layui-transfer-data {
    padding: 5px 0;
    overflow: auto
}

.layui-transfer-data li {
    height: 32px;
    line-height: 32px;
    margin-top: 0 !important;
    padding: 0 11px;
    list-style-type: none !important
}

.layui-transfer-data li:hover {
    background-color: #f8f8f8;
    transition: .5s
}

.layui-transfer-data .layui-none {
    padding: 15px 11px;
    text-align: center;
    color: #999
}

.layui-rate,
.layui-rate * {
    display: inline-block;
    vertical-align: middle
}

.layui-rate {
    padding: 11px 6px 11px 0;
    font-size: 0
}

.layui-rate li {
    margin-top: 0 !important
}

.layui-rate li i.layui-icon {
    font-size: 20px;
    color: #ffb800;
    margin-right: 5px;
    transition: .3s;
    -webkit-transition: .3s
}

.layui-rate li i:hover {
    cursor: pointer;
    transform: scale(1.12);
    -webkit-transform: scale(1.12)
}

.layui-rate[readonly] li i:hover {
    cursor: default;
    transform: scale(1)
}

.layui-colorpicker {
    width: 38px;
    height: 38px;
    border: 1px solid #eee;
    padding: 5px;
    border-radius: 2px;
    line-height: 24px;
    display: inline-block;
    cursor: pointer;
    transition: .3s;
    -webkit-transition: .3s;
    box-sizing: border-box
}

.layui-colorpicker:hover {
    border-color: #d2d2d2
}

.layui-colorpicker.layui-colorpicker-lg {
    width: 44px;
    height: 44px;
    line-height: 30px
}

.layui-colorpicker.layui-colorpicker-sm {
    width: 30px;
    height: 30px;
    line-height: 20px;
    padding: 3px
}

.layui-colorpicker.layui-colorpicker-xs {
    width: 22px;
    height: 22px;
    line-height: 16px;
    padding: 1px
}

.layui-colorpicker-trigger-bgcolor {
    display: block;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==);
    border-radius: 2px
}

.layui-colorpicker-trigger-span {
    display: block;
    height: 100%;
    box-sizing: border-box;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 2px;
    text-align: center
}

.layui-colorpicker-trigger-i {
    display: inline-block;
    color: #fff;
    font-size: 12px
}

.layui-colorpicker-trigger-i.layui-icon-close {
    color: #999
}

.layui-colorpicker-main {
    position: absolute;
    left: -999999px;
    top: -999999px;
    z-index: 77777777;
    width: 280px;
    margin: 5px 0;
    padding: 7px;
    background: #fff;
    border: 1px solid #d2d2d2;
    border-radius: 2px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12)
}

.layui-colorpicker-main-wrapper {
    height: 180px;
    position: relative
}

.layui-colorpicker-basis {
    width: 260px;
    height: 100%;
    position: relative
}

.layui-colorpicker-basis-white {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(90deg, #fff, hsla(0, 0%, 100%, 0))
}

.layui-colorpicker-basis-black {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(0deg, #000, transparent)
}

.layui-colorpicker-basis-cursor {
    width: 10px;
    height: 10px;
    border: 1px solid #fff;
    border-radius: 50%;
    position: absolute;
    top: -3px;
    right: -3px;
    cursor: pointer
}

.layui-colorpicker-side {
    position: absolute;
    top: 0;
    right: 0;
    width: 12px;
    height: 100%;
    background: linear-gradient(red, #ff0, #0f0, #0ff, #00f, #f0f, red)
}

.layui-colorpicker-side-slider {
    width: 100%;
    height: 5px;
    box-shadow: 0 0 1px #888;
    box-sizing: border-box;
    background: #fff;
    border-radius: 1px;
    border: 1px solid #f0f0f0;
    cursor: pointer;
    position: absolute;
    left: 0
}

.layui-colorpicker-main-alpha {
    display: none;
    height: 12px;
    margin-top: 7px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==)
}

.layui-colorpicker-alpha-bgcolor {
    height: 100%;
    position: relative
}

.layui-colorpicker-alpha-slider {
    width: 5px;
    height: 100%;
    box-shadow: 0 0 1px #888;
    box-sizing: border-box;
    background: #fff;
    border-radius: 1px;
    border: 1px solid #f0f0f0;
    cursor: pointer;
    position: absolute;
    top: 0
}

.layui-colorpicker-main-pre {
    padding-top: 7px;
    font-size: 0
}

.layui-colorpicker-pre {
    width: 20px;
    height: 20px;
    border-radius: 2px;
    display: inline-block;
    margin-left: 6px;
    margin-bottom: 7px;
    cursor: pointer
}

.layui-colorpicker-pre:nth-child(11n+1) {
    margin-left: 0
}

.layui-colorpicker-pre-isalpha {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==)
}

.layui-colorpicker-pre.layui-this {
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, .15)
}

.layui-colorpicker-pre>div {
    height: 100%;
    border-radius: 2px
}

.layui-colorpicker-main-input {
    text-align: right;
    padding-top: 7px
}

.layui-colorpicker-main-input .layui-btn-container .layui-btn {
    margin: 0 0 0 10px
}

.layui-colorpicker-main-input div.layui-inline {
    float: left;
    margin-right: 10px;
    font-size: 14px
}

.layui-colorpicker-main-input input.layui-input {
    width: 150px;
    height: 30px;
    color: #5f5f5f
}

.layui-slider {
    height: 4px;
    background: #eee;
    border-radius: 3px;
    position: relative;
    cursor: pointer
}

.layui-slider-bar {
    border-radius: 3px;
    position: absolute;
    height: 100%
}

.layui-slider-step {
    position: absolute;
    top: 0;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #fff;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.layui-slider-wrap {
    width: 36px;
    height: 36px;
    position: absolute;
    top: -16px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 10;
    text-align: center
}

.layui-slider-wrap-btn {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
    transition: .3s
}

.layui-slider-wrap:after {
    content: "";
    height: 100%;
    display: inline-block;
    vertical-align: middle
}

.layui-slider-wrap-btn.layui-slider-hover,
.layui-slider-wrap-btn:hover {
    transform: scale(1.2)
}

.layui-slider-wrap-btn.layui-disabled:hover {
    transform: scale(1) !important
}

.layui-slider-tips {
    position: absolute;
    top: -42px;
    z-index: 77777777;
    white-space: nowrap;
    display: none;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    color: #fff;
    background: #000;
    border-radius: 3px;
    height: 25px;
    line-height: 25px;
    padding: 0 10px
}

.layui-slider-tips:after {
    content: "";
    position: absolute;
    bottom: -12px;
    left: 50%;
    margin-left: -6px;
    width: 0;
    height: 0;
    border-width: 6px;
    border-style: solid;
    border-color: #000 transparent transparent
}

.layui-slider-input {
    width: 70px;
    height: 32px;
    border: 1px solid #eee;
    border-radius: 3px;
    font-size: 16px;
    line-height: 32px;
    position: absolute;
    right: 0;
    top: -14px;
    box-sizing: border-box
}

.layui-slider-input-btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 20px;
    height: 100%;
    border-left: 1px solid #eee
}

.layui-slider-input-btn i {
    cursor: pointer;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 20px;
    height: 50%;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    color: #999
}

.layui-slider-input-btn i:first-child {
    top: 0;
    border-bottom: 1px solid #eee
}

.layui-slider-input-txt {
    height: 100%;
    font-size: 14px
}

.layui-slider-input-txt input {
    height: 100%;
    border: none;
    padding-right: 21px
}

.layui-slider-input-btn i:hover {
    color: #16baaa
}

.layui-slider-vertical {
    width: 4px;
    margin-left: 33px
}

.layui-slider-vertical .layui-slider-bar {
    width: 4px
}

.layui-slider-vertical .layui-slider-step {
    top: auto;
    left: 0;
    -webkit-transform: translateY(50%);
    transform: translateY(50%)
}

.layui-slider-vertical .layui-slider-wrap {
    top: auto;
    left: -16px;
    -webkit-transform: translateY(50%);
    transform: translateY(50%)
}

.layui-slider-vertical .layui-slider-tips {
    top: auto;
    left: 2px
}

@media \0screen {
    .layui-slider-wrap-btn {
        margin-left: -20px
    }

    .layui-slider-vertical .layui-slider-wrap-btn {
        margin-left: 0;
        margin-bottom: -20px
    }

    .layui-slider-vertical .layui-slider-tips {
        margin-left: -8px
    }

    .layui-slider>span {
        margin-left: 8px
    }
}

.layui-tree {
    line-height: 22px
}

.layui-tree .layui-form-checkbox {
    margin: 0 !important
}

.layui-tree-set {
    width: 100%;
    position: relative
}

.layui-tree-pack {
    display: none;
    padding-left: 20px;
    position: relative
}

.layui-tree-line .layui-tree-pack {
    padding-left: 27px
}

.layui-tree-line .layui-tree-set .layui-tree-set:after {
    content: "";
    position: absolute;
    top: 14px;
    left: -9px;
    width: 17px;
    height: 0;
    border-top: 1px dotted #c0c4cc
}

.layui-tree-entry {
    position: relative;
    padding: 3px 0;
    height: 26px;
    white-space: nowrap
}

.layui-tree-entry:hover {
    background-color: #eee
}

.layui-tree-line .layui-tree-entry:hover {
    background-color: rgba(0, 0, 0, 0)
}

.layui-tree-line .layui-tree-entry:hover .layui-tree-txt {
    color: #999;
    text-decoration: underline;
    transition: .3s
}

.layui-tree-main {
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
    padding-right: 10px
}

.layui-tree-line .layui-tree-set:before {
    content: "";
    position: absolute;
    top: 0;
    left: -9px;
    width: 0;
    height: 100%;
    border-left: 1px dotted #c0c4cc
}

.layui-tree-line .layui-tree-set.layui-tree-setLineShort:before {
    height: 13px
}

.layui-tree-line .layui-tree-set.layui-tree-setHide:before {
    height: 0
}

.layui-tree-iconClick {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    height: 20px;
    line-height: 20px;
    margin: 0 10px;
    color: #c0c4cc
}

.layui-tree-icon {
    height: 14px;
    line-height: 12px;
    width: 14px;
    text-align: center;
    border: 1px solid #c0c4cc
}

.layui-tree-iconClick .layui-icon {
    font-size: 18px
}

.layui-tree-icon .layui-icon {
    font-size: 12px;
    color: #5f5f5f
}

.layui-tree-iconArrow {
    padding: 0 5px
}

.layui-tree-iconArrow:after {
    content: "";
    position: absolute;
    left: 4px;
    top: 3px;
    z-index: 100;
    width: 0;
    height: 0;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent transparent #c0c4cc;
    transition: .5s
}

.layui-tree-spread>.layui-tree-entry .layui-tree-iconClick>.layui-tree-iconArrow:after {
    transform: rotate(90deg) translate(3px, 4px)
}

.layui-tree-txt {
    display: inline-block;
    vertical-align: middle;
    color: #555
}

.layui-tree-search {
    margin-bottom: 15px;
    color: #5f5f5f
}

.layui-tree-btnGroup {
    visibility: hidden;
    display: inline-block;
    vertical-align: middle;
    position: relative
}

.layui-tree-btnGroup .layui-icon {
    display: inline-block;
    vertical-align: middle;
    padding: 0 2px;
    cursor: pointer
}

.layui-tree-btnGroup .layui-icon:hover {
    color: #999;
    transition: .3s
}

.layui-tree-entry:hover .layui-tree-btnGroup {
    visibility: visible
}

.layui-tree-editInput {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    height: 20px;
    line-height: 20px;
    padding: 0;
    border: none;
    background-color: rgba(0, 0, 0, .05)
}

.layui-tree-emptyText {
    text-align: center;
    color: #999
}

.layui-anim {
    -webkit-animation-duration: .3s;
    -webkit-animation-fill-mode: both;
    animation-duration: .3s;
    animation-fill-mode: both
}

.layui-anim.layui-icon {
    display: inline-block
}

.layui-anim-loop {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

.layui-trans,
.layui-trans a {
    transition: .2s;
    -webkit-transition: .2s
}

@-webkit-keyframes layui-rotate {
    from {
        -webkit-transform: rotate(0)
    }

    to {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes layui-rotate {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.layui-anim-rotate {
    -webkit-animation-name: layui-rotate;
    animation-name: layui-rotate;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear
}

@-webkit-keyframes layui-up {
    from {
        -webkit-transform: translate3d(0, 100%, 0);
        opacity: .3
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@keyframes layui-up {
    from {
        transform: translate3d(0, 100%, 0);
        opacity: .3
    }

    to {
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

.layui-anim-up {
    -webkit-animation-name: layui-up;
    animation-name: layui-up
}

@-webkit-keyframes layui-upbit {
    from {
        -webkit-transform: translate3d(0, 15px, 0);
        opacity: .3
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@keyframes layui-upbit {
    from {
        transform: translate3d(0, 15px, 0);
        opacity: .3
    }

    to {
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

.layui-anim-upbit {
    -webkit-animation-name: layui-upbit;
    animation-name: layui-upbit
}

@keyframes layui-down {
    0% {
        opacity: .3;
        transform: translate3d(0, -100%, 0)
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

.layui-anim-down {
    animation-name: layui-down
}

@keyframes layui-downbit {
    0% {
        opacity: .3;
        transform: translate3d(0, -5px, 0)
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

.layui-anim-downbit {
    animation-name: layui-downbit
}

@-webkit-keyframes layui-scale {
    0% {
        opacity: .3;
        -webkit-transform: scale(.5)
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1)
    }
}

@keyframes layui-scale {
    0% {
        opacity: .3;
        -ms-transform: scale(.5);
        transform: scale(.5)
    }

    100% {
        opacity: 1;
        -ms-transform: scale(1);
        transform: scale(1)
    }
}

.layui-anim-scale {
    -webkit-animation-name: layui-scale;
    animation-name: layui-scale
}

@-webkit-keyframes layui-scale-spring {
    0% {
        opacity: .5;
        -webkit-transform: scale(.5)
    }

    80% {
        opacity: .8;
        -webkit-transform: scale(1.1)
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1)
    }
}

@keyframes layui-scale-spring {
    0% {
        opacity: .5;
        transform: scale(.5)
    }

    80% {
        opacity: .8;
        transform: scale(1.1)
    }

    100% {
        opacity: 1;
        transform: scale(1)
    }
}

.layui-anim-scaleSpring {
    -webkit-animation-name: layui-scale-spring;
    animation-name: layui-scale-spring
}

@keyframes layui-scalesmall {
    0% {
        opacity: .3;
        transform: scale(1.5)
    }

    100% {
        opacity: 1;
        transform: scale(1)
    }
}

.layui-anim-scalesmall {
    animation-name: layui-scalesmall
}

@keyframes layui-scalesmall-spring {
    0% {
        opacity: .3;
        transform: scale(1.5)
    }

    80% {
        opacity: .8;
        transform: scale(.9)
    }

    100% {
        opacity: 1;
        transform: scale(1)
    }
}

.layui-anim-scalesmall-spring {
    animation-name: layui-scalesmall-spring
}

@-webkit-keyframes layui-fadein {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes layui-fadein {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

.layui-anim-fadein {
    -webkit-animation-name: layui-fadein;
    animation-name: layui-fadein
}

@-webkit-keyframes layui-fadeout {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@keyframes layui-fadeout {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

.layui-anim-fadeout {
    -webkit-animation-name: layui-fadeout;
    animation-name: layui-fadeout
}

html #layuicss-skincodecss {
    display: none;
    position: absolute;
    width: 1989px
}

.layui-code-wrap {
    font-size: 13px;
    font-family: "Courier New", Consolas, "Lucida Console"
}

.layui-code-view {
    display: block;
    position: relative;
    padding: 0 !important;
    border: 1px solid #eee;
    border-left-width: 6px;
    background-color: #fff;
    color: #333
}

.layui-code-view pre {
    margin: 0 !important
}

.layui-code-header {
    position: relative;
    z-index: 3;
    padding: 0 11px;
    height: 40px;
    line-height: 40px;
    border-bottom: 1px solid #eee;
    background-color: #fafafa;
    font-size: 12px
}

.layui-code-header>.layui-code-header-about {
    position: absolute;
    right: 11px;
    top: 0;
    color: #b7b7b7
}

.layui-code-header-about>a {
    padding-left: 10px
}

.layui-code-wrap {
    position: relative;
    display: block;
    z-index: 1;
    margin: 0 !important;
    padding: 11px 0 !important;
    overflow-x: hidden;
    overflow-y: auto
}

.layui-code-line {
    position: relative;
    line-height: 19px;
    margin: 0 !important
}

.layui-code-line-number {
    position: absolute;
    left: 0;
    top: 0;
    padding: 0 8px;
    min-width: 45px;
    height: 100%;
    text-align: right;
    user-select: none;
    white-space: nowrap;
    overflow: hidden
}

.layui-code-line-content {
    padding: 0 11px;
    word-wrap: break-word;
    white-space: pre-wrap
}

.layui-code-ln-mode>.layui-code-wrap>.layui-code-line {
    padding-left: 45px
}

.layui-code-ln-side {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 0;
    width: 45px;
    border-right: 1px solid #eee;
    border-color: rgb(126 122 122 / 15%);
    background-color: #fafafa;
    pointer-events: none
}

.layui-code-nowrap>.layui-code-wrap {
    overflow: auto
}

.layui-code-nowrap>.layui-code-wrap>.layui-code-line>.layui-code-line-content {
    white-space: pre;
    word-wrap: normal
}

.layui-code-nowrap>.layui-code-ln-side {
    border-right-width: 0 !important;
    background: 0 0 !important
}

.layui-code-fixbar {
    position: absolute;
    top: 8px;
    right: 11px;
    padding-right: 45px;
    z-index: 5
}

.layui-code-fixbar>span {
    position: absolute;
    right: 0;
    top: 0;
    padding: 0 8px;
    color: #777;
    transition: .3s
}

.layui-code-fixbar>span:hover {
    color: #16b777
}

.layui-code-copy {
    display: none;
    cursor: pointer
}

.layui-code-preview>.layui-code-view>.layui-code-fixbar .layui-code-copy {
    display: none !important
}

.layui-code-view:hover>.layui-code-fixbar .layui-code-copy {
    display: block
}

.layui-code-view:hover>.layui-code-fixbar .layui-code-lang-marker {
    display: none
}

.layui-code-theme-dark,
.layui-code-theme-dark>.layui-code-header {
    border-color: rgb(126 122 122 / 15%);
    background-color: #1f1f1f
}

.layui-code-theme-dark {
    border-width: 1px;
    color: #ccc
}

.layui-code-theme-dark>.layui-code-ln-side {
    border-right-color: #2a2a2a;
    background: 0 0;
    color: #6e7681
}

.layui-code textarea {
    display: none
}

.layui-code-preview>.layui-code,
.layui-code-preview>.layui-code-view {
    margin: 0
}

.layui-code-preview>.layui-tab {
    position: relative;
    z-index: 1;
    margin-bottom: 0
}

.layui-code-preview>.layui-tab>.layui-tab-title {
    border-width: 0
}

.layui-code-preview .layui-code-item {
    display: none
}

.layui-code-item-preview {
    position: relative;
    padding: 16px
}

.layui-code-item-preview>iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none
}

.layui-code-tools {
    position: absolute;
    right: 11px;
    top: 8px;
    line-height: normal
}

.layui-code-tools>i {
    display: inline-block;
    margin-left: 6px;
    padding: 3px;
    cursor: pointer
}

.layui-code-tools>i.layui-icon-file-b {
    color: #999
}

.layui-code-tools>i:hover {
    color: #16b777
}

.layui-code-full {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1111111;
    width: 100%;
    height: 100%;
    background-color: #fff
}

.layui-code-full .layui-code-item {
    width: 100% !important;
    border-width: 1px 0 0 !important
}

.layui-code-full .layui-code-item,
.layui-code-full .layui-code-view,
.layui-code-full .layui-code-wrap {
    height: calc(100vh - 51px) !important;
    box-sizing: border-box
}

.layui-code-full .layui-code-item-preview {
    overflow: auto
}

.layui-code-view.layui-code-hl {
    line-height: 20px !important;
    border-left-width: 1px
}

.layui-code-view.layui-code-hl>.layui-code-ln-side {
    background-color: transparent
}

.layui-code-theme-dark.layui-code-hl,
.layui-code-theme-dark.layui-code-hl>.layui-code-ln-side {
    border-color: rgb(126 122 122 / 15%)
}

html #layuicss-laydate {
    display: none;
    position: absolute;
    width: 1989px
}

.layui-laydate * {
    margin: 0;
    padding: 0
}

.layui-laydate,
.layui-laydate * {
    box-sizing: border-box
}

.layui-laydate {
    position: absolute;
    z-index: 99999999;
    margin: 5px 0;
    border-radius: 2px;
    font-size: 14px;
    line-height: normal;
    -webkit-animation-duration: .2s;
    animation-duration: .2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-name: laydate-downbit
}

.layui-laydate-main {
    width: 272px
}

.layui-laydate-content td,
.layui-laydate-header *,
.layui-laydate-list li {
    transition-duration: .3s;
    -webkit-transition-duration: .3s
}

.layui-laydate-shade {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: fixed;
    pointer-events: auto
}

@keyframes laydate-downbit {
    0% {
        opacity: .3;
        transform: translate3d(0, -5px, 0)
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

.layui-laydate-static {
    position: relative;
    z-index: 0;
    display: inline-block;
    margin: 0;
    -webkit-animation: none;
    animation: none
}

.laydate-ym-show .laydate-next-m,
.laydate-ym-show .laydate-prev-m {
    display: none !important
}

.laydate-ym-show .laydate-next-y,
.laydate-ym-show .laydate-prev-y {
    display: inline-block !important
}

.laydate-time-show .laydate-set-ym span[lay-type=month],
.laydate-time-show .laydate-set-ym span[lay-type=year],
.laydate-time-show .layui-laydate-header .layui-icon,
.laydate-ym-show .laydate-set-ym span[lay-type=month] {
    display: none !important
}

.layui-laydate-header {
    position: relative;
    line-height: 30px;
    padding: 10px 70px 5px
}

.layui-laydate-header * {
    display: inline-block;
    vertical-align: bottom
}

.layui-laydate-header i {
    position: absolute;
    top: 10px;
    padding: 0 5px;
    color: #999;
    font-size: 18px;
    cursor: pointer
}

.layui-laydate-header i.laydate-prev-y {
    left: 15px
}

.layui-laydate-header i.laydate-prev-m {
    left: 45px
}

.layui-laydate-header i.laydate-next-y {
    right: 15px
}

.layui-laydate-header i.laydate-next-m {
    right: 45px
}

.laydate-set-ym {
    width: 100%;
    text-align: center;
    box-sizing: border-box;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.laydate-set-ym span {
    padding: 0 10px;
    cursor: pointer
}

.laydate-time-text {
    cursor: default !important
}

.layui-laydate-content {
    position: relative;
    padding: 10px;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none
}

.layui-laydate-content table {
    border-collapse: collapse;
    border-spacing: 0
}

.layui-laydate-content td,
.layui-laydate-content th {
    width: 36px;
    height: 30px;
    padding: 0;
    text-align: center
}

.layui-laydate-content th {
    font-weight: 400;
    color: #333
}

.layui-laydate-content td {
    position: relative;
    cursor: pointer;
    color: #777
}

.laydate-day-mark {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    line-height: 30px;
    font-size: 12px;
    overflow: hidden
}

.laydate-day-mark::after {
    position: absolute;
    content: '';
    right: 2px;
    top: 2px;
    width: 5px;
    height: 5px;
    border-radius: 50%
}

.laydate-day-holidays:before {
    position: absolute;
    left: 0;
    top: 0;
    font-size: 12px;
    transform: scale(.7);
    content: '\4F11';
    color: #ff5722
}

.laydate-day-holidays[type=work]:before {
    content: '\73ED';
    color: inherit
}

.layui-laydate .layui-this .laydate-day-holidays:before {
    color: #fff
}

.layui-laydate-footer {
    position: relative;
    height: 46px;
    line-height: 26px;
    padding: 10px
}

.layui-laydate-footer span {
    display: inline-block;
    vertical-align: top;
    height: 26px;
    line-height: 24px;
    padding: 0 10px;
    border: 1px solid #c9c9c9;
    border-radius: 2px;
    background-color: #fff;
    font-size: 12px;
    cursor: pointer;
    white-space: nowrap;
    transition: .3s
}

.layui-laydate-footer span:hover {
    color: #16b777
}

.layui-laydate-footer span.layui-laydate-preview {
    cursor: default;
    border-color: transparent !important
}

.layui-laydate-footer span.layui-laydate-preview:hover {
    color: #777
}

.layui-laydate-footer span:first-child.layui-laydate-preview {
    padding-left: 0
}

.laydate-footer-btns {
    position: absolute;
    right: 10px;
    top: 10px
}

.laydate-footer-btns span {
    margin: 0 0 0 -1px;
    border-radius: 0
}

.laydate-footer-btns span:first-child {
    border-radius: 2px 0 0 2px
}

.laydate-footer-btns span:last-child {
    border-radius: 0 2px 2px 0
}

.layui-laydate-shortcut {
    width: 80px;
    padding: 6px 0;
    display: inline-block;
    vertical-align: top;
    overflow: auto;
    max-height: 276px;
    text-align: center
}

.layui-laydate-shortcut+.layui-laydate-main {
    display: inline-block;
    border-left: 1px solid #e2e2e2
}

.layui-laydate-shortcut>li {
    padding: 5px 8px;
    cursor: pointer;
    line-height: 18px
}

.layui-laydate .layui-laydate-list {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    padding: 10px;
    box-sizing: border-box;
    background-color: #fff
}

.layui-laydate .layui-laydate-list>li {
    position: relative;
    display: inline-block;
    width: 33.3%;
    height: 36px;
    line-height: 36px;
    margin: 3px 0;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    list-style: none
}

.layui-laydate .laydate-month-list>li {
    width: 25%;
    margin: 17px 0
}

.layui-laydate .laydate-time-list>li {
    height: 100%;
    margin: 0;
    line-height: normal;
    cursor: default
}

.layui-laydate .laydate-time-list p {
    position: relative;
    top: -4px;
    margin: 0;
    line-height: 29px
}

.layui-laydate .laydate-time-list ol {
    height: 181px;
    overflow: hidden
}

.layui-laydate .laydate-time-list>li:hover ol {
    overflow-y: auto
}

.layui-laydate .laydate-time-list ol li {
    width: 130%;
    padding-left: 33px;
    height: 30px;
    line-height: 30px;
    text-align: left;
    cursor: pointer
}

.layui-laydate-hint {
    position: absolute;
    top: 115px;
    left: 50%;
    width: 250px;
    margin-left: -125px;
    line-height: 20px;
    padding: 15px;
    text-align: center;
    font-size: 12px
}

.layui-laydate-range {
    width: 546px
}

.layui-laydate-range .layui-laydate-main {
    display: inline-block;
    vertical-align: middle;
    max-width: 50%
}

.layui-laydate-range .laydate-main-list-1 .layui-laydate-content,
.layui-laydate-range .laydate-main-list-1 .layui-laydate-header {
    border-left: 1px solid #e2e2e2
}

.layui-laydate-range.layui-laydate-linkage .laydate-main-list-0 .laydate-next-m,
.layui-laydate-range.layui-laydate-linkage .laydate-main-list-0 .laydate-next-y,
.layui-laydate-range.layui-laydate-linkage .laydate-main-list-1 .laydate-prev-m,
.layui-laydate-range.layui-laydate-linkage .laydate-main-list-1 .laydate-prev-y {
    display: none
}

.layui-laydate,
.layui-laydate-hint {
    border: 1px solid #d2d2d2;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
    background-color: #fff;
    color: #777
}

.layui-laydate-header {
    border-bottom: 1px solid #e2e2e2
}

.layui-laydate-header i:hover,
.layui-laydate-header span:hover {
    color: #16b777
}

.layui-laydate-content {
    border-top: 0;
    border-bottom: 0
}

.layui-laydate-content td.laydate-day-now {
    color: #16b777
}

.layui-laydate-content td.laydate-day-now:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 30px;
    left: 0;
    top: 0;
    border: 1px solid #16b777;
    box-sizing: border-box
}

.layui-laydate-linkage .layui-laydate-content td.laydate-selected>div {
    background-color: #00f7de
}

.layui-laydate-linkage .laydate-selected:hover>div {
    background-color: #00f7de !important
}

.layui-laydate-content td.laydate-selected:after,
.layui-laydate-content td:hover:after {
    content: none
}

.layui-laydate-content td>div:hover,
.layui-laydate-list li:hover,
.layui-laydate-shortcut>li:hover {
    background-color: #eee;
    color: #333
}

.laydate-time-list li ol {
    margin: 0;
    padding: 0;
    border: 1px solid #e2e2e2;
    border-left-width: 0
}

.laydate-time-list li:first-child ol {
    border-left-width: 1px
}

.laydate-time-list>li:hover {
    background: 0 0
}

.layui-laydate-content .laydate-day-next,
.layui-laydate-content .laydate-day-prev {
    color: #d2d2d2
}

.layui-laydate-linkage .laydate-selected.laydate-day-next>div,
.layui-laydate-linkage .laydate-selected.laydate-day-prev>div {
    background-color: #f8f8f8 !important
}

.layui-laydate-footer {
    border-top: 1px solid #e2e2e2
}

.layui-laydate-hint {
    color: #ff5722
}

.laydate-day-mark::after {
    background-color: #16b777
}

.layui-laydate-content td.layui-this .laydate-day-mark::after {
    display: none
}

.layui-laydate-footer span[lay-type=date] {
    color: #16b777
}

.layui-laydate .layui-this,
.layui-laydate .layui-this>div {
    background-color: #16baaa !important;
    color: #fff !important
}

.layui-laydate .laydate-disabled,
.layui-laydate .laydate-disabled:hover {
    background: 0 0 !important;
    color: #d2d2d2 !important;
    cursor: not-allowed !important;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none
}

.layui-laydate-content td>div {
    padding: 7px 0;
    height: 100%
}

.laydate-theme-molv {
    border: none
}

.laydate-theme-molv.layui-laydate-range {
    width: 548px
}

.laydate-theme-molv .layui-laydate-main {
    width: 274px
}

.laydate-theme-molv .layui-laydate-header {
    border: none;
    background-color: #16baaa
}

.laydate-theme-molv .layui-laydate-header i,
.laydate-theme-molv .layui-laydate-header span {
    color: #f6f6f6
}

.laydate-theme-molv .layui-laydate-header i:hover,
.laydate-theme-molv .layui-laydate-header span:hover {
    color: #fff
}

.laydate-theme-molv .layui-laydate-content {
    border: 1px solid #e2e2e2;
    border-top: none;
    border-bottom: none
}

.laydate-theme-molv .laydate-main-list-1 .layui-laydate-content {
    border-left: none
}

.laydate-theme-grid .laydate-month-list>li,
.laydate-theme-grid .laydate-year-list>li,
.laydate-theme-grid .layui-laydate-content td,
.laydate-theme-grid .layui-laydate-content thead,
.laydate-theme-molv .layui-laydate-footer {
    border: 1px solid #e2e2e2
}

.layui-laydate-linkage.laydate-theme-grid .laydate-selected,
.layui-laydate-linkage.laydate-theme-grid .laydate-selected:hover {
    background-color: #f2f2f2 !important;
    color: #16baaa !important
}

.layui-laydate-linkage.laydate-theme-grid .laydate-selected.laydate-day-next,
.layui-laydate-linkage.laydate-theme-grid .laydate-selected.laydate-day-prev {
    color: #d2d2d2 !important
}

.laydate-theme-grid .laydate-month-list,
.laydate-theme-grid .laydate-year-list {
    margin: 1px 0 0 1px
}

.laydate-theme-grid .laydate-month-list>li,
.laydate-theme-grid .laydate-year-list>li {
    margin: 0 -1px -1px 0
}

.laydate-theme-grid .laydate-year-list>li {
    height: 43px;
    line-height: 43px
}

.laydate-theme-grid .laydate-month-list>li {
    height: 71px;
    line-height: 71px
}

.laydate-theme-grid .layui-laydate-content td>div {
    height: 29px;
    margin-top: -1px
}

.laydate-theme-circle .layui-laydate-content td.layui-this>div,
.laydate-theme-circle .layui-laydate-content td>div {
    width: 28px;
    height: 28px;
    line-height: 28px;
    border-radius: 14px;
    margin: 0 4px;
    padding: 0
}

.layui-laydate.laydate-theme-circle .layui-laydate-content table td.layui-this {
    background-color: transparent !important
}

.laydate-theme-grid.laydate-theme-circle .layui-laydate-content td>div {
    margin: 0 3.5px
}

.laydate-theme-fullpanel .layui-laydate-main {
    width: 526px
}

.laydate-theme-fullpanel .layui-laydate-list {
    width: 252px;
    left: 272px
}

.laydate-theme-fullpanel .laydate-set-ym span {
    display: none
}

.laydate-theme-fullpanel .laydate-time-show .laydate-set-ym span[lay-type=month],
.laydate-theme-fullpanel .laydate-time-show .laydate-set-ym span[lay-type=year],
.laydate-theme-fullpanel .laydate-time-show .layui-laydate-header .layui-icon {
    display: inline-block !important
}

.laydate-theme-fullpanel .laydate-btns-time {
    display: none
}

html #layuicss-layer {
    display: none;
    position: absolute;
    width: 1989px
}

.layui-layer,
.layui-layer-shade {
    position: fixed;
    pointer-events: auto
}

.layui-layer-shade {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.layui-layer {
    -webkit-overflow-scrolling: touch;
    top: 150px;
    left: 0;
    margin: 0;
    padding: 0;
    background-color: #fff;
    -webkit-background-clip: content;
    border-radius: 2px;
    box-shadow: 1px 1px 50px rgba(0, 0, 0, .3)
}

.layui-layer-close {
    position: absolute
}

.layui-layer-content {
    position: relative
}

.layui-layer-border {
    border: 1px solid rgba(0, 0, 0, .1);
    box-shadow: 1px 1px 5px rgba(0, 0, 0, .2)
}

.layui-layer-btn a,
.layui-layer-setwin span {
    display: inline-block;
    vertical-align: middle
}

.layui-layer-move {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: move;
    opacity: 0;
    background-color: #fff;
    z-index: 2147483647
}

.layui-layer-resize {
    position: absolute;
    width: 15px;
    height: 15px;
    right: 0;
    bottom: 0;
    cursor: se-resize
}

.layer-anim {
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: .3s;
    animation-duration: .3s
}

@-webkit-keyframes layer-bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(.5);
        transform: scale(.5)
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes layer-bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(.5);
        -ms-transform: scale(.5);
        transform: scale(.5)
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1)
    }
}

.layer-anim-00 {
    -webkit-animation-name: layer-bounceIn;
    animation-name: layer-bounceIn
}

@-webkit-keyframes layer-zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale(.1) translateY(-2000px);
        transform: scale(.1) translateY(-2000px);
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    60% {
        opacity: 1;
        -webkit-transform: scale(.475) translateY(60px);
        transform: scale(.475) translateY(60px);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
}

@keyframes layer-zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale(.1) translateY(-2000px);
        -ms-transform: scale(.1) translateY(-2000px);
        transform: scale(.1) translateY(-2000px);
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    60% {
        opacity: 1;
        -webkit-transform: scale(.475) translateY(60px);
        -ms-transform: scale(.475) translateY(60px);
        transform: scale(.475) translateY(60px);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
}

.layer-anim-01 {
    -webkit-animation-name: layer-zoomInDown;
    animation-name: layer-zoomInDown
}

@-webkit-keyframes layer-fadeInUpBig {
    0% {
        opacity: 0;
        -webkit-transform: translateY(2000px);
        transform: translateY(2000px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes layer-fadeInUpBig {
    0% {
        opacity: 0;
        -webkit-transform: translateY(2000px);
        -ms-transform: translateY(2000px);
        transform: translateY(2000px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

.layer-anim-02 {
    -webkit-animation-name: layer-fadeInUpBig;
    animation-name: layer-fadeInUpBig
}

@-webkit-keyframes layer-zoomInLeft {
    0% {
        opacity: 0;
        -webkit-transform: scale(.1) translateX(-2000px);
        transform: scale(.1) translateX(-2000px);
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    60% {
        opacity: 1;
        -webkit-transform: scale(.475) translateX(48px);
        transform: scale(.475) translateX(48px);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
}

@keyframes layer-zoomInLeft {
    0% {
        opacity: 0;
        -webkit-transform: scale(.1) translateX(-2000px);
        -ms-transform: scale(.1) translateX(-2000px);
        transform: scale(.1) translateX(-2000px);
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    60% {
        opacity: 1;
        -webkit-transform: scale(.475) translateX(48px);
        -ms-transform: scale(.475) translateX(48px);
        transform: scale(.475) translateX(48px);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
}

.layer-anim-03 {
    -webkit-animation-name: layer-zoomInLeft;
    animation-name: layer-zoomInLeft
}

@-webkit-keyframes layer-rollIn {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100%) rotate(-120deg);
        transform: translateX(-100%) rotate(-120deg)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0) rotate(0);
        transform: translateX(0) rotate(0)
    }
}

@keyframes layer-rollIn {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100%) rotate(-120deg);
        -ms-transform: translateX(-100%) rotate(-120deg);
        transform: translateX(-100%) rotate(-120deg)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0) rotate(0);
        -ms-transform: translateX(0) rotate(0);
        transform: translateX(0) rotate(0)
    }
}

.layer-anim-04 {
    -webkit-animation-name: layer-rollIn;
    animation-name: layer-rollIn
}

@keyframes layer-fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

.layer-anim-05 {
    -webkit-animation-name: layer-fadeIn;
    animation-name: layer-fadeIn
}

@-webkit-keyframes layer-shake {

    0%,
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateX(-10px);
        transform: translateX(-10px)
    }

    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }
}

@keyframes layer-shake {

    0%,
    100% {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateX(-10px);
        -ms-transform: translateX(-10px);
        transform: translateX(-10px)
    }

    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateX(10px);
        -ms-transform: translateX(10px);
        transform: translateX(10px)
    }
}

.layer-anim-06 {
    -webkit-animation-name: layer-shake;
    animation-name: layer-shake
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes layer-slide-down {
    from {
        transform: translate3d(0, -100%, 0)
    }

    to {
        transform: translate3d(0, 0, 0)
    }
}

@keyframes layer-slide-down-out {
    from {
        transform: translate3d(0, 0, 0)
    }

    to {
        transform: translate3d(0, -100%, 0)
    }
}

.layer-anim-slide-down {
    animation-name: layer-slide-down
}

.layer-anim-slide-down-out {
    animation-name: layer-slide-down-out
}

@keyframes layer-slide-left {
    from {
        transform: translate3d(100%, 0, 0)
    }

    to {
        transform: translate3d(0, 0, 0)
    }
}

@keyframes layer-slide-left-out {
    from {
        transform: translate3d(0, 0, 0)
    }

    to {
        transform: translate3d(100%, 0, 0)
    }
}

.layer-anim-slide-left {
    animation-name: layer-slide-left
}

.layer-anim-slide-left-out {
    animation-name: layer-slide-left-out
}

@keyframes layer-slide-up {
    from {
        transform: translate3d(0, 100%, 0)
    }

    to {
        transform: translate3d(0, 0, 0)
    }
}

@keyframes layer-slide-up-out {
    from {
        transform: translate3d(0, 0, 0)
    }

    to {
        transform: translate3d(0, 100%, 0)
    }
}

.layer-anim-slide-up {
    animation-name: layer-slide-up
}

.layer-anim-slide-up-out {
    animation-name: layer-slide-up-out
}

@keyframes layer-slide-right {
    from {
        transform: translate3d(-100%, 0, 0)
    }

    to {
        transform: translate3d(0, 0, 0)
    }
}

@keyframes layer-slide-right-out {
    from {
        transform: translate3d(0, 0, 0)
    }

    to {
        transform: translate3d(-100%, 0, 0)
    }
}

.layer-anim-slide-right {
    animation-name: layer-slide-right
}

.layer-anim-slide-right-out {
    animation-name: layer-slide-right-out
}

.layui-layer-title {
    padding: 0 81px 0 16px;
    height: 50px;
    line-height: 50px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-radius: 2px 2px 0 0
}

.layui-layer-setwin {
    position: absolute;
    right: 15px;
    top: 16px;
    font-size: 0;
    line-height: initial
}

.layui-layer-setwin span {
    position: relative;
    width: 16px;
    height: 16px;
    line-height: 18px;
    margin-left: 10px;
    text-align: center;
    font-size: 16px;
    cursor: pointer;
    color: #000;
    box-sizing: border-box
}

.layui-layer-setwin .layui-layer-min:before {
    content: '';
    position: absolute;
    width: 12px;
    border-bottom: 1px solid #2e2d3c;
    left: 50%;
    top: 50%;
    margin: -.5px 0 0 -6px;
    cursor: pointer
}

.layui-layer-setwin .layui-layer-max:after,
.layui-layer-setwin .layui-layer-max:before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 1;
    width: 9px;
    height: 9px;
    margin: -5px 0 0 -5px;
    border: 1px solid #2e2d3c
}

.layui-layer-setwin .layui-layer-max:hover:after,
.layui-layer-setwin .layui-layer-max:hover:before {
    border-color: #2d93ca
}

.layui-layer-setwin .layui-layer-min:hover:before {
    background-color: #2d93ca
}

.layui-layer-setwin .layui-layer-maxmin:after,
.layui-layer-setwin .layui-layer-maxmin:before {
    width: 7px;
    height: 7px;
    margin: -3px 0 0 -3px;
    background-color: #fff
}

.layui-layer-setwin .layui-layer-maxmin:after {
    z-index: 0;
    margin: -5px 0 0 -1px
}

.layui-layer-setwin .layui-layer-close {
    cursor: pointer
}

.layui-layer-setwin .layui-layer-close:hover {
    opacity: .7
}

.layui-layer-setwin .layui-layer-close2 {
    position: absolute;
    right: -28px;
    top: -28px;
    color: #fff;
    background-color: #787878;
    padding: 3px;
    border: 3px solid;
    width: 28px;
    height: 28px;
    font-size: 16px;
    font-weight: bolder;
    border-radius: 50%;
    margin-left: 0
}

.layui-layer-setwin .layui-layer-close2:hover {
    opacity: unset;
    background-color: #3888f6
}

.layui-layer-btn {
    text-align: right;
    padding: 0 15px 12px;
    pointer-events: auto;
    user-select: none;
    -webkit-user-select: none
}

.layui-layer-btn a {
    height: 30px;
    line-height: 30px;
    margin: 5px 5px 0;
    padding: 0 16px;
    border: 1px solid #dedede;
    background-color: #fff;
    color: #333;
    border-radius: 2px;
    font-weight: 400;
    cursor: pointer;
    text-decoration: none;
    box-sizing: border-box
}

.layui-layer-btn a:hover {
    opacity: .9;
    text-decoration: none
}

.layui-layer-btn a:active {
    opacity: .8
}

.layui-layer-btn .layui-layer-btn0 {
    border-color: transparent;
    background-color: #1e9fff;
    color: #fff
}

.layui-layer-btn-l {
    text-align: left
}

.layui-layer-btn-c {
    text-align: center
}

.layui-layer-dialog {
    min-width: 240px
}

.layui-layer-dialog .layui-layer-content {
    position: relative;
    padding: 16px;
    line-height: 24px;
    word-break: break-all;
    overflow: hidden;
    font-size: 14px;
    overflow-x: hidden;
    overflow-y: auto
}

.layui-layer-dialog .layui-layer-content .layui-layer-face {
    position: absolute;
    top: 18px;
    left: 16px;
    color: #959595;
    font-size: 32px
}

.layui-layer-dialog .layui-layer-content .layui-icon-tips {
    color: #f39b12
}

.layui-layer-dialog .layui-layer-content .layui-icon-success {
    color: #16b777
}

.layui-layer-dialog .layui-layer-content .layui-icon-error {
    top: 19px;
    color: #ff5722
}

.layui-layer-dialog .layui-layer-content .layui-icon-question {
    color: #ffb800
}

.layui-layer-dialog .layui-layer-content .layui-icon-lock {
    color: #787878
}

.layui-layer-dialog .layui-layer-content .layui-icon-face-cry {
    color: #ff5722
}

.layui-layer-dialog .layui-layer-content .layui-icon-face-smile {
    color: #16b777
}

.layui-layer-rim {
    border: 6px solid rgba(0, 0, 0, .3);
    border-radius: 5px;
    box-shadow: none
}

.layui-layer-msg {
    min-width: 180px;
    border: 1px solid #d3d4d3;
    box-shadow: none
}

.layui-layer-hui {
    min-width: 100px;
    background-color: rgba(0, 0, 0, .6);
    color: #fff;
    border: none
}

.layui-layer-hui .layui-layer-close {
    color: #fff
}

.layui-layer-hui .layui-layer-content {
    padding: 11px 24px;
    text-align: center
}

.layui-layer-dialog .layui-layer-padding {
    padding: 18px 24px 18px 58px;
    text-align: left
}

.layui-layer-page .layui-layer-content {
    position: relative;
    overflow: auto
}

.layui-layer-iframe .layui-layer-btn,
.layui-layer-page .layui-layer-btn {
    padding-top: 10px
}

.layui-layer-nobg {
    background: 0 0
}

.layui-layer-iframe iframe {
    display: block;
    width: 100%
}

.layui-layer-loading {
    border-radius: 100%;
    background: 0 0;
    box-shadow: none;
    border: none
}

.layui-layer-loading .layui-layer-content {
    width: 76px;
    height: 38px;
    line-height: 38px;
    text-align: center
}

.layui-layer-loading-icon {
    font-size: 38px;
    color: #959595
}

.layui-layer-loading2 {
    text-align: center
}

.layui-layer-loading-2 {
    position: relative;
    height: 38px
}

.layui-layer-loading-2:after,
.layui-layer-loading-2:before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 38px;
    height: 38px;
    margin: -19px 0 0 -19px;
    border-radius: 50%;
    border: 3px solid #d2d2d2;
    box-sizing: border-box
}

.layui-layer-loading-2:after {
    border-color: transparent transparent transparent #1e9fff
}

.layui-layer-tips {
    background: 0 0;
    box-shadow: none;
    border: none
}

.layui-layer-tips .layui-layer-content {
    position: relative;
    line-height: 22px;
    min-width: 12px;
    padding: 8px 15px;
    font-size: 12px;
    border-radius: 2px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, .2);
    background-color: #000;
    color: #fff
}

.layui-layer-tips .layui-layer-close {
    right: -2px;
    top: -1px
}

.layui-layer-tips i.layui-layer-TipsG {
    position: absolute;
    width: 0;
    height: 0;
    border: 8px dashed transparent
}

.layui-layer-tips i.layui-layer-TipsB,
.layui-layer-tips i.layui-layer-TipsT {
    left: 5px;
    border-right-style: solid;
    border-right-color: #000
}

.layui-layer-tips i.layui-layer-TipsT {
    bottom: -8px
}

.layui-layer-tips i.layui-layer-TipsB {
    top: -8px
}

.layui-layer-tips i.layui-layer-TipsL,
.layui-layer-tips i.layui-layer-TipsR {
    top: 5px;
    border-bottom-style: solid;
    border-bottom-color: #000
}

.layui-layer-tips i.layui-layer-TipsR {
    left: -8px
}

.layui-layer-tips i.layui-layer-TipsL {
    right: -8px
}

.layui-layer-lan .layui-layer-title {
    background: #4476a7;
    color: #fff;
    border: none
}

.layui-layer-lan .layui-layer-btn {
    padding: 5px 10px 10px;
    border-top: 1px solid #e9e7e7
}

.layui-layer-lan .layui-layer-btn a {
    background: #fff;
    border-color: #e9e7e7;
    color: #333
}

.layui-layer-lan .layui-layer-btn .layui-layer-btn1 {
    background: #c9c5c5
}

.layui-layer-molv .layui-layer-title {
    background: #009f95;
    color: #fff;
    border: none
}

.layui-layer-molv .layui-layer-btn a {
    background: #009f95;
    border-color: #009f95
}

.layui-layer-molv .layui-layer-btn .layui-layer-btn1 {
    background: #92b8b1
}

.layui-layer-lan .layui-layer-setwin .layui-icon,
.layui-layer-molv .layui-layer-setwin .layui-icon {
    color: #fff
}

.layui-layer-win10 {
    border: 1px solid #aaa;
    box-shadow: 1px 1px 6px rgba(0, 0, 0, .3);
    border-radius: none
}

.layui-layer-win10 .layui-layer-title {
    height: 32px;
    line-height: 32px;
    padding-left: 8px;
    border-bottom: none;
    font-size: 12px
}

.layui-layer-win10 .layui-layer-setwin {
    right: 0;
    top: 0
}

.layui-layer-win10 .layui-layer-setwin span {
    margin-left: 0;
    width: 32px;
    height: 32px;
    padding: 8px
}

.layui-layer-win10.layui-layer-page .layui-layer-setwin span {
    width: 38px
}

.layui-layer-win10 .layui-layer-setwin span:hover {
    background-color: #e5e5e5
}

.layui-layer-win10 .layui-layer-setwin span.layui-icon-close:hover {
    background-color: #e81123;
    color: #fff
}

.layui-layer-win10.layui-layer-dialog .layui-layer-content {
    padding: 8px 16px 32px;
    color: #0033bc
}

.layui-layer-win10.layui-layer-dialog .layui-layer-padding {
    padding-top: 18px;
    padding-left: 58px
}

.layui-layer-win10 .layui-layer-btn {
    padding: 5px 5px 10px;
    border-top: 1px solid #dfdfdf;
    background-color: #f0f0f0
}

.layui-layer-win10 .layui-layer-btn a {
    height: 20px;
    line-height: 18px;
    background-color: #e1e1e1;
    border-color: #adadad;
    color: #000;
    font-size: 12px;
    transition: .3s
}

.layui-layer-win10 .layui-layer-btn a:hover {
    border-color: #2a8edd;
    background-color: #e5f1fb
}

.layui-layer-win10 .layui-layer-btn .layui-layer-btn0 {
    border-color: #0078d7
}

.layui-layer-prompt .layui-layer-input {
    display: block;
    width: 260px;
    height: 36px;
    margin: 0 auto;
    line-height: 30px;
    padding-left: 10px;
    border: 1px solid #e6e6e6;
    color: #333
}

.layui-layer-prompt textarea.layui-layer-input {
    width: 300px;
    height: 100px;
    line-height: 20px;
    padding: 6px 10px
}

.layui-layer-prompt .layui-layer-content {
    padding: 16px
}

.layui-layer-prompt .layui-layer-btn {
    padding-top: 0
}

.layui-layer-tab {
    box-shadow: 1px 1px 50px rgba(0, 0, 0, .4)
}

.layui-layer-tab .layui-layer-title {
    padding-left: 0;
    overflow: visible
}

.layui-layer-tab .layui-layer-title span {
    position: relative;
    display: inline-block;
    vertical-align: top;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    min-width: 80px;
    max-width: 300px;
    padding: 0 16px;
    text-align: center;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer
}

.layui-layer-tab .layui-layer-title span.layui-this {
    height: 51px;
    border-left-color: #eee;
    border-right-color: #eee;
    background-color: #fff;
    z-index: 10
}

.layui-layer-tab .layui-layer-title span:first-child {
    border-left-color: transparent
}

.layui-layer-tabmain {
    line-height: 24px;
    clear: both
}

.layui-layer-tabmain .layui-layer-tabli {
    display: none
}

.layui-layer-tabmain .layui-layer-tabli.layui-this {
    display: block
}

.layui-layer-photos {
    background: 0 0;
    box-shadow: none
}

.layui-layer-photos .layui-layer-content {
    overflow: visible;
    text-align: center
}

.layui-layer-photos .layer-layer-photos-main img {
    position: relative;
    width: 100%;
    display: inline-block;
    vertical-align: top
}

.layui-layer-photos-next,
.layui-layer-photos-prev {
    position: fixed;
    top: 50%;
    width: 52px;
    height: 52px;
    line-height: 52px;
    margin-top: -26px;
    cursor: pointer;
    font-size: 52px;
    color: #717171
}

.layui-layer-photos-prev {
    left: 32px
}

.layui-layer-photos-next {
    right: 32px
}

.layui-layer-photos-next:hover,
.layui-layer-photos-prev:hover {
    color: #959595
}

.layui-layer-photos-toolbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 52px;
    line-height: 52px;
    filter: Alpha(opacity=60);
    background-color: rgba(0, 0, 0, .32);
    color: #fff;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-size: 0
}

.layui-layer-photos-toolbar>* {
    display: inline-block;
    vertical-align: top;
    padding: 0 16px;
    font-size: 12px;
    color: #fff
}

.layui-layer-photos-toolbar * {
    font-size: 12px
}

.layui-layer-photos-header {
    top: 0;
    bottom: auto
}

.layui-layer-photos-header>span {
    cursor: pointer
}

.layui-layer-photos-header>span:hover {
    background-color: rgba(51, 51, 51, .32)
}

.layui-layer-photos-header .layui-icon {
    font-size: 18px
}

.layui-layer-photos-footer>h3 {
    max-width: 65%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.layui-layer-photos-footer a:hover {
    text-decoration: underline
}

.layui-layer-photos-footer em {
    font-style: normal
}

@-webkit-keyframes layer-bounceOut {
    100% {
        opacity: 0;
        -webkit-transform: scale(.7);
        transform: scale(.7)
    }

    30% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05)
    }

    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes layer-bounceOut {
    100% {
        opacity: 0;
        -webkit-transform: scale(.7);
        -ms-transform: scale(.7);
        transform: scale(.7)
    }

    30% {
        -webkit-transform: scale(1.05);
        -ms-transform: scale(1.05);
        transform: scale(1.05)
    }

    0% {
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1)
    }
}

.layer-anim-close {
    -webkit-animation-name: layer-bounceOut;
    animation-name: layer-bounceOut;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: .2s;
    animation-duration: .2s
}

@media screen and (max-width:1100px) {
    .layui-layer-iframe {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch
    }
}

.search-ipt {
    border: 0;
    background: 0 0;
    border-radius: 0;
    -webkit-appearance: none
}

.web-search {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    visibility: hidden
}

.js .web-search {
    position: fixed;
    opacity: 0;
    visibility: hidden;
    pointer-events: none
}

.js .web-search::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .98);
    -webkit-transform: scale(1, .1);
    -ms-transform: scale(1, .1);
    -o-transform: scale(1, .1);
    transform: scale(1, .1)
}

.web-search .btn--search-close {
    font-size: 2em;
    position: absolute;
    top: 1.25em;
    right: 1.25em;
    display: none;
    background: url(../images/search_btn_close.png) center 0 no-repeat;
    width: 50px;
    height: 50px;
    cursor: pointer
}

.web-search .btn--search-close:hover {
    background-position: center -50px;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg)
}

.js .btn--search-close {
    display: block
}

.web-search .search-ipt {
    font-family: inherit;
    display: inline-block;
    box-sizing: border-box;
    width: 75%;
    padding: .05em 0;
    color: #333;
    border-bottom: 3px solid;
    font-size: 20px;
    line-height: 10px
}

.web-search .search-ipt::-webkit-input-placeholder {
    color: #888;
    font-weight: 700
}

.web-search .search-ipt::-moz-placeholder {
    opacity: 1;
    color: #888;
    font-weight: 700
}

.web-search .search-ipt:-ms-input-placeholder {
    color: #888;
    font-weight: 700
}

.web-search .search-ipt::-webkit-search-cancel-button,
.web-search .search-ipt::-webkit-search-decoration {
    -webkit-appearance: none
}

.web-search .search-ipt::-ms-clear {
    display: none
}

.web-search .search-attr {
    font-size: 90%;
    display: block;
    width: 75%;
    margin: 0 auto;
    padding: .85em 0 0;
    text-align: right;
    color: #333
}

.js .container {
    position: relative;
    -moz-transition: .4s ease-in-out;
    -webkit-transition: .4s ease-in-out;
    -ms-transition: .4s ease-in-out;
    -o-transition: .4s ease-in-out;
    transition: .4s ease-in-out
}

.container.other .privacy-main {
    padding-top: 140px
}

.js .main-wrap--move {
    height: 100vh
}

.js .search--open {
    pointer-events: auto;
    opacity: 1;
    visibility: visible
}

.js .web-search::before {
    opacity: .3;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
    transition: .3s
}

.js .search--open::before {
    opacity: 1
}

.web-search .btn--search-close {
    opacity: 0;
    -webkit-transition: opacity .3s;
    -o-transition: opacity .3s;
    transition: opacity .3s
}

.search--open .btn--search-close {
    opacity: 1;
    -webkit-transition: transform .3s;
    -o-transition: transform .3s;
    transition: transform .3s
}

.search__suggestion,
.web-search .search-attr {
    opacity: 0;
    -moz-transform: translate3d(0, 30px, 0);
    -webkit-transform: translate3d(0, 30px, 0);
    -ms-transform: translate3d(0, 30px, 0);
    -o-transform: translate3d(0, 30px, 0);
    transform: translate3d(0, 30px, 0);
    -moz-transition: opacity .8s, transform .8s;
    -webkit-transition: opacity .8s, transform .8s;
    -ms-transition: opacity .8s, transform .8s;
    -o-transition: opacity .8s, transform .8s;
    transition: opacity .8s, transform .8s
}

.search--open .search-attr {
    opacity: 1;
    -moz-transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    font-size: 20px
}

.js .web-search .search-ipt {
    font-size: 60px;
    font-weight: 700;
    border-bottom-width: 1px;
    padding: 15px 0;
    -moz-transform: scale3d(0, 1, 1);
    -webkit-transform: scale3d(0, 1, 1);
    -ms-transform: scale3d(0, 1, 1);
    -o-transform: scale3d(0, 1, 1);
    transform: scale3d(0, 1, 1);
    -moz-transform-origin: 0% 50%;
    -webkit-transform-origin: 0% 50%;
    -ms-transform-origin: 0% 50%;
    -o-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -moz-transition: transform .3s;
    -webkit-transition: transform .3s;
    -ms-transition: transform .3s;
    -o-transition: transform .3s;
    transition: transform .3s;
    opacity: 0;
    text-transform: uppercase
}

.js .web-search .search-ipt,
.web-search .search-attr {
    -webkit-transition-delay: 0.4s;
    -o-transition-delay: 0.4s;
    transition-delay: 0.4s
}

.js .search--open .search-ipt {
    -moz-transform: scale3d(1, 1, 1);
    -webkit-transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
    -o-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    opacity: 1;
    -moz-transition-duration: .4s;
    -webkit-transition-duration: .4s;
    -ms-transition-duration: .4s;
    -o-transition-duration: .4s;
    transition-duration: .4s
}

.js .search--open .search-btn {
    display: none !important
}

.js .search--open::before {
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -o-transform: scale(1, 1);
    transform: scale(1, 1)
}

.js .web-search {
    width: 70%;
    height: auto;
    left: 15%;
    top: 50%;
    bottom: auto;
    padding: 35px 0;
    margin: auto;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    border-radius: 8px;
    z-index: 100001;
    overflow: hidden
}

.js .fixed-body .web-search {
    top: 50%
}

.main-wrap--move:after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .7);
    position: fixed;
    left: 0;
    top: 0;
    z-index: 100000
}

.margin-auto {
    display: flex;
    max-width: 1480px;
    margin: 0 auto;
    width: 90%;
    text-transform: capitalize
}

.dh-title-index-about {
    background: #f3f3f3;
    width: 100%;
    height: 50px
}

.dh-title-index-about .dh-text {
    flex-wrap: wrap;
    display: flex;
    align-items: center;
    height: 50px;
    font-family: Poppins;
    font-weight: 400;
    font-size: 16px;
    color: #000
}

.dh-title-index-about .dh-text span {
    color: #1052ee;
    margin-right: 15px
}

.dh-title-index-about .dh-text i {
    font-family: Arial;
    font-weight: 400;
    font-size: 16px;
    color: #ccc;
    padding: 0 6px;
    box-sizing: border-box;
    margin-top: 2px
}

.dh-title-index-about .dh-text b {
    color: #1052ee
}

.dh-title-index-about .dh-text a {
    text-transform: capitalize;
    font-weight: 400;
    display: flex;
    align-items: center;
    font-size: var(--font-size14);
    color: #4c505f
}

.sidebar {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    margin: 20px;
    z-index: 99;
    border-radius: 50%
}

.sidebar.active {
    display: block
}

.sidebar ul li {
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    margin-bottom: 8px;
    background: #f67f2f;
    border-radius: 25%
}

.sidebar ul li span {
    display: block;
    width: 50px;
    height: 50px
}

.sidebar ul li .sidebar_item_con {
    display: none;
    position: absolute;
    top: 0;
    right: 100%
}

.sidebar ul li .sidebar_item_con .sidebar_item_txt {
    margin-right: 4px;
    background-color: #ffec37;
    padding: 0 8px;
    text-align: right;
    height: 50px;
    font-size: 16px;
    color: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    white-space: nowrap
}

.sidebar ul .slide img {
    max-width: 150px;
    max-height: 100%;
    width: 45px;
    height: 45px
}

.sidebar ul .slide:hover .sidebar_item_con {
    display: block
}

.search-product-detail .fl-rich-textqq .sep-datalistqq>li .thumbqq {
    position: relative;
    display: block;
    max-width: 400px;
    padding: 5px 5px 11%;
    border: 1px solid #eee;
    background-color: #fff;
    margin: 0 20px 0 0;
    float: left;
    width: 40%
}

.leader .information {
    border-radius: 20px;
    box-shadow: 0 0 43px 0 rgb(59 59 59 / 10%);
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 5%
}

.leader .information .left_img {
    width: 30%;
    position: relative;
    padding-bottom: 30%;
    border-radius: 20px;
    overflow: hidden
}

.leader .information .left_img img {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    object-fit: cover
}

.leader .information .information_info {
    width: 70%;
    padding: 3%;
    font-size: 18px;
    line-height: 1.5;
    color: #666
}

.leader .information .information_info .name {
    margin: 15px 0 5px;
    color: #fb7d20;
    font-size: 22px
}

.leader .information .information_info .position {
    font-size: 18px;
    color: #818080
}

@media (max-width:992px) {
    .white .btn--search {
        display: inline-block;
        width: 50px;
        height: 60px;
        vertical-align: middle;
        cursor: pointer;
        margin-right: 0;
        background: url(../images/search-button.png) center no-repeat
    }

    .js .web-search {
        width: 100%;
        left: 0;
        top: 60px;
        transform: translateY(0);
        padding: 25px 0
    }

    .js .web-search .search-ipt {
        font-size: 16px;
        width: 90%;
        padding: 5px 0
    }

    .search--open .search-attr {
        display: none
    }

    .web-search .btn--search-close {
        font-size: 1em;
        height: 44px;
        width: 40px;
        top: -10px;
        right: .25em
    }
}

.accordion__item {
    margin-bottom: 4px
}

.accordion__header {
    background-color: #444;
    color: #fff;
    padding: 13px 18px;
    border: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left;
    cursor: pointer
}

.accordion__panel {
    display: none
}

.accordion__item--is-open .accordion__header {
    background-color: #f67f2f;
    color: #fff
}

.icon {
    height: 20px;
    width: 20px;
    display: inline-block;
    color: inherit;
    fill: currentColor;
    line-height: 1;
    flex-shrink: 0;
    max-width: initial
}

.accordion[data-animation=on] .accordion__icon-plus .icon__group {
    transition: transform .3s cubic-bezier(.215, .61, .355, 1)
}

.accordion[data-animation=on] .accordion__icon-plus .icon__group>* {
    transition: transform .3s, stroke-dashoffset .3s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
}

.accordion__icon-plus .icon__group>* {
    transform-origin: 50% 50%;
    width: 16px;
    height: 2px;
    background-color: #fff;
    display: block;
    position: absolute
}

.accordion__icon-plus .icon__group {
    transform: rotate(-90deg);
    will-change: transform;
    transform-origin: 50% 50%
}

.accordion__header .icon .icon__group {
    stroke-width: 2px;
    width: 100%;
    height: 100%
}

.accordion__icon-plus .icon__group>:first-child {
    transform: rotate(-90deg);
    transition: transform .3s, stroke-dashoffset .3s
}

.accordion__item--is-open>.accordion__header>.accordion__icon-plus .icon__group>:first-child {
    transform: rotate(0)
}

.product-intro {
    position: relative;
    overflow: hidden
}

.page_title {
    font-size: var(--font-size36);
    margin-bottom: 18px
}

.cloud-zoom-lens {
    border: 1px solid #eee;
    cursor: move
}

.cloud-zoom-title {
    position: absolute !important;
    background-color: #000;
    color: #fff;
    padding: 3px;
    width: 100%;
    text-align: center;
    font-weight: 700;
    font-size: 10px;
    top: 0
}

.cloud-zoom-big {
    overflow: hidden;
    padding: 0
}

.cloud-zoom-loading {
    color: #fff;
    background: #222;
    padding: 3px;
    border: 1px solid #000
}

.product-view .swiper-slide {
    padding-bottom: 1px
}

.product-view .image-additional-wrap {
    position: relative
}

.product-view .product-image.zoom_remove:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    z-index: 999
}

.product-view {
    position: relative;
    width: 37.6%;
    float: left
}

.product-view .product-image {
    position: relative;
    border: 1px solid #ddd
}

.product-view .product-image img {
    position: relative;
    width: 100%
}

.product-view .image-additional {
    position: relative;
    margin: 20px 15px;
    overflow: hidden
}

.product-view .image-additional li {
    position: relative;
    width: 33.3333%;
    float: left;
    overflow: visible
}

.product-view .image-additional li.single {
    display: none
}

.product-view .image-additional li img {
    display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    border: 1px solid silver;
    padding: 1px
}

.product-view .image-additional li a {
    display: block;
    position: relative;
    padding: 0 15%
}

.product-view .image-additional li.current img {
    border: 2px solid #fb7d20;
    padding: 0
}

.product-view .image-additional img.popup {
    display: none
}

.ad_prompt {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    line-height: 40px;
    margin: -20px 0 0;
    text-align: center;
    color: #ff6f00;
    font-size: 20px;
    -webkit-animation: 1s ease-in-out infinite twinkling;
    animation: 1s ease-in-out infinite twinkling;
    display: none
}

.product-view .image-additional.swiper-container-horizontal>.swiper-pagination-bullets {
    display: none
}

.product-view .swiper-button-next,
.product-view .swiper-button-prev {
    width: 30px;
    height: 30px;
    margin-top: -15px;
    opacity: 1;
    line-height: 30px;
    font-size: 28px;
    background: 0 0;
    -webkit-transform: scale(.6, 1);
    -ms-transform: scale(.6, 1);
    -o-transform: scale(.6, 1);
    transform: scale(.6, 1);
    font-weight: 700
}

.product-view .swiper-button-prev,
.product-view .swiper-container-rtl .swiper-button-next {
    left: -10px
}

.product-view .swiper-button-next,
.product-view .swiper-container-rtl .swiper-button-prev {
    right: -10px
}

.product-summary {
    position: relative;
    width: 57%;
    float: right;
    padding: 0 0 10px;
    color: #666;
    font-size: 13px
}

.product-summary .product-meta {
    line-height: 1.8;
    font-size: var(--font-size24)
}

.product-summary .product-meta h3 {
    margin: 0 0 5px;
    font-size: 14px
}

.product-summary .product-meta li {
    width: 100%;
    display: table;
    padding: 2px 0
}

.product-summary .product-meta li em {
    display: table-cell;
    width: 40%;
    color: #aaa
}

.product-summary .product-meta li .item-val {
    display: table-cell;
    -ms-word-break: break-all;
    word-break: break-all;
    word-wrap: break-word
}

.product-btn-wrap {
    position: relative;
    padding-top: 30px
}

.product-btn-wrap .button,
.product-btn-wrap .buy,
.product-btn-wrap .email {
    position: relative;
    display: inline-block;
    vertical-align: top;
    line-height: 28px;
    padding: .1em 1em;
    font-size: var(--font-size20);
    border-radius: 3px;
    background: #fb7d20;
    border: 2px solid #fb7d20;
    color: #fff;
    margin: 0 15px 10px 0
}

.product-btn-wrap .button:before,
.product-btn-wrap .email:before {
    padding-right: 8px
}

.product-btn-wrap a:hover {
    background-color: #fff !important;
    border-color: #fb7d20 !important;
    color: #fb7d20 !important
}

.product-summary .share-this {
    margin: 30px 0 0;
    text-align: right
}

.product-detail {
    position: relative;
    overflow: visible;
    margin: 30px 0 0
}

.detail-tabs {
    position: relative
}

.detail-tabs .title {
    position: relative;
    display: inline-block;
    font-weight: 400;
    vertical-align: top;
    line-height: 26px;
    padding: 1px 20px;
    cursor: pointer;
    margin: 0 5px 0 0;
    font-size: 16px;
    background-color: #ddd;
    border: 1px solid #ddd;
    color: #fff
}

.detail-tabs .title.current {
    background: #000;
    border-color: #000;
    color: #fff
}

.product-detail .tab-panel-content {
    padding: 10px 0;
    display: block;
    overflow: hidden
}

.product-detail .disabled {
    display: none
}

@media only screen and (max-width:480px) {
    .product-intro {
        overflow: visible
    }

    .product-view {
        width: auto;
        margin-left: -10px;
        margin-right: -10px
    }

    .product-view .image-additional li a {
        margin-left: 0;
        margin-right: 0
    }

    .product-view .image-additional li a:after,
    .product-view .image-additional li a:before {
        display: none
    }

    .product-view .swiper-button-next,
    .product-view .swiper-button-prev {
        width: 27px;
        height: 40px;
        line-height: 40px;
        -webkit-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
        font-size: 18px;
        opacity: .8
    }

    .product-view .swiper-button-prev {
        left: 0;
        border-radius: 0 3px 3px 0;
        padding-right: 2px
    }

    .product-view .swiper-button-next {
        right: 0;
        border-radius: 3px 0 0 3px;
        padding-left: 2px
    }

    .product-view .swiper-button-next:before,
    .product-view .swiper-button-prev:before {
        display: inline-block;
        -webkit-transform: scale(.7, 1);
        -ms-transform: scale(.7, 1);
        -o-transform: scale(.7, 1);
        transform: scale(.7, 1)
    }

    .goods-may-like .title {
        text-transform: none
    }

    .page_title {
        font-weight: 400;
        font-size: 20px;
        margin-bottom: 10px
    }

    .product-summary {
        padding-top: 0
    }

    .product-summary .page_title {
        font-size: 24px
    }

    .product-summary .product-meta {
        font-size: 14px
    }

    .product-summary .product-meta p {
        font-size: 15px
    }

    .product-summary .product-meta h3 {
        line-height: 1.3;
        font-size: 16px
    }

    .product-summary .product-meta li {
        font-size: 13px
    }

    .product-summary .share-this {
        text-align: left;
        margin: 20px 0 0
    }

    .product-btn-wrap {
        padding-top: 30px
    }

    .product-btn-wrap .buy,
    .product-btn-wrap .email,
    .product-btn-wrap .pdf {
        font-size: 14px;
        padding: 2px 10px
    }

    .product-detail {
        margin-top: 40px
    }

    .detail-tabs .title {
        font-size: 14px;
        padding: 1px 15px
    }
}

.product_case {
    margin-top: 50px
}

.product_case .describe {
    font-size: 18px;
    line-height: 2;
    color: #333;
    text-align: center
}

.product_case ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 50px;
    text-align: center
}

.product_case ul li {
    margin-bottom: 40px;
    width: 48%;
    padding: 4% 0 1%;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #fafafa;
    border-radius: 30px
}

.product_case ul li .title {
    font-weight: 800;
    font-size: var(--font-size45)
}

.product_case ul li .desc {
    font-size: var(--font-size18);
    margin: 4% auto
}

.product_case ul li a {
    padding: 1.5% 4%;
    border: 5px;
    background-color: #f67f2f;
    color: #fff;
    border-radius: 5px;
    font-size: 16px;
    transition: .2s
}

.product_case ul li a:hover {
    background-color: #333
}

.product_case ul li .image {
    position: relative;
    width: 100%;
    padding-bottom: 70%;
    margin-top: 30px
}

.product_case ul li .image img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

@media only screen and (max-width:768px) {
    #authentication ul li img {
        object-fit: contain
    }
}

.t_alert {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgb(0 0 0 / 38%);
    z-index: 111;
    display: none
}

.t_alert span {
    position: absolute;
    right: 10%;
    top: 10%;
    width: 30px;
    height: 30px;
    background: url(../images/fancy_close.png) center center no-repeat;
    cursor: pointer;
    z-index: 1
}

.t_alert .bg {
    position: absolute;
    width: 80%;
    height: 80%;
    left: 10%;
    top: 10%;
    background-size: contain;
    background-position: center;
    text-align: center;
    background-color: rgb(222 222 222 / 54%);
    border-radius: 22px
}

.t_alert .bg img {
    max-width: 100%;
    max-height: 100%
}

.clearfix span {
    font-size: var(--font-size18);
    margin: 30px 3px 15px;
    display: inline-block;
    position: relative;
    font-weight: 600;
    padding: 0 25px;
    cursor: pointer
}

.clearfix span::after {
    content: '';
    display: inline-block;
    border-bottom: 3px solid;
    width: 0%;
    position: absolute;
    left: 0;
    bottom: -10px;
    transition: .7s
}

.clearfix span:hover::after {
    width: 100%
}

.clearfix .active {
    color: #fb7d20
}

.clearfix .active::after {
    background-color: #fb7d20;
    width: 100%
}

@media (max-width:1600px) {
    .Mainbottom .columns .left .link {
        background-color: var(--vi-color);
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 50px;
        color: #fff;
        padding: 10px 20px;
        width: fit-content;
        margin-top: 20px;
        border: 2px solid var(--vi-color);
        transition: .3s
    }
}

.css_ios {
    display: none
}

@media (max-width:950px) {
    .head-language {
        display: none
    }

    .bgimage .ios_video {
        min-height: 500px
    }

    .css_ios {
        display: block
    }

    .css_pc {
        display: none !important
    }

    .Mainbottom .columns .left .link {
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 50px;
        color: #fff;
        padding: 10px 20px;
        width: fit-content;
        margin: 20px auto;
        border: 2px solid var(--vi-color);
        transition: .3s
    }

    .prover .swiper-button-next,
    .prover .swiper-button-prev {
        opacity: 0
    }
}

.banner .image img {
    height: 100vh;
    object-fit: cover
}

@keyframes bulbFlicker {

    0%,
    100% {
        opacity: 1;
        text-shadow: 0 0 10px rgba(241, 87, 41, .35), 0 0 20px rgba(241, 87, 41, .15)
    }

    8% {
        opacity: .75;
        text-shadow: 0 0 6px rgba(241, 87, 41, .25)
    }

    12% {
        opacity: .25;
        text-shadow: none
    }

    16% {
        opacity: .9;
        text-shadow: 0 0 8px rgba(241, 87, 41, .3)
    }

    22% {
        opacity: .4;
        text-shadow: none
    }

    28% {
        opacity: 1;
        text-shadow: 0 0 12px rgba(241, 87, 41, .4), 0 0 24px rgba(241, 87, 41, .2)
    }

    52% {
        opacity: .85;
        text-shadow: 0 0 6px rgba(241, 87, 41, .25)
    }

    58% {
        opacity: .3;
        text-shadow: none
    }

    63% {
        opacity: 1;
        text-shadow: 0 0 12px rgba(241, 87, 41, .4), 0 0 26px rgba(241, 87, 41, .22)
    }

    78% {
        opacity: .7;
        text-shadow: 0 0 5px rgba(241, 87, 41, .2)
    }

    86% {
        opacity: 1;
        text-shadow: 0 0 14px rgba(241, 87, 41, .45), 0 0 28px rgba(241, 87, 41, .24)
    }
}

.blink-text {
    animation: 2.2s infinite bulbFlicker;
    will-change: opacity, text-shadow
}

.swiper1 ul {
    display: flex;
    justify-content: space-between
}

.swiper1 li {
    width: 32%
}

#authentication .swiper1 li img {
    object-fit: contain
}

.mtitle {
    border-left: var(--vi-color) 11px solid;
    font-size: 17px !important;
    padding: 20px;
    background: #fff;
    margin-top: 1%
}

.head-language {
    position: fixed;
    top: 0;
    display: none;
    background: rgba(240, 242, 250, .8);
    padding: 1.5vw;
    width: 100%
}

.head-language .ys-cont1720 {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: flex-start;
    width: 100vw;
    padding: 0 5.2vw;
    max-width: 1920px;
    margin: auto
}

.head-language-nub {
    padding: 0 35px
}

.head-lang-top {
    line-height: 1.75;
    color: #181818;
    font-size: var(--font-size20);
    font-weight: 700;
    margin-bottom: 10px
}

.hlnc-item:last-child {
    margin-bottom: 0
}

.hlnc-item {
    margin-bottom: 6px
}

.hlnc-item,
.hlnc-item a {
    color: #666;
    line-height: 1.75;
    transition: .4s;
    font-size: var(--font-size18)
}

.prover {
    position: relative
}

.swibrr {
    position: relative;
    overflow: hidden;
    z-index: 1;
    display: block
}

.prover .swiper-button-next,
.prover .swiper-button-prev {
    width: 40px;
    height: 40px;
    margin-top: -11px;
    background-color: #f67f2f;
    border-radius: 50%;
    background-size: 15px 16px
}

.prover .swiper-button-next {
    right: -15px
}

.prover .swiper-button-prev {
    left: -15px
}

.quick-nav {
    margin: 0 0 20px;
    font-size: 24px;
    font-weight: 700;
    color: #000;
    text-align: left
}

.quick-nav-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px
}

.quick-nav-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 6px;
    color: #232323;
    font-size: 16px;
    text-align: center;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: .3s
}

.quick-nav-item:hover {
    background-color: #fb7d20;
    color: #fff;
    border-color: transparent;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, .15)
}

.new-manual-download-container {
    padding-top: 30px;
    padding-bottom: 30px
}

.new-manual-download-container .h2 {
    font-size: 24px;
    font-weight: 600;
    line-height: 28px
}

.new-manual-product-container {
    display: flex;
    padding: 16px;
    align-items: center;
    background-color: #fff;
    border: 2px solid #fff;
    border-radius: 12px
}

.new-container-image {
    flex: 0 0 35%;
    padding-right: 10px
}

.new-container-image img {
    width: 100%;
    height: auto
}

.new-container-message {
    margin-left: 10px;
    margin-right: 15px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: center;
    flex: 1
}

.new-product-title {
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    color: #2e2e2e;
    text-align: left;
    padding-left: 5px
}

.new-product-button-container {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 150px;
    overflow-y: auto;
    padding-right: 6px
}

.new-product-button svg {
    width: 20px;
    height: 20px;
    stroke: none;
    fill: none
}

.new-product-button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f4f6f8;
    border-radius: 45px;
    padding-left: 12px;
    padding-right: 12px;
    height: 32px
}

.new-product-button-title {
    white-space: nowrap;
    flex: 1;
    font-weight: 500;
    font-size: 13px;
    line-height: 18px;
    color: #2e2e2e
}

.manual-total-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto;
    grid-column-gap: 16px;
    grid-row-gap: 24px;
    margin: 20px 0
}

.close-video {
    width: 32px;
    height: 32px;
    border: 2px solid #fff;
    border-radius: 50%;
    position: absolute;
    top: -45px;
    right: 0;
    color: #fff;
    font-size: 20px;
    text-align: center;
    line-height: 26px;
    display: none;
    cursor: pointer;
    z-index: 1001
}

.new-video-popup {
    position: fixed;
    top: 0;
    width: 100vw;
    height: 100vh;
    left: 0;
    z-index: 1000;
    background-color: rgba(0, 0, 0, .6)
}

.new-video-popup .template-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90vw;
    max-width: 1000px;
    aspect-ratio: 16/9;
    padding: 0;
    background-color: #000
}

.new-video-popup .close-video {
    display: block
}

.new-video-popup .template-wrapper iframe {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border: none !important;
    display: block !important
}

@media (min-width:768px) and (max-width:1024px) {
    .manual-total-container {
        grid-template-columns: 1fr 1fr
    }
}

@media screen and (max-width:749px) {
    .quick-nav-grid {
        grid-template-columns: repeat(2, 1fr)
    }

    .manual-total-container {
        grid-template-columns: 1fr !important
    }

    .new-manual-product-container {
        flex-direction: column !important;
        padding: 24px 20px !important;
        align-items: center !important
    }

    .new-product-button {
        width: 100% !important;
        height: 44px !important;
        padding: 0 20px !important
    }

    .new-product-title {
        text-align: center !important;
        padding-left: 0 !important;
        margin-bottom: 16px !important;
        font-size: 18px !important
    }
}


.pad_cont{
    padding-top: 140px;
}