.main {
    overflow: hidden;
    background: #f5f5f5;
}

.main .siderBar {
    width: 260px;
}

.main .news-main.siderCont {
    width: 100%;
}

.main .siderCont {
    width: calc(100% - 320px);
    width: 100%;
}
.case-main .siderCont{
    width: calc(100% - 320px);
}
.main .product-wrap .wrapper>.siderCont{
    width: 100%;
}
.main .product-wrap .wrapper>.siderCont .product-list{
    margin-right: -20px;
}
.pagebar .pagination {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}
.pagination a {
  background: #fff;
  border: 1px solid #ccc;
  color: #333;
  font-size: 14px;
  padding: 8px 12px;
  margin: 0 5px;
  border-radius: 3px;
}
.pagination span {
    color: #333;
    font-size: 14px;
    padding: 8px 2px;
    margin: 0 5px;
    border-radius: 3px;
}
.pagination a:hover {
  color: #4fc08d;
  border: 1px solid #4fc08d;
}
.pagination a.page-num-current {
  color: #fff;
  background: #4fc08d;
  border: 1px solid #4fc08d;
}
.main .product-wrap .wrapper>.siderCont .product-list>.item{
    width: calc(100%/4 - 20px);
    background-color: #ffffff;
    border-radius: 5px;
    -webkit-box-shadow: 0 4px 10px 0 rgba(34,41,77,.15);
    -moz-box-shadow: 0 4px 10px 0 rgba(34,41,77,.15);
    box-shadow: 0 4px 10px 0 rgba(34,41,77,.15);
}
.flex {
    display: flex;
    flex-wrap: wrap;
}

[flex-align="start"] {
    justify-content: flex-start;
}

[flex-align="center"] {
    justify-content: center;
}

[flex-align="end"] {
    justify-content: flex-end;
}

[flex-align="justify"] {
    justify-content: space-between;
}

.inner-nav-list a {
    font-size: 1rem;
    padding: 0px 0px 0px 15px;
}

.contact-tit {
    width: 270px;
    height: 60px;
    border: 1px solid #e9b001;
    border-radius: 30px;
    text-align: center;
    padding: 5px;
    margin: 55px auto;
}

.contact-tit span {
    font-size: 14px;
    color: #929292;
}

.contact-box p {
    text-align: center;
    font-size: 16px;
}

.contact-box img {
    width: inherit;
    display: inline-block;
    margin-right: 15px;
}
.dt {
    margin-bottom: 40px;
}
.left {
    float: left
}

.right {
    float: right
}

.clearfix:before,.clearfix:after {
    content: "";
    display: table
}

.clearfix:after {
    clear: both;
}

.product-con .pro-pic {
    width: 300px;
    margin-right: 30px;
    position: relative;
}
.product-con .pro-pic .bd .tempWrap>ul>li{border-radius: 5px;overflow: hidden;}
.product-con .pro-pic .prev,.product-con .pro-pic .next{
    background-image: url(../images/Common/pre-next-green.png);
    width: 15px;
    height: 30px;
    display: block;
    position: absolute;
    top: 50%;
    z-index: 2;
}
.product-con .pro-pic .prev{background-position:left center;left: 10px;}
.product-con .pro-pic .next{background-position:right center;right: 10px;}
.product-con .pro-desc {
    width: calc(100% - 330px);
}
.product-con .pro-desc h1{font-weight: 600;margin-bottom: 15px;}
.product-con .pro-desc h3 {
    font-size: 30px;
    line-height: 1;
    color: #333;
}

.product-con .pro-desc .p {
    margin-top: 15px;
    line-height: 30px;
    text-align: justify;
    font-size: 16px;
    text-indent: 2em;
}

.product-detail h4 {
    font-size: 32px;
    text-align: center;
    border-bottom: 1px solid #9999;
    padding: 30px 0;
    margin-bottom: 30px;
    color: #333;
}
.product-detail-desc .ico{
    width: 300px;
    margin-right: 30px;
}

