@import url("/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vc3R5bGUvYW5pbWF0ZS5taW4uY3Nz");

@keyframes ripple {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.1), 0 0 0 20px rgba(255, 255, 255, 0.1), 0 0 0 40px rgba(255, 255, 255, 0.1), 0 0 0 60px rgba(255, 255, 255, 0.1);
    }

    100% {
        box-shadow: 0 0 0 20px rgba(255, 255, 255, 0.1), 0 0 0 40px rgba(255, 255, 255, 0.1), 0 0 0 60px rgba(255, 255, 255, 0.1), 0 0 0 80px rgba(255, 255, 255, 0);
    }
}

::selection,
::-moz-selection,
::-webkit-selection {
    background: #1f1f1f;
    color: #fff;
}

html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    font-size: 16px;
    width: 100%;
}

*,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
a {
    margin: 0;
    padding: 0;
}

body,
div,
span,
ul,
li,
ol,
h1,
h2,
h3,
h4,
h5,
h6,
input,
textarea,
select,
p,
dl,
dt,
dd,
a,
img,
button,
form,
table,
th,
tr,
td,
tbody,
article,
span,
aside,
details,
figcaption,
figure,
footer,
header,
menu,
nav,
section {
    margin: 0;
    padding: 0;
    border: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    font-size: 0.16rem;
    font-weight: 400;
    line-height: 1.71428571429;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: "Poppins", "PingFang SC", "Microsoft YaHei", sans-serif;
    color: #232830;
    background-color: #ffffff;
}

:active,
:focus {
    outline: none !important;
}

select {
    max-width: 100%;
}

ul,
li {
    list-style-type: none;
}

blockquote {
    background: #fff;
    border: 1px solid #f8f8f8;
    border-left: 5px solid var(--bg-purple);
    padding: 0 1.75rem 1.25rem;
    margin-top: 1.421875rem;
    line-height: 2;
    font-size: 1rem;
}

blockquote::before {
    color: var(--bg-purple);
    content: open-quote;
    font-size: 5.25rem;
    line-height: 0.1;
    margin-right: 0.21875rem;
    vertical-align: -2.055rem;
    font-family: sans-serif;
    content: "\201C";
}

strong {
    font-weight: 600;
}

hr {
    margin: .2rem 0;
    border-color: #f4f4f4;
}

hr.black {
    border-color: rgba(255, 255, 255, 0.1);
}

img {
    max-width: 100%;
}

iframe {
    border: none !important;
}

table.table-normal,
.table-normal table {
    border: 1px solid black;
    border-collapse: collapse;
    width: 100%;
}

table.table-normal th,
.table-normal table th {
    text-align: left;
}

table.table-normal td,
table.table-normal th,
.table-normal table td,
.table-normal table th {
    border: 1px solid black;
    padding: 0.2rem;
}

a {
    color: #232830;
}

a:hover,
a:focus,
a:active {
    text-decoration: none;
    outline: none;
}

a.link {
    text-decoration: underline;
    color: var(--text-color-purple);
}

a.link:hover {
    color: var(--text-color-purple);
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    margin-top: 0;
    word-wrap: break-word;
}

.h1 {
    font-size: 3.375rem !important;
    line-height: 1.14285714286 !important;
}

.h2 {
    font-size: 22.375rem !important;
    line-height: 1.2 !important;
}

.h3 {
    font-size: 1.75rem !important;
    line-height: 1.25 !important;
}

.h4 {
    font-size: 1.25rem !important;
    line-height: 1.33333333333 !important;
}

.h5 {
    font-size: 1rem !important;
    line-height: 1.5 !important;
    font-weight: 600 !important;
}

.h6 {
    font-size: 0.75rem !important;
    line-height: 2 !important;
    font-weight: 600 !important;
}

.heading-space-none {
    margin: 0 !important;
    padding: 0 !important;
}

@media all and (max-width:768px) {
    h1 {
        font-size: 2.4107142857rem;
        line-height: 1.15555556;
    }

    h2 {
        font-size: 15.6625rem;
        line-height: 1.421875;
    }

    h3 {
        font-size: 1.25rem;
        line-height: 1.625;
    }

    .h1 {
        font-size: 2.4107142857rem !important;
        line-height: 1.15555556 !important;
    }

    .h2 {
        font-size: 15.6625rem !important;
        line-height: 1.421875 !important;
    }

    .h3 {
        font-size: 1.25rem !important;
        line-height: 1.625 !important;
    }
}

@media all and (max-width:480px) {
    h1 {
        font-size: 1.2053571429rem;
        line-height: 1.38461538462;
    }

    h2 {
        font-size: 13.425rem;
        line-height: 1.28571428571;
    }

    h3 {
        font-size: 1.25rem;
        line-height: 1.5;
    }

    .h1 {
        font-size: 1.2053571429rem !important;
        line-height: 1.38461538462 !important;
    }

    .h2 {
        font-size: 13.425rem !important;
        line-height: 1.28571428571 !important;
    }

    .h3 {
        font-size: 1.25rem !important;
        line-height: 1.5 !important;
    }
}

.font-normal {
    font-weight: 400 !important;
}

.font-uppercase {
    text-transform: uppercase !important;
}

.font-bold {
    font-weight: 800 !important;
}

.font-italic {
    font-style: italic !important;
}

.font-no-italic {
    font-style: normal !important;
}

.font-underline {
    text-decoration: underline !important;
}

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

.font-sub-color {
    color: #aeaeae !important;
}

.font-white {
    color: white;
}

.font-white p,
.font-white h1,
.font-white h2,
.font-white h3,
.font-white h4,
.font-white h5,
.font-white h6,
.font-white .h1,
.font-white .h2,
.font-white .h3,
.font-white .h4,
.font-white .h5,
.font-white .h6 {
    color: white;
}

html {
    font-size: 100px;
}

@media screen and (min-width:1921px) {
    html {
        font-size: 115px;
    }
}

@media screen and (min-width:2561px) {
    html {
        font-size: 150px;
    }
}

@media screen and (max-width:1600px) {
    html {
        font-size: 90px;
    }
}

@media screen and (max-width:1500px) {
    html {
        font-size: 85px;
    }
}

@media screen and (max-width:1440px) {
    html {
        font-size: 80px;
    }
}

@media screen and (max-width:1366px) {
    html {
        font-size: 75px;
    }
}

@media screen and (max-width:1280px) {
    html {
        font-size: 70px;
    }
}

@media screen and (max-width:1100px) {
    html {
        font-size: 60px;
    }
}

@media screen and (max-width:1024px) {
    html {
        font-size: 100px;
    }
}

@media screen and (max-width:1000px) and (orientation:landscape) {
    html {
        font-size: 55px;
    }
}

@media screen and (max-width:800px) {
    html {
        font-size: 70px;
    }
}

@media screen and (max-width:750px) {
    html {
        font-size: 100px;
    }
}

@media screen and (max-width:640px) {
    html {
        font-size: 85.33px;
    }
}

@media screen and (max-width:591px) {
    html {
        font-size: 78.8px;
    }
}

@media screen and (max-width:562px) {
    html {
        font-size: 74.933px;
    }
}

@media screen and (max-width:540px) {
    html {
        font-size: 72px;
    }
}

@media screen and (max-width:521px) {
    html {
        font-size: 69.4666px;
    }
}

@media screen and (max-width:428px) {
    html {
        font-size: 57.066px;
    }
}

@media screen and (max-width:414px) {
    html {
        font-size: 55.2px;
    }
}

@media screen and (max-width:412px) {
    html {
        font-size: 54.933px;
    }
}

@media screen and (max-width:375px) {
    html {
        font-size: 50px;
    }
}

@media screen and (max-width:360px) {
    html {
        font-size: 48px;
    }
}

@media screen and (max-width:320px) {
    html {
        font-size: 42.66px;
    }
}

select:focus,
textarea:focus,
input:focus,
button {
    outline: none;
}

input::-webkit-input-placeholder,
input::-moz-input-placeholder,
textarea::-webkit-textarea-placeholder,
textarea::-moz-textarea-placeholder {
    color: #999;
    transition: color 0.5s;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
    font: inherit;
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px transparent inset;
}

input {
    border: none;
    background-color: transparent;
    outline: none;
}

a {
    text-decoration: none;
}

body {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

a {
    transition: all 0.3s ease-in;
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    -ms-transition: all 0.3s ease-in;
}

a:focus,
input:focus,
p:focus,
div:focus {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

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

.ellipsis2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ellipsis3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ellipsis4 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ellipsis5 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ellipsis6 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ellipsis7 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 7;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ellipsis8 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 8;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ellipsis14 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 14;
    overflow: hidden;
    text-overflow: ellipsis;
}

.triangle {
    width: 0;
    height: 0;
    overflow: hidden;
    border-width: 10px;
    border-color: transparent transparent #fff transparent;
    border-style: dashed dashed solid dashed;
}

img[src=""],
img:not([src]) {
    opacity: 0;
    display: none;
}

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

.fl_l {
    float: left;
}

.fl_r {
    float: right;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

*,
*::after,
*::before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    height: auto;
    overflow-x: hidden;
}

:root {
    --bg-purple: rgba(37, 97, 145, 1);
    --bg-white: #fff;
    --bg-black: #000;
    --text-color-purple: rgba(37, 97, 145, 1);
    --text-color-white: #fff;
    --text-color-black: #000;
    --text-color-grey: #666;
    --text-color-999: #999;
}

@media screen and (orientation:landscape) {

    *::-webkit-scrollbar,
    *::-webkit-scrollbar {
        width: 4px;
        border-radius: 1.5px;
    }

    *::-webkit-scrollbar-button,
    *::-webkit-scrollbar-button {
        display: none;
    }

    *::-webkit-scrollbar-track,
    *::-webkit-scrollbar-track {
        background-color: #eee;
    }

    *::-webkit-scrollbar-thumb,
    *::-webkit-scrollbar-thumb {
        background-color: var(--bg-purple);
        border-radius: 4px;
    }

    *::-webkit-scrollbar:horizontal {
        height: 4px;
    }
}

@font-face {
    font-family: "OPPOSansB";
    src: url("/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vZm9udHMvT1BQT1NhbnMtQi50dGY");
}

@font-face {
    font-family: "PMZDBTT";
    src: url("/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vZm9udHMvUGFuZ01lblpoZW5nRGFvQmlhb1RpVGlNaWFuRmVpQmFuLTIudHRm");
}

@font-face {
    font-family: "Kingsoft_Cloud";
    src: url("/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vZm9udHMvS2luZ3NvZnRfQ2xvdWRfRm9udC50dGY");
}

@font-face {
    font-family: "HSSCB";
    src: url("/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vZm9udHMvSGFybW9ueU9TX1NhbnNfU0NfQm9sZC50dGY");
}

@font-face {
    font-family: "AlimamaShuHeiTiBold";
    src: url("/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vZm9udHMvQWxpbWFtYVNodUhlaVRpLUJvbGQudHRm");
}

@font-face {
    font-family: "Cinzel";
    src: url("/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vZm9udHMvQ2luemVsLUJvbGQub3Rm");
}

@font-face {
    font-family: "iconfont";
    src: url("/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vZm9udHMvaWNvbmZvbnQud29mZjI") format("woff2"), url("/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vZm9udHMvaWNvbmZvbnQud29mZg") format("woff"), url("/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vZm9udHMvaWNvbmZvbnQudHRm") format("truetype");
}

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

.container {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    max-width: 16rem;
}

@media (max-width:1659px) {
    .container {
        padding-left: 0.33rem;
        padding-right: 0.33rem;
        max-width: 16rem;
    }
}

@media (max-width:1259px) {
    .container {
        padding-left: 0.15rem;
        padding-right: 0.15rem;
        max-width: calc(100% - 0.3rem);
    }
}

@media (max-width:1024px) {
    .container {
        padding: 0 .3rem;
        max-width: inherit;
    }
}

.header {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 99;
    height: 100px;
    transition: 0.65s;
}

.header .header__nav__container {
    padding: 0 2%;
    max-width: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 2;
}

.header__logo {
    position: relative;
    width: 3.26rem;
    height: .5rem;
}

.header__logo a {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    height: 100%;
}

.header__logo a img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    width: 100%;
    height: 100%;
    transition: ease 0.5s;
}

.header__logo img:nth-child(1) {
    margin-right: .15rem;
}

.header__logo img:nth-child(2) {
    opacity: 1;
}

.header__lefts {
    align-items: center;
    display: flex;
    justify-content: flex-start;
}

.header__tel {
    align-items: center;
    font-size: .22rem;
    font-family: "HSSCB";
    padding: 0 0 0 1rem;
    color: #fff;
    line-height: 1;
}

.header__tel span {
    margin-right: .1rem;
    font-size: .2rem;
    line-height: 1;
    position: relative;
}

#header.header-sticky .header__tel {}

.menubtn {
    width: 80px;
    box-sizing: border-box;
    position: relative;
    z-index: 20;
    transition: 0.4s;
    cursor: pointer;
    display: none;
}

.menubtn span {
    border-radius: 4px;
    margin: auto;
    display: block;
    width: 20px;
    height: 2px;
    background: #fff;
    position: relative;
    vertical-align: middle;
    transition: 0.45s;
}

.menubtn span:after,
.menubtn span:before {
    content: "";
    border-radius: 4px;
    position: absolute;
    display: inline-block;
    width: 100%;
    height: 2px;
    left: 0;
    background-color: #fff;
    -webkit-transition-duration: 0.3s, 0.3s;
    -moz-transition-duration: 0.3s, 0.3s;
    -ms-transition-duration: 0.3s, 0.3s;
    -o-transition-duration: 0.3s, 0.3s;
    transition-duration: 0.3s, 0.3s;
    -webkit-transition-delay: 0.3s, 0s;
    -moz-transition-delay: 0.3s, 0s;
    -ms-transition-delay: 0.3s, 0s;
    -o-transition-delay: 0.3s, 0s;
    transition-delay: 0.3s, 0s;
    transition: background 0.3s 0s;
}

.menubtn span:before {
    top: -6px;
    -webkit-transition-property: top, transform;
    -moz-transition-property: top, transform;
    -ms-transition-property: top, transform;
    -o-transition-property: top, transform;
    transition-property: top, transform;
}

.menubtn span:after {
    left: auto;
    right: 0;
    bottom: -6px;
    -webkit-transition-property: bottom, transform;
    -moz-transition-property: bottom, transform;
    -ms-transition-property: bottom, transform;
    -o-transition-property: bottom, transform;
    transition-property: bottom, transform;
}

.menubtn.active span {
    transform: rotate(45deg);
}

.menubtn.active span::before {
    opacity: 0;
}

.menubtn.active span::after {
    transform: rotate(-90deg);
    bottom: 0;
}

.header:hover .menubtn span,
.header:hover .menubtn span::before,
.header:hover .menubtn span::after {}

.header.header-sticky .menubtn span {
    background-color: black;
}

.header.header-sticky .menubtn span::before,
.header.header-sticky .menubtn span::after {
    background-color: black;
}

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

.navs {
    align-items: center;
    display: flex;
    justify-content: flex-start;
}

.navs>li {
    position: relative;
    text-transform: capitalize;
}

.navs>li:first-child {}

.navs>li>a {
    padding: 0 .2rem;
    display: block;
    color: #fff;
    font-size: .18rem;
    line-height: 100px;
    transition: all .3s;
    position: relative;
    z-index: 4;
}

.navs>li>a:before {
    position: absolute;
    left: 50%;
    bottom: 0;
    content: "";
    height: 3px;
    background: #fff;
    transition: 0.4s;
    width: 0;
    margin-left: 0;
}

