@charset "utf-8";
.inside-banner {
    color: #fff;
    position: relative
}

.inside-banner img {
    width: 100%;
    position: static;
    vertical-align: top
}

.inside-banner .pc {
    position: relative
}

.inside-banner .pc:after {
    content: "";
    display: block
}

.inside-banner .mobile {
    display: none;
    position: relative
}

.inside-banner .mobile:after {
    content: "";
    display: block
}

@media screen and (max-width: 1023px) {
    .inside-banner .pc {
        display: none
    }

    .inside-banner .mobile {
        display: block
    }
}

.common-bread {
    background-color: rgba(222, 222, 222, 0.23);
    font-weight: 400;
    font-size: 14px;
    text-align: right;
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 20px;
    color: #333;
    text-align: left
}

.common-bread a {
    color: #333;
    margin: 0 5px 0 0
}

.common-bread a:hover {
    color: var(--main-color);
    text-decoration: underline
}

.common-bread span {
    margin: 0 0 0 5px
}

@media screen and (max-width: 1023px) {
    .common-bread {
        display: none
    }
}

.inside-listDiv {
    overflow: hidden;
    padding-top: 80px;
    padding-bottom: 80px
}

.inside-listDiv .list {
    margin-left: -30px;
    margin-right: -30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.inside-listDiv .list li {
    width: 33.33333333%;
    padding: 0 30px 40px 30px
}

.inside-listDiv .list .col-4-1 {
    width: 25%
}

.inside-listDiv .list .box {
    display: block;
    overflow: hidden;
    border-radius: 10px;
    background-color: #f7f7f7
}

.inside-listDiv .list .pic {
    overflow: hidden;
    position: relative
}

.inside-listDiv .list .pic::after {
    content: "";
    display: block;
    padding-top: 76.47058824%
}

.inside-listDiv .list .pic img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: .5s;
    transition: .5s
}

.inside-listDiv .list .text {
    padding-left: 5%;
    padding-right: 5%;
    padding-top: 20px;
    padding-bottom: 20px
}

.inside-listDiv .list .title {
    color: #333;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 10px
}

.inside-listDiv .list .date {
    color: #999
}

.inside-listDiv .list .info {
    color: #666;
    line-height: 24px;
    height: 48px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2
}

.inside-listDiv .list .fl-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.inside-listDiv .list .fl {
    display: inline-block;
    position: relative;
    height: 26px;
    line-height: 24px;
    max-width: 100%;
    padding: 0 8px;
    border: 1px solid #e5e5e5;
    margin-top: 12px;
    margin-right: 15px;
    border-radius: 5px;
    color: #999;
    font-size: 12px;
    word-break: keep-all;
    overflow: hidden;
    z-index: 2
}

.inside-listDiv .list .btnDiv {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-top: 20px;
    text-align: right
}

.inside-listDiv .list .btnDiv .icon {
    width: 24px;
    height: 11px;
    display: inline-block;
    vertical-align: top;
    position: relative
}

.inside-listDiv .list .btnDiv .icon::before {
    content: "";
    display: block;
    background: url(../images/icon/arrow-right.svg) no-repeat center center;
    background-size: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transition: .5s;
    transition: .5s
}

.inside-listDiv .list .btnDiv .icon::after {
    content: "";
    display: block;
    background: url(../images/icon/arrow-right.svg) no-repeat center center;
    background-size: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: -30px;
    opacity: 0;
    -webkit-transition: .5s;
    transition: .5s
}

.inside-listDiv .list .box:hover {
    background-color: #efefef
}

.inside-listDiv .list .box:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

.inside-listDiv .list .box:hover .title {
    color: var(--main-color)
}

.inside-listDiv .list .box:hover .btnDiv .icon::before {
    left: 30px;
    opacity: 0
}

.inside-listDiv .list .box:hover .btnDiv .icon::after {
    left: 0;
    opacity: 1
}

@media screen and (max-width: 1023px) {
    .inside-listDiv {
        padding-top: 40px;
        padding-bottom: 0
    }

    .inside-listDiv .list {
        margin-left: -10px;
        margin-right: -10px
    }

    .inside-listDiv .list li {
        width: 50%;
        padding-left: 10px;
        padding-right: 10px;
        padding-bottom: 20px
    }

    .inside-listDiv .list .col-4-1 {
        width: 50%
    }

    .inside-listDiv .list .btnDiv {
        display: none
    }

    .inside-listDiv .list .box {
        background: #fff
    }

    .inside-listDiv .list .text {
        padding-left: 0;
        padding-right: 0
    }
}

.case .list .pic::after {
    padding-top: 60%
}

.empower {
    overflow: hidden;
    padding-top: 80px;
    padding-bottom: 80px
}

.empower .list {
    margin-left: -30px;
    margin-right: -30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.empower .list li {
    width: 33.33333333%;
    padding: 0 30px 40px 30px
}

.empower .list .box {
    display: block;
    min-height: 100%;
    overflow: hidden;
    border-radius: 10px;
    border: 1px solid #f7f7f7;
    border-radius: 20px 0 20px 0;
    -webkit-transition: .5s;
    transition: .5s
}

.empower .list .pic {
    overflow: hidden;
    position: relative
}

.empower .list .pic::after {
    content: "";
    display: block;
    padding-top: 76.47058824%
}

.empower .list .pic img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: .5s;
    transition: .5s
}

.empower .list .text {
    padding-left: 5%;
    padding-right: 5%;
    padding-top: 20px;
    padding-bottom: 20px
}

.empower .list .title {
    text-align: center;
    color: #333;
    font-size: 18px;
    font-weight: 700
}

.empower .list .box:hover {
    -webkit-box-shadow: 0 3px 12px 0 rgba(197, 197, 197, 0.23);
    box-shadow: 0 3px 12px 0 rgba(197, 197, 197, 0.23)
}

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

.empower .list .box:hover .title {
    color: var(--main-color)
}

@media screen and (max-width: 1023px) {
    .empower {
        padding-top: 40px;
        padding-bottom: 20px
    }

    .empower .list {
        margin-left: -10px;
        margin-right: -10px
    }

    .empower .list li {
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
        padding-bottom: 20px
    }

    .empower .list .btnDiv {
        display: none
    }

    .empower .list .box {
        background: #fff
    }

    .empower .list .text {
        padding-left: 0;
        padding-right: 0
    }

    .empower .list .title {
        font-size: 16px
    }
}

.empower-show {
    padding-top: 80px;
    padding-bottom: 80px;
    font-size: 20px;
    line-height: 2;
    color: #404040
}