.product-detail-desc .item .i{width: 24%;float: left;text-align: center;background-color: #f7b400;margin-right: 1%;margin-bottom: 1%;line-height: 50px;border-radius: 10px;font-size: 16px;}

.product-detail-desc .txt{width: 100%;}
.product-detail-desc .txt h1{
    font-size: 36px;
    line-height: 1;
    margin-bottom: 15px;
}
.product-detail-desc .txt h2{
    margin: 20px 0;
}
.product-detail-desc .txt .desc_a{
    text-align: justify;
    text-indent: 2em;
    line-height: 30px;
    margin-bottom: 30px;
}
.product-detail-desc .txt .desc_b{
    margin-bottom: 30px;
}
.product-detail-desc .txt .desc_b .table table{
    background-color: #f7b400;
}
.product-detail-desc .txt .desc_b .table table td{
    border: 1px solid #fff;
}
.product-detail-desc .case-show ul:before,.product-detail-desc .case-show ul:after,.product-detail-desc .item:before,.product-detail-desc .item:after{content:"";display:table}
.product-detail-desc .case-show ul:after,.product-detail-desc .item:after{clear:both;}
.product-detail-desc .case-show ul{
    margin-right: -15px;
}
.product-detail-desc .case-show ul li{
    float: left;
    margin-right: 15px;
    width: calc(100% / 3 - 15px);
    text-align: center;
}
.product-detail-desc .case-show ul li img{
    margin-bottom: 15px;
}
.product-main{
    margin-top: 10px;
}
@media(max-width: 1200px) {
    .main {
        background:#f6f6f6;
    }

    .main .siderBar {
        display: none;
    }

    .main .siderCont {
        width: 100%;
    }

    .sm-hidden {
        display: none;
    }
}

/*--end layout--*/
/*--banner--*/
.banner {
    position: relative;
    width: 100%;
    height: 500px;
    clear: both;
    overflow: hidden;
    background: #e5e5e5;
}

.banner .pic {
    overflow: hidden;
}

.banner .pic img {
    position: relative;
    left: 50%;
    width: 1920px;
    transform: translateX(-50%);
}

.banner .text {
    position: absolute;
    z-index: 1;
    top: 50%;
    padding-top: 40px;
    width: 100%;
    text-align: center;
    color: #fff;
    transform: translateY(-50%);
}

.banner .text em {
    display: block;
    font-size: 0.75rem;
    font-family: "DIN Medium";
    animation: fadeInUp 1s;
}

.banner .text h1 {
    margin-top: 0.5rem;
    font-size: 2.625rem;
    line-height: 1.25;
    animation: fadeInUp 1.5s;
}
.product-app .banner .text h1 {color:#333;}
.banner[data-color="white"] .text {
    color: #fff;
}

.banner[data-color="black"] .text {
    color: #000;
}

@media(max-width: 1200px) {
    .banner {
        display:none;
    }
}

/*--end banner--*/
/*--menus-wrap--*/
.menus-wrap {
    line-height: 6rem;
    overflow: hidden;
    background: #fff;
}

.menus-wrap .inner {
    position: relative;
    display: flex;
    justify-content: space-between;
}

.menus-wrap .inner:after {
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    content: "";
    background: #e5e5e5;
}

.menus-list {
    float: right;
}

.menus-list li {
    position: relative;
    margin-right: 15px;
    width: auto;
    font-size: 16px;
    color: #999;
    float: left;
    line-height: 28px;
}

.menus-list li.cur a:after,.menus-list li:hover a:after{content:"";display:block;border-bottom:2px solid #cf261c;}
.menus-list li:last-child {
    margin-right: 0;
}

.menus-list li a {
    display: block;
    color: #333;
    font-weight: 600;
}


.menus-list li:hover a,.menus-list li.cur a {
    color: #cf261c;
}

.menus-wrap .crumbs-list {
    display: none;
}

@media(max-width: 992px) {
    .menus-wrap {
        margin-bottom:1.25rem;
        line-height: 5.625rem;
    }

    .menus-wrap .inner:after {
        display: none;
    }

    .menus-list {
        width: 100%;
    }

    .menus-wrap .crumbs-list {
        display: none;
    }

    .menus-list li {
        margin: 0;
        font-size: 1.5rem;
    }

    .menus-list li a {
        padding: 0 2rem;
    }
}

/*--end menus-wrap--*/
/*--crumbs-wrap--*/
.crumbs-wrap {
    padding: 30px 0;
    line-height: 30px;
    overflow: hidden;
}

.crumbs-wrap.gray {
    background: #f6f6f6;
}

.crumbs-wrap .inner {
    overflow: hidden;
}

.crumbs-list {
    white-space: nowrap;
    color: #333333;
    float: left;
    font-weight: 600;
}
.crumbs-list a {
    display: inline-block;
    font-size: 16px;
    color: #333333;
}

.crumbs-list a:last-child:after {
    display: none;
}

.crumbs-back {
    overflow: hidden;
}

.crumbs-back a {
    display: block;
    font-size: 1rem;
    color: #999;
}

.crumbs-back a:before {
    display: inline-block;
    margin-right: 0.625rem;
    font-family: "iconfont";
    content: "\e67d";
}

.crumbs-back a:hover {
    color: var(--vi-color);
}

@media(max-width: 1200px) {
    .crumbs-wrap {
        display:none;
    }
}

/*--end crumbs-wrap--*/
/*--m-inpage-menu--*/
.m-inpage-menu {
    display: none;
    position: relative;
    z-index: 100;
    margin-bottom: 1.25rem;
    padding: 0 1.25rem;
    background: #fff;
}

.m-inpage-menu .slide-box {
    position: relative;
    z-index: 999;
    padding: 1.125rem 0;
}

.m-inpage-menu .slide-box li {
    position: relative;
    width: auto;
}

.m-inpage-menu .slide-box li:after {
    display: none;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% + 1.25rem);
    content: "";
    background: #fff;
    border-radius: 5px 5px 0 0;
    box-shadow: 0 -5px 6px rgba(0,0,0,0.1);
}

.m-inpage-menu .slide-box li a {
    display: block;
    position: relative;
    padding: 0 1.25rem;
    line-height: 3.75rem;
    font-size: 1.5rem;
    color: #333;
    background: #f6f6f6;
    border-radius: 5px;
}

.m-inpage-menu .slide-box li.cur a {
    color: #fff;
    background: var(--vi-color);
}

.m-inpage-menu .slide-box li[data-drop] a:before {
    display: block;
    float: right;
    margin-left: 1rem;
    font-family: "iconfont";
    content: "\e692";
    color: #dcdcdc;
    transition: all .5s;
}

.m-inpage-menu .slide-box li[data-drop].active:after {
    display: block;
}

.m-inpage-menu .slide-box li[data-drop].active a:before {
    transform: rotateX(-180deg);
}

.m-inpage-menu .slide-box li[data-drop].active a {
    color: #333;
    background: transparent;
}

.m-inpage-menu .dropBox {
    display: none;
    position: absolute;
    z-index: 998;
    top: 100%;
    left: 1.25rem;
    right: 1.25rem;
    padding: 1.25rem;
    overflow: hidden;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 0 1rem rgba(0,0,0,0.1);
}

.m-inpage-menu .drop-item {
    display: none;
    float: left;
    padding: 1.25rem 0 1.25rem 1.25rem;
    width: 15.875rem;
    overflow: hidden;
    background: #f6f6f6;
    border-radius: 5px;
}

.m-inpage-menu .drop-item ul {
    height: 50vh;
    overflow: auto;
}

.m-inpage-menu .drop-item li {
    margin-bottom: 10px;
    height: 3.75rem;
}

.m-inpage-menu .drop-item li:last-child {
    margin-bottom: 0;
}

.m-inpage-menu .drop-item li dt {
    position: relative;
    height: 3.75rem;
    line-height: 3.75rem;
    font-size: 1.5rem;
}

.m-inpage-menu .drop-item li dt:before {
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -1rem;
    width: 3px;
    height: 2rem;
    content: "";
    background: var(--vi-color);
    transform: scaleY(0);
    transition: all .5s;
}

.m-inpage-menu .drop-item li dt a {
    display: block;
    padding: 0 1.625rem;
    color: #666;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.m-inpage-menu .drop-item li dd {
    display: none;
    position: absolute;
    right: 1.25rem;
    top: 1.25rem;
    bottom: 1.25rem;
    padding: 1.25rem;
    width: calc(100% - 18rem);
    height: 50vh;
    overflow: auto;
}

.m-inpage-menu .drop-item li dd a {
    display: block;
    position: relative;
    margin-bottom: 10px;
    padding: 0 1.625rem;
    color: #666;
    height: 3.75rem;
    line-height: 3.75rem;
    font-size: 1.5rem;
    color: #666;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.m-inpage-menu .drop-item li dd a:hover {
    color: #333;
}

.m-inpage-menu .drop-item li.active dt {
    background: #fff;
    border-radius: 5px 0 0 5px;
}

.m-inpage-menu .drop-item li.active dt:before {
    transform: scaleY(1);
}

.m-inpage-menu .drop-item li.active dt a {
    color: #333;
}

.m-inpage-menu .drop-item li.active dd {
    display: block;
}

/**add -20231013*/
.inner-product-detail>.title {
    font-size: 40px;
    text-align: center;
    font-weight: 600;
    margin-top: 50px;
    margin-bottom: 50px;
}
.title.bottom-line:after{display:block;margin: 10px auto 0px;width: 50px;height:5px;content:"";background:var(--vi-color);border-radius:3px;}
.inner-product-detail .desc {
    font-size: 16px;
    text-align: justify;
    margin-bottom: 30px;
    text-indent: 28px;
    line-height: 30px;
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 30px;
}
.inner-product-detail .desc.fz19{font-size:19px;text-align:center;text-indent: 0;}
.cmp-split-tile {
    width: 100%;
    padding: 20px 0px;
    margin: 0 auto;
}

.container-background-white {
    background-color: #fff
}

.container-background-grey {
    background-color: #f5f5f5
}
.container-background-transparent {
    background-color: transparent
}

.cmp-split-tile .card-wrapper {
    display: block;
    width: 100%
}

.cmp-split-tile .card-wrapper .card {
    background: #fff;
    border: 1px solid rgba(234,234,234,1);
    box-shadow: 0 2px 16px 0 rgba(0,0,0,0.07);
    border-radius: 4px;
    flex: 0 0 100%;
    display: flex;
    flex-direction: row;
    margin-bottom: 24px;
    cursor: pointer;
    -webkit-box-shadow: 0 4px 10px 0 rgba(0,0,0,.07);
    -moz-box-shadow: 0 4px 10px 0 rgba(0,0,0,.07);
    -webkit-transition: all .6s;
    transition: all .6s
}

.cmp-split-tile .card-wrapper .tile-card:nth-last-of-type(1) .split-tile.section:nth-last-of-type(1) .card {
    margin-bottom: 0
}

.cmp-split-tile .card-wrapper .card .card-box {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.cmp-split-tile .card-wrapper .card .img-box {
    height: 100%;
    display: flex;
    align-items: center;
    width: auto;
}

.cmp-split-tile .card-wrapper .card .img-wrapper {
    width: 210px;
    height: 148px;
    position: relative;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover
}

.cmp-split-tile .card-wrapper .card .content-wrapper {
    width: calc(100% - 210px);
    color: #505050;
    padding: 24px 24px 24px 20px;
    overflow: hidden
}

.cmp-split-tile .card-wrapper .card .content-wrapper .title {
    font-size: 20px;
    font-weight: 600;
    display: block;
    display: -webkit-box;
    max-width: 95%;
    line-clamp: 1;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 12px
}

.cmp-split-tile .card-wrapper .card .content-wrapper .description {
    line-height: 24px;
    font-size: 16px
}

.cmp-split-tile .card-wrapper .card .content-wrapper .description p {
    display: block;
    display: -webkit-box;
    max-width: 95%;
    line-height: 24px;
    font-size: 16px;
    line-clamp: 3;
    -webkit-line-clamp: 3;
    -moz-line-clamp: 3;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
}

.cmp-split-tile .card-wrapper .card .img-wrapper .btn-explore {
    display: inline-block;
    font-size: .75rem;
    font-weight: 600;
    color: #fff;
    background-color: #d61222;
    border-radius: 25px;
    left: 50%;
    bottom: 0;
    position: absolute;
    transform: translate(-50%,-50%);
    border: 0;
    width: 92px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.cmp-split-tile .card-wrapper .card:hover .img-wrapper .btn-explore {
    background-color: #ff0012;
    border-color: #ff0012
}

.cmp-split-tile .card-wrapper .card .img-wrapper .btn-explore:hover {
    background-color: #ff0012;
    border-color: #ff0012
}

.cmp-split-tile .card-wrapper .card .img-wrapper .btn-explore:active {
    background-color: #ba000d;
    border-color: #ba000d
}

.cmp-split-tile .card-wrapper .card .img-wrapper:hover .btn-explore {
    display: inline-block
}

@media (min-width: 992px) {
    .cmp-split-tile .card-wrapper {
        display: flex;
        flex-wrap: wrap;
    }

    .cmp-split-tile .card-wrapper .tile-card {
        display: inline-block;
        flex-grow: 0;
        flex-shrink: 0;
        flex-basis: calc(50% - 24px);
    }

    .cmp-split-tile .tile-card {
        margin-right: 24px;
    }

    .cmp-split-tile .card-wrapper:not(.card-warp) .tile-card>div {
        height: 100%;
    }
}

@media(max-width: 992px) {
    .m-inpage-menu {
        display:block;
    }
}

/*--end m-inpage-menu--*/
/*--addMore--*/
.addMore {
    display: none;
    text-align: center;
    overflow: hidden;
}

.addMore a {
    display: block;
    line-height: 5rem;
    font-size: 1.5rem;
    color: #999;
    background: #f6f6f6;
    border-radius: 5px;
}

@media(max-width: 992px) {
    .addMore {
        display:block;
    }
}

/*--end addMore--*/
/*--pager--*/
.pager {
    clear: both;
    display: flex;
    margin-top: 3.25rem;
    line-height: 3.125rem;
    overflow: hidden;
    justify-content: center;
}

.pager-num {
    display: flex;
    overflow: hidden;
}

.pager-num a {
    display: block;
    margin-right: 0.625rem;
    width: 3.125rem;
    text-align: center;
    font-size: 1.125rem;
    font-family: "DIN Medium";
    color: #666;
    background: #f6f6f6;
    border-radius: 5px;
}

.pager-num a:hover,.pager-num a.cur {
    color: #fff;
    background: var(--vi-color);
    transition: all .5s;
}

.pager-arrow {
    display: flex;
    overflow: hidden;
}

.pager-arrow a {
    display: block;
    width: 3.125rem;
    text-align: center;
    font-size: 1.125rem;
    font-family: "DIN Medium";
    color: #666;
    background: #f6f6f6;
    border-radius: 5px;
    margin: 0px 10px;
}
.page-num-current{background-color: #19d27a !important;color: #ffffff !important;}
.pager-arrow a:hover {
    color: #fff;
    background: var(--vi-color);
    transition: all .5s;
}

@media(max-width: 992px) {
    .pager {
        display:none;
    }
}

/*--end pager--*/
/*--sideBar--*/
.sider-menu .hd {
    padding: 0 1.25rem;
    line-height: 2.8125rem;
    overflow: hidden;
}

.sider-menu .hd h2 {
    line-height: inherit;
    font-size: 1.25rem;
    color: #333;
}

.sider-menu .hd h2 a {
    color: #333;
}

.sider-menu .bd {
    margin-top: 1rem;
}

.sider-menu .bd dl {
    margin-bottom: 1.25rem;
    overflow: hidden;
}

.sider-menu .bd dl:last-child {
    margin-bottom: 0;
}

.sider-menu .bd dt {
    padding: 0 1.25rem;
    line-height: 3.75rem;
    font-size: 16px;
    border-bottom: 1px solid #f4f4f4;
}

.sider-menu .bd dt a {
    display: block;
    position: relative;
    color: #333;
    text-align: center;
}

.sider-menu .bd dt a:before {
    display: block;
    float: right;
    font-family: "iconfont";
    content: "\e694";
    color: #ccc;
    transition: transform .5s;
}

.sider-menu .bd dl[data-drop] dt a:after {
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    content: "";
    background: #e5e5e5;
    opacity: 0;
}

.sider-menu .bd dl[data-drop] dt a:before {
    content: "\e692";
}

.sider-menu .bd dd {
    display: none;
    padding: 1.25rem;
    overflow: hidden;
}

.sider-menu .bd dd li {
    margin-bottom: 1px;
    height: 3.125rem;
    line-height: 3.125rem;
    font-size: 1rem;
}

.sider-menu .bd dd li a {
    display: block;
    padding: 0 1.25rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-radius: 5px;
}

.sider-menu .bd dd li a:before {
    display: block;
    float: right;
    font-family: "iconfont";
    content: "\e694";
    color: #fff;
}

.sider-menu .bd dl.cur,.sider-menu .bd dl:hover {
    background-color: #f4f4f4;
}

.sider-menu .bd dl[data-drop].cur dt a:before {
    transform: rotate(-180deg);
}

.sider-menu .bd dl[data-drop].cur dt a:after,.sider-menu .bd dl[data-drop]:hover dt a:after {
    opacity: 1;
}

.sider-menu .bd dl.cur dd {
    display: block;
}

.sider-menu .bd dd li a:hover,.sider-menu .bd dd li.cur a {
    color: #fff;
    background: var(--vi-color);
    transition: all .5s;
}

.sider-infos {
    margin-top: 2.5rem;
    padding: 1.5rem;
    text-align: center;
    overflow: hidden;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 0 1.25rem rgba(0,0,0,0.1);
}

.sider-infos i {
    display: block;
    margin: 0 auto;
    width: 140px;
}

.sider-infos span {
    display: block;
    line-height: 30px;
    font-size: 1rem;
    color: #666;
}

.sider-infos em {
    display: block;
    margin-top: 0.5rem;
    font-family: "DIN Medium";
    font-size: 1.25rem;
    line-height: 1.5rem;
    color: #333;
}

.sider-news {
    padding: 0 20px;
    overflow: hidden;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 0 1.25rem rgba(0,0,0,0.1);
}

.sider-news .hd {
    line-height: 3.75rem;
    overflow: hidden;
    border-bottom: #e5e5e5 solid 1px;
}

.sider-news .hd h2 {
    line-height: inherit;
    font-size: 1.25rem;
    color: #333;
}

.sider-news .hd h2 a {
    color: #333;
}

.sider-news .bd {
    padding: 0.625rem 0;
    overflow: hidden;
}

.sider-news .bd li {
    position: relative;
    padding-left: 10px;
    line-height: 2rem;
    font-size: 1rem;
    color: #999;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sider-news .bd li:before {
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -2px;
    content: "";
    width: 4px;
    height: 4px;
    background: #ccc;
    border-radius: 50%;
}

.sider-news .bd li a {
    color: #999;
}

.sider-news .bd li a:hover {
    color: var(--vi-color);
}

.sider-product {
    margin-top: 2.5rem;
    padding: 0 1.25rem;
    overflow: hidden;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 0 1.25rem rgba(0,0,0,0.1);
}

.sider-product .hd {
    line-height: 3.75rem;
    overflow: hidden;
    border-bottom: #e5e5e5 solid 1px;
}

.sider-product .hd h2 {
    line-height: inherit;
    font-size: 1.25rem;
    color: #333;
}

.sider-product .bd {
    padding: 2rem 0;
    overflow: hidden;
}

.sider-product li {
    margin-bottom: 2rem;
    text-align: center;
}

.sider-product li:last-child {
    margin-bottom: 0;
}

.sider-product li a {
    display: block;
}

.sider-product li i {
    display: block;
    overflow: hidden;
}

.sider-product li i img {
    transition: all 1s;
}

.sider-product li span {
    display: block;
    margin-top: 1rem;
    font-size: 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sider-product li:hover i img {
    transform: scale(1.1);
}

.sider-product li:hover span {
    color: var(--vi-color);
}

.sider-tags {
    margin-top: 2.5rem;
    padding: 0 1.25rem;
    overflow: hidden;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 0 1.25rem rgba(0,0,0,0.1);
}

.sider-tags .hd {
    line-height: 3.75rem;
    overflow: hidden;
    border-bottom: #e5e5e5 solid 1px;
}

.sider-tags .hd h2 {
    line-height: inherit;
    font-size: 1.25rem;
    color: #333;
}

.sider-tags .hd h2 a {
    color: #333;
}

.sider-tags .bd {
    padding: 0.625rem 0;
    overflow: hidden;
}

.sider-tags .bd ul {
    display: flex;
    flex-wrap: wrap;
    margin: -0.4rem;
    padding: 0.4rem 0;
    overflow: hidden;
}

.sider-tags .bd li {
    float: left;
    margin: 0.4rem;
    width: calc(100% - 0.8rem);
    flex: none;
    line-height: 2.5rem;
    font-size: 0.875rem;
    color: #999;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sider-tags .bd li a {
    display: block;
    padding: 0 0.75rem;
    color: #999;
    background: #f6f6f6;
    border-radius: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sider-tags .bd li a:hover {
    color: #fff;
    background: var(--vi-color);
}

.sider-back {
    height: 3.75rem;
    line-height: 3.75rem;
    overflow: hidden;
    border-radius: 5px;
}

.sider-back a {
    display: block;
    padding: 0 1.25rem;
    font-size: 1.25rem;
    color: #fff;
    background: var(--vi-color);
    border-radius: 5px;
}

.sider-back a:before {
    display: block;
    float: right;
    font-family: "iconfont";
    content: "\e624";
}

.sider-back a:hover {
    background: #000;
}

/*--sideBar--*/
/*--subNav--*/
.subNav {
    margin-top: 1rem;
    margin-bottom: 2rem;
    padding: 0 10px;
    height: 3.75rem;
    line-height: 3.75rem;
    overflow: hidden;
    background: #f6f6f6;
    border-radius: 5px;
}

.subNav ul {
    display: flex;
}

.subNav li {
    position: relative;
    float: left;
    width: auto;
    font-size: 1rem;
}

.subNav li:after {
    display: block;
    position: absolute;
    left: 50%;
    bottom: 0;
    margin-left: -0.875rem;
    width: 1.75rem;
    height: 3px;
    content: "";
    background: var(--vi-color);
    transform: scale(0,1);
}

.subNav li a {
    display: block;
    padding: 0 1rem;
    color: #999;
}

.subNav li.cur:after,.subNav li:hover:after {
    transform: scale(1);
    transition: all .5s;
}

.subNav li.cur a,.subNav li:hover a {
    color: #000;
}

@media(max-width: 992px) {
    .subNav {
        display:none;
    }
}

/*--end subNav--*/
/*--product-wrap--*/
.product-wrap {
    padding-bottom: 5rem;
    background: #f5f5f5;
}

.product-wrap .inner {
    display: flex;
    justify-content: space-between;
}

.product-main .hd {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1rem;
    height: 2.8125rem;
    line-height: 2.8125rem;
}
.product-main>.hd{display:none;}
.product-main .hd h2 {
    position: relative;
    padding-left: 1.25rem;
    line-height: inherit;
    font-size: 1.25rem;
    color: #333;
}
.product-main .hd>h2{display:none;}
.product-main .hd h2:before {
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    width: 0.25rem;
    height: 1.25rem;
    content: "";
    background: var(--vi-color);
    border-radius: 2px;
    transform: translateY(-50%);
}

.product-main .hd ul {
    display: flex;
    width: 10rem;
    justify-content: flex-end;
}

.product-main .hd li {
    position: relative;
    margin-left: 1rem;
    width: 2rem;
}

.product-main .hd li i {
    display: block;
    color: #ccc;
    font-size: 1.5em;
}

.product-main .hd li[data-rel="search"] .pop {
    display: none;
    position: absolute;
    right: calc(100% + 1.25rem);
    top: 50%;
    padding: 0.625rem;
    width: 19.5rem;
    height: 3.75rem;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 0 1.25rem rgba(0,0,0,0.1);
    transform: translateY(-50%);
}

.product-main .hd li[data-rel="search"] .pop:after {
    display: block;
    position: absolute;
    z-index: 2;
    right: -0.25rem;
    top: 50%;
    margin-top: -0.25rem;
    width: 0.5rem;
    height: 0.5rem;
    content: "";
    background: #fff;
    transform: rotate(-45deg);
}

.product-main .hd li[data-rel="search"] .pop input {
    display: block;
    float: left;
    padding: 0 1rem;
    width: calc(100% - 4.375rem);
    height: 2.5rem;
    font-size: 1rem;
    border: none;
    outline: none;
}

.product-main .hd li[data-rel="search"] .pop button {
    display: block;
    width: 4.375rem;
    height: 2.5rem;
    font-size: 1rem;
    color: #fff;
    cursor: pointer;
    background: var(--vi-color);
    border: none;
    outline: none;
    border-radius: 5px;
}

.product-main .hd li[data-rel="search"] .pop button:hover {
    background: #000;
}

.product-main .hd li:hover i,.product-main .hd li.cur i {
    color: #333;
}

.product-main .hd .m-search {
    display: none;
    width: 80%;
    overflow: hidden;
}

.product-main .hd .m-search {
    position: relative;
    overflow: hidden;
    border: #e8e8e8 solid 1px;
    border-radius: 5px;
}

.product-main .hd .m-search input {
    display: block;
    padding: 1rem 1.25rem;
    height: 5rem;
    width: 100%;
    font-size: 1.5rem;
    border: none;
    outline: none;
}

.product-main .hd .m-search input::-webkit-input-placeholder {
    color: #999;
}

.product-main .hd .m-search button {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 5rem;
    height: 100%;
    cursor: pointer;
    border: none;
    outline: none;
    background: transparent;
}

.product-main .hd .m-search button i {
    font-size: 2rem;
    color: #ccc;
}

.product-list[data-mode="grid"] {
    display: flex;
    flex-wrap: wrap;
    margin: -1rem;
    overflow: hidden;
}

.product-list[data-mode="grid"] .item {
    margin: 1rem;
    width: calc(100% / 3 - 2rem);
    text-align: center;
    overflow: hidden;
    border-radius: 5px;
    transition: all 1s;
    animation: fadeInUp 1s;
}

.product-list[data-mode="grid"] .pic {
    overflow: hidden;
    border-radius: 5px;
}

.product-list[data-mode="grid"] .pic img {
    display: block;
    width: 100%;
    transition: transform 1s;
    filter: contrast(0.95);
}

.product-list[data-mode="grid"] .text {
    padding: 0.625rem;
    overflow: hidden;
}

.product-list[data-mode="grid"] .text h3 {
    line-height: 2rem;
    font-size: 1.25rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product-list[data-mode="grid"] .text h3 a {
    color: #333;
}

.product-list[data-mode="grid"] .text p {
    display: none;
}

.product-list[data-mode="grid"] .text span {
    display: none;
}

.product-list[data-mode="grid"] .item:hover {
    background: var(--vi-color);
}

.product-list[data-mode="grid"] .item:hover .pic img {
    transform: scale(1.1);
}

.product-list[data-mode="grid"] .item:hover .text h3 a {
    color: #fff;
}

.product-list[data-mode="card"]:before,.product-list[data-mode="card"]:after {
    content: "";
    display: table
}

.product-list[data-mode="card"]:after {
    clear: both;
}

.product-list[data-mode="card"] .item {
    margin-bottom: 2.5rem;
    overflow: hidden;
    transition: all .5s;
    animation: fadeInUp 1s;
}

.product .product-list[data-mode="card"] .item {
    width: calc(100% / 3 - 20px);
    float: left;
    margin-right: 20px;
}

.product-list[data-mode="card"] .pic {
    float: left;
    width: 21.25rem;
    overflow: hidden;
    border-radius: 5px;
}

.product .product-list[data-mode="card"] .pic {
    float: none;
    width: 100%;
}

.product-list[data-mode="card"] .pic img {
    display: block;
    width: 100%;
    transition: transform 1s;
    filter: contrast(0.95);
}

.product-list[data-mode="card"] .pic:hover img {
    transform: scale(1.1);
}

.product-list[data-mode="card"] .text {
    padding: 1.75rem 0;
    overflow: hidden;
}

.product-list[data-mode="card"] .text h3 {
    line-height: 2rem;
    font-size: 1.25rem;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product-list[data-mode="card"] .text h3 a {
    color: #333;
}

.product-list[data-mode="card"] .text h3 a:hover {
    color: var(--vi-color);
}

.product-list[data-mode="card"] .text p {
    margin-top: 0.75rem;
    height: 3.5rem;
    line-height: 1.75rem;
    font-size: 1rem;
    color: #999;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.product-list[data-mode="card"] .text p a {
    color: #999;
}

.product-list[data-mode="card"] .text span.read {
    display: block;
    margin-top: 2.5rem;
    font-size: 1rem;
}

.product-list[data-mode="card"] .text span.read a {
    color: #999;
}

.product-list[data-mode="card"] .text span.read a:after {
    display: inline-block;
    margin-left: 0.625rem;
    font-family: "iconfont";
    content: "\e694";
}

.product-list[data-mode="card"] .text span.read a:hover {
    color: var(--vi-color);
}

.product-list .item:hover {
    box-shadow: 0 0 2rem rgba(0,0,0,0.15);
}

.product .product-list .item:hover {
    box-shadow: none
}
.main .product-wrap .wrapper>.siderCont .product-list .item .text{
    padding: 15px;
    color: #333333;
}
.main .product-wrap .wrapper>.siderCont .product-list .item:hover .text{color:#af261a;}
.main .product-wrap .wrapper>.siderCont .product-list .item .text h3{
    font-size: 16px;
    font-weight: 600;
    color: inherit;
}
.main .product-wrap .wrapper>.siderCont .product-list .item .text p{
    color: inherit;
    font-size: 16px;
    display: block;
    -webkit-line-clamp: 1;
    -webkit-box-orient: initial;
    line-height: 1;
    height: auto;
    font-weight: 600;
}
.main .product-wrap .wrapper>.siderCont .product-list .item .text span{
    margin-top: 15px;
    font-size: 16px;
    color: inherit;
    font-weight: 600;
}
@media(max-width: 992px) {
    .product-wrap {
        padding:1.875rem;
    }

    .product-main .hd {
        display: none;
        height: 5rem;
        line-height: 5rem;
    }

    .product-main .hd h2 {
        display: none;
    }

    .product-main .hd ul {
        justify-content: flex-start;
    }

    .product-main .hd ul li {
        margin-left: 0;
        margin-right: 1rem;
        padding: 0 0.5rem;
        width: auto;
    }

    .product-main .hd ul li[data-rel="search"] {
        display: none;
    }

    .product-main .hd .m-search {
        display: block;
    }

    .product-list[data-mode="grid"] {
        margin: -0.625rem;
        padding: 1.875rem 0;
    }

    .product-list[data-mode="grid"] .item {
        margin: 0.625rem;
        width: calc(50% - 1.25rem);
    }

    .product-list[data-mode="grid"] .text {
        padding: 1rem 0.625rem;
    }

    .product-list[data-mode="grid"] .text h3 {
        font-size: 1.5rem;
    }

    .product-list[data-mode="card"] {
        padding: 1.875rem 0;
    }

    .product-list[data-mode="card"] .item {
        margin-bottom: 2.5rem;
    }

    .product-list[data-mode="card"] .pic {
        width: 40%;
    }

    .product-list[data-mode="card"] .text {
        padding: 0 0 0 1.875rem;
    }

    .product-list[data-mode="card"] .text h3 {
        font-size: 1.5rem;
    }

    .product-list[data-mode="card"] .text p {
        height: 6rem;
        line-height: 2rem;
        font-size: 1.5rem;
    }

    .product-list[data-mode="card"] .text span.read {
        display: none;
    }

    .product-list .item:hover {
        box-shadow: none;
    }
}

/*--end product-wrap--*/
/*--product-show-intro--*/
.product-show {
    overflow: hidden;
}

.product-show-intro {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.product-show-intro .inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.product-show-intro .slideBox {
    position: relative;
    width: 50%;
    overflow: hidden;
    border-radius: 3px;
}

.product-show-intro .slideBox li {
    overflow: hidden;
}

.product-show-intro .slideBox li img {
    display: block;
    width: 100%;
    transition: all 2s cubic-bezier(0.165, 0.84, 0.44, 1);
    filter: contrast(.95);
}

.product-show-intro .slideBox li:hover img {
    transform: scale(1.1);
}

.product-show-intro .slideBox .prev,.product-show-intro .slideBox .next {
    position: absolute;
    z-index: 9;
    top: 50%;
    width: 3.75rem;
    height: 3.75rem;
    line-height: 3.75rem;
    text-align: center;
    color: #fff;
    cursor: pointer;
    background: rgba(0,0,0,0.5);
    border-radius: 5px;
    transform: translateY(-50%);
}

.product-show-intro .slideBox .prev {
    left: 1.75rem;
}

.product-show-intro .slideBox .next {
    right: 1.75rem;
}

.product-show-intro .slideBox .prev:hover,.product-show-intro .slideBox .next:hover {
    background: var(--vi-color);
}

.product-show-intro .slideBox .swiper-pager {
    position: absolute;
    z-index: 9;
    left: 0;
    bottom: 2rem;
    width: 100%;
    text-align: center;
}

.product-show-intro .slideBox .swiper-pager span {
    margin: 0 .5rem;
    background: #fff;
    opacity: 1;
}

.product-show-intro .slideBox .swiper-pager span.swiper-pagination-bullet-active {
    background: var(--vi-color);
}

.product-show-intro .text {
    position: relative;
    width: 44%;
    overflow: hidden;
}

.product-show-intro .text h1 {
    padding-bottom: 1.75rem;
    font-size: 2.625rem;
    line-height: 1;
    color: #333;
    border-bottom: #e5e5e5 solid 1px;
}

.product-show-intro .text .summary {
    margin: 1.75rem 0;
    height: 14rem;
    overflow: auto;
}

.product-show-intro .text .summary p {
    font-size: 1rem;
    line-height: 1.75rem;
    color: #666;
}

.product-show-intro .text .btnBox {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3.75rem;
}

.product-show-intro .text .btnBox li {
    position: relative;
    float: left;
    margin-right: 1.25rem;
    width: 15rem;
    height: 3.75rem;
    line-height: 3.75rem;
    text-align: center;
    font-size: 1.25rem;
    color: #fff;
}

.product-show-intro .text .btnBox li:nth-child(1) a {
    display: block;
    color: #fff;
    background: var(--vi-color);
    border-radius: 5px;
}

.product-show-intro .text .btnBox li:nth-child(2) a {
    display: block;
    color: #fff;
    background: #999;
    border-radius: 5px;
}

.product-show-intro .text .btnBox li:nth-child(2) a:hover {
    background: #000;
}

.product-show-intro .text .btnBox li .pop {
    display: none;
    position: absolute;
    left: 0;
    bottom: calc(100% + 2rem);
    padding: 2rem;
    width: 100%;
    background: #fff;
    box-shadow: 0 0 2rem rgba(0,0,0,0.1);
}

.product-show-intro .text .btnBox li .pop:after {
    display: block;
    position: absolute;
    z-index: 3;
    left: 50%;
    bottom: -0.625rem;
    margin-left: -0.625rem;
    width: 1.25rem;
    height: 1.25rem;
    content: "";
    background: #fff;
    transform: rotate(-45deg);
}

.product-show-intro .text .btnBox li:hover .pop {
    display: block;
}

@media(max-width: 992px) {
    .product-show-intro {
        padding:0;
    }

    .product-show-intro .slideBox {
        width: 100%;
        border-radius: 0;
    }

    .product-show-intro .slideBox .prev,.product-show-intro .slideBox .next {
        display: none;
    }

    .product-show-intro .text {
        padding: 1.875rem 1.25rem 2.5rem;
        width: 100%;
    }

    .product-show-intro .text h1 {
        padding-bottom: 1.875rem;
        font-size: 1.875rem;
        line-height: 1.25;
    }

    .product-show-intro .text .summary {
        height: auto;
        min-height: 12rem;
    }

    .product-show-intro .text .summary p {
        font-size: 1.5rem;
        line-height: 1.75;
    }

    .product-show-intro .text .btnBox {
        position: static;
        margin-top: 3rem;
    }

    .product-show-intro .text .btnBox ul {
        display: flex;
        justify-content: space-between;
    }

    .product-show-intro .text .btnBox li {
        margin: 0;
        width: 49%;
        height: 5rem;
        line-height: 5rem;
        font-size: 1.5rem;
    }
}

/*--end product-show-intro--*/
/*--product-show-edit--*/
.product-show-edit {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
    border-bottom: #e5e5e5 solid 1px;
}

.product-show-edit .hd {
    overflow: hidden;
}

.product-show-edit .hd h2 {
    font-size: 2.625rem;
    color: #333;
    line-height: 1.25;
}

.product-show-edit .hd em {
    font-family: "DIN Medium";
    font-size: 2.625rem;
    color: #ccc;
    text-transform: uppercase;
    line-height: 1.25;
}

.product-show-edit .bd {
    overflow: hidden;
}

.product-show-edit .bd p {
    font-size: 1rem;
    color: #333;
    line-height: 1.75;
}

.product-show-edit .bd p img {
    display: inline-block;
    width: auto;
    max-width: 100%;
}

@media(max-width: 992px) {
    .product-show-edit {
        margin-top:1.25rem;
        padding: 3.75rem 1.25rem;
        background: #fff;
    }

    .product-show-edit .hd h2 {
        font-size: 1.875rem;
    }

    .product-show-edit .hd em {
        font-size: 1.875rem;
    }

    .product-show-edit .bd p {
        font-size: 1.5rem;
    }
}

/*--end product-show-edit--*/
/*--product-show-form--*/
.product-show-form {
    padding-top: 5rem;
    overflow: hidden;
    background: #fff;
}

.product-show-form .hd {
    overflow: hidden;
}

.product-show-form .hd h2 {
    font-size: 2.625rem;
    color: #333;
    line-height: 1.25;
}

.product-show-form .hd p {
    margin-top: 1rem;
    font-size: 1rem;
    line-height: 1.25;
    color: #999;
}

.product-show-form .bd {
    margin-top: 3.75rem;
}

.product-show-form .bd .iptBox {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.product-show-form .bd .iptBox input {
    padding: 1.25rem 2.5rem;
    width: calc(33.33% - 20px);
    height: 4.375rem;
    font-size: 1.25rem;
    background: #f6f6f6;
    border: none;
    border-radius: 5px;
    outline: none;
    transition: all 1s;
}

.product-show-form .bd .iptBox input::-webkit-input-placeholder {
    color: #999;
}

.product-show-form .bd .iptBox input:hover {
    background: #fff;
    box-shadow: 0 0 2rem rgba(0,0,0,0.1);
}

.product-show-form .bd .txtBox {
    margin-top: 2rem;
}

.product-show-form .bd .txtBox textarea {
    display: block;
    padding: 1.25rem 2.5rem;
    width: 100%;
    height: 10rem;
    font-size: 1.25rem;
    background: #f6f6f6;
    border: none;
    border-radius: 5px;
    outline: none;
    resize: none;
    transition: all 1s;
}

.product-show-form .bd .txtBox textarea::-webkit-input-placeholder {
    color: #999;
}

.product-show-form .bd .txtBox textarea:hover {
    background: #fff;
    box-shadow: 0 0 2rem rgba(0,0,0,0.1);
}

.product-show-form .bd .btnBox {
    margin-top: 3.125rem;
    overflow: hidden;
}

.product-show-form .bd .btnBox a {
    display: block;
    float: right;
    width: 26.875rem;
    height: 4.375rem;
    line-height: 4.375rem;
    font-size: 1.25rem;
    color: #fff;
    text-align: center;
    background: var(--vi-color);
    border-radius: 5px;
}

@media(max-width: 992px) {
    .product-show-form {
        margin-top:1.25rem;
        padding: 3.75rem 1.25rem;
    }

    .product-show-form .hd h2 {
        font-size: 1.875rem;
    }

    .product-show-form .hd p {
        font-size: 1.5rem;
    }

    .product-show-form .bd {
        margin-top: 2.25rem;
    }

    .product-show-form .bd .iptBox input {
        margin-bottom: 1.25rem;
        padding: 1.5rem 1.875rem;
        width: 100%;
        font-size: 1.5rem;
    }

    .product-show-form .bd .txtBox {
        margin-top: 0;
    }

    .product-show-form .bd .txtBox textarea {
        padding: 1.5rem 1.875rem;
        width: 100%;
        height: 10rem;
        font-size: 1.5rem;
    }

    .product-show-form .bd .btnBox {
        margin-top: 1.25rem;
    }

    .product-show-form .bd .btnBox a {
        float: none;
        width: 100%;
        height: 5rem;
        line-height: 5rem;
        font-size: 1.5rem;
    }
}

/*--end product-show-form--*/
/*--case-show--*/
.case-show {
    overflow: hidden;
}

@media(max-width: 992px) {
    .case-show {
        padding-bottom:2.5rem;
        background: #fff;
    }
}

/*--end case-show--*/
/*--relate-product--*/
.relate-product {
    padding-top: 1.875rem;
    overflow: hidden;
    background: #fff;
}

.relate-product .hd {
    overflow: hidden;
}

.relate-product .hd h2 {
    font-size: 2.625rem;
    color: #333;
    line-height: 1.25;
}

.relate-product .hd h2 a {
    color: #333;
}

.relate-product .hd h2 a:hover {
    color: var(--vi-color);
}

.relate-product .hd p {
    margin-top: 1rem;
    font-size: 1rem;
    line-height: 1.25;
    color: #999;
}

.relate-product .list {
    display: flex;
    flex-wrap: wrap;
    margin: -1rem;
    padding: 3.125rem 0;
}

.relate-product .item {
    margin: 1rem;
    width: calc(100% / 4 - 2rem);
    text-align: center;
    overflow: hidden;
    border-radius: 5px;
    transition: all 1s;
}

.relate-product .pic {
    overflow: hidden;
    border-radius: 5px;
}

.relate-product .pic img {
    display: block;
    width: 100%;
    transition: transform 1s;
    filter: contrast(0.95);
}

.relate-product .text {
    padding: 0.625rem;
    overflow: hidden;
}

.relate-product .text h3 {
    line-height: 2rem;
    font-size: 1.125rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.relate-product .text h3 a {
    color: #333;
}

.relate-product .text p {
    display: none;
}

.relate-product .text span {
    display: none;
}

.relate-product .item:hover {
    background: var(--vi-color);
    transform: translateY(-1rem);
    box-shadow: 0 0 1rem rgba(0,0,0,0.1);
}

.relate-product .item:hover .pic img {
    transform: scale(1.1);
}

.relate-product .item:hover .text h3 a {
    color: #fff;
}

@media(max-width: 992px) {
    .relate-product {
        padding:0 1.25rem;
    }

    .relate-product .hd h2 {
        font-size: 1.875rem;
    }

    .relate-product .list {
        margin: -0.625rem;
        padding: 1.875rem 0;
    }

    .relate-product .item {
        margin: 0.625rem;
        width: calc(100% / 2 - 1.25rem);
    }

    .relate-product .item:nth-child(3),.relate-product .item:nth-child(4) {
        display: none;
    }

    .relate-product .text {
        padding: 1rem 0.625rem;
    }

    .relate-product .text h3 {
        font-size: 1.5rem;
    }
}

/*--relate-product--*/
/*--relate-news--*/
.relate-news {
    margin-bottom: 2rem;
    overflow: hidden;
    background: #fff;
}

.relate-news .hd {
    margin-bottom: 2rem;
    overflow: hidden;
}

.relate-news .hd h2 {
    font-size: 2.625rem;
    color: #333;
    line-height: 1.25;
}

.relate-news .hd h2 a {
    color: #333;
}

.relate-news .hd h2 a:hover {
    color: var(--vi-color);
}

.relate-news .list {
    display: flex;
    flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-between;
}

.relate-news .item {
    display: block;
    position: relative;
    padding: 1.2rem 0;
    padding-left: 10px;
    width: calc(50% - 2.125rem);
    border-top: #e5e5e5 solid 1px;
}

.relate-news .item:before {
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -2px;
    content: "";
    width: 4px;
    height: 4px;
    background: #ccc;
    border-radius: 50%;
}

.relate-news .item em {
    display: none;
    font-family: "DIN Medium";
    font-size: 1rem;
    line-height: 1.5rem;
    color: #ccc;
}

.relate-news .item em:before {
    display: inline-block;
    margin-right: 0.5rem;
    font-family: "iconfont";
    content: "\e610";
}

.relate-news .item h3 {
    line-height: 1.4rem;
    font-size: 1rem;
    color: #666;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.relate-news .item:hover h3 {
    color: var(--vi-color);
}

@media(max-width: 992px) {
    .relate-news {
        margin-bottom:0;
        padding: 0 1.25rem;
    }

    .relate-news .hd h2 {
        font-size: 1.875rem;
    }

    .relate-news .item {
        width: 100%;
    }

    .relate-news .item em {
        font-size: 1.5rem;
    }

    .relate-news .item h3 {
        font-size: 1.5rem
    }
}

/*--end relate-news--*/
/*--news-wrap--*/
.news-wrap {
    padding-bottom: 5rem;
}

.news-main .hd {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1rem;
    height: 2.8125rem;
    line-height: 2.8125rem;
}

.news-main .hd h2 {
    position: relative;
    padding-left: 1.25rem;
    line-height: inherit;
    font-size: 1.25rem;
    color: #333;
}

.news-main .hd h2:before {
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    width: 0.25rem;
    height: 1.25rem;
    content: "";
    background: var(--vi-color);
    border-radius: 2px;
    transform: translateY(-50%);
}

.news-list .item {
    padding: 30px;
    overflow: hidden;
    background-color: #ffffff;
    margin-bottom: 15px;
    box-shadow: 0 4px 10px 0 rgba(34,41,77,.15);
}
.news-list .item:hover .title{color:#cf261c}
.news-list .item a{display:flex;justify-content:space-between;}
.news-list .pic {
    width: 320px;
    overflow: hidden;
    border-radius: 5px;
}

.news-list .pic img {
    display: block;
    width: 100%;
    height: 183px;
    object-fit: cover;
    object-position: center top;
}

.news-list .text {
    position: relative;
    padding-right: 0rem;
    width: calc(100% - 320px - 30px);
    transition: all 1s;
}

.news-list .text .title{
    line-height: 32px;
    font-size: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #333;
    font-weight: 600;
}
.news-list .text p {
    margin: 0.75rem 0;
    line-height: 1.75;
    font-size: 16px;
    color: #333333;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.news-list .text p a {
    color: #333333;
}

.news-list .text .btmBox {
    position: absolute;
    left: 0;
    bottom: 0;
    padding-right: 0rem;
    width: 100%;
    line-height: 1.75;
    font-size: 1rem;
    color: #999;
    overflow: hidden;
}

.news-list .text .btmBox li {
    float: left;
}

.news-list .text .btmBox li.read {
    margin-right: 2.5rem;
    overflow: hidden;
    color: #cf261c;
}

.news-list .text .btmBox li.read a {
    display: inline-block;
    color: #cf261c;
}

.news-list .text .btmBox li.read a:after {
    display: inline-block;
    margin-left: 1rem;
    font-family: "iconfont";
    content: "\e694";
}

.news-list .text .btmBox li.read a:hover {
    color: var(--vi-color);
}

.news-list .text .btmBox li.time {
    float: right;
    font-family: "DIN Medium";
    color: #333333;
}

.news-list .text .btmBox li.tag {
    width: 20rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.news-list .text .btmBox li.tag a {
    display: inline-block;
    padding: 0 0.375rem;
    color: #999;
}

.news-list .text .btmBox li.tag a:hover {
    color: var(--vi-color);
}
@media(max-width: 992px) {
    .news-wrap {
        padding:0;
    }

    .news-main .hd {
        display: none;
    }

    .news-list {
        background: #f6f6f6;
        overflow: hidden;
    }

    .news-list .item {
        margin-top: 1.25rem;
        padding: 2.5rem 1.25rem;
        background: #fff;
        border-radius: 0;
    }

    .news-list .item:first-child {
        margin-top: 0;
    }

    .news-list .pic {
        width: 40%;
    }

    .news-list .text {
        width: 54%;
    }

    .news-list .text h3 {
        font-size: 1.75rem;
        white-space: unset;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .news-list .text p {
        display: none;
    }

    .news-list .text .btmBox {
        font-size: 1.5rem;
    }

    .news-wrap .addMore {
        padding: 1.25rem;
    }

    .news-wrap .news-list .text .btmBox li.tag {
        display: none;
    }

    .news-list .item:hover {
        box-shadow: unset;
    }

    .news-list .item:hover .text {
        transform: translateX(0);
    }
}

/*--end news-wrap--*/
/*--news-show--*/
.news-show {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.news-article .hd {
    overflow: hidden;
}

.news-article .hd h1 {
    font-weight: 400;
    font-size: 2.2rem;
    line-height: 1.25;
    color: #333;
    font-weight: bold;
    text-align: center;
}

.news-article .hd .meta {
    margin-top: 1rem;
    line-height: 1.5;
    overflow: hidden;
    text-align: center;
}

.news-article .hd .meta span {
    display: inline-block;
    margin-right: 2rem;
    font-size: 1rem;
    color: #999;
}

.news-article .hd .meta span a {
    display: inline-block;
    margin-right: 1rem;
    color: #999;
}

.news-article .hd .meta span a:hover {
    text-decoration: underline;
    color: #333;
}

.news-article .hd .meta span:last-child,.news-article .hd .meta span:last-child a:last-child {
    margin-right: 0;
}

.news-article .bd {
    margin-top: 2.875rem;
    overflow: hidden;
}

.news-article .bd .summary {
    padding: 1.5rem 2.5rem 2.875rem;
    line-height: 1.5;
    overflow: hidden;
    background: #f6f6f6;
    border-radius: 5px;
}

.news-article .bd .summary h4 {
    font-weight: 400;
    font-size: 2.625rem;
    color: #666;
}

.news-article .bd .summary p {
    margin-top: 0.75rem;
    font-size: 1rem;
    color: #666;
}

.news-article .bd .cont {
    overflow: hidden;
}

.news-article .bd .cont p {
    font-size: 14px;
    color: #333;
    line-height: 1.5;
    margin-bottom: 30px;
    text-indent: 2em;
    text-align: justify;
}

.news-article .bd .cont p img {
    display: block;
    width: auto;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

@media(max-width: 992px) {
    .news-show {
        padding:2.5rem 1.25rem;
    }

    .news-article .hd h1 {
        font-size: 2rem;
    }

    .news-article .hd .meta span {
        font-size: 1.5rem;
    }

    .news-article .bd {
        margin-top: 1.5rem;
    }

    .news-article .bd .summary {
        padding: 2rem 2.5rem;
    }

    .news-article .bd .summary h4 {
        font-size: 2rem;
    }

    .news-article .bd .summary p {
        font-size: 1.5rem;
    }

    .news-article .bd .cont p {
        font-size: 1.5rem;
        color: #666;
        text-indent: 0 !important;
    }
}

/*--end news-show--*/
/*--article-pager--*/
.article-pager {
    clear: both;
    width: 100%;
    height: 5.625rem;
    line-height: 5.625rem;
}

.article-pager .inner {
    display: flex;
    justify-content: space-between;
    border-bottom: #e5e5e5 solid 1px;
}

.article-pager .prev,.article-pager .next {
    width: 25rem
}

.article-pager .prev a,.article-pager .next a {
    display: block;
    position: relative;
    font-size: 1rem;
    color: #999;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.article-pager .prev a {
    padding-left: 2.25rem;
}

.article-pager .prev a:before {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    font-family: "iconfont";
    content: "\e693";
}

.article-pager .next a {
    padding-right: 2.25rem;
    text-align: right;
}

.article-pager .next a:before {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    font-family: "iconfont";
    content: "\e694";
}

.article-pager .back {
    width: 8.75rem;
    text-align: center;
}

.article-pager .back a {
    display: block;
    font-size: 1rem;
    color: #999;
}

.article-pager .back a:before {
    display: inline-block;
    margin-right: 1rem;
    font-family: "iconfont";
    content: "\e613";
    opacity: 0.6;
}

.article-pager .prev:hover a,.article-pager .next:hover a {
    color: var(--vi-color);
}

.article-pager .back:hover a {
    color: #fff;
    background: var(--vi-color);
    transition: all .5s;
}

@media(max-width: 992px) {
    .article-pager .inner {
        border-top:#e5e5e5 solid 1px;
    }

    .article-pager .prev,.article-pager .next {
        display: none;
    }

    .article-pager .back {
        width: 100%;
    }

    .article-pager .back a {
        font-size: 1.5rem;
    }
}

/*--end article-pager--*/
/*--faq-wrap--*/
.faq-wrap {
    padding-bottom: 5rem;
    background: #fff;
}

.faq-list {
    padding: 1rem;
    overflow: hidden;
}

.faq-list .item {
    margin-bottom: 1.25rem;
    overflow: hidden;
}

.faq-list .item h3 {
    margin-bottom: 0.625rem;
    font-size: 1.25rem;
    line-height: 1.75;
    color: #333;
}

.faq-list .item p {
    font-size: 0.9375rem;
    line-height: 1.75;
    color: #999;
}

@media(max-width: 992px) {
    .faq-wrap {
        padding:0;
    }

    .faq-list {
        background: #f6f6f6;
        overflow: hidden;
    }
}

/*--end news-wrap--*/
/*--edit-article--*/
.edit-article {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.edit-article #content {
    overflow: hidden;
}

.edit-article #content p {
    font-size: 1rem;
    line-height: 1.75;
    color: #666;
}

.edit-article #content img {
    display: inline-block;
    max-width: 100%;
    width: auto;
}

@media(max-width: 992px) {
    .edit-article {
        padding:3.75rem 1.25rem;
    }

    .edit-article #content p {
        font-size: 1.5rem;
    }
}

/*--end edit-article--*/
/*--culture--*/
.culture {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.culture-list {
    margin: -1.25rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.culture-list .item {
    margin: 1.25rem;
    padding: 5rem 6.25rem;
    width: calc(100% / 2 - 2.5rem);
    text-align: center;
    overflow: hidden;
    background: #f6f6f6;
    border-radius: 5px;
    transition: all 1s;
}

.culture-list .item i {
    display: block;
    margin: 0 auto 2.25rem;
    width: 3.75rem;
    height: 3.75rem;
    overflow: hidden;
}

.culture-list .item i img {
    display: block;
    width: 100%;
}

.culture-list .item h3 {
    padding-top: 2.25rem;
    font-size: 2.625rem;
    color: #000;
    border-top: #e5e5e5 solid 1px;
}

.culture-list .item p {
    margin-top: 0.5rem;
    font-size: 1.25rem;
    color: #333;
}

.culture-list .item:hover {
    background: #fff;
    box-shadow: 0 0 2rem rgba(0,0,0,0.15);
}

@media(max-width: 992px) {
    .culture {
        padding:2.5rem 1.25rem;
    }

    .culture-list {
        margin: -1rem 0;
    }

    .culture-list .item {
        margin: 1rem 0;
        padding: 4.5rem;
        width: 100%;
    }
}

/*--end culture--*/
/*--evolution--*/
.evolution {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.evolution-list {
    display: flex;
    flex-wrap: wrap;
    padding: 5rem 0;
    overflow: hidden;
    background: url(../images/Template/evolution_list.png) repeat-y center 0;
}

.evolution-list .item {
    position: relative;
    width: 50%;
    animation: fadeInUp 1.25s ease-in-out;
}

.evolution-list .item:after {
    display: block;
    position: absolute;
    top: 1rem;
    width: 18px;
    height: 18px;
    content: "";
    border: var(--vi-color) solid 5px;
    border-radius: 50%;
    animation: zoomIn 2s infinite
}

.evolution-list .text {
    overflow: hidden;
}

.evolution-list .text em {
    display: block;
    line-height: 3.125rem;
    font-size: 2.25rem;
    font-family: "DIN Medium";
    color: var(--vi-color);
}

.evolution-list .text p {
    margin-top: 0.75rem;
    line-height: 1.75;
    font-size: 1rem;
    color: #666;
}

.evolution-list .pic {
    margin-top: 3.25rem;
    overflow: hidden;
    border-radius: 5px;
}

.evolution-list .pic img {
    display: block;
    width: 100%;
    transition: all 1s;
}

.evolution-list .item:hover .pic img {
    transform: scale(1.1);
}

@media(min-width: 992px) {
    .evolution-list .item:nth-child(odd) {
        padding-right:13.125rem;
    }

    .evolution-list .item:nth-child(even) {
        padding-left: 13.125rem;
        margin-top: 11.25rem;
    }

    .evolution-list .item:nth-child(odd):after {
        right: 0;
        margin-right: -9px;
    }

    .evolution-list .item:nth-child(even):after {
        left: 0;
        margin-left: -9px;
    }
}

@media(max-width: 992px) {
    .evolution {
        padding:2.5rem 1.25rem;
    }

    .evolution-list {
        display: block;
        padding: 2rem 0;
        background: url(../images/Template/evolution_list.png) repeat-y 1.25rem 0;
    }

    .evolution-list .item {
        margin-bottom: 5rem;
        padding-left: 4.5rem;
        width: 100%;
    }

    .evolution-list .item:after {
        top: 0.75rem;
        left: 1.25rem;
        margin-left: -7px;
    }

    .evolution-list .text em {
        line-height: 2.875rem;
        font-size: 2.25rem;
    }

    .evolution-list .text p {
        margin-top: 1rem;
        font-size: 1.5rem;
        line-height: 1.5;
    }

    .evolution-list .pic {
        margin-top: 1.5rem;
    }

    .evolution-list .pic img {
        width: auto;
        max-width: 100%;
    }
}

/*--end evolution--*/
/*--base--*/
.base {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.base-top {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 5.625rem;
    overflow: hidden;
    background: #f6f6f6;
    border-radius: 5px;
}

.base-top .datas {
    padding: 3.125rem 0 3.125rem 6.25rem;
    width: 25rem;
    overflow: hidden;
}

.base-top .datas .item {
    padding: 2.25rem 0;
    height: 9.375rem;
}

.base-top .datas .item dt {
    height: 3rem;
    line-height: 3rem;
    overflow: hidden;
}

.base-top .datas .item dt em {
    font-family: "DIN Medium";
    font-size: 2.625rem;
    color: #000;
}

.base-top .datas .item dt sup {
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
    line-height: 1.5rem;
    font-size: 0.875rem;
    color: #fff;
    text-align: center;
    vertical-align: top;
    background: var(--vi-color);
    border-radius: 50%;
}

.base-top .datas .item dd {
    font-size: 1.25rem;
    color: #666;
}

.base-top .slideBox {
    position: relative;
    width: calc(100% - 25rem);
    overflow: hidden;
    border-radius: 5px;
}

.base-top .slideBox li {
    overflow: hidden;
}

.base-top .slideBox li img {
    display: block;
    transition: all 1s;
}

.base-top .slideBox li:hover img {
    transform: scale(1.1);
}

.base-top .slideBox .swiper-pager {
    position: absolute;
    z-index: 9;
    bottom: 2.5rem;
    left: 0;
    width: 100%;
    text-align: center;
}

.base-top .slideBox .swiper-pager span {
    margin: 0 10px;
    width: 9px;
    height: 9px;
    background: #fff;
    opacity: 1;
}

.base-top .slideBox .swiper-pager span.swiper-pagination-bullet-active {
    background: var(--vi-color);
}

.base-list {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -3rem;
    overflow: hidden;
}

.base-list .item {
    margin: 1.5625rem 3rem;
    width: calc(100% / 3 - 6rem);
    overflow: hidden;
    transition: all 1s;
    border-radius: 5px;
}

.base-list .pic {
    overflow: hidden;
    border-radius: 5px;
}

.base-list .pic img {
    display: block;
    width: 100%;
    transition: all 1s;
}

.base-list .text {
    padding: 1rem;
    text-align: center;
    overflow: hidden;
}

.base-list .text h3 {
    font-size: 1.25rem;
    color: #333;
}

.base-list .item:hover {
    box-shadow: 0 0 2rem rgba(0,0,0,0.15);
    transform: translateY(-1rem);
}

.base-list .item:hover .pic img {
    transform: scale(1.1);
}

@media(max-width: 992px) {
    .base {
        padding:3.125rem 1.25rem;
    }

    .base-top {
        margin-bottom: 2.5rem;
        background: #fff;
    }

    .base-top .datas {
        display: flex;
        padding: 0;
        width: 100%;
        justify-content: space-between;
    }

    .base-top .datas .item {
        padding: 0 1rem;
        height: auto;
    }

    .base-top .datas .item dt sup {
        width: 2rem;
        height: 2rem;
        line-height: 2rem;
        font-size: 1.25rem;
    }

    .base-top .datas .item dd {
        font-size: 1.5rem;
    }

    .base-top .slideBox {
        margin-top: 3.125rem;
        width: 100%;
    }

    .base-list {
        margin: -0.625rem;
        padding-bottom: 2.5rem;
    }

    .base-list .item {
        margin: 0.625rem;
        width: calc(50% - 1.25rem);
    }

    .base-list .item:hover {
        box-shadow: none;
        transform: translateY(0);
    }
}

/*--end base--*/
/*--team--*/
.team {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.team-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: -2rem;
}

.team-list .item {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 2rem;
    width: calc(100% / 2 - 4rem);
    overflow: hidden;
    background: #f9f9f9;
    border-radius: 5px;
}

.team-list .pic {
    width: 20rem;
    overflow: hidden;
    /* border-radius:5px; */
}

.team-list .pic img {
    display: block;
    width: 100%;
    transition: all 1s;
}

.team-list .text {
    position: relative;
    padding: 1.25rem;
    width: calc(100% - 20rem);
    overflow: hidden;
}

.team-list .text:after {
    display: block;
    position: absolute;
    left: 1.25rem;
    bottom: 2.5rem;
    width: 2.5rem;
    height: 2px;
    content: "";
    background: #e5e5e5;
}

.team-list .text h3 {
    line-height: 1.5;
    font-size: 1.25rem;
    color: #333;
    font-weight: bold;
}

.team-list .text p {
    margin-top: 0.75rem;
    height: 13.125rem;
    line-height: 1.5;
    font-size: .875rem;
    color: #999;
    overflow: hidden;
}

.team-list .item:hover .pic img {
    transform: scale(1.1);
}

@media(max-width: 992px) {
    .team {
        padding:3.125rem 1.25rem;
    }

    .team-list {
        margin: -0.5rem;
        margin-bottom: 2.5rem;
    }

    .team-list .item {
        margin: 0.5rem;
        width: calc(50% - 1rem);
        display: block;
    }

    .team-list .pic {
        width: 100%;
    }

    .team-list .text {
        padding: 1rem;
        width: 100%;
    }

    .team-list .text:after {
        bottom: 2.5rem;
        display: none;
    }

    .team-list .text h3 {
        font-size: 1rem;
        font-weight: normal;
    }

    .team-list .text p {
        display: none;
        height: 12rem;
        line-height: 2rem;
        font-size: 1.5rem;
        overflow: hidden;
    }
}

/*--end team--*/
/*--honor--*/
.honor {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.honor-cont {
    padding-top: 3rem;
}

.honor-list {
    display: flex;
    flex-wrap: wrap;
    margin: -1.375rem -2.5rem;
}

.honor-list .item {
    flex: none;
    margin: 1.375rem 2.5rem;
    width: calc(100% / 4 - 5rem);
    overflow: hidden;
    transition: all 1s;
    border-radius: 5px;
}

.honor-list .pic {
    overflow: hidden;
    border-radius: 5px;
}

.honor-list .pic img {
    display: block;
    width: 100%;
    transition: all 1s;
    filter: contrast(0.95);
}

.honor-list .text {
    padding: 1rem;
    text-align: center;
    overflow: hidden;
}

.honor-list .text h3 {
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.5;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.honor-list .item:hover {
    box-shadow: 0 0 1rem rgba(0,0,0,0.1);
    transform: translateY(-1rem);
}

@media(max-width: 992px) {
    .honor {
        padding:3.125rem 1.25rem;
    }

    .honor-cont {
        padding-top: 2rem;
    }

    .honor-list {
        margin: -1.25rem -0.625rem 1.25rem;
    }

    .honor-list .item {
        margin: 1.25rem 0.625rem;
        width: calc(50% - 1.25rem);
        border-radius: 0;
    }

    .honor-list .pic {
        border-radius: 0;
    }

    .honor-list .text h3 {
        font-size: 1.5rem;
    }

    .honor-list .item:hover {
        box-shadow: none;
        transform: translateY(0);
    }
}

/*--end honor--*/
/*--partner--*/
.partner {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.partner-list {
    display: flex;
    flex-wrap: wrap;
    margin: -1.5625rem;
}

.partner-list .item {
    flex: none;
    margin: 1.5625rem;
    width: calc(100% / 4 - 3.125rem);
}

.partner-list .pic {
    overflow: hidden;
    border: #f0f0f0 solid 1px;
    border-radius: 5px;
    transition: all 1s;
}

.partner-list .pic img {
    display: block;
    width: 100%;
    transition: all 1s;
}

.partner-list .text {
    padding: 1rem;
    text-align: center;
    overflow: hidden;
}

.partner-list .text h3 {
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.5;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.partner-list .item:hover .pic {
    box-shadow: 0 0 2rem rgba(0,0,0,0.1);
}

.partner-list .item:hover .text h3 {
    color: var(--vi-color);
}

@media(max-width: 992px) {
    .partner {
        padding:3.125rem 1.25rem;
    }

    .partner-list {
        margin: -1.25rem -0.625rem 1.25rem;
    }

    .partner-list .item {
        margin: 1.25rem 0.625rem;
        width: calc(50% - 1.25rem);
        border-radius: 0;
    }

    .partner-list .pic {
        border-radius: 0;
    }

    .partner-list .text h3 {
        font-size: 1.5rem;
    }
}

/*--end partner--*/
/*--videos--*/
.videos {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.videos-list {
    display: flex;
    flex-wrap: wrap;
    margin: -1.375rem -2.5rem;
}

.videos-list .item {
    flex: none;
    margin: 1.375rem 2.5rem;
    width: calc(100% / 3 - 5rem);
    overflow: hidden;
    transition: all 1s;
    border-radius: 5px;
}

.videos-list .pic {
    overflow: hidden;
    border-radius: 5px;
}

.videos-list .pic a {
    display: block;
    position: relative;
}

.videos-list .pic a:after {
    display: flex;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    font-family: "iconfont";
    font-size: 3.875rem;
    color: #fff;
    content: "\e768";
    background: rgba(0,0,0,0.5);
}

.videos-list .pic img {
    display: block;
    width: 100%;
    transition: all 1s;
}

.videos-list .text {
    padding: 1rem;
    text-align: center;
    overflow: hidden;
}

.videos-list .text h3 {
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.5;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.videos-list .item:hover {
    background: var(--vi-color);
    box-shadow: 0 0 1rem rgba(0,0,0,0.1);
    transform: translateY(-1rem);
}

.videos-list .item:hover .pic img {
    transform: scale(1.1);
}

.videos-list .item:hover .text * {
    color: #fff;
}

@media(max-width: 992px) {
    .videos {
        padding:3.125rem 1.25rem;
    }

    .videos-list {
        margin: 0;
    }

    .videos-list .item {
        margin: 0 0 1.25rem;
        width: 100%;
    }

    .videos-list .text h3 {
        font-size: 1.5rem;
    }

    .videos-list .item:hover {
        box-shadow: none;
        transform: translateY(0);
    }
}

/*--end videos--*/
/*--download--*/
.download {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.download-list {
    overflow: hidden;
}

.download-list .item {
    margin-bottom: 0.625rem;
    padding: 1.25rem 2rem;
    line-height: 2rem;
    font-size: 1rem;
    cursor: pointer;
    overflow: hidden;
    background: #f6f6f6;
    border-radius: 5px;
    transition: all .5s;
}

.download-list .tit {
    position: relative;
    float: left;
    padding-left: 1.75rem;
    width: 20rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.download-list .tit:before {
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    width: 11px;
    height: 11px;
    content: "";
    background: #fff;
    border: var(--vi-color) solid 3px;
    border-radius: 50%;
    transform: translateY(-50%);
}

.download-list .time {
    float: right;
    margin-right: 4rem;
    font-family: "DIN Medium";
    color: #999;
}

.download-list .action {
    float: right;
}

.download-list .action a {
    display: block;
    color: #666;
}

.download-list .action a:before {
    display: block;
    float: right;
    margin-left: 1rem;
    font-size: 1.5rem;
    font-family: "iconfont";
    content: "\e608";
}

.download-list .item:hover {
    background: var(--vi-color);
}

.download-list .item:hover * {
    color: #fff;
}

@media(max-width: 992px) {
    .download {
        padding:3.125rem 1.25rem;
    }

    .download-list .item {
        margin-bottom: 1.25rem;
        font-size: 1.5rem;
    }

    .download-list .time {
        display: none;
        margin-right: 1rem;
    }
}

/*--end download--*/
/*--contact--*/
.contact {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.contact-inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: 5rem;
    overflow: hidden;
    border-bottom: #e5e5e5 solid 1px;
}

.contact-inner .text {
    position: relative;
    padding-right: 50px;
    width: calc(100% - 45%);
    overflow: hidden;
}

.contact-inner .text .infos {
    overflow: hidden;
}

.contact-inner .text .infos h2 {
    margin-bottom: 1.875rem;
    font-size: 2.625rem;
    color: #333;
}

.contact-inner .text .infos p {
    font-size: 1.25rem;
    line-height: 1.5;
    font-family: "DIN Medium";
    color: #666;
}

.contact-inner .text .QRcode {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    overflow: hidden;
}

.contact-inner .text .QRcode .item {
    float: left;
    margin-right: 1.25rem;
    padding: 0.5rem;
    width: 8.125rem;
    text-align: center;
    border: #e5e5e5 solid 1px;
    border-radius: 5px;
}

.contact-inner .text .QRcode .item span {
    display: block;
    margin-top: 0.5rem;
    font-size: 1rem;
    color: #666;
}

.contact-inner .pic {
    width: 45%;
    height: 500px;
    overflow: hidden;
    border: #f0f0f0 solid 1px;
    border-radius: 5px;
    animation: fadeInRight 1s;
}

.contact-inner .pic img {
    display: block;
    width: 100%;
    transition: all 1s;
}

.contact-inner .pic>p {
    position: relative;
    top: 50%;
    left: 50%;
    width: 800px;
    height: 560px;
    transform: translate(-50%,-50%);
}

.contact-form {
    padding-top: 5rem;
    overflow: hidden;
    background: #fff;
    border-top: #e5e5e5 solid 1px;
}

.contact-form .hd {
    overflow: hidden;
}

.contact-form .hd h2 {
    font-size: 2.625rem;
    color: #333;
    line-height: 1.25;
}

.contact-form .hd p {
    margin-top: 1rem;
    font-size: 1rem;
    line-height: 1.25;
    color: #999;
}

.contact-form .bd {
    margin-top: 3.75rem;
}

.contact-form .bd .iptBox {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.contact-form .bd .iptBox input {
    padding: 1.25rem 2.5rem;
    width: calc(33.33% - 20px);
    height: 4.375rem;
    font-size: 1.25rem;
    background: #f6f6f6;
    border: none;
    border-radius: 5px;
    outline: none;
    transition: all 1s;
}

.contact-form .bd .iptBox input::-webkit-input-placeholder {
    color: #999;
}

.contact-form .bd .iptBox input:hover {
    background: #fff;
    box-shadow: 0 0 2rem rgba(0,0,0,0.1);
}

.contact-form .bd .txtBox {
    margin-top: 2rem;
}

.contact-form .bd .txtBox textarea {
    display: block;
    padding: 1.25rem 2.5rem;
    width: 100%;
    height: 10rem;
    font-size: 1.25rem;
    background: #f6f6f6;
    border: none;
    outline: none;
    resize: none;
    transition: all 1s;
}

.contact-form .bd .txtBox textarea::-webkit-input-placeholder {
    color: #999;
}

.contact-form .bd .txtBox textarea:hover {
    background: #fff;
    box-shadow: 0 0 2rem rgba(0,0,0,0.1);
}

.contact-form .bd .btnBox {
    margin-top: 3.125rem;
    overflow: hidden;
}

.contact-form .bd .btnBox a {
    display: block;
    float: right;
    width: 26.875rem;
    height: 4.375rem;
    line-height: 4.375rem;
    font-size: 1.25rem;
    color: #fff;
    text-align: center;
    background: var(--vi-color);
    border-radius: 5px;
}

@media(max-width: 992px) {
    .contact {
        padding:3.125rem 1.25rem;
    }

    .contact-inne {
        padding-bottom: 3.125rem;
    }

    .contact-inner .text {
        width: 100%;
        padding-right: 0;
    }

    .contact-inner .text .infos h2 {
        font-size: 2rem;
    }

    .contact-inner .text .infos p {
        font-size: 1.5rem;
    }

    .contact-inner .text .QRcode {
        position: static;
        margin-top: 2.5rem;
    }

    .contact-inner .text .QRcode .item {
        width: 12rem;
    }

    .contact-inner .pic {
        margin-top: 3.125rem;
        width: 100%;
        animation: fadeInUp 1s;
    }

    .contact-form {
        padding-top: 0;
        border-top: none;
    }

    .contact-form .hd h2 {
        font-size: 1.875rem;
    }

    .contact-form .hd p {
        font-size: 1.5rem;
    }

    .contact-form .bd {
        margin-top: 2.25rem;
    }

    .contact-form .bd .iptBox input {
        margin-bottom: 1.25rem;
        padding: 1.5rem 1.875rem;
        width: 100%;
        font-size: 1.5rem;
    }

    .contact-form .bd .txtBox {
        margin-top: 0;
    }

    .contact-form .bd .txtBox textarea {
        padding: 1.5rem 1.875rem;
        width: 100%;
        height: 10rem;
        font-size: 1.5rem;
    }

    .contact-form .bd .btnBox {
        margin-top: 1.25rem;
    }

    .contact-form .bd .btnBox a {
        float: none;
        width: 100%;
        height: 5rem;
        line-height: 5rem;
        font-size: 1.5rem;
    }
}

/*--end contact--*/
/*--jobs--*/
.jobs {
    overflow: hidden;
    background: #fff;
}

.jobs-welfare {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 5rem 0;
    border-bottom: #f0f0f0 solid 1px;
}

.jobs-welfare .item {
    flex: none;
    padding: 2.75rem 2.5rem 4rem;
    width: 25%;
    text-align: center;
    overflow: hidden;
    background: #fff;
    border-radius: 5px;
    transition: all .5s;
    position: relative;
}

.jobs-welfare .item i {
    display: block;
    position: relative;
    margin: 0 auto;
    width: 4rem;
    height: 4rem;
}

.jobs-welfare .item h3 {
    margin-top: 1.125rem;
    line-height: 2.25rem;
    font-size: 1.25rem;
    color: #333;
}

.jobs-welfare .item p {
    margin-top: 1.625rem;
    font-size: 1rem;
    line-height: 1.75;
    color: #666;
}

.jobs-welfare .item:hover {
    z-index: 9;
    box-shadow: 0 0 2rem rgba(0,0,0,0.15);
}

.jobs-cont {
    padding: 5rem 0;
    overflow: hidden;
}

.jobs-cont .box-title {
    margin-bottom: 2.75rem;
    text-align: center;
    animation: fadeInDown 1s;
}

.jobs-cont .box-title h2 {
    font-size: 2.625rem;
}

.jobs-cont .inner {
    overflow: hidden;
}

.jobs-menu {
    float: left;
    width: 260px;
}

.jobs-menu li {
    margin-bottom: 0.625rem;
    padding: 0 1.5rem;
    line-height: 3.75rem;
    font-size: 1.25rem;
    color: #333;
    cursor: pointer;
    background: #f6f6f6;
    border-radius: 5px;
}

.jobs-menu li:before {
    display: block;
    float: right;
    font-family: "iconfont";
    content: "\e694";
}

.jobs-menu li.cur,.jobs-menu li:hover {
    color: #fff;
    background: var(--vi-color);
    transition: all .5s;
}

.jobs-main {
    float: right;
    width: calc(100% - 320px);
}

.jobs-main .item {
    display: none;
    padding: 3.25rem 3.75rem 4.375rem;
    overflow: hidden;
    background: #f6f6f6;
    border-radius: 5px;
}

.jobs-main .item .hd {
    padding-bottom: 2.5rem;
    overflow: hidden;
    border-bottom: #e4e4e4 solid 1px;
}

.jobs-main .item .hd h3 {
    display: inline-block;
    font-size: 1.75rem;
    color: #000;
}

.jobs-main .item .hd em {
    display: inline-block;
    margin-left: 1.5rem;
    font-size: 1rem;
    color: #999;
    font-family: "DIN Medium";
}

.jobs-main .item .hd p {
    margin-top: 0.8rem;
    font-size: 1.25rem;
    color: #666;
}

.jobs-main .item .bd {
    overflow: hidden;
}

.jobs-main .item .bd h4 {
    margin-top: 2.25rem;
    margin-bottom: 1rem;
    font-size: 1.25rem;
    color: #333;
}

.jobs-main .item .bd h4 a {
    font-family: "DIN Medium";
    color: #333;
}

.jobs-main .item .bd p {
    margin-bottom: 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #666;
}

@media(max-width: 992px) {
    .jobs {
        padding:3.125rem 1.25rem;
    }

    .jobs-welfare {
        padding: 0.625rem 0 3.75rem;
    }

    .jobs-welfare .item {
        padding: 0;
        width: 25%;
    }

    .jobs-welfare .item h3 {
        font-size: 1.5rem;
    }

    .jobs-welfare .item p {
        display: none;
    }

    .jobs-welfare .item:hover {
        box-shadow: none;
    }

    .jobs-cont {
        padding: 2.5rem 0 0;
    }

    .jobs-cont .box-title h2 {
        font-size: 1.875rem;
    }

    .jobs-menu {
        float: none;
        width: 100%;
    }

    .jobs-menu li {
        margin-bottom: 0;
        width: auto;
        font-size: 1.5rem;
    }

    .jobs-menu li:before {
        display: none;
    }

    .jobs-main {
        float: none;
        margin-top: 1.25rem;
        width: 100%;
    }

    .jobs-main .item {
        padding: 2.5rem;
    }

    .jobs-main .item .hd {
        padding-bottom: 2.5rem;
    }

    .jobs-main .item .hd h3 {
        font-size: 1.875rem;
    }

    .jobs-main .item .hd em {
        font-size: 1.5rem;
    }

    .jobs-main .item .hd p {
        margin-top: 0.5rem;
        font-size: 1.5rem;
    }

    .jobs-main .item .bd h4 {
        font-size: 1.5rem;
    }

    .jobs-main .item .bd p {
        font-size: 1.5rem;
    }
}

/*--end jobs--*/
/*--cx-msgForm--*/
.cx-msgForm {
    padding: 4.375rem 0;
    overflow: hidden;
    background: #fff;
}

.cx-msgForm-hd {
    padding-bottom: 2.875rem;
    overflow: hidden;
    border-bottom: #e5e5e5 solid 1px;
}

.cx-msgForm-hd h2 {
    font-size: 2.625rem;
    color: #333;
}

.cx-msgForm-hd p {
    margin-top: 0.75rem;
    font-size: 1rem;
    color: #999;
}

.cx-msgForm-bd {
    padding-top: 2.875rem;
}

.cx-msgForm-bd .item {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.cx-msgForm-bd .item .label {
    width: 11.25rem;
    font-size: 1.25rem;
    color: #333;
    overflow: hidden;
}

.cx-msgForm-bd .item .box {
    width: calc(100% - 11.25rem);
}

.cx-msgForm-bd .item-radio,.cx-msgForm-bd .item-checkbox {
    margin-bottom: 1.25rem;
    line-height: 2rem;
}

.cx-msgForm-bd .item-radio li,.cx-msgForm-bd .item-checkbox li {
    position: relative;
    float: left;
    padding-left: 1.75rem;
    width: 10rem;
    cursor: pointer;
}

.cx-msgForm-bd .item-radio li:before,.cx-msgForm-bd .item-checkbox li:before {
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    content: "";
    background: #f6f6f6;
    border: #e6e6e6 solid 1px;
    border-radius: 5px;
    transform: translateY(-50%);
}

.cx-msgForm-bd .item-radio li.active:before,.cx-msgForm-bd .item-checkbox li.active:before {
    background: var(--vi-color) url(../images/Template/tick.png) no-repeat center;
}

.cx-msgForm-bd .item-checkbox span {
    display: inline-block;
    padding: 0 0.75rem;
    font-size: 1rem;
    color: #999;
    user-select: none;
    border: #ccc solid 1px;
    border-radius: 5px;
}

.cx-msgForm-bd .item-select {
    margin-bottom: 2.375rem;
    line-height: 4.375rem;
}

.cx-msgForm-bd .item-select ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -1.25rem;
}

.cx-msgForm-bd .item-select li {
    position: relative;
    margin: 0 1.25rem;
    width: calc(100% / 3 - 2.5rem);
    height: 4.375rem;
    cursor: pointer;
}

.cx-msgForm-bd .item-select li:after {
    display: block;
    position: absolute;
    right: 2rem;
    top: 0;
    line-height: 4.375rem;
    font-family: "iconfont";
    font-size: 1.5rem;
    content: "\e692";
    color: #cfcfcf;
    transition: all .5s;
}

.cx-msgForm-bd .item-select li input {
    display: block;
    padding: 1.25rem 2rem;
    width: 100%;
    height: 4.375rem;
    font-size: 1.25rem;
    color: #999;
    cursor: pointer;
    border: none;
    outline: none;
    background: #f6f6f6;
    border-radius: 5px;
}

.cx-msgForm-bd .item-select li .drop {
    display: none;
    position: absolute;
    z-index: 9;
    top: calc(100% + 1rem);
    left: 0;
    width: 100%;
    height: 12rem;
    overflow: auto;
    background: #fff;
    box-shadow: 0 0 1rem rgba(0,0,0,0.1);
    border-radius: 5px;
}

.cx-msgForm-bd .item-select li .drop a {
    display: block;
    padding: 0.5rem 2rem;
    font-size: 1.25rem;
    line-height: 1.75;
    color: #666;
}

.cx-msgForm-bd .item-select li .drop a:hover {
    color: #fff;
    background: var(--vi-color);
}

.cx-msgForm-bd .item-select li .drop::-webkit-scrollbar {
    width: 2px;
    background: #ccc;
}

.cx-msgForm-bd .item-select li .drop::-webkit-scrollbar-thumb {
    background: var(--vi-color);
}

.cx-msgForm-bd .item-select li.active:after {
    transform: rotateX(180deg);
}

.cx-msgForm-bd .item-select li.active input {
    color: #333;
    background: #fff;
    box-shadow: 0 0 1rem rgba(0,0,0,0.1);
}

.cx-msgForm-bd .item-select li.active .drop {
    display: block;
}

.cx-msgForm-bd .item-ipt {
    margin-bottom: 2.375rem;
    line-height: 4.375rem;
}

.cx-msgForm-bd .item-ipt ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -1.25rem;
}

.cx-msgForm-bd .item-ipt li {
    position: relative;
    margin: 0 1.25rem;
    width: calc(100% / 3 - 2.5rem);
    height: 4.375rem;
    cursor: pointer;
}

.cx-msgForm-bd .item-ipt input {
    display: block;
    padding: 1.25rem 2rem;
    width: 100%;
    height: 4.375rem;
    font-size: 1.25rem;
    line-height: 1.75;
    color: #999;
    border: none;
    outline: none;
    background: #f6f6f6;
    border-radius: 5px;
}

.cx-msgForm-bd .item-ipt textarea {
    display: block;
    margin-top: 1.375rem;
    padding: 1.25rem 2rem;
    width: 100%;
    height: 13.75rem;
    font-size: 1.25rem;
    line-height: 1.75;
    color: #999;
    border: none;
    outline: none;
    resize: none;
    background: #f6f6f6;
    border-radius: 5px;
}

.cx-msgForm-bd .item-ipt input:hover,.cx-msgForm-bd .item-ipt textarea:hover {
    color: #333;
    background: #fff;
    box-shadow: 0 0 1rem rgba(0,0,0,0.1);
    transition: all .25s;
}

.cx-msgForm-bd .item-btn {
    overflow: hidden;
}

.cx-msgForm-bd .item-btn a.submit {
    display: block;
    margin-top: 0.75rem;
    width: 23.75rem;
    line-height: 4.375rem;
    font-size: 1.25rem;
    text-align: center;
    color: #fff;
    background: var(--vi-color);
    border-radius: 5px;
}

@media(max-width: 992px) {
    .cx-msgForm {
        padding:3.125rem 1.25rem;
    }

    .cx-msgForm-hd {
        padding-bottom: 3.125rem;
        border-bottom: none;
    }

    .cx-msgForm-hd h2 {
        display: none;
    }

    .cx-msgForm-hd p {
        margin-top: 0;
        font-size: 1.5rem;
    }

    .cx-msgForm-bd {
        padding-top: 0;
    }

    .cx-msgForm-bd .item .label {
        width: 100%;
        font-size: 1.5rem;
    }

    .cx-msgForm-bd .item .box {
        padding-top: 1.25rem;
        width: 100%;
    }

    .cx-msgForm-bd .item-radio,.cx-msgForm-bd .item-checkbox {
        margin-bottom: 2rem;
        line-height: 3rem;
    }

    .cx-msgForm-bd .item-radio li,.cx-msgForm-bd .item-checkbox li {
        position: relative;
        float: left;
        margin-bottom: 0.5rem;
        padding-left: 30px;
        width: 160px;
        cursor: pointer;
    }

    .cx-msgForm-bd .item-select ul {
        margin: 0 -0.625rem;
    }

    .cx-msgForm-bd .item-select li {
        margin: 0 0.625rem;
        width: calc(100% / 3 - 1.25rem);
        cursor: pointer;
    }

    .cx-msgForm-bd .item-select li input {
        font-size: 1.5rem;
        height: 5rem;
    }

    .cx-msgForm-bd .item-select li .drop a {
        font-size: 1.5rem;
    }

    .cx-msgForm-bd .item-ipt {
        margin-bottom: 1.25rem;
    }

    .cx-msgForm-bd .item-ipt li {
        margin-bottom: 1.25rem;
        width: 100%;
        height: auto;
    }

    .cx-msgForm-bd .item-ipt input {
        font-size: 1.5rem;
        height: 5rem;
    }

    .cx-msgForm-bd .item-ipt textarea {
        margin-top: 0;
        font-size: 1.5rem;
    }

    .cx-msgForm-bd .item-btn a.submit {
        margin-top: 0;
        width: 100%;
        line-height: 5rem;
        font-size: 1.5rem;
    }
}

/*--end cx-msgForm--*/
/*--cx-tags-gather--*/
.cx-tags-gather {
    padding: 4.375rem 0;
    overflow: hidden;
    background: #fff;
}

.cx-tags-gather .hd {
    overflow: hidden;
}

.cx-tags-gather .hd h2 {
    font-size: 2.625rem;
    color: #333;
}

.cx-tags-gather .bd {
    padding-top: 2rem;
    overflow: hidden;
}

.cx-tags-gather .bd ul {
    margin: -0.3125rem;
    overflow: hidden;
}

.cx-tags-gather .bd li {
    float: left;
    margin: 0.3125rem;
    line-height: 2.5rem;
    font-size: 1rem;
}

.cx-tags-gather .bd li a {
    display: block;
    padding: 0 0.75rem;
    color: #999;
    background: #f6f6f6;
    border-radius: 5px;
    transition: all .5s;
}

.cx-tags-gather .bd li a:hover {
    color: #fff;
    background: var(--vi-color);
}

@media(max-width: 992px) {
    .cx-tags-gather {
        padding:3.125rem 1.25rem;
    }

    .cx-tags-gather .hd {
        display: none;
    }

    .cx-tags-gather .bd {
        padding-top: 0;
    }

    .cx-tags-gather .bd ul {
        margin: -0.625rem;
    }

    .cx-tags-gather .bd li {
        margin: 0.625rem;
        font-size: 1.5rem;
        line-height: 1.5;
    }

    .cx-tags-gather .bd li a {
        padding: 0.75rem 1rem;
    }
}

/*--end cx-tags--*/
/*--cx-tag-news--*/
.cx-tag-news {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.cx-tag-news .tips {
    font-size: 2.625rem;
    color: #333;
}

.cx-tag-news .tips h1 {
    display: inline-block;
    padding: 0 0.625rem;
    font-size: 2.625rem;
    color: var(--vi-color);
}

.cx-tag-news .news-main .bd {
    padding-top: 2.5rem;
}

@media(max-width: 992px) {
    .cx-tag-news {
        padding:3.125rem 1.25rem;
    }

    .cx-tag-news .tips,.cx-tag-news .tips h1 {
        font-size: 1.875rem;
        text-align: center;
    }

    .cx-tag-news .news-list {
        background: #fff;
    }

    .cx-tag-news .news-list .item {
        margin-top: 0;
        padding: 1.875rem 0;
    }

    .cx-tag-news .news-list .btmBox li {
        display: none;
    }

    .cx-tag-news .news-list .btmBox li.tag {
        display: block;
    }
}

/*--end cx-tag-news--*/
/*--cx-search-all--*/
.cx-search-all {
    padding: 5rem 0;
    overflow: hidden;
    background: #f6f6f6;
}

.cx-search-all .form {
    position: relative;
    margin: 0 auto;
    width: 46.25rem;
    height: 4.375rem;
    background: #fff;
    box-shadow: 0 1rem 2rem rgba(0,0,0,0.1);
    border-radius: 5px;
}

.cx-search-all .form input {
    display: block;
    padding: 0 1.875rem;
    width: 100%;
    height: 4.375rem;
    font-size: 1.25rem;
    border: none;
    outline: none;
    background: transparent;
}

.cx-search-all .form button {
    display: block;
    position: absolute;
    right: 0.625rem;
    top: 50%;
    width: 3rem;
    height: 3rem;
    line-height: 3rem;
    text-align: center;
    color: #fff;
    cursor: pointer;
    border: none;
    outline: none;
    background: var(--vi-color);
    border-radius: 5px;
    transform: translateY(-50%);
}

.cx-search-all .form button i {
    display: block;
    font-size: 1.5rem;
}

.cx-search-tips {
    margin-top: 3.75rem;
    font-size: 2.625rem;
    color: #999;
    text-align: center;
}

.cx-search-tips h1 {
    display: inline-block;
    padding: 0 0.625rem;
    font-size: 2.625rem;
    color: var(--vi-color);
}

.cx-search-list {
    margin-top: 3.125rem;
}

.cx-search-list .item {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    flex-direction: row-reverse;
    padding: 2.5rem 0;
    overflow: hidden;
    animation: fadeInUp 1s ease-out;
    border-radius: 5px;
    transition: all .5s;
}

.cx-search-list .pic {
    width: 20.25rem;
    overflow: hidden;
    border-radius: 5px;
}

.cx-search-list .pic img {
    display: block;
    width: 100%;
    transition: all 1s;
}

.cx-search-list .text {
    position: relative;
    width: 38.125rem;
    transition: all 1s;
}

.cx-search-list .text h3 {
    line-height: 2rem;
    font-size: 1.25rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cx-search-list .text h3 a {
    color: #333;
}

.cx-search-list .text h3 a:hover {
    color: var(--vi-color);
}

.cx-search-list .text p {
    margin: 0.75rem 0;
    line-height: 1.75;
    font-size: 1rem;
    color: #999;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.cx-search-list .text p a {
    color: #999;
}

.cx-search-list .text>span {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    line-height: 1.75;
    font-size: 1rem;
    color: #999;
    overflow: hidden;
}

.cx-search-list .text>span a:after {
    display: inline-block;
    margin-left: 1rem;
    font-family: "iconfont";
    content: "\e694";
}

.cx-search-list .text>span a:hover {
    color: var(--vi-color);
}

.cx-search-list .item:hover {
    box-shadow: 0 0 2rem rgba(0,0,0,0.15);
}

.cx-search-list .item:hover .pic img {
    transform: scale(1.1);
}

.cx-search-list .item:hover .text {
    transform: translateX(2.5rem);
}

@media(max-width: 992px) {
    .cx-search-all {
        padding:3.125rem 1.25rem;
    }

    .cx-search-all .form {
        width: 100%;
        height: 5rem;
    }

    .cx-search-all .form input {
        height: 5rem;
        font-size: 1.5rem;
    }

    .cx-search-tips {
        margin-top: 2.5rem;
        font-size: 1.875rem;
    }

    .cx-search-tips h1 {
        font-size: 1.875rem;
    }

    .cx-search-list .item {
        margin-bottom: 3.75rem;
        padding: 0;
    }

    .cx-search-list .pic {
        width: 40%;
    }

    .cx-search-list .text {
        width: 54%;
    }

    .cx-search-list .text h3 {
        font-size: 1.75rem;
        white-space: unset;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .cx-search-list .text p {
        display: none;
    }

    .cx-search-list .text>span {
        font-size: 1.5rem;
    }

    .cx-search-list .item:hover {
        box-shadow: unset;
    }

    .cx-search-list .item:hover .text {
        transform: translateX(0);
    }

    .cx-search-all .addMore a {
        background: #eaeaea;
    }
}

/*--end cx-search-all--*/
/*--cx-siteMap--*/
.cx-siteMap {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.cx-siteMap .hd {
    padding-bottom: 2.5rem;
    overflow: hidden;
    border-bottom: #e5e5e5 solid 1px;
}

.cx-siteMap .hd li {
    float: left;
    font-size: 2.625rem;
    margin-right: 3.75rem;
}

.cx-siteMap .hd li a {
    color: #ccc;
}

.cx-siteMap .hd li.cur a,.cx-siteMap .hd li:hover a {
    color: #333;
}

.cx-siteMap .bd {
    overflow: hidden;
}

.cx-siteMap .bd .item {
    padding: 2.5rem 0;
    overflow: hidden;
    border-bottom: #e5e5e5 solid 1px;
}

.cx-siteMap .bd .item h3 {
    font-size: 1.25rem;
}

.cx-siteMap .bd .item h3 a {
    color: #333;
}

.cx-siteMap .bd .item ul {
    padding-top: 1rem;
    overflow: hidden;
}

.cx-siteMap .bd .item li {
    float: left;
    margin-right: 2.75rem;
    font-size: 1rem;
    line-height: 2;
}

.cx-siteMap .bd .item li a {
    color: #999;
}

.cx-siteMap .bd .item li a:hover {
    color: #000;
}

@media(max-width: 992px) {
    .cx-siteMap {
        padding:3.125rem 1.25rem;
    }

    .cx-siteMap .hd {
        padding-bottom: 2rem;
    }

    .cx-siteMap .hd li {
        margin-right: 2.875rem;
        font-size: 1.875rem;
    }

    .cx-siteMap .bd .item h3 {
        font-size: 1.5rem;
    }

    .cx-siteMap .bd .item li {
        font-size: 1.5rem;
    }
}

/*--end cx-siteMap--*/
/*--cx-applyLinks--*/
.cx-applyLinks {
    padding: 5rem 0;
    overflow: hidden;
    background: #fff;
}

.cx-applyLinks .hd {
    overflow: hidden;
}

.cx-applyLinks .hd h2 {
    font-size: 2.625rem;
    color: #333;
}

.cx-applyLinks .hd p {
    margin-top: 0.75rem;
    font-size: 1rem;
    color: #999;
}

.cx-applyLinks .bd {
    padding-top: 3.5rem;
}

.cx-applyLinks .bd .iptBox {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.cx-applyLinks .bd .iptBox input {
    padding: 1.25rem 2rem;
    width: 30.7%;
    font-size: 1.25rem;
    color: #333;
    border: none;
    background: #f6f6f6;
    outline: none;
    border-radius: 5px;
    transition: all .5s;
}

.cx-applyLinks .bd .iptBox input::-webkit-input-placeholder {
    color: #999;
}

.cx-applyLinks .bd .iptBox input:hover {
    background: #fff;
    box-shadow: 0 0 2rem rgba(0,0,0,0.1);
}

.cx-applyLinks .bd .txtBox {
    margin-top: 3.125rem;
}

.cx-applyLinks .bd .txtBox textarea {
    padding: 1.25rem 2rem;
    width: 100%;
    height: 10rem;
    font-size: 1.25rem;
    color: #333;
    border: none;
    background: #f6f6f6;
    outline: none;
    resize: none;
    border-radius: 5px;
    transition: all .5s;
}

.cx-applyLinks .bd .txtBox textarea::-webkit-input-placeholder {
    color: #999;
}

.cx-applyLinks .bd .txtBox textarea:hover {
    background: #fff;
    box-shadow: 0 0 2rem rgba(0,0,0,0.1);
}

.cx-applyLinks .bd .btnBox {
    margin-top: 3.125rem;
    text-align: right;
}

.cx-applyLinks .bd .btnBox a {
    display: inline-block;
    padding: 1.25rem 2rem;
    width: 26.875rem;
    font-size: 1.25rem;
    color: #fff;
    text-align: center;
    background: var(--vi-color);
    border-radius: 5px;
}

@media(max-width: 992px) {
    .cx-applyLinks {
        padding:3.125rem 1.25rem;
    }

    .cx-applyLinks .hd h2 {
        display: none;
    }

    .cx-applyLinks .hd p {
        margin-top: 0;
        font-size: 1.5rem;
    }

    .cx-applyLinks .bd {
        padding-top: 1.5rem;
    }

    .cx-applyLinks .bd .iptBox input {
        margin-bottom: 1.25rem;
        width: 100%;
        font-size: 1.5rem;
    }

    .cx-applyLinks .bd .txtBox {
        margin-top: 0;
    }

    .cx-applyLinks .bd .btnBox {
        margin-top: 1.25rem;
    }

    .cx-applyLinks .bd .btnBox a {
        display: block;
        width: 100%;
        font-size: 1.5rem;
    }
}

/*--end cx-applyLinks--*/
/*--cx-error-404--*/
.cx-error-404 {
    padding: 10rem 0;
    overflow: hidden;
    background: #f6f6f6;
}

.cx-error-404 .inner {
    text-align: center;
    overflow: hidden;
}

.cx-error-404 .tit {
    font-size: 2.625rem;
    line-height: 1.75;
    color: #999;
}

.cx-error-404 .pic {
    overflow: hidden;
}

.cx-error-404 .pic img {
    margin: 0 auto;
    width: auto;
    max-width: 100%;
}

.cx-error-404 .tips {
    padding-top: 1.25rem;
}

.cx-error-404 .tips p {
    font-size: 1.25rem;
    line-height: 1.75;
    color: #999;
}

.cx-error-404 .tips ul {
    display: flex;
    justify-content: center;
    padding: 1.25rem;
}

.cx-error-404 .tips li {
    margin: 0 0.625rem;
    width: 11.25rem;
    height: 3.75rem;
    line-height: 3.75rem;
    font-size: 1em;
}

.cx-error-404 .tips li a {
    display: block;
    border-radius: 5px;
    box-shadow: 0 0 1rem rgba(0,0,0,0.05);
    transition: all .5s;
}

.cx-error-404 .tips li a:hover {
    color: #fff;
    background: var(--vi-color);
}

@media(max-width: 992px) {
    .cx-error-404 {
        padding:10rem 1.25rem;
    }

    .cx-error-404 .tit {
        font-size: 1.875rem;
    }

    .cx-error-404 .pic img {
        width: 50%;
    }

    .cx-error-404 .tips {
        padding-top: 4.5rem;
    }

    .cx-error-404 .tips p {
        font-size: 1.5rem;
    }

    .cx-error-404 .tips li {
        margin: 0 0.625rem;
        width: 14.375rem;
        height: 5rem;
        line-height: 5rem;
        font-size: 1.5em;
    }
}

/*--end cx-error-404--*/
/*--cx-error-close--*/
.cx-error-close {
    position: relative;
    width: 100vw;
    height: 100vh;
}

.cx-error-close .inner {
    position: fixed;
    z-index: 9;
    top: 50%;
    left: 50%;
    padding: 4.625rem 1.25rem;
    width: 40rem;
    text-align: center;
    background: #f6f6f6;
    border-radius: 5px;
    transform: translate(-50%,-50%);
}

.cx-error-close .inner h2 {
    margin-bottom: 0.75rem;
    font-size: 2.625rem;
    color: #333;
}

.cx-error-close .inner p {
    font-size: 1.25rem;
    line-height: 1.5;
    color: #999;
}

.cx-error-close .inner p em {
    font-family: "DIN Medium";
    color: #000;
}

.cx-error-close .inner a {
    display: block;
    margin: 3.375rem auto 0;
    width: 8.125rem;
    height: 3.75rem;
    line-height: 3.75rem;
    font-size: 1.25rem;
    color: #fff;
    background: var(--vi-color);
    border-radius: 5px;
}

.cx-error-close .inner a:hover {
    background: #000;
}

@media(max-width: 992px) {
    .cx-error-close .inner {
        width:85%;
    }

    .cx-error-close .inner h2 {
        font-size: 2.625rem;
    }

    .cx-error-close .inner p {
        font-size: 1.5rem;
    }

    .cx-error-close .inner a {
        font-size: 1.5rem;
    }
}


#nodata, .nodata {
    padding: 80px 80px 80px 150px;
    border: solid 1px #eee;
    margin: 10px 0;
    background: url(../images/Template/nodata.gif) no-repeat 20px 20px;
    background-color: #fff;
    width: 100%;
}

@media screen and (max-width: 640px) {
    .product .product-list[data-mode="card"] .item {
        margin-bottom:2.5rem;
        width: calc(100% / 2 - 10px);
    }

    .product .product-list[data-mode="card"] .item:nth-child(even) {
        margin-right: 0;
    }

    .product-con .pro-pic {
        width: 100%;
        float: none;
    }
}