.navs>li:hover a,
.navs>li.active a {
    color: #fff;
}

.navs>li:hover a,
.navs>li.active a {
    font-weight: 700;
}

.navs>li:hover a::before,
.navs>li.active a::before {
    width: 32px;
    margin-left: -16px;
}

.navs>li:hover a::after,
.navs>li.active a::after {
    opacity: 1;
}

.navs>li>.submenu {
    position: absolute;
    top: 120px;
    left: 0;
    width: 100%;
    -moz-transition: ease 0.5s;
    -o-transition: ease 0.5s;
    -webkit-transition: ease 0.5s;
    transition: ease 0.5s;
    opacity: 0;
    visibility: hidden;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 3px 16px rgba(0, 0, 0, 0.1);
    z-index: 10;
}

.navs>li>.submenu a {
    font-size: 0.14rem;
    font-weight: normal;
    line-height: 0.4rem;
    text-align: center;
    position: relative;
    display: block;
    overflow: hidden;
    height: 0.4rem;
    padding: 0 10px;
    -moz-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    -webkit-transition: all 0.6s ease;
    transition: all 0.6s ease;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #333;
}

.navs>li>.submenu a:last-child {
    border-bottom: 0;
}

.navs>li>.pro-submenu {
    left: 50%;
    width: 200%;
    margin-left: -100%;
}

.navs>li>.submenu a:hover {
    color: #fff;
    background: var(--bg-purple);
}

.navs>li>.submenu a:hover:after {
    right: 15px;
    visibility: visible;
}

.navs>li:hover .submenu {
    top: 100px;
    opacity: 1;
    visibility: visible;
    z-index: 999;
}

#header.header-sticky {
    background-color: var(--bg-purple);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

#header.header-sticky .header__logo a img {
    opacity: 0;
}

#header.header-sticky .header__logo a img:nth-child(2) {
    opacity: 1;
}

#header.header-sticky .navs>li>a {}

#header.header-sticky .navs>li.active>a,
#header.header-sticky .navs>li:hover>a {}

#header.header-sticky .navs>li:hover a::before,
#header.header-sticky .navs>li.active a::before {}

@media (max-width:1659px) {
    .header .header__nav__container {
        padding-left: 0.33rem;
        padding-right: 0.33rem;
        margin: 0 auto;
    }

    .navs>li>a {
        padding: 0 .12rem;
    }
}

.m-nav {
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    transition: all ease 0.5s;
    -webkit-transition: all ease 0.5s;
    z-index: 0;
    opacity: 0;
    visibility: visible;
    margin-top: 0;
    overflow-y: auto;
    top: 0;
    transform: translateX(100%);
}

.m-nav a {
    outline: none;
}

.m-nav.active {
    opacity: 1;
    transform: translateX(0);
    z-index: 1000;
}

.m-nav .top {
    height: 60px;
    padding: 20px;
    box-sizing: border-box;
}

.m-nav .top .closed {
    width: 30px;
    height: 30px;
    vertical-align: middle;
    float: right;
    cursor: pointer;
}

.m-nav .logo {
    width: 100%;
    margin: 0 auto 30px;
    justify-content: center;
}

.m-nav .logo img {
    height: 30px;
    display: block;
}

.m-nav .logo img:nth-child(1) {
    margin-right: 15px;
    height: 40px;
}

.m-nav .ul {
    margin-top: 30px;
}

.m-nav .ul li {
    padding: 0 20px;
    border-bottom: 1px solid #f5f5f5;
    transform: translateY(0);
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
    opacity: 0;
}