.empower-show .nr {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 40px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.empower-show .nr .left {
    width: 50%;
    padding-left: 70px;
    padding-right: 70px;
    position: relative
}

.empower-show .nr .right {
    width: 50%;
    padding-left: 30px
}

.empower-show .nr .list .box {
    position: relative
}

.empower-show .nr .list .box::after {
    content: "";
    display: block;
    padding-top: 76.47058824%
}

.empower-show .nr .list img {
    width: 100%;
    vertical-align: top;
    -o-object-fit: cover;
    object-fit: cover
}

.empower-show .swiper-button-prev, .empower-show .swiper-button-next {
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background: rgba(0, 0, 0, 0.2);
    color: #fff;
    text-align: center;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.empower-show .swiper-button-prev:after, .empower-show .swiper-button-next:after {
    font-size: 20px
}

.empower-show .swiper-button-prev:hover, .empower-show .swiper-button-next:hover {
    background: var(--main-color)
}

.empower-show .swiper-button-prev {
    left: 0
}

.empower-show .swiper-button-next {
    right: 0
}

.empower-show .swiper-pagination {
    display: none
}

@media screen and (max-width: 1023px) {
    .empower-show {
        font-size: 14px;
        padding-top: 40px;
        padding-bottom: 40px
    }

    .empower-show .nr {
        padding-top: 0
    }

    .empower-show .nr .left {
        width: 100%;
        padding-left: 0;
        padding-right: 0
    }

    .empower-show .nr .right {
        width: 100%;
        padding: 40px 0 0 0
    }

    .empower-show .swiper-button-prev, .empower-show .swiper-button-next {
        width: 30px;
        height: 30px
    }

    .empower-show .swiper-button-prev:after, .empower-show .swiper-button-next:after {
        font-size: 12px
    }

    .empower-show .swiper-button-prev {
        left: 10px
    }

    .empower-show .swiper-button-next {
        right: 10px
    }
}

.service {
    padding-top: 80px;
    padding-bottom: 80px
}

.service .div-1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.service .div-1-1 {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-right: 10%
}

.service .div-1-2 {
    padding-top: 10%
}

.service .div-1-2 .ewm {
    width: 320px;
    margin: auto;
    -webkit-box-shadow: 0 3px 12px 0 rgba(197, 197, 197, 0.23);
    box-shadow: 0 3px 12px 0 rgba(197, 197, 197, 0.23);
    padding: 30px 30px;
    text-align: center
}

.service .div-1-2 .ewm img {
    max-width: 150px
}

.service .div-1-2 .title-1 {
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 10px
}

.service .div-1-2 .title-2 {
    color: var(--main-color);
    margin-top: 10px
}

.service .p-1 {
    font-size: 36px;
    text-align: center;
    font-weight: 700
}

@media screen and (max-width: 1023px) {
    .service {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .service .div-1-1 {
        width: 100%
    }

    .service .div-1-2 {
        width: 100%
    }

    .service .div-1-2 .ewm {
        width: 100%;
        max-width: 320px
    }

    .service .p-1 {
        font-size: 22px
    }
}

.inside-1 {
    margin-left: auto;
    margin-right: auto;
    padding-top: 80px;
    padding-bottom: 80px
}

.inside-1 > .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.inside-1 .asideBtnM {
    display: none;
    font-size: 14px;
    line-height: 30px;
    width: 40px;
    height: 40px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    background: var(--main-color);
    text-align: center;
    color: #fff;
    line-height: 40px;
    font-size: 0;
    position: fixed;
    z-index: 999999;
    top: 50%;
    left: 0
}

.inside-1 .asideBtnM .txt {
    display: none
}

.inside-1 .asideBtnM .icon {
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    border-top: 2px #fff solid;
    border-right: 2px #fff solid;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    margin-left: -5px
}

.inside-1 .leftAsideMDiv {
    width: 25%;
    padding-right: 30px;
    float: left
}

.inside-1 .leftAside {
    position: relative;
    position: -webkit-sticky;
    position: sticky;
    top: 120px;
    left: 0
}

.inside-1 .classifyAside {
    font-size: 16px;
    position: relative;
    z-index: 1
}

.inside-1 .classifyAside .titleBig {
    line-height: 1.5;
    padding: 30px 15px;
    border-top-right-radius: 40px;
    background: #4b4b4b;
    background-size: cover;
    color: #fff;
    display: block;
    position: relative
}

.inside-1 .classifyAside .titleBig .cn {
    font-size: 24px
}

.inside-1 .classifyAside .titleBig .en {
    font-size: 16px
}

.inside-1 .classifyAside .list {
    border: 1px solid #e7e7e7;
    padding-top: 10px
}

.inside-1 .classifyAside .list > li {
    position: relative
}

.inside-1 .classifyAside .list > li:last-child {
    padding-bottom: 0
}

.inside-1 .classifyAside .list > li:last-child > a {
    border-bottom: none
}

.inside-1 .classifyAside .list > li > a {
    border-bottom: 1px #e8e8e8 dotted;
    color: #333;
    font-size: 16px;
    font-weight: 700;
    display: block;
    line-height: 30px;
    padding: 10px 15px 10px 40px;
    position: relative;
    z-index: 1;
    -webkit-transition: padding-left .5s;
    transition: padding-left .5s
}

.inside-1 .classifyAside .list > li > a::before {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    border-top: 1px solid #afafaf;
    border-right: 1px solid #afafaf;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    left: 20px;
    top: 44%;
    -webkit-transition: .5s;
    transition: .5s
}

.inside-1 .classifyAside .list > li > a:hover {
    color: var(--main-color)
}

.inside-1 .classifyAside .list .list {
    border: none
}

.inside-1 .classifyAside .list .list > li {
    border-bottom: none
}

.inside-1 .classifyAside .list .list > li > a {
    border-bottom: none;
    padding-top: 5px;
    padding-bottom: 5px;
    line-height: 30px;
    font-size: 14px;
    color: #666;
    padding-left: 55px
}

.inside-1 .classifyAside .list .list > li > a::before {
    content: "";
    border: none;
    position: absolute;
    width: 3px;
    height: 3px;
    background: #929292;
    border-radius: 50%;
    top: 18px;
    left: 40px
}

.inside-1 .classifyAside .list .list > li > a:hover {
    color: #000
}

.inside-1 .classifyAside .list .list > li.active > a {
    color: #000
}

.inside-1 .classifyAside .list .list > li.active > a::before {
    background: #000
}

.inside-1 .classifyAside .list > li.active > a {
    color: var(--main-color)
}

.inside-1 .rightCon {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 75%;
    float: left;
    padding-left: 10px
}

.inside-1 .lxfs {
    margin-top: 30px;
    background: #f7f7f7;
    padding: 30px 20px;
    text-align: center
}

.inside-1 .lxfs .titleBig {
    font-size: 20px;
    color: #292e32;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px #d4ddee solid
}

.inside-1 .lxfs .tel {
    color: #4b4b4b;
    font-size: 24px;
    text-decoration: none;
    font-weight: 700
}

.inside-1 .lxfs .tel a {
    color: #4b4b4b
}

.inside-1 .lxfs .icon {
    height: 60px
}

.inside-1 .lxfs .info {
    margin-bottom: 20px
}

.inside-1 .lxfs .btnDiv {
    padding-top: 20px
}

.inside-1 .lxfs .btnDiv a {
    display: block;
    background: #4b4b4b;
    color: #fff;
    line-height: 36px;
    font-size: 16px
}

.inside-1 .lxfs .btnDiv a:hover {
    background: var(--main-color)
}

@media screen and (max-width: 1023px) {
    .inside-1 {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .inside-1 .asideBtnM {
        display: none !important
    }

    .inside-1 .mask {
        position: fixed;
        width: 100%;
        background: rgba(0, 0, 0, 0.6);
        width: 100vw;
        height: 100%;
        display: none;
        opacity: 1;
        z-index: 1000;
        top: 0;
        left: 0
    }

    .inside-1 .mask.show {
        display: block
    }

    .inside-1 .leftAsideMDiv {
        width: auto;
        display: none
    }

    .inside-1 .leftAside {
        background: #fff;
        display: block;
        width: 100%;
        max-width: 300px;
        height: 100%;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        position: fixed;
        z-index: 1000;
        top: 0;
        left: -100%;
        -webkit-transition: .5s;
        transition: .5s
    }

    .inside-1 .leftAside.openM {
        left: 0
    }

    .inside-1 .classifyAside {
        position: relative;
        z-index: 999;
        padding: 30px 15px;
        min-height: 100%;
        -webkit-box-shadow: 0 0 20px 0 rgba(11, 71, 63, 0.1);
        box-shadow: 0 0 20px 0 rgba(11, 71, 63, 0.1)
    }

    .inside-1 .classifyAside .titleBig {
        font-size: 16px;
        padding: 20px 0;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px
    }

    .inside-1 .classifyAside .list {
        -webkit-box-shadow: 0 0 20px 0 rgba(11, 71, 63, 0.1);
        box-shadow: 0 0 20px 0 rgba(11, 71, 63, 0.1);
        position: relative;
        z-index: 9
    }

    .inside-1 .classifyAside .list > li > a {
        font-size: 14px;
        line-height: 30px
    }

    .inside-1 .classifyAside .list .child {
        padding-top: 10px;
        padding-bottom: 10px
    }

    .inside-1 .classifyAside .list .child a {
        font-size: 14px;
        line-height: 20px
    }

    .inside-1 .classifyAside .list .child a:before {
        top: 15px
    }

    .inside-1 .rightCon {
        width: 100%;
        padding: 0
    }
}

.product .common-page {
    padding-top: 40px
}

@media screen and (max-width: 1023px) {
    .product .common-page {
        padding-top: 20px
    }
}

.listProduct {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-right: -10px
}

.listProduct li {
    width: 33.33333333%;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 20px
}

.listProduct .box {
    min-height: 100%;
    display: block;
    -webkit-box-shadow: 0 0 8px 0 #dedede;
    box-shadow: 0 0 8px 0 #dedede;
    text-align: center;
    padding: 5%
}

.listProduct .pic {
    overflow: hidden;
    position: relative
}

.listProduct .pic::after {
    content: "";
    display: block;
    padding-top: 100%
}

.listProduct .title {
    color: #333;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px
}

.listProduct .box:hover {
    background-color: #efefef
}

.listProduct .box:hover .title {
    color: var(--main-color)
}

@media screen and (max-width: 1023px) {
    .listProduct .title {
        font-size: 14px
    }

    .listProduct .box {
        -webkit-box-shadow: none;
        box-shadow: none
    }
}

.product-show .large {
    width: 100%;
    border: 1px #ededed solid;
    background: #fff;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    position: relative
}

.product-show .large .box {
    display: block;
    position: relative
}

.product-show .large .box:after {
    content: "";
    display: block;
    padding-top: 100%
}

.product-show .large .playBtn {
    width: 60px;
    height: 60px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 60px 60px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.product-show .large .swiper-pagination {
    display: none
}

.product-show .small {
    overflow: hidden;
    margin-top: 20px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 35px;
    padding-right: 35px;
    position: relative
}

.product-show .small .list {
    margin-left: -4px;
    margin-right: -4px
}

.product-show .small li {
    width: 20%;
    padding-left: 4px;
    padding-right: 4px
}

.product-show .small .swiper-button-prev, .product-show .small .swiper-button-next {
    display: none;
    background: #a7a7a7;
    width: 15px;
    height: 100%;
    color: #fff;
    top: 0;
    margin-top: 0
}

.product-show .small .swiper-button-prev:after, .product-show .small .swiper-button-next:after {
    font-size: 18px;
    opacity: 1
}

.product-show .small .swiper-button-prev:hover, .product-show .small .swiper-button-next:hover {
    color: var(--main-color)
}

.product-show .small .swiper-button-prev {
    left: 0
}

.product-show .small .swiper-button-next {
    right: 0
}

.product-show .small .box {
    max-height: 90px;
    border: 1px #ededed solid;
    background: #fff;
    overflow: hidden;
    cursor: pointer;
    display: block;
    position: relative
}

.product-show .small .box img {
    -webkit-transition: all .5s;
    transition: all .5s
}

.product-show .small .box:after {
    content: "";
    display: block;
    padding-top: 100%
}

.product-show .small .box:before {
    content: "";
    display: none;
    -webkit-box-shadow: 0 0 0 2px var(--main-color) inset;
    box-shadow: 0 0 0 2px var(--main-color) inset;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0
}

.product-show .small .box:hover {
    border-color: #000
}

.product-show .small .box:hover img {
    -webkit-transform: translate(1.1);
    transform: translate(1.1)
}

.product-show .small .swiper-slide-thumb-active .box {
    border-color: #000
}

.product-show .small .swiper-container-initialized .list {
    margin-left: 0;
    margin-right: 0
}

.product-show .small .swiper-container-initialized li {
    padding-left: 0;
    padding-right: 0
}

.product-show .hd {
    padding-top: 20px;
    padding-bottom: 60px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.product-show .hd .left {
    width: 40%;
    float: left
}

.product-show .hd .leftC {
    position: -webkit-sticky;
    position: sticky;
    top: 120px;
    left: 0
}

.product-show .hd .right {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 60%;
    padding-left: 70px;
    float: right
}

.product-show .hd .title-show {
    font-weight: 400;
    color: #252b30;
    font-size: 20px;
    line-height: 1.2;
    margin-bottom: 20px;
    position: relative
}

.product-show .hd .title-show .collect {
    float: right;
    position: absolute;
    top: 3px;
    right: 0
}

.product-show table td {
    padding: 5px 10px;
    border: 1px solid #ddd;
    word-break: break-all
}

.product-show .tabs {
    padding-top: 40px;
    line-height: 2
}

.product-show .menuTabs {
    border: 1px solid #f0f0f0;
    color: #4b4b4b;
    margin-bottom: 30px
}

.product-show .menuTabs .listMenu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.product-show .menuTabs .listMenu li {
    border-right: 1px solid #f0f0f0
}

.product-show .menuTabs .listMenu a, .product-show .menuTabs .listMenu span {
    cursor: pointer;
    color: #333;
    display: block;
    min-width: 160px;
    font-size: 16px;
    text-align: center;
    padding: 0 10px;
    line-height: 54px;
    position: relative
}

.product-show .menuTabs .listMenu a::after, .product-show .menuTabs .listMenu span::after {
    content: "";
    display: block;
    width: 0;
    height: 3px;
    background: #333;
    position: absolute;
    top: 0;
    left: 0
}

.product-show .menuTabs .listMenu a:hover, .product-show .menuTabs .listMenu span:hover {
    color: var(--main-color)
}

.product-show .menuTabs .listMenu .active a, .product-show .menuTabs .listMenu .active span {
    color: #333
}

.product-show .menuTabs .listMenu .active a::after, .product-show .menuTabs .listMenu .active span::after {
    width: 100%
}

.product-show .conTabs .item {
    display: none
}

.product-show .conTabs .item.show {
    display: block
}

.product-show .Empower-Title {
    background: #f8f7f5;
    border-left: 3px #ea0029 solid;
    line-height: 40px;
    padding-left: 20px;
    font-size: 18px;
    color: #252525;
    font-weight: 700;
    margin-top: 15px;
    margin-bottom: 15px
}

.product-show .Empower-Title1 {
    background: #f8f7f5;
    line-height: 40px;
    padding-left: 20px;
    font-size: 16px;
    color: #252525;
    font-weight: 600;
    margin-top: 15px;
    margin-bottom: 15px
}

.product-show .message {
    padding-bottom: 0
}

@media screen and (max-width: 1023px) {
    .product-show .hd {
        padding-top: 0;
        padding-bottom: 40px
    }

    .product-show .hd .left {
        width: 100%
    }

    .product-show .hd .right {
        width: 100%;
        padding: 20px 0 0 0
    }

    .product-show .large {
        position: relative
    }

    .product-show .large .swiper-pagination {
        display: block;
        position: absolute;
        left: initial;
        bottom: 15px;
        right: 15px;
        width: 50px;
        height: 24px;
        line-height: 24px;
        border-radius: 12px;
        text-align: center;
        background: rgba(0, 0, 0, 0.3);
        font-size: 14px;
        color: #fff
    }

    .product-show .small {
        display: none
    }

    .product-show .prev-next-return-2 {
        display: none
    }

    .product-show .tabs {
        margin-top: 0;
        padding-top: 16px;
        position: relative
    }

    .product-show .tabs::before {
        content: "";
        display: block;
        width: 100vw;
        height: 16px;
        background: #f8f8f8;
        position: absolute;
        top: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    .product-show .menuTabs {
        border: none;
        margin-bottom: 30px
    }

    .product-show .menuTabs .listMenu {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .product-show .menuTabs .listMenu li {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        border-right: none;
        text-align: center
    }

    .product-show .menuTabs .listMenu a, .product-show .menuTabs .listMenu span {
        display: inline-block;
        min-width: auto;
        font-size: 14px;
        font-weight: 700;
        padding-left: 0;
        padding-right: 0;
        position: relative
    }

    .product-show .menuTabs .listMenu a::after, .product-show .menuTabs .listMenu span::after {
        height: 2px;
        top: initial;
        bottom: 0
    }

    .product-show .menuTabs .listMenu a:hover, .product-show .menuTabs .listMenu span:hover {
        color: var(--main-color)
    }
}

.solution-show {
    padding-top: 80px;
    padding-bottom: 80px
}

.solution-show .hd {
    padding-bottom: 60px
}

.solution-show .hd .left {
    width: 100%;
    padding-bottom: 40px
}

.solution-show .hd .leftC {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.solution-show .hd .right {
    width: 100%
}

.solution-show .hd .title-show {
    font-weight: 700;
    font-weight: 400;
    color: #252b30;
    font-size: 20px;
    line-height: 1.2;
    margin-bottom: 20px;
    position: relative;
    padding-right: 80px
}

.solution-show .hd .shareBtn {
    font-size: 14px;
    color: #666;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 24px;
    vertical-align: top;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0
}

.solution-show .hd .shareBtn .icon {
    margin-left: 5px
}

.solution-show .hd .shareBtn svg {
    width: 24px;
    height: 24px;
    vertical-align: top
}

.solution-show .hd .shareBtn .drop {
    display: none;
    opacity: 0;
    visibility: hidden;
    color: #000;
    text-align: center;
    font-size: 14px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: initial;
    padding-bottom: 4px;
    min-width: 120px;
    padding-top: 10px;
    position: absolute;
    top: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transition: .5s;
    transition: .5s;
    background: #fff
}

.solution-show .hd .shareBtn .drop img {
    width: 32px;
    height: 32px;
    vertical-align: top
}

.solution-show .hd .shareBtn .drop a:hover {
    opacity: .8
}

.solution-show .hd .shareBtn .dropC {
    padding: 20px 20px;
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    position: relative;
    z-index: 1
}

.solution-show .hd .shareBtn .dropC:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    width: 10px;
    height: 10px;
    background: #fff;
    position: absolute;
    z-index: -1;
    top: -4px;
    left: 50%;
    -webkit-transform: translateX(-50%) rotate(45deg);
    transform: translateX(-50%) rotate(45deg)
}

.solution-show .hd .shareBtn:hover .drop {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateX(-50%) translateY(0);
    transform: translateX(-50%) translateY(0);
    display: block
}

.solution-show .hd .shareBtn:hover {
    color: var(--main-color)
}

.solution-show .hd .shareBtn:hover path {
    stroke: var(--main-color)
}

.solution-show .hd .jieshao {
    color: #666
}

.solution-show .large {
    width: 80%;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-right: 30px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    position: relative
}

.solution-show .large .largeC {
    border: 1px solid #eee
}

.solution-show .large .box {
    height: 500px;
    display: block;
    position: relative
}

.solution-show .large .playBtn {
    width: 60px;
    height: 60px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 60px 60px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.solution-show .large .swiper-pagination {
    display: none
}

.solution-show .small {
    overflow: hidden;
    width: 107px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 25px;
    padding-bottom: 25px;
    position: relative
}

.solution-show .small .swiper-container {
    height: 450px
}

.solution-show .small .swiper-button-prev, .solution-show .small .swiper-button-next {
    display: none;
    background: #a7a7a7;
    width: 100%;
    height: 15px;
    color: #fff;
    top: initial;
    left: 0;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-top: 0
}

.solution-show .small .swiper-button-prev:after, .solution-show .small .swiper-button-next:after {
    font-size: 18px;
    opacity: 1;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.solution-show .small .swiper-button-prev:hover, .solution-show .small .swiper-button-next:hover {
    color: var(--main-color)
}

.solution-show .small .swiper-button-prev {
    top: 0
}

.solution-show .small .swiper-button-next {
    bottom: 0
}

.solution-show .small .box {
    width: 107px;
    height: 82px;
    border: 1px #fff solid;
    background: #fff;
    overflow: hidden;
    cursor: pointer;
    display: block;
    position: relative
}

.solution-show .small .box img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: all .5s;
    transition: all .5s
}

.solution-show .small .box:hover {
    border-color: var(--main-color)
}

.solution-show .small .box:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

.solution-show .small .swiper-slide-thumb-active .box {
    border-color: var(--main-color)
}

.solution-show .small .swiper-container-initialized .list {
    margin-left: 0;
    margin-right: 0
}

.solution-show .small .swiper-container-initialized li {
    padding-left: 0;
    padding-right: 0
}

.solution-show .nr-show {
    padding-top: 40px
}

@media screen and (max-width: 1023px) {
    .solution-show {
        padding-bottom: 40px
    }

    .solution-show .hd {
        padding-top: 0;
        padding-bottom: 0
    }

    .solution-show .hd .left {
        width: 100%;
        padding: 0
    }

    .solution-show .hd .right {
        width: 100%;
        padding: 20px 0 0 0
    }

    .solution-show .hd .shareBtn .drop {
        min-width: 80px
    }

    .solution-show .large {
        padding: 0;
        position: relative
    }

    .solution-show .large .box {
        height: auto
    }

    .solution-show .large .box::after {
        content: "";
        display: block;
        padding-top: 76.47058824%
    }

    .solution-show .large .swiper-pagination {
        display: block;
        position: absolute;
        left: initial;
        bottom: 15px;
        right: 15px;
        width: 50px;
        height: 24px;
        line-height: 24px;
        border-radius: 12px;
        text-align: center;
        background: rgba(0, 0, 0, 0.3);
        font-size: 14px;
        color: #fff
    }

    .solution-show.case-show .large {
        padding: 0;
        position: relative
    }

    .solution-show.case-show .large .box::after {
        padding-top: 60%
    }

    .solution-show .small {
        display: none
    }

    .solution-show .prev-next-return-2 {
        display: none
    }

    .solution-show .tabs {
        margin-top: 0;
        padding-top: 16px;
        position: relative
    }

    .solution-show .tabs::before {
        content: "";
        display: block;
        width: 100vw;
        height: 16px;
        background: #f8f8f8;
        position: absolute;
        top: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    .solution-show .menuTabs {
        border: none;
        margin-bottom: 30px
    }

    .solution-show .menuTabs .listMenu {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .solution-show .menuTabs .listMenu li {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        border-right: none;
        text-align: center
    }

    .solution-show .menuTabs .listMenu a, .solution-show .menuTabs .listMenu span {
        display: inline-block;
        min-width: auto;
        font-size: 14px;
        font-weight: 700;
        padding-left: 0;
        padding-right: 0;
        position: relative
    }

    .solution-show .menuTabs .listMenu a::after, .solution-show .menuTabs .listMenu span::after {
        height: 2px;
        top: initial;
        bottom: 0
    }

    .solution-show .menuTabs .listMenu a:hover, .solution-show .menuTabs .listMenu span:hover {
        color: var(--main-color)
    }
}

.jiaoliu {
    padding-bottom: 80px
}

.jiaoliu .container {
    -webkit-box-shadow: rgba(0, 0, 0, 0.15) 0 0 12px 0;
    box-shadow: rgba(0, 0, 0, 0.15) 0 0 12px 0
}

.jiaoliu .nr {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 3vw;
    padding-bottom: 3vw;
    padding-left: 3vw;
    padding-right: 3vw
}

.jiaoliu .left {
    color: #404040;
    padding-right: 3vw
}

.jiaoliu .left .title {
    font-size: 30px;
    font-weight: 700
}

.jiaoliu .left .info {
    font-size: 16px;
    font-weight: 700
}

.jiaoliu .ewms {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    text-align: center
}

.jiaoliu .ewms > .div-1 {
    padding-left: 20px;
    padding-right: 20px;
    position: relative
}

.jiaoliu .ewms .box {
    max-width: 160px;
    position: relative
}

.jiaoliu .ewms .bt {
    position: relative;
    text-align: center;
    width: 100%;
    -webkit-transition: all .3s;
    transition: all .3s;
    font-size: 14px;
    color: #fff;
    line-height: 36px;
    background: rgba(0, 0, 0, 0.7);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0 10px;
    margin-top: -8px
}

@media screen and (max-width: 1023px) {
    .jiaoliu {
        padding-bottom: 40px
    }

    .jiaoliu .nr {
        padding: 40px 10px
    }

    .jiaoliu .left {
        width: 100%;
        text-align: center;
        padding-bottom: 20px
    }

    .jiaoliu .left .title {
        font-size: 24px
    }

    .jiaoliu .left .info {
        font-size: 14px
    }

    .jiaoliu .right {
        width: 100%;
        padding-top: 20px 0 0 0
    }

    .jiaoliu .ewms > .div-1 {
        width: 50%
    }
}

.prev-next-return-2 .list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-right: -10px
}

.prev-next-return-2 .list li {
    width: 50%;
    padding-left: 10px;
    padding-right: 10px
}

.prev-next-return-2 .list a {
    display: block;
    height: 30px;
    line-height: 28px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1
}

.prev-next-return-2 .list em {
    font-style: inherit
}

.prev-next-return-2 .list span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 80px;
    height: 30px;
    line-height: 28px;
    text-align: center;
    border-radius: 15px;
    border: 1px solid #e9e9e9;
    cursor: pointer;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #657180;
    font-size: 13px;
    margin-right: 10px
}

.common-page {
    clear: both;
    text-align: center;
    font-family: arial;
    line-height: 14px
}

.common-page .page-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.common-page em {
    font-style: normal;
    font-size: 14px;
    line-height: 38px;
    vertical-align: middle
}

.common-page a, .common-page span.cur, .common-page span.active, .common-page span.cpb {
    color: #333;
    display: inline-block;
    text-align: center;
    font-size: 14px;
    min-width: 40px;
    line-height: 40px;
    height: 40px;
    border-radius: 0;
    border: 1px solid #e3e2e8;
    margin: 0 0 0 -1px;
    padding: 0 0;
    vertical-align: middle
}

.common-page a svg, .common-page span.cur svg, .common-page span.active svg, .common-page span.cpb svg {
    fill: #333;
    vertical-align: middle;
    margin-top: -3px;
    margin-right: 5px;
    margin-left: 5px
}

.common-page a.cur, .common-page span.cur.cur, .common-page span.active.cur, .common-page span.cpb.cur, .common-page a.active, .common-page span.cur.active, .common-page span.active.active, .common-page span.cpb.active, .common-page a:hover, .common-page span.cur:hover, .common-page span.active:hover, .common-page span.cpb:hover {
    border-color: var(--main-color);
    background-color: var(--main-color);
    color: #fff
}

.common-page a.cur svg, .common-page span.cur.cur svg, .common-page span.active.cur svg, .common-page span.cpb.cur svg, .common-page a.active svg, .common-page span.cur.active svg, .common-page span.active.active svg, .common-page span.cpb.active svg, .common-page a:hover svg, .common-page span.cur:hover svg, .common-page span.active:hover svg, .common-page span.cpb:hover svg {
    fill: #fff
}

.common-page a.prev:hover, .common-page span.cur.prev:hover, .common-page span.active.prev:hover, .common-page span.cpb.prev:hover, .common-page a.next:hover, .common-page span.cur.next:hover, .common-page span.active.next:hover, .common-page span.cpb.next:hover {
    border-color: var(--main-color);
    background-color: var(--main-color);
    color: #fff
}

.common-page a.prev:hover svg, .common-page span.cur.prev:hover svg, .common-page span.active.prev:hover svg, .common-page span.cpb.prev:hover svg, .common-page a.next:hover svg, .common-page span.cur.next:hover svg, .common-page span.active.next:hover svg, .common-page span.cpb.next:hover svg {
    fill: #fff
}

.common-page input[type="text"] {
    width: 60px;
    padding-left: 10px;
    padding-right: 10px;
    height: 40px;
    line-height: 38px;
    border-radius: 0;
    border: 1px solid #e3e2e8;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #606266;
    background: transparent;
    -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
    transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    vertical-align: top
}

.common-page input[type="text"]:focus {
    border-color: var(--main-color)
}

.common-page span {
    margin-left: 5px;
    margin-right: 5px
}

.common-page .btnSubmitPage {
    padding-left: 10px;
    padding-right: 10px
}

@media screen and (max-width: 1023px) {
    .common-page {
        text-align: center
    }

    .common-page a {
        display: none
    }

    .common-page .prev, .common-page .next {
        display: inline-block
    }
}

.download .common-page {
    padding-top: 80px
}

.download .list li {
    border-bottom: 1px dashed #e7e7e7
}

.download .list .box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    color: #666;
    text-align: center;
    font-size: 16px;
    line-height: 2;
    padding-top: 10px;
    padding-bottom: 10px
}

.download .list .name {
    width: 60%;
    text-align: left;
    padding-right: 10px
}

.download .list .summary {
    width: 10%
}

.download .list .date {
    width: 20%
}

.download .list .size {
    width: 20%
}

.download .list .oper {
    min-width: 80px
}

.download .list .downloadBtn {
    display: inline-block;
    min-width: 80px;
    height: 34px;
    line-height: 34px;
    background: #f2f3f5;
    color: #666;
    border-radius: 3px;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 10px;
    font-size: 14px
}

.download .list .downloadBtn:hover {
    background: var(--main-color);
    color: #fff
}

@media screen and (max-width: 1023px) {
    .download .common-page {
        padding-top: 40px
    }

    .download .list .summary {
        display: none
    }

    .download .list .date {
        display: none
    }

    .download .list .size {
        display: none
    }

    .download .list .name {
        width: auto;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }
}

.download-2 {
    padding-top: 80px;
    padding-bottom: 80px
}

.download-2 .list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px
}

.download-2 .list > li {
    width: 33.33333333%;
    padding-left: 15px;
    padding-right: 15px
}

.download-2 .list .box {
    display: block;
    min-height: 100%;
    border: 1px #dedede solid
}

.download-2 .list .title {
    text-align: center;
    font-weight: 700;
    font-size: 18px;
    height: 50px;
    line-height: 48px;
    border-bottom: 1px #dedede solid;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1
}

.download-2 .list .tabs {
    padding: 20px
}

.download-2 .menuTabs {
    margin-bottom: 10px
}

.download-2 .listMenu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: -5px;
    margin-right: -5px
}

.download-2 .listMenu > li {
    padding-left: 5px;
    padding-right: 5px
}

.download-2 .listMenu span {
    display: block;
    text-align: center;
    border: 1px #f0f0f0 solid;
    color: #333;
    cursor: pointer;
    font-size: 16px;
    font-weight: 700;
    line-height: 46px;
    padding: 0 15px
}

.download-2 .listMenu span:hover {
    border-color: #4b4b4b;
    background-color: #4b4b4b;
    color: #fff
}

.download-2 .listMenu .active span {
    border-color: #4b4b4b;
    background-color: #4b4b4b;
    color: #fff
}

.download-2 .conTabs .item {
    display: none
}

.download-2 .conTabs .item.show {
    display: block
}

.download-2 .list-2 > li {
    padding-bottom: 5px
}

.download-2 .list-2 > li:last-child {
    padding-bottom: 0
}

.download-2 .list-2 a {
    display: block;
    color: #333;
    background: #efefef;
    height: 64px;
    line-height: 64px;
    padding: 0 15px;
    text-align: center;
    font-size: 16px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1
}

.download-2 .list-2 a:hover {
    color: var(--main-color)
}

@media screen and (max-width: 1023px) {
    .download-2 {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .download-2 .list > li {
        width: 100%;
        padding-bottom: 20px
    }

    .download-2 .list > li:last-child {
        padding-bottom: 0
    }

    .download-2 .listMenu li {
        width: auto;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }

    .download-2 .listMenu span {
        height: 50px;
        line-height: 50px;
        font-size: 14px;
    }

    .download-2 .list-2 a {
        height: 50px;
        line-height: 50px;
        font-size: 14px
    }
}

.about {
    padding-top: 80px;
    color: #333;
    font-size: 14px;
    line-height: 2
}

.about .shuju {
    padding-top: 40px;
    padding-bottom: 60px;
    overflow: hidden;
    width: 100%
}

.about .shuju .listShuju {
    margin-left: -10px;
    margin-right: -10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    text-align: center
}

.about .shuju li {
    width: 33.33333333%;
    padding: 0 10px 0 10px;
    border-right: 1px #ccc solid;
    float: left;
    text-align: left;
    font-size: 16px;
    line-height: 1.5;
    position: relative
}

.about .shuju li:last-child {
    border-right: none
}

.about .shuju .box {
    position: relative;
    text-align: center
}

.about .shuju .icon {
    width: 40px;
    height: 40px;
    margin: auto auto 30px auto
}

.about .shuju .num {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    line-height: 1;
    margin-bottom: 30px;
    padding-bottom: 20px;
    position: relative
}

.about .shuju .num::after {
    content: "";
    display: block;
    width: 25px;
    height: 1px;
    background: #323232;
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.about .shuju .num .sub-1 {
    text-align: left;
    font-size: 16px;
    line-height: 1;
    margin-bottom: 5px;
    margin-left: 5px;
    color: #333
}

.about .shuju .num .sub-2 {
    font-size: 46px;
    color: var(--main-color);
    margin-bottom: 5px;
    margin-left: 5px
}

.about .shuju .counter {
    font-weight: 700;
    color: var(--main-color);
    line-height: 1;
    font-size: 60px
}

.about .shuju .title {
    font-size: 20px;
    color: #444;
    margin-bottom: 10px
}

.about .shuju .info {
    font-size: 14px;
    color: #666
}

.about .videoClick {
    cursor: pointer;
    overflow: hidden;
    margin-bottom: 10px;
    position: relative
}

.about .videoClick img {
    vertical-align: top;
    -webkit-transition: .5s;
    transition: .5s
}

.about .videoClick .playBtn {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.2);
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.about .videoClick .playBtn::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 0 10px 16px;
    border-color: transparent transparent transparent #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.about .videoClick:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

@media screen and (max-width: 1023px) {
    .about {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .about .shuju .listShuju li {
        width: 100%;
        border-right: none;
        border-bottom: 1px #ccc solid;
        padding-bottom: 30px;
        margin-bottom: 30px
    }

    .about .shuju .listShuju li:last-child {
        border-bottom: none;
        padding-bottom: 0;
        margin-bottom: 0
    }

    .about .shuju .icon {
        margin-bottom: 10px
    }

    .about .shuju .counter {
        font-size: 26px
    }

    .about .shuju .num .sub-2 {
        font-size: 26px
    }
}

.history {
    padding-top: 80px
}

.history .nr {
    position: relative
}

.history .nr:after {
    content: "";
    display: block;
    border-left: 1px #ccc dotted;
    position: absolute;
    height: 100%;
    left: 50%;
    top: 0
}

.history .list li {
    overflow: hidden;
    margin-bottom: 0;
    position: relative
}

.history .list li:last-child {
    margin-bottom: 0
}

.history .list .box {
    padding: 0 40px;
    text-align: left;
    position: relative;
    width: 50%;
    float: right
}

.history .list .box .icon {
    content: "";
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: #fff;
    border: 1px #eaeaea solid;
    position: absolute;
    z-index: 1;
    top: 8px;
    left: -8px
}

.history .list .box .icon::before {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--main-color)
}

.history .list .year {
    font-size: 30px;
    line-height: 1;
    padding-bottom: 20px;
    position: relative
}

.history .list .year::after {
    content: "";
    display: block;
    width: 0;
    height: 1px;
    background: var(--main-color);
    position: absolute;
    bottom: 0;
    left: 0;
    -webkit-transition: .5s;
    transition: .5s
}

.history .list .info {
    color: #666;
    padding-top: 20px;
    padding-bottom: 20px;
    font-size: 16px
}

.history .list .box:hover .year::after {
    width: 100%
}

.history .list li:nth-child(2n) .box {
    float: left;
    text-align: right
}

.history .list li:nth-child(2n) .box .icon {
    left: initial;
    right: -8px
}

@media screen and (max-width: 1023px) {
    .history {
        padding-top: 40px
    }

    .history .list {
        padding-top: 80px
    }

    .history .list li {
        margin-top: -50px;
        margin-bottom: 10px
    }

    .history .list .box {
        padding-left: 20px;
        padding-right: 0
    }

    .history .list .year {
        font-size: 16px;
        padding-bottom: 10px
    }

    .history .list .info {
        padding-top: 0;
        font-size: 14px
    }

    .history .list li:nth-child(2n) .box {
        padding-left: 0;
        padding-right: 20px
    }
}

.honor {
    padding-top: 80px;
    padding-bottom: 0
}

.honor .list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-right: -10px;
    margin-bottom: 20px
}

.honor .list:last-child {
    margin-bottom: 0
}

.honor .list li {
    width: 20%;
    padding-left: 10px;
    padding-right: 10px
}

.honor .list .box {
    display: block;
    padding: 20px;
    outline: 1px solid #ddd;
    position: relative
}

.honor .list .pic {
    overflow: hidden;
    position: relative
}

.honor .list .pic::after {
    content: "";
    display: block;
    padding-top: 140%
}

.honor .list img {
    -webkit-transition: .5s;
    transition: .5s
}

.honor .list .title {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    height: 44px;
    line-height: 44px;
    background: rgba(0, 0, 0, 0.7);
    color: #fff;
    text-align: center;
    padding: 0 10px;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0
}

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

.honor .list-2 li {
    width: 33.33333333%
}

.honor .list-2 .pic::after {
    padding-top: 70%
}

@media screen and (max-width: 1023px) {
    .honor {
        padding-top: 40px
    }

    .honor .list {
        margin-left: -5px;
        margin-right: -5px
    }

    .honor .list li {
        width: 50%;
        padding-left: 5px;
        padding-right: 5px
    }
}

.huanjing {
    padding-top: 80px;
    padding-bottom: 80px
}

.huanjing .list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-right: -10px
}

.huanjing .list li {
    width: 33.33333333%;
    padding-left: 10px;
    padding-right: 10px
}

.huanjing .list .box {
    display: block;
    padding: 20px;
    outline: 1px solid #ddd
}

.huanjing .list .pic {
    overflow: hidden;
    position: relative
}

.huanjing .list .pic::after {
    content: "";
    display: block;
    padding-top: 70%
}

.huanjing .list img {
    -webkit-transition: .5s;
    transition: .5s
}

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

@media screen and (max-width: 1023px) {
    .huanjing {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .huanjing .list {
        margin-left: -5px;
        margin-right: -5px
    }

    .huanjing .list li {
        width: 50%;
        padding-left: 5px;
        padding-right: 5px;
        padding-bottom: 10px
    }

    .huanjing .list .box {
        padding: 10px
    }
}

.job {
    padding-top: 80px;
    padding-bottom: 80px
}

.job .list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-right: -10px
}

.job .list li {
    width: 33.33333333%;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 20px
}

.job .list .box {
    display: block;
    border: 1px solid #f7f7f7;
    border-radius: 20px 0 20px;
    -webkit-transition: .5s;
    transition: .5s;
    overflow: hidden;
    position: relative
}

.job .list .box::after {
    content: "";
    display: block;
    padding-top: 66.66666667%
}

.job .list .box img {
    -webkit-transition: .5s;
    transition: .5s
}

.job .list .box:hover {
    border-color: var(--main-color)
}

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

@media screen and (max-width: 1023px) {
    .job {
        padding-top: 40px;
        padding-bottom: 20px
    }
}

@media screen and (max-width: 768px) {
    .job .list li {
        width: 50%
    }
}

.contact {
    padding-top: 80px;
    padding-bottom: 80px
}

.contact .lxfs .list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
    text-align: center
}

.contact .lxfs li {
    width: 25%;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 30px
}

.contact .lxfs .box {
    min-height: 100%;
    padding: 8% 5%;
    background: #f6f6f6
}

.contact .lxfs .pic {
    text-align: center;
    padding: 15px 0;
    border-radius: 50%;
    background-color: #fff;
    -webkit-box-shadow: 0 5px 15px 0 rgba(20, 50, 80, 0.4);
    box-shadow: 0 5px 15px 0 rgba(20, 50, 80, 0.4);
    width: 70px;
    height: 70px;
    margin-left: auto;
    margin-right: auto;
    -webkit-transition: all .9s;
    transition: all .9s
}

.contact .lxfs .title {
    text-align: center;
    color: #444;
    font-size: 18px;
    font-weight: bold;
    line-height: 2;
    margin-top: 10px
}

.contact .lxfs .info {
    text-align: center;
    color: #999;
    font-size: 14px;
    line-height: 2
}

.contact .lxfs .box:hover .pic {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

@media screen and (max-width: 1023px) {
    .contact {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .contact .lxfs .list {
        margin-left: -5px;
        margin-right: -5px
    }

    .contact .lxfs .list li {
        width: 50%;
        padding-left: 5px;
        padding-right: 5px;
        padding-bottom: 10px
    }
}

.message {
    position: relative;
    padding-top: 80px;
    padding-bottom: 80px
}

.message .anchor {
    width: 1px;
    height: 1px;
    position: absolute;
    top: -100px;
    left: 0
}

.message .list-form {
    margin-left: -15px;
    margin-right: -15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.message .list-form li {
    width: 100%;
    clear: both;
    padding: 0 15px 30px 15px
}

.message .list-form li:last-child {
    padding-bottom: 0
}

.message .list-form li.col-2 {
    width: 50%
}

.message .list-form .box {
    display: block;
    position: relative
}

.message .list-form .bt {
    font-size: 14px;
    color: #333;
    padding-bottom: 10px;
    text-transform: uppercase
}

.message .list-form .xh {
    margin-left: 5px;
    color: #f20808;
    font-size: 16px
}

.message .list-form .text-form, .message .list-form .textarea-form {
    width: 100%;
    background: #f7f7f7;
    color: #000;
    padding-left: 15px;
    padding-right: 15px;
    font-size: 14px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px #f7f7f7 solid
}

.message .list-form .text-form::-webkit-input-placeholder, .message .list-form .textarea-form::-webkit-input-placeholder {
    color: #999
}

.message .list-form .text-form:-ms-input-placeholder, .message .list-form .textarea-form:-ms-input-placeholder {
    color: #999
}

.message .list-form .text-form:-moz-placeholder, .message .list-form .textarea-form:-moz-placeholder {
    color: #999
}

.message .list-form .text-form:placeholder, .message .list-form .textarea-form:placeholder {
    color: #999
}

.message .list-form .text-form:focus, .message .list-form .textarea-form:focus {
    color: #000;
    border-color: var(--main-color)
}

.message .list-form .text-form {
    height: 44px;
    line-height: 42px
}

.message .list-form .textarea-form {
    padding-top: 10px;
    padding-bottom: 10px;
    height: 130px;
    line-height: 30px;
    vertical-align: top
}

.message .list-form .yzm .box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 540px
}

.message .list-form .yzmBtn {
    display: inline-block;
    margin-left: 10px
}

.message .list-form .yzmBtn img {
    vertical-align: top;
    height: 44px
}

.message .list-form .agree {
    font-size: 14px;
    color: #333
}

.message .list-form .agree .checkboxDiv {
    margin-right: 5px
}

.message .list-form .agree a {
    color: #39f
}

.message .list-form .agree a:hover {
    text-decoration: underline
}

.message .list-form .submit, .message .list-form .reset {
    font-size: 14px;
    display: inline-block;
    min-width: 200px;
    text-align: center;
    line-height: 48px;
    border: 1px #616060 solid;
    margin-right: 20px;
    background: transparent;
    color: #333;
    cursor: pointer;
    overflow: hidden;
    vertical-align: top;
    position: relative;
    z-index: 1
}

.message .list-form .submit:hover, .message .list-form .reset:hover {
    opacity: .8
}

.message .list-form .submit {
    border-color: #222;
    background-color: #222;
    color: #fff
}

.message .list-form .submit:hover {
    background: var(--main-color);
    border-color: var(--main-color)
}

.message .list-form .reset {
    border-color: var(--main-color);
    color: var(--main-color)
}

.message .list-form .reset:hover {
    opacity: .8
}

.message .list-form .verify {
    font-size: 18px;
    height: 44px;
    background-color: #eff0f4;
    position: relative
}

.message .list-form .verify .drag-btn {
    position: absolute;
    left: 0;
    top: 0;
    width: 50px;
    height: 50px;
    border: 1px #e5e5e5 solid;
    background: #fff url(../images/icon/drag-arrow.svg) no-repeat center center;
    background-size: 20px 20px;
    z-index: 2;
    cursor: move
}

.message .list-form .verify .suc-drag-btn {
    background: #fff url(../images/icon/drag-success.svg) no-repeat center center;
    background-size: 30px
}

.message .list-form .verify .drag-progress {
    position: absolute;
    left: 0;
    top: 0;
    height: 50px;
    line-height: 50px;
    width: 0;
    background-color: #7ac23c;
    color: #fff;
    font-size: 18px;
    text-align: center
}

.message .list-form .verify .fix-tips, .message .list-form .verify .verify-msg {
    width: 100%;
    position: absolute;
    right: 0;
    left: 0;
    height: 100%;
    color: #333;
    z-index: 1;
    line-height: 50px;
    padding-left: 50px;
    text-align: center
}

.message .list-form .verify .verify-msg {
    padding-left: 0;
    padding-right: 50px
}

.message .list-form .verify .verify-msg {
    background-color: #7ac23c;
    color: #fff;
    display: none
}

.message .list-form .verifyDiv {
    width: 50%;
    max-width: 400px;
    vertical-align: middle;
    position: relative
}

@media screen and (max-width: 1023px) {
    .message {
        padding-top: 60px;
        padding-bottom: 60px
    }

    .message .titleBig {
        margin-bottom: 30px
    }

    .message .titleBig .title {
        font-size: 24px;
        margin-bottom: 20px
    }

    .message .titleBig .info {
        font-size: 14px
    }

    .message .list-form li {
        padding-bottom: 20px
    }

    .message .list-form li:last-child {
        padding-bottom: 0
    }

    .message .list-form .col-3 {
        width: 100%
    }

    .message .list-form .text-form, .message .list-form .textarea-form {
        font-size: 14px;
        padding-left: 15px;
        padding-right: 15px
    }

    .message .list-form .text-form {
        height: 40px;
        line-height: 40px
    }

    .message .list-form .textarea-form {
        height: 92px;
        line-height: 24px;
        padding-top: 10px;
        padding-bottom: 10px
    }

    .message .list-form .selectDiv select {
        padding-left: 15px;
        padding-right: 15px;
        font-size: 14px;
        border: none;
        height: 40px;
        line-height: 40px
    }

    .message .list-form .xh {
        font-size: 14px;
        left: 10px;
        top: 10px
    }

    .message .list-form .bt {
        font-size: 14px
    }

    .message .list-form .btnDiv {
        width: 100%;
        padding-top: 20px;
        text-align: center
    }

    .message .list-form .submit, .message .list-form .reset {
        height: 40px;
        line-height: initial;
        font-size: 14px;
        min-width: 120px
    }

    .message .list-form .agree {
        font-size: 14px
    }

    .message .list-form .verifyDiv {
        width: 100%
    }

    .message .list-form .verify {
        font-size: 14px;
        height: 40px;
        max-width: 100%
    }

    .message .list-form .verify .drag-btn {
        width: 40px;
        height: 40px;
        background-size: 14px
    }

    .message .list-form .verify .suc-drag-btn {
        background-size: 14px
    }

    .message .list-form .verify .drag-progress {
        width: 40px;
        height: 40px;
        font-size: 14px;
        text-align: center
    }

    .message .list-form .verify .fix-tips, .message .list-form .verify .verify-msg {
        line-height: 40px;
        padding-left: 40px;
        text-align: center
    }

    .message .list-form .verify .verify-msg {
        padding-left: 0;
        padding-right: 40px
    }
}

.news {
    padding-top: 80px;
    padding-bottom: 80px
}

.news .common-page {
    padding-top: 60px
}

.news .list li {
    border-bottom: 1px #eee solid;
    padding-bottom: 20px;
    margin-bottom: 20px
}

.news .list .box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-shadow: 0 0 15px 0 rgba(142, 142, 142, 0.48);
    box-shadow: 0 0 15px 0 rgba(142, 142, 142, 0.48)
}

.news .list .pic {
    width: 40%;
    padding-right: 30px
}

.news .list .picC {
    overflow: hidden;
    position: relative
}

.news .list .picC:after {
    content: "";
    display: block;
    padding-top: 66.66666667%
}

.news .list .picC img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: .5s;
    transition: .5s
}

.news .list .text {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 60%;
    padding: 40px 20px 20px 0;
    position: relative
}

.news .list .textC {
    position: relative
}

.news .list .title {
    font-size: 16px;
    line-height: 30px;
    font-weight: 400;
    margin-bottom: 20px;
    padding-right: 120px;
    max-height: 60px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2
}

.news .list .info {
    font-size: 14px;
    line-height: 24px;
    color: #666;
    margin-bottom: 20px;
    max-height: 48px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2
}

.news .list .date {
    color: #999;
    position: absolute;
    top: 0;
    right: 0
}

.news .list .fl {
    display: inline-block;
    vertical-align: top;
    position: relative;
    line-height: 24px;
    max-width: 100%;
    padding: 0 8px;
    border: 1px solid #e5e5e5;
    border-radius: 5px;
    color: #999;
    font-size: 12px;
    word-break: keep-all;
    overflow: hidden;
    z-index: 2
}

.news .list .box:hover .pic img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

.news .list .box:hover .title {
    color: var(--main-color)
}

@media screen and (max-width: 1023px) {
    .news {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .news .common-page {
        padding-top: 20px
    }

    .news .list .box {
        -webkit-box-shadow: none;
        box-shadow: none
    }

    .news .list .pic {
        padding-right: 20px
    }

    .news .list .text {
        padding: 0 20px 0 0
    }

    .news .list .title {
        padding-right: 0;
        font-size: 16px;
        line-height: 24px;
        max-height: 48px;
        margin-bottom: 10px
    }

    .news .list .date {
        position: static;
        margin-bottom: 10px
    }

    .news .list .info {
        margin-bottom: 10px
    }
}

@media screen and (max-width: 768px) {
    .news .list .pic {
        width: 100%;
        padding: 0;
        margin-bottom: 10px
    }

    .news .list .text {
        width: 100%
    }
}

.news-show {
    padding-top: 80px;
    padding-bottom: 80px;
    line-height: 2
}

.news-show .title-show {
    font-size: 20px;
    color: #333;
    font-weight: 400;
    margin-bottom: 20px
}

.news-show .js-show {
    font-size: 14px;
    color: #666;
    margin-bottom: 20px
}

.news-show .info-show {
    font-size: 14px;
    color: #999
}

.news-show .info-show > span {
    margin-right: 10px
}

.news-show .info-show > span:last-child {
    margin-right: 0
}

.news-show .nr-show {
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid #ebebeb;
    border-bottom: 1px dashed #efefef;
    padding-bottom: 50px;
    margin-bottom: 50px
}

.news-show img {
    max-width: 100%
}

.news-show .source-share {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    line-height: 24px;
    color: #666;
    padding-bottom: 20px
}

.news-show .source-share .source {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.news-show .shareBtn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 24px;
    vertical-align: top;
    cursor: pointer;
    position: relative
}

.news-show .shareBtn .icon {
    margin-left: 5px
}

.news-show .shareBtn svg {
    width: 24px;
    height: 24px;
    vertical-align: top
}

.news-show .shareBtn .drop {
    display: none;
    opacity: 0;
    visibility: hidden;
    color: #000;
    text-align: center;
    font-size: 14px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: initial;
    padding-bottom: 4px;
    min-width: 120px;
    padding-top: 10px;
    position: absolute;
    top: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transition: .5s;
    transition: .5s;
    background: #fff
}

.news-show .shareBtn .drop img {
    width: 32px;
    height: 32px;
    vertical-align: top
}

.news-show .shareBtn .drop a:hover {
    opacity: .8
}

.news-show .shareBtn .dropC {
    padding: 20px 20px;
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    position: relative;
    z-index: 1
}

.news-show .shareBtn .dropC:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    width: 10px;
    height: 10px;
    background: #fff;
    position: absolute;
    z-index: -1;
    top: -4px;
    left: 50%;
    -webkit-transform: translateX(-50%) rotate(45deg);
    transform: translateX(-50%) rotate(45deg)
}

.news-show .shareBtn:hover .drop {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateX(-50%) translateY(0);
    transform: translateX(-50%) translateY(0);
    display: block
}

.news-show .shareBtn:hover {
    color: var(--main-color)
}

.news-show .shareBtn:hover path {
    stroke: var(--main-color)
}

.news-show .tags {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -10px;
    padding-bottom: 30px
}

.news-show .tags a {
    display: inline-block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 24px;
    line-height: 22px;
    border: 1px solid #c7c7c7;
    margin-right: 10px;
    padding: 0 10px;
    border-radius: 3px;
    color: #6f6f6f;
    font-size: 14px
}

@media screen and (max-width: 1023px) {
    .news-show {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .news-show .shareBtn .drop {
        min-width: 80px
    }
}

.prev-next-return .list li {
    padding-bottom: 20px
}

.prev-next-return .list li:last-child {
    padding-bottom: 0
}

.prev-next-return .list .box {
    display: block;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1
}

.prev-next-return .list .box:hover {
    color: var(--main-color);
    text-decoration: underline
}

.prev-next-return em {
    font-style: initial
}

.prev-next-return .return {
    padding-top: 30px
}

.prev-next-return .return a {
    text-align: center;
    display: inline-block;
    vertical-align: top;
    border: 1px #eee solid;
    padding: 5px 20px;
    border-radius: 5px
}

.prev-next-return .return a:hover {
    background: var(--main-color);
    color: #fff;
    border-color: var(--main-color)
}

.relatedNews {
    background: #f7f7f7;
    padding-top: 80px;
    padding-bottom: 80px
}

@media screen and (max-width: 1023px) {
    .relatedNews {
        padding-top: 40px;
        padding-bottom: 40px
    }
}

.listNews {
    margin-left: -5px;
    margin-right: -5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.listNews li {
    width: 25%;
    padding: 0 5px 40px 5px
}

.listNews .box {
    min-height: 100%;
    display: block;
    overflow: hidden;
    padding: 20px;
    background-color: #fff;
    -webkit-transition: .5s;
    transition: .5s
}

.listNews .pic {
    overflow: hidden;
    position: relative
}

.listNews .pic::after {
    content: "";
    display: block;
    padding-top: 66.66666667%
}

.listNews .pic img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: .5s;
    transition: .5s
}

.listNews .text {
    padding-top: 20px
}

.listNews .title {
    color: #333;
    font-size: 16px;
    line-height: 24px;
    max-height: 48px;
    font-weight: 400;
    margin-bottom: 10px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2
}

.listNews .date {
    color: #999
}

.listNews .info {
    color: #666;
    line-height: 24px;
    height: 48px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2
}

.listNews .fl-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.listNews .fl {
    display: inline-block;
    position: relative;
    height: 26px;
    line-height: 24px;
    max-width: 100%;
    padding: 0 8px;
    border: 1px solid #e5e5e5;
    margin-top: 12px;
    margin-right: 15px;
    border-radius: 5px;
    color: #999;
    font-size: 12px;
    word-break: keep-all;
    overflow: hidden;
    z-index: 2
}

.listNews .btnDiv {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-top: 20px;
    text-align: right
}

.listNews .btnDiv .icon {
    width: 24px;
    height: 11px;
    display: inline-block;
    vertical-align: top;
    position: relative
}

.listNews .btnDiv .icon::before {
    content: "";
    display: block;
    background: url(../images/icon/arrow-right.svg) no-repeat center center;
    background-size: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transition: .5s;
    transition: .5s
}

.listNews .btnDiv .icon::after {
    content: "";
    display: block;
    background: url(../images/icon/arrow-right.svg) no-repeat center center;
    background-size: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: -30px;
    opacity: 0;
    -webkit-transition: .5s;
    transition: .5s
}

.listNews .box:hover {
    -webkit-box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1)
}

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

.listNews .box:hover .title {
    color: var(--main-color)
}

.listNews .box:hover .btnDiv .icon::before {
    left: 30px;
    opacity: 0
}

.listNews .box:hover .btnDiv .icon::after {
    left: 0;
    opacity: 1
}

@media screen and (max-width: 1023px) {
    .listNews {
        margin-left: -5px;
        margin-right: -5px
    }

    .listNews li {
        width: 50%;
        padding-left: 5px;
        padding-right: 5px;
        padding-bottom: 10px
    }

    .listNews .btnDiv {
        display: none
    }

    .listNews .box {
        padding: 10px;
        background: #fff
    }

    .listNews .text {
        padding-top: 20px
    }
}

.relatedProduct {
    background: #f7f7f7;
    padding-top: 80px;
    padding-bottom: 80px
}

.relatedProduct .list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-right: -10px
}

.relatedProduct .list li {
    width: 25%;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 20px
}

.relatedProduct .list .box {
    background-color: #fff;
    display: block;
    padding: 5%;
    position: relative
}

.relatedProduct .list .pic {
    overflow: hidden;
    position: relative
}

.relatedProduct .list .pic::after {
    content: "";
    display: block;
    padding-top: 100%
}

.relatedProduct .list .text {
    padding-top: 20px
}

.relatedProduct .list .line-top {
    background: #000;
    margin: auto;
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 1;
    width: 0;
    height: 2px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transition: .5s;
    transition: .5s
}

.relatedProduct .list .line-right {
    background: #000;
    position: absolute;
    top: 50%;
    right: 0;
    z-index: 1;
    width: 2px;
    height: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: .5s;
    transition: .5s
}

.relatedProduct .list .line-bottom {
    background: #000;
    margin: auto;
    position: absolute;
    bottom: 0;
    left: 50%;
    z-index: 1;
    width: 0;
    height: 2px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transition: .5s;
    transition: .5s
}

.relatedProduct .list .line-left {
    background: #000;
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 1;
    width: 2px;
    height: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: .5s;
    transition: .5s
}

.relatedProduct .list .title {
    font-size: 16px;
    height: 30px;
    line-height: 30px;
    font-weight: 700;
    text-align: center;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1
}

.relatedProduct .list .box:hover .line-top {
    width: 100%
}

.relatedProduct .list .box:hover .line-right {
    height: 100%
}

.relatedProduct .list .box:hover .line-bottom {
    width: 100%
}

.relatedProduct .list .box:hover .line-left {
    height: 100%
}

@media screen and (max-width: 1023px) {
    .relatedProduct {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .relatedProduct .list {
        margin-left: -5px;
        margin-right: -5px
    }

    .relatedProduct .list li {
        width: 50%;
        padding-left: 5px;
        padding-right: 5px;
        padding-bottom: 10px
    }

    .relatedProduct .list .box {
        padding: 10px
    }

    .relatedProduct .list .text {
        padding-top: 10px
    }
}

.relatedCase {
    background: #f7f7f7;
    padding-top: 80px;
    padding-bottom: 80px
}

.relatedCase .list {
    margin-left: -20px;
    margin-right: -20px
}

.relatedCase .list .box {
    background: #fff
}

.relatedCase .list .col-4-1 {
    padding-left: 20px;
    padding-right: 20px
}

@media screen and (max-width: 1023px) {
    .relatedCase {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .relatedCase .list {
        margin-left: -10px;
        margin-right: -10px
    }

    .relatedCase .list .text {
        padding-left: 10px;
        padding-right: 10px
    }

    .relatedCase .list .col-4-1 {
        padding-left: 10px;
        padding-right: 10px
    }
}

.contact .lxfs .info a {
    color: #999;
}
