@charset "UTF-8";

@font-face {
    font-family: "HarmonyOS_Sans_SC_Regular";
    src: url("../fonts/HarmonyOS_Sans_SC_Regular.ttf");
}

@font-face {
    font-family: "HarmonyOS_Sans_SC_Light";
    src: url("../fonts/HarmonyOS_Sans_SC_Light.ttf");
}

@font-face {
    font-family: "Rajdhani-Regular";
    src: url("../fonts/Rajdhani-Regular-2.ttf");
}

@font-face {
    font-family: "Rajdhani-Medium";
    src: url("../fonts/Rajdhani-Medium-3.ttf");
}

@font-face {
    font-family: "Rajdhani-Bold";
    src: url("../fonts/Rajdhani-Bold-4.ttf");
}

@font-face {
    font-family: "ding";
    src: url("../fonts/DingTalk JinBuTi.ttf");
}

@keyframes o-upfade-top {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes o-scale-x {
    0% {
        transform: scaleX(0);
    }

    100% {
        transform: scaleX(1);
    }
}

@keyframes scale2 {
    0% {
        opacity: 0.2;
        transform: scale(1);
    }

    80% {
        opacity: 0.2;
    }

    100% {
        opacity: 0;
        transform: scale(1.5);
    }
}

@keyframes logomove {
    0% {
        transform: translate(0);
    }

    100% {
        transform: translate(-100%);
    }
}

@media screen and (min-width: 1025px) {
    .wow {
        visibility: hidden;
    }
}

.header {
    position: fixed;
    width: 100%;
    padding: 0 3.75rem;
    background-color: #fff;
    z-index: 9;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
}

.header .logo {
    display: block;
    width: 16rem;
}

.header .logo img {
    display: block;
    width: 100%;
}

.header .main {
    display: flex;
    align-items: center;
    grid-gap: 2.5rem;
}

.header ul {
    display: flex;
    grid-gap: 2.1875rem;
}

.header li {
    position: relative;
}

.header li a.single {
    display: block;
    font-size: max(14px, 1rem);
    line-height: 80px;
    color: #00405b;
    position: relative;
    transition: color 0.3s ease;
}

.header li a.single:after {
    content: "";
    width: 26px;
    height: 4px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -13px;
    opacity: 0;
    transition: opacity 0.3s ease;
    will-change: opacity;
}

.header li .subnav {
    position: absolute;
    top: 100%;
    left: 50%;
    border-radius: 0.625rem;
    background-color: #fff;
    padding: 1rem 0;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.1);
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, 20px);
}

.header li .subnav a {
    position: relative;
    display: block;
    margin-top: 1rem;
    padding: 0 2rem;
    white-space: nowrap;
}

.header li .subnav a:nth-of-type(1) {
    margin-top: 0;
}

.header li .subnav a:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.header li .subnav a span {
    display: block;
    position: relative;
    z-index: 2;
    font-size: max(14px, 1rem);
    line-height: 40px;
    color: #00405b;
    text-align: center;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .header li .subnav a:hover:before {
        opacity: 1;
    }

    .header li .subnav a:hover span {
        color: #fff;
    }
}

@media (any-hover: hover) {
    .header li:hover a.single:after {
        opacity: 1;
    }

    .header li:hover .subnav {
        opacity: 1;
        visibility: visible;
        transform: translate(-50%, 0);
        transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    }
}

.header .search-btn {
    width: max(16px, 1.25rem);
    height: max(16px, 1.25rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/icon-2.svg");
    cursor: pointer;
}

.header .user-link {
    display: flex;
    grid-gap: 10px;
}

.header .user-link a {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0 1.5rem;
    transition: all 0.3s ease;
}

.header .user-link a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 3px;
    z-index: 1;
}

.header .user-link a span {
    font-size: max(14px, 1rem);
    line-height: max(30px, 2.5rem);
    position: relative;
    z-index: 2;
}

.header .user-link a.btn-1:before {
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.header .user-link a.btn-1:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 3px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.header .user-link a.btn-1 span {
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .header .user-link a.btn-1:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }

    .header .user-link a.btn-1:hover:after {
        opacity: 1;
    }

    .header .user-link a.btn-1:hover span {
        color: #fff;
    }
}

.header .user-link a.btn-2:before {
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.header .user-link a.btn-2 span {
    color: #fff;
}

@media (any-hover: hover) {
    .header .user-link a.btn-2:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

.header .user-info {
    position: relative;
}

.header .user-info .message-count {
    position: absolute;
    top: -2px;
    right: -20px;
    color: #fff;
    background-color: #dc3545;
    padding-right: 0.6em;
    padding-left: 0.6em;
    border-radius: 10rem;
    z-index: 999;
}

.header .user-info .show {
    height: 50px;
    display: flex;
    grid-gap: 10px;
    align-items: center;
    cursor: pointer;
}

.header .user-info .show .img-box {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    overflow: hidden;
}

.header .user-info .show img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.header .user-info .show span {
    font-size: 12px;
    color: #00405b;
}

.header .user-info.no-message .show:after {
    content: "";
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #7a8799;
}

.header .user-info .hide {
    width: 240px;
    padding-bottom: 24px;
    position: absolute;
    top: 100%;
    right: 0;
    background-color: #fff;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.05);
    display: none;
}

.header .user-info .hide .top-box {
    padding: 20px;
    display: flex;
    align-items: center;
    grid-gap: 10px;
    border-bottom: 1px solid #e5e5e5;
}

.header .user-info .hide .img-box {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
}

.header .user-info .hide .img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.header .user-info .hide .txt-box {
    width: calc(100% - 58px);
}

.header .user-info .hide .name {
    font-size: 14px;
    color: #00405b;
}

.header .user-info .hide .tel {
    font-size: 12px;
    color: #7a8799;
}

.header .user-info .hide .mid-box {
    margin: 25px 50px 0;
}

.header .user-info .hide .mid-box .box {
    margin-top: 15px;
}

.header .user-info .hide .mid-box .box:nth-of-type(1) {
    margin-top: 0;
}

.header .user-info .hide .mid-box a {
    display: inline-block;
    font-size: 14px;
    color: #7a8799;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .header .user-info .hide .mid-box a:hover {
        color: #00abc8;
    }
}

.header .user-info .hide .bot-box {
    margin: 25px 20px 0;
    text-align: center;
}

.header .user-info .hide .bot-box .link {
    display: block;
    font-size: 14px;
    line-height: 36px;
    color: #fff;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 3px;
}

.header .user-info .hide .bot-box .logout {
    display: inline-block;
    font-size: 14px;
    color: #00405b;
    margin-top: 8px;
}

.header .user-info:hover .hide {
    display: block;
}

.header .m-user-block {
    display: none;
}

.head-null {
    height: 80px;
}

.fixed-search {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 11;
    display: none;
}

.fixed-search .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.fixed-search .top-block {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background-color: #fff;
    z-index: 2;
}

.fixed-search .logo {
    position: absolute;
    top: 50%;
    left: 3.75rem;
    transform: translateY(-50%);
    display: block;
    width: 16rem;
}

.fixed-search .logo img {
    display: block;
    width: 100%;
}

.fixed-search .close {
    width: 12px;
    height: 12px;
    position: absolute;
    right: 3.75rem;
    top: calc(50% - 6px);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/close-2.png");
    cursor: pointer;
}

.fixed-search .box {
    width: 640px;
    position: relative;
}

.fixed-search .form {
    width: 100%;
    height: 40px;
    border: 1px solid #e4e7eb;
    border-radius: 5px;
    padding-left: calc(1.875rem + 20px);
    padding-right: 83px;
    position: relative;
}

.fixed-search .form:before {
    content: "";
    width: 20px;
    height: 20px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/icon-4.png");
    position: absolute;
    left: 1.875rem;
    top: 50%;
    margin-top: -10px;
}

.fixed-search .form input {
    width: 100%;
    height: 100%;
    padding: 0 1rem;
    font-size: 14px;
    color: #7a8799;
    background-color: transparent;
}

.fixed-search .form input::-webkit-input-placeholder {
    color: #7a8799;
}

.fixed-search .form input:-moz-placeholder {
    color: #7a8799;
}

.fixed-search .form input::-moz-placeholder {
    color: #7a8799;
}

.fixed-search .form input:-ms-input-placeholder {
    color: #7a8799;
}

.fixed-search .form button {
    width: 80px;
    height: 32px;
    border-radius: 5px;
    font-size: max(14px, 1rem);
    color: #fff;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    position: absolute;
    top: 3px;
    right: 3px;
    cursor: pointer;
}

.fixed-search .hot-box {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    width: 100%;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    padding: 1.875rem;
}

.fixed-search .hot-box span {
    display: block;
    font-size: 14px;
    color: #7a8799;
}

.fixed-search .hot-box .link {
    margin-top: 1.25rem;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 10px;
}

.fixed-search .hot-box .link a {
    font-size: 12px;
    color: #00405b;
    line-height: 26px;
    border-radius: 13px;
    background-color: #f2f5f7;
    padding: 0 20px;
}

.footer {
    background-color: #fff;
}

.footer .top-block {
    padding-top: 3.5rem;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.footer .top-block .img-box {
    width: 130px;
}

.footer .top-block .img-box img {
    display: block;
    width: 100%;
}

.footer .top-block .link-box {
    display: flex;
    align-items: flex-start;
    grid-gap: 6.25rem;
}

.footer .top-block .box span {
    display: block;
    font-size: max(16px, 1.125rem);
    color: #00405b;
}

.footer .top-block .box .link {
    margin-top: 1.5rem;
}

.footer .top-block .box .link a {
    display: block;
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    margin-top: 10px;
    transition: color 0.3s ease;
}

.footer .top-block .box .link a:nth-of-type(1) {
    margin-top: 0;
}

@media (any-hover: hover) {
    .footer .top-block .box .link a:hover {
        color: #00405b;
    }
}

.footer .mid-block {
    margin-top: 3.5rem;
    display: flex;
}

.footer .mid-block span {
    width: 80px;
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    border-right: 1px solid #e4e7eb;
}

.footer .mid-block .link {
    width: calc(100% - 80px);
    padding-left: 1.875rem;
    display: flex;
    flex-wrap: wrap;
    grid-column-gap: 1.875rem;
    grid-row-gap: 1rem;
}

.footer .mid-block .link a {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .footer .mid-block .link a:hover {
        color: #00405b;
    }
}

.footer .bot-block {
    margin-top: 2.5rem;
    padding: 1.875rem 0;
    border-top: 1px solid #e4e7eb;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer .bot-block p {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    line-height: 1.5;
}

.footer .bot-block p a {
    display: inline-block;
    color: #7a8799;
    margin-left: 1.875rem;
}

.footer .bot-block p img {
    width: max(14px, 1.25rem);
    display: inline-block;
    vertical-align: middle;
    margin: -2px 8px 0 0;
}

.fixed-right {
    position: fixed;
    right: 1.875rem;
    bottom: 1.875rem;
    z-index: 10;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.fixed-right.active {
    opacity: 1;
    visibility: visible;
}

.fixed-right .top-block {
    width: 5rem;
    height: 5rem;
    position: relative;
}

.fixed-right .top-block .range {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.fixed-right .top-block .range em {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50%;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    animation: scale2 1.5s linear infinite;
}

.fixed-right .top-block .range em:nth-of-type(2) {
    animation-delay: 0.5s;
}

.fixed-right .top-block .range em:nth-of-type(3) {
    animation-delay: 1s;
}

.fixed-right .top-block a {
    display: block;
    height: 100%;
    border-radius: 50%;
    box-sizing: border-box;
    border: 2px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
    position: relative;
    z-index: 2;
}

.fixed-right .top-block a .img-box {
    width: 3.75rem;
    height: 3.75rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: inherit;
}

.fixed-right .top-block a .img-box img {
    width: 100%;
}

.fixed-right .top-block a span {
    position: absolute;
    bottom: -6px;
    left: 0;
    width: 100%;
    font-size: max(12px, 0.875rem);
    color: #ffffff;
    line-height: 24px;
    text-align: center;
    border-radius: 3px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    z-index: 2;
}

.fixed-right .bot-block {
    width: 5rem;
    margin-top: 26px;
    border-radius: 10px;
    background-image: linear-gradient(180deg, #00abc8, #8cce73);
}

.fixed-right .bot-block .box {
    position: relative;
    height: 5rem;
    padding: 3px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    cursor: pointer;
}

.fixed-right .bot-block .box:nth-child(3) {
    display: none;
}

.fixed-right .bot-block .box .show {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    transition: all 0.3s ease;
}

.fixed-right .bot-block .box .show i {
    width: 20px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.fixed-right .bot-block .box .show span {
    font-size: max(12px, 0.875rem);
    color: #fff;
    margin-top: 0.625rem;
}

.fixed-right .bot-block .box .hide {
    position: absolute;
    top: 0;
    right: 100%;
    padding-right: 1.25rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.fixed-right .bot-block .box .ewm-box {
    width: max(120px, 11.25rem);
    padding: 1rem 1rem 1.25rem;
    border-radius: 10px;
    background: #fff url("../images/fixed-right-6.png") center top no-repeat;
    background-size: 100% auto;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
}

.fixed-right .bot-block .box .ewm-box .img-box {
    width: 100%;
    background-color: #fff;
}

.fixed-right .bot-block .box .ewm-box img {
    display: block;
    width: 100%;
}

.fixed-right .bot-block .box .ewm-box p {
    font-size: max(12px, 0.875rem);
    color: #00314e;
    text-align: center;
    font-family: "HarmonyOS_Sans_SC_Light";
    margin-top: 1rem;
}

.fixed-right .bot-block .box .tel-box {
    width: max(240px, 21.25rem);
    height: max(90px, 7.5rem);
    padding: 0 1.875rem;
    border-radius: 10px;
    background: #fff url("../images/fixed-right-7.png") center top no-repeat;
    background-size: 100% auto;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center;
}

.fixed-right .bot-block .box .tel-box i {
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    position: relative;
}

.fixed-right .bot-block .box .tel-box i:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../images/fixed-right-2.png");
    background-size: auto 14px;
}

.fixed-right .bot-block .box .tel-box .txt {
    width: calc(100% - 3rem);
    padding-left: 1.25rem;
}

.fixed-right .bot-block .box .tel-box span {
    display: block;
    font-size: 1.875rem;
    color: #00314e;
    font-family: "Rajdhani-Bold";
}

.fixed-right .bot-block .box .tel-box p {
    font-size: max(12px, 0.875rem);
    color: #00314e;
    font-family: "HarmonyOS_Sans_SC_Light";
}

@media (any-hover: hover) {
    .fixed-right .bot-block .box:hover .show {
        background-color: rgba(255, 255, 255, 0.2);
    }

    .fixed-right .bot-block .box:hover .hide {
        opacity: 1;
        pointer-events: auto;
    }
}

.fixed-right .totop {
    height: max(30px, 2.5rem);
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../images/fixed-right-4.png");
    background-size: auto 8px;
    cursor: pointer;
}

.fixed-bottom {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    display: none;
}

.fixed-bottom .flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.6rem 5%;
    background-color: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

.fixed-bottom a.link {
    text-align: center;
}

.fixed-bottom a.link i {
    display: block;
    margin: 0 auto;
    width: 20px;
    height: 20px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto 14px;
}

.fixed-bottom a.link span {
    display: block;
    font-size: 14px;
    color: #333;
    margin-top: 10px;
}

.fixed-bottom a.obtain i {
    background-image: url("../images/fixed-1.png");
}

.fixed-bottom a.tel i {
    background-image: url("../images/fixed-2.png");
}

.fixed-bottom a.form {
    width: 160px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    text-align: center;
    font-size: 14px;
    line-height: 40px;
    border-radius: 24px;
    color: #fff;
}

.fixed-bottom .hide {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 2;
    background: #fff url("../images/fixed-right-6.png") center top no-repeat;
    background-size: 100% auto;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border-radius: 10px 10px 0 0;
    padding: 40px;
    display: none;
}

.fixed-bottom .hide .close {
    width: 24px;
    height: 24px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/close-4.png");
    position: absolute;
    top: 20px;
    right: 20px;
}

.fixed-bottom .hide .ewm-box {
    width: 120px;
    margin: 0 auto;
}

.fixed-bottom .hide img {
    display: block;
    width: 100%;
}

.fixed-bottom .hide p {
    font-size: 14px;
    color: #333;
    text-align: center;
    margin-top: 1rem;
}

.wrap-s {
    width: 82.5rem;
    margin: 0 auto;
    position: relative;
    z-index: 3;
}

.layui-layer-love {
    background-color: rgba(255, 102, 25, 0.8);
    padding: 10px 0;
    text-align: center;
    color: #fff;
    border-radius: 5px;
    font-size: 14px;
    top: 100px;
}

.layui-layer-love span {
    font-size: 24px;
    font-weight: 700;
    padding-left: 10px;
}

.fixed-payment-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 20;
    display: none;
}

.fixed-payment-popup .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 1;
}

.fixed-payment-popup .main {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fixed-payment-popup .block {
    width: 90%;
    max-width: 60rem;
    border-radius: 10px;
    background-color: #fff;
    overflow: hidden;
}

.fixed-payment-popup .top-block {
    background-color: #f0f5f8;
    padding: 1.875rem 2.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fixed-payment-popup .label {
    font-size: 2rem;
    color: #005072;
}

.fixed-payment-popup .close {
    width: max(30px, 2.6875rem);
    height: max(30px, 2.6875rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/close-4.png");
    cursor: pointer;
}

.fixed-payment-popup .bot-block {
    padding: 2.5rem;
}

.fixed-payment-popup ul li {
    display: flex;
    align-items: center;
    padding: 1rem 2.5rem;
    background-color: #e0eaee;
}

.fixed-payment-popup ul li:nth-of-type(1) {
    background-color: #005072;
}

.fixed-payment-popup ul .tit {
    font-size: max(16px, 1.25rem);
    color: #fff;
}

.fixed-payment-popup ul .tit:nth-of-type(1) {
    width: calc(100% - 28.75rem);
}

.fixed-payment-popup ul .tit:nth-of-type(2) {
    width: 6.25rem;
}

.fixed-payment-popup ul .tit:nth-of-type(3) {
    width: 15rem;
}

.fixed-payment-popup ul .tit:nth-of-type(4) {
    width: 7.5rem;
}

.fixed-payment-popup ul span {
    font-size: max(13px, 1rem);
    color: #005072;
}

.fixed-payment-popup ul span:nth-of-type(1) {
    width: calc(100% - 28.75rem);
}

.fixed-payment-popup ul span:nth-of-type(2) {
    width: 6.25rem;
}

.fixed-payment-popup ul span:nth-of-type(3) {
    width: 15rem;
}

.fixed-payment-popup ul span:nth-of-type(4) {
    width: 7.5rem;
}

.fixed-payment-popup .method-tit {
    margin-top: 2.5rem;
    font-size: max(16px, 1.5rem);
    color: #005072;
    padding-left: 1.25rem;
    position: relative;
}

.fixed-payment-popup .method-tit:before {
    content: "";
    width: 4px;
    height: 80%;
    position: absolute;
    top: 10%;
    left: 0;
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    border-radius: 2px;
}

.fixed-payment-popup .method-tit span {
    font-size: max(13px, 1rem);
    color: #7a8799;
}

.fixed-payment-popup .method-type {
    margin-top: 1.25rem;
    display: flex;
    grid-gap: 3.75rem;
}

.fixed-payment-popup .method-type .box {
    font-size: max(14px, 1.125rem);
    color: #005072;
    cursor: pointer;
}

.fixed-payment-popup .method-type .box:before {
    content: "";
    width: max(15px, 1.5rem);
    height: max(15px, 1.5rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    vertical-align: middle;
    margin: -4px 8px 0 0;
    background-image: url("../images/online/icon-18-1.png");
}

.fixed-payment-popup .method-type .box.check:before {
    background-image: url("../images/online/icon-18-2.png");
}

.fixed-payment-popup .online-main {
    margin-top: 1.875rem;
    padding: 2.5rem;
    background-color: #f0f5f8;
    display: none;
}

.fixed-payment-popup .online-main .flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fixed-payment-popup .online-main .tit {
    font-size: max(16px, 1.5rem);
    color: #005072;
}

.fixed-payment-popup .online-main .link {
    display: inline-block;
    margin-top: 1.25rem;
    font-size: max(13px, 1rem);
    color: #00405b;
    border-bottom: 1px solid #005072;
    cursor: pointer;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .fixed-payment-popup .online-main .link:hover {
        color: #00abc8;
        border-color: #00abc8;
    }
}

.fixed-payment-popup .online-main .payment-btn {
    width: 120px;
    margin-top: 2.5rem;
    border-radius: 5px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    font-size: max(14px, 1rem);
    color: #fff;
    line-height: max(36px, 3rem);
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .fixed-payment-popup .online-main .payment-btn:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-2px);
    }
}

.fixed-payment-popup .online-main .ewm-box {
    display: flex;
    align-items: flex-start;
    grid-gap: 10px;
    opacity: 0;
}

.fixed-payment-popup .online-main .ewm-box.active {
    opacity: 1;
}

.fixed-payment-popup .online-main .ewm {
    width: 9.375rem;
}

.fixed-payment-popup .online-main .ewm .t-img {
    background-color: #fff;
}

.fixed-payment-popup .online-main .ewm .t-img img {
    display: block;
    width: 100%;
}

.fixed-payment-popup .online-main .ewm .b-img {
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fixed-payment-popup .online-main .ewm .b-img img {
    display: block;
    height: 20px;
}

.fixed-payment-popup .contract-main {
    margin-top: 1.875rem;
    width: 100%;
    max-width: max(400px, 37.5rem);
    display: none;
}

.fixed-payment-popup .contract-main .form {
    width: 100%;
    height: 60px;
    border: 1px solid #e4e7eb;
    border-radius: 5px;
    padding-right: 125px;
    position: relative;
}

.fixed-payment-popup .contract-main input {
    width: 100%;
    height: 100%;
    padding: 0 1rem;
    font-size: 14px;
    color: #7a8799;
    background-color: transparent;
}

.fixed-payment-popup .contract-main input::-webkit-input-placeholder {
    color: #7a8799;
}

.fixed-payment-popup .contract-main input:-moz-placeholder {
    color: #7a8799;
}

.fixed-payment-popup .contract-main input::-moz-placeholder {
    color: #7a8799;
}

.fixed-payment-popup .contract-main input:-ms-input-placeholder {
    color: #7a8799;
}

.fixed-payment-popup .contract-main button {
    width: 120px;
    height: 48px;
    border-radius: 5px;
    font-size: max(14px, 1rem);
    color: #fff;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    position: absolute;
    top: 5px;
    right: 5px;
    cursor: pointer;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .fixed-payment-popup .contract-main button:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

.fixed-common-popups {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 25;
    display: none;
}

.fixed-common-popups .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 1;
}

.fixed-common-popups .main {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fixed-common-popups .block {
    width: 80%;
    max-width: max(400px, 33.75rem);
    border-radius: 10px;
    background-color: #fff;
    overflow: hidden;
    position: relative;
    padding: 40px;
    text-align: center;
}

.fixed-common-popups .close {
    width: 24px;
    height: 24px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/close-4.png");
    position: absolute;
    top: 1.25rem;
    right: 1.25rem;
    cursor: pointer;
}

.fixed-common-popups .tit {
    font-size: max(18px, 1.5rem);
    color: #00405b;
}

.fixed-common-popups p {
    font-size: max(14px, 1rem);
    color: #00405b;
    margin-top: 1rem;
}

.fixed-common-popups .btns {
    margin-top: 3.125rem;
    display: flex;
    justify-content: center;
    grid-gap: 10px;
}

.fixed-common-popups .btns .btn {
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
}

.fixed-common-popups .btns .btn:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.fixed-common-popups .btns .btn:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.fixed-common-popups .btns .btn span {
    padding: 0 1.875rem;
    font-size: max(14px, 1rem);
    line-height: max(40px, 3rem);
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

.fixed-common-popups .btns .btn:nth-of-type(1):after {
    opacity: 1;
}

.fixed-common-popups .btns .btn:nth-of-type(1) span {
    color: #fff;
}

.fixed-common-popups .btns .btn:nth-of-type(2) span {
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

@media (any-hover: hover) {
    .fixed-common-popups .btns .btn:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-5px);
    }

    .fixed-common-popups .btns .btn:hover:after {
        opacity: 1;
    }

    .fixed-common-popups .btns .btn:hover span {
        color: #fff;
    }
}

.fixed-pay-typebox {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 20;
    display: none;
}

.fixed-pay-typebox .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.fixed-pay-typebox .main {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px 8% 40px;
    border-radius: 10px 10px 0 0;
    z-index: 2;
    background-color: #fff;
}

.fixed-pay-typebox .tit {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fixed-pay-typebox .tit span {
    font-size: 14px;
    color: #005072;
}

.fixed-pay-typebox .close {
    width: 24px;
    height: 24px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/n-1.png");
}

.fixed-pay-typebox .type {
    margin-top: 15px;
}

.fixed-pay-typebox .btn {
    margin-top: 10px;
    border: 1px solid #e6e6e6;
    border-radius: 5px;
    padding: 10px 20px;
    display: flex;
    align-items: center;
    grid-gap: 15px;
}

.fixed-pay-typebox .btn:nth-of-type(1) {
    margin-top: 0;
}

.fixed-pay-typebox .btn:before {
    content: "";
    width: 36px;
    height: 36px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.fixed-pay-typebox .btn span {
    font-size: 14px;
    color: #7a8799;
}

.fixed-pay-typebox .wz-btn:before {
    background-image: url("../images/online/n-2.png");
}

.fixed-pay-typebox .zfb-btn:before {
    background-image: url("../images/online/n-3.png");
}

.fixed-pay-success {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 20;
    display: none;
}

.fixed-pay-success .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.fixed-pay-success .main {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 30px 8% 30px;
    border-radius: 10px 10px 0 0;
    z-index: 2;
    background-color: #fff;
}

.fixed-pay-success .tit {
    text-align: center;
    font-size: 20px;
    color: #005072;
}

.fixed-pay-success p {
    margin-top: 15px;
    text-align: center;
    font-size: 12px;
    color: #7a8799;
}

.fixed-pay-success .btn {
    margin-top: 40px;
    font-size: 16px;
    line-height: 50px;
    text-align: center;
    color: #fff;
    border-radius: 25px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.video-pop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 15;
    display: none;
}

.video-pop .bg {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1;
}

.video-pop .close {
    width: 32px;
    height: 32px;
    position: absolute;
    right: 20px;
    top: 20px;
    background: url("../images/close-3.svg") center no-repeat;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    transition: all 500ms ease;
    cursor: pointer;
    z-index: 2;
}

@media (any-hover: hover) {
    .video-pop .close:hover {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    }
}

.video-pop video {
    position: absolute;
    top: 50%;
    left: 50%;
    max-height: 80%;
    max-width: 80%;
    z-index: 3;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.c-bg-fixed {
    background-attachment: fixed;
}

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

.index-label .label {
    display: inline-block;
    position: relative;
}

.index-label .label:before {
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0.35;
    position: absolute;
    left: -20px;
    top: 0;
    z-index: 1;
}

.index-label .label:after {
    content: "";
    width: 3.75rem;
    height: 12px;
    border-radius: 6px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    position: absolute;
    bottom: 0;
    right: -1.25rem;
    z-index: 1;
}

.index-label .label span {
    font-size: 2.25rem;
    color: #00405b;
    position: relative;
    z-index: 2;
}

.index-label p {
    font-size: max(16px, 1.25rem);
    color: #7a8799;
    font-family: "HarmonyOS_Sans_SC_Light";
    margin-top: 1.25rem;
}

.inner-page {
    position: relative;
}

.inner-page.bg {
    background: #fff url("../images/online/img-2.png") center top no-repeat;
    background-size: 100% auto;
}

.inner-page:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.c-crumbs {
    position: relative;
    z-index: 4;
    padding: 0 3.75rem;
    display: flex;
    align-items: center;
    grid-gap: calc(2.5rem + 5px);
}

.c-crumbs a {
    position: relative;
}

.c-crumbs a:after {
    content: "";
    width: 5px;
    height: 8px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/icon-3.svg");
    opacity: 0.5;
    position: absolute;
    top: 50%;
    margin-top: -4px;
    left: calc(100% + 1.25rem);
}

.c-crumbs a.home {
    width: 18px;
    height: 16px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/home.png");
    opacity: 0.5;
}

.c-crumbs a.link {
    font-size: max(13px, 1rem);
    color: rgba(0, 64, 91, 0.5);
    line-height: 60px;
}

.c-crumbs span {
    font-size: max(13px, 1rem);
    color: #00405b;
    line-height: 60px;
}

.c-items-1 .sw {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 1.5rem;
}

.c-items-1 .item {
    position: relative;
    width: calc((100% - 4.5rem) / 4);
    height: auto;
    background-color: #fff;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    border-radius: 5px;
}

.c-items-1 .item:before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid transparent;
    border-radius: 5px;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #8cce73, #00abc8);
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.c-items-1 .item a {
    display: block;
    height: 100%;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
    z-index: 2;
}

.c-items-1 .item .img-box {
    height: 11rem;
    overflow: hidden;
}

.c-items-1 .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
    will-change: transform;
}

.c-items-1 .item .txt-box {
    padding: 1.5rem 1.875rem 2.5rem;
}

.c-items-1 .item .tit {
    font-size: max(15px, 1.125rem);
    color: #00405b;
    transition: color 0.3s ease;
}

.c-items-1 .item p {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    line-height: 20px;
    margin-top: 1rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.c-items-1 .item .price {
    font-size: max(16px, 1.5rem);
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

@media (any-hover: hover) {
    .c-items-1 .item:hover:before {
        opacity: 1;
    }

    .c-items-1 .item:hover img {
        transform: scale(1.02);
    }

    .c-items-1 .item:hover .tit {
        color: #00abc8;
    }
}

.c-pages {
    margin-top: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.c-pages.t-center {
    justify-content: center;
}

.c-pages .total {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
}

.c-pages ul {
    max-width: calc(100% - 120px);
    display: flex;
    grid-gap: 1rem;
}

.c-pages ul li {
    position: relative;
}

.c-pages ul li:not(.last):before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 50%;
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.c-pages ul li a {
    position: relative;
    display: block;
    width: 32px;
    height: 32px;
    line-height: 32px;
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    border-radius: 50%;
    text-align: center;
    z-index: 2;
    transition: all 0.3s ease;
}

.c-pages ul li span {
    font-size: max(13px, 0.875rem);
    line-height: 32px;
    color: #7a8799;
}

.c-pages ul li input {
    width: 48px;
    height: 30px;
    border: 1px solid #ccd9de;
    border-radius: 5px;
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    text-align: center;
}

.c-pages ul li.prev a,
.c-pages ul li.next a {
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../img/icon-23.png");
}

@media (any-hover: hover) {

    .c-pages ul li.prev:hover a,
    .c-pages ul li.next:hover a {
        background-image: url("../img/icon-23-1.png");
    }
}

.c-pages ul li.next {
    transform: rotateY(180deg);
}

.c-pages ul li.active:before {
    opacity: 1;
}

.c-pages ul li.active a {
    color: #fff;
}

@media (any-hover: hover) {
    .c-pages ul li:hover:before {
        opacity: 1;
    }

    .c-pages ul li:hover a {
        color: #fff;
    }
}

.c-banner {
    position: relative;
    margin-top: -60px;
}

.c-banner .img-box {
    height: max(34rem, 28.125vw);
    overflow: hidden;
}

.c-banner .img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.c-banner .txt-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.c-banner .topic {
    display: inline-block;
    margin-bottom: 3.75rem;
    font-size: max(16px, 1.25rem);
    color: #fff;
    line-height: 2;
    padding: 0 4.375rem 0 1.25rem;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../images/online/img-5.png");
    background-size: 100% 100%;
}

.c-banner .tit {
    font-size: 3rem;
    color: #005072;
}

.c-banner p {
    font-size: max(16px, 1.25rem);
    color: #005072;
    margin-top: 1.25rem;
}

.c-banner .price {
    margin-top: 1.5rem;
    display: flex;
    grid-gap: 1.5rem;
    align-items: flex-end;
}

.c-banner .price span {
    font-size: 3rem;
    line-height: 1;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.c-banner .price del {
    font-size: 2.25rem;
    color: #7a8799;
}

.c-banner .btns {
    margin-top: 3.125rem;
    display: flex;
    grid-gap: 1.25rem;
}

.c-banner .btns a {
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
}

.c-banner .btns a:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.c-banner .btns a:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.c-banner .btns a span {
    padding: 0 2.5rem;
    font-size: max(14px, 1rem);
    line-height: max(40px, 3rem);
    position: relative;
    z-index: 2;
    transition: color 0.3s ease;
}

.c-banner .btns a:nth-of-type(1):after {
    opacity: 1;
}

.c-banner .btns a:nth-of-type(1) span {
    color: #fff;
}

.c-banner .btns a:nth-of-type(2) span {
    color: #00405b;
}

@media (any-hover: hover) {
    .c-banner .btns a:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-5px);
    }

    .c-banner .btns a:hover:after {
        opacity: 1;
    }

    .c-banner .btns a:hover span {
        color: #fff;
    }
}

.c-banner .drop-box {
    margin-top: 3.125rem;
    display: flex;
    grid-gap: 1.25rem;
}

.c-banner .drop-box .s-drop {
    position: relative;
}

.c-banner .drop-box .s-drop .show {
    position: relative;
    padding: 0 1.5rem;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    cursor: pointer;
}

.c-banner .drop-box .s-drop .show span {
    font-size: max(14px, 1rem);
    line-height: max(36px, 3rem);
    position: relative;
    z-index: 2;
    transition: color 0.3s ease;
    color: #fff;
}

.c-banner .drop-box .s-drop .show span:after {
    content: "";
    width: 9px;
    height: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/renzheng/icon-3-1.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0 0 2.5rem;
}

.c-banner .drop-box .s-drop .hide {
    background-color: rgba(255, 255, 255, 0.7);
    border-radius: 5px;
    position: absolute;
    top: calc(100% + 5px);
    left: 0;
    width: 100%;
    padding: 0 1.5rem;
    display: none;
}

.c-banner .drop-box .s-drop .hide a {
    display: block;
    padding: 0.75rem 0;
    border-top: 1px solid #e8f4f7;
    font-size: max(12px, 0.875rem);
    color: #00405b;
    position: relative;
}

.c-banner .drop-box .s-drop .hide a:nth-of-type(1) {
    border: none;
}

.c-banner .drop-box .s-drop .hide a:after {
    content: "";
    width: 5px;
    height: 8px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/renzheng/icon-4.png");
    position: absolute;
    right: 0;
    top: calc(50% - 4px);
}

.c-banner .drop-box .s-drop.open .hide {
    display: block;
}

.c-banner .drop-box a.single-link {
    position: relative;
    padding: 0 3rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.c-banner .drop-box a.single-link:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.c-banner .drop-box a.single-link:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.c-banner .drop-box a.single-link span {
    font-size: max(14px, 1rem);
    line-height: max(36px, 3rem);
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    position: relative;
    z-index: 2;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .c-banner .drop-box a.single-link:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-5px);
    }

    .c-banner .drop-box a.single-link:hover:after {
        opacity: 1;
    }

    .c-banner .drop-box a.single-link:hover span {
        color: #fff;
    }
}

.c-banner .form {
    margin-top: 5rem;
    width: 100%;
    max-width: 37.5rem;
    height: max(50px, 3.75rem);
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    padding-left: calc(1.875rem + 20px);
    padding-right: calc(7.5rem + 6px);
    position: relative;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

.c-banner .form:before {
    content: "";
    width: 20px;
    height: 20px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/skill/icon-1.png");
    position: absolute;
    left: 1.875rem;
    top: 50%;
    margin-top: -10px;
}

.c-banner .form input {
    width: 100%;
    height: 100%;
    padding: 0 1rem;
    font-size: 14px;
    color: #ffffff;
    background-color: transparent;
}

.c-banner .form input::-webkit-input-placeholder {
    color: #fff;
}

.c-banner .form input:-moz-placeholder {
    color: #fff;
}

.c-banner .form input::-moz-placeholder {
    color: #fff;
}

.c-banner .form input:-ms-input-placeholder {
    color: #fff;
}

.c-banner .form button {
    width: 7.5rem;
    height: calc(100% - 12px);
    border-radius: 5px;
    font-size: max(14px, 1rem);
    color: #fff;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    position: absolute;
    top: 6px;
    right: 6px;
    cursor: pointer;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .c-banner .form button:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

.inner-label .label {
    font-size: 2.25rem;
    text-align: center;
    color: #00405b;
}

.inner-label .label:after {
    content: "";
    width: 3.75rem;
    height: 4px;
    border-radius: 2px;
    display: block;
    margin: 1.5rem auto 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-label p {
    font-size: max(14px, 1.25rem);
    color: #7a8799;
    font-family: "HarmonyOS_Sans_SC_Light";
    line-height: 1.5;
    text-align: center;
    margin-top: 1.5rem;
}

.inner-label.t-left .label {
    text-align: left;
}

.inner-label.t-left .label:after {
    margin-left: 0;
}

.c-items-2 .item {
    display: block;
    padding: 2.5rem 0;
    border-bottom: 1px solid #e5e5e5;
}

.c-items-2 .item .top-box {
    display: flex;
    grid-gap: 1.875rem;
    align-items: center;
}

.c-items-2 .item .top-box .userimg {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    overflow: hidden;
}

.c-items-2 .item .top-box .img-box {
    width: 100%;
    height: 100%;
}

.c-items-2 .item .top-box img {
    display: block;
    width: 100%;
    object-fit: cover;
}

.c-items-2 .item .top-box .userinfo {
    width: calc(100% - 60px - 1.875rem);
}

.c-items-2 .item .top-box .name {
    display: inline-block;
    font-size: max(16px, 1.25rem);
    color: #005072;
}

.c-items-2 .item .top-box .view {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
    margin-top: 5px;
}

.c-items-2 .item .top-box .view:before {
    content: "";
    width: 16px;
    height: 10px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/skill/icon-8.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 10px 0 0;
}

.c-items-2 .item .mid-box {
    margin: 1.875rem 0 0 calc(60px + 1.875rem);
}

.c-items-2 .item .mid-box .box {
    display: block;
}

.c-items-2 .item .mid-box .tit {
    font-size: max(16px, 1.25rem);
    color: #005072;
    line-height: 1.5;
    transition: color 0.3s ease;
}

.c-items-2 .item .mid-box .para {
    margin-top: 1rem;
    font-size: max(13px, 1rem);
    color: #7a8799;
    line-height: 1.5;
}

.c-items-2 .item .mid-box .img-group {
    margin-top: 1.5rem;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    grid-gap: 10px;
}

.c-items-2 .item .mid-box .img-group .img {
    width: 10rem;
    overflow: hidden;
}

.c-items-2 .item .mid-box .img-group img {
    display: block;
    width: 100%;
}

.c-items-2 .item .bot-box {
    margin: 1.875rem 0 0 calc(60px + 1.875rem);
    display: flex;
    justify-content: space-between;
}

.c-items-2 .item .bot-box .date {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
}

.c-items-2 .item .bot-box .date:before {
    content: "";
    width: 14px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/skill/icon-2.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 10px 0 0;
}

.c-items-2 .item .bot-box .ope {
    display: flex;
    grid-gap: 3.75rem;
}

.c-items-2 .item .bot-box .like {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
}

.c-items-2 .item .bot-box .like:before {
    content: "";
    width: 15px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/skill/icon-9.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 10px 0 0;
}

.c-items-2 .item .bot-box .comment {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
}

.c-items-2 .item .bot-box .comment:before {
    content: "";
    width: 16px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/skill/icon-10.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 10px 0 0;
}

@media (any-hover: hover) {
    .c-items-2 .item:hover .mid-box .tit {
        color: #00abc8;
    }
}

.fixed-enroll-success {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 20;
    display: none;
}

.fixed-enroll-success .main {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 50%;
    transform: translateY(-50%);
    width: 90%;
    max-width: 480px;
    background-color: #fff;
    border-radius: 5px;
    position: relative;
    padding: 4.375rem 2.5rem 2.5rem;
}

.fixed-enroll-success .close {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 20px;
    right: 20px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/close-1.png");
    cursor: pointer;
}

.fixed-enroll-success i {
    display: block;
    width: 60px;
    height: 60px;
    margin: 0 auto;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/skill/pop-1.png");
}

.fixed-enroll-success .tit {
    font-size: max(18px, 1.5rem);
    color: #00405b;
    text-align: center;
    margin-top: 1rem;
}

.fixed-enroll-success .btn {
    position: relative;
    margin: 3.75rem auto 0;
    width: max(120px, 11.25rem);
    cursor: pointer;
    transition: all 0.3s ease;
}

.fixed-enroll-success .btn:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.fixed-enroll-success .btn span {
    display: block;
    width: 100%;
    line-height: max(40px, 3rem);
    font-size: 14px;
    color: #00405b;
    text-align: center;
    border: 1px solid #e5e5e5;
    border-radius: 5px;
    position: relative;
    z-index: 2;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .fixed-enroll-success .btn:hover:before {
        opacity: 1;
    }

    .fixed-enroll-success .btn:hover span {
        color: #fff;
    }
}

.index-s1 {
    position: relative;
}

.index-s1 .swiper {
    height: max(540px, 40rem);
}

.index-s1 .swiper .item {
    position: relative;
}

.index-s1 .swiper .item .bg-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.index-s1 .swiper .item .bg-box .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: right center;
    background-repeat: no-repeat;
    background-size: cover;
}

.index-s1 .swiper .item .bg-box .bg.pc {
    display: block;
}

.index-s1 .swiper .item .bg-box .bg.m {
    display: none;
}

.index-s1 .swiper .item .txt-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.index-s1 .swiper .item .txt {
    padding-left: 360px;
}

.index-s1 .swiper .item .tips {
    display: inline-block;
    font-size: max(16px, 1.25rem);
    color: #fff;
    line-height: 2;
    padding: 0 4.375rem 0 1.25rem;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../images/online/img-5.png");
    background-size: 100% 100%;
}

.index-s1 .swiper .item .year {
    display: inline-block;
    font-size: max(18px, 1.75rem);
    font-weight: bold;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.index-s1 .swiper .item .topic {
    display: inline-block;
    font-size: max(18px, 1.75rem);
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.index-s1 .swiper .item .tit {
    font-size: 2.5rem;
    color: #00405b;
    margin-top: 0.625rem;
}

.index-s1 .swiper .item p {
    font-size: max(16px, 1.25rem);
    color: #7a8799;
    font-family: "HarmonyOS_Sans_SC_Light";
    margin-top: 1.25rem;
    font-style: italic;
}

.index-s1 .swiper .item .btns {
    margin-top: 3.125rem;
    display: flex;
}

.index-s1 .swiper .item .btns a {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0 3rem;
    transition: all 0.3s ease;
}

.index-s1 .swiper .item .btns a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: max(20px, 1.5rem);
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #f4f8f8, #f4f8f8), linear-gradient(90deg, #8cce73, #00abc8);
}

.index-s1 .swiper .item .btns a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: max(20px, 1.5rem);
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transition: opacity 0.3s ease;
}

.index-s1 .swiper .item .btns a span {
    font-size: max(13px, 0.875rem);
    line-height: max(40px, 3rem);
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .index-s1 .swiper .item .btns a:hover {
        transform: translateY(-5px);
    }

    .index-s1 .swiper .item .btns a:hover:after {
        opacity: 1;
    }

    .index-s1 .swiper .item .btns a:hover span {
        color: #fff;
    }
}

.index-s1 .pagination {
    position: absolute;
    bottom: 3.75rem;
    display: flex;
    justify-content: center;
    grid-gap: 10px;
    z-index: 2;
}

.index-s1 .pagination span {
    width: 10px;
    height: 2px;
    background-color: rgba(0, 0, 0, 0.2);
    position: relative;
    cursor: pointer;
    transition: width 0.3s ease;
}

.index-s1 .pagination span:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    transform-origin: left top;
    transform: scaleX(0);
}

.index-s1 .pagination span.active {
    width: 3.75rem;
}

.index-s1 .pagination span.active:before {
    animation: o-scale-x 5s linear forwards;
}

.index-s1 .button {
    position: absolute;
    top: 50%;
    width: max(40px, 3.75rem);
    height: max(40px, 3.75rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    z-index: 2;
    transform: translateY(-50%);
}

.index-s1 .prev {
    left: 3.75rem;
    background-image: url("../images/index/prev-1.png");
}

@media (any-hover: hover) {
    .index-s1 .prev:hover {
        background-image: url("../images/index/prev-2.png");
    }
}

.index-s1 .next {
    right: 3.75rem;
    background-image: url("../images/index/next-1.png");
}

@media (any-hover: hover) {
    .index-s1 .next:hover {
        background-image: url("../images/index/next-2.png");
    }
}

.index-s1 .menu-block {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
    pointer-events: none;
}

.index-s1 .menu-block .wrap-s {
    height: 100%;
    display: flex;
    align-items: center;
}

.index-s1 .menu-block .block {
    width: 100%;
    position: relative;
}

.index-s1 .menu-left {
    width: 312px;
    border-radius: 5px;
    background-color: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    pointer-events: auto;
    position: relative;
    z-index: 2;
}

.index-s1 .menu-left .label {
    font-size: max(14px, 1rem);
    color: #fff;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    line-height: 40px;
    padding: 0 1.875rem;
}

.index-s1 .menu-left .item {
    position: relative;
    padding: 1.875rem;
}

.index-s1 .menu-left .item:before {
    content: "";
    width: 4px;
    height: 2.5rem;
    position: absolute;
    right: 0;
    top: calc(50% - 1.25rem);
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    display: none;
}

.index-s1 .menu-left .item:after {
    content: "";
    height: 1px;
    position: absolute;
    left: 1.875rem;
    right: 1.875rem;
    bottom: 0;
    background-color: rgba(3, 172, 198, 0.1);
}

.index-s1 .menu-left .item:last-of-type:after {
    display: none;
}

.index-s1 .menu-left .item .tit a {
    font-size: max(14px, 1rem);
    color: #005072;
    display: inline-block;
}

.index-s1 .menu-left .item .s-link {
    margin-top: 5px;
    display: flex;
    grid-gap: 5px;
}

.index-s1 .menu-left .item .s-link a {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
    transition: color 0.3s ease;
}

.index-s1 .menu-left .item .s-link a:before {
    content: "·";
    font-size: max(12px, 0.875rem);
    color: #7a8799;
    display: inline-block;
    vertical-align: top;
    margin-right: 5px;
}

.index-s1 .menu-left .item .s-link a:nth-of-type(1):before {
    display: none;
}

@media (any-hover: hover) {
    .index-s1 .menu-left .item .s-link a:hover {
        color: #00abc8;
    }
}

.index-s1 .menu-left .item.active:before {
    display: block;
}

.index-s1 .menu-right {
    width: max(600px, 48.75rem);
    height: 100%;
    position: absolute;
    left: 312px;
    top: 0;
    z-index: 1;
}

.index-s1 .menu-right .child {
    position: relative;
    height: 100%;
    padding-left: 12px;
    background-color: #fff;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 0 5px 5px 0;
    pointer-events: auto;
    display: none;
}

.index-s1 .menu-right .child.bg-1 {
    background-image: url("../images/index/nav-1.jpg");
}

.index-s1 .menu-right .child.bg-2 {
    background-image: url("../images/index/nav-2.jpg");
}

.index-s1 .menu-right .child.bg-3 {
    background-image: url("../images/index/nav-3.jpg");
}

.index-s1 .menu-right .child.bg-4 {
    background-image: url("../images/index/nav-4.jpg");
}

.index-s1 .menu-right .child.bg-5 {
    background-image: url("../images/index/nav-5.jpg");
}

.index-s1 .menu-right .child.active {
    display: block;
}

.index-s1 .menu-right .items {
    padding: 2.5rem 1rem 0 1.875rem;
}

.index-s1 .menu-right .items .item {
    display: flex;
    align-items: center;
    margin-top: 1.875rem;
}

.index-s1 .menu-right .items .item:nth-of-type(1) {
    margin-top: 0;
}

.index-s1 .menu-right .items .item .tit {
    width: 10rem;
    display: flex;
    align-items: center;
    grid-gap: 8px;
    padding: 5px 0;
    border-right: 1px solid #cccccc;
}

.index-s1 .menu-right .items .item .tit i {
    width: max(12px, 1rem);
    height: max(12px, 1rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.index-s1 .menu-right .items .item .tit span {
    font-size: max(13px, 1rem);
    line-height: max(16px, 1.125rem);
    color: #00405b;
    max-width: calc(100% - 22px);
}

.index-s1 .menu-right .items .item .link {
    width: calc(100% - 10rem);
    display: flex;
    grid-gap: 1.875rem;
    padding-left: 2.5rem;
}

.index-s1 .menu-right .items .item .link a {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .index-s1 .menu-right .items .item .link a:hover {
        color: #00abc8;
    }
}

.index-s1 .menu-right .tips {
    position: absolute;
    bottom: 0;
    left: calc(12px + 1.875rem);
    right: 1.875rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    padding: 1.875rem 0;
    display: flex;
    grid-gap: 3.125rem;
}

.index-s1 .menu-right .tips a {
    display: block;
    text-align: center;
    font-size: max(12px, 0.875rem);
    color: #00405b;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .index-s1 .menu-right .tips a:hover {
        color: #00abc8;
    }
}

.index-s1 .menu-right .linkicon-box {
    padding: 3.75rem 10rem 0 3.75rem;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 1.875rem;
}

.index-s1 .menu-right .linkicon-box .item {
    width: max(70px, 6.25rem);
    height: max(70px, 6.25rem);
    position: relative;
}

.index-s1 .menu-right .linkicon-box .item:before {
    content: "";
    width: 100%;
    height: 100%;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 0.625rem;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.index-s1 .menu-right .linkicon-box .item a {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 2;
    border: 1px solid #e5e5e5;
    border-radius: 0.625rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    grid-gap: 0.75rem;
    transition: all 0.3s ease;
}

.index-s1 .menu-right .linkicon-box .item .icon {
    width: 24px;
    height: 20px;
    position: relative;
}

.index-s1 .menu-right .linkicon-box .item i {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: opacity 0.3s ease;
}

.index-s1 .menu-right .linkicon-box .item i.hide {
    opacity: 0;
}

.index-s1 .menu-right .linkicon-box .item span {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .index-s1 .menu-right .linkicon-box .item:hover:before {
        opacity: 1;
    }

    .index-s1 .menu-right .linkicon-box .item:hover a {
        border-color: transparent;
    }

    .index-s1 .menu-right .linkicon-box .item:hover i.show {
        opacity: 0;
    }

    .index-s1 .menu-right .linkicon-box .item:hover i.hide {
        opacity: 1;
    }

    .index-s1 .menu-right .linkicon-box .item:hover span {
        color: #ffffff;
    }
}

.m-index-s2 {
    padding-top: 3rem;
    display: none;
    position: relative;
    z-index: 4;
}

.m-index-s2 .items {
    display: flex;
    justify-content: space-between;
}

.m-index-s2 .item .icon {
    width: 50px;
    height: 50px;
    border-radius: 5px;
    position: relative;
}

.m-index-s2 .item .icon:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background-image: linear-gradient(135deg, #8cce73, #00abc8);
    opacity: 0.1;
}

.m-index-s2 .item .icon i {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 2;
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto 20px;
}

.m-index-s2 .item span {
    display: block;
    font-size: 12px;
    color: #00405b;
    text-align: center;
    margin-top: 5px;
}

.index-s2 {
    padding: 3.75rem 0 0;
    position: relative;
}

.index-s2:before {
    content: "";
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: -7.5rem;
    background: #fff url("../images/online/img-2.png") center top no-repeat;
    background-size: 100% 100%;
}

.index-s2 .sw {
    display: flex;
    grid-gap: 1.5rem;
}

.index-s2 .item {
    width: calc((100% - 3rem) / 3);
    box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    overflow: hidden;
}

.index-s2 .item a {
    position: relative;
    display: block;
}

.index-s2 .item .img-box {
    height: 11rem;
    overflow: hidden;
}

.index-s2 .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
    will-change: transform;
}

.index-s2 .item .tit-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 1.875rem;
}

.index-s2 .item .tit {
    font-size: max(16px, 1.25rem);
    color: #fff;
}

.index-s2 .item .tips {
    position: absolute;
    top: 10px;
    left: 10px;
    display: flex;
    grid-gap: 2px;
    z-index: 2;
}

.index-s2 .item .tips span {
    padding: 0 8px;
    font-size: 12px;
    color: #fff;
    line-height: 20px;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 3px;
}

.index-s2 .item .ope {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 0 1.875rem 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 2;
}

.index-s2 .item .ope:before {
    content: "";
    width: 100%;
    height: 4.375rem;
    position: absolute;
    bottom: 0;
    left: 0;
    background-image: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(2, 171, 199, 0.5));
    pointer-events: none;
    z-index: 0;
}

.index-s2 .item .ope span {
    font-size: 12px;
    color: #fff;
    position: relative;
    z-index: 1;
}

.index-s2 .item .ope span:before {
    content: "";
    width: 12px;
    height: 12px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/index/icon-2.svg");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 5px 0 0;
}

.index-s2 .item .ope i {
    font-size: 12px;
    color: #fff;
    font-style: normal;
    position: relative;
    z-index: 1;
}

@media (any-hover: hover) {
    .index-s2 .item:hover img {
        transform: scale(1.05);
    }
}

.index-s3 {
    padding: 9.375rem 0 0;
    position: relative;
}

.index-s3:before {
    content: "";
    width: 100%;
    height: 68.5vw;
    position: absolute;
    bottom: -36vw;
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/index/img-5.png");
    z-index: 0;
    pointer-events: none;
}

.index-s3 .block {
    margin-top: 2.5rem;
    position: relative;
}

.index-s3 .single-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: grid;
    grid-gap: 1.5rem;
    grid-template-columns: repeat(4, calc((100% - 4.5rem) / 4));
    grid-template-rows: repeat(2, calc((100% - 1.5rem) / 2));
    pointer-events: none;
}

.index-s3 .single-box .single-items {
    pointer-events: auto;
    grid-column: 1/3;
    position: relative;
}

.index-s3 .single-box .swiper {
    height: 100%;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    overflow: hidden;
}

.index-s3 .single-box .single-item {
    height: 100%;
}

.index-s3 .single-box .single-item a {
    display: block;
    height: 100%;
    position: relative;
}

.index-s3 .single-box .single-item .img-box {
    height: 100%;
    overflow: hidden;
}

.index-s3 .single-box .single-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: left;
    transition: transform 0.5s ease;
}

.index-s3 .single-box .single-item .txt-box {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 1.875rem;
}

.index-s3 .single-box .single-item .txt-box:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 6.25rem;
    background-image: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.5));
    z-index: 1;
    pointer-events: none;
}

.index-s3 .single-box .single-item .tit {
    font-size: max(15px, 1.125rem);
    color: #fff;
    position: relative;
    z-index: 2;
    margin-right: 100px;
}

@media (any-hover: hover) {
    .index-s3 .single-box .single-item:hover img {
        transform: scale(1.02);
    }
}

.index-s3 .single-box .pagination {
    width: auto;
    left: auto;
    right: 0;
    position: absolute;
    right: 1.875rem;
    bottom: 1rem;
    display: flex;
    grid-gap: 10px;
    z-index: 3;
}

.index-s3 .single-box .pagination span {
    width: 10px;
    height: 2px;
    background-color: rgba(255, 255, 255, 0.2);
    position: relative;
    cursor: pointer;
    transition: width 0.3s ease;
}

.index-s3 .single-box .pagination span:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    transform-origin: left top;
    transform: scaleX(0);
}

.index-s3 .single-box .pagination span.active {
    width: 30px;
}

.index-s3 .single-box .pagination span.active:before {
    animation: o-scale-x 5s linear forwards;
}

.index-s3 .items .sw {
    display: grid;
    grid-gap: 1.5rem;
    grid-template-columns: repeat(4, calc((100% - 4.5rem) / 4));
    grid-template-rows: repeat(2, calc((100% - 1.5rem) / 2));
}

.index-s3 .items .item {
    position: relative;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.1);
}

.index-s3 .items .item:nth-of-type(1) {
    grid-column: 1/3;
    opacity: 0;
    pointer-events: none;
}

.index-s3 .items .item:before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid transparent;
    border-radius: 5px;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #8cce73, #00abc8);
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.index-s3 .items .item a {
    display: block;
    height: 100%;
    padding-bottom: 5rem;
    position: relative;
    z-index: 2;
    border-radius: 5px;
    overflow: hidden;
}

.index-s3 .items .item .img-box {
    height: 11rem;
    overflow: hidden;
}

.index-s3 .items .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
    will-change: transform;
}

.index-s3 .items .item .txt-box {
    padding: 1.875rem 1.875rem 0;
}

.index-s3 .items .item .tit {
    font-size: max(15px, 1.125rem);
    color: #00405b;
    transition: color 0.3s ease;
}

.index-s3 .items .item p {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    line-height: 20px;
    margin-top: 1rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.index-s3 .items .item span {
    width: 6px;
    height: 10px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/index/icon-3.png");
    position: absolute;
    bottom: 1.875rem;
    left: 1.875rem;
}

@media (any-hover: hover) {
    .index-s3 .items .item:hover:before {
        opacity: 1;
    }

    .index-s3 .items .item:hover img {
        transform: scale(1.02);
    }

    .index-s3 .items .item:hover .tit {
        color: #00abc8;
    }
}

.index-s3 .btns {
    margin-top: 2.5rem;
    display: flex;
    justify-content: center;
}

.index-s3 .btns a {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0 3rem;
    transition: all 0.3s ease;
}

.index-s3 .btns a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: max(20px, 1.5rem);
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #e6f6f3, #e6f6f3), linear-gradient(90deg, #8cce73, #00abc8);
}

.index-s3 .btns a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: max(20px, 1.5rem);
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transition: opacity 0.3s ease;
}

.index-s3 .btns a span {
    font-size: max(13px, 0.875rem);
    line-height: max(40px, 3rem);
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .index-s3 .btns a:hover {
        transform: translateY(-5px);
    }

    .index-s3 .btns a:hover:after {
        opacity: 1;
    }

    .index-s3 .btns a:hover span {
        color: #fff;
    }
}

.index-s4 {
    padding: 9.375rem 0 0;
    position: relative;
}

.index-s4 .items {
    position: relative;
    margin-top: 2.5rem;
}

.index-s4 .sw {
    display: flex;
}

.index-s4 .item {
    position: relative;
    width: calc((100% - 32.5rem) / 3);
    height: 30rem;
    overflow: hidden;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.05);
    transition: width 0.3s ease;
}

.index-s4 .item .box {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}

.index-s4 .item .show {
    height: 100%;
    background-color: rgba(255, 255, 255, 0.5);
    border: 1px solid #e4e7eb;
    border-radius: 5px;
    padding: 8.75rem 1.875rem 0;
    transition: all 0.3s ease;
}

.index-s4 .item .show i {
    display: block;
    margin: 0 auto;
    width: 3.75rem;
    height: 4.375rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.index-s4 .item .show .tit {
    margin-top: 2rem;
    height: max(50px, 3.75rem);
    display: flex;
    align-items: center;
}

.index-s4 .item .show .tit span {
    display: block;
    width: 100%;
    font-size: max(15px, 1.125rem);
    color: #00405b;
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.index-s4 .item .show p {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    line-height: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.index-s4 .item .hide {
    position: absolute;
    top: 0;
    left: 0;
    width: 32.5rem;
    height: 100%;
    border: 1px solid transparent;
    border-radius: 5px;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: all 0.3s ease;
}

.index-s4 .item .hide .tit {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.25rem;
    height: max(60px, 5rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../images/index/img-10.jpg");
}

.index-s4 .item .hide .tit i {
    width: 1.875rem;
    height: 1.875rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.index-s4 .item .hide .tit span {
    max-width: calc(100% - 1.875rem);
    font-size: max(16px, 1.5rem);
    padding-left: 1.25rem;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.index-s4 .item .hide p {
    margin: 2rem 2rem 0;
    text-align: center;
    font-size: max(15px, 1.125rem);
    color: #7a8799;
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.index-s4 .item .hide .img-box {
    margin: 2rem auto 0;
    width: 10.6rem;
    height: 14rem;
    position: relative;
    perspective: 800px;
}

.index-s4 .item .hide .img-box:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    right: 100%;
    top: 0;
    background: url("../images/index/img-8.png") right top no-repeat;
    background-size: auto 100%;
}

.index-s4 .item .hide .img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform-style: preserve-3d;
    transform-origin: left center;
    transform: rotateY(30deg);
    box-shadow: 0 0.625rem 1.875rem rgba(0, 0, 0, 0.1);
}

.index-s4 .item.active {
    width: 32.5rem;
}

.index-s4 .item.active .show {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.index-s4 .item.active .hide {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.index-s4 .btns {
    margin-top: 2.5rem;
    display: flex;
    justify-content: center;
}

.index-s4 .btns a {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0 3rem;
    transition: all 0.3s ease;
}

.index-s4 .btns a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: max(20px, 1.5rem);
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #8cce73, #00abc8);
}

.index-s4 .btns a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: max(20px, 1.5rem);
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transition: opacity 0.3s ease;
}

.index-s4 .btns a span {
    font-size: max(13px, 0.875rem);
    line-height: max(40px, 3rem);
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .index-s4 .btns a:hover {
        transform: translateY(-5px);
    }

    .index-s4 .btns a:hover:after {
        opacity: 1;
    }

    .index-s4 .btns a:hover span {
        color: #fff;
    }
}

.index-s5 {
    padding: 9.375rem 0 0;
    position: relative;
}

.index-s5 .bg-block {
    width: 100%;
    height: 56vw;
    position: absolute;
    top: calc(100% - 16.25rem);
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 0;
    pointer-events: none;
}

.index-s5 .bg-block .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 0;
}

.index-s5 .bg-block .bg.active {
    opacity: 1;
}

.index-s5 .items {
    margin-top: 2.5rem;
}

.index-s5 .sw {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 1.5rem;
}

.index-s5 .item {
    width: calc((100% - 3rem) / 3);
    background-image: linear-gradient(180deg, #ddebf0, 30%, #ffffff);
    border-radius: 5px;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.index-s5 .item a {
    display: block;
    height: 100%;
    position: relative;
}

.index-s5 .item .img-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.index-s5 .item .img-box:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    z-index: 2;
    opacity: 0.9;
}

.index-s5 .item .img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.index-s5 .item .txt-box {
    position: relative;
    border-radius: 5px;
    padding: 2.5rem 1.875rem 0;
    z-index: 2;
}

.index-s5 .item .tit {
    display: inline-block;
    font-size: max(16px, 1.5rem);
    font-family: "HarmonyOS_Sans_SC_Bold";
    color: #00405b;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: all 0.3s ease;
}

.index-s5 .item .tips {
    margin-top: 0.625rem;
    display: flex;
    grid-gap: 4px;
}

.index-s5 .item .tips span {
    font-size: 12px;
    color: #7a8799;
    line-height: 22px;
    padding: 0 10px;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 3px;
    transition: all 0.3s ease;
}

.index-s5 .item .salary {
    margin-top: 2rem;
    text-align: right;
    font-size: max(16px, 1.5rem);
    color: #00405b;
    font-family: "Rajdhani-Medium";
    padding-bottom: 1.25rem;
    border-bottom: 1px solid #e4e7eb;
    transition: all 0.3s ease;
}

.index-s5 .item .ope {
    height: max(50px, 3.75rem);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.index-s5 .item .ope .logo {
    width: 70px;
    height: 40px;
}

.index-s5 .item .ope .logo img {
    width: auto;
    max-width: 100%;
    max-height: 100%;
}

.index-s5 .item .ope span {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    transition: color 0.3s ease;
}

.index-s5 .item .ope span:before {
    content: "";
    width: 12px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/index/icon-6.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0.625rem 0 0;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .index-s5 .item:hover .img-box {
        opacity: 1;
    }

    .index-s5 .item:hover .tit {
        color: #fff;
    }

    .index-s5 .item:hover .salary {
        color: #fff;
        border-bottom-color: rgba(255, 255, 255, 0.3);
    }

    .index-s5 .item:hover .ope span {
        color: rgba(255, 255, 255, 0.5);
    }

    .index-s5 .item:hover .ope span:before {
        background-image: url("../images/index/icon-6-1.png");
    }
}

.index-s5 .btns {
    margin-top: 2.5rem;
    display: flex;
    justify-content: center;
}

.index-s5 .btns a {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0 3rem;
    transition: all 0.3s ease;
}

.index-s5 .btns a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: max(20px, 1.5rem);
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ecf8f5, #ecf8f5), linear-gradient(90deg, #8cce73, #00abc8);
}

.index-s5 .btns a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: max(20px, 1.5rem);
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transition: opacity 0.3s ease;
}

.index-s5 .btns a span {
    font-size: max(13px, 0.875rem);
    line-height: max(40px, 3rem);
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .index-s5 .btns a:hover {
        transform: translateY(-5px);
    }

    .index-s5 .btns a:hover:after {
        opacity: 1;
    }

    .index-s5 .btns a:hover span {
        color: #fff;
    }
}

.index-s6 {
    padding: 9.375rem 0 0;
    position: relative;
}

.index-s6 .tab-tit {
    display: flex;
    grid-gap: 3.75rem;
}

.index-s6 .tab-tit .item {
    position: relative;
    cursor: pointer;
}

.index-s6 .tab-tit .item:after {
    content: "";
    width: 3.75rem;
    height: 12px;
    border-radius: 6px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    position: absolute;
    bottom: 0;
    right: -1.25rem;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.index-s6 .tab-tit .item span {
    font-size: 2.25rem;
    color: #00405b;
    opacity: 0.3;
    position: relative;
    z-index: 2;
    transition: opacity 0.3s ease;
}

.index-s6 .tab-tit .item.active:after {
    opacity: 1;
}

.index-s6 .tab-tit .item.active span {
    opacity: 1;
}

@media (any-hover: hover) {
    .index-s6 .tab-tit .item:hover span {
        opacity: 1;
    }
}

.index-s6 .para {
    font-size: max(16px, 1.25rem);
    color: #7a8799;
    font-family: "HarmonyOS_Sans_SC_Light";
    margin-top: 1.25rem;
}

.index-s6 .data-box {
    margin-top: 3.75rem;
    display: flex;
    grid-gap: 7.5rem;
}

.index-s6 .data .num {
    position: relative;
}

.index-s6 .data .show {
    position: absolute;
    top: 0;
    left: 0;
}

.index-s6 .data .hide {
    opacity: 0;
}

.index-s6 .data span {
    font-size: 3.75rem;
    font-family: "Rajdhani-Bold";
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.index-s6 .data i {
    font-size: max(15px, 1.125rem);
    color: #00405b;
    font-style: normal;
}

.index-s6 .data p {
    font-size: max(15px, 1.125rem);
    color: #00405b;
}

.index-s6 .tab-cont .child {
    display: none;
}

.index-s6 .tab-cont .child.active {
    display: block;
}

.index-s6 .swiper {
    padding: 8.75rem 0 40px;
    margin: 0 -12px;
}

.index-s6 .swiper-1 .item {
    width: calc(33.33% - 24px);
    margin: 0 12px;
    padding: 1.875rem;
    height: auto;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.08);
}

.index-s6 .swiper-1 .item .img-box {
    width: 6.25rem;
    height: 6.25rem;
    margin: 0 auto;
    border-radius: 50%;
    overflow: hidden;
}

.index-s6 .swiper-1 .item .img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.index-s6 .swiper-1 .item .tit {
    font-size: max(16px, 1.5rem);
    color: #00405b;
    text-align: center;
    margin-top: 1rem;
}

.index-s6 .swiper-1 .item .pos {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    text-align: center;
    margin-top: 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.index-s6 .swiper-1 .item .s-para {
    margin-top: 1.25rem;
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.index-s6 .swiper-1 .item .s-para.b-text {
    -webkit-line-clamp: 6;
}

.index-s6 .swiper-1 .item .more {
    position: absolute;
    bottom: 0;
    left: 1.875rem;
    right: 1.875rem;
    border-top: 1px solid #e4e7eb;
    line-height: max(50px, 4.375rem);
    font-size: max(13px, 0.875rem);
    color: #7a8799;
}

.index-s6 .swiper-1 .item .more:after {
    content: "";
    width: 6px;
    height: 10px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/index/icon-3.png");
    position: absolute;
    right: 0;
    top: calc(50% - 5px);
}

.index-s6 .swiper-2 .item {
    width: calc(20.625rem - 12px);
    margin: 0 12px;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.08);
    transition: width 0.3s ease;
}

.index-s6 .swiper-2 .item a {
    display: block;
    height: auto;
}

.index-s6 .swiper-2 .item .show {
    border-radius: 5px;
    border: 1px solid #fff;
    background: #fff url("../images/index/img-15.png") center top no-repeat;
    background-size: 100% auto;
    padding: 0 1.875rem max(50px, 4.375rem);
    position: relative;
    z-index: 1;
    transition: opacity 0.3s ease;
}

.index-s6 .swiper-2 .item .show .top-box {
    padding: 1.875rem 0;
}

.index-s6 .swiper-2 .item .show .img-box {
    margin: 0 auto;
    width: 6.25rem;
    height: 6.25rem;
    border-radius: 50%;
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../images/index/img-18.png");
    padding-top: 1rem;
}

.index-s6 .swiper-2 .item .show .img-box img {
    display: block;
    width: 100%;
}

.index-s6 .swiper-2 .item .show .tit {
    text-align: center;
    margin-top: 2rem;
}

.index-s6 .swiper-2 .item .show .pos {
    text-align: center;
}

.index-s6 .swiper-2 .item .hide {
    border-radius: 5px;
    border: 1px solid #fff;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(41.25rem - 24px);
    height: 100%;
    background: #fff url("../images/index/img-16.png") center top no-repeat;
    background-size: 100% auto;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 2;
}

.index-s6 .swiper-2 .item .hide .img-box {
    width: 18.125rem;
    padding-right: 3.75rem;
    position: absolute;
    right: 0;
    bottom: 0;
    top: -6.25rem;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.index-s6 .swiper-2 .item .hide .img-box img {
    max-width: 100%;
    max-height: 100%;
}

.index-s6 .swiper-2 .item .hide .txt-box {
    width: calc(100% - 18.125rem);
    height: 100%;
    padding: 1.875rem 1.875rem max(50px, 4.375rem);
    position: relative;
}

.index-s6 .swiper-2 .item .hide .s-para {
    margin-top: 1.25rem;
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.index-s6 .swiper-2 .item .tit {
    font-size: max(16px, 1.5rem);
    color: #00405b;
}

.index-s6 .swiper-2 .item .pos {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    margin-top: 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.index-s6 .swiper-2 .item .more {
    position: absolute;
    bottom: 0;
    left: 1.875rem;
    right: 1.875rem;
    border-top: 1px solid #e4e7eb;
    line-height: max(50px, 4.375rem);
    font-size: max(13px, 0.875rem);
    color: #7a8799;
}

.index-s6 .swiper-2 .item .more:after {
    content: "";
    width: 6px;
    height: 10px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/index/icon-3.png");
    position: absolute;
    right: 0;
    top: calc(50% - 5px);
}

.index-s6 .swiper-2 .item.active {
    width: calc(41.25rem - 24px);
}

.index-s6 .swiper-2 .item.active .show {
    opacity: 0;
}

.index-s6 .swiper-2 .item.active .hide {
    opacity: 1;
}

.index-s6 .swiper-horizontal>.swiper-scrollbar {
    width: 70%;
    height: 3px;
    left: 15%;
    bottom: 6px;
    background-color: #ccd9de;
}

.index-s6 .swiper-scrollbar-drag {
    height: 7px;
    top: -2px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    cursor: pointer;
    border-radius: 0;
}

.index-s7 {
    padding: 7.5rem 0 3.75rem;
    overflow: hidden;
}

.index-s7 .img-box {
    width: 100%;
    max-width: 88rem;
}

.index-s7 .img-box img {
    display: block;
    width: 100%;
}

.index-s8 {
    padding: 5rem 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../images/index/img-1.jpg");
}

.index-s8 .flex {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.index-s8 .flex .left-box .tit {
    font-size: 2.25rem;
    color: #fff;
}

.index-s8 .flex .left-box p {
    font-size: max(16px, 1.25rem);
    color: rgba(255, 255, 255, 0.5);
    font-family: "HarmonyOS_Sans_SC_Light";
    margin-top: 1rem;
}

.index-s8 .flex .left-box .btns {
    margin-top: 2rem;
    display: flex;
}

.index-s8 .flex .left-box a {
    padding: 0 2.5rem;
    line-height: max(40px, 3rem);
    font-size: max(13px, 0.85rem);
    color: #fff;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: max(20px, 1.5rem);
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .index-s8 .flex .left-box a:hover {
        transform: translateY(-5px);
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

.index-s8 .flex .right-box {
    display: flex;
    grid-gap: 1.5rem;
}

.index-s8 .flex .right-box .ewm .img-box {
    width: max(90px, 7.5rem);
    margin: 0 auto;
}

.index-s8 .flex .right-box .ewm .img-box img {
    display: block;
    width: 100%;
}

.index-s8 .flex .right-box .ewm p {
    font-size: max(13px, 0.875rem);
    color: #fff;
    text-align: center;
    margin-top: 10px;
}

.inner-s1 {
    margin-top: -60px;
    padding: calc(3.75rem + 60px) 0 0;
}

.inner-s1.pd-1 {
    margin-top: 0;
    padding: 5.625rem 0 6.25rem;
    background-color: #f0f5f8;
}

.inner-s1.pd-2 {
    margin-top: 0;
    padding: 5rem 0 7.5rem;
}

.inner-s1 .label {
    font-size: 2.25rem;
    color: #00405b;
    padding-left: 1.25rem;
    position: relative;
}

.inner-s1 .label:before {
    content: "";
    width: 4px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    border-radius: 2px;
}

.inner-s1 .para {
    font-size: max(13px, 1rem);
    color: #7a8799;
    line-height: 2;
    margin-top: 1.25rem;
}

.inner-s1 .price {
    margin-top: 1.5rem;
}

.inner-s1 .price span {
    font-size: 2.5rem;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    font-family: "HarmonyOS_Sans_SC_Light";
}

.inner-s1 .ope {
    margin-top: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.inner-s1 .btns {
    display: flex;
    grid-gap: 10px;
}

.inner-s1 .btns a {
    position: relative;
    padding: 0 2.5rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.inner-s1 .btns a:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    box-sizing: border-box;
    border: 2px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s1 .btns a:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s1 .btns a span {
    font-size: max(14px, 1rem);
    line-height: max(40px, 3rem);
    position: relative;
    z-index: 2;
    transition: color 0.3s ease;
}

.inner-s1 .btns a:nth-of-type(1):after {
    opacity: 1;
}

.inner-s1 .btns a:nth-of-type(1) span {
    color: #fff;
}

.inner-s1 .btns a:nth-of-type(2) span {
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

@media (any-hover: hover) {
    .inner-s1 .btns a:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-5px);
    }

    .inner-s1 .btns a:hover:after {
        opacity: 1;
    }

    .inner-s1 .btns a:hover span {
        color: #fff;
    }
}

.inner-s1 .tips {
    display: flex;
    grid-gap: 3.75rem;
}

.inner-s1 .tip {
    display: flex;
    align-items: center;
    grid-gap: 1.25rem;
}

.inner-s1 .tip span {
    border-radius: 3px;
    padding: 0 8px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s1 .tip i {
    display: block;
    line-height: 24px;
    font-size: max(12px, 0.875rem);
    font-style: normal;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s1 .tip p {
    font-size: max(12px, 0.875rem);
    color: #00405b;
}

.inner-s1 .tip a {
    font-size: max(12px, 0.875rem);
    color: #00405b;
    transition: color 0.3s ease;
}

.inner-s1 .tip a:after {
    content: "";
    width: 8px;
    height: 8px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-19-1.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0 0 5px;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s1 .tip a:hover {
        color: #00abc8;
    }

    .inner-s1 .tip a:hover:after {
        background-image: url("../images/online/icon-19-2.png");
    }
}

.inner-s1 .c-items-1 {
    margin-top: 2rem;
}

.inner-s1 .c-items-1.mt-1 {
    margin-top: 3.75rem;
}

.inner-s2 {
    padding: 3.75rem 0 0;
}

.inner-s2.style-1 .wrap-s {
    background-color: transparent;
    border: 2px solid #fff;
}

.inner-s2 .wrap-s {
    background-color: #fff;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 0 1.25rem rgba(0, 0, 0, 0.05);
}

.inner-s2 .top-block {
    padding: 1.25rem 2.5rem;
    position: relative;
}

.inner-s2 .top-block:before {
    content: "";
    width: 100%;
    height: 1px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    position: absolute;
    bottom: 0;
    left: 0;
}

.inner-s2 .block {
    padding: 0.75rem 0;
    border-bottom: 1px solid #ccd9de;
    display: flex;
    align-items: flex-start;
}

.inner-s2 .block:last-of-type {
    border: none;
}

.inner-s2 .block .label {
    width: 80px;
    font-size: max(13px, 0.875rem);
    line-height: 28px;
    color: #00405b;
    position: relative;
}

.inner-s2 .block .label:after {
    content: "";
    width: 1px;
    height: 14px;
    background-color: #ccd9de;
    position: absolute;
    right: 0;
    top: calc(50% - 7px);
}

.inner-s2 .block .lists {
    width: calc(100% - 80px);
    padding-left: 1.25rem;
}

.inner-s2 .items {
    display: flex;
    flex-wrap: wrap;
    grid-column-gap: 1rem;
    grid-row-gap: 5px;
}

.inner-s2 .items .item .trigger {
    display: block;
    font-size: max(13px, 0.875rem);
    line-height: 28px;
    padding: 0 1rem;
    color: #7a8799;
    border-radius: 5px;
}

@media (any-hover: hover) {
    .inner-s2 .items .item:hover .trigger {
        background-image: linear-gradient(90deg, #8cce73, #00abc8);
        color: #fff;
    }
}

.inner-s2 .items .item.active .trigger {
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    color: #fff;
}

.inner-s2 .s-items {
    display: flex;
    flex-wrap: wrap;
    grid-column-gap: 1.25rem;
    grid-row-gap: 5px;
    border-top: 1px solid #e5ecee;
    padding-top: 0.75rem;
    margin-top: 0.75rem;
}

.inner-s2 .s-items .s-item .trigger {
    display: block;
    font-size: max(13px, 0.875rem);
    line-height: 28px;
    padding: 0 1.25rem;
    color: #7a8799;
    border-radius: 5px;
}

@media (any-hover: hover) {
    .inner-s2 .s-items .s-item:hover .trigger {
        background-color: #7a8799;
        color: #fff;
    }
}

.inner-s2 .s-items .s-item.active .trigger {
    background-color: #7a8799;
    color: #fff;
}

.inner-s2 .bot-block {
    padding: 1rem 2.5rem;
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.inner-s2 .bot-block .selected {
    width: calc(100% - 100px);
    display: flex;
    align-items: flex-start;
}

.inner-s2 .bot-block .selected .label {
    width: 80px;
    font-size: max(13px, 0.875rem);
    line-height: 28px;
    color: #00405b;
}

.inner-s2 .bot-block ul {
    width: calc(100% - 80px);
    display: flex;
    grid-gap: 10px;
    flex-wrap: wrap;
}

.inner-s2 .bot-block ul li {
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 3px;
    padding: 0 10px;
    display: flex;
    align-items: center;
    grid-gap: 12px;
}

.inner-s2 .bot-block ul li span {
    font-size: max(13px, 0.875rem);
    line-height: 28px;
    color: #7a8799;
}

.inner-s2 .bot-block ul li a {
    width: 10px;
    height: 10px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-1.png");
}

.inner-s2 .bot-block .clear {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    line-height: 28px;
}

.inner-s2 .bot-block .clear:before {
    content: "";
    width: 12px;
    height: 12px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-2.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 8px 0 0;
}

.m-inner-s2 {
    display: none;
}

.inner-s3 {
    padding: 3.75rem 0 7.5rem;
}

.inner-s3 .sort-box {
    display: flex;
    grid-gap: 3.75rem;
    align-items: flex-end;
}

.inner-s3 .sort-box a {
    position: relative;
    padding-bottom: 5px;
}

.inner-s3 .sort-box a:after {
    content: "";
    width: 1.875rem;
    height: 4px;
    border-radius: 2px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 1;
    opacity: 0;
}

.inner-s3 .sort-box a span {
    font-size: max(15px, 1.125rem);
    color: #7a8799;
    position: relative;
    z-index: 2;
}

.inner-s3 .sort-box a.active:after {
    opacity: 1;
}

.inner-s3 .sort-box a.active span {
    font-size: max(16px, 1.5rem);
    color: #00405b;
}

.inner-s3 .c-items-1 {
    margin-top: 2.5rem;
}

.inner-s3 .c-items-1 .item a {
    padding-bottom: 2rem;
}

.inner-s3 .c-items-1 .item p {
    display: none;
}

.inner-s3 .c-items-1 .item .price {
    position: absolute;
    bottom: 2rem;
    left: 1.875rem;
}

.inner-s4 {
    margin-top: -60px;
    padding: calc(2rem + 60px) 0 2.5rem;
}

.inner-s4.pd-1 {
    padding: 7.5rem 0;
}

.inner-s4 .label {
    font-size: 2.25rem;
    color: #00405b;
    margin-bottom: 2.5rem;
}

.inner-s4 .top-block {
    border-radius: 5px;
    display: flex;
    grid-gap: 1.5rem;
    background-color: #002e41;
    border: 0.625rem solid #fff;
    box-shadow: 0 0 1.875rem rgba(0, 61, 88, 0.1);
}

.inner-s4 .top-block .play-box {
    width: calc(100% - 20.375rem);
}

.inner-s4 .top-block .play-box.max {
    width: 100%;
}

.inner-s4 .top-block .video-box {
    position: relative;
}

.inner-s4 .top-block .video-box .video {
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.inner-s4 .top-block .video-box .video video {
    display: block;
    width: 100%;
}

.inner-s4 .top-block .video-box .controlbtn {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 2;
    opacity: 0;
    pointer-events: none;
    transition: all 0.3s ease;
}

.inner-s4 .top-block .video-box .controlbtn .btn {
    width: 5.625rem;
    height: 5.625rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-5-1.png");
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
}

.inner-s4 .top-block .video-box .controlbtn .btn.pause {
    background-image: url("../images/online/icon-5-2.png");
}

.inner-s4 .top-block .video-box .controlbtn.show {
    opacity: 1;
    pointer-events: auto;
}

.inner-s4 .top-block .video-box .tips {
    position: absolute;
    bottom: 1.875rem;
    left: 1.875rem;
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 5px;
    padding: 4px 4px 4px 1.25rem;
    display: flex;
    align-items: center;
    grid-gap: 5rem;
    z-index: 3;
}

.inner-s4 .top-block .video-box .tips span {
    font-size: max(14px, 1rem);
    color: #ffffff;
}

.inner-s4 .top-block .video-box .tips .btn {
    display: block;
    border-radius: 3px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    font-size: max(14px, 1rem);
    color: #fff;
    line-height: max(36px, 2.5rem);
    padding: 0 24px;
}

.inner-s4 .top-block .ope-box {
    padding: 1.5rem 1.875rem;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    grid-gap: 2.5rem;
    position: relative;
}

.inner-s4 .top-block .ope-box .collect {
    position: absolute;
    width: 80px;
    line-height: 26px;
    text-align: center;
    font-size: max(12px, 0.875rem);
    color: #fff;
    border-radius: 3px;
    background-color: rgba(255, 255, 255, 0.2);
    cursor: pointer;
}

.inner-s4 .top-block .ope-box .collect:before {
    content: "";
    width: 14px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-17-1.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 6px 0 0;
}

.inner-s4 .top-block .ope-box .collect.active:before {
    background-image: url("../images/online/icon-17-2.png");
}

.inner-s4 .top-block .ope-box .tips {
    display: flex;
    grid-gap: 10px;
    flex-wrap: wrap;
    margin-left: 90px;
}

.inner-s4 .top-block .ope-box .tips a {
    font-size: max(12px, 0.875rem);
    color: #fff;
    padding: 0 8px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 3px;
    line-height: 24px;
    font-family: "HarmonyOS_Sans_SC_Light";
    white-space: nowrap;
}

.inner-s4 .top-block .ope-box .time {
    font-size: max(12px, 0.875rem);
    color: rgba(255, 255, 255, 0.5);
    line-height: 26px;
    white-space: nowrap;
}

.inner-s4 .top-block .ope-box .time:before {
    content: "";
    width: 12px;
    height: 12px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-6.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 10px 0 0;
}

.inner-s4 .top-block .list-box {
    width: 18.875rem;
    position: relative;
}

.inner-s4 .top-block .list-box .label {
    font-size: max(16px, 1.25rem);
    color: #fff;
    line-height: 70px;
}

.inner-s4 .top-block .list-box .scroll {
    position: absolute;
    width: 100%;
    height: calc(100% - 70px);
    left: 0;
    bottom: 0;
    padding: 0 1.875rem 1rem 0;
    overflow: auto;
}

.inner-s4 .top-block .list-box .list {
    display: block;
    padding: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.inner-s4 .top-block .list-box .list:last-of-type {
    border: none;
}

.inner-s4 .top-block .list-box .list .tit {
    font-size: max(13px, 0.875rem);
    color: #ffffff;
    font-family: "HarmonyOS_Sans_SC_Light";
}

.inner-s4 .top-block .list-box .list .time {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
    font-family: "HarmonyOS_Sans_SC_Light";
    margin-top: 5px;
}

.inner-s4 .top-block .list-box .list .time:before {
    content: "";
    width: 12px;
    height: 12px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-3.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 10px 0 0;
}

.inner-s4 .top-block .list-box .item .show {
    position: relative;
    padding: 1rem 24px 1rem 0;
    cursor: pointer;
}

.inner-s4 .top-block .list-box .item .show span {
    display: block;
    font-size: max(14px, 1rem);
    color: #fff;
}

.inner-s4 .top-block .list-box .item .show:after {
    content: "";
    width: 12px;
    height: 12px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-7-2.png");
    position: absolute;
    right: 1.875rem;
    top: calc(50% - 6px);
}

.inner-s4 .top-block .list-box .item.close .show:after {
    background-image: url("../images/online/icon-7-1.png");
}

.inner-s4 .top-block .list-box .item.close .hide {
    display: none;
}

.inner-s4 .bot-block {
    margin-top: 2rem;
    display: flex;
    grid-gap: 1.5rem;
    align-items: center;
}

.inner-s4 .bot-block .tit-box {
    width: calc(100% - 21rem);
}

.inner-s4 .bot-block .tit-box .tit {
    font-size: max(16px, 1.5rem);
    color: #00405b;
}

.inner-s4 .bot-block .tit-box .tips {
    margin-top: 5px;
    display: flex;
    grid-gap: 3.75rem;
}

.inner-s4 .bot-block .tit-box .tip {
    display: flex;
    align-items: center;
    grid-gap: 1.25rem;
}

.inner-s4 .bot-block .tit-box .tip span {
    border-radius: 3px;
    padding: 0 8px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s4 .bot-block .tit-box .tip i {
    display: block;
    line-height: 24px;
    font-size: max(12px, 0.875rem);
    font-style: normal;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s4 .bot-block .tit-box .tip p {
    font-size: max(12px, 0.875rem);
    color: #00405b;
}

.inner-s4 .bot-block .tit-box .tip a {
    font-size: max(12px, 0.875rem);
    color: #00405b;
    transition: color 0.3s ease;
}

.inner-s4 .bot-block .tit-box .tip a:after {
    content: "";
    width: 8px;
    height: 8px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-19-1.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0 0 5px;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s4 .bot-block .tit-box .tip a:hover {
        color: #00abc8;
    }

    .inner-s4 .bot-block .tit-box .tip a:hover:after {
        background-image: url("../images/online/icon-19-2.png");
    }
}

.inner-s4 .bot-block .tit-box .price {
    margin-top: 1.25rem;
    display: inline-block;
    font-size: 2.5rem;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    font-family: "HarmonyOS_Sans_SC_Light";
}

.inner-s4 .bot-block .btn-box {
    width: 19.5rem;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 10px;
}

.inner-s4 .bot-block .btn-box a {
    position: relative;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
}

.inner-s4 .bot-block .btn-box span {
    font-size: max(14px, 1rem);
}

.inner-s4 .bot-block .btn-box .btn-1 {
    width: 100%;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s4 .bot-block .btn-box .btn-1 span {
    line-height: max(40px, 3rem);
    color: #fff;
}

@media (any-hover: hover) {
    .inner-s4 .bot-block .btn-box .btn-1:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

.inner-s4 .bot-block .btn-box .btn-2 {
    flex: 1 1;
    border: 2px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s4 .bot-block .btn-box .btn-2:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s4 .bot-block .btn-box .btn-2 span {
    line-height: max(36px, 2.75rem);
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    position: relative;
    z-index: 2;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s4 .bot-block .btn-box .btn-2:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }

    .inner-s4 .bot-block .btn-box .btn-2:hover:after {
        opacity: 1;
    }

    .inner-s4 .bot-block .btn-box .btn-2:hover span {
        color: #fff;
    }
}

.inner-s4 .mid-text {
    font-size: max(14px, 1.125rem);
    color: #7a8799;
    line-height: 1.5;
    margin-top: 2.5rem;
}

.inner-s5 {
    background-color: #f0f5f8;
    padding: 3.75rem 0 0;
}

.inner-s5.bg-1 {
    background-color: transparent;
}

.inner-s5.style-1 {
    padding: 0 0 7.5rem;
}

.inner-s5 .flex {
    display: flex;
    grid-gap: 1.5rem;
}

.inner-s5 .left-box {
    width: calc(100% - 21rem);
    background-color: #fff;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    border-radius: 5px;
    overflow: hidden;
    padding: 2.5rem 1.875rem;
}

.inner-s5 .tab-tit {
    display: flex;
    grid-gap: 3.75rem;
}

.inner-s5 .tab-tit .item {
    position: relative;
    padding-bottom: 12px;
    cursor: pointer;
}

.inner-s5 .tab-tit .item span {
    display: block;
    font-size: max(16px, 1.25rem);
    color: #00405b;
    opacity: 0.5;
    transition: opacity 0.3s ease;
}

.inner-s5 .tab-tit .item:after {
    content: "";
    width: 1.5rem;
    height: 4px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 2px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s5 .tab-tit .item.active span {
    opacity: 1;
}

.inner-s5 .tab-tit .item.active:after {
    opacity: 1;
}

@media (any-hover: hover) {
    .inner-s5 .tab-tit .item:hover span {
        opacity: 1;
    }
}

.inner-s5 .tab-cont {
    margin-top: 3.75rem;
}

.inner-s5 .tab-cont .child {
    display: none;
}

.inner-s5 .tab-cont .child.active {
    display: block;
}

.inner-s5 .c-items-1 .item {
    width: calc((100% - 3rem) / 3);
    border: 1px solid #ededed;
    box-shadow: none;
}

.inner-s5 .c-items-1 .item .img-box {
    height: 10rem;
}

.inner-s5 .c-items-1 .item .txt-box {
    border-top: none;
    border-radius: 0 0 5px 5px;
}

.inner-s5 .cont-1 .para {
    font-size: max(14px, 1.125rem);
    color: #00405b;
    line-height: 1.4;
    font-family: "HarmonyOS_Sans_SC_Light";
}

.inner-s5 .cont-1 .para h2 {
    font-size: max(16px, 1.25rem);
    font-family: "HarmonyOS_Sans_SC_Regular";
    font-weight: normal;
}

.inner-s5 .cont-1 .para p {
    margin-top: 1.25rem;
}

.inner-s5 .cont-1 .para p:nth-child(1) {
    margin-top: 0;
}

.inner-s5 .cont-1 .para img {
    max-width: 100%;
    height: auto !important;
}

.inner-s5 .cont-2 .item {
    margin-top: 10px;
}

.inner-s5 .cont-2 .item:nth-of-type(1) {
    margin-top: 0;
}

.inner-s5 .cont-2 .item .show {
    padding: 1rem 1.875rem;
    background-color: #f0f5f8;
    border-radius: 5px;
    position: relative;
    cursor: pointer;
}

.inner-s5 .cont-2 .item .show span {
    display: block;
    width: calc(100% - 30px);
    font-size: max(16px, 1.25rem);
    color: #00405b;
}

.inner-s5 .cont-2 .item .show:after {
    content: "";
    width: 10px;
    height: 6px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-4.png");
    position: absolute;
    right: 1.875rem;
    top: calc(50% - 3px);
}

.inner-s5 .cont-2 .item .hide {
    padding: 0 1.875rem;
    display: none;
}

.inner-s5 .cont-2 .item.active .show:after {
    transform: rotate(180deg);
}

.inner-s5 .cont-2 .item.active .hide {
    display: block;
}

.inner-s5 .cont-2 .list {
    display: block;
    padding: 1.5rem 1.25rem;
    border-bottom: 1px solid #e5edf1;
}

.inner-s5 .cont-2 .list:last-of-type {
    border: none;
}

.inner-s5 .cont-2 .list .tit {
    font-size: max(14px, 1rem);
    color: #00405b;
    font-family: "HarmonyOS_Sans_SC_Light";
    transition: color 0.3s ease;
}

.inner-s5 .cont-2 .list .time {
    font-size: 12px;
    color: #7a8799;
    font-family: "HarmonyOS_Sans_SC_Light";
    margin-top: 5px;
}

.inner-s5 .cont-2 .list .time:before {
    content: "";
    width: 12px;
    height: 12px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-3.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 10px 0 0;
}

@media (any-hover: hover) {
    .inner-s5 .cont-2 .list:hover .tit {
        color: #00abc8;
    }
}

.inner-s5 .cont-3 .label {
    font-size: max(16px, 1.25rem);
    color: #00405b;
}

.inner-s5 .cont-3 .beforelogin {
    height: 11.25rem;
    background-color: #f0f5f8;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 1.25rem;
}

.inner-s5 .cont-3 .beforelogin p {
    font-size: max(14px, 1rem);
    color: #00405b;
    font-family: "HarmonyOS_Sans_SC_Light";
}

.inner-s5 .cont-3 .beforelogin .btn {
    margin-top: 1.5rem;
    border-radius: 3px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    font-size: max(14px, 1rem);
    color: #fff;
    line-height: max(36px, 2.5rem);
    padding: 0 24px;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s5 .cont-3 .beforelogin .btn:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-2px);
    }
}

.inner-s5 .cont-3 .afterlogin textarea {
    display: block;
    width: 100%;
    height: 200px;
    font-size: 14px;
    border-radius: 5px;
    background-color: #fff;
    border: 1px solid #e6e6e6;
    color: #7a8799;
    padding: 10px 1.25rem;
    resize: none;
    transition: all 0.3s;
}

.inner-s5 .cont-3 .afterlogin textarea:focus {
    border-color: #00abc8;
}

@media (any-hover: hover) {
    .inner-s5 .cont-3 .afterlogin textarea:hover {
        border-color: #00abc8;
    }
}

.inner-s5 .cont-3 .afterlogin button {
    display: block;
    width: 180px;
    border-radius: 5px;
    line-height: 48px;
    font-size: 14px;
    color: #fff;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    text-align: center;
    cursor: pointer;
    margin: 40px auto 0;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s5 .cont-3 .afterlogin button:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-2px);
    }
}

.inner-s5 .cont-3 .reply {
    margin-top: 10px;
}

.inner-s5 .cont-3 .reply .top-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e5e5e5;
}

.inner-s5 .cont-3 .reply .top-box .tit {
    font-size: max(16px, 1.25rem);
    color: #00405b;
}

.inner-s5 .cont-3 .reply .sort {
    display: flex;
    grid-gap: 1.875rem;
}

.inner-s5 .cont-3 .reply .sort span {
    font-size: max(14px, 1rem);
    color: #00405b;
    opacity: 0.5;
    position: relative;
    line-height: max(50px, 3.75rem);
    transition: opacity 0.3s ease;
    cursor: pointer;
}

.inner-s5 .cont-3 .reply .sort span:after {
    content: "";
    width: 1.5rem;
    height: 3px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 2px;
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    margin: 0 auto;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s5 .cont-3 .reply .sort span.active {
    opacity: 1;
}

.inner-s5 .cont-3 .reply .sort span.active:after {
    opacity: 1;
}

.inner-s5 .cont-3 .reply .list {
    display: flex;
    align-items: flex-start;
    grid-gap: 1.25rem;
    padding-top: 1.875rem;
}

.inner-s5 .cont-3 .reply .list .img-box {
    width: 48px;
    height: 48px;
    overflow: hidden;
    border-radius: 50%;
}

.inner-s5 .cont-3 .reply .list .img-box img {
    display: block;
    width: 100%;
}

.inner-s5 .cont-3 .reply .list .txt-box {
    width: calc(100% - 48px - 1.25rem);
    padding-bottom: 1.875rem;
    border-bottom: 1px solid #e5e5e5;
}

.inner-s5 .cont-3 .reply .list .name {
    font-size: max(14px, 1rem);
    color: #00405b;
}

.inner-s5 .cont-3 .reply .list .date {
    font-size: 12px;
    color: #7a8799;
    margin-top: 2px;
}

.inner-s5 .cont-3 .reply .list .para {
    margin-top: 1.5rem;
    font-size: max(14px, 1rem);
    color: #00405b;
}

.inner-s5 .right-box {
    width: 19.5rem;
}

.inner-s5 .right-box .top-block {
    margin-bottom: 3.125rem;
}

.inner-s5 .right-box .top-block .btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    grid-gap: 0.75rem;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 3px;
    padding: 1rem 0;
    transition: all 0.3s ease;
}

.inner-s5 .right-box .top-block .btn:before {
    content: "";
    width: 1.375rem;
    height: 1.25rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/offline/icon-1.png");
}

.inner-s5 .right-box .top-block .btn span {
    font-size: max(14px, 1rem);
    color: #fff;
}

@media (any-hover: hover) {
    .inner-s5 .right-box .top-block .btn:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-3px);
    }
}

.inner-s5 .right-box .top-block p {
    font-size: max(13px, 1rem);
    color: #7a8799;
    margin-top: 1rem;
}

.inner-s5 .right-box .mid-block {
    margin-bottom: 3.125rem;
}

.inner-s5 .right-box .mid-block .c-tit {
    font-size: max(18px, 1.5rem);
    color: #00405b;
    padding-left: 1.25rem;
    position: relative;
}

.inner-s5 .right-box .mid-block .c-tit:before {
    content: "";
    width: 4px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    border-radius: 2px;
}

.inner-s5 .right-box .mid-block .lists {
    margin-top: 1rem;
    border-radius: 5px;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
}

.inner-s5 .right-box .mid-block .list a {
    display: block;
    height: 100%;
    border-radius: 5px;
    overflow: hidden;
    padding: 1.875rem 1.875rem 8.75rem;
    position: relative;
    z-index: 2;
}

.inner-s5 .right-box .mid-block .list .addr {
    width: 50%;
    display: flex;
    align-items: center;
    grid-gap: 0.625rem;
}

.inner-s5 .right-box .mid-block .list .addr:before {
    content: "";
    width: 1rem;
    height: 1rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/offline/icon-3.png");
}

.inner-s5 .right-box .mid-block .list .addr span {
    font-size: max(14px, 1.125rem);
    color: #7a8799;
}

.inner-s5 .right-box .mid-block .list .tit {
    margin-top: 1.25rem;
    font-size: max(15px, 1.125rem);
    color: #00405b;
    transition: color 0.3s ease;
}

.inner-s5 .right-box .mid-block .list .info {
    display: flex;
    align-items: center;
    grid-gap: 10px;
    position: absolute;
    bottom: 6.25rem;
    left: 1.875rem;
    right: 1.875rem;
}

.inner-s5 .right-box .mid-block .list .date {
    display: flex;
    align-items: center;
    grid-gap: 0.625rem;
}

.inner-s5 .right-box .mid-block .list .date:before {
    content: "";
    width: 1rem;
    height: 1rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/offline/icon-2.png");
}

.inner-s5 .right-box .mid-block .list .date span {
    font-size: max(14px, 1.125rem);
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s5 .right-box .mid-block .list .days {
    font-size: 12px;
    color: #7a8799;
    line-height: 20px;
    padding: 0 0.625rem;
    border-radius: 3px;
    background-color: #f1f3f5;
}

.inner-s5 .right-box .mid-block .list .ope {
    height: 5rem;
    position: absolute;
    bottom: 0;
    left: 1.875rem;
    right: 1.875rem;
    display: flex;
    align-items: center;
    border-top: 1px solid #e5e5e5;
}

.inner-s5 .right-box .mid-block .list .price {
    display: flex;
    grid-gap: 1.25rem;
    align-items: flex-end;
}

.inner-s5 .right-box .mid-block .list .price span {
    font-size: max(16px, 1.5rem);
    line-height: 1;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s5 .right-box .mid-block .list .price del {
    font-size: max(12px, 1rem);
    color: #7a8799;
}

@media (any-hover: hover) {
    .inner-s5 .right-box .mid-block .list:hover .tit {
        color: #00abc8;
    }
}

.inner-s5 .right-box .mid-block .pagination {
    margin-top: 1.5rem;
    display: flex;
    justify-content: center;
    grid-gap: 0.875rem;
}

.inner-s5 .right-box .mid-block .pagination span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #b2c5cd;
}

.inner-s5 .right-box .mid-block .pagination span.active {
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s5 .right-box .item {
    margin-top: 1.5rem;
    border-radius: 5px;
    overflow: hidden;
}

.inner-s5 .right-box .item:nth-of-type(1) {
    margin-top: 0;
}

.inner-s5 .right-box .item a {
    display: block;
    position: relative;
}

.inner-s5 .right-box .item .img-box {
    height: 11rem;
    overflow: hidden;
}

.inner-s5 .right-box .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inner-s6 {
    position: relative;
    padding: 7.5rem 0 0;
}

.inner-s6:before {
    content: "";
    width: 100%;
    height: 68.5vw;
    position: absolute;
    bottom: -36vw;
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/img-6.png");
    z-index: 0;
    pointer-events: none;
}

.inner-s6 .data-box {
    margin-top: 6.25rem;
    display: flex;
    justify-content: space-between;
}

.inner-s6 .data .num {
    position: relative;
    white-space: nowrap;
}

.inner-s6 .data .show {
    position: absolute;
    top: 0;
    left: 0;
}

.inner-s6 .data .hide {
    opacity: 0;
}

.inner-s6 .data span {
    font-size: 3.75rem;
    font-family: "Rajdhani-Regular";
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s6 .data i {
    font-size: max(14px, 1.25rem);
    color: #00405b;
    font-style: normal;
    font-family: "HarmonyOS_Sans_SC_Light";
}

.inner-s6 .data em {
    font-size: max(20px, 2rem);
    color: #00405b;
    font-style: normal;
    font-family: "HarmonyOS_Sans_SC_Light";
}

.inner-s6 .data p {
    font-size: max(15px, 1.125rem);
    color: #00405b;
    font-family: "HarmonyOS_Sans_SC_Light";
}

.inner-s6 .items {
    margin-top: 6.25rem;
}

.inner-s6 .items .sw {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 1.5rem;
}

.inner-s6 .item {
    width: calc((100% - 1.5rem) / 2);
    background-color: rgba(255, 255, 255, 0.5);
    border: 1px solid #e4e7eb;
    border-radius: 10px;
    position: relative;
    padding: 8.75rem 2.5rem 2.5rem;
}

.inner-s6 .item i {
    width: 5rem;
    height: 5rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 2.5rem;
    right: 2.5rem;
    will-change: transform;
}

.inner-s6 .item .tit {
    font-size: max(16px, 1.5rem);
    color: #00405b;
}

.inner-s6 .item p {
    font-size: max(14px, 1.125rem);
    color: #7a8799;
    margin-top: 10px;
    font-family: "HarmonyOS_Sans_SC_Light";
}

@media (any-hover: hover) {
    .inner-s6 .item:hover i {
        transform: rotateY(360deg);
        transition: transform 0.6s ease;
    }
}

.inner-s7 {
    padding: 7.5rem 0 0;
    position: relative;
}

.inner-s7.pd-1 {
    padding: 7.5rem 0;
}

.inner-s7 .table-box {
    margin-top: 2rem;
}

.inner-s7 .table-box .tit {
    font-size: max(16px, 1.5rem);
    color: #fff;
    text-align: center;
    padding: 1rem;
    border-radius: 5px 5px 0 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s7 .table-box table {
    width: 100%;
    border-color: #e4e7eb;
    background-color: rgba(255, 255, 255, 0.5);
}

.inner-s7 .table-box table thead {
    background-color: #fff;
}

.inner-s7 .table-box table th {
    padding: 1rem 1.5rem;
    font-weight: normal;
    font-size: max(14px, 1.125rem);
    color: #00405b;
    text-align: center;
}

.inner-s7 .table-box table th:nth-child(2) {
    text-align: left;
}

.inner-s7 .table-box table td {
    font-size: max(12px, 1rem);
    color: #00405b;
    font-family: "HarmonyOS_Sans_SC_Light";
    padding: 1rem 1.5rem;
    text-align: center;
}

.inner-s7 .table-box table td:nth-child(2) {
    text-align: left;
}

.inner-s7 .table-box table td .des {
    font-size: 14px;
    color: #999;
}

.inner-s7 .table-box table .s-tit {
    display: inline-block;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s7 .table-box table .s-tit:hover {
        color: #00abc8;
    }
}

.inner-s7 .table-box table .btn {
    display: inline-block;
    padding: 0 1rem;
    font-size: max(12px, 1rem);
    color: #fff;
    line-height: 30px;
    border-radius: 3px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s7 .table-box table .btn:hover {
        transform: translateY(-2px);
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

.inner-s8 {
    padding: 7.5rem 0;
}

.inner-s8 .cont {
    margin-top: 2rem;
    display: flex;
    align-items: center;
    grid-gap: 2rem;
}

.inner-s8 .side-img {
    width: 13.375rem;
}

.inner-s8 .side-img img {
    display: block;
    width: 100%;
}

.inner-s8 .items {
    width: calc(100% - 30.75rem);
}

.inner-s8 .swiper {
    padding: 2.5rem 0;
}

.inner-s8 .item {
    box-shadow: 0 1.875rem 0.625rem rgba(0, 0, 0, 0.05);
    border: 1px solid #fff;
    background-color: #fff;
    border-radius: 1.25rem;
    overflow: hidden;
}

.inner-s8 .item .img-box {
    position: relative;
}

.inner-s8 .item .img-box:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.1);
    transition: opacity 0.3s ease;
}

.inner-s8 .item .img-box img {
    display: block;
    width: 101%;
}

.inner-s8 .item.swiper-slide-active .img-box:after {
    opacity: 0;
}

.inner-s8 .pagination {
    margin-top: 1.25rem;
    display: flex;
    justify-content: center;
    align-items: center;
    grid-gap: 1.5rem;
}

.inner-s8 .pagination span {
    width: 1rem;
    height: 1rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-9-1.png");
    cursor: pointer;
}

.inner-s8 .pagination span.active {
    background-image: url("../images/online/icon-9-2.png");
}

.inner-s9 {
    padding: 7.5rem 0 0;
}

.inner-s9 .c-items-1 .swiper {
    margin: 0 -12px;
    padding: 2rem 0;
}

.inner-s9 .c-items-1 .item {
    width: calc(25% - 24px);
    margin: 0 12px;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.08);
}

.inner-s9 .pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    grid-gap: 1.5rem;
}

.inner-s9 .pagination span {
    width: 1rem;
    height: 1rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-9-1.png");
    cursor: pointer;
}

.inner-s9 .pagination span.active {
    background-image: url("../images/online/icon-9-2.png");
}

.inner-s10 {
    position: relative;
    padding: 7.5rem 0 0;
}

.inner-s10:before {
    content: "";
    width: 100%;
    height: 68.5vw;
    position: absolute;
    bottom: -36vw;
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/img-6.png");
    z-index: 0;
    pointer-events: none;
}

.inner-s10 .items {
    margin-top: 2.5rem;
    position: relative;
}

.inner-s10 .swiper {
    padding: 1px;
    margin: 0 -12px;
}

.inner-s10 .item {
    position: relative;
    width: calc(33.33% - 24px);
    margin: 0 12px;
    height: auto;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 5px;
}

.inner-s10 .item:before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid transparent;
    border-radius: 5px;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #8cce73, #00abc8);
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s10 .item .box {
    display: block;
    height: 100%;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
    z-index: 2;
}

.inner-s10 .item .img-box {
    height: 15rem;
    overflow: hidden;
}

.inner-s10 .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
    will-change: transform;
}

.inner-s10 .item .txt-box {
    padding: 1.5rem 2.5rem 2.5rem;
}

.inner-s10 .item .tit {
    font-size: max(16px, 1.25rem);
    color: #00405b;
}

.inner-s10 .item .ope {
    margin-top: 1.25rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-gap: 1rem;
}

.inner-s10 .item .time {
    width: calc(100% - 7.25rem);
    font-size: max(12px, 0.875rem);
    color: #7a8799;
}

.inner-s10 .item .time:before {
    content: "";
    width: 14px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-10.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 5px 0 0;
}

.inner-s10 .item .btn {
    width: 6.25rem;
    text-align: center;
    line-height: 30px;
    font-size: max(13px, 1rem);
    color: #fff;
    font-family: "HarmonyOS_Sans_SC_Light";
    border-radius: 3px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s10 .item .btn:hover {
        transform: translateY(-2px);
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

@media (any-hover: hover) {
    .inner-s10 .item:hover:before {
        opacity: 1;
    }

    .inner-s10 .item:hover img {
        transform: scale(1.05);
    }

    .inner-s10 .item:hover .btn {
        opacity: 1;
    }
}

.inner-s10 .button {
    position: absolute;
    top: 50%;
    width: max(40px, 3.75rem);
    height: max(40px, 3.75rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    z-index: 2;
    transform: translateY(-50%);
}

.inner-s10 .prev {
    left: -7.5rem;
    background-image: url("../images/online/prev-1.png");
}

@media (any-hover: hover) {
    .inner-s10 .prev:hover {
        background-image: url("../images/online/prev-2.png");
    }
}

.inner-s10 .next {
    right: -7.5rem;
    background-image: url("../images/online/next-1.png");
}

@media (any-hover: hover) {
    .inner-s10 .next:hover {
        background-image: url("../images/online/next-2.png");
    }
}

.inner-s11 {
    padding: 7.5rem 0 0;
}

.inner-s11 .items {
    margin-top: 2rem;
}

.inner-s11 .sw {
    display: flex;
    grid-gap: 1.5rem;
}

.inner-s11 .item {
    width: calc((100% - 4.5rem) / 4);
    height: auto;
    border: 1px solid #e4e7eb;
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
}

.inner-s11 .item .img-box {
    height: 11rem;
    overflow: hidden;
}

.inner-s11 .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.inner-s11 .item .txt-box {
    padding: 1.25rem 1.875rem;
}

.inner-s11 .item .tit {
    font-size: max(16px, 1.25rem);
    color: #00405b;
}

@media (any-hover: hover) {
    .inner-s11 .item:hover img {
        transform: scale(1.05);
    }
}

.inner-s12 {
    position: relative;
    padding: 7.5rem 0 0;
}

.inner-s12:before {
    content: "";
    width: 100%;
    height: 68.5vw;
    position: absolute;
    bottom: -36vw;
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/img-6.png");
    z-index: 0;
    pointer-events: none;
}

.inner-s12 .items {
    margin-top: 2rem;
}

.inner-s12 .sw {
    display: flex;
    grid-gap: 1.5rem;
}

.inner-s12 .item {
    width: calc((100% - 4.5rem) / 3);
    height: auto;
    background-color: #fff;
    border: 1px solid #e4e7eb;
    border-radius: 10px;
    overflow: hidden;
}

.inner-s12 .item .txt-box {
    background-image: linear-gradient(90deg, #0e5a7a, #0e9cbe);
    position: relative;
    padding: 2.5rem 3.75rem 2.5rem 1.875rem;
}

.inner-s12 .item i {
    width: 5rem;
    height: 5rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    right: 3.75rem;
    bottom: 2.5rem;
    opacity: 0.3;
    will-change: transform;
}

.inner-s12 .item .num {
    display: inline-block;
    font-size: 2.25rem;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s12 .item .tit {
    margin-right: 5rem;
    margin-top: 5px;
    font-size: max(16px, 1.25rem);
    color: #fff;
}

.inner-s12 .item .para {
    padding: 2rem 1.875rem;
    font-size: max(14px, 1.125rem);
    color: #7a8799;
    line-height: 1.4;
    font-family: "HarmonyOS_Sans_SC_Light";
}

@media (any-hover: hover) {
    .inner-s12 .item:hover i {
        transform: rotateY(360deg);
        transition: transform 0.6s ease;
    }
}

.inner-s13 {
    padding: 7.5rem 0 0;
    position: relative;
}

.inner-s13 .tab-wrap {
    display: flex;
    flex-direction: column;
    margin-top: 2.5rem;
    position: relative;
}

.inner-s13 .tab-wrap:after {
    content: "";
    width: 6rem;
    height: 5rem;
    position: absolute;
    right: 2rem;
    top: -2rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-12.png");
    z-index: 2;
}

.inner-s13 .tab-tit {
    order: 2;
    margin-top: 1.25rem;
}

.inner-s13 .tab-tit .sw {
    display: flex;
    grid-gap: 1.5rem;
}

.inner-s13 .tab-tit .item {
    position: relative;
    flex: 1 1;
    background-color: #aac3c9;
    border-radius: 5px;
    overflow: hidden;
    cursor: pointer;
}

.inner-s13 .tab-tit .item:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s13 .tab-tit .item span {
    display: block;
    font-size: max(14px, 1rem);
    color: #fff;
    text-align: center;
    padding: 1rem;
    position: relative;
    z-index: 2;
}

.inner-s13 .tab-tit .item.active:before {
    opacity: 1;
}

@media (any-hover: hover) {
    .inner-s13 .tab-tit .item:hover:before {
        opacity: 1;
    }
}

.inner-s13 .tab-cont {
    position: relative;
    background-color: rgba(255, 255, 255, 0.5);
    border: 1px solid #e4e7eb;
    border-radius: 10px;
    padding: 10px;
}

.inner-s13 .tab-cont .item {
    display: flex;
    align-items: center;
}

.inner-s13 .tab-cont .item .img-box {
    width: 50%;
    height: 22.875rem;
    overflow: hidden;
    opacity: 0;
}

.inner-s13 .tab-cont .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inner-s13 .tab-cont .item .txt-box {
    width: 50%;
    padding-left: 3.75rem;
    opacity: 0;
}

.inner-s13 .tab-cont .item span {
    display: inline-block;
    background-color: #e0ebea;
    border-radius: 3px;
    font-size: 12px;
    line-height: 24px;
    padding: 0 1rem;
    color: #00405b;
}

.inner-s13 .tab-cont .item .tit {
    margin-top: 5px;
    font-size: max(16px, 1.5rem);
    color: #00405b;
}

.inner-s13 .tab-cont .item .para {
    font-size: max(14px, 1.125rem);
    color: #7a8799;
    line-height: 1.4;
    margin-top: 1.25rem;
    font-family: "HarmonyOS_Sans_SC_Light";
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.inner-s13 .tab-cont .item.swiper-slide-active .img-box {
    -webkit-animation: o-upfade-top 0.7s 0s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    -moz-animation: o-upfade-top 0.7s 0s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    -ms-animation: o-upfade-top 0.7s 0s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    animation: o-upfade-top 0.7s 0s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.inner-s13 .tab-cont .item.swiper-slide-active .txt-box {
    -webkit-animation: o-upfade-top 0.7s 0.1s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    -moz-animation: o-upfade-top 0.7s 0.1s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    -ms-animation: o-upfade-top 0.7s 0.1s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    animation: o-upfade-top 0.7s 0.1s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.inner-s13 .button {
    position: absolute;
    top: 50%;
    width: max(40px, 3.75rem);
    height: max(40px, 3.75rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    z-index: 2;
    transform: translateY(-50%);
}

.inner-s13 .prev {
    left: -7.5rem;
    background-image: url("../images/online/prev-1.png");
}

@media (any-hover: hover) {
    .inner-s13 .prev:hover {
        background-image: url("../images/online/prev-2.png");
    }
}

.inner-s13 .next {
    right: -7.5rem;
    background-image: url("../images/online/next-1.png");
}

@media (any-hover: hover) {
    .inner-s13 .next:hover {
        background-image: url("../images/online/next-2.png");
    }
}

.inner-s14 {
    padding: 7.5rem 0;
    position: relative;
    overflow: hidden;
}

.inner-s14 .swiper {
    padding: 2rem 0 3.75rem;
}

.inner-s14 .item {
    box-shadow: 0 1.875rem 0.625rem rgba(0, 0, 0, 0.05);
    border: 1px solid #fff;
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
    transform: scale(0.8);
    transition: transform 0.3s ease;
}

.inner-s14 .item .img-box {
    position: relative;
}

.inner-s14 .item .img-box:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(255, 255, 255, 0.7);
    transition: opacity 0.3s ease;
}

.inner-s14 .item .img-box img {
    display: block;
    width: 101%;
}

.inner-s14 .item.swiper-slide-active {
    transform: scale(1);
}

.inner-s14 .item.swiper-slide-active .img-box:after {
    opacity: 0;
}

.inner-s14 .pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    grid-gap: 1.5rem;
}

.inner-s14 .pagination span {
    width: 1rem;
    height: 1rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-9-1.png");
    cursor: pointer;
}

.inner-s14 .pagination span.active {
    background-image: url("../images/online/icon-9-2.png");
}

.inner-s15 {
    padding: 7.5rem 0 0;
}

.inner-s15 .img-box {
    width: 100%;
    max-width: 52.6875rem;
    margin: 2.5rem auto 0;
}

.inner-s15 .img-box img {
    display: block;
    width: 100%;
}

.inner-s16 {
    position: relative;
    padding: 7.5rem 0 0;
}

.inner-s16:before {
    content: "";
    width: 100%;
    height: 82rem;
    position: absolute;
    bottom: -45rem;
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../images/online/img-6.png");
    background-size: 100% 100%;
    z-index: 0;
    pointer-events: none;
}

.inner-s16 .items {
    margin-top: 5rem;
    display: flex;
    justify-content: space-between;
}

.inner-s16 .item .icon {
    width: 6.25rem;
    height: 6.25rem;
    position: relative;
    margin: 0 auto;
}

.inner-s16 .item .icon:before {
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    z-index: 2;
}

.inner-s16 .item .icon i {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto 3rem;
    z-index: 3;
}

.inner-s16 .item .range {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s16 .item .range em {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50%;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    animation: scale2 1.5s linear infinite;
}

.inner-s16 .item .range em:nth-of-type(2) {
    animation-delay: 0.5s;
}

.inner-s16 .item .range em:nth-of-type(3) {
    animation-delay: 1s;
}

.inner-s16 .item .num {
    font-size: 3.75rem;
    color: #005072;
    text-align: center;
    margin-top: 1.5rem;
}

.inner-s16 .item p {
    font-size: max(14px, 1.25rem);
    color: #7a8799;
    text-align: center;
}

@media screen and (min-width: 1025px) {
    .inner-s16 .item:hover .range {
        opacity: 1;
    }
}

.inner-s17 {
    padding: 7.5rem 0 0;
}

.inner-s17 .img-box {
    margin-top: 2rem;
    border-radius: 5px;
    border: 1px solid #fff;
    background-color: rgba(255, 255, 255, 0.2);
    box-shadow: 0 0 1.875rem rgba(0, 61, 88, 0.1);
}

.inner-s17 .img-box img {
    display: block;
    width: 100%;
}

.inner-s18 {
    position: relative;
    padding: 7.5rem 0 0;
}

.inner-s18 .items {
    margin-top: 2.5rem;
}

.inner-s18 .sw {
    display: flex;
    border: 1px solid #e4e7eb;
    border-radius: 5px;
    background-color: #fff;
    overflow: hidden;
}

.inner-s18 .item {
    position: relative;
    width: calc((100% - 26.5rem) / 5);
    height: 30rem;
    overflow: hidden;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.05);
    transition: width 0.3s ease;
}

.inner-s18 .item .box {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}

.inner-s18 .item .show {
    height: 100%;
    background-color: #fff;
    border-left: 1px solid #e4e7eb;
    padding: 11.25rem 1.875rem 0;
    transition: all 0.3s ease;
}

.inner-s18 .item .show i {
    display: block;
    margin: 0 auto;
    width: 3.75rem;
    height: 3.75rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.inner-s18 .item .show .tit {
    margin-top: 5rem;
    height: max(50px, 3.75rem);
    display: flex;
    align-items: center;
}

.inner-s18 .item .show .tit span {
    display: block;
    width: 100%;
    font-size: max(15px, 1.125rem);
    color: #00405b;
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.inner-s18 .item .hide {
    position: absolute;
    top: 0;
    left: 0;
    width: 26.5rem;
    height: 100%;
    border: 1px solid transparent;
    border-radius: 5px;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: all 0.3s ease;
}

.inner-s18 .item .hide .tit {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.25rem;
    height: 7.5rem;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s18 .item .hide .tit i {
    width: 1.875rem;
    height: 1.875rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.inner-s18 .item .hide .tit span {
    max-width: calc(100% - 1.875rem);
    font-size: max(16px, 1.5rem);
    padding-left: 1.25rem;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.inner-s18 .item .hide .para {
    display: flex;
    align-items: center;
    margin: 0 1.875rem;
    height: calc(100% - 12.5rem);
}

.inner-s18 .item .hide .txt {
    font-size: max(14px, 1rem);
    color: #7a8799;
    font-family: "HarmonyOS_Sans_SC_Light";
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.inner-s18 .item .hide .ope {
    margin: 0 1.875rem;
    height: 5rem;
    border-top: 1px solid #e5e5e5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

.inner-s18 .item .hide .ope span {
    width: max(100% - 24px, 100% - 1.875rem);
    font-size: max(12px, 1rem);
    color: #00405b;
    padding-right: 10px;
    transition: color 0.3s ease;
}

.inner-s18 .item .hide .ope i {
    width: max(24px, 1.875rem);
    height: max(24px, 1.875rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-15.png");
}

@media (any-hover: hover) {
    .inner-s18 .item .hide .ope:hover span {
        color: #00abc8;
    }
}

.inner-s18 .item:nth-of-type(1) .show {
    border: none;
}

.inner-s18 .item.active {
    width: 26.5rem;
}

.inner-s18 .item.active .show {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.inner-s18 .item.active .hide {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.inner-s19 {
    padding: 7.5rem 0;
}

.inner-s19 .items {
    margin-top: 2rem;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 1.5rem;
}

.inner-s19 .item {
    width: calc((100% - 4.5rem) / 4);
    height: max(80px, 7.5rem);
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #e9ecef;
    display: flex;
    align-items: center;
    justify-content: center;
}

.inner-s19 .item img {
    max-width: 70%;
    max-height: 60%;
}

.inner-s20 {
    margin-top: -60px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../images/online/img-16.jpg");
    position: relative;
    z-index: 1;
}

.inner-s20 .flex {
    height: 40.625rem;
    display: flex;
    align-items: center;
}

.inner-s20 .img-box {
    width: 23.5625rem;
    height: 100%;
    display: flex;
    align-items: flex-end;
}

.inner-s20 .img-box img {
    max-height: 88%;
    max-width: 100%;
}

.inner-s20 .txt-box {
    width: calc(100% - 23.5625rem);
    padding-left: 7.5rem;
}

.inner-s20 .tit {
    font-size: 3rem;
    color: #005072;
}

.inner-s20 .s-tit {
    font-size: max(14px, 1.25rem);
    color: #005072;
    margin-top: 1rem;
}

.inner-s20 .s-tit:after {
    content: "";
    width: 3.75rem;
    height: 4px;
    display: block;
    margin-top: 1.875rem;
    border-radius: 2px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s20 .para {
    font-size: max(14px, 1.125rem);
    color: #7a8799;
    font-family: "HarmonyOS_Sans_SC_Light";
    line-height: 1.5;
    margin-top: 1.5rem;
}

.inner-s21 {
    margin-top: -5rem;
}

.inner-s21 .items {
    height: 10rem;
    border-radius: 10px;
    border: 1px solid #fff;
    background-image: linear-gradient(180deg, #ebf5f6, #fff);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    box-shadow: 0 1rem 1.5rem rgba(233, 244, 248, 0.7);
}

.inner-s21 .item {
    width: 33.33%;
    text-align: center;
    position: relative;
}

.inner-s21 .item:after {
    content: "";
    width: 0;
    height: 3.75rem;
    border-left: 1px solid #fff;
    border-right: 1px solid #daedf0;
    position: absolute;
    right: 0;
    top: calc(50% - 1.875rem);
}

.inner-s21 .item p {
    font-size: max(14px, 1.125rem);
    color: #7a8799;
    font-family: "HarmonyOS_Sans_SC_Light";
}

.inner-s21 .item .num span {
    font-size: 3.125rem;
    color: #005072;
    font-family: "Rajdhani-Medium";
}

.inner-s21 .item .num i {
    font-size: max(14px, 1.125rem);
    font-style: normal;
    color: #005072;
}

.inner-s21 .item:last-of-type:after {
    display: none;
}

.inner-s22 {
    padding: 3.75rem 0 7.5rem;
}

.inner-s22 .c-pages {
    justify-content: center;
}

.inner-s22 .c-pages .total {
    display: none;
}

.inner-s22 .items {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 1.5rem;
}

.inner-s22 .item {
    position: relative;
    width: calc((100% - 3rem) / 3);
    height: auto;
    background-color: #fff;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    border-radius: 5px;
}

.inner-s22 .item:before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid transparent;
    border-radius: 5px;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #8cce73, #00abc8);
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s22 .item a {
    display: block;
    height: 100%;
    padding: 1.25rem;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
    z-index: 2;
}

.inner-s22 .item .img-box {
    height: 13.5rem;
    overflow: hidden;
}

.inner-s22 .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
    will-change: transform;
}

.inner-s22 .item .txt-box {
    padding: 2.5rem 1.25rem;
}

.inner-s22 .item .tit {
    font-size: max(16px, 1.5rem);
    color: #00405b;
    transition: color 0.3s ease;
}

.inner-s22 .item p {
    font-size: max(14px, 1rem);
    color: #7a8799;
    line-height: 20px;
    margin-top: 1rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (any-hover: hover) {
    .inner-s22 .item:hover:before {
        opacity: 1;
    }

    .inner-s22 .item:hover img {
        transform: scale(1.05);
    }

    .inner-s22 .item:hover .tit {
        color: #00abc8;
    }
}

.inner-s23 {
    padding: 7.5rem 0;
}

.inner-s23 .label {
    font-size: 2.25rem;
    color: #00405b;
    padding-left: 1.25rem;
    position: relative;
}

.inner-s23 .label:before {
    content: "";
    width: 4px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    border-radius: 2px;
}

.inner-s23 .c-items-1 .swiper {
    margin: 0 -12px;
    padding: 2rem 0;
}

.inner-s23 .c-items-1 .item {
    width: calc(25% - 24px);
    margin: 0 12px;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.08);
}

.inner-s23 .pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    grid-gap: 1.5rem;
}

.inner-s23 .pagination span {
    width: 1rem;
    height: 1rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-9-1.png");
    cursor: pointer;
}

.inner-s23 .pagination span.active {
    background-image: url("../images/online/icon-9-2.png");
}

.inner-s24 {
    margin-top: -60px;
    padding: calc(60px + 2rem) 0 0;
}

.inner-s24 .flex {
    border-radius: 5px;
    padding: 10px;
    box-shadow: 0 0 1.875rem rgba(0, 61, 88, 0.1);
    background-color: #fff;
    display: flex;
    align-items: center;
}

.inner-s24 .img-box {
    width: 50%;
    height: 22.875rem;
    overflow: hidden;
}

.inner-s24 .img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inner-s24 .txt-box {
    width: 50%;
    padding: 0 2rem;
}

.inner-s24 .tit {
    font-size: max(16px, 1.5rem);
    color: #00405b;
}

.inner-s24 .info {
    margin-top: 2rem;
}

.inner-s24 .list {
    margin-top: 1.5rem;
    display: flex;
    align-items: baseline;
}

.inner-s24 .list:nth-of-type(1) {
    margin-top: 0;
}

.inner-s24 .list span {
    width: 110px;
    font-size: max(14px, 1rem);
    line-height: 1.5;
    color: #7a8799;
}

.inner-s24 .list span:before {
    content: "";
    width: 14px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    vertical-align: middle;
    margin: -2px 10px 0 0;
}

.inner-s24 .list span.time:before {
    background-image: url("../images/skill/icon-2.png");
}

.inner-s24 .list span.addr:before {
    background-image: url("../images/skill/icon-3.png");
}

.inner-s24 .list p {
    width: calc(100% - 110px);
    padding-left: 20px;
    border-left: 1px solid #e5e5e5;
    font-size: max(14px, 1rem);
    line-height: 1.5;
    color: #7a8799;
}

.inner-s24 .btns {
    margin-top: 2.5rem;
    display: flex;
}

.inner-s24 .btns a {
    padding: 0 3.75rem;
    font-size: max(14px, 1rem);
    color: #fff;
    line-height: max(40px, 3rem);
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s24 .btns a:hover {
        transform: translateY(-5px);
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

.inner-s25 {
    position: relative;
    z-index: 2;
    transform: translateY(-50%);
}

.inner-s25 .cont {
    background-color: #fff;
    padding: 1rem 2.5rem;
    display: flex;
    align-items: center;
    border-radius: 5px;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
}

.inner-s25 span {
    width: 11.25rem;
    font-size: max(18px, 1.5rem);
    color: #00405b;
    border-right: 1px solid #ccdce3;
}

.inner-s25 span:before {
    content: "";
    width: 1.875rem;
    height: 1.875rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/skill/icon-4.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 10px 0 0;
}

.inner-s25 .swiper-box {
    width: calc(100% - 11.25rem);
    height: max(40px, 3.125rem);
    padding: 0 2.5rem;
    position: relative;
}

.inner-s25 .swiper {
    height: 100%;
}

.inner-s25 .item {
    display: flex;
}

.inner-s25 .item a {
    width: calc(50% - 3.75rem);
    margin-right: 3.75rem;
    font-size: max(14px, 1rem);
    color: #00405b;
    line-height: max(40px, 3.125rem);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s25 .item a:hover {
        color: #00abc8;
    }
}

.inner-s25 .btns {
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -15px;
}

.inner-s25 .button {
    width: 10px;
    height: 6px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    transition: all 0.3s ease;
}

.inner-s25 .prev {
    background-image: url("../images/skill/icon-5-1.png");
}

@media (any-hover: hover) {
    .inner-s25 .prev:hover {
        background-image: url("../images/skill/icon-5-2.png");
    }
}

.inner-s25 .next {
    margin-top: 18px;
    background-image: url("../images/skill/icon-6-1.png");
}

@media (any-hover: hover) {
    .inner-s25 .next:hover {
        background-image: url("../images/skill/icon-6-2.png");
    }
}

.inner-s26 {
    position: relative;
    padding: 5rem 0 0;
}

.inner-s26:before {
    content: "";
    width: 100%;
    height: 82rem;
    position: absolute;
    bottom: -45rem;
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../images/online/img-6.png");
    background-size: 100% 100%;
    z-index: 0;
    pointer-events: none;
}

.inner-s26 .flex {
    margin-top: 2.5rem;
    display: flex;
    align-items: center;
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #e4e7eb;
    padding: 1.25rem;
}

.inner-s26 .img-box {
    width: 50%;
    height: 22.5rem;
    overflow: hidden;
}

.inner-s26 .img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inner-s26 .txt-box {
    width: 50%;
    padding: 0 2.5rem 0 3.75rem;
}

.inner-s26 .para {
    font-size: max(14px, 1rem);
    color: #005072;
    line-height: 2;
}

.inner-s27 {
    padding: 7.5rem 0 0;
}

.inner-s27 .items {
    margin-top: 2.5rem;
}

.inner-s27 .sw {
    display: flex;
    grid-gap: 1.5rem;
}

.inner-s27 .item {
    width: calc((100% - 4.5rem) / 4);
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 5px;
    border: 1px solid #e4e7eb;
    padding: 5.625rem 2.5rem 3.125rem;
}

.inner-s27 .item i {
    width: 4.625rem;
    height: 4.625rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    margin: 0 auto;
    will-change: transform;
}

.inner-s27 .item .tit {
    font-size: max(16px, 1.25rem);
    color: #00405b;
    text-align: center;
    margin-top: 3.75rem;
}

.inner-s27 .item p {
    margin-top: 1.25rem;
    font-size: max(14px, 1rem);
    color: #7a8799;
    line-height: 1.5;
}

@media (any-hover: hover) {
    .inner-s27 .item:hover i {
        transform: rotateY(360deg);
        transition: transform 0.6s ease;
    }
}

.inner-s28 {
    padding: 7.5rem 0 0;
    overflow: hidden;
}

.inner-s28 .scroll {
    margin-top: 2.5rem;
    position: relative;
}

.inner-s28 .scroll:before,
.inner-s28 .scroll:after {
    content: "";
    width: 20vw;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: 3;
}

.inner-s28 .scroll:before {
    left: 0;
    background-image: linear-gradient(90deg, #fff, 80%, rgba(255, 255, 255, 0));
}

.inner-s28 .scroll:after {
    right: 0;
    background-image: linear-gradient(-90deg, #fff, 80%, rgba(255, 255, 255, 0));
}

.inner-s28 .roll {
    font-size: 0;
    display: flex;
    grid-gap: 12px;
    margin-top: 12px;
}

.inner-s28 .roll:nth-of-type(1) {
    margin-top: 0;
}

.inner-s28 .roll .items {
    display: flex;
    grid-gap: 12px;
}

.inner-s28 .roll .item {
    width: 30rem;
    height: 16.875rem;
    border-radius: 5px;
    overflow: hidden;
}

.inner-s28 .roll .item .img-box {
    height: 100%;
}

.inner-s28 .roll .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inner-s28 .roll-1 .items {
    animation: logomove 30s linear infinite;
}

.inner-s28 .roll-2 .items {
    animation: logomove 50s linear infinite;
}

.inner-s29 {
    padding: 7.5rem 0 0;
}

.inner-s29 .items {
    margin-top: 2.5rem;
}

.inner-s29 .sw {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 1.5rem;
}

.inner-s29 .item {
    position: relative;
    width: calc((100% - 3rem) / 3);
    height: auto;
    background-color: #fff;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    border-radius: 5px;
}

.inner-s29 .item:before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid transparent;
    border-radius: 5px;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #8cce73, #00abc8);
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s29 .item a {
    display: block;
    height: 100%;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
    z-index: 2;
}

.inner-s29 .item .img-box {
    height: 15rem;
    overflow: hidden;
}

.inner-s29 .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
    will-change: transform;
}

.inner-s29 .item .txt-box {
    padding: 1.875rem;
}

.inner-s29 .item .tit {
    font-size: max(15px, 1.125rem);
    color: #00405b;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s29 .item:hover:before {
        opacity: 1;
    }

    .inner-s29 .item:hover img {
        transform: scale(1.05);
    }

    .inner-s29 .item:hover .tit {
        color: #00abc8;
    }
}

.inner-s30 {
    padding: 7.5rem 0;
}

.inner-s30 .c-items-2 {
    margin-top: 2.5rem;
    background-color: #fff;
    padding: 0 2.5rem;
    border-radius: 5px;
    box-shadow: 0 0 1.875rem rgba(0, 61, 88, 0.1);
}

.inner-s30 .c-items-2 .item:last-of-type {
    border: none;
}

.inner-s30 .btns {
    margin-top: 2.5rem;
    display: flex;
    justify-content: center;
}

.inner-s30 .btns a {
    padding: 0 3.75rem;
    font-size: max(14px, 1rem);
    color: #fff;
    line-height: max(40px, 3rem);
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s30 .btns a:hover {
        transform: translateY(-5px);
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

.message-error {
    margin-top: 20px;
    padding: 20px;
    color: #e6a23c;
    background: #fdf6ec;
    font-size: 14px;
    border: 1px solid #e6a23c;
    border-radius: 5px;
}

.message-error span {
    font-width: 700;
}

.inner-s31 {
    padding: calc(3.75rem + 60px) 0 7.5rem;
    margin-top: -60px;
}

.inner-s31 .block {
    width: 84%;
    max-width: 980px;
    margin: 0 auto;
}

.inner-s31 .class-box {
    margin-top: 2.5rem;
    padding: 2.5rem;
    background-color: rgba(255, 255, 255, 0.3);
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.05);
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.inner-s31 .class-box .tit {
    font-size: max(16px, 1.5rem);
    color: #005072;
}

.inner-s31 .class-box .tip {
    margin-top: 1.25rem;
    display: flex;
    align-items: center;
    grid-gap: 1.25rem;
}

.inner-s31 .class-box .tip span {
    border-radius: 3px;
    padding: 0 8px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s31 .class-box .tip i {
    display: block;
    line-height: 24px;
    font-size: max(12px, 0.875rem);
    font-style: normal;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    white-space: nowrap;
}

.inner-s31 .class-box .tip p {
    font-size: max(12px, 0.875rem);
    color: #00405b;
}

.inner-s31 .class-box .tip a {
    font-size: max(12px, 0.875rem);
    color: #00405b;
    white-space: nowrap;
    transition: color 0.3s ease;
}

.inner-s31 .class-box .tip a:after {
    content: "";
    width: 8px;
    height: 8px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-19-1.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0 0 5px;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s31 .class-box .tip a:hover {
        color: #00abc8;
    }

    .inner-s31 .class-box .tip a:hover:after {
        background-image: url("../images/online/icon-19-2.png");
    }
}

.inner-s31 .class-box .price {
    font-size: 2.5rem;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    font-family: "HarmonyOS_Sans_SC_Light";
}

form button.btn-apply {
    border-radius: 5px;
    line-height: 48px;
    font-size: max(14px, 1rem);
    color: #fff;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    padding: 0 20px;
}

@media (any-hover: hover) {
    form button.btn-apply:hover {
        transform: translateY(-5px);
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

form.form-box {
    margin-top: 2.5rem;
}

form.form-box .item {
    margin-top: 30px;
    display: flex;
    grid-gap: 20px;
    align-items: flex-end;
}

form.form-box .item:nth-of-type(1) {
    margin-top: 0;
}

form.form-box .item.item-2-1 .box {
    width: calc(50% - 10px);
}

form.form-box .item.item-2 .box {
    width: calc(50% - 10px);
}

form.form-box .item.item-radio input[type=text] {
    width: 180px;
    display: inline-block;
    vertical-align: middle;
}

form.form-box .box {
    width: 100%;
}

form.form-box .tit {
    font-size: 16px;
    line-height: 20px;
    color: #00405b;
    padding-left: 10px;
    position: relative;
    margin-bottom: 10px;
}

form.form-box .tit i {
    font-style: normal;
    color: #ff0000;
    position: absolute;
    top: 0;
    left: 0;
}

form.form-box .fill {
    position: relative;
}

form.form-box .fill .file-class-accept {
    position: absolute;
    height: 100%;
    top: 0;
    right: 0;
}

form.form-box .tips {
    padding: 5px 1.25rem 0;
    font-size: 14px;
    color: #7a8799;
}

form.form-box .maxl {
    position: absolute;
    right: 1px;
    top: 1px;
    font-size: 14px;
    color: #7a8799;
    line-height: 58px;
    padding-right: 20px;
}

form.form-box .upload {
    margin-top: 10px;
    padding: 20px;
    background-color: #f5f5f5;
    border-radius: 5px;
    display: flex;
    align-items: center;
}

form.form-box .upload .img-box {
    width: 120px;
    height: 168px;
    border-radius: 5px;
    overflow: hidden;
    cursor: pointer;
}

form.form-box .upload .img-box img {
    display: block;
    width: 100%;
    object-fit: cover;
}

form.form-box .upload .para {
    width: calc(100% - 120px);
    padding-left: 40px;
    font-size: 14px;
    color: #7a8799;
    line-height: 20px;
}

form.form-box .upload .btn {
    width: 120px;
    border-radius: 5px;
    line-height: 48px;
    font-size: 14px;
    color: #fff;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    text-align: center;
    cursor: pointer;
}

form.form-box .upload .btn:before {
    content: "";
    width: 16px;
    height: 16px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/skill/icon-11.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 10px 0 0;
}

form.form-box input[type=text] {
    display: block;
    width: 100%;
    font-size: 14px;
    border-radius: 5px;
    background-color: #fff;
    border: 1px solid #e6e6e6;
    color: #7a8799;
    height: max(50px, 3.75rem);
    padding: 0 1.25rem;
}

form.form-box input[type=text]::-webkit-input-placeholder {
    color: #7a8799;
}

form.form-box input[type=text]:-moz-placeholder {
    color: #7a8799;
}

form.form-box input[type=text]::-moz-placeholder {
    color: #7a8799;
}

form.form-box input[type=text]:-ms-input-placeholder {
    color: #7a8799;
}

form.form-box input[type=text]::-ms-input-placeholder {
    color: #7a8799;
}

form.form-box input[type=text][disabled] {
    background-color: #f5f5f5;
    border-color: #e6e6e6 !important;
}

form.form-box button.btn-apply {
    display: block;
    width: 180px;
    margin: 40px auto 0;
}

form.form-box .layui-form-radio {
    margin: 0 0 0 5rem;
    line-height: 20px;
}

form.form-box .layui-form-radio * {
    font-size: 14px;
}

form.form-box .layui-form-radio:nth-of-type(1) {
    margin-left: 0;
}

form.form-box .layui-form-radio>i {
    font-size: 1.25rem;
}

form.form-box .layui-form-select dl {
    padding: 0;
    top: 100%;
}

form.form-box .layui-form-selectup dl {
    top: auto;
    bottom: 100%;
}

form.form-box .layui-form-select dl dd,
form.form-box .layui-form-select dl dt {
    font-size: 14px;
    padding: 0 1.25rem;
}

form.form-box .layui-form-select dl dd.layui-select-tips {
    padding-left: 1.25rem !important;
}

.inner-s32 {
    margin-top: -60px;
    padding: calc(60px + 2.5rem) 0 0;
}

.inner-s32 .items {
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0 0 1.875rem rgba(0, 61, 88, 0.1);
    position: relative;
    padding: 10px;
}

.inner-s32 .item {
    position: relative;
}

.inner-s32 .item .img-box {
    height: 30rem;
    overflow: hidden;
}

.inner-s32 .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inner-s32 .item .txt-box {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 2.5rem;
    z-index: 2;
}

.inner-s32 .item .txt-box:before {
    content: "";
    width: 100%;
    height: 7.5rem;
    position: absolute;
    bottom: 0;
    left: 0;
    background-image: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.8));
    z-index: 1;
}

.inner-s32 .item .tit {
    font-size: max(16px, 1.5rem);
    color: #fff;
    margin-right: 10rem;
    position: relative;
    z-index: 2;
}

.inner-s32 .pagination {
    position: absolute;
    width: auto;
    left: auto;
    right: calc(2.5rem + 10px);
    bottom: calc(2.5rem + 10px);
    display: flex;
    align-items: center;
    grid-gap: 1.5rem;
    z-index: 2;
}

.inner-s32 .pagination span {
    width: 1rem;
    height: 1rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-9-3.png");
    cursor: pointer;
}

.inner-s32 .pagination span.active {
    background-image: url("../images/online/icon-9-2.png");
}

.inner-s33 {
    padding: 3.75rem 0 7.5rem;
}

.inner-s33 .flex {
    display: flex;
    grid-gap: 1.5rem;
    align-items: flex-start;
}

.inner-s33 .left-box {
    width: calc(100% - 21rem);
    background-color: #fff;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    border-radius: 5px;
    overflow: hidden;
    padding: 2.5rem 1.875rem;
}

.inner-s33 .left-box .filter-box {
    margin: -2.5rem -1.875rem 0;
    padding: 2.5rem 1.875rem 0;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
}

.inner-s33 .left-box .tab-tit .sw {
    display: flex;
    grid-gap: 2.5rem;
}

.inner-s33 .left-box .tab-tit .item {
    position: relative;
    padding-bottom: 1.5rem;
    cursor: pointer;
}

.inner-s33 .left-box .tab-tit .item span {
    display: block;
    font-size: max(16px, 1.25rem);
    color: #00405b;
    opacity: 0.5;
    transition: opacity 0.3s ease;
}

.inner-s33 .left-box .tab-tit .item:after {
    content: "";
    width: 100%;
    height: 4px;
    border-radius: 2px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    position: absolute;
    bottom: 0;
    left: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s33 .left-box .tab-tit .item.active span {
    opacity: 1;
}

.inner-s33 .left-box .tab-tit .item.active:after {
    opacity: 1;
}

@media (any-hover: hover) {
    .inner-s33 .left-box .tab-tit .item:hover span {
        opacity: 1;
    }
}

.inner-s33 .left-box .tab-cont .child {
    border-top: 1px solid #e5e5e5;
    display: none;
}

.inner-s33 .left-box .tab-cont .child.active {
    display: block;
}

.inner-s33 .left-box .tab-cont .box {
    display: flex;
    flex-wrap: wrap;
    padding: 1.25rem 0;
    grid-gap: 1.25rem;
}

.inner-s33 .left-box .tab-cont .item {
    position: relative;
    cursor: pointer;
}

.inner-s33 .left-box .tab-cont .item:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 3px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s33 .left-box .tab-cont .item span {
    display: block;
    position: relative;
    z-index: 2;
    padding: 0 1.25rem;
    font-size: max(12px, 0.875rem);
    line-height: max(30px, 2.25rem);
    color: #00405b;
    text-align: center;
    transition: color 0.3s ease;
}

.inner-s33 .left-box .tab-cont .item.active:before {
    opacity: 1;
}

.inner-s33 .left-box .tab-cont .item.active span {
    color: #fff;
}

@media (any-hover: hover) {
    .inner-s33 .left-box .tab-cont .item:hover:before {
        opacity: 1;
    }

    .inner-s33 .left-box .tab-cont .item:hover span {
        color: #fff;
    }
}

.inner-s33 .left-box .cont-1 .tit {
    font-size: max(18px, 1.5rem);
    color: #005072;
}

.inner-s33 .left-box .cont-1 .info {
    margin-top: 1rem;
    display: flex;
    flex-wrap: wrap;
    grid-column-gap: 2.5rem;
}

.inner-s33 .left-box .cont-1 .info span {
    display: inline-block;
    margin-left: 10px;
    font-size: max(12px, 0.875rem);
    color: #7a8799;
}

.inner-s33 .left-box .cont-1 .info span:before {
    content: "";
    width: max(12px, 0.875rem);
    height: max(12px, 0.875rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0.625rem 0 0;
}

.inner-s33 .left-box .cont-1 .info span.icon-1:before {
    background-image: url("../images/community/icon-6-1.png");
}

.inner-s33 .left-box .cont-1 .info span.icon-2:before {
    background-image: url("../images/community/icon-6-2.png");
}

.inner-s33 .left-box .cont-1 .info span.icon-3:before {
    background-image: url("../images/community/icon-6-3.png");
}

.inner-s33 .left-box .cont-1 .info span.icon-4:before {
    background-image: url("../images/community/icon-6-4.png");
}

.inner-s33 .left-box .cont-1 .info .btn-edit {
    color: #00abc8;
    margin-left: 10px;
}

.inner-s33 .left-box .cont-1 .info .btn-edit:hover {
    text-decoration: underline;
}

.inner-s33 .left-box .cont-2 {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid #e5e5e5;
}

.inner-s33 .left-box .cont-2 .para {
    font-size: max(14px, 1rem);
    color: #7a8799;
    line-height: 1.5;
}

.inner-s33 .left-box .cont-2 .para p {
    margin-top: 2rem;
}

.inner-s33 .left-box .cont-2 .para p:nth-of-type(1) {
    margin-top: 0;
}

.inner-s33 .left-box .cont-2 .para img,
.inner-s33 .left-box .cont-2 .para video {
    max-width: 100%;
    height: auto !important;
}

.inner-s33 .left-box .cont-2 .love {
    display: block;
    width: 100%;
    padding: 50px 0 20px;
    text-align: center;
}

.inner-s33 .left-box .cont-2 .love a span {
    font-size: 14px;
    padding: 6px 15px;
    border-radius: 5px;
    color: #fff;
    background-image: linear-gradient(90deg, #FF6619, #FF6619);
}

.inner-s33 .left-box .cont-2 .love a span:before {
    content: "";
    width: 16px;
    height: 16px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0.625rem 0 0;
    background-image: url(../images/forum/love-nomal.png);
    color: #ffffff;
}

.inner-s33 .left-box .cont-3 {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid #e5e5e5;
}

.inner-s33 .left-box .cont-3 .label {
    font-size: max(16px, 1.25rem);
    color: #00405b;
}

.inner-s33 .left-box .cont-3 .beforelogin {
    height: 11.25rem;
    background-color: #f0f5f8;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 1.25rem;
}

.inner-s33 .left-box .cont-3 .beforelogin p {
    font-size: max(14px, 1rem);
    color: #00405b;
    font-family: "HarmonyOS_Sans_SC_Light";
}

.inner-s33 .left-box .cont-3 .beforelogin .btn {
    margin-top: 1.5rem;
    border-radius: 3px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    font-size: max(14px, 1rem);
    color: #fff;
    line-height: max(36px, 2.5rem);
    padding: 0 24px;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s33 .left-box .cont-3 .beforelogin .btn:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-2px);
    }
}

.inner-s33 .left-box .cont-3 .afterlogin {
    margin-top: 1.25rem;
}

.inner-s33 .left-box .cont-3 .afterlogin textarea {
    display: block;
    width: 100%;
    height: 200px;
    font-size: 14px;
    border-radius: 5px;
    background-color: #fff;
    border: 1px solid #e6e6e6;
    color: #7a8799;
    padding: 10px 1.25rem;
    resize: none;
    transition: all 0.3s;
}

.inner-s33 .left-box .cont-3 .afterlogin textarea:focus {
    border-color: #00abc8;
}

@media (any-hover: hover) {
    .inner-s33 .left-box .cont-3 .afterlogin textarea:hover {
        border-color: #00abc8;
    }
}

.inner-s33 .left-box .cont-3 .afterlogin button {
    display: block;
    width: 180px;
    border-radius: 5px;
    line-height: 48px;
    font-size: 14px;
    color: #fff;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    text-align: center;
    cursor: pointer;
    margin: 40px auto 0;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s33 .left-box .cont-3 .afterlogin button:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-2px);
    }
}

.inner-s33 .left-box .cont-3 .reply {
    margin-top: 10px;
}

.inner-s33 .left-box .cont-3 .reply .top-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e5e5e5;
}

.inner-s33 .left-box .cont-3 .reply .top-box .tit {
    font-size: max(16px, 1.25rem);
    color: #00405b;
}

.inner-s33 .left-box .cont-3 .reply .sort {
    display: flex;
    grid-gap: 1.875rem;
}

.inner-s33 .left-box .cont-3 .reply .sort a {
    font-size: max(14px, 1rem);
    color: #00405b;
    opacity: 0.5;
    position: relative;
    line-height: max(50px, 3.75rem);
    transition: opacity 0.3s ease;
    cursor: pointer;
}

.inner-s33 .left-box .cont-3 .reply .sort a:after {
    content: "";
    width: 1.5rem;
    height: 3px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 2px;
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    margin: 0 auto;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s33 .left-box .cont-3 .reply .sort a.active {
    opacity: 1;
}

.inner-s33 .left-box .cont-3 .reply .sort a.active:after {
    opacity: 1;
}

.inner-s33 .left-box .cont-3 .reply .list {
    display: flex;
    align-items: flex-start;
    grid-gap: 1.25rem;
    padding-top: 1.875rem;
}

.inner-s33 .left-box .cont-3 .reply .list .img-box {
    width: 48px;
    height: 48px;
    overflow: hidden;
    border-radius: 50%;
}

.inner-s33 .left-box .cont-3 .reply .list .img-box img {
    display: block;
    width: 100%;
}

.inner-s33 .left-box .cont-3 .reply .list .txt-box {
    width: calc(100% - 48px - 1.25rem);
    padding-bottom: 1.875rem;
    border-bottom: 1px solid #e5e5e5;
    padding-top: 10px;
}

.inner-s33 .left-box .cont-3 .reply .list .name {
    font-size: max(14px, 1rem);
    color: #00405b;
}

.inner-s33 .left-box .cont-3 .reply .list .para {
    margin-top: 1.5rem;
    font-size: max(12px, 0.875rem);
    line-height: 1.5;
    color: #00405b;
}

.inner-s33 .left-box .cont-3 .reply .list .info {
    margin-top: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.inner-s33 .left-box .cont-3 .reply .list .date {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
}

.inner-s33 .left-box .cont-3 .reply .list .ope-box {
    display: flex;
    grid-gap: 1.25rem;
}

.inner-s33 .left-box .cont-3 .reply .list .ope {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
    cursor: pointer;
}

.inner-s33 .left-box .cont-3 .reply .list .ope:before {
    content: "";
    width: 14px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0.625rem 0 0;
}

.inner-s33 .left-box .cont-3 .reply .list .ope.like:before {
    background-image: url("../images/community/icon-7-1.png");
}

.inner-s33 .left-box .cont-3 .reply .list .ope.rpl:before {
    background-image: url("../images/community/icon-7-2.png");
}

.inner-s33 .left-box .cont-3 .reply .list .editor-box {
    margin-top: 1.5rem;
    display: none;
}

.inner-s33 .left-box .cont-3 .reply .list .editor-box .btns {
    margin-top: 1rem;
    display: flex;
    grid-gap: 1rem;
    justify-content: flex-end;
}

.inner-s33 .left-box .cont-3 .reply .list .editor-box .btn {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0 1.5rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.inner-s33 .left-box .cont-3 .reply .list .editor-box .btn:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 3px;
    z-index: 1;
}

.inner-s33 .left-box .cont-3 .reply .list .editor-box .btn span {
    font-size: max(12px, 0.875rem);
    line-height: max(30px, 2.5rem);
    position: relative;
    z-index: 2;
}

.inner-s33 .left-box .cont-3 .reply .list .editor-box .btn.cancel:before {
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s33 .left-box .cont-3 .reply .list .editor-box .btn.cancel:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 3px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s33 .left-box .cont-3 .reply .list .editor-box .btn.cancel span {
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s33 .left-box .cont-3 .reply .list .editor-box .btn.cancel:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }

    .inner-s33 .left-box .cont-3 .reply .list .editor-box .btn.cancel:hover:after {
        opacity: 1;
    }

    .inner-s33 .left-box .cont-3 .reply .list .editor-box .btn.cancel:hover span {
        color: #fff;
    }
}

.inner-s33 .left-box .cont-3 .reply .list .editor-box .btn.submit:before {
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s33 .left-box .cont-3 .reply .list .editor-box .btn.submit span {
    color: #fff;
}

@media (any-hover: hover) {
    .inner-s33 .left-box .cont-3 .reply .list .editor-box .btn.submit:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

.inner-s33 .left-box .cont-3 .reply .list .s-list-box {
    margin-top: 1.5rem;
    border: 1px solid #e6e6e6;
}

.inner-s33 .left-box .cont-3 .reply .list .s-list {
    padding: 1.5rem;
    border-top: 1px solid #e6e6e6;
}

.inner-s33 .left-box .cont-3 .reply .list .s-list:nth-of-type(1) {
    border: none;
}

.inner-s33 .left-box .cont-3 .reply .list .s-list .s-topbox {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
}

.inner-s33 .left-box .cont-3 .reply .list .s-list .s-topbox span,
.inner-s33 .left-box .cont-3 .reply .list .s-list .s-topbox a {
    color: #00405b;
}

.inner-s33 .left-box .cont-3 .reply .list .s-list .s-midbox {
    font-size: max(12px, 0.875rem);
    line-height: 1.5;
    color: #00405b;
    margin-top: 1rem;
}

.inner-s33 .right-box {
    width: 19.5rem;
}

.inner-s33 .right-box .block {
    padding: 1.875rem;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    margin-top: 1.5rem;
}

.inner-s33 .right-box .block:nth-of-type(1) {
    margin-top: 0;
}

.inner-s33 .right-box .block.nostyle {
    padding: 0;
    background-color: transparent;
    border-radius: 0;
    box-shadow: none;
}

.inner-s33 .right-box .posting-btn {
    display: flex;
    grid-gap: 0.625rem;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    padding: 1.25rem;
    box-shadow: 0 0.625rem 1.875rem rgba(0, 171, 200, 0.3);
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s33 .right-box .posting-btn:before {
    content: "";
    width: max(14px, 1.375rem);
    height: max(14px, 1.375rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/community/icon-5.png");
}

.inner-s33 .right-box .posting-btn span {
    font-size: max(14px, 1.25rem);
    color: #fff;
}

.inner-s33 .right-box .c-tit {
    font-size: max(18px, 1.5rem);
    color: #00405b;
    padding-left: 1.25rem;
    position: relative;
}

.inner-s33 .right-box .c-tit:before {
    content: "";
    width: 4px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    border-radius: 2px;
}

.inner-s33 .right-box .box-1 {
    margin-top: 1.25rem;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 10px;
}

.inner-s33 .right-box .box-1 a {
    position: relative;
    background-color: #00abc8;
    border-radius: 5px;
    overflow: hidden;
}

.inner-s33 .right-box .box-1 a:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s33 .right-box .box-1 a span {
    display: block;
    position: relative;
    z-index: 2;
    padding: 0.625rem;
    font-size: 12px;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (any-hover: hover) {
    .inner-s33 .right-box .box-1 a:hover:before {
        opacity: 1;
    }
}

.inner-s33 .right-box .box-2 {
    margin-top: 1.25rem;
    border-top: 1px solid #e6e6e6;
}

.inner-s33 .right-box .box-2 a {
    display: block;
    padding: 1rem 0;
    border-bottom: 1px solid #e6e6e6;
    position: relative;
}

.inner-s33 .right-box .box-2 a:after {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: -1px;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    transform-origin: left top;
    transform: scaleX(0);
}

.inner-s33 .right-box .box-2 a .tit {
    font-size: max(14px, 1rem);
    color: #005072;
    line-height: 1.5;
    transition: color 0.3s ease;
}

.inner-s33 .right-box .box-2 a .date {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
    margin-top: 1rem;
}

.inner-s33 .right-box .box-2 a .date:before {
    content: "";
    width: 14px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-10.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 5px 0 0;
}

@media (any-hover: hover) {
    .inner-s33 .right-box .box-2 a:hover:after {
        transform: scaleX(1);
        transition: transform 0.3s ease;
    }

    .inner-s33 .right-box .box-2 a:hover .tit {
        color: #00abc8;
    }
}

.inner-s33 .right-box .box-3 {
    margin-top: 1.25rem;
    border-top: 1px solid #e6e6e6;
}

.inner-s33 .right-box .box-3 a {
    display: block;
    padding: 1rem 0;
    border-bottom: 1px solid #e6e6e6;
    position: relative;
}

.inner-s33 .right-box .box-3 a:after {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: -1px;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    transform-origin: left top;
    transform: scaleX(0);
}

.inner-s33 .right-box .box-3 a .tit {
    font-size: max(14px, 1rem);
    color: #005072;
    line-height: 1.5;
    transition: color 0.3s ease;
}

.inner-s33 .right-box .box-3 a.hot {
    display: flex;
    align-items: flex-start;
    grid-gap: 5px;
}

.inner-s33 .right-box .box-3 a.hot .tit {
    max-width: calc(100% - 2.25rem - 5px);
}

.inner-s33 .right-box .box-3 a.hot:before {
    content: "";
    width: 2.25rem;
    height: 1.25rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/community/icon-1.png");
    order: 2;
}

@media (any-hover: hover) {
    .inner-s33 .right-box .box-3 a:hover:after {
        transform: scaleX(1);
        transition: transform 0.3s ease;
    }

    .inner-s33 .right-box .box-3 a:hover .tit {
        color: #00abc8;
    }
}

.inner-s34 {
    position: relative;
    padding: 7.5rem 0 0;
}

.inner-s34:before {
    content: "";
    width: 100%;
    height: 82rem;
    position: absolute;
    bottom: -45rem;
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../images/online/img-6.png");
    background-size: 100% 100%;
    z-index: 0;
    pointer-events: none;
}

.inner-s34 .flex {
    display: flex;
    grid-gap: 1.5rem;
}

.inner-s34 .c-tit {
    font-size: 2.25rem;
    color: #00405b;
    padding-left: 1.25rem;
    position: relative;
}

.inner-s34 .c-tit:before {
    content: "";
    width: 4px;
    height: 80%;
    position: absolute;
    left: 0;
    top: 10%;
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    border-radius: 2px;
}

.inner-s34 .left-box {
    width: calc(100% - 21rem);
}

.inner-s34 .top-box .box {
    margin-top: 2rem;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    padding: 1.875rem;
}

.inner-s34 .top-box .box a {
    display: flex;
    align-items: center;
}

.inner-s34 .top-box .box .img-box {
    width: calc(50% + 1rem);
    height: 16.875rem;
    overflow: hidden;
}

.inner-s34 .top-box .box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.inner-s34 .top-box .box .txt-box {
    width: calc(50% - 1rem);
    padding-left: 1.875rem;
}

.inner-s34 .top-box .box .tit {
    font-size: max(16px, 1.5rem);
    color: #00405b;
    transition: color 0.3s ease;
}

.inner-s34 .top-box .box .info {
    margin-top: 1rem;
}

.inner-s34 .top-box .box .info p {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
    margin-top: 10px;
}

.inner-s34 .top-box .box .info p:nth-of-type(1) {
    margin-top: 0;
}

.inner-s34 .top-box .box .info p:before {
    content: "";
    width: 14px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    vertical-align: middle;
    margin: -2px 10px 0 0;
}

.inner-s34 .top-box .box .info p.time:before {
    background-image: url("../images/community/icon-4-1.png");
}

.inner-s34 .top-box .box .info p.speaker:before {
    background-image: url("../images/community/icon-4-2.png");
}

.inner-s34 .top-box .box .para {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e5e5;
    font-size: max(14px, 1rem);
    line-height: 1.5;
    color: #7a8799;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.inner-s34 .top-box .box .btns {
    margin-top: 1rem;
    display: flex;
}

.inner-s34 .top-box .box .btns span {
    padding: 0 1.875rem;
    font-size: max(14px, 1rem);
    color: #fff;
    line-height: max(36px, 2.5rem);
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s34 .top-box .box .btns span:hover {
        transform: translateY(-2px);
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

@media (any-hover: hover) {
    .inner-s34 .top-box .box:hover img {
        transform: scale(1.05);
    }

    .inner-s34 .top-box .box:hover .tit {
        color: #00abc8;
    }
}

.inner-s34 .bot-box {
    margin-top: 3.75rem;
    position: relative;
}

.inner-s34 .bot-box .swiper {
    margin-top: 2rem;
}

.inner-s34 .bot-box .item {
    width: calc((100% - 3rem) / 3);
    margin-right: 1.5rem;
    height: max(80px, 7.5rem);
    border-radius: 5px;
}

.inner-s34 .bot-box .item:last-of-type {
    margin-right: 0;
}

.inner-s34 .bot-box .item a {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center;
    grid-gap: 10px;
}

.inner-s34 .bot-box .item:nth-of-type(3n-2) {
    background-image: linear-gradient(90deg, #015173, #25a3c1);
}

.inner-s34 .bot-box .item:nth-of-type(3n-1) {
    background-image: linear-gradient(90deg, #0298bb, #7fcbda);
}

.inner-s34 .bot-box .item:nth-of-type(3n) {
    background-image: linear-gradient(90deg, #77a5b5, #c0dce2);
}

.inner-s34 .bot-box .item .img-box {
    width: 3rem;
    height: 3.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.5;
    transition: opacity 0.3s ease;
}

.inner-s34 .bot-box .item .img-box img {
    max-width: 100%;
    max-height: 100%;
}

.inner-s34 .bot-box .item .tit {
    font-size: max(16px, 1.5rem);
    color: #fff;
    max-width: calc(100% - 10px - 3rem);
}

@media (any-hover: hover) {
    .inner-s34 .bot-box .item:hover .img-box {
        opacity: 1;
    }
}

.inner-s34 .bot-box .btns {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    grid-gap: 4px;
}

.inner-s34 .bot-box .button {
    width: 30px;
    height: 30px;
    border-radius: 30px;
    background-color: rgba(0, 80, 114, 0.1);
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto 10px;
    cursor: pointer;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s34 .bot-box .button:hover {
        background-color: #005072;
    }
}

.inner-s34 .bot-box .prev {
    background-image: url("../images/community/prev.png");
}

.inner-s34 .bot-box .next {
    background-image: url("../images/community/next.png");
}

.inner-s34 .right-box {
    position: relative;
    width: 19.5rem;
}

.inner-s34 .right-box .items {
    top: 4.7rem;
    position: absolute;
    width: 100%;
    bottom: 0;
    padding: 1.875rem;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    overflow: auto;
}

.inner-s34 .right-box .item .date {
    display: flex;
    align-items: flex-start;
}

.inner-s34 .right-box .item .date i {
    width: 14px;
    height: 14px;
    margin-top: 1px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/community/icon-2.png");
}

.inner-s34 .right-box .item .date span {
    margin-left: 10px;
    max-width: calc(100% - 24px);
    font-size: max(12px, 0.875rem);
    line-height: 16px;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s34 .right-box .item .tit {
    margin: 3px 0 3px 7px;
    padding: 0.625rem 0 0.625rem 1rem;
    border-left: 1px solid #e5e5e5;
    font-size: max(15px, 1.125rem);
    color: #00405b;
}

.inner-s35 {
    padding: 7.5rem 0;
}

.inner-s35.pd-1 {
    margin-top: -60px;
    padding: 8.75rem 0 7.5rem;
}

.inner-s35 .b-label {
    font-size: 3rem;
    color: #00405b;
    text-align: center;
}

.inner-s35 .filter {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 10px;
}

.inner-s35 .filter a {
    width: max(100px, 9.375rem);
    position: relative;
    transition: all 0.3s ease;
}

.inner-s35 .filter a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 3px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ecf7eb, #ecf7eb), linear-gradient(90deg, #8cce73, #00abc8);
    z-index: 1;
}

.inner-s35 .filter a:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 3px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s35 .filter a span {
    display: block;
    text-align: center;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    font-size: max(14px, 1rem);
    line-height: max(36px, 3rem);
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

.inner-s35 .filter a.active:after {
    opacity: 1;
}

.inner-s35 .filter a.active span {
    color: #fff;
}

@media (any-hover: hover) {
    .inner-s35 .filter a:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }

    .inner-s35 .filter a:hover:after {
        opacity: 1;
    }

    .inner-s35 .filter a:hover span {
        color: #fff;
    }
}

.inner-s35 .items {
    margin-top: 2.5rem;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 1.5rem;
}

.inner-s35 .item {
    position: relative;
    width: calc((100% - 3rem) / 3);
    height: auto;
    background-color: #fff;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    border-radius: 5px;
}

.inner-s35 .item:before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid transparent;
    border-radius: 5px;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #8cce73, #00abc8);
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s35 .item a {
    display: block;
    height: 100%;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
    z-index: 2;
}

.inner-s35 .item .img-box {
    height: 15rem;
    overflow: hidden;
}

.inner-s35 .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
    will-change: transform;
}

.inner-s35 .item .txt-box {
    padding: 1.5rem 2.5rem 2.5rem;
}

.inner-s35 .item .tit {
    font-size: max(16px, 1.25rem);
    color: #00405b;
    transition: color 0.3s ease;
}

.inner-s35 .item .date {
    margin-top: 1.25rem;
    font-size: max(12px, 0.875rem);
    color: #7a8799;
}

.inner-s35 .item .date:before {
    content: "";
    width: 14px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/skill/icon-2.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 10px 0 0;
}

@media (any-hover: hover) {
    .inner-s35 .item:hover:before {
        opacity: 1;
    }

    .inner-s35 .item:hover img {
        transform: scale(1.05);
    }

    .inner-s35 .item:hover .tit {
        color: #00abc8;
    }
}

.inner-s36 {
    margin-top: -60px;
    padding: calc(60px + 3.75rem) 0 7.5rem;
}

.inner-s36 .label {
    font-size: 2.25rem;
    color: #00405b;
    padding-left: 1.25rem;
    position: relative;
}

.inner-s36 .label:before {
    content: "";
    width: 4px;
    height: 80%;
    position: absolute;
    left: 0;
    top: 10%;
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    border-radius: 2px;
}

.inner-s36 .label a {
    font-size: max(14px, 1rem);
    color: #7a8799;
    position: absolute;
    right: 0;
    bottom: 2px;
}

.inner-s36 .para {
    margin-top: 2rem;
    font-size: max(14px, 1.25rem);
    color: #00405b;
    line-height: 1.5;
}

.inner-s36 .info {
    margin-top: 2rem;
    background-color: #fff;
    border-radius: 5px;
    padding: 0 2.5rem;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
}

.inner-s36 .box {
    padding: 2.5rem 0;
    border-top: 1px solid #e5e5e5;
}

.inner-s36 .box:nth-of-type(1) {
    border: none;
}

.inner-s36 .box .tit {
    font-size: max(16px, 1.5rem);
    color: #00405b;
}

.inner-s36 .box .s-para {
    margin-top: 1.5rem;
    font-size: max(13px, 1.125rem);
    color: #7a8799;
    line-height: 1.5;
}

.inner-s36 .ope-box {
    position: absolute;
    right: 2.5rem;
    bottom: 2.5rem;
    z-index: 3;
}

.inner-s36 .btns {
    display: flex;
    justify-content: flex-end;
    grid-gap: 10px;
}

.inner-s36 .btns .btn {
    width: max(120px, 9.375rem);
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
}

.inner-s36 .btns .btn:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    box-sizing: border-box;
    border: 2px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s36 .btns .btn:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s36 .btns .btn span {
    display: block;
    text-align: center;
    font-size: max(14px, 1rem);
    line-height: max(40px, 3rem);
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

.inner-s36 .btns .btn:nth-child(1):after {
    opacity: 1;
}

.inner-s36 .btns .btn:nth-child(1) span {
    color: #fff;
}

.inner-s36 .btns .btn:nth-child(2) span {
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

@media (any-hover: hover) {
    .inner-s36 .btns .btn:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-5px);
    }

    .inner-s36 .btns .btn:hover:after {
        opacity: 1;
    }

    .inner-s36 .btns .btn:hover span {
        color: #fff;
    }
}

.inner-s37 {
    margin-top: -60px;
    padding: calc(60px + 3.75rem) 0 7.5rem;
}

.inner-s37 .label {
    font-size: 2.25rem;
    color: #00405b;
    padding-left: 1.25rem;
    position: relative;
}

.inner-s37 .label:before {
    content: "";
    width: 4px;
    height: 80%;
    position: absolute;
    left: 0;
    top: 10%;
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    border-radius: 2px;
}

.inner-s37 .bot-block {
    margin-top: 2.5rem;
}

.inner-s37 ul li {
    display: flex;
    align-items: center;
    padding: 1rem 2.5rem;
    background-color: #cfe4e8;
}

.inner-s37 ul li:nth-of-type(1) {
    background-color: #005072;
}

.inner-s37 ul .tit {
    font-size: max(16px, 1.25rem);
    color: #fff;
}

.inner-s37 ul .tit:nth-of-type(1) {
    width: calc(100% - 42.5rem);
}

.inner-s37 ul .tit:nth-of-type(2) {
    width: 10rem;
}

.inner-s37 ul .tit:nth-of-type(3) {
    width: 22.5rem;
}

.inner-s37 ul .tit:nth-of-type(4) {
    width: 10rem;
}

.inner-s37 ul span {
    font-size: max(13px, 1rem);
    color: #005072;
}

.inner-s37 ul span:nth-of-type(1) {
    width: calc(100% - 42.5rem);
}

.inner-s37 ul span:nth-of-type(2) {
    width: 10rem;
}

.inner-s37 ul span:nth-of-type(3) {
    width: 22.5rem;
}

.inner-s37 ul span:nth-of-type(4) {
    width: 10rem;
}

.inner-s37 .m-classlist {
    display: none;
    background-color: #005072;
    padding: 1.5rem 2rem;
}

.inner-s37 .m-classlist p {
    font-size: 14px;
    line-height: 1.8;
    color: #fff;
}

.inner-s37 .m-classlist span {
    font-size: 12px;
}

.inner-s37 .price-box {
    padding-top: 1.25rem;
}

.inner-s37 .price-box .single {
    text-align: right;
    font-size: max(14px, 1rem);
    color: #00405b;
    margin-top: 10px;
}

.inner-s37 .price-box .single:nth-of-type(1) {
    margin-top: 0;
}

.inner-s37 .price-box .single span {
    display: inline-block;
    width: 15rem;
    padding-left: 2.5rem;
    text-align: left;
}

.inner-s37 .price-box .total {
    text-align: right;
    font-size: max(14px, 1rem);
    color: #00405b;
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid #dee2e3;
}

.inner-s37 .price-box .total span {
    display: inline-block;
    width: 15rem;
    padding-left: 2.5rem;
    text-align: left;
}

.inner-s37 .price-box .total i {
    display: inline-block;
    font-size: max(18px, 1.5rem);
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    font-style: normal;
}

.inner-s37 .method-tit {
    margin-top: 2.5rem;
    font-size: max(16px, 1.5rem);
    color: #005072;
    padding-left: 1.25rem;
    position: relative;
}

.inner-s37 .method-tit:before {
    content: "";
    width: 4px;
    height: 80%;
    position: absolute;
    top: 10%;
    left: 0;
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    border-radius: 2px;
}

.inner-s37 .method-tit span {
    font-size: max(13px, 1rem);
    color: #7a8799;
}

.inner-s37 .pay-method-type {
    margin-top: 1.875rem;
    display: flex;
    grid-gap: 8.75rem;
}

.inner-s37 .pay-method-type .box {
    font-size: max(14px, 1.125rem);
    color: #005072;
    cursor: pointer;
}

.inner-s37 .pay-method-type .box:before {
    content: "";
    width: max(15px, 1.5rem);
    height: max(15px, 1.5rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    vertical-align: middle;
    margin: -4px 8px 0 0;
    background-image: url("../images/online/icon-18-1.png");
}

.inner-s37 .pay-method-type .box.check:before {
    background-image: url("../images/online/icon-18-2.png");
}

.inner-s37 .pay-type-main {
    margin-top: 1.875rem;
    padding: 0.625rem;
    background-color: #ffffff;
    border: 1px solid #e6e6e6;
}

.inner-s37 .pay-type-main .flex {
    background-color: #f0f5f8;
    padding: 1.875rem;
}

.inner-s37 .pay-type-main .flex .tit {
    font-size: max(14px, 1.125rem);
    line-height: 2;
    color: #005072;
}

.inner-s37 .pay-type-main .flex .payment-btn {
    width: 120px;
    margin-top: 2.5rem;
    border-radius: 5px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    font-size: max(14px, 1rem);
    color: #fff;
    line-height: max(36px, 3rem);
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s37 .pay-type-main .flex .payment-btn:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-2px);
    }
}

.inner-s37 .pay-type-main .online-main .flex {
    display: flex;
    justify-content: space-between;
}

.inner-s37 .pay-type-main .online-main .ewm-box {
    display: flex;
    align-items: flex-start;
    grid-gap: 10px;
    opacity: 0;
}

.inner-s37 .pay-type-main .online-main .ewm-box.active {
    opacity: 1;
}

.inner-s37 .pay-type-main .online-main .ewm {
    width: 9.375rem;
}

.inner-s37 .pay-type-main .online-main .ewm .t-img {
    background-color: #fff;
}

.inner-s37 .pay-type-main .online-main .ewm .t-img img {
    display: block;
    width: 100%;
}

.inner-s37 .pay-type-main .online-main .ewm .b-img {
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.inner-s37 .pay-type-main .online-main .ewm .b-img img {
    display: block;
    height: 20px;
}

.inner-s37 .pay-type-main .offline-main {
    display: none;
}

.inner-s37 .pay-type-main .offline-main .top-box {
    padding: 2.5rem;
    font-size: max(14px, 1.125rem);
    line-height: 2;
    color: #00405b;
}

.inner-s37 .pay-type-main .offline-main .mid-box {
    padding: 2.5rem;
    border-top: 1px solid #e6e6e6;
    display: flex;
    align-items: flex-start;
}

.inner-s37 .pay-type-main .offline-main .mid-box .box {
    width: 50%;
}

.inner-s37 .pay-type-main .offline-main .mid-box .box .code {
    margin-top: 20px;
}

.inner-s37 .pay-type-main .offline-main .mid-box .img-box {
    width: 90%;
    border: 1px solid #ebebeb;
    margin-bottom: 20px;
    text-align: center;
}

.inner-s37 .pay-type-main .offline-main .mid-box .img-box img {
    height: 150px;
}

.inner-s37 .pay-type-main .offline-main .mid-box .tit {
    font-size: max(14px, 1.125rem);
    color: #00405b;
}

.inner-s37 .pay-type-main .offline-main .mid-box .para {
    font-size: max(14px, 1.125rem);
    color: #7a8799;
    line-height: 1.5;
    margin-top: 1rem;
}

.inner-s37 .pay-type-main .offline-main .btns {
    display: flex;
    grid-gap: 10px;
    padding: 0 2.5rem 2.5rem;
}

.inner-s37 .pay-type-main .offline-main .btns .btn {
    width: max(120px, 9.375rem);
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    color: #ffffff;
}

.inner-s37 .pay-type-main .offline-main .btns .btn.btn-normal:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s37 .pay-type-main .offline-main .btns .btn.btn-normal:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s37 .pay-type-main .offline-main .btns .btn span {
    display: block;
    text-align: center;
    font-size: max(14px, 1rem);
    line-height: max(40px, 3rem);
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

.inner-s37 .pay-type-main .offline-main .btns .btn:nth-child(1):after {
    opacity: 1;
}

.inner-s37 .pay-type-main .offline-main .btns .btn:nth-child(1) span {
    color: #fff;
}

.inner-s37 .pay-type-main .offline-main .btns .btn:nth-child(2) span {
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

@media (any-hover: hover) {
    .inner-s37 .pay-type-main .offline-main .btns .btn:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-5px);
    }

    .inner-s37 .pay-type-main .offline-main .btns .btn:hover:after {
        opacity: 1;
    }

    .inner-s37 .pay-type-main .offline-main .btns .btn:hover span {
        color: #fff;
    }
}

.inner-s37 .pay-type-main .code-main {
    display: none;
}

.inner-s37 .pay-type-main .code-main .layui-form {
    width: 600px;
    max-width: 100%;
    margin: 60px auto;
}

.inner-s37 .pay-type-main .code-main .layui-form .layui-form-item .layui-form-label {
    width: 100px;
}

.inner-s37 .pay-type-main .code-main .layui-form .layui-form-item .layui-input-inline {
    width: 360px;
    max-width: 100%;
}

.inner-s37 .pay-type-main .code-main .layui-form .layui-form-item .payment-btn {
    margin-top: 20px;
}

@media screen and (max-width: 1024px) {
    .inner-s37 .pay-method-type {
        grid-gap: 2rem;
    }

    .inner-s37 .pay-type-main .offline-main .mid-box .box:nth-child(1) {
        width: 60%;
    }

    .inner-s37 .pay-type-main .offline-main .mid-box .box:nth-child(2) {
        width: 30%;
    }
}

@media screen and (max-width: 750px) {
    .inner-s37 .pay-type-main .offline-main .btns {
        padding: 20px 2.5rem 2.5rem 0;
    }

    .inner-s37 .pay-type-main .offline-main .mid-box {
        display: block;
    }

    .inner-s37 .pay-type-main .offline-main .mid-box .box {
        width: 100% !important;
    }
}

.inner-s37 .tips-box {
    margin: 2.5rem 2.5rem;
    display: flex;
}

.inner-s37 .tips-box .tip {
    width: 50%;
    display: flex;
    align-items: center;
    grid-gap: 1.25rem;
}

.inner-s37 .tips-box .tip span {
    padding: 0 8px;
    border-radius: 3px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s37 .tips-box .tip i {
    display: block;
    line-height: 24px;
    font-size: max(12px, 0.875rem);
    font-style: normal;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s37 .tips-box .tip p {
    font-size: max(12px, 0.875rem);
    color: #00405b;
}

.inner-s37 .tips-box .tip a {
    font-size: max(12px, 0.875rem);
    color: #00405b;
    transition: color 0.3s ease;
}

.inner-s37 .tips-box .tip a:after {
    content: "";
    width: 8px;
    height: 8px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-19-1.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0 0 5px;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s37 .tips-box .tip a:hover {
        color: #00abc8;
    }

    .inner-s37 .tips-box .tip a:hover:after {
        background-image: url("../images/online/icon-19-2.png");
    }
}

.inner-s38 {
    padding: 7.5rem 0 0;
}

.inner-s38 .items {
    margin-top: 2.5rem;
}

.inner-s38 .sw {
    display: flex;
    grid-gap: 2.5rem;
}

.inner-s38 .item {
    width: calc((100% - 2.5rem) / 2);
    border: 2px solid #fff;
    border-radius: 5px;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    position: relative;
    padding: 2rem;
    text-align: center;
}

.inner-s38 .item:nth-of-type(1) {
    background-image: linear-gradient(180deg, #eaf8fa, #fff);
}

.inner-s38 .item:nth-of-type(2) {
    background-image: linear-gradient(180deg, #f0f5fa, #fff);
}

.inner-s38 .item .recommend {
    height: 3.75rem;
    width: 3.75rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-21.png");
    position: absolute;
    right: 2rem;
    top: -1.5rem;
}

.inner-s38 .item .icon {
    height: max(40px, 3.75rem);
    display: flex;
    justify-content: center;
}

.inner-s38 .item .icon img {
    display: block;
    height: 100%;
}

.inner-s38 .item .tit {
    font-size: 2rem;
    color: #00405b;
    margin-top: 1.5rem;
}

.inner-s38 .item p {
    font-size: max(14px, 1.125rem);
    color: #7a8799;
}

.inner-s38 .item .price {
    margin-top: 1rem;
    display: inline-block;
    font-size: 3rem;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    transition: all 0.3s ease;
}

.inner-s38 .item .btns {
    margin-top: 1rem;
    display: flex;
    grid-gap: 1.25rem;
    justify-content: center;
}

.inner-s38 .item .btns a {
    position: relative;
    transition: all 0.3s ease;
}

.inner-s38 .item .btns a:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s38 .item .btns a:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    z-index: 1;
}

.inner-s38 .item .btns a span {
    padding: 0 2.5rem;
    font-size: max(14px, 1.125rem);
    color: #fff;
    line-height: max(40px, 3rem);
    position: relative;
    z-index: 2;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s38 .item .btns a:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-5px);
    }
}

.inner-s39 {
    padding: 7.5rem 0;
}

.inner-s39 .items {
    margin-top: 2rem;
}

.inner-s39 .item {
    margin-top: 2.5rem;
}

.inner-s39 .item:nth-of-type(1) {
    margin-top: 0;
}

.inner-s39 .item .q-txt {
    display: flex;
    align-items: flex-start;
    grid-gap: 1rem;
}

.inner-s39 .item .q-txt span {
    width: 36px;
    text-align: center;
    font-size: 16px;
    line-height: 34px;
    border: 1px solid #fff;
    border-radius: 10px;
    text-align: center;
    background-color: #f6f6f6;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.05);
}

.inner-s39 .item .q-txt span i {
    font-style: normal;
    display: inline-block;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s39 .item .q-txt .tit {
    width: calc(100% - 36px - 1rem);
    line-height: 24px;
    padding: 6px 0;
    font-size: max(16px, 1.125rem);
    color: #00405b;
}

.inner-s39 .item .a-txt {
    display: flex;
    align-items: flex-start;
    grid-gap: 1rem;
    margin-top: 10px;
}

.inner-s39 .item .a-txt span {
    width: 36px;
    text-align: center;
    font-size: 16px;
    line-height: 34px;
    color: #00405b;
    border: 1px solid #fff;
    border-radius: 10px;
    text-align: center;
    background-color: #f6f6f6;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.05);
}

.inner-s39 .item .a-txt .para {
    width: calc(100% - 36px - 1rem);
    line-height: 24px;
    padding: 6px 1.25rem;
    font-size: max(14px, 1rem);
    color: #7a8799;
    background-color: #f6f6f6;
    border-radius: 0 0 10px 10px;
}

.inner-s40 {
    padding: 7.5rem 0 0;
}

.inner-s40 .cont {
    display: flex;
    align-items: center;
    border-radius: 10px;
    background-color: #fff;
    padding: 10px;
    box-shadow: 0 0.625rem 3.75rem rgba(212, 230, 234, 0.6);
    position: relative;
}

.inner-s40 .cont:after {
    content: "";
    width: 6rem;
    height: 5rem;
    position: absolute;
    right: 2rem;
    top: -2.5rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/icon-12.png");
    z-index: 2;
}

.inner-s40 .img-box {
    width: 50%;
    height: 22.875rem;
    border-radius: 10px;
    overflow: hidden;
}

.inner-s40 img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inner-s40 .txt-box {
    width: 50%;
    padding: 0 3.75rem;
}

.inner-s40 .para {
    font-size: max(14px, 1.125rem);
    color: #00405b;
    line-height: 1.5;
    font-family: "HarmonyOS_Sans_SC_Light";
}

.inner-s40 .para span {
    font-family: "HarmonyOS_Sans_SC_Regular";
}

.inner-s41 {
    padding: 7.5rem 0 5rem;
    background: url("../images/online/img-19.png") center bottom no-repeat;
    background-size: 100% auto;
}

.inner-s41 .img-box {
    width: 100%;
    max-width: 64.6875rem;
    margin: 3.75rem auto 0;
}

.inner-s41 .img-box img {
    display: block;
    width: 100%;
}

.inner-s42 {
    padding: 7.5rem 0;
    overflow: hidden;
}

.inner-s42 .wrap-s:before {
    content: "";
    width: 101.4375rem;
    height: 78.6875rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/online/img-22.png");
    z-index: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.inner-s42 .inner-label {
    position: relative;
    z-index: 2;
}

.inner-s42 .items {
    margin-top: 2.5rem;
    background-color: rgba(255, 255, 255, 0.6);
    border-radius: 10px;
    border: 1px solid #eaedf5;
    padding: 0 3.75rem;
    position: relative;
    z-index: 2;
}

.inner-s42 .item {
    padding: 3.75rem 0;
    border-top: 1px solid #eaedf5;
    display: flex;
    align-items: center;
}

.inner-s42 .item:nth-of-type(1) {
    border: none;
}

.inner-s42 .item .img-box {
    width: 28.125rem;
    height: 15.25rem;
    border-radius: 10px;
    overflow: hidden;
}

.inner-s42 .item .img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inner-s42 .item .txt-box {
    width: calc(100% - 28.125rem);
}

.inner-s42 .item i {
    display: block;
    width: max(40px, 3.75rem);
    height: max(40px, 3.75rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.inner-s42 .item .tit {
    font-size: max(16px, 1.25rem);
    color: #00405b;
    margin-top: 1.25rem;
}

.inner-s42 .item .para {
    font-size: max(14px, 1rem);
    color: #00405b;
    line-height: 1.5;
    font-family: "HarmonyOS_Sans_SC_Light";
    margin-top: 1rem;
}

.inner-s42 .item:nth-of-type(odd) .img-box {
    order: 2;
}

.inner-s42 .item:nth-of-type(odd) .txt-box {
    padding-right: 3.75rem;
}

.inner-s42 .item:nth-of-type(even) .txt-box {
    padding-left: 3.75rem;
}

.inner-s43 {
    padding: 5rem 0;
    background: url("../images/online/img-21.jpg") center top no-repeat;
    background-size: 100% auto;
}

.inner-s43 .inner-label .label:after {
    display: none;
}

.inner-s43 .para {
    font-size: max(14px, 1rem);
    color: #00405b;
    line-height: 1.5;
    text-align: center;
    font-family: "HarmonyOS_Sans_SC_Light";
    margin-top: 1.25rem;
}

.inner-s43 .btns {
    margin-top: 2.5rem;
    display: flex;
    justify-content: center;
}

.inner-s43 .btns a {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0 2rem;
    transition: all 0.3s ease;
}

.inner-s43 .btns a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #f4f8f8, #f4f8f8), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s43 .btns a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transition: opacity 0.3s ease;
}

.inner-s43 .btns a span {
    font-size: max(14px, 1rem);
    line-height: 40px;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s43 .btns a:hover {
        transform: translateY(-5px);
    }

    .inner-s43 .btns a:hover:after {
        opacity: 1;
    }

    .inner-s43 .btns a:hover span {
        color: #fff;
    }
}

.inner-s44 {
    margin-top: -60px;
    padding: calc(60px + 3.75rem) 0 7.5rem;
}

.inner-s44 .label {
    font-size: 2.25rem;
    color: #00405b;
    padding-left: 1.25rem;
    position: relative;
}

.inner-s44 .label:before {
    content: "";
    width: 4px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    border-radius: 2px;
}

.inner-s44 .block {
    margin-top: 1.5rem;
    background-color: #fff;
    border-radius: 5px;
    padding: 3.75rem;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
}

.inner-s44 .form-box {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 10px;
}

.inner-s44 .form-box .box {
    width: 100%;
}

.inner-s44 .form-box .box.t-center {
    display: flex;
    justify-content: center;
    grid-gap: 10px;
}

.inner-s44 .form-box input[type=text] {
    display: block;
    width: 100%;
    font-size: 14px;
    border-radius: 5px;
    background-color: #fff;
    border: 1px solid #e6e6e6;
    color: #7a8799;
    height: max(50px, 3.75rem);
    padding: 0 1.25rem;
}

.inner-s44 .form-box input[type=text]::-webkit-input-placeholder {
    color: #7a8799;
}

.inner-s44 .form-box input[type=text]:-moz-placeholder {
    color: #7a8799;
}

.inner-s44 .form-box input[type=text]::-moz-placeholder {
    color: #7a8799;
}

.inner-s44 .form-box input[type=text]:-ms-input-placeholder {
    color: #7a8799;
}

.inner-s44 .form-box input[type=text]::-ms-input-placeholder {
    color: #7a8799;
}

.inner-s44 .form-box input[type=text][disabled] {
    background-color: #f5f5f5;
    border-color: #e6e6e6 !important;
}

.inner-s44 .form-box button {
    position: relative;
    display: flex;
    justify-content: center;
    width: max(100px, 9.375rem);
    cursor: pointer;
    transition: all 0.3s ease;
}

.inner-s44 .form-box button:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 3px;
    z-index: 1;
}

.inner-s44 .form-box button span {
    font-size: max(12px, 0.875rem);
    line-height: max(36px, 3rem);
    position: relative;
    z-index: 2;
}

.inner-s44 .form-box button.cancel:before {
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s44 .form-box button.cancel:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 3px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s44 .form-box button.cancel span {
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s44 .form-box button.cancel:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }

    .inner-s44 .form-box button.cancel:hover:after {
        opacity: 1;
    }

    .inner-s44 .form-box button.cancel:hover span {
        color: #fff;
    }
}

.inner-s44 .form-box button.submit:before {
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s44 .form-box button.submit span {
    color: #fff;
}

@media (any-hover: hover) {
    .inner-s44 .form-box button.submit:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

.inner-s45 {
    padding: 7.5rem 0 0;
}

.inner-s45 .items {
    margin-top: 2.5rem;
}

.inner-s45 .sw {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 1.5rem;
}

.inner-s45 .item {
    width: calc((100% - 3rem) / 3);
    background-color: #fff;
    border: 1px solid #e4e7eb;
    border-radius: 5px;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.inner-s45 .item a {
    display: block;
    height: 100%;
    position: relative;
}

.inner-s45 .item .img-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s45 .item .img-box:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    z-index: 2;
    opacity: 0.9;
}

.inner-s45 .item .img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inner-s45 .item .txt-box {
    position: relative;
    border-radius: 5px;
    padding: 2.5rem 1.875rem 0;
    z-index: 2;
}

.inner-s45 .item .tit {
    display: inline-block;
    font-size: max(16px, 1.25rem);
    color: #00405b;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: all 0.3s ease;
}

.inner-s45 .item .tips {
    margin-top: 0.625rem;
    display: flex;
    grid-gap: 4px;
}

.inner-s45 .item .tips span {
    font-size: 12px;
    color: #7a8799;
    line-height: 22px;
    padding: 0 10px;
    background-color: #f2f5f7;
    border-radius: 3px;
    transition: all 0.3s ease;
}

.inner-s45 .item .salary {
    margin-top: 2rem;
    text-align: right;
    font-size: max(16px, 1.5rem);
    color: #00405b;
    font-family: "Rajdhani-Medium";
    padding-bottom: 1.25rem;
    border-bottom: 1px solid #e4e7eb;
    transition: all 0.3s ease;
}

.inner-s45 .item .ope {
    height: max(50px, 3.75rem);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.inner-s45 .item .ope .logo {
    width: 70px;
    height: 40px;
}

.inner-s45 .item .ope .logo img {
    width: auto;
    max-width: 100%;
    max-height: 100%;
}

.inner-s45 .item .ope span {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    transition: color 0.3s ease;
}

.inner-s45 .item .ope span:before {
    content: "";
    width: 12px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/index/icon-6.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0.625rem 0 0;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s45 .item:hover .img-box {
        opacity: 1;
    }

    .inner-s45 .item:hover .tit {
        color: #fff;
    }

    .inner-s45 .item:hover .salary {
        color: #fff;
        border-bottom-color: rgba(255, 255, 255, 0.3);
    }

    .inner-s45 .item:hover .ope span {
        color: rgba(255, 255, 255, 0.5);
    }

    .inner-s45 .item:hover .ope span:before {
        background-image: url("../images/index/icon-6-1.png");
    }
}

.inner-s45 .btns {
    margin-top: 2.5rem;
    display: flex;
    justify-content: center;
}

.inner-s45 .btns a {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0 3rem;
    border-radius: 5px;
    transition: all 0.3s ease;
}

.inner-s45 .btns a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s45 .btns a span {
    font-size: max(13px, 1rem);
    line-height: max(40px, 3rem);
    color: #fff;
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s45 .btns a:hover {
        transform: translateY(-5px);
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

.inner-s46 {
    padding: 7.5rem 0 0;
}

.inner-s46 .items {
    margin-top: 2rem;
    position: relative;
}

.inner-s46 .items:before {
    content: "";
    height: 2px;
    background-color: #ecf5e1;
    position: absolute;
    left: 12.5%;
    right: 12.5%;
    top: calc(5rem - 1px);
}

.inner-s46 .sw {
    display: flex;
    flex-wrap: wrap;
}

.inner-s46 .item {
    width: 25%;
    position: relative;
}

.inner-s46 .item:before {
    content: "";
    width: 0.75rem;
    height: 1.125rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/talent/icon-3.png");
    position: absolute;
    top: 4.4375rem;
    left: calc(100% - 0.375rem);
}

.inner-s46 .item .icon {
    position: relative;
    width: 10rem;
    height: 10rem;
    margin: 0 auto;
    background: #fff url("../images/talent/icon-2.png") center center no-repeat;
    background-size: contain;
}

.inner-s46 .item .icon i {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 3.75rem auto;
    will-change: transform;
}

.inner-s46 .item .num {
    font-size: 1.875rem;
    line-height: 1.5;
    color: #00405b;
    text-align: center;
    font-family: "Rajdhani-Medium";
}

.inner-s46 .item .tit {
    font-size: max(14px, 1.125rem);
    color: #00405b;
    text-align: center;
}

.inner-s46 .item p {
    font-size: max(12px, 0.875rem);
    color: #00405b;
    text-align: center;
    font-family: "HarmonyOS_Sans_SC_Light";
    margin-top: 5px;
    padding: 0 5px;
}

.inner-s46 .item:last-of-type:before {
    display: none;
}

@media (any-hover: hover) {
    .inner-s46 .item:hover i {
        transform: rotateY(360deg);
        transition: transform 0.6s ease;
    }
}

.inner-s46 .btns {
    margin-top: 4.375rem;
    display: flex;
    justify-content: center;
}

.inner-s46 .btns a {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0 3rem;
    transition: all 0.3s ease;
}

.inner-s46 .btns a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s46 .btns a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transition: opacity 0.3s ease;
}

.inner-s46 .btns a span {
    font-size: max(13px, 1rem);
    line-height: max(40px, 3rem);
    color: #00405b;
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s46 .btns a:hover {
        transform: translateY(-5px);
    }

    .inner-s46 .btns a:hover:after {
        opacity: 1;
    }

    .inner-s46 .btns a:hover span {
        color: #fff;
    }
}

.inner-s47 {
    padding: 7.5rem 0;
    background: url("../images/talent/img-2.jpg") center center no-repeat;
    background-size: 100% 100%;
}

.inner-s47 .items {
    margin-top: 2.5rem;
    border-radius: 10px;
    background-image: linear-gradient(180deg, #fff, rgba(255, 255, 255, 0));
    padding: 3.75rem 2rem;
}

.inner-s47 .sw {
    display: flex;
    flex-wrap: wrap;
    grid-row-gap: 2rem;
}

.inner-s47 .item {
    width: 16.66%;
    height: max(50px, 4.375rem);
    display: flex;
    align-items: center;
    justify-content: center;
}

.inner-s47 .item img {
    max-width: 60%;
    max-height: 60%;
}

.inner-s47 .btns {
    display: flex;
    justify-content: center;
}

.inner-s47 .btns a {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0 3rem;
    transition: all 0.3s ease;
}

.inner-s47 .btns a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #f4fbf8, #f4fbf8), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s47 .btns a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    opacity: 0;
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transition: opacity 0.3s ease;
}

.inner-s47 .btns a span {
    font-size: max(13px, 1rem);
    line-height: max(40px, 3rem);
    color: #00405b;
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s47 .btns a:hover {
        transform: translateY(-5px);
    }

    .inner-s47 .btns a:hover:after {
        opacity: 1;
    }

    .inner-s47 .btns a:hover span {
        color: #fff;
    }
}

.inner-s48 {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
    background-image: url("../images/talent/img-3.jpg");
    padding: 7.5rem 0;
}

.inner-s48 .items {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 1.25rem;
}

.inner-s48 .item {
    position: relative;
    width: calc((100% - 2.5rem) / 3);
    background-color: rgba(255, 255, 255, 0.7);
    border-radius: 10px;
    transition: background 0.3s ease;
}

.inner-s48 .item:before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid transparent;
    border-radius: 10px;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #8cce73, #00abc8);
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s48 .item a {
    display: block;
    height: 100%;
    border-radius: 10px;
    overflow: hidden;
    padding: 1.25rem 2.5rem 1.5rem;
    position: relative;
    z-index: 2;
}

.inner-s48 .item .logo {
    width: 11.25rem;
    height: 3.75rem;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}

.inner-s48 .item .logo img {
    max-width: 100%;
    max-height: 100%;
}

.inner-s48 .item .tips {
    position: absolute;
    right: 2.5rem;
    top: 1.875rem;
    display: flex;
}

.inner-s48 .item .tips span {
    background-color: #f2f5f7;
    font-size: 12px;
    color: #7a8799;
    padding: 0 0.625rem;
    line-height: 24px;
}

.inner-s48 .item .tit {
    margin-top: 3.75rem;
    font-size: max(16px, 1.375rem);
    color: #00405b;
    position: relative;
}

.inner-s48 .item .tit:after {
    content: "";
    width: 6px;
    height: 10px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/talent/icon-4.png");
    position: absolute;
    right: 0;
    top: calc(50% - 5px);
    opacity: 0;
    transition: opacity 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s48 .item:hover {
        background-color: #fff;
    }

    .inner-s48 .item:hover:before {
        opacity: 1;
    }

    .inner-s48 .item:hover .tit:after {
        opacity: 1;
    }
}

.inner-s49 {
    padding: 3.75rem 0 7.5rem;
}

.inner-s49 .top-block {
    position: relative;
    min-height: max(40px, 3rem);
}

.inner-s49 .top-block .btn {
    width: 100%;
    max-width: 20rem;
    height: max(40px, 3rem);
    display: flex;
    align-items: center;
    justify-content: center;
    grid-gap: 0.75rem;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 3px;
    transition: all 0.3s ease;
}

.inner-s49 .top-block .btn:before {
    content: "";
    width: 1.375rem;
    height: 1.25rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/offline/icon-1.png");
}

.inner-s49 .top-block .btn span {
    font-size: max(14px, 1rem);
    color: #fff;
}

@media (any-hover: hover) {
    .inner-s49 .top-block .btn:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-3px);
    }
}

.inner-s49 .top-block p {
    font-size: max(13px, 1rem);
    color: #7a8799;
    margin-top: 1rem;
}

.inner-s49 .top-block .form {
    width: 40rem;
    height: max(38px, 3rem - 2px);
    border: 1px solid #e4e7eb;
    border-radius: 5px;
    position: absolute;
    right: 0;
    top: 0;
    padding-right: 85px;
    padding-left: 44px;
}

.inner-s49 .top-block .form:before {
    content: "";
    width: 14px;
    height: 14px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/icon-2.svg");
    position: absolute;
    left: 20px;
    top: calc(50% - 7px);
}

.inner-s49 .top-block .form input {
    display: block;
    width: 100%;
    height: 100%;
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    background-color: transparent;
    padding-right: 1.25rem;
}

.inner-s49 .top-block .form button {
    width: max(60px, 5rem);
    position: absolute;
    right: 3px;
    top: 3px;
    bottom: 3px;
    border-radius: 5px;
    font-size: max(13px, 0.875rem);
    color: #fff;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s49 .items {
    margin-top: 2.5rem;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 1.5rem;
}

.inner-s49 .item {
    position: relative;
    width: calc((100% - 4.5rem) / 4);
    height: auto;
    background-color: #fff;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    border-radius: 5px;
}

.inner-s49 .item:before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid transparent;
    border-radius: 5px;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #8cce73, #00abc8);
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s49 .item a {
    display: block;
    height: 100%;
    border-radius: 5px;
    overflow: hidden;
    padding: 1.875rem 1.875rem 8.75rem;
    position: relative;
    z-index: 2;
}

.inner-s49 .item .addr {
    width: 50%;
    display: flex;
    align-items: center;
    grid-gap: 0.625rem;
}

.inner-s49 .item .addr:before {
    content: "";
    width: 1rem;
    height: 1rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/offline/icon-3.png");
}

.inner-s49 .item .addr span {
    font-size: max(14px, 1.125rem);
    color: #7a8799;
}

.inner-s49 .item .tit {
    margin-top: 1.25rem;
    font-size: max(15px, 1.125rem);
    color: #00405b;
    transition: color 0.3s ease;
}

.inner-s49 .item .info {
    display: flex;
    align-items: center;
    grid-gap: 10px;
    position: absolute;
    bottom: 6.25rem;
    left: 1.875rem;
    right: 1.875rem;
}

.inner-s49 .item .date {
    display: flex;
    align-items: center;
    grid-gap: 0.625rem;
}

.inner-s49 .item .date:before {
    content: "";
    width: 1rem;
    height: 1rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/offline/icon-2.png");
}

.inner-s49 .item .date span {
    font-size: max(14px, 1.125rem);
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s49 .item .days {
    font-size: 12px;
    color: #7a8799;
    line-height: 20px;
    padding: 0 0.625rem;
    border-radius: 3px;
    background-color: #f1f3f5;
}

.inner-s49 .item .ope {
    height: 5rem;
    position: absolute;
    bottom: 0;
    left: 1.875rem;
    right: 1.875rem;
    display: flex;
    align-items: center;
    border-top: 1px solid #e5e5e5;
}

.inner-s49 .item .price {
    display: flex;
    grid-gap: 1.25rem;
    align-items: flex-end;
}

.inner-s49 .item .price span {
    font-size: max(16px, 1.5rem);
    line-height: 1;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s49 .item .price del {
    font-size: max(12px, 1rem);
    color: #7a8799;
}

@media (any-hover: hover) {
    .inner-s49 .item:hover:before {
        opacity: 1;
    }

    .inner-s49 .item:hover .tit {
        color: #00abc8;
    }
}

.inner-s50 .items {
    display: flex;
    grid-gap: 1.5rem;
    transform: translateY(-3.75rem);
}

.inner-s50 .item {
    flex: 1 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    grid-gap: 1.5rem;
    border: 1px solid #fff;
    border-radius: 5px;
    background: #fff url("../images/offline/img-1.png") center top no-repeat;
    background-size: 100% auto;
    padding: 1.875rem;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.05);
}

.inner-s50 .item i {
    width: 3rem;
    height: 3rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    will-change: transform;
}

.inner-s50 .item .txt-box span {
    display: block;
    font-size: max(14px, 1.125rem);
    color: #7a8799;
}

.inner-s50 .item .txt-box p {
    display: flex;
    grid-gap: 1.25rem;
    align-items: flex-end;
}

.inner-s50 .item .txt-box p em {
    font-style: normal;
    font-size: max(16px, 1.5rem);
    color: #00405b;
    line-height: 1;
    margin-top: 0.625rem;
}

.inner-s50 .item .txt-box p del {
    font-size: max(12px, 1rem);
    color: #7a8799;
}

@media (any-hover: hover) {
    .inner-s50 .item:hover i {
        transform: rotateY(360deg);
        transition: transform 0.6s ease;
    }
}

.inner-s51 {
    padding: 0 0 7.5rem;
}

.inner-s52 {
    padding: 6.25rem 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../images/renzheng/img-1.jpg");
}

.inner-s52 .label {
    font-size: 2.5rem;
    color: #fff;
    text-align: center;
}

.inner-s53 {
    padding: 7.5rem 0;
    background-image: linear-gradient(180deg, #fff, #f0f5f7);
}

.inner-s53 .block {
    width: 76%;
    max-width: 1000px;
    margin: 0 auto;
}

.inner-s53 .tips {
    font-size: max(14px, 1.25rem);
    color: #00405b;
    line-height: 1.5;
}

.inner-s53 .tab-tit {
    margin-top: 5rem;
    display: flex;
    justify-content: center;
}

.inner-s53 .items {
    padding: 4px;
    border: 1px solid #e4e7eb;
    border-radius: 10px;
    display: flex;
    grid-gap: 10px;
}

.inner-s53 .item {
    position: relative;
    min-width: 8.5rem;
    padding: 0 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    height: max(30px, 2.5rem);
    cursor: pointer;
}

.inner-s53 .item:before {
    content: "";
    width: 100%;
    height: 100%;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 6px;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 1;
}

.inner-s53 .item span {
    display: block;
    font-size: max(14px, 1.25rem);
    color: #7a8799;
    position: relative;
    z-index: 2;
    transition: color 0.3s ease;
}

.inner-s53 .item.active:before {
    opacity: 1;
}

.inner-s53 .item.active span {
    color: #fff;
}

@media (any-hover: hover) {
    .inner-s53 .item:hover:before {
        opacity: 1;
    }

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

.inner-s53 .form-box {
    margin-top: 3.75rem;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    padding: 4.375rem;
}

.inner-s53 .form {
    width: max(320px, 28.75rem);
    margin: 0 auto;
}

.inner-s53 .form .box {
    position: relative;
    margin-top: 1.25rem;
}

.inner-s53 .form .box:nth-of-type(1) {
    margin-top: 0;
}

.inner-s53 .form .box.yzm {
    padding-right: 12.5rem;
}

.inner-s53 .form input[type=text] {
    display: block;
    width: 100%;
    font-size: max(14px, 1.125rem);
    border-radius: 10px;
    background-color: #fff;
    border: 1px solid #e1e5eb;
    color: #7a8799;
    height: max(50px, 3.75rem);
    padding: 0 1.25rem;
}

.inner-s53 .form input[type=text]::-webkit-input-placeholder {
    color: #7a8799;
}

.inner-s53 .form input[type=text]:-moz-placeholder {
    color: #7a8799;
}

.inner-s53 .form input[type=text]::-moz-placeholder {
    color: #7a8799;
}

.inner-s53 .form input[type=text]:-ms-input-placeholder {
    color: #7a8799;
}

.inner-s53 .form input[type=text]::-ms-input-placeholder {
    color: #7a8799;
}

.inner-s53 .form input[type=text][disabled] {
    background-color: #f5f5f5;
    border-color: #e6e6e6 !important;
}

.inner-s53 .form .code {
    position: absolute;
    top: 0;
    right: 0;
    width: 10rem;
    height: 100%;
}

.inner-s53 .form .code img {
    display: block;
    width: 100% !important;
    height: 100% !important;
}

.inner-s53 .form button {
    display: block;
    width: 100%;
    border-radius: max(20px, 1.5rem);
    height: max(40px, 3.125rem);
    font-size: max(14px, 1.25rem);
    color: #fff;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    text-align: center;
    cursor: pointer;
    margin: 3.75rem auto 0;
    transition: all 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s53 .form button:hover {
        transform: translateY(-3px);
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    }
}

.inner-s54 {
    padding: 7.5rem 0;
    background-image: linear-gradient(180deg, #fff, #f0f5f7);
}

.inner-s54 a.back {
    position: absolute;
    top: 0;
    left: 0;
    width: max(70px, 6.25rem);
    line-height: max(36px, 2.75rem);
    text-align: center;
    font-size: max(14px, 1.125rem);
    color: #7a8799;
    background-color: #f2f5f6;
    border-radius: max(18px, 1.375rem);
}

.inner-s54 a.back:before {
    content: "";
    width: 6px;
    height: 10px;
    display: inline-block;
    vertical-align: middle;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/renzheng/icon-1.png");
    margin: -4px 0.75rem 0 0;
}

.inner-s54 .block {
    width: 66%;
    max-width: 1000px;
    margin: 0 auto;
}

.inner-s54 .label {
    font-size: max(20px, 1.625rem);
    line-height: max(36px, 2.75rem);
    color: #00405b;
}

.inner-s54 .result-box {
    margin-top: 2.5rem;
    border-radius: 10px;
    box-shadow: 0 0.625rem 1.875rem rgba(70, 153, 181, 0.05);
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.5) url("../images/renzheng/img-4.png") center top no-repeat;
    background-size: 100% auto;
    padding: 3.75rem 3.75rem 3.75rem 5rem;
}

.inner-s54 .img-box {
    width: 14.0625rem;
    height: 18.75rem;
    margin: 0 auto;
    position: relative;
    perspective: 800px;
    transform: translateX(1.25rem);
    z-index: 1;
    order: 3;
}

.inner-s54 .img-box:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    right: 100%;
    top: 0;
    background: url("../images/renzheng/img-5.png") right top no-repeat;
    background-size: auto 100%;
}

.inner-s54 .img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform-style: preserve-3d;
    transform-origin: left center;
    transform: rotateY(25deg);
}

.inner-s54 .txt-box {
    width: calc(100% - 14.0625rem);
    padding-right: 2.5rem;
    order: 2;
}

.inner-s54 .tips {
    margin-top: 2rem;
    display: flex;
    align-items: baseline;
}

.inner-s54 .tips:nth-of-type(1) {
    margin-top: 0;
}

.inner-s54 .tips span {
    width: 12.5rem;
    font-size: max(12px, 1rem);
    color: #00405b;
}

.inner-s54 .tips p {
    width: calc(100% - 12.5rem);
    font-size: max(12px, 1rem);
    color: #00405b;
}

.inner-s55 {
    padding: 7.5rem 0;
    background: #fff url("../images/renzheng/img-6.png") center top no-repeat;
    background-size: 100% auto;
}

.inner-s55 .inner-label .label {
    text-align: left;
}

.inner-s55 .inner-label .label:after {
    margin-left: 0;
}

.inner-s55 .top-block {
    display: flex;
    align-items: center;
}

.inner-s55 .img-box {
    width: 21.5625rem;
    height: 28.75rem;
    margin: 0 auto;
    position: relative;
    perspective: 800px;
    transform: translateX(1.25rem);
    z-index: 1;
    order: 3;
}

.inner-s55 .img-box:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    right: 100%;
    top: 0;
    background: url("../images/renzheng/img-5.png") right top no-repeat;
    background-size: auto 100%;
}

.inner-s55 .img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform-style: preserve-3d;
    transform-origin: left center;
    transform: rotateY(35deg);
}

.inner-s55 .txt-box {
    width: calc(100% - 21.5625rem);
    padding-right: 7.5rem;
}

.inner-s55 .txt-box .para {
    font-size: max(14px, 1.125rem);
    color: #00405b;
    line-height: 1.7;
    margin-top: 1.5rem;
}

.inner-s55 .tips-tit {
    width: 17.5rem;
    padding: 0 1.5rem;
    border-radius: 4px;
    background-image: linear-gradient(90deg, #e5f6f9, #fff);
    display: flex;
}

.inner-s55 .tips-tit span {
    font-size: max(14px, 1.125rem);
    line-height: max(30px, 2.5rem);
    font-weight: bold;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    transform: skewX(-10deg);
}

.inner-s55 .tips-tit.mt {
    margin-top: 2.5rem;
}

.inner-s55 .tips {
    margin-top: 1.25rem;
    font-size: max(14px, 1.125rem);
    color: #00405b;
}

.inner-s55 .tips p {
    position: relative;
    padding-left: 1.5rem;
    margin-top: 1.25rem;
}

.inner-s55 .tips p:nth-of-type(1) {
    margin-top: 0;
}

.inner-s55 .tips p:before {
    content: "●";
    position: absolute;
    top: 0;
    left: 0;
    font-size: max(14px, 1.125rem);
    color: #bfd9d9;
    transform: scale(0.6);
    transform-origin: left center;
}

.inner-s55 .bot-block {
    margin-top: 3.125rem;
    padding-top: 3.125rem;
    border-top: 1px solid #e8f4f8;
}

.inner-s55 .items {
    margin-top: 1.875rem;
    position: relative;
}

.inner-s55 .item {
    width: calc((100% - 72px) / 4);
    height: auto;
    margin-right: 24px;
    background-color: #f7fbfb;
    border-radius: 10px;
    position: relative;
}

.inner-s55 .item:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    background-image: linear-gradient(135deg, #8cce73, #00abc8);
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s55 .item .box {
    height: 100%;
    padding: 2.5rem;
    display: flex;
    flex-direction: column;
    grid-gap: 2rem;
    justify-content: space-between;
    position: relative;
    z-index: 2;
}

.inner-s55 .item span {
    display: block;
    font-size: 3.125rem;
    line-height: 1;
    font-family: "Rajdhani-Medium";
    color: #bfd9d9;
    transition: color 0.3s ease;
}

.inner-s55 .item p {
    font-size: max(14px, 1.125rem);
    color: #00405b;
    line-height: 1.5;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {
    .inner-s55 .item:hover:before {
        opacity: 1;
    }

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

    .inner-s55 .item:hover p {
        color: #fff;
    }
}

.inner-s55 .button {
    position: absolute;
    top: 50%;
    width: max(40px, 3.75rem);
    height: max(40px, 3.75rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    z-index: 2;
    transform: translateY(-50%);
}

.inner-s55 .prev {
    left: -7.5rem;
    background-image: url("../images/online/prev-1.png");
}

@media (any-hover: hover) {
    .inner-s55 .prev:hover {
        background-image: url("../images/online/prev-2.png");
    }
}

.inner-s55 .next {
    right: -7.5rem;
    background-image: url("../images/online/next-1.png");
}

@media (any-hover: hover) {
    .inner-s55 .next:hover {
        background-image: url("../images/online/next-2.png");
    }
}

.inner-s56 {
    padding: 7.5rem 0;
    background: #f0f5f7 url("../images/renzheng/img-7.jpg") center top no-repeat;
    background-size: 100% auto;
}

.inner-s56 .inner-label .label {
    text-align: left;
}

.inner-s56 .inner-label .label:after {
    margin-left: 0;
}

.inner-s56 .block {
    margin-top: 2.5rem;
    padding-right: 3.75rem;
    position: relative;
}

.inner-s56 .block:before {
    content: "";
    width: 0;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    border-right: 2px dashed #d9dddf;
    z-index: 1;
}

.inner-s56 .line-ani {
    width: 2px;
    max-height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    background-image: linear-gradient(0deg, #8cce73, #00abc8);
    z-index: 2;
}

.inner-s56 .items {
    position: relative;
    z-index: 3;
}

.inner-s56 .item {
    position: relative;
    margin-top: 3.75rem;
    min-height: 10rem;
    padding: 1.5rem 1.875rem 2.5rem;
    border: 1px solid #fff;
    background-color: rgba(255, 255, 255, 0.4);
    border-radius: 10px;
    transition: all 0.3s ease;
}

.inner-s56 .item:nth-of-type(1) {
    margin-top: 0;
}

.inner-s56 .item:before {
    content: "";
    width: calc(2rem + 2px);
    height: calc(2rem + 2px);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/renzheng/icon-5-1.png");
    position: absolute;
    right: -4.8rem;
    top: calc(50% - 1rem - 1px);
    transition: all 0.3s ease;
}

.inner-s56 .item .num {
    position: absolute;
    right: 1.875rem;
    bottom: 1.875rem;
    font-size: 5rem;
    line-height: 1;
    font-family: "Rajdhani-Medium";
    color: #edf2f4;
    transition: all 0.3s ease;
}

.inner-s56 .item .tit {
    padding-bottom: 1.5rem;
    font-size: max(16px, 1.375rem);
    color: #00405b;
    border-bottom: 1px solid #d5eaf1;
}

.inner-s56 .item .para {
    font-size: max(14px, 1.125rem);
    line-height: 1.5;
    color: #00405b;
    margin-top: 1.5rem;
}

.inner-s56 .item .para span {
    font-weight: bold;
}

.inner-s56 .item .s-para {
    margin-top: 0.625rem;
    display: flex;
    font-size: max(12px, 0.875rem);
    color: #7a8799;
    grid-gap: 10px;
}

.inner-s56 .item .s-para span {
    white-space: nowrap;
}

.inner-s56 .item .s-para .s-tips {
    display: flex;
    flex-wrap: wrap;
    grid-column-gap: 1.875rem;
}

.inner-s56 .item .tips {
    margin-top: 1.25rem;
    display: flex;
    align-items: center;
    grid-gap: 0.625rem;
}

.inner-s56 .item .tips:before {
    content: "";
    width: max(14px, 1.25rem);
    height: max(14px, 1.25rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/renzheng/icon-2.png");
}

.inner-s56 .item .tips span {
    font-size: max(13px, 1rem);
    color: #96c34e;
}

.inner-s56 .item .drop-box {
    margin-top: 2rem;
    display: flex;
    grid-gap: 10px;
}

.inner-s56 .item .drop-box .s-drop {
    position: relative;
}

.inner-s56 .item .drop-box .s-drop .show {
    position: relative;
    padding: 0 1.5rem;
    cursor: pointer;
}

.inner-s56 .item .drop-box .s-drop .show:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s56 .item .drop-box .s-drop .show span {
    font-size: max(13px, 1rem);
    line-height: max(36px, 2.625rem);
    position: relative;
    z-index: 2;
    transition: color 0.3s ease;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s56 .item .drop-box .s-drop .show span:after {
    content: "";
    width: 9px;
    height: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/renzheng/icon-3.png");
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0 0 0.625rem;
}

.inner-s56 .item .drop-box .s-drop .hide {
    background-color: rgba(255, 255, 255, 0.7);
    border-radius: 5px;
    position: absolute;
    top: calc(100% + 5px);
    left: 0;
    width: 100%;
    padding: 0 1.5rem;
    display: none;
}

.inner-s56 .item .drop-box .s-drop .hide a {
    display: block;
    padding: 0.75rem 0;
    border-top: 1px solid #e8f4f7;
    font-size: max(12px, 0.875rem);
    color: #00405b;
    position: relative;
}

.inner-s56 .item .drop-box .s-drop .hide a:nth-of-type(1) {
    border: none;
}

.inner-s56 .item .drop-box .s-drop .hide a:after {
    content: "";
    width: 5px;
    height: 8px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/renzheng/icon-4.png");
    position: absolute;
    right: 0;
    top: calc(50% - 4px);
}

.inner-s56 .item .drop-box .s-drop.open .hide {
    display: block;
}

.inner-s56 .item .btns {
    margin-top: 2rem;
    display: flex;
    grid-gap: 10px;
}

.inner-s56 .item .btns a {
    position: relative;
    padding: 0 2rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.inner-s56 .item .btns a:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s56 .item .btns a:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.inner-s56 .item .btns a span {
    font-size: max(13px, 1rem);
    line-height: max(36px, 2.625rem);
    position: relative;
    z-index: 2;
    transition: color 0.3s ease;
}

.inner-s56 .item .btns a:nth-of-type(1) span {
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s56 .item .btns a:nth-of-type(2):after {
    opacity: 1;
}

.inner-s56 .item .btns a:nth-of-type(2) span {
    color: #fff;
}

@media (any-hover: hover) {
    .inner-s56 .item .btns a:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-5px);
    }

    .inner-s56 .item .btns a:hover:after {
        opacity: 1;
    }

    .inner-s56 .item .btns a:hover span {
        color: #fff;
    }
}

.inner-s56 .item.active {
    background-color: #fff;
}

.inner-s56 .item.active:before {
    background-image: url("../images/renzheng/icon-5-2.png");
}

.inner-s56 .item.active .num {
    color: transparent;
    background-image: linear-gradient(135deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
    text-shadow: -1rem -1rem 1.5rem rgba(74, 188, 154, 0.3);
}

@media (any-hover: hover) {
    .inner-s56 .item:hover {
        background-color: #fff;
    }

    .inner-s56 .item:hover .num {
        color: transparent;
        background-image: linear-gradient(135deg, #8cce73, #00abc8);
        -webkit-background-clip: text;
        background-clip: text;
        text-shadow: -1rem -1rem 1.5rem rgba(74, 188, 154, 0.3);
    }
}

.inner-s57 .items {
    display: flex;
    grid-gap: 1.5rem;
    transform: translateY(-3.75rem);
}

.inner-s57 .item {
    position: relative;
    width: calc((100% - 4.5rem) / 4);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid #fff;
    border-radius: 5px;
    background: #fff url("../images/offline/img-1.png") center top no-repeat;
    background-size: 100% auto;
    padding: 1.875rem;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.05);
}

.inner-s57 .item:nth-of-type(3) {
    width: calc(50% - 0.75rem);
    justify-content: center;
}

.inner-s57 .item i {
    width: 3rem;
    height: 3rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    will-change: transform;
}

.inner-s57 .item .txt-box {
    margin-top: 3.125rem;
}

.inner-s57 .item .txt-box span {
    display: block;
    font-size: max(14px, 1.125rem);
    color: #7a8799;
}

.inner-s57 .item .txt-box p {
    margin-top: 0.625rem;
    font-size: max(16px, 1.5rem);
    color: #00405b;
}

.inner-s57 .item .txt-box p em {
    font-style: normal;
    display: block;
    font-size: max(14px, 1.125rem);
}

.inner-s57 .item .tit {
    font-size: max(14px, 1.125rem);
    color: #7a8799;
}

.inner-s57 .item .info-box {
    margin-top: 0.625rem;
    margin-right: 12.5rem;
}

.inner-s57 .item .info {
    margin-top: 0.75rem;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.inner-s57 .item .info:nth-of-type(1) {
    margin-top: 0;
}

.inner-s57 .item .info span {
    width: calc(100% - 6rem);
    font-size: max(16px, 1.5rem);
    color: #00405b;
    line-height: max(26px, 2rem);
    position: relative;
    padding-left: 1.25rem;
}

.inner-s57 .item .info span:before {
    content: "•";
    font-size: max(16px, 1.5rem);
    color: #00405b;
    line-height: max(26px, 2rem);
    position: absolute;
    top: 0;
    left: 0;
}

.inner-s57 .item .info a {
    width: max(60px, 5rem);
    line-height: max(26px, 2rem);
    font-size: max(12px, 0.875rem);
    color: #fff;
    text-align: center;
    border-radius: 5px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s57 .item a.btns {
    width: 7.5rem;
    height: 7.5rem;
    position: absolute;
    right: 1.875rem;
    top: calc(50% - 3.75rem);
    border: 1px solid #d8e1e2;
    border-radius: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    grid-gap: 5px;
}

.inner-s57 .item a.btns:before {
    content: "";
    width: 3rem;
    height: 3rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/offline/icon-6.png");
}

.inner-s57 .item a.btns span {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
}

@media (any-hover: hover) {
    .inner-s57 .item:hover i {
        transform: rotateY(360deg);
        transition: transform 0.6s ease;
    }
}

.inner-s58 {
    margin-top: -60px;
    padding: calc(2rem + 60px) 0 0;
}

.inner-s58 .wrap-s {
    display: flex;
    align-items: center;
}

.inner-s58 .right-box {
    width: 33.75rem;
    position: relative;
    order: 2;
}

.inner-s58 .right-box img {
    display: block;
    width: 100%;
}

.inner-s58 .right-box .img-box {
    aspect-ratio: 509/296;
    position: absolute;
    top: 1rem;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 31.8125rem;
}

.inner-s58 .left-box {
    width: calc(100% - 33.75rem);
    padding-right: 3.75rem;
}

.inner-s58 .tit {
    font-size: 3rem;
    color: #005072;
}

.inner-s58 p {
    font-size: max(12px, 1.25rem);
    color: #005072;
    margin-top: 1rem;
}

.inner-s58 .check {
    margin-top: 2.5rem;
}

.inner-s58 .check .box {
    min-width: 10rem;
    height: max(40px, 3rem);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../images/community/n-5-1.png");
    cursor: pointer;
    background-size: 100% 100%;
    padding: 0 10px;
    margin: 0 10px 10px 0;
}

.inner-s58 .check .box span {
    font-size: max(13px, 1rem);
    color: #00405b;
}

.inner-s58 .check .box.active {
    background-image: url("../images/community/n-5-2.png");
}

.inner-s58 .check .box.active span {
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s58 .price {
    display: flex;
    grid-gap: 1.875rem;
    align-items: flex-end;
    margin-top: 3.125rem;
}

.inner-s58 .price span {
    font-size: 3rem;
    line-height: 1;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s58 .price del {
    font-size: 2.25rem;
    color: #7a8799;
}

.inner-s58 .btns {
    margin-top: 1.875rem;
    display: flex;
}

.inner-s58 .btns a,
.inner-s58 .btns button {
    width: 11.25rem;
    height: max(40px, 3rem);
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.inner-s58 .btns a span,
.inner-s58 .btns button span {
    font-size: max(14px, 1rem);
    line-height: max(40px, 3rem);
    color: #fff;
    transition: color 0.3s ease;
}

@media (any-hover: hover) {

    .inner-s58 .btns a:hover,
    .inner-s58 .btns button:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-3px);
    }
}

.inner-s59 {
    background-color: transparent;
    padding: 5rem 0 7.5rem;
}

.inner-s60 {
    padding: 7.5rem 0;
}

.inner-s60 .items {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 1.5rem;
}

.inner-s60 .item {
    width: calc((100% - 4.5rem) / 4);
}

.inner-s60 .item a {
    display: block;
    height: 100%;
    border-radius: 5px;
    overflow: hidden;
    background-color: #fff;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.1);
}

.inner-s60 .item .img-box {
    aspect-ratio: 39/22;
    overflow: hidden;
}

.inner-s60 .item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.inner-s60 .item .txt-box {
    padding: 1.875rem;
}

.inner-s60 .item .tit {
    font-size: max(15px, 1.125rem);
    color: #00405b;
    transition: color 0.3s ease;
}

.inner-s60 .item p {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
    height: max(36px, 2.625rem);
    line-height: 1.5rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 0.625rem;
}

.inner-s60 .item .price {
    display: flex;
    grid-gap: 1.25rem;
    align-items: flex-end;
    margin-top: 1.5rem;
}

.inner-s60 .item .price span {
    font-size: max(16px, 1.5rem);
    line-height: 1;
    color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s60 .item .price del {
    font-size: max(12px, 1.25rem);
    color: #7a8799;
}

@media (any-hover: hover) {
    .inner-s60 .item:hover img {
        transform: scale(1.1);
    }

    .inner-s60 .item:hover .tit {
        color: #00abc8;
    }
}

.inner-s61 {
    padding: 5rem 0 0;
}

.inner-s61 .countdown {
    margin-top: 2.5rem;
    display: flex;
    justify-content: center;
    font-size: 0;
}

.inner-s61 .countdown .countDays,
.inner-s61 .countdown .countHours,
.inner-s61 .countdown .countMinutes,
.inner-s61 .countdown .countSeconds {
    display: flex;
    grid-gap: 0.625rem;
}

.inner-s61 .countdown .countDiv {
    width: 3.75rem;
    height: 9.375rem;
}

.inner-s61 .countdown .position {
    width: 5rem;
    height: 9.375rem;
    border: 1px solid #fff;
    border-radius: 0.625rem;
    border: 1px solid #e4e7eb;
    position: relative;
}

.inner-s61 .countdown .digit {
    position: absolute;
    top: 50% !important;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 5rem;
    font-family: "Rajdhani-Bold";
    color: transparent;
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    -webkit-background-clip: text;
    background-clip: text;
}

.inner-s61 .txt {
    display: flex;
    align-items: center;
    justify-content: center;
    grid-gap: 3.75rem;
    margin-top: 1.5rem;
}

.inner-s61 .txt span {
    width: 10.625rem;
    font-size: 1.5rem;
    color: #005072;
    text-align: center;
}

.inner-s62 {
    padding: 3.75rem 0 7.5rem;
}

.inner-s62 .flex {
    display: flex;
    grid-gap: 1.5rem;
    align-items: flex-start;
}

.inner-s62 .left-box {
    width: calc(100% - 21rem);
    background-color: #fff;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    border-radius: 5px;
    overflow: hidden;
    padding: 2.5rem 1.875rem;
}

.inner-s62 .left-box .filter-box {
    margin: -2.5rem -1.875rem 0;
    padding: 2.5rem 1.875rem 0;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
}

.inner-s62 .left-box .tab-tit .sw {
    display: flex;
    grid-gap: 2.5rem;
}

.inner-s62 .left-box .tab-tit .item {
    position: relative;
    padding-bottom: 1.5rem;
    cursor: pointer;
}

.inner-s62 .left-box .tab-tit .item span {
    display: block;
    font-size: max(16px, 1rem);
    color: #00405b;
    opacity: 0.5;
    transition: opacity .3s ease;
}

.inner-s62 .left-box .tab-tit .item:after {
    content: '';
    width: 100%;
    height: 4px;
    border-radius: 2px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    position: absolute;
    bottom: 0;
    left: 0;
    opacity: 0;
    transition: opacity .3s ease;
}

.inner-s62 .left-box .tab-tit .item.active span {
    opacity: 1;
}

.inner-s62 .left-box .tab-tit .item.active:after {
    opacity: 1;
}

@media (any-hover: hover) {
    .inner-s62 .left-box .tab-tit .item:hover span {
        opacity: 1;
    }
}

.inner-s62 .left-box .tab-cont .child {
    border-top: 1px solid #e5e5e5;
    display: none;
}

.inner-s62 .left-box .tab-cont .child.active {
    display: block;
}

.inner-s62 .left-box .tab-cont .box {
    display: flex;
    flex-wrap: wrap;
    padding: 1.25rem 0;
    grid-gap: 1.25rem;
}

.inner-s62 .left-box .tab-cont .item {
    position: relative;
    cursor: pointer;
}

.inner-s62 .left-box .tab-cont .item:before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 3px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    z-index: 1;
    opacity: 0;
    transition: opacity .3s ease;
}

.inner-s62 .left-box .tab-cont .item span {
    display: block;
    position: relative;
    z-index: 2;
    padding: 0 1.25rem;
    font-size: max(12px, 0.875rem);
    line-height: max(30px, 2.25rem);
    color: #00405b;
    text-align: center;
    transition: color .3s ease;
}

.inner-s62 .left-box .tab-cont .item.active:before {
    opacity: 1;
}

.inner-s62 .left-box .tab-cont .item.active span {
    color: #fff;
}

@media (any-hover: hover) {
    .inner-s62 .left-box .tab-cont .item:hover:before {
        opacity: 1;
    }

    .inner-s62 .left-box .tab-cont .item:hover span {
        color: #fff;
    }
}

.inner-s62 .left-box .tips-box {
    margin-top: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 2;
}

.inner-s62 .left-box .tips-box .innerleft {
    font-size: max(14px, 1rem);
    color: #7a8799;
}

.inner-s62 .left-box .tips-box .innerright {
    display: flex;
    align-items: center;
}

.inner-s62 .left-box .tips-box .essence-btn {
    padding: 0 20px;
    position: relative;
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    line-height: 30px;
    border-radius: 5px;
    cursor: pointer;
}

.inner-s62 .left-box .tips-box .essence-btn:before {
    content: '';
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 7px solid #e5f4f8;
    position: absolute;
    top: calc(100% - 1px);
    left: 20px;
    pointer-events: none;
    display: none;
}

.inner-s62 .left-box .tips-box .essence-btn.active {
    background-color: #e5f4f8;
    color: #0097ba;
}

.inner-s62 .left-box .tips-box .essence-btn.active:before {
    display: block;
}

.inner-s62 .left-box .tips-box .sort-box {
    display: flex;
    align-items: center;
    padding-left: 40px;
    margin-left: 20px;
    position: relative;
}

.inner-s62 .left-box .tips-box .sort-box:before {
    content: '';
    width: 1px;
    height: 16px;
    background-color: #bbc1ca;
    position: absolute;
    left: 0;
    top: 10px;
}

.inner-s62 .left-box .tips-box .sort-box .tit {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    margin-right: 12px;
}

.inner-s62 .left-box .tips-box .sort-box .drop {
    position: relative;
}

.inner-s62 .left-box .tips-box .sort-box .drop .show {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.inner-s62 .left-box .tips-box .sort-box .drop .show span {
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    line-height: 36px;
    padding-right: 10px;
}

.inner-s62 .left-box .tips-box .sort-box .drop .show:after {
    content: '';
    width: 10px;
    height: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/icon-6.png");
    transition: transform .3s ease;
}

.inner-s62 .left-box .tips-box .sort-box .drop .hide {
    position: absolute;
    right: 0;
    width: 160px;
    display: none;
    top: 100%;
    background-color: #fff;
    padding: 0 20px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.inner-s62 .left-box .tips-box .sort-box .drop .hide li {
    display: block;
    font-size: max(13px, 0.875rem);
    color: #7a8799;
    line-height: max(40px, 3.125rem);
    position: relative;
    border-top: 1px solid #e5e5e5;
    cursor: pointer;
}

.inner-s62 .left-box .tips-box .sort-box .drop .hide li:nth-of-type(1) {
    border: none;
}

.inner-s62 .left-box .tips-box .sort-box .drop .hide li.active {
    color: #0097ba;
}

.inner-s62 .left-box .tips-box .sort-box .drop.open .show:after {
    transform: rotate(-180deg);
}

.inner-s62 .left-box .tips-box .sort-box .drop.open .hide {
    display: block;
}

.inner-s62 .left-box .items-box {
    border-bottom: 1px solid #e6e6e6;
}

.inner-s62 .left-box .inneritem {
    padding: 20px 0;
    border-top: 1px solid #e6e6e6;
}

.inner-s62 .left-box .inneritem:nth-of-type(1) {
    border: none;
}

.inner-s62 .left-box .inneritem .top-block {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.inner-s62 .left-box .inneritem .top-block .info-box {
    width: 200px;
    display: flex;
    align-items: center;
    order: 2;
}

.inner-s62 .left-box .inneritem .top-block .info-box .userimg {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
}

.inner-s62 .left-box .inneritem .top-block .info-box .img-box {
    width: 100%;
    height: 100%;
}

.inner-s62 .left-box .inneritem .top-block .info-box img {
    display: block;
    width: 100%;
    object-fit: cover;
}

.inner-s62 .left-box .inneritem .top-block .info-box .userinfo {
    width: calc(100% - 48px);
    padding-left: 1.25rem;
}

.inner-s62 .left-box .inneritem .top-block .info-box .name {
    display: inline-block;
    font-size: max(14px, 1rem);
    color: #005072;
}

.inner-s62 .left-box .inneritem .top-block .info-box .time {
    font-size: 12px;
    color: #7a8799;
    margin-top: 5px;
}

.inner-s62 .left-box .inneritem .top-block .tit-box {
    width: calc(100% - 210px);
}

.inner-s62 .left-box .inneritem .top-block .tit-box .tit {
    font-size: 0;
}

.inner-s62 .left-box .inneritem .top-block .tit-box .topbox {
    display: inline-block;
    vertical-align: top;
    width: 48px;
    line-height: 24px;
    font-size: 14px;
    color: #fff;
    background-color: #0097ba;
    border-radius: 5px 5px 0 5px;
    text-align: center;
    margin-right: 10px;
}

.inner-s62 .left-box .inneritem .top-block .tit-box .refined {
    display: inline-block;
    vertical-align: top;
    width: 24px;
    line-height: 24px;
    font-size: 14px;
    color: #fff;
    background-color: #7aca7e;
    border-radius: 5px 5px 0 5px;
    text-align: center;
    margin-right: 10px;
}

.inner-s62 .left-box .inneritem .top-block .tit-box .link {
    font-size: max(16px, 1.125rem);
    line-height: 24px;
    color: #005072;
    transition: color .3s ease;
}

@media (any-hover: hover) {
    .inner-s62 .left-box .inneritem .top-block .tit-box .link:hover {
        color: #0097ba;
    }
}

.inner-s62 .left-box .inneritem .top-block .tit-box .tips {
    margin-top: 6px;
    display: flex;
    grid-gap: 10px;
}

.inner-s62 .left-box .inneritem .top-block .tit-box .tips span {
    font-size: 12px;
    color: #0097ba;
    background-color: #e5f4f8;
    border-radius: 12px;
    line-height: 24px;
    padding: 0 15px;
}

.inner-s62 .left-box .inneritem .mid-block {
    margin-top: 15px;
}

.inner-s62 .left-box .inneritem .mid-block .para {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
    line-height: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.inner-s62 .left-box .inneritem .bot-block {
    display: flex;
    justify-content: flex-end;
    grid-gap: 30px;
    margin-top: 10px;
}

.inner-s62 .left-box .inneritem .bot-block .ope {
    display: flex;
    grid-gap: 10px;
    align-items: center;
}

.inner-s62 .left-box .inneritem .bot-block .ope:before {
    content: '';
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.inner-s62 .left-box .inneritem .bot-block .ope span {
    font-size: 14px;
    color: #7a8799;
}

.inner-s62 .left-box .inneritem .bot-block .view:before {
    width: 16px;
    height: 10px;
    background-image: url("../images/community/icon-6-2.png");
}

.inner-s62 .left-box .inneritem .bot-block .like:before {
    width: 15px;
    height: 14px;
    background-image: url("../images/community/icon-6-4.png");
}

.inner-s62 .left-box .inneritem .bot-block .comment {
    cursor: pointer;
}

.inner-s62 .left-box .inneritem .bot-block .comment:before {
    width: 16px;
    height: 14px;
    background-image: url("../images/community/icon-6-3.png");
}

.inner-s62 .left-box .inneritem .replybox {
    margin-top: 15px;
    position: relative;
    padding-left: 58px;
    font-size: 0;
}

.inner-s62 .left-box .inneritem .replybox.nopd {
    padding-left: 0;
}

.inner-s62 .left-box .inneritem .replybox .img-box {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
}

.inner-s62 .left-box .inneritem .replybox .img-box img {
    display: block;
    width: 100%;
    height: 100%;
}

.inner-s62 .left-box .inneritem .replybox textarea {
    width: 100%;
    height: 48px;
    border: 1px solid #e6e6e6;
    border-radius: 5px;
    padding: 12px calc(80px + 2.5rem) 12px 12px;
    font-size: max(12px, 0.875rem);
    line-height: 20px;
    color: #7a8799;
    resize: none;
}

.inner-s62 .left-box .inneritem .replybox .send {
    width: 80px;
    position: absolute;
    right: 1.25rem;
    bottom: 1.25rem;
    border-radius: 3px;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    font-size: max(14px, 1rem);
    color: #fff;
    line-height: 36px;
    text-align: center;
    transition: all .3s ease;
    cursor: pointer;
    display: none;
}

@media (any-hover: hover) {
    .inner-s62 .left-box .inneritem .replybox .send:hover {
        box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
        transform: translateY(-2px);
    }
}

.inner-s62 .left-box .inneritem .replybox.focus textarea {
    height: 120px;
}

.inner-s62 .left-box .inneritem .replybox.focus .send {
    display: block;
}

.inner-s62 .left-box .inneritem .commentbox {
    margin-top: 15px;
    border: 1px solid #e6e6e6;
    border-radius: 5px;
    overflow: hidden;
}

.inner-s62 .left-box .inneritem .commentbox .comment-top {
    padding: 20px 30px;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.1);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.inner-s62 .left-box .inneritem .commentbox .comment-top .num {
    font-size: max(14px, 1rem);
    color: #005072;
}

.inner-s62 .left-box .inneritem .commentbox .comment-top .ope {
    background-color: #e5f4f8;
    border-radius: 4px;
    padding: 2px;
}

.inner-s62 .left-box .inneritem .commentbox .comment-top .ope span {
    display: inline-block;
    vertical-align: top;
    font-size: 12px;
    color: #0097ba;
    width: 48px;
    line-height: 24px;
    text-align: center;
    border-radius: 2px;
    cursor: pointer;
}

.inner-s62 .left-box .inneritem .commentbox .comment-top .ope span.active {
    background-color: #fff;
}

.inner-s62 .left-box .inneritem .commentbox .comment-list {
    padding: 30px;
}
.inner-s62 .left-box .inneritem .commentbox .list {
    margin-top: 30px;
    padding-left: 40px;
    position: relative;
}
.inner-s62 .left-box .inneritem .commentbox .more {
    text-align: center;
    margin-top: 30px;
}
.inner-s62 .left-box .inneritem .commentbox .more a{
    cursor: pointer;
    color: #0097ba;
}
.inner-s62 .left-box .inneritem .commentbox

.inner-s62 .left-box .inneritem .commentbox .list:nth-of-type(1) {
    margin-top: 0;
}

.inner-s62 .left-box .inneritem .commentbox .list .list-img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
}

.inner-s62 .left-box .inneritem .commentbox .list .list-img img {
    display: block;
    width: 100%;
    height: 100%;
}

.inner-s62 .left-box .inneritem .commentbox .list .list-tit {
    font-size: max(14px, 1rem);
    color: #005072;
    line-height: 30px;
}

.inner-s62 .left-box .inneritem .commentbox .list .list-para {
    font-size: max(12px, 0.875rem);
    color: #7a8799;
    line-height: 20px;
}

.inner-s62 .left-box .inneritem .commentbox .list .list-bot {
    margin-top: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.inner-s62 .left-box .inneritem .commentbox .list .time {
    font-size: 12px;
    color: #7a8799;
}

.inner-s62 .left-box .inneritem .commentbox .list .opebox {
    display: flex;
    justify-content: flex-end;
    grid-gap: 30px;
}

.inner-s62 .left-box .inneritem .commentbox .list .ope {
    display: flex;
    grid-gap: 10px;
    align-items: center;
}

.inner-s62 .left-box .inneritem .commentbox .list .ope:before {
    content: '';
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.inner-s62 .left-box .inneritem .commentbox .list .ope span {
    font-size: 14px;
    color: #7a8799;
}

.inner-s62 .left-box .inneritem .commentbox .list .like:before {
    width: 15px;
    height: 14px;
    background-image: url("../images/community/icon-6-4.png");
}

.inner-s62 .left-box .inneritem .commentbox .list .comment {
    cursor: pointer;
}

.inner-s62 .left-box .inneritem .commentbox .list .comment:before {
    width: 16px;
    height: 14px;
    background-image: url("../images/community/icon-6-3.png");
}

.inner-s62 .right-box {
    width: 19.5rem;
}

.inner-s62 .right-box .block {
    padding: 1.875rem;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    margin-top: 1.5rem;
}

.inner-s62 .right-box .block:nth-of-type(1) {
    margin-top: 0;
}

.inner-s62 .right-box .block.nostyle {
    padding: 0;
    background-color: transparent;
    border-radius: 0;
    box-shadow: none;
}

.inner-s62 .right-box .form {
    height: max(48px, 3.75rem);
    background-color: #fff;
    box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    position: relative;
}

.inner-s62 .right-box .form:before {
    content: '';
    width: 20px;
    height: 20px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/icon-2.svg");
    position: absolute;
    top: calc(50% - 10px);
    left: 20px;
}

.inner-s62 .right-box .form input {
    width: 100%;
    height: 100%;
    background-color: transparent;
    padding: 0 90px 0 45px;
    font-size: max(14px, 1rem);
    color: #005072;
}

.inner-s62 .right-box .form button {
    width: 80px;
    height: calc(100% - 10px);
    position: absolute;
    right: 5px;
    top: 5px;
    font-size: max(14px, 1rem);
    color: #fff;
    background-color: transparent;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    cursor: pointer;
    border-radius: 3px;
}

.inner-s62 .right-box .posting-btn {
    display: flex;
    grid-gap: 0.625rem;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    padding: 1.25rem;
    box-shadow: 0 0.625rem 1.875rem rgba(0, 171, 200, 0.3);
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
}

.inner-s62 .right-box .posting-btn:before {
    content: '';
    width: max(14px, 1.375rem);
    height: max(14px, 1.375rem);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/community/icon-5.png");
}

.inner-s62 .right-box .posting-btn span {
    font-size: max(14px, 1.25rem);
    color: #fff;
}

.inner-s62 .right-box .c-tit {
    font-size: max(18px, 1.5rem);
    color: #00405b;
    padding-left: 1.25rem;
    position: relative;
}

.inner-s62 .right-box .c-tit:before {
    content: '';
    width: 4px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-image: linear-gradient(180deg, #8cce73, #00abc8);
    border-radius: 2px;
}

.inner-s62 .right-box .box-1 {
    margin-top: 1.25rem;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 10px;
}

.inner-s62 .right-box .box-1 a {
    position: relative;
    background-color: #00abc8;
    border-radius: 5px;
    overflow: hidden;
}

.inner-s62 .right-box .box-1 a:before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    z-index: 1;
    opacity: 0;
    transition: opacity .3s ease;
}

.inner-s62 .right-box .box-1 a span {
    display: block;
    position: relative;
    z-index: 2;
    padding: 0.625rem;
    font-size: 12px;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (any-hover: hover) {
    .inner-s62 .right-box .box-1 a:hover:before {
        opacity: 1;
    }
}

.inner-s62 .right-box .box-3 {
    margin-top: 1.25rem;
    border-top: 1px solid #e6e6e6;
}

.inner-s62 .right-box .box-3 a {
    display: block;
    padding: 1rem 0;
    border-bottom: 1px solid #e6e6e6;
    position: relative;
}

.inner-s62 .right-box .box-3 a:after {
    content: '';
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: -1px;
    left: 0;
    background-image: linear-gradient(90deg, #8cce73, #00abc8);
    transform-origin: left top;
    transform: scaleX(0);
}

.inner-s62 .right-box .box-3 a .tit {
    font-size: max(14px, 1rem);
    color: #005072;
    line-height: 1.5;
    transition: color .3s ease;
}

.inner-s62 .right-box .box-3 a.hot {
    display: flex;
    align-items: flex-start;
    grid-gap: 5px;
}

.inner-s62 .right-box .box-3 a.hot .tit {
    max-width: calc(100% - 2.25rem - 5px);
}

.inner-s62 .right-box .box-3 a.hot:before {
    content: '';
    width: 2.25rem;
    height: 1.25rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/community/icon-1.png");
    order: 2;
}

@media (any-hover: hover) {
    .inner-s62 .right-box .box-3 a:hover:after {
        transform: scaleX(1);
        transition: transform .3s ease;
    }

    .inner-s62 .right-box .box-3 a:hover .tit {
        color: #00abc8;
    }
}

@media screen and (max-width: 1681px) {
    .inner-s13 .prev {
        left: -4.5rem;
    }

    .inner-s13 .next {
        right: -4.5rem;
    }

    .inner-s55 .prev {
        left: -4.5rem;
    }

    .inner-s55 .next {
        right: -4.5rem;
    }
}

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

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

    .index-s6 .swiper-2 .item .hide .s-para {
        -webkit-line-clamp: 5;
    }

    .index-s1 .menu-left {
        width: 282px;
    }

    .index-s1 .menu-right {
        left: 282px;
    }

    .index-s1 .swiper .item .txt {
        padding-left: 320px;
    }
}

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

@media screen and (max-width: 1281px) {
    .index-s1 .menu-left {
        width: 262px;
    }

    .index-s1 .menu-right {
        left: 262px;
    }
}

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

    .footer .top-block .link-box {
        grid-gap: 5rem;
    }

    .inner-s13 .button {
        display: none;
    }

    .inner-s24 .info {
        margin-top: 1rem;
    }

    .inner-s24 .btns {
        margin-top: 1rem;
    }

    .index-s1 .menu-right .items .item .tit {
        width: 11rem;
    }

    .index-s1 .menu-right .items .item .link {
        width: calc(100% - 11rem);
    }

    .index-s1 .menu-right .items .item .link {
        grid-gap: 1.25rem;
    }
}

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

    .header {
        height: 60px;
        padding: 0 8%;
    }

    .header .user-link,
    .header .user-info {
        display: none;
    }

    .header ul {
        display: block;
        position: fixed;
        top: 0;
        left: 100%;
        width: 100%;
        height: 100%;
        background-color: #fff;
        padding: 70px 30px;
        text-align: left;
        z-index: 3;
        transition: left 0.6s cubic-bezier(0.19, 1, 0.22, 1);
        overflow: auto;
    }

    .header ul.active {
        left: 0;
    }

    .header li {
        position: relative;
        display: block;
        margin: 0;
        border-bottom: 1px solid #e6e6e6;
    }

    .header li i {
        width: 50px;
        height: 50px;
        position: absolute;
        right: 0;
        top: 0;
        background-position: center;
        background-repeat: no-repeat;
        background-image: url("../images/icon-6.png");
        background-size: auto 5px;
    }

    .header li a.single {
        line-height: 50px;
        font-size: 16px;
        color: #00405b;
        padding: 0;
        margin-right: 50px;
    }

    .header li a.single:before {
        display: none;
    }

    .header li a.single:after {
        display: none;
    }

    .header li .subnav {
        position: static;
        margin-left: 0;
        width: 100%;
        display: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        font-size: 0;
        padding: 0 20px;
        transition: none !important;
    }

    .header li .subnav a {
        margin: 0;
        padding: 0;
    }

    .header li .subnav a span {
        text-align: left;
    }

    .header .search-btn {
        width: 18px;
        height: 18px;
    }

    .header .main {
        grid-gap: 1.5rem;
        margin-right: 40px;
    }

    .header .m-user-block {
        display: block;
        position: relative;
    }

    .header .m-user-block .show {
        width: 18px;
        height: 18px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url("../images/icon-5.svg");
    }

    .header .m-user-block .hide {
        width: 240px;
        padding-bottom: 20px;
        position: absolute;
        top: 38px;
        right: 0;
        background-color: #fff;
        box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.05);
        display: none;
    }

    .header .m-user-block .hide .link-box {
        padding: 20px 20px 0;
        display: flex;
        justify-content: center;
        grid-gap: 10px;
    }

    .header .m-user-block .hide .link-box a {
        position: relative;
        display: flex;
        justify-content: center;
        padding: 0 1.5rem;
        transition: all 0.3s ease;
    }

    .header .m-user-block .hide .link-box a:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 3px;
        z-index: 1;
    }

    .header .m-user-block .hide .link-box a span {
        font-size: max(14px, 1rem);
        line-height: max(30px, 2.5rem);
        position: relative;
        z-index: 2;
    }

    .header .m-user-block .hide .link-box a.btn-1:before {
        box-sizing: border-box;
        border: 1px solid transparent;
        background-clip: padding-box, border-box;
        background-origin: padding-box, border-box;
        background-image: linear-gradient(to right, #fff, #fff), linear-gradient(90deg, #8cce73, #00abc8);
    }

    .header .m-user-block .hide .link-box a.btn-1:after {
        content: "";
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        background-image: linear-gradient(90deg, #8cce73, #00abc8);
        border-radius: 3px;
        z-index: 1;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .header .m-user-block .hide .link-box a.btn-1 span {
        color: transparent;
        background-image: linear-gradient(90deg, #8cce73, #00abc8);
        -webkit-background-clip: text;
        background-clip: text;
        transition: all 0.3s ease;
    }

    .header .m-user-block .hide .link-box a.btn-2:before {
        background-image: linear-gradient(90deg, #8cce73, #00abc8);
    }

    .header .m-user-block .hide .link-box a.btn-2 span {
        color: #fff;
    }

    .header .m-user-block .hide .top-box {
        padding: 20px;
        display: flex;
        align-items: center;
        grid-gap: 10px;
        border-bottom: 1px solid #e5e5e5;
    }

    .header .m-user-block .hide .img-box {
        width: 48px;
        height: 48px;
        border-radius: 50%;
        overflow: hidden;
    }

    .header .m-user-block .hide .img-box img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .header .m-user-block .hide .txt-box {
        width: calc(100% - 58px);
    }

    .header .m-user-block .hide .name {
        font-size: 14px;
        color: #00405b;
    }

    .header .m-user-block .hide .tel {
        font-size: 12px;
        color: #7a8799;
    }

    .header .m-user-block .hide .mid-box {
        margin: 25px 50px 0;
    }

    .header .m-user-block .hide .mid-box .box {
        margin-top: 15px;
    }

    .header .m-user-block .hide .mid-box .box:nth-of-type(1) {
        margin-top: 0;
    }

    .header .m-user-block .hide .mid-box a {
        display: inline-block;
        font-size: 14px;
        color: #7a8799;
        transition: color 0.3s ease;
    }

    .inner-s58 {
        margin-top: 0;
    }

    .inner-s58 .wrap-s {
        display: block;
    }

    .inner-s58 .right-box {
        margin: 0 auto;
    }

    .inner-s58 .left-box {
        width: 100%;
    }

    .inner-s60 .item {
        width: calc((100% - 3rem) / 3);
    }

    .inner-s62 .flex {
        display: block;
    }

    .inner-s62 .left-box {
        width: 100%;
    }

    .inner-s62 .right-box {
        width: 100%;
        margin-top: 3rem;
    }

    .inner-s62 .left-box .tab-tit .sw {
        grid-gap: 0;
    }

    .inner-s62 .left-box .tab-tit .item {
        width: auto;
        margin-right: 20px;
        white-space: nowrap;

        &:last-of-type {
            margin-right: 0;
        }
    }

    .inner-s62 .left-box .tips-box {
        display: block;
    }

    .inner-s62 .left-box .tips-box .innerright {
        margin-top: 15px;
    }

    .inner-s62 .left-box .inneritem .top-block {
        display: block;
    }

    .inner-s62 .left-box .inneritem .top-block .tit-box {
        width: 100%;
        margin-top: 10px;
    }

    .inner-s62 .left-box .inneritem .bot-block {
        justify-content: flex-start;
    }
}

@media screen and (max-width: 1025px) and (any-hover: hover) {
    .header .m-user-block .hide .mid-box a:hover {
        color: #00abc8;
    }
}

@media screen and (max-width: 1025px) {
    .header .m-user-block .hide .bot-box {
        margin: 25px 20px 0;
        text-align: center;
    }

    .header .m-user-block .hide .bot-box .link {
        display: block;
        font-size: 14px;
        line-height: 36px;
        color: #fff;
        background-image: linear-gradient(90deg, #8cce73, #00abc8);
        border-radius: 3px;
    }

    .header .m-user-block .hide .bot-box .logout {
        display: inline-block;
        font-size: 14px;
        color: #00405b;
        margin-top: 8px;
    }

    .header .m-user-block:hover .hide {
        display: block;
    }

    .mNavBtn {
        display: block;
        width: 20px;
        height: 16px;
        right: 8%;
        top: 22px;
        position: fixed;
        cursor: pointer;
        z-index: 4;
    }

    .mNavBtn span {
        position: absolute;
        left: 0;
        width: 20px;
        height: 2px;
        background-color: #00405B;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }

    .mNavBtn span.line1 {
        top: 0;
    }

    .mNavBtn span.line2 {
        top: 7px;
    }

    .mNavBtn span.line3 {
        bottom: 0;
    }

    .mNavBtn.active .line2 {
        display: none;
    }

    .mNavBtn.active .line1 {
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 7px;
    }

    .mNavBtn.active .line3 {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        bottom: 7px;
    }

    .fixed-search .top-block {
        height: 60px;
    }

    .fixed-search .close {
        right: 8%;
    }

    .fixed-search .logo {
        left: 8%;
    }

    .fixed-search .box {
        position: absolute;
        top: 59px;
        left: 0;
        width: 100%;
        padding: 20px 8%;
        background-color: #fff;
    }

    .fixed-search .hot-box {
        position: static;
        box-shadow: none;
    }

    .head-null {
        height: 60px;
    }

    .c-crumbs {
        display: none;
    }

    .c-banner {
        margin-top: 0;
    }

    .wrap-s {
        width: 84%;
    }

    .fixed-right {
        display: none;
    }

    .fixed-bottom {
        display: block;
    }

    .footer {
        padding-bottom: 78px;
    }

    .footer .top-block {
        justify-content: center;
        padding-top: 3rem;
    }

    .footer .top-block .link-box {
        display: none;
    }

    .footer .mid-block {
        display: block;
        margin-top: 2rem;
    }

    .footer .mid-block span {
        margin: 0 auto;
        display: block;
        text-align: center;
        border: none;
    }

    .footer .mid-block .link {
        width: 100%;
        padding: 1.5rem 0 0;
        justify-content: center;
    }

    .footer .bot-block {
        display: block;
        justify-content: center;
        margin-top: 2rem;
        padding: 1.5rem 0;
    }

    .footer .bot-block p {
        text-align: center;
    }

    .footer .bot-block p a {
        margin: 0 5px;
    }

    .index-s1 .swiper {
        height: 64vw;
    }

    .index-s1 .menu-block {
        display: none;
    }

    .index-s1 .button {
        display: none;
    }

    .index-s1 .swiper .item .txt {
        padding-left: 0;
    }

    .m-index-s2 {
        display: block;
    }

    .index-s2 {
        margin-top: -100px;
        padding-top: 130px;
    }

    .index-s2:before {
        background-size: 100% auto;
    }

    .index-s3 .single-box {
        position: static;
        display: block;
    }

    .index-s3 .items {
        margin: 0 -12px;
        padding: 2rem 0;
    }

    .index-s3 .items .sw {
        display: flex;
        grid-gap: 0;
    }

    .index-s3 .items .item:nth-of-type(1) {
        opacity: 1;
        pointer-events: auto;
    }

    .index-s3 .items .item {
        width: calc(33.33% - 24px);
        margin: 0 12px;
        box-shadow: 0 0 12px rgba(0, 0, 0, 0.08);
    }

    .index-s3 .items .item .img-box {
        height: 15vw;
    }

    .index-s3 .pagination-1 {
        display: flex;
        justify-content: center;
        align-items: center;
        grid-gap: 1rem;
    }

    .index-s3 .pagination-1 span {
        width: 1rem;
        height: 1rem;
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url("../images/online/icon-9-1.png");
        cursor: pointer;
    }

    .index-s3 .pagination-1 span.active {
        background-image: url("../images/online/icon-9-2.png");
    }

    .index-s4 .items {
        padding: 0 1px;
    }

    .index-s4 .item {
        height: auto;
        transition: none;
        box-shadow: none;
    }

    .index-s4 .item .show {
        display: none;
    }

    .index-s4 .item .hide {
        width: 100%;
        position: static;
        opacity: 1;
        visibility: visible;
        transition: none;
        pointer-events: auto;
        padding: 0 0 2rem;
    }

    .index-s5 .sw {
        grid-gap: 0;
        flex-wrap: nowrap;
    }

    .index-s5 {
        box-shadow: none;
    }

    .index-s6 .swiper {
        padding: 3rem 0;
        margin: 0 -12px;
    }

    .index-s6 .swiper-2 .item {
        transition: none;
        width: calc(33.33% - 24px);
    }

    .index-s6 .swiper-2 .item .hide {
        display: none;
    }

    .index-s6 .swiper-1 .item .pos,
    .index-s6 .swiper-2 .item .pos {
        font-size: 12px;
    }

    .c-pages .total {
        display: none;
    }

    .c-pages {
        display: block;
    }

    .c-pages ul {
        max-width: 100%;
        justify-content: center;
        grid-gap: 0;
    }

    .c-pages ul li.last {
        display: none;
    }

    .c-items-1 .item {
        width: calc((100% - 3rem) / 3);
    }

    .c-items-1 .item .img-box {
        height: 15vw;
    }

    .c-items-1 .item .txt-box {
        padding: 1.5rem;
    }

    .index-s4 .pagination,
    .index-s5 .pagination,
    .inner-s10 .pagination,
    .inner-s5 .right-box .pagination,
    .inner-s11 .pagination,
    .inner-s12 .pagination,
    .inner-s13 .pagination,
    .inner-s18 .pagination,
    .inner-s27 .pagination {
        display: flex;
        justify-content: center;
        align-items: center;
        grid-gap: 1rem;
        margin-top: 2rem;
    }

    .index-s4 .pagination span,
    .index-s5 .pagination span,
    .inner-s10 .pagination span,
    .inner-s5 .right-box .pagination span,
    .inner-s11 .pagination span,
    .inner-s12 .pagination span,
    .inner-s13 .pagination span,
    .inner-s18 .pagination span,
    .inner-s27 .pagination span {
        width: 1rem;
        height: 1rem;
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url("../images/online/icon-9-1.png");
        cursor: pointer;
    }

    .index-s4 .pagination span.active,
    .index-s5 .pagination span.active,
    .inner-s10 .pagination span.active,
    .inner-s5 .right-box .pagination span.active,
    .inner-s11 .pagination span.active,
    .inner-s12 .pagination span.active,
    .inner-s13 .pagination span.active,
    .inner-s18 .pagination span.active,
    .inner-s27 .pagination span.active {
        background-image: url("../images/online/icon-9-2.png");
    }

    .inner-s1 {
        margin-top: 0;
    }

    .inner-s1 .ope {
        display: block;
    }

    .inner-s1 .tips {
        display: block;
        margin-top: 1rem;
    }

    .inner-s1 .tip {
        margin-top: 1rem;
    }

    .inner-s1 .tip:nth-of-type(1) {
        margin-top: 0;
    }

    .inner-s1.style-1 .c-items-1 {
        margin: 0 -12px;
        padding: 2rem 0;
    }

    .inner-s1.style-1 .c-items-1 .sw {
        grid-gap: 0;
        flex-wrap: nowrap;
    }

    .inner-s1.style-1 .c-items-1 .item {
        width: calc(33.33% - 24px);
        margin: 0 12px;
        box-shadow: 0 0 12px rgba(0, 0, 0, 0.08);
    }

    .inner-s1.style-1 .pagination {
        display: flex;
        justify-content: center;
        align-items: center;
        grid-gap: 1.5rem;
    }

    .inner-s1.style-1 .pagination span {
        width: 1rem;
        height: 1rem;
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url("../images/online/icon-9-1.png");
        cursor: pointer;
    }

    .inner-s1.style-1 .pagination span.active {
        background-image: url("../images/online/icon-9-2.png");
    }

    .inner-s2 {
        display: none;
    }

    .m-inner-s2 {
        display: block;
        background-color: #fff;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
        position: sticky;
        top: 60px;
        z-index: 8;
        margin-top: 5rem;
    }

    .m-inner-s2.style-1 {
        margin-top: 0;
    }

    .m-inner-s2.style-1 .items {
        justify-content: space-between;
    }

    .m-inner-s2.style-1 .item {
        width: auto;
    }

    .m-inner-s2.style-1 .item:before {
        display: none;
    }

    .m-inner-s2 .items {
        display: flex;
    }

    .m-inner-s2 .item {
        position: relative;
        width: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        grid-gap: 5px;
    }

    .m-inner-s2 .item:nth-of-type(1) {
        justify-content: flex-start;
    }

    .m-inner-s2 .item:before {
        content: "";
        width: 1px;
        height: 20px;
        background-color: #ebebeb;
        position: absolute;
        top: calc(50% - 10px);
        left: 0;
    }

    .m-inner-s2 .item span {
        font-size: 13px;
        line-height: 50px;
        color: #00405b;
    }

    .m-inner-s2 .item:after {
        content: "";
        width: 0;
        height: 0;
        border-left: 3px solid transparent;
        border-right: 3px solid transparent;
        border-top: 3px solid #999;
    }

    .m-inner-s2 .item:nth-of-type(1):before {
        display: none;
    }

    .m-inner-s2 .item.active span {
        color: #00abc8;
    }

    .m-inner-s2 .filter-items {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100vw;
        left: -8vw;
        background-color: #fff;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
        display: none;
    }

    .m-inner-s2 .filter-items.active {
        display: block;
    }

    .m-inner-s2 .filter-items[data-type=kcfl] {
        height: 350px;
        padding-bottom: 50px;
    }

    .m-inner-s2 .flex-box {
        display: flex;
        height: 100%;
    }

    .m-inner-s2 .left-box {
        width: 100px;
        height: 100%;
        background-color: #f5f5f5;
    }

    .m-inner-s2 .left-box .b-tit {
        display: block;
        font-size: 14px;
        line-height: 50px;
        color: #00405b;
        padding: 0 20px;
    }

    .m-inner-s2 .left-box .b-tit.active {
        background-color: #ffffff;
    }

    .m-inner-s2 .right-box {
        width: 100%;
        height: 100%;
    }

    .m-inner-s2 .child {
        display: none;
        height: 100%;
        padding: 2rem;
        overflow: auto;
    }

    .m-inner-s2 .child.active {
        display: block;
    }

    .m-inner-s2 .child .filter-more {
        margin-top: 2rem;
    }

    .m-inner-s2 .child .block {
        margin-top: 2rem;
    }

    .m-inner-s2 .child .block:nth-of-type(1) {
        margin-top: 0;
    }

    .m-inner-s2 .child .tit {
        font-size: 12px;
        color: #00405b;
    }

    .m-inner-s2 .child .link {
        margin-top: 1rem;
        display: flex;
        flex-wrap: wrap;
        grid-gap: 5px;
    }

    .m-inner-s2 .child .link a {
        width: calc((100% - 5px) / 2);
        font-size: 12px;
        line-height: 30px;
        color: #00405b;
        border-radius: 15px;
        text-align: center;
        background-color: #f5f5f5;
    }

    .m-inner-s2 .child .link a.active {
        color: #fff;
        background-image: linear-gradient(90deg, #8cce73, #00abc8);
    }

    .m-inner-s2 .single-box {
        height: 100%;
        max-height: 300px;
        overflow: auto;
    }

    .m-inner-s2 .single-box a {
        display: block;
        font-size: 14px;
        line-height: 49px;
        color: #00405b;
        padding: 0 20px;
        border-bottom: 1px solid #f0f0f0;
    }

    .m-inner-s2 .single-box a:last-of-type {
        border: none;
    }

    .m-inner-s2 .single-box a.active {
        color: #00abc8;
    }

    .m-inner-s2 .btn-box {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        display: flex;
    }

    .m-inner-s2 .btn-box a {
        width: 50%;
        font-size: 14px;
        line-height: 50px;
        text-align: center;
    }

    .m-inner-s2 .btn-box a.reset {
        background-color: #eee;
        color: #00405b;
    }

    .m-inner-s2 .btn-box a.submit {
        background-image: linear-gradient(90deg, #8cce73, #00abc8);
        color: #ffffff;
    }

    .inner-s3 .sort-box {
        display: none;
    }

    .inner-s3 .c-items-1 {
        margin-top: 0;
    }

    .inner-s3 .c-items-1 .item a {
        padding-bottom: 0;
    }

    .inner-s3 .c-items-1 .item .price {
        position: static;
        display: inline-block;
        padding: 0 1.5rem 1.5rem;
    }

    .inner-s4 {
        margin-top: 0;
    }

    .inner-s4 .top-block {
        display: block;
    }

    .inner-s4 .top-block .play-box {
        width: 100%;
    }

    .inner-s4 .top-block .video-box .controlbtn {
        display: none;
    }

    .inner-s4 .top-block .video-box .tips {
        width: 90%;
        max-width: 420px;
        left: 50%;
        top: 40%;
        bottom: auto;
        transform: translate(-50%, -50%);
        grid-gap: 20px;
    }

    .inner-s4 .top-block .video-box .tips .btn {
        width: 70px;
        text-align: center;
        padding: 0;
    }

    .inner-s4 .top-block .video-box .tips span {
        width: calc(100% - 90px);
    }

    .inner-s4 .top-block .ope-box {
        flex-wrap: wrap;
        grid-gap: 1rem;
    }

    .inner-s4 .top-block .ope-box .tips {
        width: 100%;
    }

    .inner-s4 .top-block .ope-box .time {
        width: 100%;
    }

    .inner-s4 .top-block .list-box {
        width: 100%;
        padding: 0 1.875rem 2rem;
        display: none;
    }

    .inner-s4 .top-block .list-box .label {
        line-height: 1.2;
        margin-bottom: 1rem;
    }

    .inner-s4 .top-block .list-box .scroll {
        width: calc(100% + 1.875rem);
        height: auto;
        max-height: 184px;
        position: static;
        margin-right: -1.875rem;
        padding: 0 1.875rem 0 0;
    }

    .inner-s4 .bot-block .tit-box .tips {
        display: block;
    }

    .inner-s4 .bot-block .tit-box .tip {
        margin-top: 1rem;
    }

    .inner-s4 .bot-block .tit-box .tip:nth-of-type(1) {
        margin-top: 0;
    }

    .inner-s5 .flex {
        display: block;
    }

    .inner-s5 .left-box {
        width: 100%;
    }

    .inner-s5 .right-box {
        width: 100%;
        margin-top: 3rem;
    }

    .inner-s5 .right-box .item {
        width: calc((100% - 20px) / 3);
        margin: 0;
    }

    .inner-s5 .right-box .item .img-box {
        height: auto;
    }

    .inner-s5 .c-items-1 .item .img-box {
        height: 14vw;
    }

    .inner-s7 .table-box .tit {
        position: sticky;
        left: 0;
    }

    .inner-s7 .table-box .table {
        overflow: auto;
    }

    .inner-s7 .table-box table {
        min-width: 800px;
    }

    .inner-s7 .table-box table th,
    .inner-s7 .table-box table td {
        padding: 1rem 1.5rem;
    }

    .inner-s7 .table-box table .btn {
        line-height: 24px;
    }

    .inner-s8 .side-img {
        display: none;
    }

    .inner-s8 .items {
        width: 100%;
    }

    .inner-s8 .pagination,
    .inner-s9 .pagination {
        grid-gap: 1rem;
    }

    .inner-s9 .c-items-1 .item {
        width: calc(33.33% - 24px);
    }

    .inner-s10 .item .img-box {
        height: 15vw;
    }

    .inner-s10 .button {
        display: none;
    }

    .inner-s10 .item .txt-box {
        padding: 1.5rem;
    }

    .inner-s10 .item .ope {
        display: block;
    }

    .inner-s10 .item .btn {
        width: 80px;
        display: inline-block;
        margin-top: 1rem;
        opacity: 1;
    }

    .inner-s11 .sw {
        grid-gap: 0;
    }

    .inner-s11 .item .img-box {
        height: 15vw;
    }

    .inner-s12 .sw {
        grid-gap: 0;
    }

    .inner-s12 .item .txt-box {
        padding: 2.5rem 1.875rem;
    }

    .inner-s12 .item i {
        right: 1.875rem;
    }

    .inner-s13 .tab-tit {
        order: 0;
        margin: 0 0 2rem;
    }

    .inner-s13 .tab-wrap:after {
        display: none;
    }

    .inner-s13 .tab-tit .sw {
        grid-gap: 0;
    }

    .inner-s13 .tab-tit .item {
        flex: none;
    }

    .inner-s13 .tab-cont .item .img-box {
        height: 23vw;
    }

    .inner-s13 .tab-cont .item .txt-box {
        padding-left: 2rem;
    }

    .inner-s16 .item .num {
        font-size: 3rem;
    }

    .inner-s18 .items {
        padding: 0 1rem;
    }

    .inner-s18 .sw {
        grid-gap: 0;
        border: none;
        overflow: unset;
    }

    .inner-s18 .item {
        transition: none;
        height: auto;
        box-shadow: none;
    }

    .inner-s18 .item .show {
        display: none;
    }

    .inner-s18 .item .hide {
        width: 100%;
        position: relative;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        padding-bottom: 50px;
    }

    .inner-s18 .item .hide .para {
        height: auto;
        padding: 2rem 0;
    }

    .inner-s18 .item .hide .ope {
        width: calc(100% - 3.75rem);
        position: absolute;
        bottom: 0;
    }

    .inner-s20 {
        margin-top: 0;
    }

    .inner-s23 .c-items-1 .item {
        width: calc(33.33% - 24px);
    }

    .inner-s24 {
        margin-top: 0;
    }

    .inner-s24 .flex {
        display: block;
    }

    .inner-s24 .img-box {
        width: 100%;
        height: 46vw;
    }

    .inner-s24 .txt-box {
        width: 100%;
        padding: 10px 0 0;
    }

    .inner-s26 .img-box {
        height: 23vw;
    }

    .inner-s27 .sw {
        grid-gap: 0;
    }

    .inner-s28 .roll .item {
        width: 20vw;
        height: 11vw;
    }

    .inner-s29 .item .img-box {
        height: 15vw;
    }

    .inner-s31 {
        margin-top: 0;
    }

    .inner-s32 {
        margin-top: 0;
    }

    .inner-s32 .item .img-box {
        height: 30vw;
    }

    .inner-s32 .item .txt-box {
        position: static;
        padding: 2rem;
    }

    .inner-s32 .item .txt-box:before {
        display: none;
    }

    .inner-s32 .item .tit {
        color: #005072;
        margin-right: 0;
    }

    .inner-s32 .pagination {
        grid-gap: 1rem;
        position: static;
        width: 100%;
        justify-content: center;
    }

    .inner-s32 .pagination span {
        background-image: url("../images/online/icon-9-1.png");
    }

    .inner-s33 .flex {
        display: block;
    }

    .inner-s33 .left-box {
        width: 100%;
    }

    .inner-s33 .right-box {
        width: 100%;
        margin-top: 3rem;
    }

    .inner-s33 .left-box .tab-tit .sw {
        grid-gap: 0;
    }

    .inner-s33 .left-box .tab-tit .item {
        width: auto;
    }

    .inner-s34 .flex {
        display: block;
    }

    .inner-s34 .left-box {
        width: 100%;
    }

    .inner-s34 .right-box {
        width: 100%;
        margin-top: 3rem;
    }

    .inner-s34 .top-box .box .img-box {
        height: 23vw;
    }

    .inner-s34 .right-box .items {
        position: static;
        margin-top: 1.5rem;
        max-height: 330px;
    }

    .inner-s35.pd-1 {
        margin-top: 0;
    }

    .inner-s35 .item .img-box {
        height: 15vw;
    }

    .inner-s37 {
        margin-top: 0;
        padding: 7.5rem 0;
    }

    .inner-s37 ul {
        display: none;
    }

    .inner-s37 .m-classlist {
        display: block;
    }

    .inner-s37 .tips-box {
        display: block;
    }

    .inner-s37 .tips-box .tip {
        width: 100%;
        margin-top: 1rem;
    }

    .inner-s37 .tips-box .tip:nth-of-type(1) {
        margin-top: 0;
    }

    .inner-s40 .cont:after {
        display: none;
    }

    .inner-s40 .img-box {
        height: 23vw;
    }

    .inner-s42 .wrap-s:before {
        display: none;
    }

    .inner-s48 .item .tit:after {
        opacity: 1;
    }

    .inner-s49 .item {
        width: calc((100% - 3rem) / 3);
    }

    .inner-s50 {
        padding: 5rem 0;
    }

    .inner-s50 .items {
        transform: none;
    }

    .inner-s53 .block {
        width: 100%;
    }

    .inner-s54 a.back {
        position: static;
        display: block;
    }

    .inner-s54 .block {
        width: 100%;
        margin-top: 2rem;
    }

    .inner-s55 .button {
        display: none;
    }

    .inner-s55 .pagination {
        margin-top: 2rem;
        display: flex;
        justify-content: center;
        align-items: center;
        grid-gap: 1.5rem;
    }

    .inner-s55 .pagination span {
        width: 1rem;
        height: 1rem;
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url("../images/online/icon-9-1.png");
        cursor: pointer;
    }

    .inner-s55 .pagination span.active {
        background-image: url("../images/online/icon-9-2.png");
    }

    .inner-s55 .item {
        width: calc((100% - 48px) / 3);
    }

    .inner-s56 .block {
        padding-right: 0;
    }

    .inner-s56 .block:before {
        display: none;
    }

    .inner-s56 .line-ani {
        display: none;
    }

    .inner-s56 .item:before {
        display: none;
    }

    .inner-s56 .item .num {
        display: inline-block;
        position: static;
        color: transparent;
        background-image: linear-gradient(90deg, #8cce73, #00abc8);
        -webkit-background-clip: text;
        background-clip: text;
        margin-bottom: 1rem;
    }

    .inner-s57 {
        padding: 5rem 0;
    }

    .inner-s57 .items {
        transform: none;
        flex-wrap: wrap;
    }

    .inner-s57 .item {
        width: calc((100% - 1.5rem) / 2);
    }

    .inner-s57 .item:nth-of-type(3) {
        width: 100%;
    }
}

@media screen and (max-width: 900px) {
    .index-s3 .items .item {
        width: calc(50% - 24px);
    }

    .index-s3 .items .item .img-box {
        height: 23vw;
    }

    .index-s6 .swiper-1 .item,
    .index-s6 .swiper-2 .item {
        width: calc(50% - 24px);
    }

    .c-items-1 .item {
        width: calc((100% - 1.5rem) / 2);
    }

    .c-items-1 .item .img-box {
        height: 23vw;
    }

    .inner-s1.style-1 .c-items-1 .item {
        width: calc(50% - 24px);
    }

    .inner-s5 .c-items-1 .item {
        width: calc((100% - 1.5rem) / 2);
    }

    .inner-s5 .c-items-1 .item .img-box {
        height: 21vw;
    }

    .inner-s6 .data span {
        font-size: 3rem;
    }

    .inner-s6 .item i {
        width: 4rem;
        height: 4rem;
        display: block;
        position: static;
        margin-bottom: 2rem;
    }

    .inner-s6 .item {
        padding: 2.5rem;
    }

    .inner-s9 .c-items-1 .item {
        width: calc(50% - 24px);
    }

    .inner-s10 .item {
        width: calc(50% - 24px);
    }

    .inner-s10 .item .img-box {
        height: 23vw;
    }

    .inner-s20 .txt-box {
        padding-left: 4rem;
    }

    .inner-s21 {
        margin-top: 0;
        padding-top: 2rem;
    }

    .inner-s22 .item {
        width: calc((100% - 1.5rem) / 2);
    }

    .inner-s22 .item .img-box {
        height: 21vw;
    }

    .inner-s22 .item .txt-box {
        padding: 2rem 0;
    }

    .inner-s23 .c-items-1 .item {
        width: calc(50% - 24px);
    }

    .inner-s25 {
        transform: none;
        box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.08);
    }

    .inner-s25 .cont {
        box-shadow: none;
        padding: 2rem 0;
    }

    .inner-s25 .item {
        display: block;
    }

    .inner-s25 .item a {
        width: 100%;
        display: block;
        line-height: 20px;
        margin-right: 0;
    }

    .inner-s26 .flex {
        display: block;
    }

    .inner-s26 .img-box {
        width: 100%;
        height: 45vw;
    }

    .inner-s26 .txt-box {
        width: 100%;
        padding: 2rem 0 0;
    }

    .inner-s29 .item {
        width: calc((100% - 1.5rem) / 2);
    }

    .inner-s29 .item .img-box {
        height: 23vw;
    }

    .inner-s34 .bot-box .item {
        width: calc((100% - 1.5rem) / 2);
    }

    .inner-s35 .item {
        width: calc((100% - 1.5rem) / 2);
    }

    .inner-s35 .item .img-box {
        height: 23vw;
    }

    .inner-s37 ul {
        overflow: auto;
    }

    .inner-s37 ul li {
        min-width: 720px;
    }

    .inner-s37 .price-box .single {
        text-align: left;
    }

    .inner-s37 .price-box .single span {
        width: auto;
        padding-left: 0;
    }

    .inner-s37 .price-box .total {
        text-align: left;
    }

    .inner-s37 .price-box .total span {
        width: auto;
        padding-left: 0;
    }

    .inner-s48 .item {
        width: calc((100% - 1.25rem) / 2);
    }

    .inner-s49 .item {
        width: calc((100% - 1.5rem) / 2);
    }

    .inner-s50 .items {
        flex-wrap: wrap;
    }

    .inner-s50 .item {
        flex: auto;
        width: calc((100% - 1.5rem) / 2);
    }

    .inner-s60 .item {
        width: calc((100% - 1.5rem) / 2);
    }
}

@media screen and (max-width: 769px) {
    .index-s1 .swiper .item .bg-box .bg.pc {
        display: none;
    }

    .index-s1 .swiper .item .bg-box .bg.m {
        display: block;
    }

    .inner-s5 .right-box .item .img-box {
        height: 23vw;
    }

    .inner-s11 .item .img-box {
        height: 23vw;
    }

    .inner-s13 .tab-cont .item {
        display: block;
    }

    .inner-s13 .tab-cont .item .img-box {
        width: 100%;
        height: 47vw;
    }

    .inner-s13 .tab-cont .item .txt-box {
        width: 100%;
        padding: 2rem 0 0;
    }

    .inner-s34 .top-box .box a {
        display: block;
    }

    .inner-s34 .top-box .box .img-box {
        width: 100%;
        height: 44vw;
    }

    .inner-s34 .top-box .box .txt-box {
        width: 100%;
        padding: 2rem 0 0;
    }

    .inner-s40 .cont {
        display: block;
    }

    .inner-s40 .img-box {
        width: 100%;
        height: 46vw;
    }

    .inner-s40 .txt-box {
        width: 100%;
        padding: 2rem 0 1rem;
    }

    .inner-s42 .item {
        display: block;
    }

    .inner-s42 .item .txt-box {
        width: 100%;
        margin-top: 2rem;
        padding: 0 !important;
    }

    .inner-s45 .item {
        width: calc((100% - 1.5rem) / 2);
    }

    .inner-s46 .item {
        width: 50%;
    }

    .inner-s46 .items:before {
        display: none;
    }

    .inner-s46 .sw {
        grid-row-gap: 2rem;
    }

    .inner-s46 .item:before {
        display: none;
    }

    .inner-s49 .top-block .form {
        width: 100%;
        margin-top: 1rem;
        position: relative;
    }

    .inner-s55 .top-block {
        display: block;
    }

    .inner-s55 .txt-box {
        width: 100%;
        padding: 3rem 0 0;
    }

    .inner-s55 .item {
        width: calc((100% - 24px) / 2);
    }
}

@media screen and (max-width: 640px) {
    .index-label .label span {
        font-size: 2rem;
    }

    .index-label p {
        font-size: 14px;
    }

    .index-s1 .swiper .item .year {
        font-size: 18px;
    }

    .index-s1 .swiper .item .tit {
        font-size: 20px;
    }

    .index-s1 .swiper .item p {
        font-size: 14px;
    }

    .index-s1 .swiper .item .btns {
        margin-top: 2rem;
    }

    .index-s1 .pagination {
        bottom: 2rem;
    }

    .index-s2 .sw {
        flex-wrap: wrap;
    }

    .index-s2 .item {
        width: 100%;
    }

    .index-s2 .item .img-box {
        height: 35vw;
    }

    .index-s3 {
        padding: 5rem 0 0;
    }

    .index-s3 .single-box .single-items {
        margin-bottom: 20px;
    }

    .index-s3 .single-box .single-item .tit {
        font-size: 16px;
        margin-right: 0;
    }

    .index-s3 .single-box .single-item .txt-box:before {
        height: 100%;
    }

    .index-s3 .single-box .pagination {
        position: absolute;
        bottom: -20px;
        left: 0;
        width: 100%;
        justify-content: center;
    }

    .index-s3 .single-box .pagination span {
        background-color: rgb(184, 197, 202);
    }

    .index-s3 .single-box .pagination span:before {
        background-color: transparent;
        background-image: linear-gradient(90deg, #8cce73, #00abc8);
    }

    .index-s3 .items .item {
        width: calc(100% - 24px);
    }

    .index-s3 .items .item .img-box {
        height: 47vw;
    }

    .index-s3 .items .item .tit {
        font-size: 16px;
    }

    .index-s4 {
        padding: 5rem 0 0;
    }

    .index-s4 .item .hide p {
        font-size: 14px;
    }

    .index-s5 {
        padding: 5rem 0 0;
    }

    .index-s6 {
        padding: 5rem 0 0;
    }

    .index-s6 .tab-tit .item span {
        font-size: 2rem;
    }

    .index-s6 .para {
        font-size: 14px;
    }

    .index-s6 .data-box {
        grid-column-gap: 0;
        grid-row-gap: 2rem;
        flex-wrap: wrap;
        margin-top: 3rem;
    }

    .index-s6 .data {
        width: 50%;
    }

    .index-s6 .data span {
        font-size: 3rem;
    }

    .index-s6 .data p {
        font-size: 14px;
    }

    .index-s6 .swiper-1 .item,
    .index-s6 .swiper-2 .item {
        width: calc(100% - 24px);
    }

    .index-s7 {
        padding: 5rem 0;
    }

    .index-s8 {
        padding: 5rem 0;
    }

    .index-s8 .flex {
        display: block;
    }

    .index-s8 .flex .left-box .tit {
        font-size: 2rem;
        text-align: center;
    }

    .index-s8 .flex .left-box p {
        font-size: 14px;
        text-align: center;
    }

    .index-s8 .flex .left-box .btns {
        justify-content: center;
    }

    .index-s8 .flex .right-box {
        margin-top: 2rem;
        justify-content: center;
    }

    .c-items-1 .item {
        width: 100%;
    }

    .c-items-1 .item .img-box {
        height: 47vw;
    }

    .c-items-1 .item .tit {
        font-size: 16px;
    }

    .c-items-2 .item .mid-box {
        margin: 1.5rem 0 0 0;
    }

    .c-items-2 .item .bot-box {
        margin: 1.5rem 0 0 0;
    }

    .c-items-2 .item .mid-box .tit {
        font-size: 14px;
    }

    .c-items-2 .item .mid-box .para {
        font-size: 12px;
    }

    .inner-label .label {
        font-size: 2rem;
    }

    .inner-label .label:after {
        margin-top: 1rem;
    }

    .inner-label p {
        margin-top: 1rem;
    }

    .c-banner .img-box {
        height: 60vw;
    }

    .c-banner .topic {
        font-size: 14px;
        margin-bottom: 2rem;
    }

    .c-banner .tit {
        font-size: 2rem;
    }

    .c-banner p {
        font-size: 14px;
        margin-top: 1rem;
        width: 65%;
    }

    .c-banner.style-1 .img-box {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .c-banner.style-1 .txt-box {
        position: relative;
        padding: 5rem 0;
    }

    .c-banner.style-1 p {
        width: 100%;
    }

    .c-banner .btns {
        margin-top: 1.5rem;
    }

    .c-banner .btns a span {
        padding: 0 1.5rem;
        line-height: 36px;
    }

    .c-banner .drop-box {
        margin-top: 1.5rem;
    }

    .c-banner .form {
        margin-top: 2rem;
    }

    .inner-s1 {
        margin-top: 0;
        padding: 5rem 0 0;
    }

    .inner-s1.pd-1 {
        padding: 5rem 0;
    }

    .inner-s1.pd-2 {
        padding: 5rem 0;
    }

    .inner-s1 .label {
        font-size: 2rem;
    }

    .inner-s1.style-1 .c-items-1 .item {
        width: calc(100% - 24px);
    }

    .inner-s3 {
        padding: 2rem 0 5rem;
    }

    .inner-s4 {
        padding: 5rem 0;
    }

    .inner-s4.pd-1 {
        padding: 5rem 0;
    }

    .inner-s4 .label {
        font-size: 2rem;
        margin-bottom: 2rem;
    }

    .inner-s4 .top-block .ope-box .collect {
        position: static;
    }

    .inner-s4 .top-block .ope-box .tips {
        margin-left: 0;
    }

    .inner-s4 .bot-block {
        display: block;
    }

    .inner-s4 .bot-block .tit-box {
        width: 100%;
    }

    .inner-s4 .bot-block .btn-box {
        width: 100%;
        margin-top: 2rem;
    }

    .inner-s5 {
        padding: 5rem 0 0;
    }

    .inner-s5.style-1 {
        padding: 0 0 5rem;
    }

    .inner-s5 .tab-tit {
        grid-gap: 2rem;
    }

    .inner-s5 .tab-cont {
        margin-top: 2rem;
    }

    .inner-s5 .cont-2 .list {
        padding: 1.5rem 0;
    }

    .inner-s5 .cont-3 .reply .list {
        display: block;
    }

    .inner-s5 .cont-3 .reply .list .txt-box {
        width: 100%;
        padding: 1rem 0 1.875rem;
    }

    .inner-s5 .right-box .item .img-box {
        height: 47vw;
    }

    .inner-s5 .c-items-1 .item {
        width: 100%;
    }

    .inner-s5 .c-items-1 .item .img-box {
        height: auto;
    }

    .inner-s6 .item {
        width: 100%;
        padding: 2rem;
    }

    .inner-s6 .items {
        margin-top: 3rem;
    }

    .inner-s6 {
        padding: 5rem 0 0;
    }

    .inner-s6 .data-box {
        margin-top: 3rem;
        flex-wrap: wrap;
        grid-row-gap: 2rem;
    }

    .inner-s6 .data {
        width: 50%;
    }

    .inner-s7 {
        padding: 5rem 0 0;
    }

    .inner-s7.pd-1 {
        padding: 5rem 0;
    }

    .inner-s8 {
        padding: 5rem 0;
    }

    .inner-s9 {
        padding: 5rem 0 0;
    }

    .inner-s9 .c-items-1 .item {
        width: calc(100% - 24px);
    }

    .inner-s10 {
        padding: 5rem 0 0;
    }

    .inner-s10 .item {
        width: calc(100% - 24px);
    }

    .inner-s10 .item .img-box {
        height: 47vw;
    }

    .inner-s11 {
        padding: 5rem 0 0;
    }

    .inner-s11 .item .img-box {
        height: 47vw;
    }

    .inner-s12 {
        padding: 5rem 0 0;
    }

    .inner-s13 {
        padding: 5rem 0 0;
    }

    .inner-s14 {
        padding: 5rem 0;
    }

    .inner-s15 {
        padding: 5rem 0 0;
    }

    .inner-s16 {
        padding: 5rem 0 0;
    }

    .inner-s16 .items {
        margin-top: 3rem;
        flex-wrap: wrap;
        grid-row-gap: 2rem;
    }

    .inner-s16 .item {
        width: 50%;
    }

    .inner-s16 .item .num {
        margin-top: 0;
        line-height: 40px;
    }

    .inner-s17 {
        padding: 5rem 0 0;
    }

    .inner-s18 {
        padding: 5rem 0 0;
    }

    .inner-s19 {
        padding: 5rem 0;
    }

    .inner-s19 .item {
        width: calc((100% - 1.5rem) / 2);
        height: 60px;
    }

    .inner-s20 {
        padding: 5rem 0 2rem;
    }

    .inner-s20 .flex {
        height: auto;
        flex-wrap: wrap;
    }

    .inner-s20 .txt-box {
        width: 100%;
        padding: 0;
    }

    .inner-s20 .img-box {
        order: 2;
        margin: 2rem auto 0;
    }

    .inner-s20 .tit {
        font-size: 2rem;
    }

    .inner-s21 .items {
        padding: 2rem 0;
        height: auto;
        grid-row-gap: 1rem;
    }

    .inner-s21 .item p {
        font-size: 12px;
    }

    .inner-s21 .item .num span {
        font-size: 2.4rem;
    }

    .inner-s21 .item .num i {
        font-size: 12px;
    }

    .inner-s22 {
        padding: 5rem 0;
    }

    .inner-s22 .item {
        width: 100%;
    }

    .inner-s22 .item .img-box {
        height: 43vw;
    }

    .inner-s23 {
        padding: 5rem 0;
    }

    .inner-s23 .label {
        font-size: 2rem;
    }

    .inner-s23 .c-items-1 .item {
        width: calc(100% - 24px);
    }

    .inner-s24 {
        padding: 5rem 0 0;
    }

    .inner-s24 .list {
        display: block;
    }

    .inner-s24 .list p {
        width: 100%;
        border: none;
        padding-left: 24px;
        margin-top: 5px;
    }

    .inner-s25 span {
        font-size: 14px;
        width: 95px;
    }

    .inner-s25 .swiper-box {
        width: calc(100% - 95px);
        padding: 0 20px 0 10px;
    }

    .inner-s25 .item a {
        font-size: 13px;
    }

    .inner-s27 {
        padding: 5rem 0 0;
    }

    .inner-s28 {
        padding: 5rem 0 0;
    }

    .inner-s28 .roll .item {
        width: 50vw;
        height: 28vw;
    }

    .inner-s29 {
        padding: 5rem 0 0;
    }

    .inner-s29 .item {
        width: 100%;
    }

    .inner-s29 .item .img-box {
        height: 47vw;
    }

    .inner-s30 {
        padding: 5rem 0;
    }

    .inner-s31 {
        padding: 5rem 0;
    }

    .inner-s31 .class-box {
        margin-top: 2rem;
        padding: 1.5rem;
        display: block;
    }

    .inner-s31 .class-box .price {
        margin-top: 1rem;
    }

    .inner-s31 .form-box .item {
        flex-wrap: wrap;
        grid-gap: 10px;
    }

    .inner-s31 .form-box .item.item-2-1 .box {
        width: calc(50% - 5px);
    }

    .inner-s31 .form-box .item.item-2 {
        grid-column-gap: 0;
        grid-row-gap: 30px;
    }

    .inner-s31 .form-box .item.item-2 .box {
        width: 100%;
    }

    .inner-s31 .form-box .layui-form-radio {
        margin: 0 2rem 0 0;
        line-height: 30px;
    }

    .inner-s31 .form-box .item.item-radio input[type=text] {
        width: 100px;
    }

    .inner-s31 .form-box .upload {
        display: block;
    }

    .inner-s31 .form-box .upload .para {
        width: 100%;
        padding: 1rem 0 0;
    }

    .inner-s32 {
        padding: 5rem 0 0;
    }

    .inner-s33 {
        padding: 5rem 0;
    }

    .inner-s33 .left-box .tab-tit .item span {
        font-size: 14px;
    }

    .inner-s33 .left-box .tab-cont .box {
        padding: 5px 0;
        grid-gap: 0;
    }

    .inner-s33 .left-box .tab-cont .item span {
        padding: 0 5px;
        line-height: 24px;
    }

    .inner-s33 .left-box .cont-1 .info {
        grid-column-gap: 0;
        grid-row-gap: 1rem;
    }

    .inner-s33 .left-box .cont-1 .info span {
        width: 50%;
    }

    .inner-s33 .left-box .cont-3 .reply .list {
        display: block;
    }

    .inner-s33 .left-box .cont-3 .reply .list .txt-box {
        width: 100%;
    }

    .inner-s33 .left-box .cont-3 .reply .list .s-list {
        padding: 1rem;
    }

    .inner-s33 .left-box .cont-3 .reply .list .ope-box {
        grid-gap: 1rem;
    }

    .inner-s34 {
        padding: 5rem 0 0;
    }

    .inner-s34 .c-tit {
        font-size: 2rem;
    }

    .inner-s34 .top-box .box .img-box {
        height: 42vw;
    }

    .inner-s34 .bot-box .item {
        width: 100%;
    }

    .inner-s35 {
        padding: 5rem 0;
    }

    .inner-s35.pd-1 {
        padding: 5rem 0;
    }

    .inner-s35 .b-label {
        font-size: 2rem;
    }

    .inner-s35 .filter {
        grid-gap: 5px;
    }

    .inner-s35 .filter a {
        width: calc((100% - 15px) / 4);
        max-width: 100px;
    }

    .inner-s35 .item {
        width: 100%;
    }

    .inner-s35 .item .img-box {
        height: 47vw;
    }

    .inner-s35 .item .txt-box {
        padding: 1.5rem;
    }

    .inner-s37 {
        padding: 5rem 0;
    }

    .inner-s37 .label {
        font-size: 2rem;
    }

    .inner-s37 .method-type {
        grid-gap: 2.5rem;
    }

    .inner-s37 .online-main .flex {
        display: block;
    }

    .inner-s37 .online-main .ewm-box {
        margin-top: 2rem;
        display: none;
    }

    .inner-s37 .online-main .ewm-box.active {
        display: flex;
    }

    .inner-s37 .online-main .ewm {
        width: 120px;
    }

    .inner-s37 .offline-main .mid-box {
        display: block;
    }

    .inner-s37 .offline-main .mid-box .box {
        width: 100%;
    }

    .inner-s37 .offline-main .mid-box .box:nth-of-type(2) {
        margin-top: 1.5rem;
    }

    .inner-s37 .tips-box {
        margin: 2rem 0 0;
    }

    .inner-s38 {
        padding: 5rem 0 0;
    }

    .inner-s38 .sw {
        flex-wrap: wrap;
        grid-gap: 2rem;
    }

    .inner-s38 .item {
        width: 100%;
    }

    .inner-s38 .item .tit {
        font-size: 18px;
    }

    .inner-s38 .item p {
        margin-top: 5px;
    }

    .inner-s38 .item .btns a span {
        padding: 0 1.5rem;
        line-height: 36px;
    }

    .inner-s39 {
        padding: 5rem 0;
    }

    .inner-s40 {
        padding: 5rem 0 0;
    }

    .inner-s41 {
        padding: 5rem 0;
    }

    .inner-s42 {
        padding: 5rem 0;
    }

    .inner-s42 .items {
        padding: 0;
        border-radius: 0;
        border: none;
    }

    .inner-s42 .item {
        margin-top: 2rem;
        padding: 2rem 0 0;
    }

    .inner-s42 .item:nth-of-type(1) {
        margin-top: 0;
        padding-top: 0;
    }

    .inner-s42 .item .img-box {
        width: 100%;
        height: 47vw;
    }

    .inner-s44 .block {
        padding: 1.875rem;
    }

    .inner-s44 .form-box .box:nth-of-type(1),
    .inner-s44 .form-box .box:nth-of-type(2) {
        width: 100%;
    }

    .inner-s45 {
        padding: 5rem 0 0;
    }

    .inner-s45 .item {
        width: 100%;
    }

    .inner-s46 {
        padding: 5rem 0 0;
    }

    .inner-s47 {
        padding: 5rem 0;
    }

    .inner-s48 {
        padding: 5rem 0;
    }

    .inner-s47 .items {
        padding: 1.5rem;
    }

    .inner-s47 .sw {
        grid-row-gap: 1rem;
    }

    .inner-s47 .item {
        width: 33.33%;
        height: 40px;
    }

    .inner-s48 .item {
        width: 100%;
    }

    .inner-s49 {
        padding: 2rem 0 5rem;
    }

    .inner-s49 .item {
        width: 100%;
    }

    .inner-s50 .item {
        width: 100%;
    }

    .inner-s52 {
        padding: 6rem 0;
    }

    .inner-s52 .label {
        font-size: 20px;
    }

    .inner-s53 {
        padding: 5rem 0;
    }

    .inner-s53 .tab-tit {
        margin-top: 2rem;
        display: block;
    }

    .inner-s53 .items {
        flex-wrap: wrap;
        grid-gap: 6px;
    }

    .inner-s53 .item {
        width: calc(50% - 3px);
        padding: 0;
    }

    .inner-s53 .form-box {
        margin-top: 2rem;
        padding: 2rem;
    }

    .inner-s53 .form {
        width: 100%;
    }

    .inner-s54 {
        padding: 5rem 0;
    }

    .inner-s54 .result-box {
        margin-top: 2rem;
        padding: 4rem 2rem;
        display: block;
    }

    .inner-s54 .txt-box {
        width: 100%;
        margin: 4rem 0 0;
        padding-right: 0;
    }

    .inner-s55 {
        padding: 5rem 0;
    }

    .inner-s55 .item {
        width: 100%;
    }

    .inner-s56 {
        padding: 5rem 0;
    }

    .inner-s56 .item .num {
        font-size: 3rem;
    }

    .inner-s57 .item {
        width: 100%;
    }

    .inner-s57 .item .info-box {
        margin: 10px 0;
    }

    .inner-s57 .item a.btns {
        position: static;
    }

    .inner-s58 {
        padding: 5rem 0 0;
    }

    .inner-s58 .tit {
        font-size: 20px;
    }

    .inner-s58 .price span {
        font-size: 24px;
    }

    .inner-s58 .price del {
        font-size: 16px;
    }

    .inner-s59 {
        padding: 5rem 0;
    }

    .inner-s60 {
        padding: 5rem 0;
    }

    .inner-s60 .item {
        width: 100%;
    }

    .inner-s61 .countdown .countDays,
    .inner-s61 .countdown .countHours,
    .inner-s61 .countdown .countMinutes,
    .inner-s61 .countdown .countSeconds {
        grid-gap: 2px;
    }

    .inner-s61 .countdown .position {
        width: 30px;
        height: 40px;
    }

    .inner-s61 .countdown .digit {
        font-size: 20px;
    }

    .inner-s61 .countdown .countDiv {
        width: 10px;
        height: 40px;
    }

    .inner-s61 .txt {
        grid-gap: 10px;
        margin-top: 10px;
    }

    .inner-s61 .txt span {
        width: 62px;
        font-size: 12px;
    }

    .inner-s62 {
        padding: 5rem 0;
    }

    .inner-s62 .left-box .tab-tit .item span {
        font-size: 14px;
    }

    .inner-s62 .left-box .tab-cont .box {
        padding: 5px 0;
        grid-gap: 0;
    }

    .inner-s62 .left-box .tab-cont .item span {
        padding: 0 5px;
        line-height: 24px;
    }

    .inner-s62 .left-box .inneritem .top-block .tit-box .topbox {
        width: 40px;
        line-height: 20px;
        font-size: 12px;
        margin-right: 5px;
    }

    .inner-s62 .left-box .inneritem .top-block .tit-box .refined {
        width: 20px;
        line-height: 20px;
        font-size: 12px;
        margin-right: 5px;
    }

    .inner-s62 .left-box .inneritem .top-block .tit-box .link {
        font-size: 14px;
        line-height: 20px;
    }

    .inner-s62 .left-box .inneritem .bot-block {
        grid-gap: 20px;
    }

    .inner-s62 .left-box .inneritem .bot-block .ope span {
        font-size: 12px;
    }

    .inner-s62 .left-box .inneritem .commentbox .comment-top {
        padding: 10px;
    }

    .inner-s62 .left-box .inneritem .commentbox .comment-list {
        padding: 10px;
    }

    .inner-s62 .left-box .inneritem .commentbox .list .opebox {
        grid-gap: 20px;
    }

    .inner-s62 .left-box .inneritem .commentbox .list .ope span {
        font-size: 12px;
    }

    .inner-s62 .left-box .inneritem .replybox textarea {
        padding: 12px;
    }

    .inner-s62 .left-box .inneritem .replybox .send {
        position: static;
        margin-top: 10px;
        width: 60px;
        line-height: 30px;
        font-display: 12px;
    }
}

.cf-7 p a {
    font-family: "HarmonyOS_Sans_SC_Regular";
}

.bannser-search form .txt,
.qy-5right p,
.qy-4item p,
.qy-3,
.xn-5pannel p,
.xn-4model p,
.xn-3model p,
.xn-3model span,
.xn-2content,
.xn-2info,
.cf-7 p,
.cf-6 ul li,
.cf-6 p,
.cf-5 textarea,
.cf-4 select,
.cf-4 input,
.cf-3 p,
.cf-1info,
.cf-1head p,
.case-3content,
.case-2right ul li,
.xm-2pannel a p,
.xm-2info,
.yx-22item,
.yx-21item p em,
.yx-21info,
.yx-2 ul li span,
.yx-2info,
.yx-1model p,
.yx-1content,
.yx-add3 p,
.st-5center span em,
.st-4cont p,
.st-3right ul li,
.st-3info,
.st-2head p,
.st-1head p,
.rc-6cont span,
.rc-8 samp select,
.rc-8 samp input,
.rc-5 samp input,
.rc-content,
.rc-model p,
.rc-model span,
.rc-4item ul li,
.rc-left ul li span,
.rc-1 p,
.rc-form .txt,
.rzj-5item span,
.rzj-3item p,
.rzj-2right ul li,
.rzj-2info,
.rzz-2info,
.rzz-1head p,
.rzz-1info,
.rzc-3info,
.rzc-1item ul li,
.rzc-1info,
.rz-3right,
.rz-1head p,
.detail-body,
.news-more,
.news-cont p,
.news-date {
    font-family: "HarmonyOS_Sans_SC_Light";
}

.rzj-2right h4 span,
.rz-1cont span em {
    font-family: "ding";
}

.qy-4item span {
    font-family: "Rajdhani-Bold";
}

@keyframes trans {
    0% {
        opacity: 0;
        transform: translateY(60px);
    }

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

/*news*/
.news {
    width: 100%;
    position: relative;
    margin-top: -60px;
    padding: 8.75rem 0px 5.625rem;
    background: #fff url("../images/online/img-2.png") no-repeat center top;
    background-size: 100%;
}

.news h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: max(20px, 3rem);
    font-weight: normal;
    color: #00405b;
}

.news-list {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 23px;
    margin-top: 34px;
}

.news-item {
    width: 100%;
    overflow: hidden;
    background: #fff;
    border-radius: 10px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    box-shadow: 0px 4px 12px 5px rgba(20, 78, 86, 0.03);
}

.news-item a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    box-sizing: border-box;
    padding: 16px 16px 0px;
}

.news-pic {
    width: 100%;
    overflow: hidden;
    height: 13.5rem;
    border-radius: 9px;
}

.news-pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.news-item:hover .news-pic img {
    transform: scale(1.03);
}

.news-cont {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 2.5rem 1.875rem 5px;
}

.news-date {
    width: 100%;
    box-sizing: border-box;
    padding-left: 24px;
    background: url("../img/icon-22.png") no-repeat left center;
    font-size: 14px;
    color: #00405b;
}

.news-cont span {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: max(16px, 1.25rem);
    line-height: 26px;
    color: #00405b;
    margin-top: 15px;
    min-height: 52px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.news-cont p {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: max(14px, 1rem);
    line-height: 22px;
    color: #00405b;
    margin-top: 22px;
    min-height: 66px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.news-more {
    width: 100%;
    overflow: hidden;
    height: 55px;
    line-height: 55px;
    position: relative;
    margin-top: 24px;
    font-size: 14px;
    color: #7a8799;
    opacity: 0;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.news-more:before {
    width: 0%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: #dce1ef;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.news-more:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-3.png") no-repeat right center;
}

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

.news-item:hover .news-more:before {
    width: 100%;
}

.news-item:hover {
    box-shadow: 0px 4px 12px 5px rgba(20, 78, 86, 0.1);
}

.news-page {
    width: 100%;
    margin-top: 60px;
}

.news-page ul {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.news-page ul li {
    width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    border-radius: 50%;
    overflow: hidden;
    position: relative;
    margin: 0px 4px;
    font-size: 14px;
    color: #7a8799;
}

.news-page ul li:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    border-radius: 50%;
    background: -webkit-linear-gradient(left, #7bca82, #00abc8);
    background: -moz-linear-gradient(left, #7bca82, #00abc8);
    background: -ms-linear-gradient(left, #7bca82, #00abc8);
    background: -o-linear-gradient(left, #7bca82, #00abc8);
    z-index: 1;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.news-page ul li:hover:before,
.news-page ul li.active:before {
    opacity: 1;
}

.news-page ul li a {
    width: 100%;
    height: 100%;
    display: block;
    font-size: 14px;
    color: #7a8799;
    position: relative;
    z-index: 4;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    position: relative;
}

.news-page ul li:hover a,
.news-page ul li.active a {
    color: #fff;
}

.news-page ul li.totalPage,
.news-page ul li.total {
    width: auto;
    border-radius: 0px;
}

.news-page ul li.totalPage:hover:before,
.news-page ul li.total:hover:before {
    opacity: 0;
}

.news-page ul li.first,
.news-page ul li.end {
    display: none;
}

.news-page ul li.prev a:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0x;
    background: url("../img/icon-23.png") no-repeat center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.news-page ul li.prev a:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0x;
    background: url("../img/icon-23-1.png") no-repeat center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.news-page ul li.prev:hover a:before {
    opacity: 0;
}

.news-page ul li.prev:hover a:after {
    opacity: 1;
}

.news-page ul li.next a:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0x;
    background: url("../img/icon-23.png") no-repeat center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    transform: rotate(180deg);
}

.news-page ul li.next a:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0x;
    background: url("../img/icon-23-1.png") no-repeat center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
    transform: rotate(180deg);
}

.news-page ul li.next:hover a:before {
    opacity: 0;
}

.news-page ul li.next:hover a:after {
    opacity: 1;
}

/*detail*/
.detail-1 {
    width: 100%;
    background: #fff url("../images/online/img-2.png") no-repeat center top;
    background-size: 100%;
    margin-top: -60px;
    position: relative;
    padding: 160px 0px 100px;
}

.detail-center {
    width: 1200px;
    margin: 0px auto;
    position: relative;
}

.detail-date {
    width: 100%;
    box-sizing: border-box;
    padding-left: 28px;
    background: url("../img/icon-24.png") no-repeat left center;
    font-size: max(14px, 1.375rem);
    color: #0097ba;
}

.detail-1 h1 {
    width: 100%;
    font-size: max(20px, 2.625rem);
    color: #00314e;
    font-weight: normal;
    margin-top: 30px;
    overflow: hidden;
    padding-bottom: 50px;
    border-bottom: 4px #ced6de solid;
}

.detail-body {
    width: 100%;
    overflow: hidden;
    font-size: max(16px, 1.125rem);
    line-height: max(24px, 2.5rem);
    color: #00314e;
    padding-top: 10px;
}

.detail-body p {
    margin: 35px 0px;
}

.detail-body img {
    width: auto;
    height: auto;
    max-width: 100%;
}

.detail-body hr {
    margin: 10px 0px;
    color: #ced6de;
    margin-block: 4rem;
    opacity: 0.3;
}

.detail-page {
    width: 100%;
    border-top: 4px #00314e solid;
    margin-top: 30px;
    padding-top: 30px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.detail-page span {
    width: 180px;
    height: 48px;
    line-height: 48px;
    overflow: hidden;
    display: block;
    background: #f5f5f5;
    text-align: center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.detail-page span a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    font-size: 18px;
    color: #00314e;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.detail-page span:hover {
    background: #00405b;
}

.detail-page span:hover a {
    color: #fff;
}

.detail-2 {
    width: 100%;
    overflow: hidden;
    padding: 6.875rem 0px 7.5rem;
    background: #f2f8fb;
}

.detail-2 h3 {
    width: 100%;
    text-align: center;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    padding-bottom: 27px;
    font-weight: normal;
}

.detail-2 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.detail-2center {
    width: 100%;
    margin-top: 30px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 23px;
}

.detail-share {
    width: auto;
    position: fixed;
    right: calc((100% - 82.5rem) / 2);
    top: 300px;
    margin-right: -80px;
}

.share-title {
    width: 100%;
    position: relative;
    font-size: 16px;
    color: #888;
    padding: 0px 30px;
}

.share-title:before {
    width: 20px;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #ccc;
}

.share-title:after {
    width: 20px;
    height: 1px;
    content: "";
    position: absolute;
    right: 0px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #ccc;
}

.share-title span {
    position: relative;
    z-index: 12;
}

.detail-share ul {
    width: 100%;
}

.detail-share ul li {
    width: 100%;
    margin-top: 15px;
    text-align: center;
    position: relative;
    cursor: pointer;
}

.detail-share ul li span {
    width: 100%;
    display: block;
    text-align: center;
}

.detail-share ul li p {
    width: 136px;
    display: block;
    padding: 6px;
    border-radius: 5px;
    background: linear-gradient(90deg, #8cce73, #00abc8);
    position: absolute;
    left: 50%;
    top: 40px;
    z-index: 12;
    visibility: hidden;
    transform: translateX(-50%) scaleY(0);
    -webkit-transition: all 0.6s ease 0s;
    -moz-transition: all 0.6s ease 0s;
    -ms-transition: all 0.6s ease 0s;
    -o-transition: all 0.6s ease 0s;
    transition: all 0.6s ease 0s;
    transform-origin: top;
}

.detail-share ul li p img {
    width: 100%;
    height: auto;
    background-color: #fff;
    padding: 5px;
}

.detail-share ul li:hover p {
    visibility: visible;
    transform: translateX(-50%) scaleY(1);
}

/*renzheng*/
.banner-rz {
    width: 100%;
    overflow: hidden;
    position: relative;
    color: #00405b;
    margin-top: -60px;
}

.banner-rz img {
    width: 100%;
    height: auto;
}

.banner-1 {
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 6;
}

.banner-1 h3 {
    width: 100%;
    font-size: 3rem;
}

.banner-1info {
    width: 100%;
    font-size: max(15px, 1.25rem);
    margin-top: 1.125rem;
}

.banner-1button {
    width: 100%;
    margin-top: 3.12rem;
}

.banner-1button span {
    float: left;
    width: 160px;
    height: 48px;
    line-height: 48px;
    border-radius: 6px;
    overflow: hidden;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    text-align: center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    margin-right: 20px;
}

.banner-1button span a {
    font-size: 16px;
    color: #fff;
}

.banner-1button span:hover {
    box-shadow: 0px 0px 12px 5px rgba(122, 202, 126, 0.4);
}

.banner-1button em {
    float: left;
    width: 160px;
    height: 48px;
    line-height: 48px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    text-align: center;
    padding: 1px;
    box-sizing: border-box;
    font-style: normal;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0.7;
}

.banner-1button em:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    background: -webkit-linear-gradient(left, #7cca7d, #7cca7d);
    background: -moz-linear-gradient(left, #7cca7d, #7cca7d);
    background: -ms-linear-gradient(left, #7cca7d, #7cca7d);
    background: -o-linear-gradient(left, #7cca7d, #7cca7d);
}

.banner-1button em a {
    width: 100%;
    height: 100%;
    background: #fff;
    font-size: 16px;
    color: #00405b;
    display: block;
    border-radius: 5px;
    position: relative;
    z-index: 5;
}

.banner-1button em:hover {
    box-shadow: 0px 0px 12px 5px rgba(122, 202, 126, 0.4);
}

.rz-1 {
    width: 100%;
    overflow: hidden;
    padding: 6.875rem 0px;
}

.rz-1 h3 {
    width: 100%;
    text-align: center;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    font-weight: normal;
    padding-bottom: 27px;
}

.rz-1 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.rz-1content {
    width: 100%;
    margin-top: 40px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 27px;
}

.rz-1item {
    width: 100%;
    overflow: hidden;
    background: #fff;
    border-radius: 7px;
    box-sizing: border-box;
    border: 1px #e8efef solid;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    align-content: space-between;
}

.rz-1item:hover {
    border-color: #fff;
    box-shadow: 0px 5px 12px 5px rgba(0, 0, 0, 0.05);
}

.rz-1pannel {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 2.5rem;
}

.rz-1pannel samp {
    width: 100%;
    height: 11.25rem;
    border-radius: 7px;
    background: #edf7fa;
    display: block;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.rz-1pannel samp img {
    width: auto;
    height: auto;
    max-height: 80%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rz-1item:hover .rz-1pannel samp img {
    transform: rotateY(180deg);
}

.rz-1head {
    width: 100%;
    overflow: hidden;
}

.rz-1head span {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: max(16px, 1.5rem);
    color: #00405b;
    margin-top: 1.7rem;
}

.rz-1head p {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: max(14px, 1.125rem);
    color: #7a8799;
    margin-top: 1.2rem;
    line-height: max(20px, 1.5rem);
}

.rz-1cont {
    width: 100%;
    overflow: hidden;
    margin-top: 1.4rem;
}

.rz-1cont span {
    float: left;
    width: 87px;
    height: 27px;
    line-height: 27px;
    border-radius: 4px;
    background: -webkit-linear-gradient(left, #00abc8, #afd35b);
    background: -moz-linear-gradient(left, #00abc8, #afd35b);
    background: -ms-linear-gradient(left, #00abc8, #afd35b);
    background: -o-linear-gradient(left, #00abc8, #afd35b);
    text-align: center;
    position: relative;
}

.rz-1cont span:before {
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: -webkit-linear-gradient(left, #e5f6f9, #f7fbee);
    background: -moz-linear-gradient(left, #e5f6f9, #f7fbee);
    background: -ms-linear-gradient(left, #e5f6f9, #f7fbee);
    background: -o-linear-gradient(left, #e5f6f9, #f7fbee);
    border-radius: 3px;
    left: 1px;
}

.rz-1cont span em {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    font-size: 15px;
    background-image: -webkit-linear-gradient(left, #3abed4, #abd25d);
    background-image: -moz-linear-gradient(left, #3abed4, #abd25d);
    background-image: -ms-linear-gradient(left, #3abed4, #abd25d);
    background-image: -o-linear-gradient(left, #3abed4, #abd25d);
    background-image: linear-gradient(left, #3abed4, #abd25d);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
    -ms-text-fill-color: transparent;
    -o-text-fill-color: transparent;
    text-fill-color: transparent;
    position: relative;
    z-index: 2;
    font-style: normal;
}

.rz-1cont p {
    float: left;
    width: 100%;
    font-size: 14px;
    color: #7a8799;
    margin-top: 12px;
}

.rz-1more {
    width: 100%;
    height: 54px;
    line-height: 54px;
    overflow: hidden;
    position: relative;
}

.rz-1more:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    border-radius: 4px 4px 0px 0px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.rz-1item:hover .rz-1more:before {
    opacity: 1;
}

.rz-1more a {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    z-index: 5;
    text-align: center;
}

.rz-1more a:before {
    width: 87%;
    height: 1px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 0px;
    background: #e8efef;
    -webkit-transition: all 0.8s ease 0.4s;
    -moz-transition: all 0.8s ease 0.4s;
    -ms-transition: all 0.8s ease 0.4s;
    -o-transition: all 0.8s ease 0.4s;
    transition: all 0.8s ease 0.4s;
}

.rz-1item:hover .rz-1more a:before {
    width: 0px;
}

.rz-1more span {
    width: auto;
    display: inline-block;
    height: 100%;
    position: relative;
    font-size: 14px;
    color: #7a8799;
    padding-right: 24px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rz-1more span:before {
    width: 100%;
    content: "";
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-3.png") no-repeat right center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rz-1more span:after {
    width: 100%;
    content: "";
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-3-1.png") no-repeat right center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.rz-1item:hover .rz-1more span:before {
    opacity: 0;
}

.rz-1item:hover .rz-1more span:after {
    opacity: 1;
}

.rz-1item:hover .rz-1more span {
    color: #fff;
}

.rz-2 {
    width: 100%;
    overflow: hidden;
    padding-bottom: 6.25rem;
    background: url("../img/rz-2.jpg") no-repeat left top;
    background-size: 100%;
}

.rz-3 {
    width: 100%;
}

.rz-3 h3 {
    width: 100%;
    text-align: center;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    padding-bottom: 27px;
}

.rz-3 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.rz-3content {
    width: 100%;
    overflow: hidden;
    background: url("../img/rz-1.jpg") no-repeat;
    background-size: cover;
    margin-top: 40px;
    padding: 5.625rem;
    box-sizing: border-box;
    border-radius: 6px;
    box-shadow: 0px 5px 12px 5px rgba(0, 120, 152, 0.19);
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.rz-3item {
    width: 40%;
    overflow: hidden;
    margin-top: 5rem;
    color: #fff;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.rz-3item:nth-child(1),
.rz-3item:nth-child(2) {
    margin-top: 0px;
}

.rz-3left {
    width: auto;
    padding: 10px 28px 10px 0px;
    box-sizing: border-box;
    position: relative;
    text-align: center;
}

.rz-3left:before {
    width: 1px;
    height: 100%;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: rgba(255, 255, 255, 0.3);
}

.rz-3left span {
    width: auto;
    display: inline-block;
    font-size: max(16px, 2.5rem);
    background-image: -webkit-linear-gradient(left, #75c881, #00abc8);
    background-image: -moz-linear-gradient(left, #75c881, #00abc8);
    background-image: -ms-linear-gradient(left, #75c881, #00abc8);
    background-image: -o-linear-gradient(left, #75c881, #00abc8);
    background-image: linear-gradient(left, #75c881, #00abc8);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
    -ms-text-fill-color: transparent;
    -o-text-fill-color: transparent;
    text-fill-color: transparent;
}

.rz-3left em {
    width: 100%;
    display: block;
    font-size: max(16px, 1.5rem);
    font-style: normal;
    margin-top: 6px;
}

.rz-3right {
    width: calc(100% - 150px);
    font-size: max(14px, 1.125rem);
    line-height: 24px;
}

.rz-4 {
    width: 100%;
    padding-top: 6.875rem;
}

.rz-4 h3 {
    width: 100%;
    text-align: center;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    padding-bottom: 27px;
}

.rz-4 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.rz-4content {
    width: 100%;
    overflow: hidden;
    margin-top: 55px;
}

.rz-4content img {
    width: 100%;
    height: auto;
}

.rz-4pannel {
    display: none;
}

.rz-5 {
    width: 100%;
    height: 260px;
    overflow: hidden;
    border-radius: 6px;
    background: url("../img/rz-3.jpg") no-repeat center;
    background-size: cover;
    box-shadow: 0px 5px 12px 5px rgba(195, 228, 238, 0.22);
    margin-top: 7.5rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    align-content: center;
}

.rz-5head {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.rz-5head span {
    font-size: max(20px, 2.25rem);
    color: #00405b;
    margin-left: 12px;
}

.rz-5info {
    width: 100%;
    text-align: center;
    font-size: max(14px, 1rem);
    color: #00405b;
    margin-top: 10px;
}

.rz-5more {
    width: 130px;
    height: 42px;
    line-height: 42px;
    overflow: hidden;
    border-radius: 6px;
    background: -webkit-linear-gradient(left, #8cce73, #00abc8);
    background: -moz-linear-gradient(left, #8cce73, #00abc8);
    background: -ms-linear-gradient(left, #8cce73, #00abc8);
    background: -o-linear-gradient(left, #8cce73, #00abc8);
    position: relative;
    margin-top: 34px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rz-5more:before {
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    border-radius: 5px;
    content: "";
    position: absolute;
    left: 1px;
    top: 1px;
    background: -webkit-linear-gradient(left, #f8fcf7, #f0fafc);
    background: -moz-linear-gradient(left, #f8fcf7, #f0fafc);
    background: -ms-linear-gradient(left, #f8fcf7, #f0fafc);
    background: -o-linear-gradient(left, #f8fcf7, #f0fafc);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rz-5more a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
    z-index: 5;
    text-align: center;
    font-size: 16px;
    color: #00405b;
}

.rz-5more em {
    font-style: normal;
    background-image: -webkit-linear-gradient(left, #8cce73, #00abc8);
    background-image: -moz-linear-gradient(left, #8cce73, #00abc8);
    background-image: -ms-linear-gradient(left, #8cce73, #00abc8);
    background-image: -o-linear-gradient(left, #8cce73, #00abc8);
    background-image: linear-gradient(left, #8cce73, #00abc8);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
    -ms-text-fill-color: transparent;
    -o-text-fill-color: transparent;
    text-fill-color: transparent;
}

.rz-5more:hover {
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transform: translateY(-10px);
}

.rz-5more:hover:before {
    opacity: 0;
}

.rz-5more:hover em {
    background-image: -webkit-linear-gradient(left, #fff, #fff);
    background-image: -moz-linear-gradient(left, #fff, #fff);
    background-image: -ms-linear-gradient(left, #fff, #fff);
    background-image: -o-linear-gradient(left, #fff, #fff);
    background-image: linear-gradient(left, #fff, #fff);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
    -ms-text-fill-color: transparent;
    -o-text-fill-color: transparent;
    text-fill-color: transparent;
}

/*rz-chanpin*/
.rzc-1 {
    width: 100%;
    overflow: hidden;
    background: #fff url("../img/rz-4.jpg") no-repeat left bottom;
    background-size: 100%;
    padding-top: 6.875rem;
}

.rzc-1 h3 {
    width: 100%;
    text-align: center;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    padding-bottom: 27px;
}

.rzc-1 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.rzc-1info {
    width: 880px;
    margin: 22px auto 0px;
    text-align: center;
    font-size: max(14px, 1.25rem);
    line-height: max(22px, 1.7em);
    color: #7a8799;
}

.rzc-1content {
    width: 82.5rem;
    margin: 20px auto 0px;
}

.rzc-1bg,
.rzc-1bg img {
    width: 100%;
    height: auto;
}

.rzc-1pannel {
    width: 100%;
    overflow: hidden;
}

.rzc-1item {
    width: 100%;
    overflow: hidden;
    border-radius: 8px;
    box-sizing: border-box;
    padding: 10px;
    margin-top: 10px;
    border: 1px #d2f0f1 solid;
}

.rzc-1center {
    width: 100%;
    overflow: hidden;
    border-radius: 6px;
    background: -webkit-linear-gradient(left, #1c779a, #edf8fa);
    background: -moz-linear-gradient(left, #1c779a, #edf8fa);
    background: -ms-linear-gradient(left, #1c779a, #edf8fa);
    background: -o-linear-gradient(left, #1c779a, #edf8fa);
    box-sizing: border-box;
    padding: 36px 50px 36px 110px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.rzc-1left {
    width: auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.rzc-1item samp {
    width: 100px;
    height: 100%;
    display: block;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
    justify-content: center;
}

.rzc-1item samp img {
    width: auto;
    height: auto;
    max-height: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rzc-1left:hover samp img {
    transform: rotateY(180deg);
}

.rzc-1item span {
    width: auto;
    overflow: hidden;
    display: block;
    text-align: center;
    font-size: max(16px, 1.5rem);
    color: #fff;
}

.rzc-1item ul {
    width: 66%;
    overflow: hidden;
}

.rzc-1item ul li {
    height: 48px;
    line-height: 48px;
    border-radius: 6px;
    background: #c8e6ed;
    text-align: center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    font-size: 14px;
    color: #00405b;
    position: relative;
    overflow: hidden;
    display: inline-block;
    padding: 0 20px;
}

.rzc-1item ul li:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    background: -webkit-linear-gradient(-45deg, #7fcb7b, #00abc8);
    background: -moz-linear-gradient(-45deg, #7fcb7b, #00abc8);
    background: -ms-linear-gradient(-45deg, #7fcb7b, #00abc8);
    background: -o-linear-gradient(-45deg, #7fcb7b, #00abc8);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.rzc-1item ul li em {
    position: relative;
    z-index: 5;
    font-style: normal;
}

.rzc-1item ul li:hover:before {
    opacity: 1;
}

.rzc-1item ul li:hover {
    color: #fff;
}

.rzc-2 {
    width: 100%;
    overflow: hidden;
    background: -webkit-linear-gradient(top, #e9f9fc, #fff);
    background: -moz-linear-gradient(top, #e9f9fc, #fff);
    background: -ms-linear-gradient(top, #e9f9fc, #fff);
    background: -o-linear-gradient(top, #e9f9fc, #fff);
    padding-bottom: 7.5rem;
}

.rzc-3 {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    flex-direction: row-reverse;
    padding-top: 5.625rem;
}

.rzc-3left {
    width: 37.88%;
    overflow: hidden;
}

.rzc-3left img {
    width: 100%;
    height: auto;
}

.rzc-3right {
    width: 55%;
}

.rzc-3right h3 {
    width: 100%;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    padding-bottom: 27px;
}

.rzc-3right h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.rzc-3info {
    width: 100%;
    overflow: hidden;
    font-size: max(14px, 1.25rem);
    color: #7a8799;
    line-height: max(24px, 1.875rem);
    margin-top: 28px;
}

.rzc-3more {
    width: 160px;
    height: 48px;
    line-height: 48px;
    overflow: hidden;
    border-radius: 7px;
    background: -webkit-linear-gradient(left, #78c97f, #00abc8);
    background: -moz-linear-gradient(left, #78c97f, #00abc8);
    background: -ms-linear-gradient(left, #78c97f, #00abc8);
    background: -o-linear-gradient(left, #78c97f, #00abc8);
    margin-top: 6.75rem;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rzc-3more a {
    width: 100%;
    height: 100%;
    display: block;
    text-align: center;
    font-size: max(14px, 1rem);
    color: #fff;
}

.rzc-3more:hover {
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transform: translateY(-10px);
}

.rzc-4 {
    width: 100%;
}

.rzc-4 h3 {
    width: 100%;
    text-align: center;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    padding-bottom: 27px;
}

.rzc-4 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.rzc-4content {
    width: 100%;
    margin-top: 40px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 24px;
}

.rzc-4item {
    width: 100%;
    overflow: hidden;
    border-radius: 6px;
    box-shadow: 0px 6px 12px 5px rgba(0, 0, 0, 0.05);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rzc-4item a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}

.rzc-4item samp {
    width: 100%;
    height: 9.17vw;
    display: block;
    overflow: hidden;
}

.rzc-4item samp img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rzc-4item:hover samp img {
    transform: scale(1.03);
}

.rzc-4cont {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 1.875rem 1.875rem 2.75rem;
    position: relative;
    background: url("../img/rz-9.jpg") no-repeat;
    background-size: cover;
}

.rzc-4cont span {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: max(16px, 1.125rem);
    color: #00405b;
}

.rzc-4cont p {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: 14px;
    color: #7a8799;
    line-height: 20px;
    margin-top: 16px;
}

.rzc-4item:hover {
    transform: translateY(6px);
}

/*renzheng-zhiye*/
.rzz-1 {
    width: 100%;
    overflow: hidden;
    padding-top: 6.875rem;
}

.rzz-1 h3 {
    width: 100%;
    text-align: center;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    padding-bottom: 27px;
}

.rzz-1 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.rzz-1info {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: max(14px, 1.25rem);
    color: #7a8799;
    margin-top: 28px;
}

.rzz-1content {
    width: 100%;
    overflow: hidden;
    margin-top: 60px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.rzz-1item {
    width: 32.2%;
    overflow: hidden;
    border: 1px #dce1ef solid;
    border-radius: 5px;
}

.rzz-1head {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 2.5rem 2.5rem 1.875rem;
}

.rzz-1head span {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: max(16px, 1.5rem);
    color: #00405b;
}

.rzz-1head p {
    width: 100%;
    overflow: hidden;
    font-size: max(14px, 1.125rem);
    color: #7a8799;
    line-height: 24px;
    margin-top: 3.125rem;
}

.rzz-1item:nth-child(2) .rzz-1head p {
    margin-top: 5.625rem;
}

.rzz-1more {
    width: 100%;
    height: 54px;
    line-height: 54px;
    overflow: hidden;
    position: relative;
}

.rzz-1more:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    border-radius: 4px 4px 0px 0px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.rzz-1item:hover .rzz-1more:before {
    opacity: 1;
}

.rzz-1more a {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    z-index: 5;
    text-align: center;
}

.rzz-1more a:before {
    width: 82%;
    height: 1px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 0px;
    background: #e8efef;
    -webkit-transition: all 0.8s ease 0.4s;
    -moz-transition: all 0.8s ease 0.4s;
    -ms-transition: all 0.8s ease 0.4s;
    -o-transition: all 0.8s ease 0.4s;
    transition: all 0.8s ease 0.4s;
}

.rzz-1item:hover .rzz-1more a:before {
    width: 0px;
}

.rzz-1more span {
    width: 82%;
    display: inline-block;
    height: 100%;
    position: relative;
    font-size: 14px;
    color: #7a8799;
    padding-right: 24px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    text-align: left;
}

.rzz-1more span:before {
    width: 100%;
    content: "";
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-3.png") no-repeat right center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rzz-1more span:after {
    width: 100%;
    content: "";
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-3-1.png") no-repeat right center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.rzz-1item:hover .rzz-1more span:before {
    opacity: 0;
}

.rzz-1item:hover .rzz-1more span:after {
    opacity: 1;
}

.rzz-1item:hover .rzz-1more span {
    color: #fff;
}

.rzz-2 {
    width: 100%;
    overflow: hidden;
    padding-top: 6.875rem;
}

.rzz-2 h3 {
    width: 100%;
    text-align: center;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    padding-bottom: 27px;
}

.rzz-2 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.rzz-2info {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: max(14px, 1.25rem);
    color: #7a8799;
    margin-top: 28px;
    line-height: max(24px, 1.5em);
}

.rzz-2pic {
    width: 100%;
    overflow: hidden;
}

.rzz-2pic img {
    width: 100%;
    height: auto;
}

.rzz-2content {
    display: none;
}

.rzz-3 {
    width: 100%;
    padding-bottom: 7.5rem;
}

/*renzheng-jiaoyu*/
.rzj-1 {
    width: 100%;
    overflow: hidden;
    background: url("../img/rz-11.jpg") no-repeat;
    background-size: cover;
    padding: 6.875rem;
}

.rzj-2 {
    width: 100%;
}

.rzj-2 h3 {
    width: 100%;
    text-align: center;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    padding-bottom: 27px;
}

.rzj-2 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.rzj-2content {
    width: 100%;
    border: 1px #e4e7eb solid;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.7);
    box-sizing: border-box;
    padding: 10px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 40px;
    position: relative;
    box-shadow: 0px 3px 12px 5px rgba(0, 0, 0, 0.05);
}

.rzj-2left {
    width: 50.07%;
    overflow: hidden;
    border-radius: 6px;
}

.rzj-2left img {
    width: 100%;
    height: auto;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rzj-2left:hover img {
    transform: scale(1.03);
}

.rzj-2right {
    width: 45.5%;
    overflow: hidden;
    box-sizing: border-box;
    padding-right: 2.8125rem;
}

.rzj-2info {
    width: 100%;
    overflow: hidden;
    font-size: max(14px, 1.125rem);
    color: #00405b;
    line-height: max(24px, 1.8rem);
}

.rzj-2right h4 {
    width: 170px;
    height: 40px;
    line-height: 40px;
    box-sizing: border-box;
    padding-left: 20px;
    border-radius: 4px 0px 0px 4px;
    background: -webkit-linear-gradient(left, rgb(224, 245, 246), rgba(224, 245, 246, 0));
    background: -moz-linear-gradient(left, rgb(224, 245, 246), rgba(224, 245, 246, 0));
    background: -ms-linear-gradient(left, rgb(224, 245, 246), rgba(224, 245, 246, 0));
    background: -o-linear-gradient(left, rgb(224, 245, 246), rgba(224, 245, 246, 0));
    margin-top: 2.75rem;
}

.rzj-2right h4 span {
    font-size: 18px;
    background-image: -webkit-linear-gradient(left, #96d5a1, #21b0cb);
    background-image: -moz-linear-gradient(left, #96d5a1, #21b0cb);
    background-image: -ms-linear-gradient(left, #96d5a1, #21b0cb);
    background-image: -o-linear-gradient(left, #96d5a1, #21b0cb);
    background-image: linear-gradient(left, #96d5a1, #21b0cb);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
    -ms-text-fill-color: transparent;
    -o-text-fill-color: transparent;
    text-fill-color: transparent;
}

.rzj-2right ul {
    width: 100%;
    overflow: hidden;
    margin-top: 13px;
}

.rzj-2right ul li {
    width: 100%;
    overflow: hidden;
    line-height: max(24px, 1.8rem);
    font-size: max(14px, 1.125rem);
    color: #00405b;
    box-sizing: border-box;
    padding-left: 24px;
    position: relative;
    margin-top: 10px;
}

.rzj-2right ul li:before {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    content: "";
    position: absolute;
    left: 0px;
    top: 12px;
    background: #bfd9d9;
}

.rzj-2icon {
    width: 91px;
    height: 88px;
    position: absolute;
    right: 20px;
    top: -70px;
    z-index: 5;
    background: url("../img/icon-16.png") no-repeat;
}

.rzj-3 {
    width: 100%;
    overflow: hidden;
    margin-top: 6.875rem;
}

.rzj-3 h3,
.rzj-3 .t-left {
    float: left;
    width: auto;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    padding-bottom: 27px;
}

.rzj-3 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    left: 0px;
    position: absolute;
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.rzj-3content {
    float: right;
    width: 64%;
    overflow: hidden;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 4.375rem;
}

.rzj-3item {
    width: 100%;
    overflow: hidden;
}

.rzj-3item samp {
    width: 100%;
    display: block;
    height: 4.4375rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
}

.rzj-3item samp img {
    width: auto;
    height: auto;
    max-height: 100%;
}

.rzj-3item span {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: max(16px, 1.25rem);
    color: #00405b;
    margin-top: 12px;
}

.rzj-3item p {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: max(14px, max(14px, 1.125rem));
    color: #7a8799;
    margin-top: 16px;
    line-height: 24px;
}

.rzj-4 {
    width: 100%;
    overflow: hidden;
    padding: 6.875rem 0px 7.5rem;
    background: -webkit-linear-gradient(top, #edf8fb, #fff);
    background: -moz-linear-gradient(top, #edf8fb, #fff);
    background: -ms-linear-gradient(top, #edf8fb, #fff);
    background: -o-linear-gradient(top, #edf8fb, #fff);
}

.rzj-5 {
    width: 100%;
    overflow: hidden;
}

.rzj-5 h3 {
    width: 100%;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    padding-bottom: 27px;
    text-align: center;
}

.rzj-5 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.rzj-5content {
    width: 100%;
    margin-top: 50px;
    overflow: hidden;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    grid-gap: 0px;
}

.rzj-5item {
    width: 100%;
    height: 11.75rem;
    overflow: hidden;
    position: relative;
    background: #fff;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    justify-content: center;
}

.rzj-5item span {
    font-size: 1.375rem;
    color: #00405b;
}

.rzj-5item em {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
}

.rzj-5item em:before {
    width: 100%;
    height: 50%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 5;
    background: -webkit-linear-gradient(top, rgba(75, 177, 204, 0.8), rgba(75, 177, 204, 0));
    background: -moz-linear-gradient(top, rgba(75, 177, 204, 0.8), rgba(75, 177, 204, 0));
    background: -ms-linear-gradient(top, rgba(75, 177, 204, 0.8), rgba(75, 177, 204, 0));
    background: -o-linear-gradient(top, rgba(75, 177, 204, 0.8), rgba(75, 177, 204, 0));
}

.rzj-5item em img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rzj-5item:hover em img {
    transform: scale(1.03);
}

.rzj-6 {
    width: 100%;
    padding-top: 6.875rem;
}

.rzj-6 h3 {
    width: 100%;
    position: relative;
    color: #00405b;
    font-size: 2.25rem;
    padding-bottom: 27px;
    text-align: center;
}

.rzj-6 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.rzj-6content {
    width: 100%;
    margin-top: 40px;
    position: relative;
}

.rzj-6bg,
.rzj-6bg img {
    width: 100%;
    height: auto;
    overflow: hidden;
}

.rzj-6pannel {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 5;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 0.375rem;
}

.rzj-6item {
    width: 100%;
    overflow: hidden;
    height: 100%;
    float: left;
    box-sizing: border-box;
    padding: 0px 2.5rem;
}

.rzj-6item span {
    width: 100%;
    height: 4.375rem;
    line-height: 4.375rem;
    overflow: hidden;
    display: block;
    color: #fff;
    font-size: max(16px, 1.875rem);
}

.rzj-6item p {
    width: 100%;
    line-height: 26px;
    overflow: hidden;
    display: block;
    color: #00405b;
    font-size: max(14px, 1.125rem);
    margin-top: 3rem;
}

.rzj-6more {
    width: 100%;
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.rzj-6more span {
    width: 130px;
    height: 42px;
    line-height: 42px;
    border-radius: 6px;
    overflow: hidden;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    text-align: center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    margin-right: 14px;
    cursor: pointer;
}

.rzj-6more span a {
    font-size: 16px;
    color: #fff;
    cursor: pointer;
    width: 100%;
    height: 100%;
    display: block;
}

.rzj-6more span:hover {
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transform: translateY(-10px);
}

.rzj-6more em {
    width: 130px;
    height: 42px;
    line-height: 42px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    text-align: center;
    padding: 1px;
    box-sizing: border-box;
    font-style: normal;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0.7;
}

.rzj-6more em:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rzj-6more em a {
    width: 100%;
    height: 100%;
    background: #fff;
    font-size: 16px;
    color: #00405b;
    display: block;
    border-radius: 5px;
    position: relative;
    z-index: 5;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rzj-6more em:hover {
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transform: translateY(-10px);
}

.rzj-6more em:hover a {
    color: #fff;
    background: none;
}

/*rencai*/
.rc-form {
    width: 800px;
    height: 64px;
    line-height: 64px;
    border-radius: 32px;
    background: #fff;
    box-shadow: 0px 4px 12px 5px rgba(12, 61, 112, 0.08);
    margin: 0px auto;
    transform: translateY(-50%);
    position: relative;
    z-index: 5;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    overflow: hidden;
}

.rc-form form {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.rc-form .txt {
    width: 100%;
    height: 100%;
    margin: 0px;
    box-sizing: border-box;
    padding: 0px 150px 0px 70px;
    background: none;
    font-size: 16px;
    color: #7a8799;
    background: url("../img/icon-25.png") no-repeat 40px center;
}

.rc-form .txt::placeholder {
    color: "#7a8799" !important;
    opacity: 1;
}

.rc-form .txt::-webkit-input-placeholder {
    color: "#7a8799" !important;
    opacity: 1;
}

.rc-form .txt::-ms-input-placeholder {
    color: "#7a8799" !important;
    opacity: 1;
}

.rc-form .txt::-moz-placeholder {
    color: "#7a8799" !important;
    opacity: 1;
}

.rc-form:hover {
    box-shadow: 0px 4px 12px 5px rgba(12, 61, 112, 0.14);
}

.rc-form .bt {
    width: 140px;
    height: 100%;
    margin: 0px;
    box-sizing: border-box;
    text-align: center;
    font-size: 18px;
    color: #fff;
    cursor: pointer;
    background: -webkit-linear-gradient(left, #7ac97e, #00abc8);
    background: -moz-linear-gradient(left, #7ac97e, #00abc8);
    background: -ms-linear-gradient(left, #7ac97e, #00abc8);
    background: -o-linear-gradient(left, #7ac97e, #00abc8);
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 5;
}

.rc-body {
    width: 100%;
    background: #fff url("../img/rc-1.jpg") no-repeat left top;
    background-size: 100%;
    padding: 150px 0px 100px;
    position: relative;
    margin-top: -64px;
    position: relative;
}

.rc-body .wrap-s:before {
    width: 1px;
    height: 107.2%;
    content: "";
    position: absolute;
    left: 29%;
    background: #eff1f1;
}

.rc-left {
    float: left;
    width: 25.5%;
    position: sticky;
    top: 130px;
}

.rc-1 {
    width: 100%;
    overflow: hidden;
    border-bottom: 1px #eff1f1 solid;
    padding-bottom: 20px;
}

.rc-1 span {
    float: left;
    width: auto;
    font-size: 14px;
    color: #00405b;
}

.rc-1 p {
    float: right;
    width: auto;
    font-size: 14px;
    color: #7a8799;
    cursor: pointer;
}

.rc-1 p a {
    color: #7a8799;
    cursor: pointer;
}

.rc-1 p:hover a {
    color: #00405b;
}

.rc-2 {
    width: 100%;
    font-size: 18px;
    color: #00405b;
    margin-top: 30px;
}

.rc-left ul {
    width: 100%;
    overflow: hidden;
}

.rc-left ul li {
    width: 50%;
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    margin-top: 25px;
    cursor: pointer;
    float: left;
}

.rc-left ul li:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 5;
}

.rc-left ul li input {
    width: 15px;
    height: 15px;
    box-sizing: border-box;
    border: 1px #dcdcdc solid;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 2px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    background-clip: content-box;
}

.rc-left ul li input:checked {
    background: #00405b;
    background-clip: content-box;
}

.rc-left ul li span {
    font-size: 15px;
    color: #00405b;
    margin-left: 12px;
}

.rc-right {
    float: right;
    width: 66%;
    overflow: hidden;
}

.rc-3 {
    width: 100%;
    overflow: hidden;
    font-size: max(18px, 2rem);
    color: #00405b;
    border-bottom: 1px #eff1f1 solid;
    padding-bottom: 40px;
}

.rc-4 {
    width: 100%;
    overflow: hidden;
}

.rc-4item {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.rc-4item:before {
    width: 100%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #eff1f1;
}

.rc-4item:after {
    width: 0%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #00405b;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rc-4item:hover:after {
    width: 100%;
}

.rc-4item a {
    width: 100%;
    display: block;
    overflow: hidden;
    height: 100%;
    padding: 2.5rem 0px;
}

.rc-4item span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: max(16px, 1.375rem);
    color: #00405b;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rc-4item ul {
    float: left;
    width: 100%;
    overflow: hidden;
    margin-top: 20px;
}

.rc-4item ul li {
    float: left;
    width: auto;
    font-size: max(14px, 1rem);
    color: #7a8799;
    position: relative;
    padding: 0px 20px;
}

.rc-4item ul li:before {
    width: 1px;
    height: 90%;
    content: "";
    position: absolute;
    right: 0px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #cfd4dc;
}

.rc-4item ul li:first-child {
    padding-left: 0px;
}

.rc-4item ul li:last-child {
    padding-right: 0px;
}

.rc-4item ul li:last-child:before {
    display: none;
}

.rc-4item:hover span {
    color: #00abc8;
}

.rc-right .news-page ul li {
    width: 40px;
    height: 40px;
    line-height: 40px;
    border: 1px #f0f2f2 solid;
}

.rc-right .news-page ul li a {
    position: relative;
    z-index: 5;
}

.rc-right .news-page ul li.totalPage,
.rc-right .news-page ul li.total {
    display: none;
}

.rc-right .news-page ul li.first {
    display: block;
    width: 60px;
    border-radius: 20px;
}

.rc-right .news-page ul li.end {
    display: block;
    width: 60px;
    border-radius: 20px;
}

.rc-right .news-page ul li.first:before,
.rc-right .news-page ul li.end:before {
    border-radius: 20px;
}

.rc-right .news-page ul li.first:after {
    width: 100%;
    height: 100%;
    content: "首页";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 5;
    font-size: 12px;
    color: #00405b;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rc-right .news-page ul li.end:after {
    width: 100%;
    height: 100%;
    content: "尾页";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 5;
    font-size: 12px;
    color: #00405b;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rc-right .news-page ul li.first:hover:after,
.rc-right .news-page ul li.end:hover:after {
    color: #fff;
}

/*rencai-info*/
.rc-info {
    width: 100%;
    overflow: hidden;
    background: #fff url("../images/online/img-2.png") no-repeat center top;
    background-size: 100%;
    padding: 60px 0px 100px;
}

.rc-center {
    width: 1200px;
    margin: 0px auto;
}

.rc-back {
    width: 100%;
    overflow: hidden;
}

.rc-back a {
    float: left;
    width: auto;
    position: relative;
    padding-left: 16px;
    font-size: 16px;
    color: #00405b;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rc-back a:before {
    width: 6px;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: px;
    background: url("../img/icon-23-1.png") no-repeat left center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.rc-back a:after {
    width: 6px;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: px;
    background: url("../img/icon-23-2.png") no-repeat left center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 1;
}

.rc-back a:hover {
    color: #00abc8;
}

.rc-back a:hover:before {
    opacity: 0;
}

.rc-back a:hover:after {
    opacity: 1;
}

.rc-bodys {
    width: 100%;
    background: #fff;
    border-radius: 15px;
    margin-top: 40px;
    box-sizing: border-box;
    padding: 40px;
    box-shadow: 0px 0px 12px 5px rgba(0, 0, 0, 0.01);
}

.rc-head {
    width: 100%;
    overflow: hidden;
    padding-bottom: 40px;
    border-bottom: 1px #dfe5ee solid;
}

.rc-head h1 {
    width: 100%;
    overflow: hidden;
    font-size: 2rem;
    font-weight: normal;
    color: #00405b;
}

.rc-model {
    width: 100%;
    overflow: hidden;
    margin-top: 14px;
}

.rc-model span {
    float: left;
    width: auto;
    height: 32px;
    line-height: 32px;
    background: #f2f5f7;
    border-radius: 4px;
    padding: 0px 20px;
    font-size: 16px;
    color: #7a8799;
    margin-right: 6px;
    margin-top: 10px;
}

.rc-model p {
    float: left;
    width: auto;
    line-height: 32px;
    font-size: 14px;
    color: #7a8799;
    margin-right: 40px;
    padding-left: 24px;
    margin-top: 10px;
}

.rc-model p.rc1 {
    margin-left: 30px;
    background: url("../img/icon-22.png") no-repeat left center;
}

.rc-model p.rc2 {
    background: url("../img/icon-26.png") no-repeat left center;
}

.rc-model p.rc3 {
    background: url("../img/icon-27.png") no-repeat left center;
}

.rc-list {
    width: 100%;
    overflow: hidden;
}

.rc-pannel {
    width: 100%;
    overflow: hidden;
    padding: 40px 0px;
    border-bottom: 1px #dfe5ee solid;
}

.rc-pannel:last-child {
    border-bottom: none;
}

.rc-pannel h4 {
    width: 100%;
    font-size: max(16px, 1.5rem);
    font-weight: normal;
    color: #00405b;
}

.rc-content {
    width: 100%;
    overflow: hidden;
    font-size: max(14px, 1rem);
    color: #00405b;
    line-height: 28px;
    margin-top: 10px;
}

.rc-content p {
    margin-top: 10px;
}

.rc-shenqing {
    width: 100%;
    overflow: hidden;
    height: 54px;
    line-height: 54px;
    cursor: pointer;
    border-radius: 6px;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    text-align: center;
    font-size: 18px;
    color: #fff;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.rc-shenqing:hover {
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.1);
    transform: translateY(10px);
}

.rc-shenqing.hiden {
    height: 0px;
    opacity: 0;
}

.rc-form2 {
    width: 100%;
    display: none;
}

.rc-form2 form {
    width: 100%;
    display: block;
}

.rc-5 {
    width: 100%;
    overflow: hidden;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 20px;
}

.rc-5 p {
    width: 100%;
    height: 54px;
    line-height: 54px;
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    padding: 1px;
    border-radius: 6px;
}

.rc-5 p:before {
    width: 100%;
    overflow: hidden;
    height: 100%;
    border-radius: 6px;
    background: #dfe5ee;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
}

.rc-5 p:after {
    width: 100%;
    overflow: hidden;
    height: 100%;
    border-radius: 6px;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    opacity: 1;
}

.rc-5 p span {
    width: 100%;
    height: 100%;
    background: #fff;
    display: block;
    position: relative;
    z-index: 5;
    border-radius: 5px;
    overflow: hidden;
}

.rc-5 p span em {
    font-size: 18px;
    font-style: normal;
    background-image: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background-image: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background-image: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background-image: -o-linear-gradient(left, #7cca7d, #00abc8);
    background-image: linear-gradient(left, #7cca7d, #00abc8);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
    -ms-text-fill-color: transparent;
    -o-text-fill-color: transparent;
    text-fill-color: transparent;
    margin-left: 18px;
}

.rc-5 p input {
    position: absolute;
    opacity: 0;
    width: 0px;
    height: 0px;
}

.rc-5 samp {
    width: 100%;
    height: 54px;
    line-height: 54px;
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    padding: 1px;
    border-radius: 6px;
    display: block;
}

.rc-5 samp:before {
    width: 100%;
    overflow: hidden;
    height: 100%;
    border-radius: 6px;
    background: #dfe5ee;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
}

.rc-5 samp:after {
    width: 100%;
    overflow: hidden;
    height: 100%;
    border-radius: 6px;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    opacity: 0;
}

.rc-5 samp input {
    width: 100%;
    height: 100%;
    background: #fff;
    display: block;
    position: relative;
    z-index: 7;
    border-radius: 5px;
    overflow: hidden;
    box-sizing: border-box;
    padding: 0px 18px;
    font-size: 18px;
    color: #00405b;
}

.rc-5 samp:hover:after {
    opacity: 1;
}

.rc-5 samp input::placeholder {
    color: "#00405b" !important;
    opacity: 1;
}

.rc-5 samp input::-webkit-input-placeholder {
    color: "#00405b" !important;
    opacity: 1;
}

.rc-5 samp input::-ms-input-placeholder {
    color: "#00405b" !important;
    opacity: 1;
}

.rc-5 samp input::-moz-placeholder {
    color: "#00405b" !important;
    opacity: 1;
}

.rc-8 {
    width: 100%;
    overflow: hidden;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 20px;
    margin-top: 20px;
}

.rc-8 samp {
    width: 100%;
    height: 54px;
    line-height: 54px;
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    padding: 1px;
    border-radius: 6px;
    display: block;
}

.rc-8 samp:before {
    width: 100%;
    overflow: hidden;
    height: 100%;
    border-radius: 6px;
    background: #dfe5ee;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
}

.rc-8 samp:after {
    width: 100%;
    overflow: hidden;
    height: 100%;
    border-radius: 6px;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    opacity: 0;
}

.rc-8 samp input {
    width: 100%;
    height: 100%;
    background: #fff;
    display: block;
    position: relative;
    z-index: 7;
    border-radius: 5px;
    overflow: hidden;
    box-sizing: border-box;
    padding: 0px 18px;
    font-size: 18px;
    color: #00405b;
}

.rc-8 samp:hover:after {
    opacity: 1;
}

.rc-8 samp input::placeholder {
    color: "#00405b" !important;
    opacity: 1;
}

.rc-8 samp input::-webkit-input-placeholder {
    color: "#00405b" !important;
    opacity: 1;
}

.rc-8 samp input::-ms-input-placeholder {
    color: "#00405b" !important;
    opacity: 1;
}

.rc-8 samp input::-moz-placeholder {
    color: "#00405b" !important;
    opacity: 1;
}

.rc-8 samp select {
    width: 100%;
    height: 100%;
    background: #fff url("../img/icon-20240729-1.png") no-repeat 96% center;
    display: block;
    position: relative;
    z-index: 7;
    border-radius: 5px;
    overflow: hidden;
    box-sizing: border-box;
    padding: 0px 18px;
    font-size: 18px;
    color: #00405b;
}

.rc-8 samp:hover:after {
    opacity: 1;
}

.rc-8 samp select::placeholder {
    color: "#00405b" !important;
    opacity: 1;
}

.rc-8 samp select::-webkit-input-placeholder {
    color: "#00405b" !important;
    opacity: 1;
}

.rc-8 samp select::-ms-input-placeholder {
    color: "#00405b" !important;
    opacity: 1;
}

.rc-8 samp select::-moz-placeholder {
    color: "#00405b" !important;
    opacity: 1;
}

.rc-6 {
    width: 100%;
    overflow: hidden;
    position: relative;
    height: 200px;
    margin-top: 20px;
    padding: 1px;
    box-sizing: border-box;
}

.rc-6:before {
    width: 100%;
    overflow: hidden;
    height: 100%;
    border-radius: 6px;
    background: #dfe5ee;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
}

.rc-6:after {
    width: 100%;
    overflow: hidden;
    height: 100%;
    border-radius: 6px;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    opacity: 0;
}

.rc-6cont {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 5px;
    background: #fff;
    position: relative;
    z-index: 5;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    align-content: center;
    cursor: pointer;
}

.rc-6cont samp {
    width: 100%;
    display: block;
    text-align: center;
}

.rc-6cont span {
    width: 100%;
    display: block;
    text-align: center;
    font-size: 18px;
    color: #00405b;
    margin-top: 16px;
}

.rc-6 input {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 5;
    cursor: pointer;
    opacity: 0;
}

.rc-7 {
    width: 100%;
    padding: 10px 0px;
    font-size: 14px;
    color: #00405b;
    display: none;
}

.rc-7.active {
    display: block;
}

.rc-button {
    width: 100%;
    overflow: hidden;
    height: 54px;
    line-height: 54px;
    cursor: pointer;
    border-radius: 6px;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    text-align: center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    margin-top: 40px;
}

.rc-button:hover {
    box-shadow: 0px 0px 12px 5px rgba(61, 186, 163, 0.2);
}

.rc-button input {
    width: 100%;
    height: 100%;
    background: none;
    cursor: pointer;
    font-size: 18px;
    color: #fff;
}

/*yuanxiao*/
.st-1 {
    width: 100%;
    overflow: hidden;
    padding-top: 6.875rem;
}

.st-1head {
    width: 100%;
    text-align: center;
    overflow: hidden;
}

.st-1head h3 {
    width: 100%;
    overflow: hidden;
    font-size: max(18px, 2.25rem);
    color: #00405b;
    position: relative;
    padding-bottom: 30px;
}

.st-1head h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.st-1head p {
    width: 100%;
    overflow: hidden;
    font-size: max(14px, 1.25rem);
    color: #7a8799;
    margin-top: 30px;
}

.st-1pic {
    width: 71.407%;
    margin: 0px auto;
}

.st-1pic img {
    width: 100%;
    height: auto;
}

.st-2 {
    width: 100%;
    overflow: hidden;
    margin-top: 70px;
}

.st-2content {
    width: 100%;
    overflow: hidden;
    margin-top: 40px;
    border-top: 1px #ebf0f7 solid;
    position: relative;
}

.st-2content:before {
    width: 14%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 3;
    background: -webkit-linear-gradient(left, rgb(255, 255, 255), rgba(255, 255, 255, 0.8));
    background: -moz-linear-gradient(left, rgb(255, 255, 255), rgba(255, 255, 255, 0.8));
    background: -ms-linear-gradient(left, rgb(255, 255, 255), rgba(255, 255, 255, 0.8));
    background: -o-linear-gradient(left, rgb(255, 255, 255), rgba(255, 255, 255, 0.8));
}

.st-2content:after {
    width: 14%;
    height: 100%;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 3;
    background: -webkit-linear-gradient(right, rgb(255, 255, 255), rgba(255, 255, 255, 0.8));
    background: -moz-linear-gradient(right, rgb(255, 255, 255), rgba(255, 255, 255, 0.8));
    background: -ms-linear-gradient(right, rgb(255, 255, 255), rgba(255, 255, 255, 0.8));
    background: -o-linear-gradient(right, rgb(255, 255, 255), rgba(255, 255, 255, 0.8));
}

.st-2content .swiper {
    width: 120%;
    margin-left: -10%;
}

.st-2content .swiper-slide {
    overflow: hidden;
    box-sizing: border-box;
    border-right: 1px #ebf0f7 solid;
    height: auto;
}

.st-2content .swiper-slide a {
    width: 100%;
    overflow: hidden;
    height: 100%;
    display: block;
    box-sizing: border-box;
    padding: 2.8125rem 2.5rem 0px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    align-content: space-between;
}

.st-2head,
.st-2top {
    width: 100%;
    overflow: hidden;
}

.st-2head samp {
    float: left;
    width: 50px;
    overflow: hidden;
}

.st-2head samp img {
    width: auto;
    height: auto;
    max-width: 100%;
}

.st-2head span {
    float: left;
    width: calc(100% - 50px - 20px - 100px);
    margin-left: 20px;
    font-size: max(15px, 1.125rem);
    color: #00405b;
    line-height: 26px;
    min-height: 52px;
    margin-top: 10px;
}

.st-2head p {
    float: right;
    width: 100px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 4px;
    background: #edf7fa;
    font-size: 14px;
    color: #00405b;
    margin-top: 6px;
}

.st-2info {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding-left: 70px;
    font-size: 14px;
    color: #7a8799;
    line-height: 24px;
    margin-top: 35px;
}

.st-2more {
    margin-top: 60px;
    width: 100%;
    position: relative;
}

.st-2more:before {
    width: 100%;
    height: 1px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 0px;
    background: #dce1ef;
    -webkit-transition: all 0.8s ease 0.4s;
    -moz-transition: all 0.8s ease 0.4s;
    -ms-transition: all 0.8s ease 0.4s;
    -o-transition: all 0.8s ease 0.4s;
    transition: all 0.8s ease 0.4s;
}

.st-2more:after {
    width: 0%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: -webkit-linear-gradient(left, #85cc77, #00abc8);
    background: -moz-linear-gradient(left, #85cc77, #00abc8);
    background: -ms-linear-gradient(left, #85cc77, #00abc8);
    background: -o-linear-gradient(left, #85cc77, #00abc8);
    -webkit-transition: all 0.8s ease 0.4s;
    -moz-transition: all 0.8s ease 0.4s;
    -ms-transition: all 0.8s ease 0.4s;
    -o-transition: all 0.8s ease 0.4s;
    transition: all 0.8s ease 0.4s;
    z-index: 2;
}

.st-2more span {
    width: 100%;
    overflow: hidden;
    display: block;
    position: relative;
    margin-top: 20px;
    font-size: 14px;
    color: #7a8799;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.st-2more span:before {
    width: 30px;
    height: 100%;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: url("../img/icon-3.png") no-repeat right center;
}

.st-2content .swiper-slide:hover .st-2more:after {
    width: 100%;
}

.st-2content .swiper-slide:hover .st-2more span {
    color: #00abc8;
}

.st-2content .swiper-button-prev {
    width: 40px;
    height: 40px;
    opacity: 1;
    z-index: 5;
    left: 10%;
}

.st-2content .swiper-button-prev:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-58.png") no-repeat;
    background-size: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.st-2content .swiper-button-prev:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-59.png") no-repeat;
    background-size: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    transform: rotate(180deg);
    opacity: 0;
}

.st-2content .swiper-button-next {
    width: 40px;
    height: 40px;
    opacity: 1;
    z-index: 5;
    right: 10%;
}

.st-2content .swiper-button-next:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-58.png") no-repeat;
    background-size: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    transform: rotate(180deg);
}

.st-2content .swiper-button-next:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-59.png") no-repeat;
    background-size: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.st-2content .swiper-button-prev:hover:before,
.st-2content .swiper-button-next:hover:before {
    opacity: 0;
}

.st-2content .swiper-button-prev:hover:after,
.st-2content .swiper-button-next:hover:after {
    opacity: 1;
}

.st-3 {
    width: 100%;
    overflow: hidden;
    margin-top: 24px;
    background: url("../img/yuanxiao-2.jpg") no-repeat;
    background-size: cover;
    padding: 6.875rem 0px 7.5rem;
}

.st-3content {
    width: 100%;
    overflow: hidden;
    background: #fff;
    border-radius: 6px;
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    height: 460px;
}

.st-3left {
    width: 50%;
    overflow: hidden;
    height: 100%;
    background: url("../img/yuanxiao-3.jpg") no-repeat;
    background-size: cover;
    box-sizing: border-box;
    padding: 3.75rem;
}

.st-3left h4 {
    width: 100%;
    font-size: 1.5rem;
    color: #fff;
}

.st-3info {
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #fff;
    line-height: 28px;
    margin-top: 2.5rem;
}

.st-3more {
    width: 100%;
    margin-top: 5.625rem;
}

.st-3more span {
    float: left;
    width: 126px;
    height: 38px;
    line-height: 38px;
    overflow: hidden;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.1);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.st-3more span a,
.st-3more em a {
    width: 100%;
    height: 100%;
    display: block;
    text-align: center;
    font-size: 16px;
    color: #fff;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.st-3more em {
    float: left;
    width: 130px;
    height: 40px;
    line-height: 40px;
    overflow: hidden;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.1);
    margin-left: 10px;
    font-style: normal;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.st-3more span:hover,
.st-3more em:hover {
    background: #fff;
}

.st-3more span:hover a,
.st-3more em:hover a {
    color: #00abc8;
}

.st-3right {
    width: 50%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 3.5625rem;
    max-height: 100%;
}

.st-3right h4 {
    width: 100%;
    font-size: max(18px, 1.5rem);
    color: #00405b;
}

.st-3right h4 span {
    padding-right: 23px;
    background: url("../img/icon-3.png") no-repeat right center;
}

.st-3right h4 span a {
    color: #00405b;
}

.st-3right h4 span a:hover {
    color: #00abc8;
}

.st-3right ul {
    width: 100%;
    overflow: hidden;
}

.st-3right ul li {
    width: 100%;
    overflow: hidden;
    border-bottom: 1px #e7eeee solid;
    line-height: 26px;
    font-size: 16px;
}

.st-3right ul li a {
    width: 100%;
    display: block;
    padding: 1.5rem 0px;
    color: #7a8799;
    position: relative;
    padding-left: 20px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.st-3right ul li a:before {
    width: 6px;
    height: 6px;
    content: "";
    position: absolute;
    left: 0px;
    top: 34px;
    border-radius: 50%;
    background: #00abc8;
}

.st-3right ul li a:hover {
    color: #00abc8;
}

.st-3right .mCSB_inside>.mCSB_container {
    padding-right: 20px;
}

.st-3right .mCSB_scrollTools {
    width: 4px;
    border-radius: 3px;
}

.st-3right .mCSB_scrollTools:before {
    background: #e7eeee;
    border-radius: 3px;
}

.st-3right .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background: -webkit-linear-gradient(top, #01abc7, #aed35b);
    background: -moz-linear-gradient(top, #01abc7, #aed35b);
    background: -ms-linear-gradient(top, #01abc7, #aed35b);
    background: -o-linear-gradient(top, #01abc7, #aed35b);
    border-radius: 3px;
}

.st-content {
    width: 100%;
    overflow: hidden;
    background: #fff url("../img/yuanxiao-4.jpg") no-repeat left bottom;
    background-size: 100%;
    padding: 6.875rem 0px 7.5rem;
}

.st-4 {
    width: 100%;
    overflow: hidden;
    margin-top: 35px;
    position: relative;
}

.st-4 .swiper {
    width: 162%;
    margin-left: -31%;
}

.st-4 .swiper-slide {
    overflow: hidden;
    border-radius: 10px;
    background: #fff;
}

.st-4 .swiper-slide a {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
}

.st-4 .swiper-slide img {
    width: 100%;
    height: auto;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0.2;
}

.st-4model {
    width: 100%;
    height: auto;
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: -webkit-linear-gradient(top, rgba(19, 44, 59, 0), rgb(19, 44, 59));
    background: -moz-linear-gradient(top, rgba(19, 44, 59, 0), rgb(19, 44, 59));
    background: -ms-linear-gradient(top, rgba(19, 44, 59, 0), rgb(19, 44, 59));
    background: -o-linear-gradient(top, rgba(19, 44, 59, 0), rgb(19, 44, 59));
    z-index: 2;
    padding: 5rem 2.5rem 2.5rem;
    opacity: 0;
    -webkit-transition: all 0.4s ease 0.3s;
    -moz-transition: all 0.4s ease 0.3s;
    -ms-transition: all 0.4s ease 0.3s;
    -o-transition: all 0.4s ease 0.3s;
    transition: all 0.4s ease 0.3s;
}

.st-4cont {
    width: 100%;
    overflow: hidden;
    padding-left: 23px;
    box-sizing: border-box;
    color: #fff;
    position: relative;
    padding-top: 60px;
}

.st-4cont:before {
    width: 4px;
    height: 45%;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: -webkit-linear-gradient(top, #80cb7b, #00abc8);
    background: -moz-linear-gradient(top, #80cb7b, #00abc8);
    background: -ms-linear-gradient(top, #80cb7b, #00abc8);
    background: -o-linear-gradient(top, #80cb7b, #00abc8);
}

.st-4cont:after {
    width: 20%;
    height: 100%;
    content: "";
    right: 0px;
    top: 0px;
    position: absolute;
    background: url("../img/icon-65.png") no-repeat right bottom;
}

.st-4 .swiper-slide:hover img {
    transform: scale(1.03);
}

.st-4cont span {
    width: 100%;
    display: block;
    font-size: max(16px, 1.25rem);
}

.st-4cont p {
    width: 100%;
    display: block;
    font-size: 14px;
    margin-top: 10px;
}

.st-4 .swiper-slide-active .st-4model {
    opacity: 1;
}

.st-4 .swiper-slide-active img {
    opacity: 1;
}

.st-4 .swiper-button-prev {
    width: 60px;
    height: 60px;
    opacity: 1;
    z-index: 5;
    left: 10%;
}

.st-4 .swiper-button-prev:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-63.png") no-repeat;
    background-size: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.st-4 .swiper-button-prev:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-64.png") no-repeat;
    background-size: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    transform: rotate(180deg);
    opacity: 0;
}

.st-4 .swiper-button-next {
    width: 60px;
    height: 60px;
    opacity: 1;
    z-index: 5;
    right: 10%;
}

.st-4 .swiper-button-next:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-63.png") no-repeat;
    background-size: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    transform: rotate(180deg);
}

.st-4 .swiper-button-next:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-64.png") no-repeat;
    background-size: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.st-4 .swiper-button-prev:hover:before,
.st-4 .swiper-button-next:hover:before {
    opacity: 0;
}

.st-4 .swiper-button-prev:hover:after,
.st-4 .swiper-button-next:hover:after {
    opacity: 1;
}

.st-5 {
    width: 100%;
    overflow: hidden;
    margin-top: 50px;
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.st-5center {
    width: auto;
    overflow: hidden;
    position: relative;
}

.st-5center:before {
    width: 100%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #ddedf0;
}

.st-5center span {
    float: left;
    width: auto;
    padding-bottom: 6px;
    position: relative;
    margin-right: 30px;
    cursor: pointer;
}

.st-5center span:last-child {
    margin-right: 0px;
}

.st-5center span:before {
    width: 0%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: -webkit-linear-gradient(left, #7bca7d, #00abc8);
    background: -moz-linear-gradient(left, #7bca7d, #00abc8);
    background: -ms-linear-gradient(left, #7bca7d, #00abc8);
    background: -o-linear-gradient(left, #7bca7d, #00abc8);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.st-5center span.active:before {
    width: 100%;
}

.st-5center span em {
    width: 100%;
    height: 48px;
    line-height: 48px;
    border-radius: 5px;
    font-style: normal;
    padding: 0px 24px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    font-size: 16px;
    color: #00405b;
    display: block;
}

.st-5center span.active em {
    background: #e1f4f4;
}

.st-6 {
    width: 100%;
    margin-top: 7.875rem;
}

.st-6content {
    width: 100%;
    margin-top: 40px;
    position: relative;
}

.st-6content .swiper-slide {
    height: auto;
    overflow: hidden;
    background: #fff;
    border-radius: 10px;
    position: relative;
}

.st-6content .swiper-slide:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    border-radius: 10px;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.st-6content .swiper-slide:after {
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    content: "";
    position: absolute;
    left: 1px;
    top: 1px;
    border-radius: 9px;
    background: #fff;
    z-index: 4;
}

.st-6content .swiper-slide a {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    z-index: 5;
    padding: 0px 2.5rem 1.875rem;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    align-content: space-between;
}

.st-6cont {
    width: 100%;
}

.st-6pic {
    width: 100%;
    height: 90px;
    overflow: hidden;
    border-bottom: 1px #e1e9ed solid;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
    justify-content: center;
}

.st-6pic img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 70%;
}

.st-6content .swiper-slide:hover:before {
    opacity: 1;
}

.st-6info {
    width: 100%;
    overflow: hidden;
    font-size: 14px;
    color: #7a8799;
    line-height: 24px;
    margin-top: 24px;
}

.st-6more {
    width: 100%;
    overflow: hidden;
    margin-top: 30px;
    text-align: right;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
    transform: translateX(-10px);
}

.st-6more span {
    font-size: 14px;
    background-image: -webkit-linear-gradient(left, #76c980, #24b1cc);
    background-image: -moz-linear-gradient(left, #76c980, #24b1cc);
    background-image: -ms-linear-gradient(left, #76c980, #24b1cc);
    background-image: -o-linear-gradient(left, #76c980, #24b1cc);
    background-image: linear-gradient(left, #76c980, #24b1cc);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
    -ms-text-fill-color: transparent;
    -o-text-fill-color: transparent;
    text-fill-color: transparent;
    padding-right: 24px;
    position: relative;
}

.st-6more span:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-3.png") no-repeat right center;
}

.st-6content .swiper-slide:hover .st-6more {
    opacity: 1;
    transform: translateX(0px);
}

.st-6content .swiper-button-prev {
    width: 40px;
    height: 40px;
    opacity: 1;
    z-index: 5;
    left: -7%;
}

.st-6content .swiper-button-prev:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-58.png") no-repeat;
    background-size: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.st-6content .swiper-button-prev:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-59.png") no-repeat;
    background-size: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    transform: rotate(180deg);
    opacity: 0;
}

.st-6content .swiper-button-next {
    width: 40px;
    height: 40px;
    opacity: 1;
    z-index: 5;
    right: -7%;
}

.st-6content .swiper-button-next:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-58.png") no-repeat;
    background-size: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    transform: rotate(180deg);
}

.st-6content .swiper-button-next:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-59.png") no-repeat;
    background-size: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.st-6content .swiper-button-prev:hover:before,
.st-6content .swiper-button-next:hover:before {
    opacity: 0;
}

.st-6content .swiper-button-prev:hover:after,
.st-6content .swiper-button-next:hover:after {
    opacity: 1;
}

/*yuanxiao-gongtongti*/
.yx-add {
    width: 100%;
}

.yx-add .swiper {
    width: 100%;
    background: -webkit-linear-gradient(top, #f3f7f9, #fff);
    background: -moz-linear-gradient(top, #f3f7f9, #fff);
    background: -ms-linear-gradient(top, #f3f7f9, #fff);
    background: -o-linear-gradient(top, #f3f7f9, #fff);
    box-sizing: border-box;
    border-radius: 10px;
    border: 2px #fff solid;
    box-shadow: 0px 0px 12px 5px rgba(0, 120, 152, 0.05);
    position: relative;
    z-index: 12;
    margin-top: -60px;
}

.yx-add .swiper-slide {
    overflow: hidden;
}

.yx-add .swiper-slide a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    box-sizing: border-box;
    padding: 40px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.yx-add2 {
    width: 251px;
    height: 140px;
    overflow: hidden;
    border-radius: 8px;
}

.yx-add2 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.yx-add2:hover img {
    transform: scale(1.03);
}

.yx-add3 {
    width: calc(100% - 251px - 40px);
    overflow: hidden;
}

.yx-add3 span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: max(16px, 1.25rem);
    color: #00405b;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.yx-add3 p {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: max(14px, 1rem);
    color: #00405b;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    line-height: 26px;
    margin-top: 10px;
}

.yx-add3 em {
    float: right;
    width: auto;
    font-size: 14px;
    color: #00405b;
    padding-right: 16px;
    background: url("../img/icon-3.png") no-repeat right center;
    font-style: normal;
    margin-top: 20px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.yx-add3 em:hover {
    color: #00abc8;
}

.yx-add:hover .yx-add3 span {
    color: #00abc8;
}

.yx-add1 .swiper-pagination {
    text-align: left;
}

.yx-add1 {
    width: 60%;
    position: absolute;
    left: 331px;
    bottom: 40px;
    z-index: 42;
}

.yx-add1 span {
    background: #d1e8ee;
    opacity: 1;
}

.yx-add1 span.swiper-pagination-bullet-active {
    background: #00abc8;
}

.yx-1 {
    width: 100%;
    overflow: hidden;
    padding: 7.5rem 0px;
}

.yx-1left {
    float: left;
    width: 47.8%;
    overflow: hidden;
}

.yx-1left h3 {
    width: 100%;
    overflow: hidden;
    font-size: max(18px, 2.25rem);
    color: #00405b;
    position: relative;
    padding-bottom: 30px;
}

.yx-1left h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.yx-1left samp,
.yx-1left samp img {
    width: 100%;
    height: auto;
    overflow: hidden;
    display: block;
}

.yx-1left samp {
    margin-top: 20px;
    display: none;
}

.yx-1content {
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #00405b;
    line-height: 29px;
}

.yx-1content p {
    margin-top: 28px;
}

.yx-1right {
    float: right;
    width: 46.213%;
    overflow: hidden;
}

.yx-1pic,
.yx-1pic img {
    width: 100%;
    height: auto;
    overflow: hidden;
    display: block;
}

.yx-1pic {
    margin-top: 106px;
}

.yx-1right ul {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 1.875rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.yx-1right ul li {
    width: 60%;
    margin-top: 76px;
}

.yx-1right ul li:nth-child(2n) {
    width: auto;
}

.yx-1right ul li samp {
    float: left;
    width: auto;
    margin-top: 15px;
}

.yx-1model {
    float: left;
    width: auto;
    margin-left: 18px;
}

.yx-1model span {
    width: 100%;
    overflow: hidden;
    display: block;
    font-size: max(18px, 2.5rem);
    color: #00405b;
}

.yx-1model p {
    width: 100%;
    overflow: hidden;
    display: block;
    font-size: max(14px, 1.125rem);
    color: #00405b;
    line-height: 26px;
}

.yx-2 {
    width: 100%;
    overflow: hidden;
    background: #edf6f7;
    padding: 7.5rem 0px;
}

.yx-2head {
    width: 100%;
    overflow: hidden;
}

.yx-2head h3 {
    width: 100%;
    overflow: hidden;
    font-size: max(18px, 2.25rem);
    color: #00405b;
    position: relative;
    padding-bottom: 30px;
}

.yx-2head h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.yx-2info {
    width: 100%;
    overflow: hidden;
    line-height: 29px;
    font-size: 16px;
    color: #00405b;
    margin-top: 24px;
}

.yx-2 ul {
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-top: 50px;
}

.yx-2 ul:before {
    width: 100%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #ddedf0;
}

.yx-2 ul li {
    float: left;
    width: auto;
    position: relative;
    padding-bottom: 6px;
    margin-right: 23px;
    cursor: pointer;
}

.yx-2 ul li:before {
    width: 0%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: -webkit-linear-gradient(left, #7bca7d, #00abc8);
    background: -moz-linear-gradient(left, #7bca7d, #00abc8);
    background: -ms-linear-gradient(left, #7bca7d, #00abc8);
    background: -o-linear-gradient(left, #7bca7d, #00abc8);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.yx-2 ul li span {
    width: auto;
    display: block;
    height: 48px;
    line-height: 48px;
    border-radius: 10px;
    font-size: 16px;
    color: #00405b;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    padding: 0px 20px;
}

.yx-2 ul li.active:before {
    width: 100%;
}

.yx-2 ul li.active span {
    background: #dbefee;
}

.yx-2content {
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-top: 40px;
}

.yx-2pannel {
    width: 100%;
    overflow: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    background: #fff;
    border-radius: 8px;
    transform: translateY(60px);
    opacity: 0;
}

.yx-2pannel.active {
    position: relative;
    z-index: 5;
    animation: trans 0.5s ease 1;
    animation-fill-mode: forwards;
}

.yx-21 {
    width: 100%;
    box-sizing: border-box;
    padding: 20px;
    display: flex;
    justify-content: space-between;
}

.yx-21left {
    width: 49.22%;
    overflow: hidden;
}

.yx-21left img {
    width: 100%;
    height: auto;
}

.yx-21right {
    width: 50%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 2.5rem 30px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    align-content: space-between;
}

.yx-21top {
    width: 100%;
    font-size: 2rem;
    color: #00405b;
}

.yx-21bottom {
    width: 100%;
}

.yx-21info {
    width: 100%;
    font-size: 16px;
    color: #00405b;
    line-height: 29px;
}

.yx-21model {
    width: 100%;
    overflow: hidden;
    margin-top: 14px;
}

.yx-21item {
    width: 100%;
    overflow: hidden;
}

.yx-21item span {
    float: left;
    width: 115px;
    height: 34px;
    line-height: 34px;
    font-size: 16px;
    color: #00405b;
    margin-top: 10px;
}

.yx-21item p {
    float: left;
    width: calc(100% - 115px);
}

.yx-21item p em {
    float: left;
    width: auto;
    height: 34px;
    line-height: 34px;
    font-size: 14px;
    color: #00405b;
    margin-top: 10px;
    margin-right: 10px;
    background: #f2f7f8;
    border-radius: 7px;
    font-style: normal;
    padding: 0px 20px;
}

.yx-22 {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 3.75rem 2.5rem;
}

.yx-22 h4 {
    width: 100%;
    font-size: max(18px, 2rem);
    color: #00405b;
}

.yx-22model {
    width: 100%;
    overflow: hidden;
    margin-top: 18px;
}

.yx-22item {
    float: left;
    width: auto;
    height: 40px;
    line-height: 40px;
    border-radius: 6px;
    background: #f2f7f8;
    margin-right: 14px;
    font-size: 16px;
    color: #00405b;
    padding: 0px 20px;
    margin-top: 10px;
}

.yx-3 {
    width: 100%;
    overflow: hidden;
    background: url("../img/yx-1.jpg") no-repeat fixed;
    background-size: cover;
    padding: 7.5rem 0px;
}

.yx-3 h3 {
    width: 100%;
    overflow: hidden;
    font-size: max(18px, 2.25rem);
    color: #00405b;
    position: relative;
    padding-bottom: 30px;
    text-align: center;
}

.yx-3 h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    border-radius: 2px;
    background: -webkit-linear-gradient(left, #88cf8a, #00abc8);
    background: -moz-linear-gradient(left, #88cf8a, #00abc8);
    background: -ms-linear-gradient(left, #88cf8a, #00abc8);
    background: -o-linear-gradient(left, #88cf8a, #00abc8);
}

.yx-3more {
    width: 160px;
    height: 48px;
    line-height: 48px;
    margin: 40px auto 0px;
    border-radius: 5px;
    background: -webkit-linear-gradient(left, #7aca7e, #00abc8);
    background: -moz-linear-gradient(left, #7aca7e, #00abc8);
    background: -ms-linear-gradient(left, #7aca7e, #00abc8);
    background: -o-linear-gradient(left, #7aca7e, #00abc8);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.yx-3more a {
    width: 100%;
    height: 100%;
    display: block;
    text-align: center;
    font-size: 16px;
    color: #fff;
}

.yx-3more:hover {
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transform: translateY(-10px);
}

/*peiyangxiangmu*/
.xm-1 {
    width: 100%;
    overflow: hidden;
    margin-top: -60px;
    background: #fff url("../images/online/img-2.png") no-repeat center top;
    background-size: 100%;
    padding: 136px 0px 80px;
    position: relative;
}

.xm-1pic {
    width: 100%;
    overflow: hidden;
    background: #fff;
    padding: 10px;
    border-radius: 8px;
    box-sizing: border-box;
}

.xm-1pic img {
    width: 100%;
    height: auto;
    border-radius: 7px;
}

.xm-1content {
    width: 100%;
    margin-top: 75px;
}

.xm-1content h3 {
    float: left;
    width: 60%;
    font-size: max(20px, 2.375rem);
    font-weight: normal;
    color: #00405b;
}

.xm-1button {
    float: right;
    width: auto;
}

.xm-1button span {
    float: left;
    width: 160px;
    height: 48px;
    line-height: 48px;
    border-radius: 6px;
    overflow: hidden;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    text-align: center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    margin-right: 10px;
}

.xm-1button span a {
    font-size: 16px;
    color: #fff;
    cursor: pointer;
    width: 100%;
    height: 100%;
    display: block;
}

.xm-1button span:hover {
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transform: translateY(-10px);
}

.xm-1button em {
    float: left;
    width: 160px;
    height: 48px;
    line-height: 48px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    text-align: center;
    padding: 1px;
    box-sizing: border-box;
    font-style: normal;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0.7;
}

.xm-1button em:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
}

.xm-1button em a {
    width: 100%;
    height: 100%;
    background: #fff;
    font-size: 16px;
    color: #00405b;
    display: block;
    border-radius: 5px;
    position: relative;
    z-index: 5;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.xm-1button em:hover {
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transform: translateY(-10px);
}

.xm-1button em:hover a {
    background: none;
    color: #fff;
}

.xm-2 {
    width: 100%;
    padding: 100px 0px;
    background: #eef6f6;
}

.xm-2left {
    float: left;
    width: 71.213%;
    overflow: hidden;
    background: #fff;
    border-radius: 8px;
    box-sizing: border-box;
    padding: 40px;
}

.xm-2left h4 {
    width: 100%;
    box-sizing: border-box;
    padding-left: 16px;
    font-weight: normal;
    font-size: max(18px, 1.625rem);
    color: #00405b;
    position: relative;
}

.xm-2left h4:before {
    width: 4px;
    height: 80%;
    content: "";
    left: 0px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 4px;
    background: -webkit-linear-gradient(top, #04acc6, #a8d15f);
    background: -moz-linear-gradient(top, #04acc6, #a8d15f);
    background: -ms-linear-gradient(top, #04acc6, #a8d15f);
    background: -o-linear-gradient(top, #04acc6, #a8d15f);
}

.xm-2info {
    width: 100%;
    overflow: hidden;
    font-size: max(14px, 1.125rem);
    line-height: max(24px, 1.85rem);
    color: #00405b;
}

.xm-2info img {
    width: auto;
    height: auto;
    max-width: 100%;
}

.xm-2info p {
    margin: 34px 0px;
}

.xm-2info p:first-child {
    margin-top: 20px;
}

.xm-2content {
    width: 100%;
    margin-top: 30px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 25px;
}

.xm-2item {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    border: 1px #e9f0f4 solid;
    border-radius: 6px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    background: #fff;
}

.xm-2item a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}

.xm-2item:hover {
    box-shadow: 0px 0px 12px 5px rgba(45, 182, 173, 0.1);
}

.xm-2item samp {
    width: 100%;
    height: 7.92vw;
    overflow: hidden;
    display: block;
}

.xm-2item samp img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.xm-2item:hover samp img {
    transform: scale(1.03);
}

.xm-2cont {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 1.875rem;
}

.xm-2cont span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: max(16px, 1.125rem);
    color: #00405b;
    line-height: 24px;
}

.xm-2cont p {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 14px;
    color: #7a8799;
    line-height: 20px;
    margin-top: 10px;
}

.xm-2right {
    float: right;
    width: 25.75%;
    position: sticky;
    top: 130px;
}

.xm-2right h3 {
    width: 100%;
    box-sizing: border-box;
    padding-left: 16px;
    font-size: max(18px, 1.625rem);
    font-weight: normal;
    color: #00405b;
    position: relative;
}

.xm-2right h3:before {
    width: 4px;
    height: 80%;
    content: "";
    left: 0px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 4px;
    background: -webkit-linear-gradient(top, #04acc6, #a8d15f);
    background: -moz-linear-gradient(top, #04acc6, #a8d15f);
    background: -ms-linear-gradient(top, #04acc6, #a8d15f);
    background: -o-linear-gradient(top, #04acc6, #a8d15f);
}

.xm-2pannel {
    width: 100%;
    overflow: hidden;
    background: url("../img/yx-8.jpg") no-repeat;
    background-size: cover;
    border-radius: 8px;
    margin-top: 30px;
}

.xm-2pannel a {
    width: 100%;
    height: 100%;
    display: block;
    box-sizing: border-box;
    padding: 2.5rem;
}

.xm-2pannel a samp {
    width: 100%;
    overflow: hidden;
    height: 48px;
    display: block;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    align-content: center;
    transform: translateY(60px);
    opacity: 0;
}

.xm-2pannel a samp img {
    width: auto;
    height: auto;
    max-height: 100%;
}

.xm-2pannel a span {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: max(16px, 1.25rem);
    color: #fff;
    line-height: 26px;
    margin-top: 18px;
    transform: translateY(60px);
    opacity: 0;
}

.xm-2pannel a p {
    width: 100px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    overflow: hidden;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.1);
    font-size: 14px;
    color: #fff;
    margin-top: 2.8125rem;
    transform: translateY(60px);
    opacity: 0;
}

.xm-2pannel .swiper-slide-active a samp {
    animation: trans 0.5s ease 0.2s 1;
    animation-fill-mode: forwards;
}

.xm-2pannel .swiper-slide-active a span {
    animation: trans 0.5s ease 0.3s 1;
    animation-fill-mode: forwards;
}

.xm-2pannel .swiper-slide-active a p {
    animation: trans 0.5s ease 0.4s 1;
    animation-fill-mode: forwards;
}

.xm-2pannel .swiper-pagination {
    text-align: right;
    right: 2.5rem;
    bottom: 2.5rem;
    left: auto;
}

.xm-2pannel .swiper-pagination span {
    background: #fff !important;
    opacity: 0.1;
}

.xm-2pannel .swiper-pagination .swiper-pagination-bullet-active {
    opacity: 1;
}

/*yuanxiao-case-info*/
.case {
    width: 100%;
    overflow: hidden;
    background: #fff url("../images/online/img-2.png") no-repeat center top;
    background-size: 100%;
    padding: 60px 0px;
}

.case-1 {
    width: 100%;
    overflow: hidden;
}

.case-1 a {
    float: left;
    width: auto;
    position: relative;
    padding-left: 16px;
    font-size: 16px;
    color: #80acb0;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.case-1 a:before {
    width: 6px;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: px;
    background: url("../img/icon-23.png") no-repeat left center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.case-1 a:after {
    width: 6px;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: px;
    background: url("../img/icon-23-2.png") no-repeat left center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.case-1 a:hover {
    color: #00405b;
}

.case-1 a:hover:before {
    opacity: 0;
}

.case-1 a:hover:after {
    opacity: 1;
}

.case-body {
    width: 100%;
    overflow: hidden;
    margin-top: 40px;
}

.case-left {
    float: left;
    width: 69.7%;
    overflow: hidden;
}

.case-2 {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    background: #fff;
    border: 1px #e3eef3 solid;
    border-radius: 16px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.case-2left {
    width: 320px;
    overflow: hidden;
    position: relative;
}

.case-2left samp,
.case-2left samp img {
    width: 100%;
    display: block;
    height: auto;
    position: relative;
}

.case-2left samp:before {
    width: 200%;
    height: 70%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 2;
    background: -webkit-linear-gradient(top, rgb(56, 174, 201), rgba(56, 174, 201, 0));
    background: -moz-linear-gradient(top, rgb(56, 174, 201), rgba(56, 174, 201, 0));
    background: -ms-linear-gradient(top, rgb(56, 174, 201), rgba(56, 174, 201, 0));
    background: -o-linear-gradient(top, rgb(56, 174, 201), rgba(56, 174, 201, 0));
    transform: rotate(-30deg) translate(-30%, -80%);
}

.case-2model {
    width: 80%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 50px;
    z-index: 5;
    font-size: max(18px, 2rem);
    color: #00405b;
}

.case-2model span {
    width: 100%;
    display: block;
}

.case-2model p {
    margin-top: 8px;
    font-size: max(16px, 1.625rem);
}

.case-2right {
    width: calc(100% - 320px);
    box-sizing: border-box;
    padding: 0px 2.5rem 0px 3.75rem;
}

.case-2head {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    flex-direction: row-reverse;
}

.case-2head span {
    width: auto;
}

.case-2head span img {
    width: auto;
    height: auto;
    max-width: 160px;
}

.case-2head p {
    width: auto;
    font-size: max(16px, 1.5rem);
    color: #00405b;
}

.case-2right ul {
    width: 100%;
    overflow: hidden;
    margin-top: 16px;
}

.case-2right ul li {
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #00405b;
    line-height: 24px;
    margin-top: 15px;
}

.case-2right ul li span {
    float: left;
    width: auto;
}

.case-2right ul li p {
    float: left;
    width: calc(100% - 90px);
}

.case-3 {
    width: 100%;
    overflow: hidden;
    margin-top: 54px;
}

.case-3 h4 {
    width: 100%;
    overflow: hidden;
    font-size: max(20px, 1.5rem);
    color: #00405b;
    position: relative;
    padding-bottom: 20px;
    font-weight: normal;
}

.case-3 h4:before {
    width: 100%;
    height: 2px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
}

.case-3content {
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #00405b;
    line-height: 28px;
    margin-top: 6px;
}

.case-3content p {
    margin-top: 26px;
}

.case-right {
    float: right;
    width: 26.52%;
    overflow: hidden;
    background: #fff;
    border: 1px #e3eef3 solid;
    border-radius: 16px;
    padding: 2.375rem;
}

.case-right h4 {
    width: 100%;
    overflow: hidden;
    font-size: max(20px, 1.25rem);
    color: #00405b;
    font-weight: normal;
}

.case-right ul {
    width: 100%;
    overflow: hidden;
    margin-top: 20px;
}

.case-right ul li {
    width: 100%;
    overflow: hidden;
    height: 40px;
    line-height: 40px;
    position: relative;
    margin-top: 5px;
    box-sizing: border-box;
    padding: 1px;
    background: #f2f8fb;
}

.case-right ul li:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    border-radius: 6px;
    z-index: 1;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.case-right ul li a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    border-radius: 5px;
    background: #f2f8fb;
    position: relative;
    z-index: 5;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
}

.case-right ul li:hover:before {
    opacity: 1;
}

.case-right samp {
    width: 60px;
    height: 100%;
    display: block;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    align-content: center;
}

.case-right samp img {
    width: auto;
    height: auto;
    max-width: 98%;
    max-height: 90%;
}

.case-right span {
    font-size: 14px;
    color: #00405b;
}

/*yuanxiao-jiaocai*/
.jc {
    width: 100%;
    background: #fff url("../images/online/img-2.png") no-repeat center top;
    background-size: 100%;
    margin-top: -60px;
    position: relative;
    padding: 158px 0px 120px;
}

.jc:before {
    width: 100%;
    height: 200px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: 4;
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), rgb(255, 255, 255) 50%);
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0), rgb(255, 255, 255) 50%);
    background: -ms-linear-gradient(top, rgba(255, 255, 255, 0), rgb(255, 255, 255) 50%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0), rgb(255, 255, 255) 50%);
}

.jc-left,
.jc-1button span {
    float: left;
    width: 78.788%;
}

.jc-left h1 {
    width: 100%;
    font-size: max(18px, 2rem);
    font-weight: normal;
    color: #00405b;
    padding-left: 22px;
    box-sizing: border-box;
    position: relative;
}

.jc-left h1:before {
    width: 4px;
    height: 86%;
    content: "";
    left: 0px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: -webkit-linear-gradient(top, #78c67e, #0d9cb3);
    background: -moz-linear-gradient(top, #78c67e, #0d9cb3);
    background: -ms-linear-gradient(top, #78c67e, #0d9cb3);
    background: -o-linear-gradient(top, #78c67e, #0d9cb3);
}

.jc-1body {
    width: 100%;
}

.jc-1item {
    width: 100%;
    overflow: hidden;
    border-radius: 5px;
    background: #fff;
    margin-top: 30px;
    box-sizing: border-box;
    padding: 10px;
}

.jc-1item img {
    width: 100%;
    height: auto;
    border-radius: 4px;
    box-shadow: 0px 0px 9px 2px rgba(0, 61, 88, 0.1);
}

.jc-right {
    float: right;
    width: 18.19%;
    position: sticky;
    top: 130px;
    margin-top: 4.375rem;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.6);
    box-sizing: border-box;
    padding: 1.875rem 2.1875rem;
    box-shadow: 0px 0px 12px 5px rgba(0, 0, 0, 0.04);
}

.jc-right ul {
    width: 100%;
    overflow: hidden;
}

.jc-right ul li {
    width: 100%;
    margin-top: 20px;
    box-sizing: border-box;
    padding: 9px;
    position: relative;
    cursor: pointer;
}

.jc-right ul li:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: #ebeef1;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    border-radius: 6px;
}

.jc-right ul li:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    border: 2px #75c57f solid;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    border-radius: 6px;
    box-sizing: border-box;
    opacity: 0;
}

.jc-right ul li:first-child {
    margin-top: 0px;
}

.jc-right ul li img {
    width: 100%;
    height: auto;
    position: relative;
    z-index: 6;
}

.jc-right ul li.active:before {
    opacity: 0;
}

.jc-right ul li.active:after {
    opacity: 1;
}

.jc-null {
    width: 100%;
    height: 2px;
}

.jc-1button {
    width: 100%;
    position: absolute;
    left: 0px;
    bottom: 90px;
    z-index: 5;
}

.jc-1button span {
    text-align: center;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.jc-1button span a {
    width: 160px;
    height: 48px;
    overflow: hidden;
    display: inline-block;
    border-radius: 5px;
    background: -webkit-linear-gradient(left, #78c97f, #00abc8);
    background: -moz-linear-gradient(left, #78c97f, #00abc8);
    background: -ms-linear-gradient(left, #78c97f, #00abc8);
    background: -o-linear-gradient(left, #78c97f, #00abc8);
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 16px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    cursor: pointer;
}

.jc-1button span a img {
    margin-right: 10px;
}

.jc-1button span a:hover {
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transform: translateY(-10px);
}

/*弹窗*/
.prop {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0px;
    top: 0px;
    background: rgba(0, 0, 0, 0.8);
    z-index: 10000;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.prop.active {
    opacity: 1;
    visibility: visible;
}

.prop-center {
    width: 600px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}

.prop-center .cf-right {
    width: 100% !important;
    background-color: #fff;
}

.prop-close {
    width: 40px;
    height: 40px;
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 2;
    cursor: pointer;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    transform: rotate(45deg);
}

.prop-close:before {
    width: 50%;
    height: 1px;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #84a1a5;
}

.prop-close:after {
    width: 1px;
    height: 50%;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #84a1a5;
}

.prop-close:hover {
    transform: rotate(135deg);
}

/*yuanxiao-产品方案*/
.cf {
    width: 100%;
    background: #fff url("../images/online/img-2.png") no-repeat center top;
    background-size: 100%;
    margin-top: -60px;
    position: relative;
    padding: 158px 0px 120px;
    overflow: hidden;
}

.cf-left {
    float: left;
    width: 60.607%;
}

.cf-1 {
    width: 100%;
    overflow: hidden;
    background: #fff;
    border-radius: 6px;
    box-sizing: border-box;
    padding: 3.75rem;
    box-shadow: 0px 0px 12px 5px rgba(0, 0, 0, 0.02);
}

.cf-1head {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding-left: 30px;
}

.cf-1head:before {
    width: 4px;
    height: 90%;
    content: "";
    left: 0px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: -webkit-linear-gradient(top, #0daec0, #8cce73);
    background: -moz-linear-gradient(top, #0daec0, #8cce73);
    background: -ms-linear-gradient(top, #0daec0, #8cce73);
    background: -o-linear-gradient(top, #0daec0, #8cce73);
}

.cf-1head h1 {
    width: 100%;
    font-size: max(20px, 2rem);
    font-weight: normal;
    color: #00405b;
}

.cf-1head p {
    width: 100%;
    font-size: max(14px, 1.25rem);
    color: #00405b;
    margin-top: 10px;
}

.cf-1info {
    width: 100%;
    overflow: hidden;
    background: #f7fafa;
    border-radius: 6px;
    margin-top: 30px;
    box-sizing: border-box;
    padding: 2.875rem;
    font-size: 16px;
    color: #00405b;
    line-height: 30px;
}

.cf-1content {
    width: 100%;
    overflow: hidden;
    text-align: center;
    margin-top: 34px;
}

.cf-1content img {
    width: auto;
    height: auto;
    max-width: 100%;
}

.cf-2 {
    width: 100%;
    overflow: hidden;
    background: #fff;
    border-radius: 6px;
    box-sizing: border-box;
    padding: 3.75rem;
    margin-top: 20px;
    text-align: center;
    box-shadow: 0px 0px 12px 5px rgba(0, 0, 0, 0.02);
}

.cf-2 img {
    width: auto;
    height: auto;
    max-width: 100%;
}

.cf-right {
    float: right;
    width: 37.88%;
    overflow: hidden;
    background: url("../img/icon-51.png") no-repeat;
    background-size: cover;
    border-radius: 12px;
    box-sizing: border-box;
    padding: 3.75rem 2.8125rem 2.3125rem;
    box-shadow: 0px 0px 12px 5px rgba(0, 0, 0, 0.02);
}

.cf-3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
}

.cf-3 h3 {
    width: 100%;
    font-size: max(20px, 1.625rem);
    font-weight: normal;
    color: #00405b;
}

.cf-3 p {
    width: 100%;
    font-size: 14px;
    color: #00405b;
    margin-top: 14px;
}

.cf-right form {
    width: 100%;
    display: block;
    margin-top: 34px;
}

.cf-4 {
    width: 100%;
    box-sizing: border-box;
    height: 48px;
    line-height: 48px;
    border-radius: 4px;
    border: 1px #dbe8ec solid;
    margin-top: 14px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    position: relative;
}

.cf-4:hover {
    border-color: #00abc8;
}

.cf-4 input {
    width: 100%;
    height: 100%;
    background: none;
    overflow: hidden;
    box-sizing: border-box;
    padding: 0px 20px;
    font-size: 16px;
    color: #7f929a;
    position: relative;
    z-index: 2;
}

.cf-4 input::placeholder {
    color: "#7f929a" !important;
    opacity: 1;
}

.cf-4 input::-webkit-input-placeholder {
    color: "#7f929a" !important;
    opacity: 1;
}

.cf-4 input::-ms-input-placeholder {
    color: "#7f929a" !important;
    opacity: 1;
}

.cf-4 input::-moz-placeholder {
    color: "#7f929a" !important;
    opacity: 1;
}

.cf-4 select {
    width: 100%;
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 0px 20px;
    font-size: 16px;
    color: #7f929a;
    position: relative;
    z-index: 2;
    background: url("../img/icon-52.png") no-repeat 97% center;
}

.cf-4 select::placeholder {
    color: "#7f929a" !important;
    opacity: 1;
}

.cf-4 select::-webkit-input-placeholder {
    color: "#7f929a" !important;
    opacity: 1;
}

.cf-4 select::-ms-input-placeholder {
    color: "#7f929a" !important;
    opacity: 1;
}

.cf-4 select::-moz-placeholder {
    color: "#7f929a" !important;
    opacity: 1;
}

.cf-5 {
    width: 100%;
    box-sizing: border-box;
    border-radius: 4px;
    border: 1px #dbe8ec solid;
    margin-top: 14px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    position: relative;
    overflow: hidden;
}

.cf-5:hover {
    border-color: #00abc8;
}

.cf-5 textarea {
    width: 100%;
    height: 100px;
    overflow: hidden;
    box-sizing: border-box;
    padding: 20px;
    font-size: 16px;
    color: #7f929a;
    position: relative;
    z-index: 2;
    line-height: 24px;
}

.cf-5 textarea::placeholder {
    color: "#7f929a" !important;
    opacity: 1;
}

.cf-5 textarea::-webkit-input-placeholder {
    color: "#7f929a" !important;
    opacity: 1;
}

.cf-5 textarea::-ms-input-placeholder {
    color: "#7f929a" !important;
    opacity: 1;
}

.cf-5 textarea::-moz-placeholder {
    color: "#7f929a" !important;
    opacity: 1;
}

.cf-6 {
    width: 100%;
    margin-top: 12px;
}

.cf-6 p {
    width: 100%;
    font-size: 16px;
    color: #7f929a;
}

.cf-6 ul {
    width: 100%;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.cf-6 ul li {
    width: auto;
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    font-size: 14px;
    color: #7f929a;
    margin-top: 17px;
    cursor: pointer;
}

.cf-6 ul li:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 6;
}

.cf-6 ul li input {
    width: 15px;
    height: 15px;
    box-sizing: border-box;
    border: 1px #dcdcdc solid;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 2px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    background-clip: content-box;
    margin-right: 8px;
}

.cf-6 ul li input:checked {
    background: #00405b;
    background-clip: content-box;
}

.cf-7 {
    width: 100%;
    margin-top: 24px;
    position: relative;
    overflow: hidden;
}

.cf-7:before {
    width: 30px;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 6;
}

.cf-7 input {
    float: left;
    width: 15px;
    height: 15px;
    box-sizing: border-box;
    border: 1px #dcdcdc solid;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 2px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    background-clip: content-box;
    margin-top: 3px;
}

.cf-7 input:checked {
    background: #00405b;
    background-clip: content-box;
}

.cf-7 p {
    float: right;
    width: calc(100% - 22px);
    line-height: 20px;
    font-size: 14px;
    color: #00405b;
}

.cf-7 p a {
    color: #00405b;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.cf-7 p a:hover {
    color: #00abc8;
}

.cf-8 {
    width: 100%;
    overflow: hidden;
    height: 50px;
    line-height: 50px;
    margin-top: 20px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    border-radius: 30px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.cf-8 input {
    width: 100%;
    height: 100%;
    background: none;
    cursor: pointer;
    font-size: 16px;
    color: #fff;
}

.cf-8:hover {
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transform: translateY(10px);
}

/*yuanxiao-xuni*/
.xn-1 {
    width: 100%;
    overflow: hidden;
    margin-top: -60px;
    background: #fff url("../images/online/img-2.png") no-repeat center top;
    background-size: 100%;
    padding: 136px 0px 80px;
    position: relative;
}

.xn-1tu {
    width: 100%;
    overflow: hidden;
    background: #fff;
    border-radius: 8px;
    box-sizing: border-box;
    position: relative;
    border: 10px #fff solid;
}

.xn-1tu img {
    width: 100%;
    height: auto;
    border-radius: 7px;
}

.xn-1tu span {
    width: 100%;
    display: block;
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
    background: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
    box-sizing: border-box;
    padding: 100px 40px 40px;
    font-size: max(18px, 2.25rem);
    color: #fff;
}

.xn-2info {
    width: 100%;
    overflow: hidden;
    font-size: max(14px, 1.125rem);
    line-height: max(24px, 1.85rem);
    color: #00405b;
    border-bottom: 4px #f6f8f9 solid;
    margin-bottom: 60px;
}

.xn-2info img {
    width: auto;
    height: auto;
    max-width: 100%;
}

.xn-2info p {
    margin: 34px 0px;
}

.xn-2info p:first-child {
    margin-top: 20px;
}

.xn-2des {
    width: 100%;
    overflow: hidden;
    margin: 30px 0px 60px;
    border-bottom: 4px #f6f8f9 solid;
    padding-bottom: 60px;
}

.xn-2content {
    width: 100%;
    overflow: hidden;
    background: #f6f8f9;
    border-radius: 8px;
    box-sizing: border-box;
    padding: 2.375rem;
    font-size: max(14px, 1.125rem);
    color: #00405b;
    line-height: max(24px, 1.85rem);
}

.xn-2content img {
    width: auto;
    height: auto;
    max-width: 100%;
}

.xn-2content p {
    margin-top: 30px;
}

.xn-2content p:first-child {
    margin-top: 0px;
}

.xn-3 {
    width: 100%;
    overflow: hidden;
    margin: 30px 0px 60px;
    border-bottom: 4px #f6f8f9 solid;
    padding-bottom: 60px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 1.5625rem;
}

.xn-3item {
    width: 100%;
    overflow: hidden;
    background: #f6f8f9;
    border-radius: 8px;
    position: relative;
}

.xn-3item:hover {
    overflow: initial;
}

.xn-3item:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    background: -webkit-linear-gradient(left, #7ac97e, #00abc8);
    background: -moz-linear-gradient(left, #7ac97e, #00abc8);
    background: -ms-linear-gradient(left, #7ac97e, #00abc8);
    background: -o-linear-gradient(left, #7ac97e, #00abc8);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.xn-3item:hover:before {
    opacity: 1;
}

.xn-3item a {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    z-index: 5;
    padding: 2.5rem 2.5rem 0px;
    box-sizing: border-box;
    position: relative;
}

.xn-3item a:before {
    width: 100%;
    height: 30%;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: 4;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    background: -webkit-linear-gradient(top, rgba(246, 248, 249, 0), rgb(246, 248, 249));
    background: -moz-linear-gradient(top, rgba(246, 248, 249, 0), rgb(246, 248, 249));
    background: -ms-linear-gradient(top, rgba(246, 248, 249, 0), rgb(246, 248, 249));
    background: -o-linear-gradient(top, rgba(246, 248, 249, 0), rgb(246, 248, 249));
}

.xn-3model {
    width: 100%;
    height: 190px;
    overflow: hidden;
    background: url("../img/yx-20.jpg") no-repeat;
    background-size: cover;
    border-radius: 8px 8px 0px 0px;
    box-shadow: 0px 0px 10px 4px rgba(0, 64, 91, 0.05);
    box-sizing: border-box;
    padding: 20px 20px 0px;
}

.xn-3item:hover a:before {
    opacity: 0;
}

.xn-3model samp {
    width: 100%;
    overflow: hidden;
    height: 25px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    display: block;
}

.xn-3model samp img {
    width: auto;
    height: auto;
    max-height: 100%;
    align-content: center;
}

.xn-3model span {
    width: 100%;
    display: block;
    font-size: max(14px, 1.125rem);
    color: #00405b;
    line-height: 26px;
    margin-top: 34px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.xn-3item:hover .xn-3model span {
    margin-top: 20px;
}

.xn-3model p {
    width: 90px;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    border-radius: 15px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    background: -webkit-linear-gradient(left, #78c97f, #00abc8);
    background: -moz-linear-gradient(left, #78c97f, #00abc8);
    background: -ms-linear-gradient(left, #78c97f, #00abc8);
    background: -o-linear-gradient(left, #78c97f, #00abc8);
    margin-top: 30px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.xn-3item:hover .xn-3model p {
    opacity: 1;
}

.xn-4 {
    width: 100%;
    overflow: hidden;
    margin: 30px 0px 60px;
}

.xn-4 .swiper-slide {
    overflow: hidden;
}

.xn-4 .swiper-slide a {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: block;
}

.xn-4 .swiper-slide samp {
    width: 100%;
    height: 8.334vw;
    overflow: hidden;
    border-radius: 10px;
    display: block;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.xn-4 .swiper-slide samp img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.xn-4model {
    width: 85%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    height: 100%;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.xn-4model span {
    width: 88px;
    height: 32px;
    line-height: 32px;
    display: block;
    border: 1px #cadde7 solid;
    border-radius: 4px;
    text-align: center;
    font-size: 16px;
    color: #a6bfcc;
    margin-top: 1.875rem;
}

.xn-4model p {
    width: 60%;
    display: block;
    font-size: max(14px, 1.25rem);
    color: #00405b;
    margin-top: 1.75rem;
}

.xn-4 .swiper-slide:hover samp,
.xn-4 .swiper-slide:hover .xn-4model {
    filter: blur(2px);
}

.xn-item {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 4;
    background: rgba(3, 72, 102, 0.2);
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    align-content: center;
    border-radius: 10px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.xn-item em {
    width: 100%;
    display: block;
    text-align: center;
}

.xn-item span {
    width: 100%;
    display: block;
    text-align: center;
    font-size: 16px;
    color: #fff;
    margin-top: 15px;
}

.xn-4 .swiper-slide:hover .xn-item {
    opacity: 1;
}

.xn-4button {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin-top: 30px;
}

.xn-4button .swiper-button-prev {
    width: 30px;
    height: 30px;
    opacity: 1;
    position: relative;
    top: 0px;
    margin: 0px !important;
    transform: translateY(0px);
}

.xn-4button .swiper-button-prev:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-54.png") no-repeat center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.xn-4button .swiper-button-prev:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-55.png") no-repeat center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    transform: rotate(180deg);
    opacity: 0;
}

.xn-4button .swiper-button-prev:hover:before,
.xn-4button .swiper-button-next:hover:before {
    opacity: 0;
}

.xn-4button .swiper-button-prev:hover:after,
.xn-4button .swiper-button-next:hover:after {
    opacity: 1;
}

.xn-4button .swiper-button-next {
    width: 30px;
    height: 30px;
    opacity: 1;
    position: relative;
    top: 0px;
    margin: 0px !important;
    transform: translateY(0px);
}

.xn-4button .swiper-button-next:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-54.png") no-repeat center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    transform: rotate(180deg);
}

.xn-4button .swiper-button-next:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-55.png") no-repeat center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.xn-4button .swiper-pagination {
    position: relative;
    width: auto;
    bottom: auto;
    margin: 0px 40px;
}

.xn-4button .swiper-pagination span {
    width: 16px;
    height: 16px;
    position: relative;
    margin: 0px 6px;
    border-radius: 50%;
    opacity: 1;
    background: none;
}

.xn-4button .swiper-pagination span:before {
    width: 6px;
    height: 6px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    content: "";
    border-radius: 50%;
    background: #dcebf2;
    z-index: 2;
}

.xn-4button .swiper-pagination span:after {
    width: 14px;
    height: 14px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    content: "";
    border-radius: 50%;
    background: #fff;
    z-index: 1;
    opacity: 0;
}

.xn-4button .swiper-pagination .swiper-pagination-bullet-active {
    background: -webkit-linear-gradient(left, #7bca82, #06adc9);
    background: -moz-linear-gradient(left, #7bca82, #06adc9);
    background: -ms-linear-gradient(left, #7bca82, #06adc9);
    background: -o-linear-gradient(left, #7bca82, #06adc9);
}

.xn-4button .swiper-pagination .swiper-pagination-bullet-active:before {
    background: -webkit-linear-gradient(left, #7bca82, #06adc9);
    background: -moz-linear-gradient(left, #7bca82, #06adc9);
    background: -ms-linear-gradient(left, #7bca82, #06adc9);
    background: -o-linear-gradient(left, #7bca82, #06adc9);
}

.xn-4button .swiper-pagination .swiper-pagination-bullet-active:after {
    opacity: 1;
}

.xn-5 {
    width: 100%;
    margin-top: 10px;
}

.xn-5pannel {
    width: 100%;
    margin-top: 20px;
    overflow: hidden;
    border-radius: 8px;
    background: url("../img/yx-22.jpg") no-repeat;
    background-size: cover;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.xn-5pannel:hover {
    box-shadow: 0px 0px 12px 5px rgba(13, 174, 192, 0.3);
}

.xn-5pannel a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    box-sizing: border-box;
    padding: 1.875rem;
}

.xn-5pannel samp {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 8px;
    overflow: hidden;
}

.xn-5pannel samp img {
    width: 100%;
    height: auto;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.xn-5pannel:hover samp img {
    transform: scale(1.03);
}

.xn-5pannel span {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: max(16px, 1.25rem);
    color: #fff;
    margin-top: 1.875rem;
}

.xn-5pannel p {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.4);
    margin-top: 0.87rem;
    line-height: 22px;
}

/*yuanxiao-qyinfo*/
.qyinfo {
    margin-top: -60px;
    overflow: initial;
}

.qyinfo .case-body {
    overflow: initial;
    position: relative;
}

.qyinfo-right {
    position: sticky;
    top: 130px;
}

.qyinfo-right samp {
    width: 100%;
}

.qyinfo-right ul li {
    height: 50px;
    line-height: 50px;
}

.qy-1 {
    width: 100%;
    overflow: hidden;
    border-radius: 12px;
    position: relative;
}

.qy-1 samp {
    width: 100%;
    display: block;
    overflow: hidden;
}

.qy-1 samp img {
    width: 100%;
    height: auto;
}

.qy-1model {
    width: 80%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 3.75rem;
    z-index: 3;
}

.qy-1model span {
    width: 100%;
    display: block;
    overflow: hidden;
}

.qy-1model span img {
    width: auto;
    height: auto;
    max-height: 40px;
}

.qy-1model h1 {
    width: 100%;
    overflow: hidden;
    margin-top: 20px;
    color: #00405b;
    font-size: 2rem;
    font-weight: normal;
}

.qy-2 {
    width: 100%;
    overflow: hidden;
    position: relative;
    font-size: max(18px, 1.5rem);
    color: #00405b;
    padding-bottom: 20px;
    margin-top: 60px;
}

.qy-2:before {
    width: 100%;
    height: 2px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
}

.qy-3 {
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #00405b;
    line-height: 28px;
}

.qy-3 img {
    width: auto;
    height: auto;
    max-width: 100%;
}

.qy-3 p {
    margin: 30px 0px;
}

.qy-3 p:last-child {
    margin-bottom: 0px;
}

.qy-4 {
    width: 100%;
    overflow: hidden;
    margin-top: 30px;
}

.qy-4item {
    width: 100%;
    overflow: hidden;
    margin-top: 10px;
    background: #f2f8fb;
    border-radius: 12px;
    padding: 20px 1.875rem;
}

.qy-4item span {
    float: left;
    width: auto;
    font-size: 30px;
    background-image: -webkit-linear-gradient(left, #79c97f, #10b0cb);
    background-image: -moz-linear-gradient(left, #79c97f, #10b0cb);
    background-image: -ms-linear-gradient(left, #79c97f, #10b0cb);
    background-image: -o-linear-gradient(left, #79c97f, #10b0cb);
    background-image: linear-gradient(left, #79c97f, #10b0cb);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
    -ms-text-fill-color: transparent;
    -o-text-fill-color: transparent;
    text-fill-color: transparent;
}

.qy-4item p {
    float: right;
    width: calc(100% - 50px);
    font-size: 16px;
    line-height: 32px;
    color: #00405b;
    margin-top: 2px;
}

.qy-5 {
    width: 100%;
    overflow: hidden;
    margin-top: 24px;
}

.qy-5item {
    width: 100%;
    overflow: hidden;
    border: 1px #f2f8fb solid;
    border-radius: 12px;
    margin-top: 15px;
    box-sizing: border-box;
    padding: 1.875rem;
}

.qy-5item samp {
    float: left;
    width: 56px;
    text-align: center;
    overflow: hidden;
}

.qy-5item samp img {
    width: auto;
    height: auto;
    max-width: 100%;
}

.qy-5right {
    float: right;
    width: calc(100% - 56px - 20px);
    overflow: hidden;
}

.qy-5right span {
    float: left;
    width: 100%;
    font-size: 18px;
    color: #00405b;
}

.qy-5right p {
    float: left;
    width: 100%;
    font-size: 16px;
    color: #00405b;
    line-height: 28px;
    margin-top: 3px;
}

/*login*/
.login {
    width: 100%;
    height: calc(100vh - 80px);
    overflow: hidden;
    background: url("../img/login-1.jpg") no-repeat;
    background-size: cover;
    position: relative;
}

.login:before {
    width: 100%;
    height: 40%;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: url("../img/login-1.png") no-repeat left bottom;
    background-size: 100%;
    z-index: 1;
}

.login-center {
    width: 480px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: url("../img/login-2.jpg") no-repeat;
    background-size: cover;
    border-radius: 7px;
    box-sizing: border-box;
    padding: 2.5rem;
    z-index: 2;
}

.login-top {
    width: 60px;
    height: 59px;
    position: absolute;
    right: 20px;
    top: 15px;
    z-index: 12;
}

.login-top span {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0;
    z-index: 1;
}

.login-top span.active {
    opacity: 1;
    z-index: 12;
    cursor: pointer;
}

.login-s {
    width: 100%;
    position: relative;
}

.login-slide {
    width: 100%;
    display: none;
}

.login-slide.active {
    display: block;
}

.login-wx {
    width: 100%;
    margin-top: 60px;
    padding-bottom: 90px;
}

.login-wx1 {
    width: 61%;
    margin: 0px auto;
    overflow: hidden;
    position: relative;
}

.login-wx1 samp,
.login-wx1 samp img {
    width: 100%;
    height: auto;
    display: block;
}

.login-wx1 span {
    width: 73.8%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.login-wx1 span img {
    width: 100%;
    height: auto;
}

.login-wx1 p {
    width: 73.8%;
    height: 73.8%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 15;
    background: rgba(255, 255, 255, 0.95);
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.login-wx1 .cir {
    width: 32px;
    height: 32px;
    margin: 0px auto;
    background: url("../img/icon-85.png") no-repeat center;
    background-size: 100%;
    display: block;
}

.login-wx1 .wz {
    width: 100%;
    text-align: center;
    font-style: normal;
    font-size: 14px;
    color: #7a8799;
    margin-top: 20px;
}

.login-wx2 {
    width: 100%;
    margin: 0px auto;
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    font-size: 14px;
    color: #7a8799;
    justify-content: center;
    margin-top: 36px;
}

.login-wx2 img {
    margin-right: 10px;
}

.login-wx1 p.active {
    opacity: 1;
    visibility: visible;
}

.login-center h3 {
    width: 100%;
    font-size: max(18px, 1.5rem);
    color: #00405b;
    font-weight: normal;
}

.login-center form {
    width: 100%;
    display: block;
    margin-top: 25px;
}

.login-1 {
    width: 100%;
    overflow: hidden;
    margin-top: 12px;
    border: 1px #dce1e2 solid;
    border-radius: 6px;
    box-sizing: border-box;
    height: 50px;
    line-height: 50px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    position: relative;
}

.login-1 input {
    width: 100%;
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    background: none;
    padding: 0px 20px;
    font-size: 14px;
    color: #7a8799;
}

.login-1 input::placeholder {
    color: "#7a8799" !important;
    opacity: 1;
}

.login-1 input::-webkit-input-placeholder {
    color: "#7a8799" !important;
    opacity: 1;
}

.login-1 input::-ms-input-placeholder {
    color: "#7a8799" !important;
    opacity: 1;
}

.login-1 input::-moz-placeholder {
    color: "#7a8799" !important;
    opacity: 1;
}

.login-1:hover {
    border-color: #00abc8;
}

.login-1 span {
    width: 110px;
    height: 100%;
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 3;
    overflow: hidden;
    display: block;
}

.login-1 span img {
    width: 100%;
    height: 100%;
    cursor: pointer;
    display: block;
}

.login-1 em {
    width: 50px;
    height: 100%;
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 2;
    cursor: pointer;
}

.login-1 em:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: url("../img/icon-81.png") no-repeat center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.login-1 em:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: url("../img/icon-82.png") no-repeat center;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.login-1 em.on:before {
    opacity: 0;
}

.login-1 em.on:after {
    opacity: 1;
}

.login-2 {
    width: 100%;
    overflow: hidden;
    margin-top: 20px;
}

.login-2 span {
    float: left;
    width: 16px;
    height: 16px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    border-radius: 2px;
    margin-top: 3px;
}

.login-2 span:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    box-sizing: border-box;
    border: 1px #d9e0e2 solid;
    z-index: 5;
    border-radius: 2px;
}

.login-2 span:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 6;
    background: url("../img/login-3.jpg") no-repeat;
    background-size: cover;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.login-2 span input {
    opacity: 0;
}

.login-2 span.on:after {
    opacity: 1;
}

.login-2 p {
    float: right;
    width: calc(100% - 16px - 10px);
    line-height: 24px;
    font-size: 14px;
    color: #7a8799;
}

.login-2 p a {
    color: #00abc8;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.login-2 p a:hover {
    color: #00abc8;
    text-decoration: underline;
}

.login-button {
    width: 100%;
    height: 48px;
    line-height: 48px;
    overflow: hidden;
    border-radius: 5px;
    background: -webkit-linear-gradient(left, #7bca7d, #00abc8);
    background: -moz-linear-gradient(left, #7bca7d, #00abc8);
    background: -ms-linear-gradient(left, #7bca7d, #00abc8);
    background: -o-linear-gradient(left, #7bca7d, #00abc8);
    margin-top: 20px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.login-button input {
    width: 100%;
    height: 100%;
    background: none;
    cursor: pointer;
    text-align: center;
    font-size: 18px;
    color: #fff;
}

.login-button:hover {
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
    transform: translateY(5px);
}

.login-3 {
    width: 100%;
    overflow: hidden;
    margin-top: 20px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    font-size: 14px;
    color: #7a8799;
}

.login-3 a,
.login-3 p {
    color: #00abc8;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    cursor: pointer;
}

.login-3 a:hover,
.login-3 p:hover {
    color: #00abc8;
    text-decoration: underline;
}

.login-back {
    width: 100%;
    box-sizing: border-box;
    font-size: max(18px, 1.5rem);
    color: #00405b;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    cursor: pointer;
}

.login-back a {
    color: #00405b;
    padding-left: 28px;
    background: url("../img/icon-75.png") no-repeat left center;
}

.login-pannel {
    width: 100%;
    display: none;
}

.login-pannel.active {
    display: block;
}

.login-pannel form {
    display: none;
}

.login-pannel form.active {
    display: block;
}

.login-pannel ul {
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-top: 30px;
}

.login-pannel ul:before {
    width: 100%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #dee2e3;
}

.login-pannel ul li {
    float: left;
    width: auto;
    margin-right: 60px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    position: relative;
    padding-bottom: 18px;
    font-size: 14px;
    color: #7a8799;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    cursor: pointer;
}

.login-pannel ul li:before {
    width: 0%;
    height: 2px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: -webkit-linear-gradient(left, #79c97e, #00abc8);
    background: -moz-linear-gradient(left, #79c97e, #00abc8);
    background: -ms-linear-gradient(left, #79c97e, #00abc8);
    background: -o-linear-gradient(left, #79c97e, #00abc8);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.login-pannel ul li img {
    margin-right: 10px;
    opacity: 0.4;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.login-pannel ul li.active {
    color: #00405b;
}

.login-pannel ul li.active img {
    opacity: 1;
}

.login-pannel ul li.active:before {
    width: 100%;
}

.login-4 {
    width: 100%;
    overflow: hidden;
    margin-top: 30px;
}

.login-4 p {
    width: 100%;
    position: relative;
    text-align: center;
}

.login-4 p:before {
    width: 100%;
    height: 1px;
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0px;
    background: #d9dfe1;
}

.login-4 p span {
    width: auto;
    display: inline-block;
    background: #f8fcfd;
    padding: 0px 30px;
    font-size: 14px;
    color: #7a8799;
    position: relative;
    z-index: 4;
}

.login-4 samp {
    width: 40px;
    height: 40px;
    border: 1px #e6e9eb solid;
    position: relative;
    border-radius: 50%;
    display: block;
    margin: 20px auto 0px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    overflow: hidden;
    cursor: pointer;
}

.login-4 samp:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: -webkit-linear-gradient(left, #7bca7d, #00abc8);
    background: -moz-linear-gradient(left, #7bca7d, #00abc8);
    background: -ms-linear-gradient(left, #7bca7d, #00abc8);
    background: -o-linear-gradient(left, #7bca7d, #00abc8);
    z-index: 1;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.login-4 samp img {
    width: auto;
    height: auto;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    display: block;
}

.login-4 samp img:last-child {
    opacity: 0;
}

.login-4 samp:hover:before {
    opacity: 1;
}

.login-4 samp:hover img {
    opacity: 0;
}

.login-4 samp:hover img:last-child {
    opacity: 1;
}

.login-5 {
    width: 100%;
    overflow: hidden;
    margin-top: 5px;
}

.login-5 span {
    float: left;
    width: 16px;
    height: 16px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    border-radius: 2px;
    margin-top: 3px;
}

.login-5 span:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    box-sizing: border-box;
    border: 1px #d9e0e2 solid;
    z-index: 5;
    border-radius: 2px;
}

.login-5 span:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 6;
    background: url("../img/login-3.jpg") no-repeat;
    background-size: cover;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    opacity: 0;
}

.login-5 span input {
    opacity: 0;
}

.login-5 span.on:after {
    opacity: 1;
}

.login-5 p {
    float: right;
    width: calc(100% - 16px - 10px);
    line-height: 24px;
    font-size: 14px;
    color: #7a8799;
}

.login-pannel form.active2 {
    display: block;
}

.login-ver {
    width: 108px;
    height: 100%;
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 2;
}

.login-ver:before {
    width: 1px;
    height: 50%;
    content: "";
    position: absolute;
    left: 0px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #d6dce0;
}

.login-ts {
    width: 100%;
    text-align: center;
    font-size: 14px;
    color: #00abc8;
    cursor: pointer;
    display: block;
}

.login-time {
    width: 100%;
    height: 100%;
    text-align: center;
    font-size: 14px;
    color: #00405b;
    opacity: 0.6;
    display: none;
}

.login-time p {
    display: inline;
}

.login-ver.active .login-ts {
    display: none;
}

.login-ver.active .login-time {
    display: block;
}

.reg-2scroll {
    width: 100%;
    overflow: hidden;
    margin-top: 20px;
    position: relative;
    height: 50px;
    background: #d8f0f6;
    border-radius: 5px;
}

.reg-2scroll p {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
    user-select: none;
    font-size: 13px;
    color: #828993;
}

.reg-2scroll .slider1,
.reg-2scroll .slider2 {
    width: 50px;
    height: 100%;
    cursor: pointer;
    position: absolute;
    left: 0px;
    top: 0px;
    user-select: none;
    z-index: 6;
    text-align: center;
    color: #fff;
    line-height: 50px;
    background: -webkit-linear-gradient(left, #79c97f, #10b0cb);
    background: -moz-linear-gradient(left, #79c97f, #10b0cb);
    background: -ms-linear-gradient(left, #79c97f, #10b0cb);
    background: -o-linear-gradient(left, #79c97f, #10b0cb);
}

.reg-2scroll .slider1:before,
.reg-2scroll .slider2:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../img/icon-20231218-26.png") no-repeat center;
}

.reg-2scroll .slider_back1,
.reg-2scroll .slider_back2 {
    height: 100%;
    width: 0;
    background-color: #7fd5e3;
    position: absolute;
    top: 0px;
}

.footer-login {
    width: 100%;
    position: fixed;
    left: 0px;
    bottom: 30px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #fff;
    z-index: 4;
}

.footer-login a {
    color: #fff;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.footer-login a:hover {
    color: #00abc8;
}

.footer-login span {
    margin: 0px 20px;
}

.footer-login img {
    margin-right: 4px;
}

/*zhengshu*/
.cert {
    width: 100%;
    height: calc(100vh - 80px);
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    align-content: center;
    margin-top: -60px;
    box-sizing: border-box;
}

.cert h1 {
    width: 100%;
    text-align: center;
    font-size: 2.25rem;
    color: #00405b;
    font-weight: normal;
}

.cert img {
    width: auto;
    height: auto;
    max-width: 80%;
    max-height: 70%;
    box-shadow: 0px 40px 12px 5px rgba(0, 0, 0, 0.15);
    margin-top: 40px;
}

/*all-prop*/
.app-prop {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0px;
    top: 0px;
    background: rgba(0, 0, 0, 0.3);
    z-index: 10000;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.app-prop.active {
    opacity: 1;
    visibility: visible;
}

.app-center {
    width: 80%;
    max-width: max(400px, 33.75rem);
    border-radius: 10px;
    background-color: #fff;
    overflow: hidden;
    position: absolute;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    padding: 40px;
    text-align: center;
}

.app-close {
    width: 24px;
    height: 24px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("../images/close-4.png");
    position: absolute;
    top: 1.25rem;
    right: 1.25rem;
    cursor: pointer;
}

.app-center h3 {
    font-size: max(18px, 1.5rem);
    color: #00405b;
    font-weight: normal;
}

.app-info {
    font-size: max(14px, 1rem);
    color: #00405b;
    margin-top: 1rem;
    text-align: left;
    line-height: 24px;
}

.app-link {
    width: 160px;
    height: 50px;
    line-height: 50px;
    margin: 3.125rem auto 0px;
    overflow: hidden;
    border-radius: 4px;
    background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
    background: -moz-linear-gradient(left, #7cca7d, #00abc8);
    background: -ms-linear-gradient(left, #7cca7d, #00abc8);
    background: -o-linear-gradient(left, #7cca7d, #00abc8);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.app-link a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    font-size: max(14px, 1rem);
    color: #fff;
}

.app-link:hover {
    transform: translateY(-10px);
    box-shadow: 0px 0px 12px 5px rgba(0, 171, 200, 0.2);
}

@media screen and (max-width: 1660px) {

    /*news*/
    .news {
        padding: 8.75rem 0px 5.625rem;
    }

    .news-list {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 20px;
        margin-top: 30px;
    }

    .news-item a {
        padding: 15px 15px 0px;
    }

    .news-cont span {
        min-height: 52px;
    }

    .news-cont p {
        margin-top: 20px;
        min-height: 66px;
    }

    .news-more {
        height: 50px;
        line-height: 50px;
        margin-top: 20px;
    }

    .news-page {
        margin-top: 54px;
    }

    .news-page ul li {
        width: 30px;
        height: 30px;
        line-height: 30px;
    }

    /*detail*/
    .detail-1 {
        padding: 150px 0px 90px;
    }

    .detail-1 h1 {
        border-bottom: 3px #ced6de solid;
    }

    .detail-body p {
        margin: 30px 0px;
    }

    .detail-body hr {
        margin-block: 3rem;
    }

    .detail-page {
        border-top: 3px #00314e solid;
    }

    .detail-2 h3 {
        padding-bottom: 25px;
    }

    .detail-2center {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 20px;
    }

    .detail-share {
        right: calc((100% - 82.5rem) / 2);
        top: 200px;
        margin-right: -70px;
    }

    .share-title {
        font-size: 14px;
        padding: 0px 24px;
    }

    .share-title:before {
        width: 18px;
    }

    .share-title:after {
        width: 18px;
    }

    .detail-share ul li {
        margin-top: 14px;
    }

    .detail-share ul li p {
        width: 120px;
        padding: 5px;
        top: 40px;
    }

    /*renzheng*/
    .rz-1 h3 {
        padding-bottom: 25px;
    }

    .rz-1content {
        margin-top: 36px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 26px;
    }

    .rz-1more {
        height: 52px;
        line-height: 52px;
    }

    .rz-3 h3 {
        padding-bottom: 25px;
    }

    .rz-3content {
        margin-top: 35px;
    }

    .rz-4 h3 {
        padding-bottom: 25px;
    }

    .rz-4content {
        margin-top: 50px;
    }

    .rz-5 {
        height: 250px;
    }

    .rz-5more {
        margin-top: 30px;
    }

    /*rz-chanpin*/
    .rzc-1 h3 {
        padding-bottom: 25px;
    }

    .rzc-1info {
        margin: 20px auto 0px;
    }

    .rzc-1content {
        margin: 20px auto 0px;
    }

    .rzc-1center {
        padding: 36px 50px 36px 100px;
    }

    .rzc-1item samp img {
        max-width: 90%;
    }

    .rzc-1item ul li {
        height: 46px;
        line-height: 46px;
    }

    .rzc-3right h3,
    .rzc-4 h3,
    .rzz-1 h3,
    .rzz-2 h3,
    .rzj-2 h3,
    .rzj-3 h3,
    .rzj-5 h3,
    .rzj-6 h3,
    .yx-1left h3,
    .yx-2head h3,
    .yx-3 h3 {
        padding-bottom: 25px;
    }

    .rzc-3info {
        margin-top: 24px;
    }

    .rzc-4content {
        margin-top: 35px;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-gap: 20px;
    }

    .rzc-4cont p {
        margin-top: 14px;
    }

    /*renzheng-zhiye*/
    .rzz-1info {
        margin-top: 24px;
    }

    .rzz-1content {
        margin-top: 50px;
    }

    .rzz-1more {
        height: 50px;
        line-height: 50px;
    }

    .rzz-2info {
        margin-top: 24px;
    }

    /*renzheng-jiaoyu*/
    .rzj-2content {
        margin-top: 35px;
    }

    .rzj-2right h4 {
        padding-left: 18px;
    }

    .rzj-2right ul {
        margin-top: 10px;
    }

    .rzj-2right ul li:before {
        width: 6px;
        height: 6px;
    }

    .rzj-2icon {
        width: 80px;
        height: 80px;
        right: 18px;
        top: -62px;
        background-size: 100%;
    }

    .rzj-5content {
        margin-top: 45px;
    }

    .rzj-6content {
        margin-top: 35px;
    }

    .rzj-6item p {
        line-height: 25px;
    }

    .rzj-6more {
        margin-top: 35px;
    }

    /*rencai*/
    .rc-form .txt {
        padding: 0px 140px 0px 60px;
        font-size: 15px;
        background-position: 30px center;
    }

    .rc-form .bt {
        width: 130px;
        font-size: 16px;
    }

    .rc-body {
        padding: 140px 0px 90px;
        position: relative;
    }

    .rc-2 {
        font-size: 17px;
        margin-top: 25px;
    }

    .rc-left ul li {
        margin-top: 22px;
    }

    .rc-left ul li span {
        margin-left: 10px;
    }

    .rc-3 {
        padding-bottom: 35px;
    }

    .rc-4item ul {
        margin-top: 18px;
    }

    .rc-4item ul li {
        padding: 0px 18px;
    }

    .rc-right .news-page ul li {
        width: 36px;
        height: 36px;
        line-height: 36px;
    }

    /*rencai-info*/
    .rc-info {
        padding: 60px 0px 90px;
    }

    .rc-back a {
        font-size: 15px;
    }

    .rc-bodys {
        margin-top: 35px;
        padding: 35px;
    }

    .rc-head {
        padding-bottom: 35px;
    }

    .rc-model {
        margin-top: 12px;
    }

    .rc-model span {
        height: 30px;
        line-height: 30px;
        padding: 0px 17px;
        font-size: 15px;
        margin-right: 5px;
        margin-top: 9px;
    }

    .rc-model p {
        line-height: 30px;
        margin-right: 35px;
        margin-top: 9px;
    }

    .rc-pannel {
        padding: 35px 0px;
    }

    .rc-content {
        margin-top: 9px;
    }

    .rc-content p {
        margin-top: 9px;
    }

    .rc-shenqing {
        height: 50px;
        line-height: 50px;
        font-size: 17px;
    }

    .rc-5 p {
        height: 50px;
        line-height: 50px;
    }

    .rc-5 p span em {
        font-size: 16px;
        margin-left: 16px;
    }

    .rc-5 samp {
        height: 50px;
        line-height: 50px;
    }

    .rc-5 samp input {
        padding: 0px 16px;
        font-size: 16px;
    }

    .rc-6cont span {
        font-size: 16px;
        margin-top: 15px;
    }

    .rc-8 samp {
        height: 50px;
        line-height: 50px;
    }

    .rc-8 samp input,
    .rc-8 samp select {
        padding: 0px 16px;
        font-size: 16px;
    }

    .rc-button {
        height: 50px;
        line-height: 50px;
        margin-top: 35px;
    }

    .rc-button input {
        font-size: 16px;
    }

    /*yuanxiao*/
    .st-1head p {
        margin-top: 25px;
    }

    .st-2 {
        margin-top: 60px;
    }

    .st-2content {
        margin-top: 35px;
    }

    .st-2head samp {
        width: 45px;
    }

    .st-2head span {
        width: calc(100% - 45px - 28px - 90px);
        margin-left: 18px;
        line-height: 25px;
        min-height: 50px;
        margin-top: 9px;
    }

    .st-2head p {
        width: 90px;
    }

    .st-2info {
        padding-left: 60px;
        margin-top: 30px;
    }

    .st-2more {
        margin-top: 50px;
    }

    .st-3 {
        margin-top: 20px;
    }

    .st-3content {
        margin-top: 35px;
        height: 440px;
    }

    .st-3info {
        ine-height: 27px;
    }

    .st-3more span {
        width: 130px;
        height: 40px;
        line-height: 40px;
    }

    .st-3more em {
        width: 130px;
        height: 40px;
        line-height: 40px;
        margin-left: 9px;
    }

    .st-3right ul li {
        line-height: 25px;
        font-size: 15px;
    }

    .st-3right .mCSB_inside>.mCSB_container {
        padding-right: 20px;
    }

    .st-content {
        padding: 6.875rem 0px 7.5rem;
    }

    .st-4 {
        margin-top: 30px;
    }

    .st-4 .swiper-button-prev {
        width: 54px;
        height: 54px;
    }

    .st-4 .swiper-button-next {
        width: 54px;
        height: 54px;
    }

    .st-5 {
        margin-top: 45px;
    }

    .st-5center span {
        padding-bottom: 5px;
        margin-right: 25px;
    }

    .st-5center span em {
        height: 44px;
        line-height: 44px;
        padding: 0px 22px;
        font-size: 15px;
    }

    .st-6content {
        margin-top: 35px;
    }

    .st-6pic {
        height: 80px;
    }

    .st-6info {
        margin-top: 20px;
    }

    .st-6more {
        margin-top: 25px;
    }

    /*yuanxiao-gongtongti*/
    .yx-add .swiper {
        margin-top: -55px;
    }

    .yx-add .swiper-slide a {
        padding: 35px;
    }

    .yx-add3 {
        width: calc(100% - 251px - 35px);
    }

    .yx-add3 p {
        line-height: 24px;
        margin-top: 8px;
    }

    .yx-add3 em {
        margin-top: 18px;
    }

    .yx-add1 {
        width: 60%;
        left: 326px;
        bottom: 30px;
    }

    .yx-1content {
        line-height: 28px;
    }

    .yx-1content p {
        margin-top: 25px;
    }

    .yx-1pic {
        margin-top: 100px;
    }

    .yx-1right ul li {
        margin-top: 60px;
    }

    .yx-1right ul li samp {
        margin-top: 13px;
    }

    .yx-1model {
        margin-left: 16px;
    }

    .yx-1model p {
        line-height: 25px;
    }

    .yx-2 {
        padding: 6.875rem 0px 7.5rem;
    }

    .yx-2info {
        line-height: 28px;
        font-size: 15px;
        margin-top: 22px;
    }

    .yx-2 ul {
        margin-top: 46px;
    }

    .yx-2 ul li {
        padding-bottom: 5px;
        margin-right: 22px;
    }

    .yx-2 ul li span {
        height: 46px;
        line-height: 46px;
        font-size: 15px;
        padding: 0px 18px;
    }

    .yx-2content {
        margin-top: 35px;
    }

    .yx-21 {
        padding: 18px;
    }

    .yx-21info {
        font-size: 15px;
        line-height: 28px;
    }

    .yx-21model {
        margin-top: 12px;
    }

    .yx-21item span {
        width: 110px;
        height: 32px;
        line-height: 32px;
        font-size: 15px;
        margin-top: 8px;
    }

    .yx-21item p {
        width: calc(100% - 110px);
    }

    .yx-21item p em {
        height: 32px;
        line-height: 32px;
        margin-top: 8px;
        margin-right: 8px;
        padding: 0px 18px;
    }

    .yx-22model {
        margin-top: 16px;
    }

    .yx-22item {
        height: 38px;
        line-height: 38px;
        margin-right: 12px;
        font-size: 15px;
        padding: 0px 18px;
        margin-top: 8px;
    }

    .yx-3 {
        padding: 6.875rem 0px 7.5rem;
    }

    .yx-3more {
        margin: 35px auto 0px;
    }

    /*peiyangxiangmu*/
    .xm-1 {
        padding: 130px 0px 80px;
    }

    .xm-1content {
        margin-top: 70px;
    }

    .xm-2left {
        padding: 35px;
    }

    .xm-2info p {
        margin: 30px 0px;
    }

    .xm-2info p:first-child {
        margin-top: 18px;
    }

    .xm-2content {
        margin-top: 28px;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 22px;
    }

    .xm-2cont p {
        margin-top: 8px;
    }

    .xm-2pannel {
        margin-top: 28px;
    }

    .xm-2pannel a samp {
        height: 44px;
    }

    .xm-2pannel a span {
        margin-top: 15px;
    }

    .xm-2pannel .swiper-pagination {
        right: 2.2rem;
        bottom: 2.2rem;
    }

    /*yuanxiao-case-info*/
    .case-body {
        margin-top: 35px;
    }

    .case-2model {
        top: 45px;
    }

    .case-2head span img {
        max-width: 150px;
    }

    .case-2right ul {
        margin-top: 15px;
    }

    .case-2right ul li {
        font-size: 15px;
        margin-top: 12px;
    }

    .case-3 {
        margin-top: 50px;
    }

    .case-3 h4 {
        padding-bottom: 18px;
    }

    .case-3content {
        line-height: 27px;
    }

    .case-3content p {
        margin-top: 22px;
    }

    .case-right ul {
        margin-top: 18px;
    }

    /*yuanxiao-jiaocai*/
    .jc {
        padding: 140px 0px 110px;
    }

    .jc-1item {
        margin-top: 25px;
    }

    /*弹窗*/
    /*yuanxiao-产品方案*/
    .cf {
        padding: 140px 0px 110px;
    }

    .cf-1head h1 {
        font-size: max(18px, 2rem);
    }

    .cf-1info {
        margin-top: 25px;
        line-height: 29px;
    }

    .cf-1content {
        margin-top: 30px;
    }

    .cf-3 h3 {
        font-size: max(18px, 1.625rem);
    }

    .cf-3 p {
        margin-top: 12px;
    }

    .cf-right form {
        margin-top: 30px;
    }

    .cf-4 {
        height: 44px;
        line-height: 44px;
        margin-top: 12px;
    }

    .cf-4 input {
        padding: 0px 18px;
        font-size: 15px;
    }

    .cf-4 select {
        padding: 0px 18px;
        font-size: 15px;
    }

    .cf-5 {
        margin-top: 12px;
    }

    .cf-5 textarea {
        padding: 18px;
        font-size: 15px;
    }

    .cf-6 {
        margin-top: 10px;
    }

    .cf-6 p {
        font-size: 15px;
    }

    .cf-6 ul li {
        margin-top: 15px;
    }

    .cf-7 {
        margin-top: 20px;
    }

    .cf-8 {
        height: 48px;
        line-height: 48px;
        margin-top: 18px;
    }

    .cf-8 input {
        font-size: 15px;
    }

    /*yuanxiao-xuni*/
    .xn-1 {
        padding: 130px 0px 80px;
    }

    .xn-1tu {
        border: 9px #fff solid;
    }

    .xn-2info {
        margin-bottom: 55px;
    }

    .xn-2info p {
        margin: 30px 0px;
    }

    .xn-2info p:first-child {
        margin-top: 18px;
    }

    .xn-2des {
        margin: 26px 0px 50px;
        padding-bottom: 55px;
    }

    .xn-2content p {
        margin-top: 25px;
    }

    .xn-3 {
        margin: 26px 0px 50px;
        padding-bottom: 55px;
    }

    .xn-3model samp {
        height: 23px;
    }

    .xn-3model span {
        line-height: 25px;
        margin-top: 30px;
    }

    .xn-3item:hover .xn-3model span {
        margin-top: 18px;
    }

    .xn-3model p {
        margin-top: 26px;
    }

    .xn-4 {
        margin: 26px 0px 50px;
    }

    .xn-item span {
        margin-top: 12px;
    }

    .xn-4button {
        margin-top: 25px;
    }

    .xn-4button .swiper-pagination {
        margin: 0px 36px;
    }

    .xn-4button .swiper-pagination span {
        margin: 0px 5px;
    }

    .xn-5pannel {
        margin-top: 15px;
    }

    /*yuanxiao-qyinfo*/
    .qy-1model span img {
        max-height: 35px;
    }

    .qy-1model h1 {
        margin-top: 18px;
    }

    .qy-2 {
        margin-top: 50px;
    }

    .qy-3 {
        line-height: 27px;
    }

    .qy-3 p {
        margin: 25px 0px;
    }

    .qy-4 {
        margin-top: 28px;
    }

    .qy-4item {
        margin-top: 8px;
    }

    .qy-4item span {
        font-size: 26px;
    }

    .qy-4item p {
        line-height: 30px;
        margin-top: 0px;
    }

    .qy-5 {
        margin-top: 22px;
    }

    .qy-5item {
        margin-top: 12px;
    }

    .qy-5item samp {
        width: 50px;
    }

    .qy-5right {
        width: calc(100% - 50px - 20px);
    }

    .qy-5right span {
        font-size: 17px;
    }

    .qy-5right p {
        font-size: 15px;
        line-height: 27px;
    }

    /*login*/
    .login-center form {
        margin-top: 20px;
    }

    .login-1 {
        margin-top: 10px;
        height: 48px;
        line-height: 48px;
    }

    .login-1 input {
        padding: 0px 18px;
    }

    .login-2 {
        margin-top: 18px;
    }

    .login-button {
        height: 46px;
        line-height: 46px;
        margin-top: 18px;
    }

    .login-button input {
        font-size: 17px;
    }

    .login-3 {
        margin-top: 18px;
    }

    .login-pannel ul {
        margin-top: 28px;
    }

    .login-pannel ul li {
        margin-right: 55px;
        padding-bottom: 16px;
    }

    .login-4 {
        margin-top: 28px;
    }

    .login-4 p span {
        padding: 0px 28px;
    }

    .login-4 samp {
        margin: 18px auto 0px;
    }

    .reg-2scroll {
        margin-top: 18px;
        height: 48px;
    }

    .reg-2scroll .slider1,
    .reg-2scroll .slider2 {
        line-height: 48px;
    }

    .footer-login span {
        margin: 0px 18px;
    }

    /*zhengshu*/
    .cert img {
        box-shadow: 0px 35px 12px 5px rgba(0, 0, 0, 0.15);
    }

    /*all-prop*/
}

@media screen and (max-width: 1440px) {

    /*news*/
    .news h3 {
        font-size: max(20px, 2.25rem);
    }

    .news-list {
        margin-top: 26px;
    }

    .news-item a {
        padding: 12px 12px 0px;
    }

    .news-cont span {
        min-height: 52px;
    }

    .news-cont p {
        margin-top: 16px;
        min-height: 66px;
    }

    .news-more {
        height: 44px;
        line-height: 44px;
        margin-top: 15px;
    }

    .news-page {
        margin-top: 50px;
    }

    /*detail*/
    .detail-1 {
        padding: 130px 0px 80px;
    }

    .detail-center {
        width: 80%;
    }

    .detail-1 h1 {
        font-size: max(20px, 2.3rem);
        margin-top: 25px;
        padding-bottom: 40px;
        border-bottom: 2px #ced6de solid;
    }

    .detail-body p {
        margin: 25px 0px;
    }

    .detail-body hr {
        margin-block: 2.5rem;
    }

    .detail-page {
        border-top: 2px #00314e solid;
    }

    .detail-2 h3 {
        padding-bottom: 25px;
    }

    .detail-share {
        right: calc((100% - 82.5rem) / 2);
        top: 200px;
        margin-right: -110px;
    }

    /*renzheng*/
    .rz-1 h3 {
        padding-bottom: 25px;
    }

    .rz-1content {
        margin-top: 30px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 20px;
    }

    .rz-1pannel {
        padding: 2.2rem;
    }

    .rz-1more {
        height: 52px;
        line-height: 52px;
    }

    .rz-1cont span::before {
        top: 1px;
        transform: translateY(0px);
    }

    .rz-3 h3 {
        padding-bottom: 25px;
    }

    .rz-3content {
        margin-top: 30px;
    }

    .rz-3right {
        width: calc(100% - 140px);
    }

    .rz-4 h3 {
        padding-bottom: 25px;
    }

    .rz-4content {
        margin-top: 45px;
    }

    .rz-5more {
        margin-top: 25px;
    }

    /*rz-chanpin*/
    .rzc-1 h3 {
        padding-bottom: 25px;
    }

    .rzc-1center {
        padding: 32px 45px;
    }

    .rzc-1item samp {
        width: 90px;
    }

    .rzc-1item samp img {
        max-width: 92%;
    }

    .rzc-1item ul li {
        height: 42px;
        line-height: 42px;
    }

    .rzc-3info {
        margin-top: 22px;
    }

    .rzc-4content {
        margin-top: 30px;
    }

    .rzc-4cont p {
        margin-top: 12px;
    }

    /*renzheng-zhiye*/
    .rzz-1info {
        margin-top: 20px;
    }

    .rzz-1content {
        margin-top: 40px;
    }

    .rzz-1more {
        height: 44px;
        line-height: 44px;
    }

    .rzz-2info {
        margin-top: 20px;
    }

    /*renzheng-jiaoyu*/
    .rzj-2content {
        margin-top: 30px;
    }

    .rzj-2right ul li:before {
        top: 10px;
    }

    .rzj-2icon {
        width: 70px;
        height: 70px;
        top: -52px;
    }

    .rzj-3item samp {
        height: 4rem;
    }

    .rzj-5content {
        margin-top: 45px;
    }

    .rzj-6content {
        margin-top: 30px;
    }

    .rzj-6item p {
        line-height: 24px;
    }

    .rzj-6more {
        margin-top: 30px;
    }

    /*rencai*/
    .rc-form .txt {
        padding: 0px 140px 0px 60px;
        background-position: 30px center;
    }

    .rc-body {
        padding: 120px 0px 80px;
        position: relative;
    }

    .rc-3 {
        padding-bottom: 30px;
    }

    .rc-4item ul {
        margin-top: 16px;
    }

    .rc-4item ul li {
        padding: 0px 16px;
    }

    /*rencai-info*/
    .rc-info {
        padding: 60px 0px 80px;
    }

    .rc-center {
        width: 80%;
    }

    .rc-bodys {
        margin-top: 30px;
        padding: 30px;
    }

    .rc-head {
        padding-bottom: 30px;
    }

    .rc-model p {
        margin-right: 30px;
    }

    .rc-pannel {
        padding: 30px 0px;
    }

    .rc-content {
        margin-top: 8px;
    }

    .rc-content p {
        margin-top: 8px;
    }

    .rc-button {
        margin-top: 30px;
    }

    /*yuanxiao*/
    .st-1head p {
        margin-top: 20px;
    }

    .st-2content {
        margin-top: 30px;
    }

    .st-2head samp {
        width: 40px;
    }

    .st-2head span {
        width: calc(100% - 40px - 28px - 80px);
        line-height: 24px;
        min-height: 48px;
        margin-top: 8px;
    }

    .st-2head p {
        width: 80px;
        height: 28px;
        line-height: 28px;
    }

    .st-2info {
        margin-top: 25px;
    }

    .st-2more {
        margin-top: 40px;
    }

    .st-3content {
        margin-top: 30px;
        height: 420px;
    }

    .st-3info {
        line-height: 26px;
    }

    .st-3more em {
        margin-left: 8px;
    }

    .st-3right ul li {
        line-height: 24px;
        font-size: 14px;
    }

    .st-content {
        padding: 6.875rem 0px 7.5rem;
    }

    .st-4 .swiper-button-prev {
        width: 54px;
        height: 54px;
    }

    .st-4 .swiper-button-next {
        width: 54px;
        height: 54px;
    }

    .st-5 {
        margin-top: 40px;
    }

    .st-5center span {
        margin-right: 20px;
    }

    .st-5center span em {
        height: 42px;
        line-height: 42px;
        padding: 0px 20px;
        font-size: 14px;
    }

    .st-6content {
        margin-top: 30px;
    }

    .st-6pic {
        height: 70px;
    }

    .st-6info {
        margin-top: 18px;
    }

    .st-6more {
        margin-top: 20px;
    }

    /*yuanxiao-gongtongti*/
    .yx-add .swiper-slide a {
        padding: 30px;
    }

    .yx-add3 {
        width: calc(100% - 251px - 30px);
    }

    .yx-add3 span {
        font-size: 16px;
    }

    .yx-add3 p {
        font-size: 14px;
        margin-top: 7px;
    }

    .yx-add3 em {
        margin-top: 16px;
    }

    .yx-add1 {
        left: 321px;
        bottom: 25px;
    }

    .yx-1content {
        font-size: 15px;
        line-height: 27px;
    }

    .yx-1content p {
        margin-top: 20px;
    }

    .yx-1pic {
        margin-top: 90px;
    }

    .yx-1right ul li {
        margin-top: 50px;
    }

    .yx-1right ul li samp {
        margin-top: 10px;
    }

    .yx-1model {
        margin-left: 15px;
    }

    .yx-1model p {
        line-height: 24px;
    }

    .yx-2 {
        padding: 6.875rem 0px 7.5rem;
    }

    .yx-2info {
        line-height: 27px;
        margin-top: 20px;
    }

    .yx-2 ul {
        margin-top: 40px;
    }

    .yx-2 ul li {
        margin-right: 20px;
    }

    .yx-2 ul li span {
        height: 44px;
        line-height: 44px;
        padding: 0px 16px;
    }

    .yx-2content {
        margin-top: 30px;
    }

    .yx-21 {
        padding: 16px;
    }

    .yx-21info {
        line-height: 27px;
    }

    .yx-21model {
        margin-top: 10px;
    }

    .yx-21item span {
        height: 30px;
        line-height: 30px;
        font-size: 14px;
        margin-top: 7px;
    }

    .yx-21item p em {
        height: 30px;
        line-height: 30px;
        margin-top: 7px;
        margin-right: 7px;
        padding: 0px 17px;
    }

    .yx-22model {
        margin-top: 15px;
    }

    .yx-22item {
        height: 36px;
        line-height: 36px;
        margin-right: 10px;
        padding: 0px 18px;
        margin-top: 7px;
    }

    .yx-3 {
        padding: 6.875rem 0px 7.5rem;
    }

    .yx-3more {
        margin: 35px auto 0px;
    }

    /*peiyangxiangmu*/
    .xm-1 {
        padding: 120px 0px 70px;
    }

    .xm-1content {
        margin-top: 60px;
    }

    .xm-2left {
        padding: 30px;
    }

    .xm-2info p {
        margin: 25px 0px;
    }

    .xm-2info p:first-child {
        margin-top: 16px;
    }

    .xm-2content {
        margin-top: 28px;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 20px;
    }

    .xm-2cont p {
        margin-top: 7px;
    }

    .xm-2pannel {
        margin-top: 25px;
    }

    .xm-2pannel a samp {
        height: 40px;
    }

    .xm-2pannel a span {
        margin-top: 14px;
    }

    /*yuanxiao-case-info*/
    .case-body {
        margin-top: 30px;
    }

    .case-2left {
        width: 300px;
    }

    .case-2model {
        top: 40px;
    }

    .case-2right {
        width: calc(100% - 300px);
    }

    .case-2head span img {
        max-width: 140px;
    }

    .case-2right ul {
        margin-top: 14px;
    }

    .case-2right ul li {
        font-size: 14px;
        margin-top: 10px;
    }

    .case-3 {
        margin-top: 40px;
    }

    .case-3 h4 {
        padding-bottom: 16px;
    }

    .case-3content {
        line-height: 26px;
    }

    .case-3content p {
        margin-top: 20px;
    }

    .case-right ul {
        margin-top: 15px;
    }

    /*yuanxiao-jiaocai*/
    .jc {
        padding: 120px 0px 100px;
    }

    .jc-1item {
        margin-top: 20px;
    }

    /*弹窗*/
    .prop-center {
        height: 80vh;
        overflow-y: auto;
    }

    /*yuanxiao-产品方案*/
    .cf {
        padding: 120px 0px 100px;
    }

    .cf-1info {
        margin-top: 20px;
        padding: 2.4rem;
        line-height: 28px;
    }

    .cf-1content {
        margin-top: 25px;
    }

    .cf-3 p {
        margin-top: 10px;
    }

    .cf-right form {
        margin-top: 30px;
    }

    .cf-4 {
        height: 42px;
        line-height: 42px;
        margin-top: 10px;
    }

    .cf-4 input {
        padding: 0px 15px;
        font-size: 14px;
    }

    .cf-4 select {
        padding: 0px 15px;
        font-size: 14px;
    }

    .cf-5 {
        margin-top: 10px;
    }

    .cf-5 textarea {
        padding: 15px;
        font-size: 14px;
    }

    .cf-6 p {
        font-size: 14px;
    }

    .cf-6 ul li {
        margin-top: 12px;
    }

    .cf-7 {
        margin-top: 15px;
    }

    .cf-8 {
        height: 46px;
        line-height: 46px;
        margin-top: 15px;
    }

    .cf-8 input {
        font-size: 14px;
    }

    /*yuanxiao-xuni*/
    .xn-1 {
        padding: 110px 0px 70px;
    }

    .xn-1tu {
        border: 8px #fff solid;
    }

    .xn-2info {
        margin-bottom: 50px;
    }

    .xn-2info p {
        margin: 25px 0px;
    }

    .xn-2info p:first-child {
        margin-top: 15px;
    }

    .xn-2des {
        margin: 24px 0px 45px;
        padding-bottom: 50px;
    }

    .xn-2content p {
        margin-top: 20px;
    }

    .xn-3 {
        margin: 24px 0px 45px;
        padding-bottom: 50px;
    }

    .xn-3model samp {
        height: 20px;
    }

    .xn-3model span {
        line-height: 24px;
        margin-top: 25px;
    }

    .xn-3item:hover .xn-3model span {
        margin-top: 15px;
    }

    .xn-3model p {
        margin-top: 22px;
    }

    .xn-4 {
        margin: 24px 0px 45px;
    }

    .xn-item span {
        margin-top: 8px;
    }

    .xn-4button {
        margin-top: 20px;
    }

    .xn-4button .swiper-pagination span {
        margin: 0px 5px;
    }

    .xn-5pannel {
        margin-top: 14px;
    }

    /*yuanxiao-qyinfo*/
    .qy-1model span img {
        max-height: 30px;
    }

    .qy-1model h1 {
        margin-top: 16px;
    }

    .qy-2 {
        margin-top: 40px;
    }

    .qy-3 {
        line-height: 26px;
    }

    .qy-3 p {
        margin: 22px 0px;
    }

    .qy-4 {
        margin-top: 20px;
    }

    .qy-4item span {
        font-size: 24px;
    }

    .qy-4item p {
        line-height: 28px;
    }

    .qy-5 {
        margin-top: 20px;
    }

    .qy-5item {
        margin-top: 10px;
    }

    .qy-5item samp {
        width: 45px;
    }

    .qy-5right {
        width: calc(100% - 45px - 20px);
    }

    .qy-5right span {
        font-size: 16px;
    }

    .qy-5right p {
        font-size: 14px;
        line-height: 26px;
    }

    /*login*/
    .login-top {
        width: 50px;
        height: 50px;
        right: 15px;
        top: 10px;
    }

    .login-top span img {
        width: 100%;
        height: auto;
    }

    .login-wx {
        margin-top: 50px;
        padding-bottom: 70px;
    }

    .login-wx2 {
        margin-top: 30px;
    }

    .login-1 {
        height: 44px;
        line-height: 44px;
    }

    .login-1 input {
        padding: 0px 15px;
    }

    .login-2 {
        margin-top: 15px;
    }

    .login-button {
        height: 44px;
        line-height: 44px;
        margin-top: 15px;
    }

    .login-button input {
        font-size: 16px;
    }

    .login-3 {
        margin-top: 18px;
    }

    .login-pannel ul {
        margin-top: 24px;
    }

    .login-pannel ul li {
        margin-right: 50px;
        padding-bottom: 15px;
    }

    .login-4 {
        margin-top: 24px;
    }

    .login-4 p span {
        padding: 0px 28px;
    }

    .login-4 samp {
        margin: 15px auto 0px;
    }

    .reg-2scroll {
        margin-top: 15px;
        height: 44px;
    }

    .reg-2scroll .slider1,
    .reg-2scroll .slider2 {
        line-height: 44px;
    }

    .footer-login span {
        margin: 0px 15px;
    }

    /*zhengshu*/
    .cert img {
        box-shadow: 0px 30px 12px 5px rgba(0, 0, 0, 0.15);
    }

    /*all-prop*/
}

@media screen and (max-width: 1280px) {

    /*news*/
    .news {
        padding: 7rem 0px;
    }

    .news h3 {
        font-size: max(20px, 2.25rem);
    }

    .news-list {
        margin-top: 20px;
    }

    .news-item a {
        padding: 12px 12px 0px, 0;
    }

    .news-cont {
        padding: 2rem 1.5rem 0px;
    }

    .news-cont span {
        min-height: 52px;
    }

    .news-cont p {
        margin-top: 12px;
        min-height: 66px;
    }

    .news-page {
        margin-top: 40px;
    }

    /*detail*/
    .detail-1 {
        padding: 100px 0px 70px;
    }

    .detail-center {
        width: 80%;
    }

    .detail-1 h1 {
        padding-bottom: 30px;
    }

    .detail-body p {
        margin: 20px 0px;
    }

    .detail-body hr {
        margin-block: 2.2rem;
    }

    .detail-2 h3 {
        padding-bottom: 25px;
    }

    .detail-share {
        right: calc((100% - 82.5rem) / 2);
        margin-right: -90px;
    }

    .share-title {
        padding: 0px 20px;
    }

    .share-title:before {
        width: 16px;
    }

    .share-title:after {
        width: 16px;
    }

    .detail-share ul li {
        margin-top: 12px;
    }

    .detail-share ul li p {
        width: 70px;
    }

    /*renzheng*/
    .rz-1 h3 {
        padding-bottom: 25px;
    }

    .rz-1content {
        margin-top: 20px;
    }

    .rz-1pannel {
        padding: 2rem;
    }

    .rz-1pannel samp {
        height: 8rem;
    }

    .rz-1cont span em {
        font-size: 14px;
    }

    .rz-1more {
        height: 52px;
        line-height: 52px;
    }

    .rz-1cont span::before {
        top: 1px;
        transform: translateY(0px);
    }

    .rz-3 h3 {
        padding-bottom: 25px;
    }

    .rz-3content {
        margin-top: 20px;
    }

    .rz-3right {
        width: calc(100% - 140px);
    }

    .rz-4 h3 {
        padding-bottom: 25px;
    }

    .rz-4content {
        margin-top: 40px;
    }

    /*rz-chanpin*/
    .rzc-1 h3 {
        padding-bottom: 25px;
    }

    .rzc-1center {
        padding: 30px 35px;
    }

    .rzc-1item samp {
        width: 80px;
    }

    .rzc-1item samp img {
        max-width: 60%;
    }

    .rzc-1item ul li {
        height: 42px;
        line-height: 42px;
    }

    .rzc-3info {
        margin-top: 20px;
    }

    .rzc-4content {
        margin-top: 30px;
    }

    .rzc-4cont {
        padding: 1.875rem;
    }

    /*renzheng-zhiye*/
    .rzz-1content {
        margin-top: 35px;
    }

    .rzz-1more {
        height: 40px;
        line-height: 40px;
    }

    .rzz-2info {
        margin-top: 20px;
    }

    /*renzheng-jiaoyu*/
    .rzj-2content {
        margin-top: 25px;
    }

    .rzj-2right h4 {
        width: 150px;
        height: 32px;
        line-height: 32px;
        padding-left: 15px;
        margin-top: 2.4rem;
    }

    .rzj-2right h4 span {
        font-size: 16px;
    }

    .rzj-2right ul li:before {
        top: 10px;
    }

    .rzj-2icon {
        width: 50px;
        height: 50px;
        top: -38px;
    }

    .rzj-3item samp {
        height: 3rem;
    }

    .rzj-5content {
        margin-top: 30px;
    }

    .rzj-5item span {
        font-size: 1.3rem;
    }

    .rzj-6content {
        margin-top: 20px;
    }

    .rzj-6item p {
        line-height: 23px;
    }

    /*rencai*/
    .rc-form {
        height: 60px;
        line-height: 60px;
    }

    .rc-body {
        padding: 120px 0px 70px;
        margin-top: -60px;
    }

    .rc-3 {
        padding-bottom: 25px;
    }

    .rc-4item ul li {
        padding: 0px 15px;
    }

    /*rencai-info*/
    .rc-info {
        padding: 50px 0px 70px;
    }

    .rc-center {
        width: 80%;
    }

    .rc-bodys {
        margin-top: 25px;
        padding: 25px;
    }

    .rc-head {
        padding-bottom: 25px;
    }

    .rc-model p {
        margin-right: 30px;
    }

    .rc-pannel {
        padding: 25px 0px;
    }

    /*yuanxiao*/
    .st-2content {
        margin-top: 30px;
    }

    .st-2head samp {
        width: 35px;
    }

    .st-2head span {
        width: calc(100% - 35px - 28px - 80px);
        line-height: 23px;
        min-height: 46px;
        margin-top: 7px;
    }

    .st-2info {
        margin-top: 20px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
        overflow: hidden;
    }

    .st-2more {
        margin-top: 30px;
    }

    .st-2content .swiper-button-prev {
        left: 8%;
    }

    .st-2content .swiper-button-next {
        right: 8%;
    }

    .st-3content {
        margin-top: 20px;
    }

    .st-3info {
        line-height: 25px;
    }

    .st-3right ul li {
        line-height: 23px;
    }

    .st-3right ul li a {
        padding: 1.4rem 0px;
        padding-left: 20px;
    }

    .st-3right ul li a:before {
        top: 28px;
    }

    .st-content {
        padding: 6.875rem 0px 7.5rem;
    }

    .st-4 .swiper-button-prev {
        width: 54px;
        height: 54px;
    }

    .st-4 .swiper-button-next {
        width: 54px;
        height: 54px;
    }

    .st-5 {
        margin-top: 35px;
    }

    .st-5center span {
        margin-right: 18px;
    }

    .st-5center span em {
        height: 40px;
        line-height: 40px;
        padding: 0px 18px;
    }

    .st-6content {
        margin-top: 20px;
    }

    .st-6content .swiper {
        padding: 1px;
        box-sizing: border-box;
    }

    .st-6pic {
        height: 60px;
    }

    .st-6info {
        margin-top: 15px;
    }

    /*yuanxiao-gongtongti*/
    .yx-add .swiper {
        margin-top: -45px;
    }

    .yx-add .swiper-slide a {
        padding: 25px;
    }

    .yx-add3 {
        width: calc(100% - 251px - 25px);
    }

    .yx-add3 em {
        margin-top: 15px;
    }

    .yx-add1 {
        left: 316px;
        bottom: 20px;
    }

    .yx-1content {
        font-size: 15px;
        line-height: 26px;
    }

    .yx-1content p {
        margin-top: 18px;
    }

    .yx-1pic {
        margin-top: 80px;
    }

    .yx-1right ul li {
        margin-top: 40px;
    }

    .yx-1right ul li samp {
        margin-top: 8px;
    }

    .yx-1model {
        margin-left: 14px;
    }

    .yx-1model p {
        line-height: 22px;
    }

    .yx-2 {
        padding: 6.875rem 0px 7.5rem;
    }

    .yx-2info {
        line-height: 26px;
    }

    .yx-2 ul {
        margin-top: 30px;
    }

    .yx-2 ul li {
        margin-right: 16px;
    }

    .yx-2 ul li span {
        height: 40px;
        line-height: 40px;
        padding: 0px 15px;
    }

    .yx-2content {
        margin-top: 25px;
    }

    .yx-21 {
        padding: 15px;
    }

    .yx-21info {
        line-height: 26px;
    }

    .yx-21model {
        margin-top: 9px;
    }

    .yx-21item p em {
        padding: 0px 16px;
    }

    .yx-22item {
        height: 32px;
        line-height: 32px;
        margin-right: 9px;
        padding: 0px 16px;
    }

    .yx-3 {
        padding: 6.875rem 0px 7.5rem;
    }

    .yx-3more {
        margin: 30px auto 0px;
    }

    /*peiyangxiangmu*/
    .xm-1 {
        padding: 80px 0px 50px;
    }

    .xm-1content {
        margin-top: 30px;
    }

    .xm-1content h3 {
        font-size: max(20px, 2rem);
    }

    .xm-2 {
        padding: 80px 0px;
    }

    .xm-2left {
        padding: 25px;
    }

    .xm-2info p {
        margin: 20px 0px;
    }

    .xm-2info p:first-child {
        margin-top: 15px;
    }

    .xm-2content {
        margin-top: 25px;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 20px;
    }

    .xm-2pannel {
        margin-top: 20px;
    }

    .xm-2pannel a samp {
        height: 35px;
    }

    .xm-2pannel a span {
        margin-top: 12px;
    }

    /*yuanxiao-case-info*/
    .case {
        padding: 50px 0px;
    }

    .case-body {
        margin-top: 25px;
    }

    .case-2left {
        width: 260px;
    }

    .case-2model {
        top: 35px;
    }

    .case-2right {
        width: calc(100% - 260px);
    }

    .case-2head span img {
        max-width: 120px;
    }

    .case-2right ul {
        margin-top: 14px;
    }

    .case-2right ul li {
        margin-top: 6px;
    }

    .case-3 {
        margin-top: 30px;
    }

    .case-3 h4 {
        padding-bottom: 15px;
    }

    .case-3content {
        line-height: 25px;
    }

    /*yuanxiao-jiaocai*/
    .jc {
        padding: 90px 0px;
    }

    .jc-1item {
        margin-top: 15px;
    }

    /*弹窗*/
    /*yuanxiao-产品方案*/
    .cf {
        padding: 90px 0px;
    }

    .cf-1info {
        padding: 2.4rem;
        line-height: 27px;
    }

    .cf-1content {
        margin-top: 20px;
    }

    .cf-right {
        padding: 3.2rem 2.8125rem 2.3125rem;
    }

    .cf-right form {
        margin-top: 25px;
    }

    .cf-4 {
        height: 40px;
        line-height: 40px;
    }

    .cf-6 ul li {
        margin-top: 10px;
    }

    .cf-7 {
        margin-top: 12px;
    }

    .cf-8 {
        height: 44px;
        line-height: 44px;
        margin-top: 12px;
    }

    /*yuanxiao-xuni*/
    .xn-1 {
        padding: 90px 0px 60px;
    }

    .xn-1tu {
        border: 7px #fff solid;
    }

    .xn-2info {
        margin-bottom: 40px;
    }

    .xn-2info p {
        margin: 20px 0px;
    }

    .xn-2info p:first-child {
        margin-top: 12x;
    }

    .xn-2des {
        margin: 20px 0px 40px;
        padding-bottom: 45px;
    }

    .xn-3 {
        margin: 20px 0px 40px;
        padding-bottom: 45px;
    }

    .xn-3model span {
        line-height: 23px;
        margin-top: 22px;
    }

    .xn-3item:hover .xn-3model span {
        margin-top: 12px;
    }

    .xn-3model p {
        margin-top: 20px;
    }

    .xn-4 {
        margin: 20px 0px 40px;
    }

    .xn-4 .swiper-slide samp {
        height: 9vw;
    }

    .xn-4model span {
        height: 26px;
        line-height: 26px;
        font-size: 14px;
        margin-top: 1.2rem;
    }

    .xn-4model p {
        font-size: max(14px, 1rem);
        margin-top: 1.5rem;
    }

    .xn-5pannel {
        margin-top: 12px;
    }

    /*login*/
    .login-center {
        padding: 20px;
    }

    .login-center form {
        margin-top: 15px;
    }

    .login-wx {
        margin-top: 40px;
        padding-bottom: 20px;
    }

    .login-wx1 {
        width: 52%;
    }

    .login-wx2 {
        margin-top: 25px;
    }

    .login-1 {
        margin-top: 8px;
        height: 36px;
        line-height: 36px;
    }

    .login-2 {
        margin-top: 10px;
    }

    .login-button {
        height: 36px;
        line-height: 36px;
        margin-top: 10px;
    }

    .login-button input {
        font-size: 14px;
    }

    .login-3 {
        margin-top: 12px;
    }

    .login-pannel ul {
        margin-top: 18px;
    }

    .login-pannel ul li {
        margin-right: 40px;
        padding-bottom: 12px;
    }

    .login-4 {
        margin-top: 15px;
    }

    .login-4 p span {
        padding: 0px 24px;
    }

    .login-4 samp {
        margin: 12px auto 0px;
    }

    .reg-2scroll {
        margin-top: 10px;
        height: 36px;
    }

    .reg-2scroll .slider1,
    .reg-2scroll .slider2 {
        line-height: 36px;
    }

    .footer-login {
        bottom: 10px;
    }

    /*zhengshu*/
    .cert img {
        box-shadow: 0px 25px 12px 5px rgba(0, 0, 0, 0.15);
        margin-top: 20px;
    }
}

@media screen and (max-width: 1000px) {

    /*news*/
    .news {
        padding: 7rem 0px 50px;
    }

    .news h3 {
        font-size: max(20px, 2.25rem);
    }

    .news-list {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 15px;
    }

    .news-item a {
        padding: 12px 12px 0px, 0;
    }

    .news-cont {
        padding: 15px 12px 0px;
    }

    .news-cont span {
        font-size: 16px;
        margin-top: 12px;
        min-height: inherit;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        overflow: hidden;
    }

    .news-cont p {
        font-size: 14px;
        margin-top: 10px;
        min-height: 44px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }

    .news-more {
        height: 40px;
        line-height: 40px;
        margin-top: 15px;
        opacity: 1;
    }

    .news-more:before {
        width: 100%;
    }

    .news-page {
        margin-top: 30px;
    }

    .news-page ul li {
        width: 22px;
        height: 22px;
        line-height: 22px;
        margin: 0px 2px;
    }

    /*detail*/
    .detail-1 {
        padding: 80px 0px 50px;
    }

    .detail-center {
        width: 90%;
    }

    .detail-date {
        padding: 3px 0px 3px 28px;
    }

    .detail-1 h1 {
        font-size: max(20px, 2rem);
        margin-top: 20px;
        padding-bottom: 25px;
    }

    .detail-body {
        font-size: 14px;
        line-height: 24px;
    }

    .detail-body p {
        margin: 16px 0px;
    }

    .detail-page {
        margin-top: 25px;
        padding-top: 25px;
    }

    .detail-page span {
        width: 160px;
        height: 42px;
        line-height: 42px;
    }

    .detail-page span a {
        font-size: 16px;
    }

    .detail-2 {
        padding: 50px 0px;
    }

    .detail-2 h3 {
        font-size: max(20px, 2.25rem);
        padding-bottom: 20px;
    }

    .detail-2 h3:before {
        width: 50px;
        height: 3px;
    }

    .detail-2center {
        margin-top: 20px;
    }

    .detail-share {
        display: none;
    }

    /*renzheng*/
    .rz-1 {
        padding: 50px 0px;
    }

    .rz-1 h3 {
        font-size: max(20px, 2.25rem);
        padding-bottom: 20px;
    }

    .rz-1 h3:before {
        width: 50px;
        height: 3px;
    }

    .rz-1pannel {
        padding: 15px;
    }

    .rz-1pannel samp {
        height: 10rem;
        padding: 20px 0px;
    }

    .rz-1head span {
        font-size: 16px;
    }

    .rz-1cont span em {
        font-size: 14px;
    }

    .rz-1cont span::before {
        top: 1px;
        transform: translateY(0px);
    }

    .rz-2 {
        padding-bottom: 50px;
    }

    .rz-3 h3 {
        font-size: max(20px, 2.25rem);
        padding-bottom: 20px;
    }

    .rz-3 h3:before {
        width: 50px;
        height: 3px;
    }

    .rz-3right {
        width: calc(100% - 130px);
    }

    .rz-4 {
        padding-top: 50px;
    }

    .rz-4 h3 {
        font-size: max(20px, 2.25rem);
        padding-bottom: 20px;
    }

    .rz-4 h3:before {
        width: 50px;
        height: 3px;
    }

    .rz-4content {
        margin-top: 30px;
    }

    .rz-5 {
        height: 220px;
        margin-top: 50px;
    }

    .rz-5head span {
        font-size: max(20px, 2.25rem);
    }

    .rz-5more {
        width: 120px;
        height: 40px;
        line-height: 40px;
    }

    /*rz-chanpin*/
    .rzc-1 {
        padding-top: 50px;
    }

    .rzc-1 h3 {
        font-size: max(20px, 2.25rem);
        padding-bottom: 20px;
    }

    .rzc-1 h3:before {
        width: 50px;
        height: 3px;
    }

    .rzc-1info {
        width: 84%;
    }

    .rzc-1content {
        width: 84%;
    }

    .rzc-1center {
        padding: 30px;
    }

    .rzc-1item samp {
        width: 70px;
    }

    .rzc-1item samp img {
        max-width: 60%;
    }

    .rzc-1item ul {
        width: 77%;
    }

    .rzc-1item ul li {
        height: 38px;
        line-height: 38px;
    }

    .rzc-2 {
        padding-bottom: 50px;
    }

    .rzc-3 {
        padding-top: 50px;
    }

    .rzc-3right h3,
    .rzc-4 h3,
    .rzz-1 h3,
    .rzz-2 h3,
    .rzj-2 h3,
    .rzj-3 h3,
    .rzj-5 h3,
    .rzj-6 h3,
    .yx-1left h3,
    .yx-2head h3,
    .yx-3 h3 {
        font-size: max(20px, 2.25rem);
        padding-bottom: 20px;
    }

    .rzc-3right h3:before,
    .rzc-4 h3:before,
    .rzz-1 h3:before,
    .rzz-2 h3:before,
    .rzj-2 h3:before,
    .rzj-3 h3:before,
    .rzj-5 h3:before,
    .rzj-6 h3:before,
    .yx-1left h3:before,
    .yx-2head h3:before,
    .yx-3 h3:before {
        width: 50px;
        height: 3px;
    }

    .rzc-3more {
        width: 150px;
        height: 42px;
        line-height: 42px;
    }

    .rzc-4content {
        margin-top: 20px;
    }

    .rzc-4cont span {
        font-size: 16px;
    }

    /*renzheng-zhiye*/
    .rzz-1 {
        padding-top: 50px;
    }

    .rzz-1content {
        margin-top: 30px;
    }

    .rzz-2 {
        padding-top: 50px;
    }

    .rzz-3 {
        padding-bottom: 50px;
    }

    /*renzheng-jiaoyu*/
    .rzj-1 {
        padding: 50px 0px;
    }

    .rzj-2content {
        margin-top: 20px;
    }

    .rzj-2left {
        width: 100%;
    }

    .rzj-2right {
        width: 100%;
        padding: 20px 0px 10px;
    }

    .rzj-2right h4 {
        margin-top: 2rem;
    }

    .rzj-2icon {
        display: none;
    }

    .rzj-3 {
        margin-top: 50px;
    }

    .rzj-4 {
        padding: 50px 0px;
    }

    .rzj-5content {
        margin-top: 20px;
    }

    .rzj-5item span {
        font-size: 14px;
    }

    .rzj-6 {
        padding-top: 50px;
    }

    .rzj-6item {
        padding: 0px 2.2rem;
    }

    .rzj-6item p {
        line-height: 23px;
        margin-top: 2rem;
    }

    .rzj-6more {
        margin-top: 25px;
    }

    .rzj-6more span {
        height: 40px;
        line-height: 40px;
    }

    .rzj-6more em {
        height: 40px;
        line-height: 40px;
    }

    /*rencai*/
    .rc-form {
        width: 90%;
        height: 50px;
        line-height: 50px;
    }

    .rc-form .bt {
        width: 120px;
        font-size: 15px;
    }

    .rc-body {
        padding: 100px 0px 50px;
        margin-top: -50px;
    }

    .rc-body .wrap-s:before {
        height: 104%;
    }

    .rc-3 {
        padding-bottom: 25px;
    }

    .rc-right .news-page ul li {
        width: 30px;
        height: 30px;
        line-height: 30px;
    }

    /*rencai-info*/
    .rc-info {
        padding: 50px 0px;
    }

    .rc-center {
        width: 90%;
    }

    .rc-bodys {
        margin-top: 20px;
        padding: 20px;
    }

    .rc-head {
        padding-bottom: 20px;
    }

    .rc-head h1 {
        font-size: 2rem;
    }

    .rc-model p {
        margin-right: 30px;
    }

    .rc-pannel {
        padding: 20px 0px;
    }

    .rc-content p {
        margin-top: 5px;
    }

    .rc-shenqing {
        height: 44px;
        line-height: 44px;
        font-size: 16px;
    }

    .rc-5 {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 10px;
    }

    .rc-5 p {
        height: 44px;
        line-height: 44px;
    }

    .rc-5 p span em {
        font-size: 14px;
        margin-left: 14px;
    }

    .rc-5 samp {
        height: 44px;
        line-height: 44px;
    }

    .rc-5 samp input {
        padding: 0px 14px;
        font-size: 14px;
    }

    .rc-8 {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 10px;
        margin-top: 10px;
    }

    .rc-8 samp {
        height: 44px;
        line-height: 44px;
    }

    .rc-8 samp input,
    .rc-8 samp select {
        padding: 0px 14px;
        font-size: 14px;
    }

    .rc-6 {
        margin-top: 10px;
    }

    .rc-6cont span {
        font-size: 14px;
        margin-top: 12px;
    }

    .rc-button {
        height: 44px;
        line-height: 44px;
        margin-top: 20px;
    }

    .rc-button input {
        font-size: 14px;
    }

    /*yuanxiao*/
    .st-1 {
        padding-top: 50px;
    }

    .st-1pic {
        width: 90%;
    }

    .st-2 {
        margin-top: 50px;
    }

    .st-2content {
        margin-top: 20px;
        box-sizing: border-box;
        padding: 0px 90px;
    }

    .st-2content:before,
    .st-2content:after {
        display: none;
    }

    .st-2content .swiper {
        width: 100%;
        margin-left: 0%;
    }

    .st-2content .swiper-slide a {
        padding: 20px;
    }

    .st-2head samp {
        width: 30px;
    }

    .st-2head span {
        width: calc(100% - 30px - 28px - 80px);
        min-height: 46px;
    }

    .st-2info {
        margin-top: 20px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
        overflow: hidden;
    }

    .st-2more {
        margin-top: 20px;
    }

    .st-2content .swiper-button-prev {
        left: 2%;
    }

    .st-2content .swiper-button-next {
        right: 2%;
    }

    .st-3 {
        padding: 50px 0px;
    }

    .st-3content {
        height: 360px;
    }

    .st-3left {
        padding: 3rem;
    }

    .st-3left h4 {
        font-size: 2rem;
    }

    .st-3info {
        font-size: 14px;
        line-height: 24px;
        margin-top: 2rem;
    }

    .st-3more {
        margin-top: 4rem;
    }

    .st-3right {
        padding: 3rem;
    }

    .st-3right ul li {
        line-height: 23px;
    }

    .st-3right ul li a {
        padding: 1.4rem 0px;
        padding-left: 20px;
    }

    .st-3right ul li a:before {
        top: 28px;
    }

    .st-content {
        padding: 50px 0px;
    }

    .st-4 {
        margin-top: 20px;
    }

    .st-4 .swiper-button-prev {
        width: 54px;
        height: 54px;
    }

    .st-4 .swiper-button-next {
        width: 54px;
        height: 54px;
    }

    .st-5 {
        margin-top: 30px;
    }

    .st-5center span {
        margin-right: 15px;
    }

    .st-5center span em {
        padding: 0px 15px;
    }

    .st-6 {
        margin-top: 50px;
    }

    .st-6content .swiper-slide a {
        padding: 0px 2rem 2rem;
    }

    .st-6content .swiper-slide::before {
        opacity: 1;
    }

    .st-6pic {
        height: 50px;
    }

    .st-6info {
        margin-top: 12px;
    }

    .st-6more {
        opacity: 1;
    }

    .st-6content .swiper-button-prev {
        left: -5%;
    }

    .st-6content .swiper-button-next {
        right: -5%;
    }

    /*yuanxiao-gongtongti*/
    .yx-add .swiper {
        margin-top: 40px;
    }

    .yx-1 {
        padding: 50px 0px;
    }

    .yx-1left {
        width: 100%;
    }

    .yx-1left samp {
        display: block;
    }

    .yx-1content {
        font-size: 14px;
        line-height: 24px;
    }

    .yx-1content p {
        margin-top: 15px;
    }

    .yx-1right {
        width: 100%;
    }

    .yx-1pic {
        display: none;
    }

    .yx-1right ul li {
        margin-top: 30px;
    }

    .yx-1right ul li samp {
        margin-top: 7px;
    }

    .yx-1model {
        margin-left: 13px;
    }

    .yx-1model p {
        line-height: 20px;
    }

    .yx-2 {
        padding: 50px 0px;
    }

    .yx-2info {
        line-height: 24px;
        font-size: 14px;
    }

    .yx-2 ul {
        margin-top: 20px;
    }

    .yx-2 ul li {
        margin-right: 12px;
    }

    .yx-2 ul li span {
        height: 40px;
        line-height: 40px;
        font-size: 14px;
        padding: 0px 14px;
    }

    .yx-2content {
        margin-top: 20px;
    }

    .yx-21 {
        padding: 12px;
    }

    .yx-21top {
        font-size: 2rem;
    }

    .yx-21info {
        font-size: 14px;
        line-height: 24px;
    }

    .yx-21model {
        margin-top: 8px;
    }

    .yx-21item p em {
        padding: 0px 15px;
    }

    .yx-22item {
        height: 30px;
        line-height: 30px;
        margin-right: 8px;
        padding: 0px 15px;
    }

    .yx-3 {
        padding: 50px 0px;
    }

    .yx-3more {
        width: 140px;
        height: 40px;
        line-height: 40px;
        margin: 25px auto 0px;
    }

    .yx-3more a {
        font-size: 14px;
    }

    /*peiyangxiangmu*/
    .xm-1 {
        padding: 80px 0px 50px;
    }

    .xm-1content {
        margin-top: 20px;
    }

    .xm-1button span {
        width: 140px;
        height: 40px;
        line-height: 40px;
    }

    .xm-1button span a,
    .xm-1button em a {
        font-size: 14px;
    }

    .xm-1button em {
        width: 140px;
        height: 40px;
        line-height: 40px;
    }

    .xm-2 {
        padding: 50px 0px;
    }

    .xm-2left {
        padding: 25px;
    }

    .xm-2content {
        margin-top: 20px;
    }

    .xm-2pannel a samp {
        height: 32px;
    }

    /*yuanxiao-case-info*/
    .case {
        padding: 50px 0px;
    }

    .case-body {
        margin-top: 20px;
    }

    .case-2model {
        top: 30px;
    }

    .case-2head span img {
        max-width: 100px;
    }

    .case-2right ul {
        margin-top: 12px;
    }

    .case-2right ul li {
        margin-top: 5px;
    }

    .case-3 {
        margin-top: 20px;
    }

    .case-3 h4 {
        padding-bottom: 12px;
    }

    .case-3content {
        font-size: 14px;
        line-height: 24px;
    }

    .case-3content p {
        margin-top: 16px;
    }

    /*yuanxiao-jiaocai*/
    .jc {
        padding: 70px 0px 50px;
    }

    .jc-right {
        padding: 1.875rem;
    }

    .jc-1button {
        bottom: 70px;
    }

    .jc-1button span a {
        width: 140px;
        height: 40px;
        font-size: 14px;
    }

    /*弹窗*/
    .prop-center {
        width: 90%;
    }

    /*yuanxiao-产品方案*/
    .cf {
        padding: 70px 0px 50px;
    }

    .cf-1info {
        padding: 2rem;
        font-size: 14px;
        line-height: 24px;
    }

    .cf-2 {
        padding: 2rem;
    }

    .cf-right {
        padding: 2rem;
    }

    .cf-right form {
        margin-top: 20px;
    }

    .cf-7 {
        margin-top: 10px;
    }

    .cf-8 {
        height: 40px;
        line-height: 40px;
        margin-top: 10px;
    }

    /*yuanxiao-xuni*/
    .xn-1 {
        padding: 70px 0px 50px;
    }

    .xn-1tu {
        border: 6px #fff solid;
    }

    .xn-1tu span {
        padding: 80px 20px 20px;
        font-size: max(20px, 2.25rem);
    }

    .xn-2info {
        margin-bottom: 30px;
    }

    .xn-2info p {
        margin: 16px 0px;
    }

    .xn-2info p:first-child {
        margin-top: 10x;
    }

    .xn-2des {
        margin: 20px 0px 30px;
        padding-bottom: 40px;
    }

    .xn-3 {
        margin: 20px 0px 30px;
        padding-bottom: 45px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 1.5625rem;
    }

    .xn-3item {
        overflow: initial;
    }

    .xn-3item:before {
        opacity: 1;
    }

    .xn-3item a:before {
        display: none;
    }

    .xn-3model span {
        line-height: 23px;
        margin-top: 22px;
    }

    .xn-3item:hover .xn-3model span {
        margin-top: 12px;
    }

    .xn-3model p {
        margin-top: 20px;
        opacity: 1;
    }

    .xn-4 {
        margin: 20px 0px 30px;
    }

    .xn-4 .swiper-slide samp {
        height: 11vw;
    }

    .xn-5pannel {
        margin-top: 10px;
    }

    /*login*/
    .login-center {
        padding: 20px;
    }

    .login-center form {
        margin-top: 15px;
    }

    .login-1 {
        margin-top: 8px;
        height: 36px;
        line-height: 36px;
    }

    .login-2 {
        margin-top: 10px;
    }

    .login-button {
        height: 36px;
        line-height: 36px;
        margin-top: 10px;
    }

    .login-button input {
        font-size: 14px;
    }

    .login-3 {
        margin-top: 12px;
    }

    .login-pannel ul {
        margin-top: 18px;
    }

    .login-pannel ul li {
        margin-right: 40px;
        padding-bottom: 12px;
    }

    .login-4 {
        margin-top: 15px;
    }

    .login-4 p span {
        padding: 0px 24px;
    }

    .login-4 samp {
        margin: 12px auto 0px;
    }

    .reg-2scroll {
        margin-top: 10px;
        height: 36px;
    }

    .reg-2scroll .slider1,
    .reg-2scroll .slider2 {
        line-height: 36px;
    }

    .footer-login {
        bottom: 10px;
    }

    /*zhengshu*/
    .cert img {
        box-shadow: 0px 25px 12px 5px rgba(0, 0, 0, 0.15);
        margin-top: 20px;
    }
}

@media screen and (max-width: 768px) {

    /*news*/
    .news {
        padding: 7rem 0px 40px;
    }

    .news h3 {
        font-size: max(20px, 2rem);
    }

    .news-list {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 15px;
    }

    .news-item {
        box-shadow: 0px 0px 12px 5px rgba(0, 0, 0, 0.06);
    }

    .news-item a {
        padding: 12px 12px 0px, 0;
    }

    .news-pic {
        height: auto;
    }

    .news-cont span {
        font-size: 16px;
    }

    /*detail*/
    .detail-1 {
        padding: 70px 0px 40px;
    }

    .detail-1 h1 {
        font-size: max(20px, 2rem);
    }

    .detail-body p {
        margin: 16px 0px;
    }

    .detail-page span {
        width: 150px;
        height: 40px;
        line-height: 40px;
    }

    .detail-page span a {
        font-size: 15px;
    }

    .detail-2 {
        padding: 40px 0px;
    }

    .detail-2 h3 {
        font-size: max(20px, 2rem);
    }

    .detail-2center {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 15px;
    }

    /*renzheng*/
    .rz-1 {
        padding: 40px 0px;
    }

    .rz-1 h3 {
        font-size: max(20px, 2rem);
    }

    .rz-1content {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 15px;
    }

    .rz-1pannel samp {
        padding: 20px 0px;
    }

    .rz-1cont span::before {
        top: 1px;
        transform: translateY(0px);
    }

    .rz-2 {
        padding-bottom: 40px;
    }

    .rz-3 h3 {
        font-size: max(20px, 2rem);
    }

    .rz-3content {
        padding: 1.5rem;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 20px;
    }

    .rz-3item {
        width: 100%;
        margin-top: 0px;
    }

    .rz-3left {
        padding: 5px 15px 5px 0px;
    }

    .rz-3left span {
        font-size: max(16px, 2rem);
    }

    .rz-3right {
        width: calc(100% - 100px);
        font-size: 14px;
    }

    .rz-4 {
        padding-top: 40px;
    }

    .rz-4 h3 {
        font-size: max(20px, 2rem);
    }

    .rz-4content {
        display: none;
    }

    .rz-4pannel {
        display: block;
        width: 100%;
        margin-top: 20px;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 15px;
    }

    .rz-4item {
        width: 100%;
        overflow: hidden;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 15px;
        position: relative;
    }

    .rz-4item:before {
        width: 100%;
        height: 100%;
        content: "";
        position: absolute;
        left: 0px;
        top: 0px;
        border-radius: 6px;
        background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
        background: -moz-linear-gradient(left, #7cca7d, #00abc8);
        background: -ms-linear-gradient(left, #7cca7d, #00abc8);
        background: -o-linear-gradient(left, #7cca7d, #00abc8);
        z-index: 1;
    }

    .rz-4item:after {
        width: calc(100% - 2px);
        height: calc(100% - 2px);
        content: "";
        position: absolute;
        left: 1px;
        top: 1px;
        border-radius: 5px;
        background: -webkit-linear-gradient(left, #f7fcf7, #f0fafc);
        background: -moz-linear-gradient(left, #f7fcf7, #f0fafc);
        background: -ms-linear-gradient(left, #f7fcf7, #f0fafc);
        background: -o-linear-gradient(left, #f7fcf7, #f0fafc);
        z-index: 2;
    }

    .rz-4head {
        width: 100%;
        position: relative;
        z-index: 3;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-start;
        font-size: 16px;
        color: #00405b;
    }

    .rz-4head img {
        margin-right: 10px;
    }

    .rz-4info {
        width: 100%;
        line-height: 24px;
        font-size: 14px;
        color: #888;
        position: relative;
        z-index: 4;
        margin-top: 20px;
    }

    .rz-5 {
        height: 180px;
        margin-top: 40px;
    }

    .rz-5head span {
        font-size: max(20px, 2rem);
    }

    .rz-5more {
        width: 120px;
        height: 40px;
        line-height: 40px;
    }

    /*rz-chanpin*/
    .rzc-1 {
        padding: 40px 0px;
        background: #fff;
    }

    .rzc-1 h3 {
        font-size: max(20px, 2rem);
    }

    .rzc-1bg {
        display: none;
    }

    .rzc-1content {
        width: 90%;
    }

    .rzc-1item {
        padding: 8px;
        margin-top: 8px;
    }

    .rzc-1center {
        padding: 25px;
    }

    .rzc-1left {
        width: 100%;
        justify-content: flex-start;
    }

    .rzc-1item samp {
        width: 40px;
    }

    .rzc-1item samp img {
        max-width: 100%;
    }

    .rzc-1item span {
        margin-left: 20px;
    }

    .rzc-1item ul {
        width: 100%;
        margin-top: 20px;
    }

    .rzc-1item ul li {
        height: 36px;
        line-height: 36px;
        font-size: 12px;
    }

    .rzc-2 {
        padding-bottom: 40px;
    }

    .rzc-3 {
        padding-top: 40px;
    }

    .rzc-3left {
        width: 100%;
    }

    .rzc-3right {
        width: 100%;
    }

    .rzc-3right h3,
    .rzc-4 h3,
    .rzz-1 h3,
    .rzz-2 h3,
    .rzj-2 h3,
    .rzj-3 h3,
    .rzj-5 h3,
    .rzj-6 h3,
    .yx-1left h3,
    .yx-2head h3,
    .yx-3 h3 {
        font-size: max(20px, 2rem);
    }

    .rzc-3more {
        width: 150px;
        height: 42px;
        line-height: 42px;
    }

    .rzc-4 {
        margin-top: 40px;
    }

    .rzc-4content {
        margin-top: 20px;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 15px;
    }

    .rzc-4item samp {
        height: auto;
    }

    .rzc-4cont span {
        font-size: 16px;
    }

    /*renzheng-zhiye*/
    .rzz-1 {
        padding-top: 40px;
    }

    .rzz-1content {
        margin-top: 20px;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 15px;
    }

    .rzz-1item {
        width: 100%;
    }

    .rzz-1head {
        padding: 1.5rem;
    }

    .rzz-1head p {
        margin-top: 20px;
    }

    .rzz-1item:nth-child(2) .rzz-1head p {
        margin-top: 20px;
    }

    .rzz-2 {
        padding-top: 40px;
    }

    .rzz-2pic {
        display: none;
    }

    .rzz-2content {
        width: 100%;
        display: block;
        margin-top: 20px;
        box-sizing: border-box;
        padding: 0px 5%;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 15px;
    }

    .rzz-2item {
        width: 100%;
        overflow: hidden;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 15px;
        position: relative;
    }

    .rzz-2item:before {
        width: 100%;
        height: 100%;
        content: "";
        position: absolute;
        left: 0px;
        top: 0px;
        border-radius: 6px;
        background: -webkit-linear-gradient(left, #7cca7d, #00abc8);
        background: -moz-linear-gradient(left, #7cca7d, #00abc8);
        background: -ms-linear-gradient(left, #7cca7d, #00abc8);
        background: -o-linear-gradient(left, #7cca7d, #00abc8);
        z-index: 1;
    }

    .rzz-2item:after {
        width: calc(100% - 2px);
        height: calc(100% - 2px);
        content: "";
        position: absolute;
        left: 1px;
        top: 1px;
        border-radius: 5px;
        background: -webkit-linear-gradient(left, #f7fcf7, #f0fafc);
        background: -moz-linear-gradient(left, #f7fcf7, #f0fafc);
        background: -ms-linear-gradient(left, #f7fcf7, #f0fafc);
        background: -o-linear-gradient(left, #f7fcf7, #f0fafc);
        z-index: 2;
    }

    .rzz-2item span {
        width: 100%;
        position: relative;
        z-index: 3;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-start;
        font-size: 16px;
        color: #00405b;
    }

    .rzz-2item p {
        width: 100%;
        line-height: 24px;
        font-size: 14px;
        color: #888;
        position: relative;
        z-index: 4;
        margin-top: 10px;
    }

    .rzz-3 {
        padding-bottom: 40px;
    }

    /*renzheng-jiaoyu*/
    .rzj-1 {
        padding: 40px 0px;
    }

    .rzj-2icon {
        display: none;
    }

    .rzj-3 {
        margin-top: 40px;
    }

    .rzj-3content {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 20px;
    }

    .rzj-4 {
        padding: 40px 0px;
    }

    .rzj-5content {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 0px;
    }

    .rzj-6 {
        padding-top: 40px;
    }

    .rzj-6bg {
        display: none;
    }

    .rzj-6pannel {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 15px;
        position: relative;
    }

    .rzj-6item {
        padding: 0px;
        overflow: hidden;
        border-radius: 6px;
        background: #fff;
        box-shadow: 0px 0px 12px 5px rgba(0, 0, 0, 0.06);
    }

    .rzj-6item span {
        height: 30px;
        line-height: 30px;
        font-size: 16px;
        background: -webkit-linear-gradient(left, #5fbd6c, #0094bc);
        background: -moz-linear-gradient(left, #5fbd6c, #0094bc);
        background: -ms-linear-gradient(left, #5fbd6c, #0094bc);
        background: -o-linear-gradient(left, #5fbd6c, #0094bc);
        box-sizing: border-box;
        padding-left: 20px;
    }

    .rzj-6item p {
        line-height: 22px;
        margin-top: 0px;
        box-sizing: border-box;
        padding: 20px;
    }

    .rzj-6more {
        margin-top: 25px;
    }

    /*rencai*/
    .rc-form {
        height: 40px;
        line-height: 40px;
        transform: translateY(0px);
        margin-top: 40px;
    }

    .rc-form .txt {
        padding: 0px 80px 0px 40px;
        background-position: 15px center;
    }

    .rc-form .bt {
        width: 80px;
        font-size: 14px;
    }

    .rc-body {
        padding: 130px 0px 40px;
        margin-top: -80px;
    }

    .rc-body .wrap-s:before {
        display: none;
    }

    .rc-left {
        width: 100%;
        top: 0px;
        position: relative;
    }

    .rc-left ul li {
        margin-top: 10px;
        float: left;
        width: auto;
        margin-right: 20px;
    }

    .rc-right {
        width: 100%;
        margin-top: 40px;
    }

    .rc-3 {
        padding-bottom: 20px;
    }

    .rc-4item a {
        padding: 2rem 0px;
    }

    .rc-4item ul li {
        padding: 0px 10px;
    }

    /*rencai-info*/
    .rc-info {
        padding: 40px 0px;
    }

    .rc-bodys {
        padding: 16px;
    }

    .rc-head {
        padding-bottom: 16px;
    }

    .rc-model p {
        margin-right: 20px;
    }

    .rc-model p.rc1 {
        margin-left: 0px;
    }

    .rc-content p {
        margin-top: 4px;
    }

    .rc-shenqing {
        height: 40px;
        line-height: 40px;
    }

    .rc-5 {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 10px;
    }

    .rc-5 p {
        height: 40px;
        line-height: 40px;
    }

    .rc-8 {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 10px;
    }

    .rc-8 samp {
        height: 40px;
        line-height: 40px;
    }

    .rc-6 {
        height: 150px;
    }

    /*yuanxiao*/
    .st-1 {
        padding-top: 40px;
    }

    .st-1head {
        box-sizing: border-box;
        padding: 0px 5%;
    }

    .st-1pic {
        margin-top: 30px;
    }

    .st-2 {
        margin-top: 40px;
        box-sizing: border-box;
        padding: 0px 5%;
    }

    .st-2content {
        padding: 0px;
        border: none;
        overflow: initial;
    }

    .st-2content:before,
    .st-2content:after {
        display: none;
    }

    .st-2content .swiper {
        width: 100%;
        margin-left: 0%;
    }

    .st-2content .swiper-slide {
        border: 1px #ebf0f7 solid;
    }

    .st-2content .swiper-slide a {
        padding: 15px;
    }

    .st-2head samp {
        width: 25px;
    }

    .st-2head span {
        width: calc(100% - 25px - 24px - 80px);
        min-height: 46px;
        margin-top: 0px;
    }

    .st-2head p {
        margin-top: 0px;
    }

    .st-2info {
        padding: 0px 20px;
        margin-top: 20px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
        overflow: hidden;
    }

    .st-2more {
        margin-top: 20px;
    }

    .st-2content .swiper-button-prev {
        left: -6%;
    }

    .st-2content .swiper-button-next {
        right: -6%;
    }

    .st-3 {
        padding: 40px 0px;
    }

    .st-3content {
        height: auto;
    }

    .st-3left {
        padding: 15px;
        width: 100%;
    }

    .st-3left h4 {
        font-size: 2rem;
    }

    .st-3more {
        margin-top: 2rem;
    }

    .st-3right {
        padding: 2rem;
        width: 100%;
        height: 90vw;
    }

    .st-3right ul li {
        line-height: 22px;
    }

    .st-3right ul li a {
        padding: 1.2rem 0px;
        padding-left: 20px;
    }

    .st-3right ul li a:before {
        top: 21px;
    }

    .st-content {
        padding: 40px 0px;
    }

    .st-4 {
        margin-top: 20px;
        box-sizing: border-box;
        padding: 0px 5%;
    }

    .st-4 .swiper {
        width: 100%;
        margin-left: 0%;
    }

    .st-4cont {
        padding-left: 15px;
    }

    .st-4cont:before {
        width: 2px;
        height: 50%;
    }

    .st-4cont p {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }

    .st-4 .swiper-button-prev {
        width: 30px;
        height: 30px;
        left: 2%;
    }

    .st-4 .swiper-button-next {
        width: 30px;
        height: 30px;
        right: 2%;
    }

    .st-4 .swiper-button-next::after,
    .st-4 .swiper-button-prev::after {
        opacity: 1;
    }

    .st-5 {
        margin-top: 20px;
        box-sizing: border-box;
        padding: 0px 5%;
        display: none;
    }

    .st-5center span {
        margin-right: 0px;
        width: 100%;
    }

    .st-5center span em {
        padding: 0px 15px;
    }

    .st-6 {
        margin-top: 40px;
    }

    .st-6content .swiper-button-prev {
        left: -5%;
    }

    .st-6content .swiper-button-next {
        right: -5%;
    }

    /*yuanxiao-gongtongti*/
    .yx-add .swiper-slide a {
        padding: 15px;
    }

    .yx-add2 {
        width: 100%;
        height: auto;
    }

    .yx-add3 {
        width: 100%;
        margin-top: 20px;
    }

    .yx-add3 em {
        margin-top: 12px;
        float: left;
    }

    .yx-add1 {
        width: 100%;
        left: 0px;
        bottom: 5px;
    }

    .yx-add1 .swiper-pagination {
        text-align: center;
    }

    .yx-1 {
        padding: 40px 0px;
    }

    .yx-1content p {
        margin-top: 12px;
    }

    .yx-1right ul {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 20px;
    }

    .yx-1right ul li {
        width: 100%;
        margin-top: 0px;
    }

    .yx-1right ul li samp {
        margin-top: 7px;
        width: 30px;
    }

    .yx-1right ul li samp img {
        width: 100%;
        height: auto;
    }

    .yx-1model {
        margin-left: 0px;
        width: 100%;
        margin-top: 10px;
    }

    .yx-2 {
        padding: 40px 0px;
    }

    .yx-2 ul {
        margin-top: 20px;
    }

    .yx-2 ul li {
        margin-right: 0px;
        width: 50%;
    }

    .yx-2 ul li span {
        padding: 0px 12px;
    }

    .yx-21 {
        flex-wrap: wrap;
    }

    .yx-21left {
        width: 100%;
    }

    .yx-21right {
        width: 100%;
        padding: 2rem 0px 10px;
    }

    .yx-21top {
        font-size: 2rem;
    }

    .yx-21info {
        font-size: 14px;
        margin-top: 15px;
    }

    .yx-21item span {
        width: 100%;
    }

    .yx-21item p {
        width: 100%;
    }

    .yx-21item p em {
        height: 24px;
        line-height: 24px;
        height: auto;
        padding: 0px 12px;
    }

    .yx-22item {
        height: 30px;
        line-height: 30px;
        margin-right: 8px;
        padding: 0px 15px;
    }

    .yx-3 {
        padding: 40px 0px;
    }

    .yx-3more {
        margin: 20px auto 0px;
    }

    /*peiyangxiangmu*/
    .xm-1 {
        padding: 70px 0px 40px;
    }

    .xm-1content h3 {
        width: 100%;
    }

    .xm-1button {
        width: 100%;
        margin-top: 20px;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }

    .xm-1button span {
        width: 140px;
        height: 40px;
        line-height: 40px;
    }

    .xm-1button em {
        width: 140px;
    }

    .xm-2 {
        padding: 40px 0px;
    }

    .xm-2left {
        width: 100%;
        padding: 20px;
    }

    .xm-2content {
        margin-top: 20px;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 15px;
    }

    .xm-2item samp {
        height: auto;
    }

    .xm-2right {
        width: 100%;
        position: relative;
        margin-top: 40px;
        top: 0px;
    }

    /*yuanxiao-case-info*/
    .case {
        padding: 40px 0px;
    }

    .case-left {
        width: 100%;
    }

    .case-2left {
        width: 100%;
        border-radius: 16px;
        overflow: hidden;
        height: 300px;
    }

    .case-2left samp {
        border-radius: 16px;
        overflow: hidden;
    }

    .case-2model {
        top: 30px;
    }

    .case-2right {
        width: 100%;
        padding: 20px;
        box-sizing: border-box;
    }

    .case-2head span img {
        max-width: 100px;
    }

    .case-right {
        width: 100%;
        margin-top: 40px;
    }

    /*yuanxiao-jiaocai*/
    .jc {
        padding: 60px 0px 40px;
    }

    .jc-left,
    .jc-1button span {
        width: 100%;
    }

    .jc-right {
        display: none;
    }

    .jc-1button {
        bottom: 50px;
    }

    /*弹窗*/
    .prop-center {
        width: 90%;
    }

    /*yuanxiao-产品方案*/
    .cf {
        padding: 60px 0px 40px;
    }

    .cf-left {
        width: 100%;
    }

    .cf-1 {
        padding: 2rem;
    }

    .cf-1info {
        padding: 1.5rem;
    }

    .cf-2 {
        padding: 1.5rem;
    }

    .cf-right {
        width: 100%;
        padding: 1.5rem;
        margin-top: 40px;
    }

    /*yuanxiao-xuni*/
    .xn-1 {
        padding: 60px 0px 40px;
    }

    .xn-1tu {
        border: 5px #fff solid;
    }

    .xn-1tu span {
        padding: 60px 20px 20px;
        font-size: max(20px, 2rem);
    }

    .xn-3 {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 15px;
    }

    .xn-4 .swiper-slide samp {
        height: 30vw;
    }

    .xn-5pannel {
        margin-top: 10px;
    }

    /*login*/
    .login {
        height: calc(100vh - 50px);
    }

    .login-center {
        width: 90%;
        padding: 15px;
        margin-top: -40px;
    }

    .login-top {
        width: 40px;
        height: 40px;
        right: 10px;
        top: 5px;
    }

    .login-wx {
        margin-top: 50px;
        padding-bottom: 40px;
    }

    .login-wx1 {
        width: 70%;
    }

    .login-wx2 {
        margin-top: 35px;
    }

    .login-3 {
        margin-top: 12px;
    }

    .login-pannel ul li {
        margin-right: 10px;
        padding-bottom: 10px;
    }

    .login-4 {
        margin-top: 12px;
    }

    .login-4 p span {
        padding: 0px 15px;
    }

    .reg-2scroll p {
        white-space: nowrap;
    }

    .footer-login {
        bottom: 10px;
        font-size: 12px;
    }

    .footer-login span {
        width: 100%;
        display: block;
        text-align: center;
    }

    .login-center {
        top: 0px;
        transform: translate(-50%, 0px);
        margin-top: 40px;
    }

    /*zhengshu*/
    .cert h1 {
        font-size: max(20px, 2rem);
    }

    .cert img {
        box-shadow: 0px 20px 12px 5px rgba(0, 0, 0, 0.15);
    }
}

/*search*/
.bannser-search {
    width: 100%;
    padding-top: 7rem;
}

.bannser-search form {
    width: 45rem;
    margin: 0px auto;
    height: 5rem;
    line-height: 5rem;
    background: #fff;
    border-radius: 8px;
    position: relative;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.bannser-search form:hover {
    box-shadow: 0px 0px 12px 5px rgba(13, 174, 192, 0.1);
}

.bannser-search form .txt {
    width: 100%;
    height: 100%;
    background: none;
    box-sizing: border-box;
    padding: 0px 20px;
    font-size: 18px;
    color: #7a8799;
}

.bannser-search form .txt::placeholder {
    color: "#7a8799" !important;
    opacity: 1;
}

.bannser-search form .txt::-webkit-input-placeholder {
    color: "#7a8799" !important;
    opacity: 1;
}

.bannser-search form .txt::-ms-input-placeholder {
    color: "#7a8799" !important;
    opacity: 1;
}

.bannser-search form .txt::-moz-placeholder {
    color: "#7a8799" !important;
    opacity: 1;
}

.bannser-search form .bt {
    width: 90px;
    height: 100%;
    background: none;
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 2;
    cursor: pointer;
    background: url("../img/icon-25.png") no-repeat center;
}

.seach-col {
    width: 45rem;
    margin: 10px auto 0px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
}

.search-model {
    width: auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    font-size: 16px;
    color: #00405b;
    margin-right: 20px;
    position: relative;
    cursor: pointer;
    margin-top: 10px;
}

.search-model:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 6;
    cursor: pointer;
}

.search-model input {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #eee;
    margin-right: 10px;
    border: 4px #fff solid;
}

.search-model input:checked {
    background: -webkit-linear-gradient(left, #78c97f, #00abc8);
    background: -moz-linear-gradient(left, #78c97f, #00abc8);
    background: -ms-linear-gradient(left, #78c97f, #00abc8);
    background: -o-linear-gradient(left, #78c97f, #00abc8);
}

.searchs {
    width: 100%;
    padding: 150px 15% 90px;
    margin: 0px auto;
    overflow: hidden;
    border-bottom: 1px #eee solid;
    box-sizing: border-box;
}

.search-head {
    float: left;
    width: 100%;
    line-height: 80px;
    font-size: 32px;
    color: #666;
    line-height: 32px;
    padding-bottom: 50px;
}

.search-head span {
    color: #00abc8;
}

.search-head strong {
    color: #00abc8;
    font-weight: normal;
}

.search-content {
    float: left;
    width: 100%;
    overflow: hidden;
    margin-bottom: 40px;
}

.search-item {
    float: left;
    width: 100%;
    overflow: hidden;
    margin-top: 40px;
    padding-bottom: 40px;
    position: relative;
}

.search-item:before {
    width: 100%;
    height: 4px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #eee;
}

.search-item:after {
    width: 0%;
    height: 4px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: -webkit-linear-gradient(left, #78c97f, #00abc8);
    background: -moz-linear-gradient(left, #78c97f, #00abc8);
    background: -ms-linear-gradient(left, #78c97f, #00abc8);
    background: -o-linear-gradient(left, #78c97f, #00abc8);
    z-index: 3;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.search-item:hover:after {
    width: 100%;
}

.search-item h3 {
    font-size: 20px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
}

.search-item h3 a {
    color: #444;
    transition: all 0.5s ease;
}

.search-item h3 a:hover {
    color: #00abc8;
}

.search-item span {
    display: block;
    overflow: hidden;
    line-height: 30px;
    font-size: 14px;
    color: #777;
    margin-top: 8px;
}

.description {
    overflow: hidden;
    line-height: 24px;
    font-size: 14px;
    color: #777;
    margin-top: 4px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.search-left {
    width: 200px;
    height: 140px;
    overflow: hidden;
    background: #f3f3f3;
    float: left;
    margin-right: 30px;
}

.search-left img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.search-right {
    display: block;
}

.search-item .link {
    overflow: hidden;
    line-height: 24px;
    color: #777;
    margin-top: 2px;
}

.search-item .link a {
    font-size: 12px;
    color: #888;
}

.search-item .link a:hover {
    color: #0069d1;
}

@media screen and (max-width: 1000px) {
    .searchs {
        padding: 80px 8% 20px;
    }

    .search-head {
        line-height: 50px;
        font-size: 22px;
        line-height: 30px;
        padding-bottom: 40px;
    }

    .search-item {
        margin-top: 30px;
        border-bottom: 3px #eee solid;
        padding-bottom: 30px;
    }

    .search-item h3 {
        font-size: 18px;
    }

    .search-item span {
        line-height: 28px;
    }

    .bannser-search form {
        width: 90%;
        height: 40px;
        line-height: 40px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    }

    .bannser-search form .txt {
        padding: 0px 15px;
        font-size: 14px;
    }

    .bannser-search form .bt {
        width: 70px;
    }

    .seach-col {
        width: 90%;
    }

    .search-model {
        font-size: 14px;
        margin-right: 15px;
    }

    .search-model input {
        width: 14px;
        height: 14px;
        margin-right: 8px;
        border: 3px #fff solid;
    }
}

@media screen and (max-width: 768px) {
    .searchs {
        padding: 30px 5% 30px;
    }

    .search-head {
        line-height: 40px;
        font-size: 18px;
        line-height: 26px;
        padding-bottom: 20px;
    }

    .search-item {
        margin-top: 20px;
        border-bottom: 1px #eee solid;
        padding-bottom: 20px;
    }

    .search-item h3 {
        font-size: 16px;
    }

    .search-item span {
        line-height: 26px;
    }

    .search-left {
        width: 100%;
        height: auto;
        margin-right: 0px;
        float: none;
    }

    .search-right {
        margin-top: 15px;
    }

    .search-content {
        margin-bottom: 30px;
    }
}