.m-nav.active .ul li {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.m-nav .ul li:nth-child(1) {
    -webkit-transition: all 0.2s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
    transition: all 0.2s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
}

.m-nav .ul li:nth-child(2) {
    -webkit-transition: all 0.4s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
    transition: all 0.4s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
}

.m-nav .ul li:nth-child(3) {
    -webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
}

.m-nav .ul li:nth-child(4) {
    -webkit-transition: all 0.8s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
    transition: all 0.8s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
}

.m-nav .ul li:nth-child(5) {
    -webkit-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
    transition: all 1s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
}

.m-nav .ul li:nth-child(6) {
    -webkit-transition: all 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
    transition: all 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
}

.m-nav .ul li:nth-child(7) {
    -webkit-transition: all 1.4s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
    transition: all 1s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
}

.m-nav .ul li:nth-child(8) {
    -webkit-transition: all 1.6s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
    transition: all 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0ms;
}

.m-nav .ul li a {
    display: block;
    text-decoration: none;
    color: #333;
    font-size: 16px;
    height: 50px;
    line-height: 50px;
    width: 100%;
    position: relative;
}

.m-nav .ul li a.active {
    font-weight: 800;
    color: #1b2c43;
}

.m-nav .ul li.dropdown a.dropdown-title::before,
.m-nav .ul li.dropdown a.dropdown-title::after {
    content: "";
    position: absolute;
    width: 10px;
    height: 1px;
    background-color: rgba(51, 51, 51, 0.5);
    right: 10px;
    top: 50%;
    -webkit-transition: -webkit-transform 0.25s;
    transition: -webkit-transform 0.25s;
    -o-transition: transform 0.25s;
    transition: transform 0.25s;
    transition: transform 0.25s, -webkit-transform 0.25s;
}

.m-nav .ul li.dropdown a.dropdown-title::after {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.m-nav .ul li.dropdown a.dropdown-title.active::after {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.m-nav .ul li a i {
    font-size: 12px;
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
}

.m-nav .ul li .dropdown_menu {
    display: none;
}

.m-nav .ul li.dropdown.active .dropdown_menu {
    display: block;
}

.m-nav .ul li .dropdown_menu a {
    display: block;
    font-size: 14px;
    height: 40px;
    line-height: 40px;
    padding: 0 20px;
    box-sizing: border-box;
    border-bottom: 1px solid #f5f5f5;
}

.m-nav .ul li .dropdown_menu a:last-child {
    border: none;
}

.m-code-box img {
    display: block;
    width: 40%;
    margin: 0 auto;
}

.m-code-box p {
    font-size: .3rem;
    line-height: 2;
}

.m-nav-tel {
    text-align: center;
    margin-top: 18px;
    margin-bottom: 20px;
    font-size: 18px;
    color: #666;
}

.m-nav-tel a {
    font-weight: 800;
}

.m-nav-link {
    text-align: center;
    margin-top: 18px;
}

.m-nav-link a {
    display: inline-block;
    padding: 5px 25px;
    color: #fff;
    cursor: default;
    background: #00598e;
    font-size: 14px;
    line-height: 2;
}

#main {
    position: relative;
    z-index: 50;
}

.banner {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    position: relative;
}

.banner .swiper-slide {
    position: relative;
    height: 100%;
    overflow: hidden;
}

.banner .slide-inner {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-size: cover;
    background-position: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.banner .swiper-slide.swiper-slide-active .slide-inner {
    -webkit-animation: scaleBigToSmall 2s;
    animation: scaleBigToSmall 2s;
}

@-webkit-keyframes scaleBigToSmall {
    0% {
        opacity: 1;
        -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes scaleBigToSmall {
    0% {
        opacity: 1;
        -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

.scaleBigToSmall {
    -webkit-animation-name: scaleBigToSmall;
    animation-name: scaleBigToSmall;
    transform-origin: 50% 50%;
}

.swiper-banner .banner-prev,
.swiper-banner .banner-next {
    color: #fff;
    font-size: .15rem;
    width: 22px;
    height: .96rem;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    letter-spacing: 2px;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: absolute;
    left: .3rem;
    top: 50%;
    margin-top: -.48rem;
    cursor: pointer;
    z-index: 10;
}

.swiper-banner .banner-next {
    left: auto;
    right: .3rem;
}

.swiper-banner .banner-prev::before,
.swiper-banner .banner-next::before {
    background-color: #fff;
    content: "";
    width: 2px;
    height: 50px;
    position: absolute;
    left: 50%;
    top: 0;
    margin-left: -1px;
}

.swiper-banner .banner-prev::after,
.swiper-banner .banner-next::after {
    display: none;
}

.swiper-banner .banner-prev:hover,
.swiper-banner .banner-next:hover {
    color: rgba(12, 79, 132, 1);
}

.swiper-banner .banner-prev:hover::before,
.swiper-banner .banner-next:hover::before {
    background-color: rgba(12, 79, 132, 1);
}

.pagination-box {
    justify-content: flex-end;
    align-items: center;
    position: absolute;
    left: 50%;
    bottom: .5rem;
    transform: translateX(-50%);
    z-index: 2;
}

.pagination-box .swiper-pagination {
    width: auto;
    font-size: 0;
    position: absolute;
    left: auto;
    right: 0;
    bottom: auto;
}

.lb-num {
    color: rgba(255, 255, 255, 1);
    font-size: 0.15rem;
    line-height: 1;
    font-family: "YSHaoShenTi";
    z-index: 10;
}

.lb-num .on {
    color: #fff;
    font-size: 0.3rem;
}

.lb-num span {
    margin: 0 0.06rem;
}

@keyframes first {
    0% {
        transform: scaleX(0);
        left: 0px;
    }

    100% {
        transform: scaleX(1);
        left: 0px;
    }
}

@keyframes last {
    0% {
        transform: scaleX(0);
        left: 0px;
    }

    20% {
        transform: scaleX(0.5);
        left: 0px;
    }

    100% {
        transform: scaleX(1);
        left: 0px;
    }
}

@keyframes middle {
    0% {
        transform: scaleX(0);
        left: 0px;
    }

    20% {
        transform: scaleX(0.5);
        left: 0px;
    }

    100% {
        transform: scaleX(1);
        left: 0px;
    }
}

.banner-mouse {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    animation: linedown linear infinite 1.5s;
    -webkit-animation: linedown linear infinite 1.5s;
    -moz-animation: linedown linear infinite 1.5s;
    -ms-animation: linedown linear infinite 1.5s;
    -o-animation: linedown linear infinite 1.5s;
    cursor: pointer;
    z-index: 10;
}

.banner-mouse-line {
    margin-right: .1rem;
    background: url(/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vaW1hZ2VzL21vdXNlLnN2Zw) no-repeat center;
    background-size: contain;
    position: relative;
    width: 22px;
    height: 22px;
    overflow: hidden;
}

.banner-mouse-line::after {
    position: absolute;
    left: 50%;
    top: 5px;
    width: 2px;
    height: 5px;
    background: #fff;
    content: "";
    animation: FmovefadeInDown linear infinite 1.5s;
    -webkit-animation: FmovefadeInDown linear infinite 1.5s;
    -moz-animation: FmovefadeInDown linear infinite 1.5s;
    -ms-animation: FmovefadeInDown linear infinite 1.5s;
    -o-animation: FmovefadeInDown linear infinite 1.5s;
    margin-left: -1px;
    border-radius: 0;
}

.banner-mouse span {
    font-size: .14rem;
    color: #fff;
}

@keyframes FmovefadeInDown {
    0% {
        opacity: 1;
        transform: translate(0px, 0px);
    }

    35% {
        opacity: 0;
        transform: translate(0px, 50%);
    }

    65% {
        opacity: 0;
        transform: translate(0px, -50%);
    }

    100% {
        transform: translate(0px, 0px);
        opacity: 1;
    }
}

@-webkit-keyframes FmovefadeInDown {
    0% {
        opacity: 1;
        transform: translate(0px, 0px);
    }

    35% {
        opacity: 0;
        transform: translate(0px, 50%);
    }

    65% {
        opacity: 0;
        transform: translate(0px, -50%);
    }

    100% {
        transform: translate(0px, 0px);
        opacity: 1;
    }
}

@-moz-keyframes FmovefadeInDown {
    0% {
        opacity: 1;
        transform: translate(0px, 0px);
    }

    35% {
        opacity: 0;
        transform: translate(0px, 50%);
    }

    65% {
        opacity: 0;
        transform: translate(0px, -50%);
    }

    100% {
        transform: translate(0px, 0px);
        opacity: 1;
    }
}

@keyframes linedown {
    0% {
        bottom: 30px
    }

    50% {
        bottom: 15px
    }

    100% {
        bottom: 30px
    }
}

@-webkit-keyframes linedown {
    0% {
        bottom: 30px
    }

    50% {
        bottom: 15px
    }

    100% {
        bottom: 30px
    }
}

@-moz-keyframes linedown {
    0% {
        bottom: 30px
    }

    50% {
        bottom: 15px
    }

    100% {
        bottom: 30px
    }
}

.pub_title {
    font-size: .36rem;
    line-height: 2;
    font-weight: 800;
}

.pub_title_en {
    font-family: "Montserrat-Light";
    font-size: .52rem;
    line-height: 1.4;
    font-weight: 400;
    word-wrap: break-word;
}

.icon_btn {
    margin-top: .3rem;
    background-color: #fff;
    align-items: center;
    justify-content: center;
    padding: .1rem .15rem;
    max-width: 2rem;
    color: var(--text-color-blue);
    cursor: pointer;
}

.icon_btn:hover {
    background-color: var(--bg-purple);
    color: white;
}

.btn_text {
    font-size: .14rem;
    line-height: 2;
}

.icon_btn i {
    margin-left: .15rem;
    font-size: .12rem;
    line-height: 1;
}

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

*:before,
*:after {
    z-index: -1;
}

.box {
    padding: 5.2vw 0;
}

.sub-title {
    margin-bottom: .5rem;
}

.sub-title .en {
    display: inline-block;
    font-weight: 400;
    color: rgba(51, 51, 51, 1);
    font-size: .48rem;
    line-height: 1;
    font-family: "PMZDBTT";
    text-transform: capitalize;
    position: relative;
    z-index: 4;
}

.sub-title .en::before {
    content: "";
    display: block;
    width: 2.5vw;
    height: 2.5vw;
    background: linear-gradient(90deg, rgba(67, 181, 189, 1) 0%, rgba(200, 203, 227, 1) 100%);
    border-radius: 50%;
    position: absolute;
    left: -0.5vw;
    top: -0.5vw;
}

.sub-title .cn {
    font-size: 0.36rem;
    color: rgba(51, 51, 51, 1);
    font-weight: 600;
    line-height: 1.8;
    position: relative;
    z-index: 2;
}

.title .cn::before {
    content: "";
    width: .62rem;
    height: 2px;
    border-radius: 5px;
    background: rgba(24, 73, 149, 1);
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
}

.img-box {
    overflow: hidden;
}

.img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease-in;
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    -ms-transition: all 0.3s ease-in;
}

.img-box:hover img {
    transform: scale(1.1);
}

.more {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: relative;
    z-index: 2;
    overflow: hidden;
    transition: all 0.4s ease-in;
    -webkit-transition: all 0.4s ease-in;
    -moz-transition: all 0.4s ease-in;
    -o-transition: all 0.4s ease-in;
    -ms-transition: all 0.4s ease-in;
}

.more span {
    padding-bottom: .05rem;
    font-size: .18rem;
    border-bottom: 2px solid rgba(12, 79, 132, 1);
}

.more span i {
    margin-left: .2rem;
    font-size: .12rem;
    color: rgba(12, 79, 132, 1);
}

.image {
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
    left: 0;
    top: 0;
}

.loader::before {
    content: "";
    display: inline-block;
    width: 50px;
    position: absolute;
    left: 50%;
    top: 45%;
    margin-left: -25px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(farthest-side, rgba(67, 181, 189, 1) 94%, #0000) top/8px 8px no-repeat, conic-gradient(#0000 30%, rgba(67, 181, 189, 1));
    -webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 8px), #000 0);
    animation: l13 1s infinite linear;
    z-index: 0;
}

@keyframes l13 {
    100% {
        transform: rotate(1turn)
    }
}

.home-main section {
    width: 100%;
    height: auto;
    flex: 1;
    display: flex;
    position: relative;
    overflow: hidden;
    background-color: #000;
}

.b1_box {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
}

.home-main .about {
    width: 100%;
    position: relative;
}

.about .image {
    width: 100%;
}

.about .container {
    margin: 0 18.75vw 0 0;
    padding-bottom: 5vw;
    background: #fff;
    position: relative;
    align-items: stretch;
    z-index: 2;
}

.about-left {
    padding-top: 7vw;
    width: 28%;
    height: 100%;
    position: relative;
    align-items: stretch;
    z-index: 2;
}

.about-left .sub {
    width: 50%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.about-left .arrow {
    padding-bottom: 5.2vw;
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    text-transform: uppercase;
    text-align: right;
    color: rgba(214, 214, 214, 1);
    font-weight: 600;
    font-size: 48px;
    line-height: 1.2;
    border: 1px solid rgba(222, 222, 222, 1);
    border-left: none;
}

.about-left .arrow span {
    font-weight: 400;
}

.about-text {
    width: 72%;
    position: relative;
    padding: 5.85vw 6.4vw 0 3.85vw;
}

.about-text::before {
    content: "";
    background: rgba(222, 222, 222, 1);
    width: 1px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}

.about-text .top {
    margin-bottom: .5rem;
}

.about-text .top h4 {
    margin-bottom: .2rem;
    font-size: .18rem;
    color: rgba(51, 51, 51, 1);
}

.about-text .top .en {
    color: rgba(12, 79, 132, 1);
    font-size: .38rem;
    font-weight: 800;
    line-height: 1.12;
    text-transform: uppercase;
    font-family: 'Noto Sans CJK SC', 'Noto Sans CJK', 'Source Han Sans', source-han-sans-simplified-c, sans-serif;
}

.about-text {
    font-size: .16rem;
    line-height: 2;
}

.about-text .cont {
    margin-bottom: .3rem;
    -webkit-line-clamp: 12
}

.about-text .cont p {
    margin-bottom: .2rem;
    font-size: .2rem;
    font-weight: normal;
    color: rgba(102, 102, 102, 1);
    text-indent: 2em;
    text-align: justify;
}

.about-num {
    margin-top: .56rem;
    width: 100%;
    justify-content: flex-start;
}

.about-num .item {
    width: 33.33%;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.about-num .item label {
    align-items: flex-start;
}

.about-num .item i {
    font-size: .4rem;
    font-family: "PMZDBTT";
    font-style: normal;
    line-height: 1;
}

.about-num .item span {
    margin-left: .1rem;
    font-size: .14rem;
    font-weight: normal;
    line-height: 2;
    color: rgba(102, 102, 102, 1);
}

.about-num .item p {
    margin-top: .15rem;
    padding-top: .1rem;
    font-size: .18rem;
    color: rgba(153, 153, 153, 1);
    line-height: 2;
    position: relative;
}

.about-num .item p::after {
    content: "";
    width: .1rem;
    height: 2px;
    background-color: rgba(204, 204, 204, 1);
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
}

.about-num .item+.item {
    border-left: 1px solid rgba(255, 255, 255, .6);
}

.about-scroll {
    display: flex;
    align-items: center;
    justify-content: center;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    text-transform: uppercase;
    text-align: right;
    color: rgba(12, 79, 132, 1);
    font-size: .16rem;
    line-height: 1.2;
    width: 9.9vw;
    height: 4.8rem;
    border: 1px solid rgba(12, 79, 132, 1);
    position: absolute;
    right: 0;
    bottom: 0;
}

.about-scroll span {
    margin-top: .4rem;
    letter-spacing: 5px;
}

.about-scroll i {
    font-size: .2rem;
    transform: rotate(-90deg);
}

.boxFluid {
    width: 80%;
    margin-left: 8.33333vw;
    position: relative;
}

.process {}

.process-box {}

.box-top {
    justify-content: center;
}

.box-top .title {
    text-align: left;
}

.title h4 {
    font-size: .18rem;
    color: rgba(0, 0, 0, 1);
    font-weight: 800;
    line-height: 2;
    text-align: center;
}

.title .en {
    margin-bottom: .5rem;
    padding-bottom: .2rem;
    font-size: .48rem;
    font-weight: 700;
    color: rgba(37, 97, 145, 1);
    line-height: 1.2;
    text-transform: uppercase;
    position: relative;
}

.title .en::after {
    content: "";
    width: .45rem;
    height: 6px;
    background-color: rgba(0, 0, 0, 1);
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
}

.process-text {
    margin-bottom: .3rem;
    font-size: .18rem;
    line-height: 2.4;
    color: rgba(102, 102, 102, 1);
}

.process-list {
    padding-bottom: .5rem;
    height: 3.6rem;
    position: relative;
}

.process-list::after {
    content: "";
    width: 100%;
    height: 1px;
    background-color: rgba(12, 79, 132, 0.4);
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;
}

.swiper-process {
    margin-left: 18vw;
    overflow: visible;
}

.process-list .swiper-wrapper {
    align-items: flex-end;
}

.process-list .swiper-slide {
    padding: .2rem .4rem .3rem;
    border-radius: .15rem;
    background-color: rgba(12, 79, 132, 0.9);
}

.process-list .swiper-slide::before,
.process-list .swiper-slide::after {
    content: "";
    border-radius: 100%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.process-list .swiper-slide::before {
    width: .32rem;
    height: .32rem;
    background-color: rgba(12, 79, 132, .24);
    bottom: -.66rem;
}

.process-list .swiper-slide::after {
    width: .18rem;
    height: .18rem;
    background-color: rgba(12, 79, 132, 1);
    bottom: -.59rem;
}

.process-list .swiper-slide:nth-child(8) p {
    font-size: .09rem;
    line-height: 2.8;
}

.process-list .swiper-slide .cont {
    align-items: flex-end;
    justify-content: space-between;
}

.process-list .swiper-slide i {
    margin-bottom: .15rem;
    width: .7rem;
    height: .7rem;
    font-size: .56rem;
    color: #fff;
    line-height: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: ease 1s;
}

.process-list .swiper-slide h4 {
    color: rgba(255, 255, 255, 1);
    font-size: .2rem;
    font-weight: 600;
    line-height: 2;
}

.process-list .swiper-slide p {
    font-size: .15rem;
    color: rgba(152, 198, 235, 1);
    text-transform: uppercase;
}

.process-list .swiper-slide span {
    font-family: "Barlow";
    font-size: .48rem;
    font-weight: 800;
    color: rgba(216, 229, 240, 1);
    line-height: 1;
}

.process-list .swiper-slide.swiper-slide-active i {
    width: 100%;
    height: 1.8rem;
    font-size: .72rem;
}

.home-main section.news {
    padding-top: 8.3vw;
    position: relative;
    background-color: #fff;
}

.swiper-news {
    margin: .2rem .4rem 0;
}

.swiper-news .swiper-wrapper {
    align-items: stretch;
}

.news-item {
    padding: 3vw 2.3vw;
    background-color: rgba(241, 241, 241, 1);
    transition: ease 1s;
}

.news-item::after {
    content: "";
    width: 1.3rem;
    height: 1.9rem;
    background: url(/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vaW1hZ2VzL2ljby1sb2dvLndlYnA) no-repeat right bottom;
    background-size: contain;
    position: absolute;
    right: 0;
    bottom: 0;
    transition: ease 1s;
    opacity: 0;
}

.news-item h3 {
    min-height: .68rem;
    font-size: .2rem;
    font-weight: bold;
    margin-bottom: .2rem;
    transition: ease .5s;
}

.news-item .desc {
    font-size: .16rem;
    font-weight: 400;
    color: rgba(153, 153, 153, 1);
    line-height: 2;
    margin-bottom: 1rem;
    transition: ease .5s;
}

.news-item span {
    font-weight: 800;
    transition: ease .5s;
}

.news-item:hover h3 {
    color: var(--text-color-purple);
}

.news-item:hover {
    background-color: rgba(12, 79, 132, 1);
}

.news-item:hover h3 {
    color: #fff;
}

.news-item:hover .desc {
    color: rgba(227, 227, 227, 1);
}

.news-item:hover span {
    color: #fff;
}

.news-item:hover::after {
    opacity: 1;
}

.swiper-btn {
    width: 1.2rem;
    height: 1.2rem;
    background-color: rgba(12, 79, 132, 1);
    border-radius: 100%;
    justify-content: center;
    position: absolute;
    right: 21vw;
    top: 7.5vw;
    z-index: 3;
}

.swiper-btn .btn {
    margin: 0 .06rem;
    display: flex;
    justify-content: center;
    width: .27rem;
    font-size: .2rem;
    line-height: 1;
    color: #fff;
    outline: none;
    cursor: pointer;
    transition: ease 1s;
}

.ad {
    background-color: #fff;
    position: relative;
    z-index: 2;
}

.ad img {
    margin-top: -1.2rem;
    display: block;
    width: 100%;
}

.solution .b1_box {
    justify-content: space-between;
    align-items: stretch;
}

.sol-left {
    width: 55%;
    padding-left: 8.33vw;
    padding-right: 4.68vw;
}

.sol-left .top h4 {
    margin-bottom: .1rem;
    font-size: .36rem;
    font-weight: 800;
    color: rgba(51, 51, 51, 1);
}

.sol-left .top p {
    font-size: .18rem;
    line-height: 1.8;
    color: rgba(102, 102, 102, 1);
}

.form_box {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-top: .25rem;
}

.form_box input,
.form_box select,
.form_box textarea {
    transition: ease .5s
}

.form_box .fb_input {
    box-sizing: border-box;
    border: 1px solid rgba(230, 230, 230, 1);
    height: 40px;
    width: 100%;
    outline: 0;
    margin-right: 2%;
    text-indent: 10px;
}

.form_box .fb_input:nth-child(3n) {
    margin-right: 0
}

.form_box .fb_textarea {
    width: 100%;
    height: 100px;
    padding: 15px 10px;
    outline: 0;
    border: 1px solid #eee;
    box-sizing: border-box;
    resize: none;
    border-color: rgba(230, 230, 230, 1);
    background: transparent;
}

.form_box .fb_textarea::placeholder {
    font-family: Arial, "Microsoft YaHei", "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", sans-serif;
}

.form_div {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    position: relative;
    z-index: 6
}

.input {
    width: 100%
}

.form_div .input {
    width: 49%;
    margin-bottom: 15px;
    transition: ease .5s;
    position: relative
}

.form_notice {
    margin: .2rem 0 .1rem;
}

.submit_div {
    width: 100%;
}

.form_submit {
    width: 1.8rem;
    height: 50px;
    background: var(--bg-purple);
    color: #fff;
    line-height: 50px;
    text-align: center;
    margin: .2rem 0 0;
    -webkit-border-radius: 50px;
    border-radius: 50px;
    font-size: 16px;
    cursor: pointer;
    position: relative;
    z-index: 5;
    border: none;
    display: block
}

.sol-right {
    padding: 3vw 4.5vw;
    width: 45%;
    color: #fff;
    position: relative;
    z-index: 1;
}

.sol-contact .contact-top {
    margin-bottom: 1rem;
    padding-top: .1rem;
    position: relative;
    z-index: 2;
}

.sol-contact .contact-top::before {
    content: "";
    width: .45rem;
    height: .05rem;
    background-color: #fff;
    position: absolute;
    left: 0;
    top: 0;
}

.sol-contact .contact-top h2 {
    font-size: .58rem;
    text-transform: uppercase;
}

.sol-contact .contact-tel {
    position: relative;
    z-index: 2;
}

.sol-contact .contact-tel span {
    font-weight: 600;
}

.sol-contact .contact-tel p {
    font-size: .46rem;
    font-weight: 600;
}

.sol-contact::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url(/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vaW1hZ2VzL3NvbC1pbWcud2VicA) no-repeat center;
    background-size: cover;
    z-index: 0;
}

.sol-contact::after {
    content: "";
    width: 100%;
    height: 100%;
    background-color: rgba(12, 79, 132, 0.3);
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}

#footer {
    background-color: var(--bg-purple);
    position: relative;
}

#footer::after {
    content: "";
    width: 2.87rem;
    height: 2.62rem;
    background: url(/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vaW1hZ2VzL2Zsb2dvLWJnLndlYnA) no-repeat right bottom;
    background-size: contain;
    position: absolute;
    right: 0;
    bottom: 0;
    transition: ease 1s;
    z-index: 1;
    opacity: 1;
}

.bottom-top {
    padding-top: .3rem;
    padding-bottom: .3rem;
    justify-content: space-between;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

.bottom-logo {}

.bottom-logo img {
    height: 3vw;
}

.bottom-contact {
    margin-top: .2rem;
    font-size: .16rem;
    color: #fff;
    line-height: 2.4;
}

.code-box {
    padding: .15rem;
    width: 8.32vw;
    background-color: rgba(20, 86, 140, 1);
    border-top: 1px solid rgba(255, 255, 255, 0.5);
}

.code-box img {
    width: 100%;
    max-width: 100%;
}

.code-box p {
    font-size: .14rem;
    color: #fff;
    line-height: 2;
}

.footer-copy {
    padding: .15rem 0;
    color: #fff;
    font-size: 0.14rem;
    justify-content: space-between;
}

.footer-copy .container {
    justify-content: space-between;
}

.footer-copy a {
    padding-left: .1rem;
}

.footer-copy br {
    display: none;
}

.footer-copy a {
    color: #fff;
}

.fixed_case {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    z-index: 4;
    width: .62rem;
    transition: all 0.5s cubic-bezier(0.25, 0.74, 0.22, 0.99);
}

.fixed_case .fixed_btn {
    padding: .2rem 0;
    display: block;
    position: relative;
    font-size: .12rem;
    background-color: rgba(6, 46, 95, 1);
    cursor: pointer;
}

.fixed_case .fixed_btn .iconfont {
    line-height: 1;
    text-align: center;
    padding-top: .1rem;
    color: #fff;
    font-size: .2rem;
}

.fixed_case .fixed_btn .fixed_n {
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    letter-spacing: 4px;
    font-size: .14rem;
    font-weight: 700;
    color: #fff;
    -webkit-writing-mode: vertical-lr;
    -ms-writing-mode: tb-lr;
    writing-mode: vertical-lr;
    line-height: 1;
    transition: opacity 0.5s cubic-bezier(0.25, 0.74, 0.22, 0.99);
}

.fixed_case .message_btn {
    background-color: rgba(15, 81, 139, 1);
}

.fixed_case .message_btn .fixed_n {}

.online-box {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    visibility: hidden;
    opacity: 0;
    z-index: 100;
    -webkit-transition: all .5s;
}

.online-box::before {
    content: "";
    position: absolute;
    right: -200px;
    top: -200px;
    width: 400px;
    height: 400px;
    background-color: rgba(0, 0, 0, .6);
    -webkit-transform: scale(0);
    transform: scale(0);
    border-radius: 50%;
    z-index: 1;
}

.online-box.open {
    opacity: 1;
    visibility: visible;
}

.online-box.open::before {
    transform: scale(14);
}

.online-box .booking-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: .84rem;
    height: .84rem;
    cursor: pointer;
    text-align: center;
    position: absolute;
    overflow: hidden;
    right: 0%;
    bottom: 0%;
    visibility: visible;
    opacity: 1;
    background-color: #fff;
    border-radius: 50%;
    -webkit-transition: all 0.5s cubic-bezier(0.86, 0, 0.07, 1) .5s;
}

.online-box .online-cont {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    text-align: center;
    position: absolute;
    right: 0%;
    top: 0%;
    -webkit-transition: all 1s cubic-bezier(0.86, 0, 0.07, 1);
    opacity: 0;
    visibility: hidden;
    z-index: 2;
}

.online-box .online-cont .mod-inner {
    width: 100%;
}

.online-box.open .close:hover {
    -webkit-transition: all 0.35s cubic-bezier(0.86, 0, 0.07, 1);
    -webkit-transform: rotate(90deg);
}

.online-box.open .online-cont {
    width: 50%;
    height: 100%;
    opacity: 1;
    visibility: visible;
}

.online-box.open .booking-btn {
    opacity: 0;
    visibility: hidden;
    -webkit-transform: scale(0.8);
}

.online-box .booking-btn i,
.online-box .booking-btn p {
    position: relative;
    z-index: 5;
    display: block;
}

.online-box .booking-btn i {
    font-size: .24rem;
    line-height: 1;
    margin-bottom: 2px;
    -webkit-animation: rotateIn2 2s ease infinite;
}

@-webkit-keyframes rotateIn2 {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    10%,
    20% {
        -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
        transform: scale3d(.9, .9, .9) rotate(-3deg)
    }

    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
    }

    40%,
    60%,
    80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.online-box .booking-btn p {
    font-size: .12rem;
}

.booking-name {
    padding: 0 8% .5rem;
    width: 100%;
    font-size: .14rem;
    line-height: 1.7;
    opacity: 0;
    visibility: hidden;
    margin-top: .2rem;
}

.booking-name b {
    display: block;
    font-size: .32rem;
    line-height: 2;
    color: #333;
    font-family: "AlimamaShuHeiTiBold";
}

.booking-form {
    width: 100%;
    padding: 0px 8%;
    opacity: 0;
    visibility: hidden;
    margin-top: .2rem;
}

.booking-div {
    justify-content: space-between;
}

.booking-label {
    position: relative;
    width: 45%;
    margin-bottom: .35rem;
}

.booking-all {
    width: 100%;
}

.Message-booking {
    width: 100%;
}

.booking-label span {
    width: auto;
    height: auto;
    line-height: .6rem;
    font-size: .12rem;
    color: #333;
    font-weight: 600;
    position: absolute;
    left: 0%;
    bottom: 0%;
    font-size: .14rem;
    -webkit-transition: all .35s;
}

.Message-booking span {
    width: auto;
    height: auto;
    line-height: .45rem;
    font-size: .12rem;
    position: absolute;
    left: 0%;
    bottom: 0%;
    font-size: .14rem;
    -webkit-transition: all .35s;
}

.booking-form input {
    border: none;
    width: 100%;
    height: .6rem;
    line-height: .6rem;
    background-color: transparent;
    border-bottom: 1px solid rgba(136, 136, 136, 1);
    outline: none;
    color: rgba(102, 102, 102, 1);
    text-indent: 0px;
    position: relative;
    font-size: .14rem;
}

.booking-label::after {
    width: 0%;
    height: 1px;
    position: absolute;
    left: 0%;
    bottom: 0%;
    content: '';
    background-color: rgba(102, 102, 102, 1);
    -webkit-transition: all .35s;
}

.booking-label.focus::after {
    width: 100%;
    height: 2px;
    background-color: var(--bg-purple);
    z-index: 2;
}

.booking-label.focus span {
    bottom: .25rem;
    font-size: .12rem;
    opacity: .5;
}

.booking-form input::-webkit-input-placeholder,
.booking-form textarea::-webkit-input-placeholder {
    color: rgba(255, 255, 255, .7);
}

.booking-textarea {
    display: block;
    border: none;
    width: 100%;
    height: .9rem;
    background-color: transparent;
    border-bottom: 1px solid rgba(136, 136, 136, 1);
    outline: none;
    color: rgba(102, 102, 102, 1);
    text-indent: 0px;
    position: relative;
    font-size: .14rem;
    resize: none;
}

.Message-booking.focus span {
    bottom: .75rem;
}

.key-label #canvas {
    border: 1px solid rgba(222, 222, 222, 1);
}

.key-label #keyBtn {
    margin-left: .18rem;
    cursor: pointer;
    color: rgba(153, 153, 153, 1);
    font-weight: normal;
    text-decoration: underline;
}

.booking-submit {
    margin-top: .2rem;
    font-weight: bold;
    font-size: .16rem;
    position: relative;
}

.booking-submit .submit-btn {
    margin: 0px auto;
    padding: .12rem .54rem;
    display: inline-block;
    border-radius: .36rem;
    line-height: 2;
    text-align: center;
    background-color: #fff;
    border: 1px solid rgba(102, 102, 102, 1);
    border-radius: .3rem;
    cursor: pointer;
    position: relative;
    background: transparent;
    transition: all .3s;
    overflow: hidden;
}

.booking-submit .submit-btn::before {
    content: '';
    position: absolute;
    display: block;
    top: -1px;
    left: -1px;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    background: var(--bg-purple);
    border-radius: 50% 50% 0 0;
    transform: translateY(100%) scaleY(0.5);
    transition: all 0.6s ease;
    z-index: -1;
}

.booking-submit .submit-btn span {
    padding-left: .2rem;
    display: inline-block;
    color: var(--text-color-purple);
    position: relative;
    z-index: 2;
}

.booking-submit .submit-btn span::before {
    content: "";
    width: 9px;
    height: 9px;
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    background-color: #333;
    border-radius: 50%;
    transform: translateY(-50%);
    -webkit-transition: all .3s;
    transition: all .3s;
    z-index: 1;
}

.booking-submit .submit-btn:hover {
    border-color: var(--bg-purple);
}

.booking-submit .submit-btn:hover::before {
    border-radius: 0;
    transform: translateY(0) scaleY(1);
    transition-delay: 0s;
}

.booking-submit .submit-btn:hover span {
    color: #fff;
}

.booking-submit .submit-btn:hover span::before {
    background-color: #fff;
}

.online-box .close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: .45rem;
    height: .45rem;
    position: absolute;
    right: 8%;
    top: .22rem;
    line-height: .45rem;
    text-align: center;
    cursor: pointer;
    -webkit-transition: all .35s;
    color: var(--text-color-purple);
    opacity: 1;
    visibility: visible;
}

.online-box .close i {
    padding-top: 0;
    font-size: .36rem;
    color: rgba(102, 102, 102, 1);
}

.online-box.open .booking-name {
    -webkit-transition: all 600ms cubic-bezier(0.23, 1, 0.32, 1) 1.1s;
    opacity: 1;
    visibility: visible;
    margin-top: 0px;
}

.online-box.open .booking-form {
    -webkit-transition: all 600ms cubic-bezier(0.23, 1, 0.32, 1) 1.2s;
    opacity: 1;
    visibility: visible;
    margin-top: 0px;
}

.online-box.open .booking-submit {
    -webkit-transition: all 600ms cubic-bezier(0.23, 1, 0.32, 1) 1.3s;
    opacity: 1;
    visibility: visible;
    margin-top: 0px;
}

.online-box.open .close {
    -webkit-transition: all 600ms cubic-bezier(0.23, 1, 0.32, 1) 1s;
    opacity: 1;
    visibility: visible;
}

.subbanner {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.subbanner::before {
    content: "";
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(12, 79, 132, 0.6) 0%, rgba(12, 79, 132, 0) 100%);
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}

.subbanner .img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: relative;
    z-index: 0;
}

.subbanner .container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    color: #fff;
    position: absolute;
    left: 50%;
    top: calc(50% + .5rem);
    transform: translate(-50%, -50%);
    z-index: 2;
}

.subbanner .container h2 {
    font-size: .42rem;
    font-weight: 800;
    color: #fff;
}

.subbanner .container p {
    font-size: .16rem;
}

.page-path {
    padding: .15rem 0;
    background-color: rgba(248, 248, 248, 1);
    border-bottom: 1px solid #f2f2f2;
    font-size: 0.14rem;
    color: rgba(102, 102, 102, 1);
    display: flex;
    align-items: center;
    line-height: 1;
    position: relative;
    z-index: 2;
}

.page-path .container {
    align-items: center;
    justify-content: flex-start;
    position: relative;
}

.page-path a {
    color: rgba(102, 102, 102, 1);
}

.page-path a:first-child {
    display: inline-block;
    position: relative;
}

.page-path .container::before {
    content: "";
    margin-right: .1rem;
    background: url(/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vaW1hZ2VzL2ljby1ob21lLndlYnA) no-repeat center;
    background-size: contain;
    display: inline-block;
    width: .16rem;
    height: .16rem;
}

.page-name {
    padding: .18rem .2rem;
    flex-direction: column;
    justify-content: center;
    background: linear-gradient(90deg, rgba(18, 82, 170, 1) 0%, rgba(0, 54, 115, 1) 100%);
}

.pub-nav {
    height: .78rem;
}

.pub-nav li {
    padding: 0 .2rem;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center;
    position: relative;
}

.pub-nav li a {
    font-size: 0.18rem;
    color: rgba(102, 102, 102, 1);
    position: relative;
    word-break: keep-all;
}

.pub-nav li a::before {
    content: "";
    width: 0%;
    height: 1px;
    background-color: var(--bg-purple);
    transition: 0.4s;
    position: absolute;
    left: 50%;
    bottom: -3px;
    transform: translateX(-50%);
}

.pub-nav li:first-child {
    padding-left: 0;
}

.pub-nav li+li::before {
    content: "";
    width: 1px;
    height: 30%;
    background-color: rgba(255, 255, 255, .8);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.pub-nav li.active,
.pub-nav li:hover {}

.pub-nav li.active a::before,
.pub-nav li:hover a::before {
    width: 30%;
}

.pub-nav li.active a,
.pub-nav li:hover a {
    font-weight: 800;
    color: var(--text-color-purple);
}

.page-about {}

.page-about .container {
    align-items: stretch;
    justify-content: space-between;
}

.page-about .about-pic {
    padding-top: .5rem;
    width: 36.66%;
    position: relative;
}

.page-about .about-pic img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.page-about .about-pic::before {
    content: "";
    width: 100%;
    height: calc(100% - .5rem);
    background-color: rgba(227, 242, 255, 1);
    position: absolute;
    left: .5rem;
    top: 0;
}

.page-about .about-right {
    width: 54%;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
}

.page-about-top {
    width: 100%;
}

.about-title h3 {
    color: rgba(51, 51, 51, 1);
    font-size: .28rem;
    line-height: 1.8;
    font-weight: 800;
}

.about-title p {
    margin-bottom: .3rem;
    font-size: .28rem;
    line-height: 1;
    font-family: "Cinzel";
    color: rgba(12, 79, 132, 0.3);
}

.about-cont {
    padding-right: .3rem;
    max-height: 5.8rem;
    overflow-y: scroll;
}

.about-cont::-webkit-scrollbar,
.about-cont::-webkit-scrollbar {
    display: none;
}

.about-cont p {
    margin-bottom: .2rem;
    font-size: .16rem;
    line-height: 2;
    font-weight: normal;
    color: rgba(102, 102, 102, 1);
    text-align: justify;
}

.page-about .about-right .about-num .item i {
    color: var(--text-color-purple);
}

.page-about-honor {
    background-color: rgba(235, 236, 237, 1);
}

.page-honor-list {
    flex-wrap: wrap;
    align-items: stretch;
}

.page-honor-list .honor-item {
    margin-right: .2rem;
    margin-bottom: .2rem;
    display: block;
    padding: .2rem;
    width: calc((100% - .6rem)/4);
    background-color: #fff;
}

.honor-list .honor-item .honor-pic {
    height: 2.3rem;
}

.honor-list .honor-item .honor-pic img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.page-honor-list .honor-item h4 {
    margin-top: .15rem;
    max-height: .56rem;
    text-align: center;
    font-size: .18rem;
    line-height: 1.6;
}

.page-honor-list .honor-item:nth-child(4n) {
    margin-right: 0;
}

.page-history {
    padding: .7rem 0;
    position: relative;
}

.swiper-history .swiper-slide .img {
    position: relative;
    overflow: hidden;
}

.swiper-history .swiper-slide .pic {
    width: 100%;
    opacity: 0;
}

.swiper-history .swiper-slide .img img.lazy {
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.swiper-history .swiper-slide h4 {
    margin-top: .15rem;
    font-size: .26rem;
    font-weight: bold;
    color: var(--text-color-purple);
    line-height: 2;
}

.swiper-history .swiper-slide .desc {
    font-size: .16rem;
    line-height: 1.7;
    white-space: pre-line;
}

.swiper-history-button {
    margin-top: .3rem;
    position: relative;
    justify-content: center;
    align-items: center;
}

.swiper-history-button span {
    margin: .08rem;
    background-color: #fff;
    border-radius: 100%;
    width: .45rem;
    height: .45rem;
    color: var(--text-color-purple);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, .1);
    position: relative;
    left: auto;
    top: auto;
    right: auto;
}

.swiper-history-button .swiper-button-next:after,
.swiper-history-button .swiper-button-prev:after {
    font-size: .16rem;
}

.page-honor {
    padding-top: .7rem;
    padding-bottom: .7rem;
    background: #e4e9ed;
}

.hon_tab_nav_box {
    float: left;
    width: 15%;
}

.hon_tab_nav_box>div {
    max-width: 130px;
    color: #d5dae0;
    transition: all .5s ease-out;
    padding-bottom: .5rem;
    cursor: pointer;
}

.hon_tab_nav_box>div:last-child {
    padding-bottom: 0;
}

.hon_tab_num {
    font-size: 40px;
    line-height: 1;
}

.hon_tab_name {
    line-height: 56px;
    font-size: 16px;
    font-weight: 700;
    color: #72787f;
    transition: all .5s ease-out;
    position: relative;
}

.hon_tab_name::after {
    content: '';
    position: absolute;
    width: 0;
    height: 5px;
    background-color: var(--bg-purple);
    left: 0;
    bottom: 0;
    transition: all .5s ease-out;
}

.hon_tab_nav_box>div.on,
.hon_tab_nav_box>div:hover {
    color: var(--text-color-purple);
}

.hon_tab_nav_box>div.on .hon_tab_name,
.hon_tab_nav_box>div:hover .hon_tab_name {
    color: var(--text-color-purple);
}

.hon_tab_nav_box>div:hover .hon_tab_name::after,
.hon_tab_nav_box>div.on .hon_tab_name::after {
    width: 100%;
}

.hon_con_case {
    float: right;
    width: 83.33%;
    position: relative;
}

.hon_con_case>div {
    display: none;
    position: relative;
}

.hon_con_case>div:first-child {
    display: block;
}

.hon_con_box {
    float: left;
    width: 60%;
    padding-right: 10%;
    padding-left: 10%;
    overflow: hidden;
    position: relative;
    margin-top: 8px;
}

.hon_con_box .swiper-container {
    overflow: initial;
    padding-bottom: 120px;
}

.sha_tra {
    position: absolute;
    width: 100%;
    height: 100%;
    background: -moz-linear-gradient(left, rgba(228, 233, 237, 1) 0%, rgba(228, 233, 237, 0) 25%, rgba(228, 233, 237, 0) 75%, rgba(228, 233, 237, 1) 100%);
    background: -o-linear-gradient(left, rgba(228, 233, 237, 1) 0%, rgba(228, 233, 237, 0) 25%, rgba(228, 233, 237, 0) 75%, rgba(228, 233, 237, 1) 100%);
    background: -webkit-gradient(linear, right top, right bottom, color-stop(0, rgba(228, 233, 237, 1)), color-stop(0.25, rgba(228, 233, 237, 0)), color-stop(0.75, rgba(228, 233, 237, 0)), color-stop(1, rgba(228, 233, 237, 1)));
    background: -webkit-linear-gradient(left, rgba(228, 233, 237, 1) 0%, rgba(228, 233, 237, 0) 25%, rgba(228, 233, 237, 0) 75%, rgba(228, 233, 237, 1) 100%);
    z-index: 3;
    top: 0;
    left: 0;
    pointer-events: none;
}

.hon_con_box .swiper-slide {
    opacity: 0.9;
    transition: all .5s ease-in;
}

.hon_con_box .swiper-slide.active {
    opacity: 1;
}

.hon_con_box .swiper-slide>div {
    width: 100%;
    position: relative;
}

.hon_con_box .swiper-slide>div>img {
    display: block;
    max-width: 435px;
    max-height: 405px;
    margin: 0 auto;
}

.hon_name {
    text-align: center;
    margin-top: 25px;
    font-weight: 700;
    color: #000;
    font-size: .2rem;
    line-height: 1.5;
    opacity: 0;
    transition: all .5s ease-in;
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
}

.hon_con_box .swiper-slide.active .hon_name {
    opacity: 1;
}

.hon_name_box {
    width: calc(29.23% + 50px);
    float: right;
    padding: 25px 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}

.hon_name_text {
    font-size: 16px;
    line-height: 60px;
    height: 60px;
    padding: 0 10px;
    text-align: center;
    color: #000;
    transition: all .5s ease-in;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.hon_name_box .active-nav .hon_name_text {
    font-size: 18px;
    font-weight: 700;
    background-color: rgba(255, 255, 255, 1);
    box-shadow: 0 0 46px rgba(29, 56, 75, .17);
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
}

.hon_name_box .swiper-container {
    height: 370px;
    padding: 25px 25px 15px 25px;
    overflow: hidden;
}

.hon_name_box .swiper-slide {
    cursor: pointer;
}

.hon_name_box .swiper-button-prev,
.hon_name_box .swiper-button-next {
    background-image: none;
    width: 100%;
    text-align: center;
    margin: 0;
    color: #000;
}

.hon_name_box .swiper-button-prev img,
.hon_name_box .swiper-button-next img {
    width: .18rem;
}

.hon_name_box .swiper-button-next:after,
.hon_name_box .swiper-button-prev:after {
    content: "";
}

.hon_name_box .swiper-button-prev {
    top: 0;
    left: 0;
}

.hon_name_box .swiper-button-next {
    top: auto;
    right: 0;
    bottom: 0;
}

.page-team {}

.page-team-list {
    align-items: stretch;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.team-item {
    margin-right: .4rem;
    margin-bottom: .4rem;
    width: calc((100% - 1.2rem)/4);
    background-color: #eee;
}

.team-item:nth-child(4n) {
    margin-right: 0;
}

.team-item .item-box {
    width: 100%;
    position: relative;
    align-items: flex-start;
    flex-direction: column;
    transition: all 0.36s;
}

.team-item .item-box .info {
    width: 100%;
    padding: .3rem .2rem;
}

.team-item .item-box .info .info_title {
    font-size: .24rem;
    font-weight: 800;
    line-height: 1.2;
    color: #333333;
    margin-bottom: .1rem;
}

.team-item .item-box .info .tips {
    font-size: .14rem;
    font-family: 'Arial' !important;
}

.team-item .item-box .info .desc {
    margin-top: .24rem;
    padding-top: .23rem;
    position: relative;
}

.team-item .item-box .info .desc p {
    font-size: .16rem;
    line-height: 1.75;
    color: #666666;
    overflow: hidden;
    word-wrap: break-word;
    word-break: normal;
    text-align: justify;
}

.team-item .item-box .info .desc::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #d5d5d5;
    transition: all 0.36s;
    z-index: 0;
}

.team-item .item-box .pic {
    width: 100%;
    height: 3.86rem;
    overflow: hidden;
    position: relative;
}

.hel_img {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
}

.hel_img1 {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.team-item:hover {
    background-color: #cacaca;
}

.team-item:hover .item-box .info .desc::before {
    background-color: #afafaf;
}

.page-team-content {
    align-items: flex-start;
    justify-content: space-between;
}

.page-team-content .cont-left {
    width: 4.9rem;
    padding-right: 1rem;
    padding-top: .78rem;
    padding-bottom: .78rem;
    position: sticky;
    top: calc(1rem - .78rem);
}

.page-team-content .cont-left .img {
    width: 100%;
}

.page-team-content .cont-left .img img {
    width: 100%;
}

.page-team-content .cont-left .tips {
    margin-top: .28rem;
    margin-bottom: .16rem;
    padding-left: .36rem;
}

.page-team-content .cont-left .tips img {
    width: .22rem;
}

.page-team-content .cont-left .tips p {
    width: calc(100% - .22rem);
    padding-left: .15rem;
}

.page-team-content .cont-right {
    width: calc(100% - 4.9rem);
    padding-left: 1.09rem;
    padding-top: .76rem;
    padding-bottom: .76rem;
    overflow: hidden;
}

.page-team-content .cont-right .r-title {
    align-items: flex-end;
}

.page-team-content .cont-right .r-title p {
    font-size: .4rem;
    line-height: 1.2;
    color: #333333;
    font-weight: bold;
}

.page-team-content .cont-right .r-title span {
    font-size: .24rem;
    line-height: 1.5;
    color: #666666;
    padding-left: .24rem;
}

.r-ful {
    margin-top: .46rem;
}

.r-ful .r-ful-li {
    margin-bottom: .55rem;
}

.r-ful-li .r-f-tit {
    position: relative;
}

.r-ful-li .r-f-tit p {
    font-size: .2rem;
    line-height: 1.5;
    color: #333333;
    font-weight: bold;
}

.r-ful-li .r-f-tit::before {
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 95px;
    width: calc(100% - 95px);
    height: 1px;
    background: #dfdfdf;
}

.r-ful-li .r-f-tit::after {
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 95px;
    width: 20px;
    height: 3px;
    background: #1b2c43;
}

.r-ful-li .r-f-desc {
    margin-top: .2rem;
    font-size: .16rem;
    line-height: 2;
    color: #666666;
    text-align: justify;
}

.content-reback {
    justify-content: space-between;
}

.content-post,
.content-post a {
    font-size: .16rem;
    color: rgba(209, 213, 219, 1);
    line-height: 2;
}

.content-post a:hover {
    color: var(--text-color-purple);
}

.reback p {
    font-size: .18rem;
    line-height: 2;
}

.reback i {
    margin-left: .2rem;
    margin-right: .1rem;
    width: .48rem;
    height: .48rem;
    justify-content: center;
    border: 1px solid rgba(0, 0, 0, .5);
    border-radius: 100%;
    transition: all .3s;
}

.reback:hover i {
    scale: 1.25;
    color: #fff;
    background-color: var(--bg-purple);
    border-color: var(--bg-purple);
}

.reback:hover i img {
    width: .28rem;
}

.page-field {
    padding: .7rem 0;
}

.page-field-list {
    flex-wrap: wrap;
}

.page-field-list .item {
    padding: .3rem .2rem;
    margin-right: .32rem;
    margin-bottom: .32rem;
    width: calc((100% - .96rem)/4);
    text-align: center;
    box-shadow: 0 0 20px 0 rgba(229, 229, 229, .5);
}

.page-field-list .item i {
    margin: 0 auto .1rem;
    width: .5rem;
    height: .5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-field-list .item i img {}

.page-field-list .item h3 {
    font-size: .18rem;
    line-height: 2;
}

.page-field-list .item:nth-child(4n) {
    margin-right: 0;
}

.page-field-detail .page-title {
    margin-bottom: .3rem;
    padding: .2rem 0;
    border-bottom: #e5e5e5 solid 1px;
}

.page-product-detail {
    padding: .7rem 0;
    background-color: #f5f5f5;
}

.page-product-detail .product-content {
    padding: .5rem;
    background-color: #fff;
}

.page-product-detail .det-title {
    font-size: .3rem;
    position: relative;
    line-height: 1.4;
    margin-bottom: .15rem;
}

.page-product-detail .det-title::after {
    display: block;
    content: "";
    width: 60px;
    height: 3px;
    background: var(--bg-purple);
    margin: 5px 0px;
}

.page-product-detail .det-text {
    font-size: .16rem;
    line-height: 1.8;
    text-align: justify;
}

.page-product-detail .det-text p {
    margin-bottom: .15rem;
}

.page-product-detail .det-text img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto !important;
}

.page-news {
    background-color: rgba(248, 248, 248, 1);
}

.page-news .container {
    padding: .25rem;
    background-color: #fff;
    align-items: stretch;
}

.sideBar {
    width: 17.5%;
}

.sideMenu {
    position: relative;
    z-index: 13;
    overflow: hidden;
}

.sideMenu li {
    margin-bottom: .1rem;
}

.sideMenu li a {
    position: relative;
    display: block;
    padding: .15rem .2rem;
    color: #365f93;
    font-size: 1.125em;
    line-height: 1.6em;
    text-align: center;
    background-color: #ecf1f6;
}

.sideMenu li a:hover {
    background-color: #dee5ef;
}

.sideMenu li.active a {
    color: #fff;
    background-color: var(--bg-purple);
    font-weight: bold;
}

.sideMenu li.img a {
    padding: 0;
}

.sideMenu li.img a img {
    display: block;
    transform: .3s all;
}

.sideMenu li.img a:hover img {
    opacity: .85;
}

.mainContent {
    position: relative;
    width: 82.5%;
}

.mainContent .inBox {
    padding-left: .3rem;
    margin-left: .3rem;
}

.sideBar .in_box {
    position: sticky;
    top: 1.25rem;
}

.sideBar .in_box:after,
.mainContent:before {
    content: '';
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    background: #eee;
    z-index: 1;
}

.sideBar .in_box:after {
    right: -.31rem;
}

.mainContent:before {
    left: .3rem;
}

.page-news-list2 {
    margin-bottom: .5rem;
}

.page-news-list2 .page-news-item {
    padding: .3rem 0;
    position: relative
}

.page-news-list2 .page-news-item:before,
.page-news-list2 .page-news-item:after {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: #f2f2f2;
    content: '';
    transition: ease-in-out .3s;
    -webkit-transition: ease-in-out .3s;
    -moz-transition: ease-in-out .3s;
    z-index: 1;
}

.page-news-list2 .page-news-item:after {
    background: var(--bg-purple);
    width: 0
}

.page-news-list2 .page-news-item:first-child {
    padding-top: 0;
}

.page-news-list2 .page-news-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.page-news-list2 .page-news-left {
    width: calc(100% - 20.833vw - 4.4vw)
}

.page-news-list2 .page-news-right {
    width: 20.833vw;
    margin-left: 4.4vw;
    overflow: hidden;
    height: 13.2vw
}

.page-news-list2 .page-news-right img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: ease-in-out .3s;
    -webkit-transition: ease-in-out .3s;
    -moz-transition: ease-in-out .3s;
}

.page-news-list2 .page-news-time {
    font-size: .16rem;
    color: #666;
    margin-bottom: .1rem;
}

.page-news-list2 .page-news-title {
    font-size: .2rem;
    color: #333;
    font-weight: bold;
    margin-bottom: .2rem;
}

.page-news-list2 .page-news-summary {
    font-size: .16rem;
    line-height: 2;
    color: #666
}

.page-news-list2 .page-news-item:hover:after {
    width: 100%
}

.page-news-list2 .page-news-item:hover .page-news-title {
    color: var(--text-color-purple)
}

.page-knowledge-list .page-news-left {
    width: calc(100% - 16.833vw - 4.4vw);
}

.page-knowledge-list .page-news-right {
    width: 16.833vw;
    height: 10.2vw;
}

.page-news-detail {
    align-items: flex-start;
    justify-content: space-between;
}

.news-detail-left {
    padding: .3rem .4rem;
    width: 75%;
    background-color: rgba(251, 251, 251, 1);
}

.page-title {
    font-size: .2rem;
    color: #000;
    font-weight: bold;
    line-height: 1.6;
}

.page-info {
    font-size: 12px;
    color: #999;
    padding: .1rem 0;
    border-bottom: 1px solid rgba(242, 242, 242, 1);
    margin-bottom: .3rem;
}

.page-info span {
    margin-left: .2rem;
}

.page-text,
.page-text p {
    margin-bottom: 0.12rem;
    text-align: justify;
    font-size: 0.16rem;
    line-height: 2;
    color: #2b2b2b;
}

.page-text img {
    max-width: 100%;
    height: auto !important;
}

.news-detail-right {
    width: 23%;
    margin-bottom: .3rem;
    background: #fff;
    padding: .15rem .25rem;
}

.news-detail-right h3 {
    font-size: .24rem;
    color: #333;
    font-weight: 800;
}

.news-detail-right h3:after {
    display: block;
    width: .45rem;
    height: 3px;
    background: var(--bg-purple);
    content: "";
    margin-top: .1rem;
    margin-bottom: .15rem;
}

.page-news-hot li {
    padding: .08rem 0
}

.page-news-hot li a {
    display: block;
}

.page-news-hot li a .img-box {
    height: 1.8rem;
}

.page-news-hot li a .name {
    margin-top: .08rem;
    font-size: .16rem;
    line-height: 2;
}

.page-news-hot li+li {
    border-top: 1px solid rgba(0, 0, 0, .1);
}

.page-case {
    padding: .7rem 0;
}

.page-case-list {}

.page-case-list .page-news-right {
    margin-left: 0;
    margin-right: 4.4vw;
}

.page-hr-container {
    position: relative;
    z-index: 2;
    background: #F5F5F5;
    padding: 50px 0
}

.page-hr-title-en {
    font-size: .52rem;
    color: var(--text-color-purple);
    font-family: 'Noto Serif', 'Noto Serif CJK SC', 'Noto Serif CJK', 'Source Han Serif SC', ‘ Source Han Serif ’, source-han-serif-sc, serif;
    font-weight: 800;
    text-transform: capitalize;
}

.page-hr-title-cn {
    font-size: .3rem;
    color: var(--text-color-purple);
    font-family: 'Noto Serif', 'Noto Serif CJK SC', 'Noto Serif CJK', 'Source Han Serif SC', ‘ Source Han Serif ’, source-han-serif-sc, serif;
    font-weight: 800
}

.page-hr-top {
    margin-top: 90px;
    margin-bottom: 80px;
}

.page-hr-form {
    display: flex;
    justify-content: space-between;
}

.page-hr-form-item {
    margin-right: 3.125vw;
    background: #fff;
    height: 70px;
    border-radius: 10px;
    flex: 1;
    position: relative
}

.page-hr-select {
    width: 100%;
    height: 100%;
    border: none;
    background: transparent url(/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vaW1hZ2VzL2ljb24ud2VicA) no-repeat right 30px center;
    background-size: 16px;
    outline: none;
    font-size: .16rem;
    color: #333;
    border-radius: 15px;
    -webkit-overflow-scrolling: touch;
    -webkit-appearance: none;
    padding-left: 30px;
}

.page-hr-form-item:last-child {
    margin-right: 0
}

.page-hr-icon {
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%)
}

.page-hr-icon svg {
    width: 16px;
    height: 16px;
    fill: #999
}

.page-hr-input {
    width: 100%;
    height: 100%;
    padding: 0 30px;
    outline: none;
    border: none;
    font-size: .16rem;
    color: #333;
    border-radius: 35px;
}

.page-hr-form-item:last-child {
    max-width: 202px;
    background: var(--text-color-purple);
    margin-left: 8.125vw
}

.page-hr-submit {
    height: 100%;
    border: none;
    width: 100%;
    border-radius: 35px;
    font-size: .24rem;
    color: #fff;
    background: var(--text-color-purple)
}

.page-hr-item {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 20px
}

.page-hr-title {
    display: flex;
    justify-content: space-between;
    height: 80px;
    align-items: center;
    padding: 0 3.125vw;
    cursor: pointer
}

.page-hr-title span {
    font-size: .18rem;
    color: #666;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.page-hr-title span:first-child {
    padding-left: 20px;
    position: relative
}

.page-hr-title span:first-child:before {
    position: absolute;
    left: 0;
    top: 50%;
    width: 6px;
    height: 6px;
    background: #ccc;
    border-radius: 50%;
    content: '';
    margin-top: -3px;
}

.page-hr-title span:last-child {
    font-size: .16rem
}

.page-hr-title span:last-child svg {
    width: 14px;
    height: 14px;
    margin-left: 10px;
    fill: #C4C4C4;
    transition: ease-in-out .3s;
    -webkit-transition: ease-in-out .3s;
}

.page-hr-title span:last-child svg path {
    fill: #C4C4C4
}

.page-hr-details {
    margin: 0 3.125vw .25rem;
    border-top: solid 1px #ccc;
    padding-top: .35rem;
    display: none;
    position: relative;
}

.page-hr-price {
    text-align: right;
    font-size: .2rem;
    color: var(--text-color-purple);
    font-weight: 900;
    position: absolute;
    right: 0;
    top: .35rem;
}

.page-hr-subtitle {
    font-size: .2rem;
    color: #333;
    line-height: 2;
    margin-bottom: 15px;
}

.page-hr-section {
    margin-bottom: 60px;
}

.page-hr-section .page-text {
    font-size: .16rem;
    color: #666;
    line-height: 2;
}

.page-hr-button {
    margin-bottom: 60px
}

.page-hr-button button {
    display: flex;
    border: solid 1px #E0E0E0;
    box-shadow: 0px 5px 10px 0px #B8B8B8;
    justify-content: center;
    align-items: center;
    font-size: .18rem;
    color: var(--text-color-purple);
    height: .68rem;
    border-radius: 40px;
    background: #fff;
    width: 2.4rem;
    cursor: pointer;
}

.page-hr-button button svg {
    width: 20px;
    height: 20px;
    fill: var(--text-color-purple);
    margin-right: 20px;
}

.page-hr-item:hover .page-hr-title span:first-child {
    color: var(--text-color-purple)
}

.page-hr-item:hover .page-hr-title span:first-child:before {
    background: var(--text-color-purple)
}

.page-hr-item.active .page-hr-title span:last-child svg {
    transform: rotate(90deg)
}

#layer {
    display: none
}

.layer-container {
    width: 35vw;
    min-width: 800px;
    padding: 30px
}

.layer-from {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap
}

.layer-item {
    display: flex;
    margin-bottom: 20px;
    padding: 5px 10px;
    align-items: center;
    width: calc((100% - 40px) / 2);
    margin-right: 40px
}

.layer-item:nth-child(2n) {
    margin-right: 0
}

.layer-item:nth-child(3),
.layer-item:last-child {
    width: 100%
}

.layer-item:last-child {
    margin-bottom: 0
}

.layer-item-title {
    width: 100px;
    font-size: .14rem;
    color: #333;
    justify-content: space-between;
    display: inline-block;
    text-align: justify;
    text-justify: distribute-all-lines;
    text-align-last: justify;
    padding-right: 15px
}

.layer-item-input {
    flex: 1;
    position: relative;
    display: flex
}

.layer-item-input input[type=text] {
    height: 40px;
    border: none;
    border-bottom: solid 1px #ddd;
    font-size: .16rem;
    color: var(--text-color-purple);
    padding-left: 10px;
    outline: none;
    width: 100%
}

.layer-file-name {
    height: 40px;
    border-bottom: solid 1px #ddd;
    display: flex;
    align-items: center;
    padding-left: 10px;
    font-size: .12rem;
    color: #999;
    padding-right: 20px;
    flex: 1
}

.layer-file-button {
    border: solid 1pxvar(--text-color-purple);
    border-radius: 5px;
    background: var(--text-color-purple);
    font-size: .14rem;
    color: #fff;
    line-height: 1
}

.layer-file-button p {
    font-size: .12rem
}

.layer-file-input {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer
}

.layer-item-submit {
    width: 160px;
    height: 40px;
    background: var(--text-color-purple);
    color: #fff;
    font-size: .16rem;
    border-radius: 10px;
    border: none;
    outline: none
}

.layui-layer .layui-layer-title {
    font-size: .2rem;
    color: var(--text-color-purple);
    font-weight: bold
}

.page-recruit {
    padding: .5rem 0;
    background-color: rgba(248, 248, 248, 1);
}

.page-recruit .container {
    background-color: #fff;
}

.join_us-banner-container .banner-title {
    margin: 80px auto 32px;
    font-size: 32px;
    font-weight: 600;
    color: #fff;
    line-height: 60px;
}

.table-recruit-table {
    -webkit-transition: opacity .3s;
    transition: opacity .3s;
    width: 100%;
    text-align: left;
    border-radius: 4px 4px 0 0;
    border-collapse: separate;
    border-spacing: 0;
    color: rgba(0, 0, 0, .65);
}

.table-recruit-table colgroup col.li_1,
.join_list li .li_con .li_1 {
    width: 40%;
}

.table-recruit-table colgroup col.li_2,
.join_list li .li_con .li_2 {
    width: 18%;
}

.table-recruit-table colgroup col.li_3,
.join_list li .li_con .li_3 {
    width: 25%;
}

.table-recruit-table colgroup col.li_4,
.join_list li .li_con .li_4 {
    width: 25%;
}

.table-recruit-table colgroup col.li_5,
.join_list li .li_con .li_5 {
    width: 16%;
}

.table-recruit-table colgroup col.li_6,
.join_list li .li_con .li_6 {
    width: 10%;
}

.ant-table-thead>tr {
    -webkit-transition: all .3s, height 0s;
    transition: all .3s, height 0s;
}

.ant-table-thead>tr>th {
    color: rgba(0, 0, 0, .85);
    font-weight: 500;
    text-align: left;
    background: #fff;
    border-bottom: 1px solid #e8e8e8;
    -webkit-transition: background .3s ease;
    transition: background .3s ease;
}

.ant-table-tbody>tr>td {
    border-bottom: 1px solid #e8e8e8;
    -webkit-transition: all .3s, border 0s;
    transition: all .3s, border 0s;
}

.table-recruit-table tr th {
    color: #333;
    font-size: 16px;
    font-weight: 800 !important;
    border-bottom: 1px solid #f3f3f3;
    padding: 15px 0 !important;
    line-height: 20px;
}

.table-recruit-table th:first-child,
.table-recruit-table td:first-child {
    padding-left: 26px !important;
}

.join_con {
    position: relative;
    background-color: #fff;
    padding-bottom: 80px;
}

.join_nav {
    width: 100%;
    color: #000;
    font-size: 14px;
    text-align: left;
    position: relative;
    border-bottom: 1px solid #b2b2b2;
    padding: 25px 4%;
}

.join_nav li {
    display: inline-block;
    opacity: .6;
    padding: 0 20px;
    cursor: pointer;
}

.join_nav li.on,
.join_nav li:hover {
    color: var(--text-color-purple);
    opacity: 1;
}

.join_nav li:nth-child(1) {
    padding-left: 0;
}

.join_nav .mark {
    position: absolute;
    right: 4%;
    top: 25px;
}

.join_list {
    margin-bottom: .5rem;
    width: 100%;
    padding: 0;
    text-align: left;
    position: relative;
}

.join_list li {
    width: 100%;
    color: #000;
    font-size: .14rem;
}

.join_list li .li_con {
    width: 100%;
    flex-direction: row;
    align-items: center;
    border-bottom: 1px solid #e5e5e5;
    position: relative;
    padding: 20px 0;
    font-size: 15px;
    cursor: pointer;
}

.join_list li:nth-child(2n+2) .li_con {
    background-color: #fcfcfc;
}

.join_list li .li_con:after {
    content: '';
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 8px solid #000;
    border-bottom: none;
    position: absolute;
    right: 4%;
    top: 32px;
    z-index: 0;
}

.join_list li:hover .li_con:after {
    border-top: 8px solid var(--bg-purple);
}

.join_list li.on .li_con:after {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 8px solid var(--bg-purple);
    border-top: none;
}

.join_list li .li_con .li_1 {
    padding-left: 26px;
    font-size: 16px;
}

.join_list li .li_con .li_5 {
    opacity: .6;
}

.join_list li .li_detail {
    width: 100%;
    color: #000;
    font-size: .14rem;
    border-bottom: 1px solid #e5e5e5;
    padding: 0 .26rem .5rem;
    display: none;
}

.join_list li .li_detail p {
    line-height: 30px;
}

.join_list li .li_detail b {
    font-weight: bold;
}

.li_detail_jy {
    width: 100%;
    border-bottom: 1px solid #e5e5e5;
    padding: 35px 0;
}

.li_detail_jy p {
    display: inline-block;
    width: 36%;
}

.li_detail_jy p:nth-child(2),
.li_detail_jy p:nth-child(5) {
    width: 42%;
}

.li_detail_jy p:nth-child(3),
.li_detail_jy p:nth-child(6) {
    width: 20%;
}

.li_detail_jy p b {
    margin-right: 10px;
}

.li_detail_xx {
    width: 100%;
    padding: 30px 0;
}

.li_detail_xx strong {
    font-size: .18rem;
}

.li_detail_xx p {
    font-size: .14rem;
}

.li_detail_btn {
    width: 250px;
    height: 60px;
    line-height: 60px;
    color: #f3f3f3;
    font-size: 18px;
    text-align: center;
    background-color: #222;
    margin-left: 0;
    cursor: pointer;
}

.li_detail_btn:hover {
    background-color: #333;
}

.join_pop {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1000;
    background-color: rgba(0, 0, 0, 0.85);
    display: none;
}

.join_pop_box {
    margin: 0 auto;
    width: 1200px;
    max-width: 90%;
    max-height: 90%;
    background-color: #fff;
    position: relative;
    top: 52%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    padding: 5% 0;
}

.join_pop_box_close {
    position: absolute;
    right: 0;
    bottom: 100%;
    z-index: 100;
    background-color: #e60014;
    padding: 5px;
    cursor: pointer;
}

.join_pop_box_close i {
    display: block;
    color: #fff;
    font-size: 40px;
    line-height: 1;
    cursor: pointer;
}

.join_pop_con {
    margin: 0 auto;
    width: 600px;
    max-width: 100%;
    height: 100%;
}

.section_title {
    text-shadow: none;
}

.join_pop_put {
    width: 100%;
    position: relative;
}

.join_pop_put p {
    width: 100%;
    line-height: 40px;
    text-align: left;
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: 20px;
}

.join_pop_put p span {
    display: block;
}

.join_pop_put p input {
    display: block;
    width: 100%;
    line-height: 40px;
    cursor: text;
}

.join_pop_put p select {
    display: inline-block;
    width: 45%;
    line-height: 40px;
    border: none;
    cursor: pointer;
}

.join_pop_put p select.bm {
    margin-right: 8%;
}

.join_pop_btn {
    width: 250px;
    height: 60px;
    line-height: 60px;
    color: #f3f3f3;
    font-size: 18px;
    text-align: center;
    background-color: #222;
    margin-left: 0;
    margin-top: 50px;
    cursor: pointer;
}

.join_pop_btn input.zp_btn {
    display: block;
    font-size: 18px;
    color: #f3f3f3;
    width: 100%;
    height: 100%;
    border: none;
    background-color: transparent;
}

.join_pop_btn:hover {
    background-color: #333;
}

.join_pop_em {
    width: 100%;
    text-align: left;
    margin-top: 20px;
}

.join_pop_em span {
    color: #d93a3a;
}

#faq-tab-accordion .card-header {
    padding: 15px;
    background: #fff;
    border: none;
    cursor: pointer;
    margin-bottom: 10px;
    position: relative;
    border-radius: 5px;
    border: none;
    align-items: center;
    justify-content: space-between;
    -webkit-transition: all 0.25s linear;
    transition: all 0.25s linear;
    background-size: 200% auto;
    -webkit-box-shadow: 0 10px 30px 0 rgba(0, 51, 204, 0.1);
    box-shadow: 0 10px 20px 0 rgba(0, 51, 204, 0.1);
}

#faq-tab-accordion .card {
    border: 0;
}

#faq-tab-accordion .card-header a {
    color: #000;
    font-weight: 600;
}

.card-header h6 {
    font-size: .1125rem;
}

.card-header h6 span {
    height: 50px;
    width: 50px;
    margin-right: 10px;
    display: inline-block;
    line-height: 50px;
    text-align: center;
    border-radius: 50%;
    background: rgba(74, 79, 230, 0.1);
    color: var(--text-color-purple);
    font-size: .1125rem;
}

#faq-tab-accordion .card-toggle-btn::after {
    content: "+";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    height: 40px;
    width: 40px;
    margin-left: 10px;
    display: inline-block;
    line-height: 40px;
    text-align: center;
    border-radius: 50%;
    background: rgba(74, 79, 230, 0.1);
    color: var(--text-color-purple);
    transition: all 0.25s linear;
}

#faq-tab-accordion .card-header[aria-expanded="true"] .card-toggle-btn::after {
    transform: rotate(180deg);
    content: "-";
}

#faq-tab-accordion .card-header[aria-expanded="true"] {
    background: var(--bg-purple);
    border-bottom-color: transparent;
}

#faq-tab-accordion .card-header[aria-expanded="true"] .card-toggle-btn::after,
#faq-tab-accordion .card-header[aria-expanded="true"] h6 span {
    background: #fff;
}

#faq-tab-accordion .card-header[aria-expanded="true"] h6 {
    color: #fff;
}

.page-next {
    margin-top: 30px;
    padding: .2rem 0;
    display: flex;
    justify-content: space-between;
    border-top: 1px solid rgba(0, 0, 0, .05);
}

.page-next p {
    width: 48%;
    flex: 1;
    line-height: 20px;
    padding-top: .2rem;
    padding-bottom: .2rem;
    padding: .2rem;
    box-sizing: border-box;
    display: block;
}

.page-next .post_next {
    direction: rtl;
}

.page-next span {
    display: block;
    font-size: .14rem;
    padding-bottom: 1vw;
    color: rgba(102, 102, 102, 1);
}

.page-next a {
    font-size: .16rem;
    line-height: 1.6;
    font-weight: 600;
}

.page-next .post_next a {
    display: flex;
    justify-content: flex-end;
    direction: ltr
}

.page-contact {
    background: #F7F7F7;
    display: flex;
}

.page-contact .container {
    align-items: stretch;
    justify-content: space-between;
}

.contact-title {
    font-size: .32rem;
    line-height: 2;
}

.contact-sub-title {
    margin-bottom: .2rem;
    font-size: .15rem;
    line-height: 1.6;
    color: #636b72;
}

.contact-from .col-lg-6,
.contact-from .col-lg-12 {
    position: relative;
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
}

@media (min-width:992px) {
    .contact-from .col-lg-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .contact-from .col-lg-12 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

.contact-from {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 48%;
}

.contact-from .inner {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

.form-control {
    margin-bottom: .3rem;
    display: block;
    width: 100%;
    height: .6rem;
    color: #100e17;
    outline: none;
    padding: 0 .2rem;
    font-size: .14rem;
    font-weight: 400;
    line-height: 1.5;
    background-color: #fff;
    background-clip: padding-box;
    border: none;
    border-radius: .04rem;
    resize: none;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.form-control:focus,
textarea.form-control:focus {
    outline: none;
    border: none;
    color: #100e17;
}

textarea.form-control {
    height: 1.68rem;
    padding-top: 20px;
}

.form-control::placeholder {
    font-size: .14rem;
    font-family: "Poppins", "PingFang SC", "Microsoft YaHei", sans-serif;
}

.empty-form span {
    background: #f8d7da;
    color: #721c24;
    display: block;
    padding: 20px;
    margin-bottom: 10px;
}

.success-form span {
    background: #e8eafd;
    color: #0033CC;
    display: block;
    padding: 20px;
    margin-bottom: 10px;
}

.email-invalid span {
    background: #f8e2e4;
    color: #721c24;
    display: block;
    padding: 20px;
    margin-bottom: 10px;
}

.contactBtn {
    display: inline-block;
    overflow: hidden;
    padding: .15rem .5rem;
    border-radius: 5px;
    text-transform: capitalize;
    position: relative;
    color: #fff !important;
    background: var(--bg-purple);
    cursor: pointer;
    -webkit-transition: all 0.25s ease;
    -ms-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    transition: all 0.25s ease;
    -webkit-box-shadow: 0 10px 16px 0 rgba(0, 51, 204, 0.15);
    box-shadow: 0 10px 16px 0 rgba(0, 51, 204, 0.15);
}

.page-contact-right .contact-title {
    font-size: .34rem;
    color: #000;
    margin-bottom: .26rem;
    font-family: 'Noto Serif CJK SC', 'Noto Serif CJK', 'Source Han Serif SC', ‘ Source Han Serif ’, source-han-serif-sc, serif;
    font-weight: 900
}

.page-contact-tel {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: .4rem;
}

.page-contact-tel i svg {
    width: .5rem;
    height: .5rem;
    fill: var(--bg-purple)
}

.page-contact-tel i svg path {
    fill: var(--bg-purple)
}

.page-contact-tel p {
    margin-left: .1rem;
    font-size: .16rem;
    color: var(--bg-purple)
}

.page-contact-tel p b {
    display: block;
    font-size: .4rem;
    color: var(--bg-purple);
    line-height: 1;
    font-family: 'Noto Serif CJK SC', 'Noto Serif CJK', 'Source Han Serif SC', ‘ Source Han Serif ’, source-han-serif-sc, serif;
}

.page-contact-adds {
    margin-bottom: .5rem;
}

.page-contact-adds p {
    padding: .05rem 0;
    align-items: center;
    font-size: .16rem;
    color: #333;
    line-height: 2;
}

.page-contact-adds p i {
    margin-right: .1rem;
    font-size: .18rem;
    color: var(--text-color-purple);
    line-height: 1;
}

.page-contact-code {
    display: flex;
    justify-content: flex-start;
    align-items: center
}

.page-contact-code-item {
    margin-right: 2vw;
    text-align: center;
    width: calc((100% - 6vw) / 4)
}

.page-contact-code-item:last-child {
    margin-right: 0
}

.page-contact-code-item p {
    font-size: .16rem;
    color: #333;
    margin-top: .1rem;
}

.page-contact-info {
    margin-top: .6rem;
    font-size: .16rem;
    color: #999;
    line-height: 2
}

.page-contact-right {
    width: 45.5%
}

.page-contact-right #map {
    width: 100%;
    height: 3.8rem
}

.sitemap {
    padding: 6.3vw 0;
    height: auto;
    width: 100%;
    overflow: hidden;
    margin-bottom: .6rem;
}

.sitemap ul li {
    margin-bottom: .2rem;
}

.sitemap h2 {
    margin-bottom: .1rem;
    display: block;
    line-height: 2;
    font-size: .18rem;
    color: #333;
    font-weight: 800;
    border-bottom: 1px dotted rgba(0, 0, 0, .1);
}

.sitemap .sub_map {
    display: block;
}

.sitemap .sub_map a {
    display: inline-block;
    font-size: .15rem;
    line-height: 2;
    margin-right: .25rem;
}

@media (max-width:1659px) {
    .about-text .cont {
        -webkit-line-clamp: 12;
    }
    .process-list{
        height: 3.36rem;
    }
    .process-list .swiper-slide{
        padding: .2rem .2rem .3rem;
    }
    .process-list .swiper-slide h4{
        font-size: .18rem;
    }
    .process-list .swiper-slide span{
        font-size: .4rem;
    }
    .process-list .swiper-slide.swiper-slide-active i{
        height: 1.58rem;
    }
}

@media (max-width:1440px) {
    .about-text .cont {
        -webkit-line-clamp: 12;
    }
}

@media (min-width:1300px) and (max-width:1549px) {
    .about-text .cont {
        -webkit-line-clamp: 12;
    }
}

@media (max-width:1281px) and (max-width:1299px) {
    .about-text .cont {
        -webkit-line-clamp: 12;
    }
}

@media (max-width:1280px) {
    .box {
        padding: 0.5rem 0;
    }

    .nav-wrapper .nav-item {
        padding: 0 15px;
    }

    .nav-wrapper>.nav-item+.nav-item {
        margin-left: 10px;
    }

    .about-text .cont {
        -webkit-line-clamp: 12;
    }

    .footer-copyright {
        padding-top: 0.3rem;
    }

    .footer-copyright br {}
}

@media (min-width:1025px) and (max-width:1270px) {
    .container {
        width: 100%;
        padding: 0 15px;
    }

    .header .header__nav__container {
        max-width: 100%;
    }

    .nav-wrapper .nav-item h2.nav-item-link {
        font-size: 15px;
    }

    .nav-wrapper>.nav-item+.nav-item {
        padding: 0 12px;
    }

    .page-about-box {
        padding-top: .6rem;
    }

    .cases_detail_logo {
        right: 15px;
    }

    .footer .container {
        padding-top: .5rem;
        padding-bottom: .5rem;
    }

    .footer .footer-copyright .container {
        padding-top: 0;
        padding-bottom: 0;
    }
}

.pages {
    margin-top: 0.3rem;
    padding-bottom: 0.3rem;
    text-align: center;
}

.pages a,
.pages b {
    margin: 5px;
    display: inline-block;
    font-size: 0.14rem;
    color: #777777;
    border: none;
    line-height: 32px;
    height: 32px;
    padding: 0 12px;
    background-color: #f6f6f6;
}

.pages b {
    background: var(--bg-purple);
    color: var(--text-color-white);
}

.pages a:hover {
    color: var(--text-color-blue);
}

.pages a:first-child {
    display: none;
}

@media (max-width:760px) {

    .pages a,
    .pages b {
        font-size: .24rem;
        height: 24px;
        line-height: 24px;
        padding: 0 8px;
    }
}

@media (max-width:1024px) {
    .navs {
        display: none;
    }

    .menubtn {
        display: block;
    }

    .banner {
        height: 68vh;
    }
}

@media screen and (orientation:portrait) {
    .ind_body {
        overflow-y: auto !important;
    }

    #header {
        height: 60px;
        background-color: var(--bg-purple);
    }

    #header .header__nav__container {
        padding: 0 0.3rem;
    }

    .header__logo {
        margin-right: 0;
        height: 60px;
    }

    .header__logo a img {
        width: 100%;
        height: auto;
    }

    .header__logo img:nth-child(1) {
        margin-right: 0;
        opacity: 0;
    }

    .header__logo img:nth-child(2) {
        opacity: 1;
    }

    .header__tel {
        margin-right: .2rem;
        padding-left: .3rem;
        font-size: .28rem;
        color: #fff;
    }

    .header__tel span {
        display: none;
    }

    .navs {
        display: none;
    }

    .menubtn {
        display: block;
        width: 20px;
    }

    #header .menubtn span,
    #header .menubtn span:after,
    #header .menubtn span:before,
    .page_body #header .menubtn span,
    .page_body #header .menubtn span:after,
    .page_body #header .menubtn span:before {
        background-color: #fff;
    }

    .banner {
        margin-top: 60px;
        height: 28vh;
    }

    .banner-arrow {
        display: none;
    }

    .lb-num {
        display: none;
    }

    .swiper-pagination .circle-progress {}

    .box {}

    .title {
        flex-direction: column;
    }

    .title h4 {
        padding-left: 0;
        font-size: 0.28rem;
        line-height: 1.6;
        text-align: center;
    }

    .title .en {
        padding-left: 0;
        font-size: 0.36rem;
        font-weight: 600;
    }

    .title .en::after {
        height: 3px;
    }

    .more {
        margin-top: .3rem;
        padding: 0;
        width: auto;
        height: .7rem;
        font-size: .26rem
    }

    .more i {
        margin-right: .1rem
    }

    .banner {
        width: 100%;
        overflow: hidden;
        position: relative;
    }

    .banner .swiper-slide {
        overflow: hidden;
    }

    .banner .slide-inner {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        background-size: cover;
        background-position: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

    .banner .swiper-slide.swiper-slide-active .slide-inner {
        -webkit-animation: scaleBigToSmall 4s;
        animation: scaleBigToSmall 4s;
    }

    @-webkit-keyframes scaleBigToSmall {
        0% {
            opacity: 1;
            -webkit-transform: scale(1.2);
            -ms-transform: scale(1.2);
            transform: scale(1.2);
        }

        100% {
            opacity: 1;
            -webkit-transform: scale(1);
            -ms-transform: scale(1);
            transform: scale(1);
        }
    }

    @keyframes scaleBigToSmall {
        0% {
            opacity: 1;
            -webkit-transform: scale(1.2);
            -ms-transform: scale(1.2);
            transform: scale(1.2);
        }

        100% {
            opacity: 1;
            -webkit-transform: scale(1);
            -ms-transform: scale(1);
            transform: scale(1);
        }
    }

    .scaleBigToSmall {
        -webkit-animation-name: scaleBigToSmall;
        animation-name: scaleBigToSmall;
        transform-origin: 50% 50%;
    }

    .banner__container {
        padding: 0 5%;
        width: 100%;
        position: absolute;
        bottom: 0.2rem;
        left: 0;
    }

    .pagination-box {
        bottom: 15px;
        justify-content: space-between;
        align-items: center;
    }

    .pagination-box .swiper-pagination {
        margin: 0 auto;
        width: auto;
        font-size: 0;
        position: relative;
        left: auto;
        bottom: auto;
    }

    .swiper-banner .banner-prev,
    .swiper-banner .banner-next {
        left: .15rem;
        height: 1.68rem;
        font-size: .24rem;
    }

    .swiper-banner .banner-prev::before,
    .swiper-banner .banner-next::before {
        height: 32px;
    }

    .swiper-banner .banner-next {
        left: auto;
        right: .15rem;
    }

    .home-main .about {
        padding: 0;
        height: auto;
        flex-direction: column;
    }

    .about .image {
        width: 100%;
        height: 60vw;
        position: relative;
        left: auto;
        top: auto;
        background-attachment: local;
    }

    .about .container {
        margin-right: 0;
        padding: 0;
    }

    .about-left {
        display: none;
    }

    .about-text .top {
        justify-content: center;
    }

    .about-text {
        width: 100%;
        padding: .3rem .3rem 0;
        margin-left: 0;
    }

    .about-text::before {
        display: none;
    }

    .about-text .top h4 {
        font-size: .28rem;
    }

    .about-text .top .en {
        font-size: .32rem;
    }

    .about-text .cont p {
        font-size: .266rem;
    }

    .more {
        position: relative;
        top: auto;
        margin: 0;
        right: auto;
        margin-top: 0;
    }

    .more span {
        font-size: .266rem;
    }

    .sub-title {
        margin-bottom: .2rem;
        text-align: center;
    }

    .sub-title .en::before {
        width: .4rem;
        height: .4rem;
    }

    .about-num {
        margin: .2rem 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .about-num .item,
    .about-num .item:first-child {
        padding: .1rem;
        width: 33.33%;
        flex-direction: column;
        background: none;
    }

    .about-num .item h3 {
        font-size: 0;
        line-height: 1;
    }

    .about-num .item h3 label {
        font-size: 0;
    }

    .about-num .item span {
        margin-left: .1rem;
        font-size: .2rem;
    }

    .about-num .item p {
        font-size: .24rem;
    }

    .about-num .item:nth-child(3) {
        border-left: none;
    }

    .about-num .item+.item+.item {
        border-top: 1px solid rgba(255, 255, 255, .6);
    }

    .process-text {
        padding: 0 .3rem;
        font-size: .24rem;
        line-height: 1.8;
        text-align: left;
    }

    .process-text p {
        text-align: justify;
    }

    .swiper-process {
        margin-left: 0;
    }

    .news-item {
        padding: .4rem .3rem .3rem;
    }

    .news-item h3 {
        width: 100%;
        font-size: .3rem;
        line-height: 24px;
        height: 48px;
    }

    .news-item .desc {
        margin: .3rem 0;
        width: 100%;
        font-size: .28rem;
        line-height: 1.8;
        -webkit-line-clamp: 2;
    }

    .news-item span {
        font-size: .26rem;
    }

    .swiper-btn {
        margin: 0 auto;
        align-items: flex-end;
        width: 2rem;
        position: relative;
        right: auto;
        left: auto;
        top: auto;
        background-color: transparent;
    }

    .swiper-btn .btn {
        margin: 0 .1rem;
        width: .8rem;
        height: .8rem;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: .28rem;
        background-color: var(--bg-purple);
        border-radius: 100%;
    }

    .ad img {
        margin-top: 0;
    }

    .solution {
        padding-bottom: 0;
    }

    .solution .b1_box {
        flex-wrap: wrap;
    }

    .sol-left {
        padding: 0 .3rem .5rem;
        width: 100%;
    }

    .sol-left .top p {
        font-size: .266rem;
    }

    .form_notice {
        font-size: .266rem;
    }

    .form_submit {
        width: 100%;
    }

    .sol-right {
        width: 100%;
        padding: .5rem .3rem;
    }

    .sol-contact .contact-top p,
    .sol-contact .contact-tel span {
        font-size: .266rem;
    }

    .page-main {
        margin-top: 60px;
    }

    .subbanner {
        height: 16vh;
    }

    .subbanner .container {
        top: 50%;
    }

    .subbanner .container p {
        display: none;
        font-size: .24rem;
        line-height: 1.6;
    }

    .page-subMenu {
        margin-top: 0;
        background-color: transparent;
        box-shadow: 0px 2px 8px rgba(135, 135, 135, 0.2);
    }

    .page-subMenu .container {
        max-width: 100%;
        padding: 0;
        height: auto;
        justify-content: flex-start;
        flex-wrap: wrap-reverse;
    }

    .container-left {
        width: 100%;
    }

    .page-name {
        display: none;
    }

    .pub-nav {
        width: 100%;
    }

    .pub-nav ul {
        width: 100%;
    }

    .pub-nav li {
        padding: 0;
        flex: auto;
    }

    .pub-nav li a {
        padding: .15rem .2rem;
        font-size: .28rem;
    }

    .page-path {
        width: 100%;
        padding: .2rem 0.3rem;
        font-size: .24rem;
        border-bottom: 1px solid rgba(250, 250, 250, 1);
    }

    .page-path .container {
        padding: 0;
    }

    .page-path .container::before {
        width: .3rem;
        height: .3rem;
        font-size: .266rem;
    }

    .page-main .title {
        margin-bottom: .2rem;
    }

    .page-about .container {
        height: auto;
        flex-wrap: wrap;
        overflow: hidden;
    }

    .page-about .about-pic {
        margin-bottom: .3rem;
        width: 100%;
    }

    .page-about .about-right {
        width: 100%;
    }

    .about-title h3 {
        font-size: .4rem;
    }

    .about-cont {
        padding-right: 0;
        overflow-y: hidden;
        max-height: none;
    }

    .about-cont p {
        font-size: .266rem;
    }

    .page-honor .tea_case {
        flex-direction: column;
    }

    .hon_tab_nav_box {
        float: none;
        width: 100%;
    }

    .hon_tab_nav_box>div {
        width: 25%;
        float: left;
        text-align: center;
    }

    .hon_tab_num {
        font-size: 24px;
    }

    .hon_tab_name {
        line-height: 40px;
        font-size: .266rem;
    }

    .hon_tab_name::after {
        height: 3px;
    }

    .hon_con_case {
        width: 100%;
    }

    .hon_con_case .pure {
        display: flex;
        flex-direction: column;
    }

    .hon_con_box {
        width: 100%;
    }

    .hon_con_box .swiper-slide>div>img {
        max-width: 100%;
        max-height: auto;
    }

    .hon_name {
        font-size: .32rem;
    }

    .hon_con_box .swiper-container {
        padding-bottom: 70px;
    }

    .hon_name_box {
        float: none;
        width: 100%;
        top: auto;
        right: auto;
        position: relative;
        display: none;
    }

    .hon_name_box .swiper-container {
        height: 102px;
    }

    .page-field-list .item {
        padding: .3rem .2rem .2rem;
        margin-right: .3rem;
        margin-bottom: .3rem;
        width: calc((100% - .3rem)/2);
    }

    .page-field-list .item i {
        width: .6rem;
        height: .6rem;
    }

    .page-field-list .item h3 {
        margin-top: .15rem;
        font-size: .28rem;
    }

    .page-field-list .item:nth-child(5n) {
        margin-right: .3rem;
    }

    .page-field-list .item:nth-child(2n) {
        margin-right: 0;
    }

    .page-team {
        padding: .5rem 0;
    }

    .page-team-list {
        flex-direction: column;
    }

    .team-item {
        margin-bottom: .3rem;
        margin-right: 0;
        width: 100%;
    }

    .team-item .item-box {
        flex-direction: row;
    }

    .team-item .item-box .info {
        padding-top: .4rem;
        padding-left: .4rem;
        padding-right: .18rem;
        width: calc(100% - 2.62rem);
    }

    .team-item .item-box .pic {
        width: 2.62rem;
    }

    .team-item .item-box .info .info_title {
        font-size: .36rem;
    }

    .team-item .item-box .info .tips {
        font-size: .28rem;
    }

    .team-item .item-box .info .desc {
        margin-top: .16rem;
        padding-top: .18rem;
    }

    .team-item .item-box .info .desc p {
        font-size: .26rem;
        -webkit-line-clamp: 3;
    }

    .page-team-content {
        flex-direction: column;
    }

    .page-team-content .cont-left {
        width: 100%;
        padding: .5rem 0 .4rem;
        position: relative;
        top: auto;
    }

    .page-team-content .cont-left .img {
        width: 90%;
        margin: 0 auto;
    }

    .page-team-content .cont-right {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
        padding-top: .34rem;
        padding-bottom: .36rem;
    }

    .r-ful-li .r-f-tit p {
        font-size: .3rem;
    }

    .r-ful-li .r-f-tit::before {
        left: 1.6rem;
        width: calc(100% - 1.6rem);
    }

    .r-ful-li .r-f-tit::after {
        left: 1.6rem;
        height: 2px;
    }

    .r-ful-li .r-f-desc {
        font-size: .266rem;
        margin-top: .2rem;
    }

    .content-reback {
        flex-direction: column;
        align-items: flex-start;
    }

    .content-post {
        width: 100%;
    }

    .content-post,
    .content-post a {
        font-size: .266rem;
    }

    .reback {
        margin-top: .4rem;
        width: 100%;
        height: .8rem;
        background-color: var(--bg-purple);
        border-radius: 5px;
        justify-content: center;
    }

    .reback p {
        font-size: .266rem;
        line-height: 2;
        color: #fff;
    }

    .reback i {
        display: none;
    }

    .page-honor {
        padding: .5rem 0;
    }

    .page-honor-list .honor-item {
        margin-right: .3rem;
        width: calc((100% - .3rem)/2);
    }

    .page-honor-list .honor-item h4 {
        margin-top: .1rem;
        font-size: .24rem;
        max-height: 1.2rem;
    }

    .page-honor-list .honor-item:nth-child(2n) {
        margin-right: 0;
    }

    .page-partner {
        padding: .5rem 0;
    }

    .page-partner-list .item {
        margin-right: .3rem;
        margin-bottom: .3rem;
        width: calc((100% - .6rem)/3);
    }

    .page-partner-list .item:nth-child(5n) {
        margin-right: .3rem
    }

    .page-partner-list .item:nth-child(3n) {
        margin-right: 0
    }

    .page-product-detail {
        padding: .5rem 0;
    }

    .page-product-detail .product-content {
        padding: .35rem;
    }

    .page-product-detail .det-title {
        font-size: .4rem;
    }

    .page-product-detail .det-text {
        font-size: .266rem;
    }

    .page-news-list {
        margin-bottom: .3rem;
    }

    .page-news-list li {
        margin-right: 0;
        margin-bottom: 4%;
        position: relative;
        width: 100%;
    }

    .page-news-list .page-news-item {
        padding: 0;
    }

    .page-news-list .page-news-block {
        align-items: center;
    }

    .page-news-list .page-news-left {
        margin-right: 0;
        width: 36%;
        height: 2rem;
        max-height: none;
        min-height: auto;
    }

    .page-news-list .page-news-left img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .page-news-list2 .page-news-time {
        font-size: .24rem
    }

    .page-news-list2 .page-news-title {
        font-size: .28rem;
        line-height: 1.6;
        margin-bottom: 0
    }

    .page-news-list2 .page-news-summary {
        font-size: .24rem;
        line-height: 1.8;
        -webkit-line-clamp: 1;
        margin-top: .05rem;
        margin-bottom: .1rem;
    }

    .page-news-list .page-news-right {
        padding: .15rem .2rem .15rem .3rem;
        width: 64%;
    }

    .page-news-list li .news-txt h4 {
        font-size: .28rem
    }

    .page-news-list li .news-txt p {
        font-size: .24rem;
    }

    .page-news-list li .news-txt span {
        font-size: .24rem;
    }

    .page-news-list2 .page-news-right {
        margin-left: .2rem;
        height: 1.28rem;
    }

    .sideBar {
        width: 100%;
    }

    .sideMenu li {
        margin-bottom: 0;
        border-top: none;
    }

    .sideMenu li a {
        padding-top: 12px;
        padding-bottom: 12px;
        border-bottom: 1px solid rgba(255, 255, 255, .8);
        text-align: left;
        font-size: .28rem;
    }

    .mainContent {
        width: 100%;
    }

    .mainContent .inBox {
        margin-left: 0;
        padding-left: 0;
    }

    .sideBar .in_box:after,
    .mainContent:before {
        display: none;
    }

    .mobile-sideBar {
        position: fixed;
        left: -200px;
        top: 0;
        bottom: 0;
        z-index: 99;
        background: rgba(0, 0, 0, 0.6) !important;
        width: 200px !important;
        transition: all .3s;
        -webkit-transition: all .3s;
    }

    .mobile-sideBar .mobile-sideBar-over {
        position: relative;
        top: 0;
        overflow-y: auto;
        max-height: 100%;
        overflow-x: hidden;
        z-index: 11;
    }

    .mobile-sideBar-icon {
        position: absolute;
        left: 100%;
        bottom: 0;
        z-index: 13;
        width: 40px;
        height: 40px;
        background: url(/cases/27/proxy?p=L3NraW4vc2hhbmd5aWxhdy5jb20vaW1hZ2VzL3NpdGVfdHJlZV9pY28uZ2lm) no-repeat center center;
        background-color: rgba(0, 0, 0, 0.6);
        border-radius: 0 4px 0 0;
        cursor: pointer;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    }

    .mobile-sideBar-mark {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: rgba(0, 0, 0, 0.3);
        z-index: 10;
        display: none;
    }

    .mobile-sideBar.active {
        left: 0;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
    }

    .page-news-box {
        padding: .5rem 0;
    }

    .page-news-detail {
        padding: 0;
        max-width: 100%;
        flex-direction: column;
    }

    .news-detail-left {
        width: 100%;
    }

    .page-title {
        font-size: .32rem;
    }

    .news-detail-left .page-info {
        font-size: .24rem;
        margin: .2rem 0;
        padding: .15rem 0;
    }

    .news-detail-right {
        width: 100%;
    }

    .news-detail-right h3 {
        font-size: .32rem;
    }

    .page-text h2 {
        font-size: .42rem;
    }

    .page-text,
    .page-text p {
        font-size: 0.26rem;
    }

    .page-about-cont .page-text strong {
        font-size: .3rem;
    }

    .page-next .post_prev,
    .page-next .post_next {
        padding: 10px;
    }

    .page-next a {
        font-size: 0.26rem;
    }

    .page-info {
        margin: 0.38rem 0;
        padding-bottom: 0.285rem;
    }

    .page-next {
        margin-top: 0.38rem;
    }

    .page-case-list a .case-img {
        height: 2.2rem
    }

    .page-case-list a h4 {
        font-size: .28rem;
    }

    .page-case {
        padding: .5rem 0;
    }

    .page-case-detail {
        padding-left: .3rem;
        padding-right: .3rem;
    }

    .join_list {
        margin-bottom: .3rem;
    }

    .join_list .hidden-xs {
        display: none;
    }

    .table-recruit-table th:first-child,
    .table-recruit-table td:first-child {
        padding-left: 15px !important;
    }

    .join_list li {
        font-size: .24rem;
    }

    .join_list li .li_con {
        padding: 10px 0;
    }

    .join_list li .li_con .li_1 {
        padding-left: 15px;
    }

    .table-recruit-table colgroup col.li_1 {
        width: 35%;
    }

    .join_list li .li_con .li_1 {
        width: 45.8%;
    }

    .table-recruit-table colgroup col.li_3 {
        width: 25%;
    }

    .join_list li .li_con .li_3 {
        width: 35%;
    }

    .table-recruit-table colgroup col.li_6,
    .join_list li .li_con .li_6 {
        width: 5%;
    }

    .join_list li .li_con .li_1 {
        font-size: 15px;
    }

    .join_list li .li_con:after {
        top: 45%;
    }

    .join_list li .li_detail {
        padding: 0 4% 40px;
    }

    .li_detail_jy {
        padding: 15px 0;
    }

    .li_detail_jy p {
        font-size: .266rem;
    }

    .li_detail_jy p,
    .li_detail_jy p:nth-child(3),
    .li_detail_jy p:nth-child(6) {
        width: 100%;
    }

    .join_list li .li_detail p {
        line-height: 30px;
    }

    .li_detail_xx {
        padding: .2rem 0;
    }

    .li_detail_xx strong {
        font-size: .28rem;
    }

    .li_detail_xx p {
        font-size: .25rem;
    }

    .li_detail_btn {
        width: 100%;
        height: 40px;
        line-height: 40px;
        color: #f3f3f3;
        font-size: 14px;
        text-align: center;
        background-color: var(--bg-purple);
        margin-left: 0;
        cursor: pointer;
    }

    .join_pop_box_close i {
        font-size: .6rem;
    }

    .join_pop_con {
        width: 90%;
        height: 100%;
    }

    .section_title h3 {
        font-size: .28rem;
    }

    .section_title p {
        font-size: .32rem;
        font-weight: 800;
    }

    .join_pop_put p {
        font-size: .266rem;
    }

    .join_pop_btn {
        width: 100%;
        height: 40px;
        line-height: 40px;
    }

    .join_pop_btn input.zp_btn {
        font-size: .266rem
    }

    .join_pop_em p {
        font-size: .266rem;
    }

    .page-contact .container {
        align-items: flex-start;
        flex-direction: column-reverse;
    }

    .contact-from {
        width: 100%;
        padding: .5rem 0;
    }

    .contact-title {
        font-size: .38rem;
    }

    .contact-sub-title {
        font-size: .266rem;
    }

    .form-control {
        margin-bottom: .3rem;
        padding: 0 15px;
        height: 46px;
        font-size: .266rem;
    }

    .form-control::placeholder {
        font-size: .24rem;
    }

    textarea.form-control {
        padding-top: .25rem;
        height: 2.68rem;
    }

    .contactBtn {
        padding: .2rem .4rem;
        width: 100%;
    }

    .page-contact-right .contact-title {
        font-size: .4rem;
        margin-bottom: .3rem;
    }

    .page-contact-tel {
        margin-bottom: .2rem;
    }

    .page-contact-tel i {
        display: flex;
        width: .8rem;
        height: .8rem
    }

    .page-contact-tel i svg {
        width: .8rem;
        height: .8rem
    }

    .page-contact-tel p {
        font-size: .24rem
    }

    .page-contact-tel p b {
        font-size: .42rem
    }

    .page-contact-adds p {
        margin: .3rem 0;
        font-size: .26rem;
        align-items: flex-start;
        line-height: 1.4;
    }

    .page-contact-adds p i {
        margin-right: .15rem;
        font-size: .3rem;
        line-height: 1.4;
    }

    .page-contact-code-item p {
        font-size: .24rem
    }

    .page-contact-adds {
        margin-bottom: .3rem;
        font-size: .28rem;
    }

    .page-contact-info {
        margin-top: .3rem;
        font-size: .24rem;
    }

    .page-contact-right {
        width: 100%
    }

    #footer {}

    #footer .container {
        padding: .5rem .3rem 0;
    }

    .bottom-top {
        margin-bottom: 0;
        padding-top: 0;
        flex-direction: column;
    }

    .bottom-left {
        width: 100%;
    }

    .bottom-logo {
        margin-bottom: .3rem;
    }

    .bottom-logo img {
        height: .85rem;
    }

    .bottom-logo img:first-child {}

    .bottom-contact {
        font-size: .266rem;
        line-height: 2;
    }

    .bottom-code-menu .code-box {
        margin: 0 auto;
        width: 40%;
    }

    .code-box {
        margin-top: .3rem;
        width: 42%;
    }

    .code-box p {
        font-size: .3rem;
    }

    .sitemap h2 {
        font-size: .32rem;
    }

    .sitemap .sub_map a {
        font-size: .266rem;
    }

    .footer-copy {
        padding: 0.2rem 0 0.2rem;
        flex-direction: column;
        text-align: center;
        font-size: 0.24rem;
    }

    .footer-copy br {
        display: block;
    }

    .footer-copy p,
    .footer-copy span,
    .footer-copy a {
        font-size: 0.24rem;
        color: #fff;
    }

    .fixed_case {
        width: .8rem;
    }

    .fixed_case .fixed_btn {
        padding: .36rem 0;
    }

    .fixed_case .fixed_btn .fixed_n {
        font-size: .266rem;
    }

    .fixed_case .fixed_btn .iconfont {
        font-size: .34rem;
    }

    .online-box.open .online-cont {
        width: 80%;
    }

    .booking-name b {
        font-size: .4rem;
    }

    .booking-div {
        flex-wrap: wrap;
    }

    .booking-label {
        margin-bottom: .45rem;
        width: 100%;
    }

    .booking-label span {
        font-size: .266rem;
    }

    .booking-form input,
    .booking-textarea {
        font-size: .266rem;
    }

    .booking-label.focus span {
        font-size: .24rem;
    }

    .key-label #canvas {
        width: 120px;
        height: 32px;
    }

    .key-label #keyBtn {
        font-size: .266rem;
    }

    .booking-submit .submit-btn {
        padding: .08rem .54rem;
        border-radius: .6rem;
    }

    .booking-submit .submit-btn span::before {
        width: 6px;
        height: 6px;
    }
}