
/*! #index-banner start */
.md21724.index-banner-wrap {
    position: relative
}

.md21724.index-banner-wrap .icon-box {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
    max-width: 100%;
    max-height: 100%;
    transition: .3s
}

.md21724.index-banner-wrap .icon-box.reverse-x {
    transform: rotateY(180deg)
}

.md21724.index-banner-wrap .icon-box.reverse-y {
    transform: rotateX(180deg)
}

.md21724.index-banner-wrap .icon-box.white {
    filter: grayscale(1) brightness(15)
}

.md21724.index-banner-wrap .icon-box.black {
    filter: grayscale(1) brightness(0)
}

.md21724.index-banner-wrap .icon-box img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: .3s
}

.md21724.index-banner-wrap .icon-box svg {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    transition: .3s
}

.md21724.index-banner-wrap .icon-box img:nth-child(2),
.md21724.index-banner-wrap .icon-box svg:nth-child(2) {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 5
}

.md21724.index-banner-wrap .hover-icon:hover .icon-box img:first-child,
.md21724.index-banner-wrap .active-icon .icon-box img:first-child {
    opacity: 0
}

.md21724.index-banner-wrap .hover-icon:hover .icon-box img:last-child,
.md21724.index-banner-wrap .active-icon .icon-box img:last-child {
    opacity: 1
}

.md21724.index-banner-wrap .cn-wh,
.md21724.index-banner-wrap .cn-w,
.md21724.index-banner-wrap .cv-wh,
.md21724.index-banner-wrap .cv-w {
    display: block;
    width: 100%
}

.md21724.index-banner-wrap .cn-wh,
.md21724.index-banner-wrap .cn-h,
.md21724.index-banner-wrap .cv-wh,
.md21724.index-banner-wrap .cv-h {
    display: block;
    height: 100%
}

.md21724.index-banner-wrap .cn-wh,
.md21724.index-banner-wrap .cn-w,
.md21724.index-banner-wrap .cn-h {
    object-fit: contain
}

.md21724.index-banner-wrap .cv-wh,
.md21724.index-banner-wrap .cv-w,
.md21724.index-banner-wrap .cv-h {
    object-fit: cover
}

.md21724.index-banner-wrap .pic-box {
    max-width: 100%;
    max-height: 100%
}

.md21724.index-banner-wrap .pic-box img {
    max-width: 100%;
    max-height: 100%
}

.md21724.index-banner-wrap.wrap,
.md21724.index-banner-wrap .wrap {
    padding-left: 4%;
    padding-right: 4%;
    max-width: 100%
}

.md21724.index-banner-wrap .area {
    margin: 0 auto;
    width: 100%;
    max-width: 16rem
}

.md21724.index-banner-wrap .area2 {
    margin: 0 auto;
    width: 100%;
    max-width: 14.5rem
}

.md21724.index-banner-wrap button,
.md21724.index-banner-wrap input,
.md21724.index-banner-wrap textarea {
    border: none;
    outline: none;
    padding: 0;
    background-color: rgba(0, 0, 0, 0)
}

.md21724.index-banner-wrap button {
    cursor: pointer
}

.md21724.index-banner-wrap *,
.md21724.index-banner-wrap *::before,
.md21724.index-banner-wrap *::after {
    word-break: keep-all
}

.md21724.index-banner-wrap .hide {
    display: none
}

.md21724.index-banner-wrap img[data-src] {
    opacity: 0;
    transition: .3s
}

.md21724.index-banner-wrap img[src] {
    opacity: 1
}

.md21724.index-banner-wrap .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.83rem;
    min-height: 2em;
    line-height: 1;
    padding: .15rem .55rem;
    color: #fff;
    white-space: nowrap;
    cursor: pointer;
    margin-top: 1.4rem;
    transition: .3s
}

.md21724.index-banner-wrap .btn .icon-box {
    margin-left: .31rem
}

.md21724.index-banner-wrap .btn.light {
    border: 1px solid #fff
}

.md21724.index-banner-wrap .btn.light:hover {
    background-color: var(--theme-color);
    transform: translateY(-5px);
    box-shadow: 0 5px 10px rgba(0, 0, 0, .2)
}

.md21724.index-banner-wrap .btn.full {
    background-color:  #ffc200
}

.md21724.index-banner-wrap .btn.full:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 10px rgba(0, 0, 0, .2)
}

.md21724.index-banner-wrap .banner-swp {
    height: 9.37rem
}

.md21724.index-banner-wrap .cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: #fff;
    z-index: 5
}

.md21724.index-banner-wrap .cover-inner {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    height: 100%
}

.md21724.index-banner-wrap .banner-item {
    overflow: hidden
}

.md21724.index-banner-wrap .banner-content {
    width: 7.11rem;
    max-width: 100%
}

.md21724.index-banner-wrap .banner-title {
    line-height: 1.1666666667;
    font-weight: bold
}

.md21724.index-banner-wrap .banner-info {
    line-height: 1.8125;
    margin-top: .385rem;
    margin-bottom: 1.215rem
}

.md21724.index-banner-wrap .swp-pagination {
    display: flex;
    justify-content: center;
    bottom: .6rem
}

.md21724.index-banner-wrap .swiper-pagination-bullet {
    position: relative;
    display: block;
    margin: 0 1em;
    background-color: #fff;
    opacity: 1
}

.md21724.index-banner-wrap .swiper-pagination-bullet::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    height: 2em;
    width: 2em;
    transform: translate(-50%, -50%) scale(0);
    border: 1px solid #fff;
    border-radius: inherit;
    opacity: 0;
    transition: .5s
}

.md21724.index-banner-wrap .swiper-pagination-bullet-active::after {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1
}

/*! #index-banner end */

/*! product start */
.md21725.product-wrap{padding-top:1.1rem;padding-bottom:1.2rem;background-color:#e9eaec}.md21725.product-wrap .icon-box{position:relative;display:flex;align-items:center;justify-content:center;width:1em;height:1em;max-width:100%;max-height:100%;transition:.3s}.md21725.product-wrap .icon-box.reverse-x{transform:rotateY(180deg)}.md21725.product-wrap .icon-box.reverse-y{transform:rotateX(180deg)}.md21725.product-wrap .icon-box.white{filter:grayscale(1) brightness(15)}.md21725.product-wrap .icon-box.black{filter:grayscale(1) brightness(0)}.md21725.product-wrap .icon-box img{width:100%;height:100%;object-fit:contain;transition:.3s}.md21725.product-wrap .icon-box svg{max-width:100%;max-height:100%;object-fit:contain;transition:.3s}.md21725.product-wrap .icon-box img:nth-child(2),.md21725.product-wrap .icon-box svg:nth-child(2){position:absolute;top:0;left:0;opacity:0;z-index:5}.md21725.product-wrap .hover-icon:hover .icon-box img:first-child,.md21725.product-wrap .active-icon .icon-box img:first-child{opacity:0}.md21725.product-wrap .hover-icon:hover .icon-box img:last-child,.md21725.product-wrap .active-icon .icon-box img:last-child{opacity:1}.md21725.product-wrap .cn-wh,.md21725.product-wrap .cn-w,.md21725.product-wrap .cv-wh,.md21725.product-wrap .cv-w{display:block;width:100%}.md21725.product-wrap .cn-wh,.md21725.product-wrap .cn-h,.md21725.product-wrap .cv-wh,.md21725.product-wrap .cv-h{display:block;height:100%}.md21725.product-wrap .cn-wh,.md21725.product-wrap .cn-w,.md21725.product-wrap .cn-h{object-fit:contain}.md21725.product-wrap .cv-wh,.md21725.product-wrap .cv-w,.md21725.product-wrap .cv-h{object-fit:cover}.md21725.product-wrap .pic-box{max-width:100%;max-height:100%}.md21725.product-wrap .pic-box img{max-width:100%;max-height:100%}.md21725.product-wrap.wrap,.md21725.product-wrap .wrap{padding-left:4%;padding-right:4%;max-width:100%}.md21725.product-wrap .area{margin:0 auto;width:100%;max-width:16rem}.md21725.product-wrap .area2{margin:0 auto;width:100%;max-width:14.5rem}.md21725.product-wrap button,.md21725.product-wrap input,.md21725.product-wrap textarea{border:none;outline:none;padding:0;background-color:rgba(0,0,0,0)}.md21725.product-wrap button{cursor:pointer}.md21725.product-wrap *,.md21725.product-wrap *::before,.md21725.product-wrap *::after{word-break:keep-all}.md21725.product-wrap .hide{display:none}.md21725.product-wrap img[data-src]{opacity:0;transition:.3s}.md21725.product-wrap img[src]{opacity:1}.md21725.product-wrap .btn{display:inline-flex;align-items:center;justify-content:center;min-width:1.83rem;min-height:2em;line-height:1;padding:.15rem .55rem;color:#fff;white-space:nowrap;cursor:pointer;margin-top:0;transition:.3s}.md21725.product-wrap .btn .icon-box{margin-left:.31rem}.md21725.product-wrap .btn.light{border:1px solid #fff}.md21725.product-wrap .btn.light:hover{background-color:var(--theme-color);transform:translateY(-5px);box-shadow:0 5px 10px rgba(0,0,0,.2)}.md21725.product-wrap .btn.full{background-color:var(--theme-color)}.md21725.product-wrap .btn.full:hover{transform:translateY(-5px);box-shadow:0 5px 10px rgba(0,0,0,.2)}.md21725.product-wrap .product-head{display:flex;align-items:center;justify-content:space-between}.md21725.product-wrap .product-main{margin-top:.45rem}.md21725.product-wrap .product-title{font-weight:bold;line-height:1.2}.md21725.product-wrap .product-swp{padding-bottom:.5rem}.md21725.product-wrap .swiper-scrollbar-drag{background-color:var(--theme-color)}.md21725.product-wrap .product-item{position:relative;display:flex;width:3.45rem;height:auto;flex-shrink:0;height:5.32rem;transition:.3s;}.md21725.product-wrap .product-item:hover .product-img img{transform:scale(1.1)}.md21725.product-wrap .product-item.swiper-slide-active{width:7.1rem}.md21725.product-wrap .bg{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.md21725.product-wrap .product-entry{position:relative;display:flex;flex-direction:column;padding:.45rem .48rem .3rem;z-index:5}.md21725.product-wrap .product-name{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;/*! autoprefixer:off */-webkit-box-orient:vertical;/*! autoprefixer:on */-webkit-box-orient:vertical;max-width:100%;max-height:1.3333333333em;display:block;white-space:nowrap;line-height:1.3333333333;color:#182c3c;font-weight:bold;flex-shrink:0}.md21725.product-wrap .product-info{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;/*! autoprefixer:off */-webkit-box-orient:vertical;/*! autoprefixer:on */-webkit-box-orient:vertical;max-width:100%;max-height:5.25em;-webkit-line-clamp:3;line-height:1.75;margin-top:-0.01rem;margin-bottom:.09rem;color:#182c3c;flex-shrink:0}.md21725.product-wrap .product-img{display:flex;justify-content:center;flex:1;overflow:hidden}.md21725.product-wrap .product-img img{transition:.5s}.md21725.product-wrap .more-btn{position:absolute;bottom:.3rem;left:.48rem;width:1em;height:1em;display:flex;align-items:center;justify-content:center;background-color:var(--theme-color);z-index:10}
.md21725.product-wrap .product-entry{width: 100%;}
/*! product end */

/*! about start */
.md21726.about-wrap {
    position: relative;
    color: #182c3c;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat
}

.md21726.about-wrap .icon-box {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
    max-width: 100%;
    max-height: 100%;
    transition: .3s
}

.md21726.about-wrap .icon-box.reverse-x {
    transform: rotateY(180deg)
}

.md21726.about-wrap .icon-box.reverse-y {
    transform: rotateX(180deg)
}

.md21726.about-wrap .icon-box.white {
    filter: grayscale(1) brightness(15)
}

.md21726.about-wrap .icon-box.black {
    filter: grayscale(1) brightness(0)
}

.md21726.about-wrap .icon-box img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: .3s
}

.md21726.about-wrap .icon-box svg {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    transition: .3s
}

.md21726.about-wrap .icon-box img:nth-child(2),
.md21726.about-wrap .icon-box svg:nth-child(2) {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 5
}

.md21726.about-wrap .hover-icon:hover .icon-box img:first-child,
.md21726.about-wrap .active-icon .icon-box img:first-child {
    opacity: 0
}

.md21726.about-wrap .hover-icon:hover .icon-box img:last-child,
.md21726.about-wrap .active-icon .icon-box img:last-child {
    opacity: 1
}

.md21726.about-wrap .cn-wh,
.md21726.about-wrap .cn-w,
.md21726.about-wrap .cv-wh,
.md21726.about-wrap .cv-w {
    display: block;
    width: 100%
}

.md21726.about-wrap .cn-wh,
.md21726.about-wrap .cn-h,
.md21726.about-wrap .cv-wh,
.md21726.about-wrap .cv-h {
    display: block;
    height: 100%
}

.md21726.about-wrap .cn-wh,
.md21726.about-wrap .cn-w,
.md21726.about-wrap .cn-h {
    object-fit: contain
}

.md21726.about-wrap .cv-wh,
.md21726.about-wrap .cv-w,
.md21726.about-wrap .cv-h {
    object-fit: cover
}

.md21726.about-wrap .pic-box {
    max-width: 100%;
    max-height: 100%
}

.md21726.about-wrap .pic-box img {
    max-width: 100%;
    max-height: 100%
}

.md21726.about-wrap.wrap,
.md21726.about-wrap .wrap {
    padding-left: 4%;
    padding-right: 4%;
    max-width: 100%
}

.md21726.about-wrap .area {
    margin: 0 auto;
    width: 100%;
    max-width: 16rem
}

.md21726.about-wrap .area2 {
    margin: 0 auto;
    width: 100%;
    max-width: 14.5rem
}

.md21726.about-wrap button,
.md21726.about-wrap input,
.md21726.about-wrap textarea {
    border: none;
    outline: none;
    padding: 0;
    background-color: rgba(0, 0, 0, 0)
}

.md21726.about-wrap button {
    cursor: pointer
}

.md21726.about-wrap *,
.md21726.about-wrap *::before,
.md21726.about-wrap *::after {
    word-break: keep-all
}

.md21726.about-wrap .hide {
    display: none
}

.md21726.about-wrap img[data-src] {
    opacity: 0;
    transition: .3s
}

.md21726.about-wrap img[src] {
    opacity: 1
}

.md21726.about-wrap .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.83rem;
    min-height: 2em;
    line-height: 1;
    padding: .15rem .55rem;
    color: #fff;
    white-space: nowrap;
    cursor: pointer;
    margin-top: 0;
    transition: .3s
}

.md21726.about-wrap .btn .icon-box {
    margin-left: .31rem
}

.md21726.about-wrap .btn.light {
    border: 1px solid #fff
}

.md21726.about-wrap .btn.light:hover {
    background-color: var(--theme-color);
    transform: translateY(-5px);
    box-shadow: 0 5px 10px rgba(0, 0, 0, .2)
}

.md21726.about-wrap .btn.full {
    background-color: var(--theme-color)
}

.md21726.about-wrap .btn.full:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 10px rgba(0, 0, 0, .2)
}

.md21726.about-wrap .about {
    min-height: 8.44rem;
    padding-top: .3rem;
    padding-bottom: 2.5rem
}

.md21726.about-wrap .cover {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: .6rem 0 0;
    height: 100%
}

.md21726.about-wrap .about-title {
    line-height: 1.2;
    font-weight: bold
}

.md21726.about-wrap .about-info {
    line-height: 1.75;
    margin-top: .39rem;
    margin-bottom: 1.34rem
}

.md21726.about-wrap .data-board-box {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 50%);
    display: flex;
    width: 14.52rem;
    min-height: 2.3rem;
    max-width: 100%;
    border-radius: .2rem;
    background-color: var(--theme-color)
}

.md21726.about-wrap .data-board {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    color: #fff
}

.md21726.about-wrap .data-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    flex-shrink: 0;
    padding: .25rem
}

.md21726.about-wrap .data-item:nth-child(n+2) {
    border-left: 1px solid hsla(0, 0%, 100%, .15)
}

.md21726.about-wrap .data-entry {
    max-width: 100%;
    width: 2.1rem
}

.md21726.about-wrap .data-val {
    line-height: 1;
    font-weight: bold
}

.md21726.about-wrap .data-info {
    line-height: 1.375;
    margin-top: .25rem
}

@media(max-width:1920px) {
    .md21726.about-wrap .data-entry {
        width: 210px
    }
}

@media(max-width:500px) {
    .md21726.about-wrap .data-board-box {
        position: static;
        transform: none
    }

    .md21726.about-wrap .data-board {
        flex-wrap: wrap
    }

    .md21726.about-wrap .data-item {
        width: 50%
    }
}

/*! about end */

/*! service start */
.md21727.service-wrap{padding-top:2.15rem;background-position:center;background-size:cover;background-repeat:no-repeat;color:#fff}.md21727.service-wrap .icon-box{position:relative;display:flex;align-items:center;justify-content:center;width:1em;height:1em;max-width:100%;max-height:100%;transition:.3s}.md21727.service-wrap .icon-box.reverse-x{transform:rotateY(180deg)}.md21727.service-wrap .icon-box.reverse-y{transform:rotateX(180deg)}.md21727.service-wrap .icon-box.white{filter:grayscale(1) brightness(15)}.md21727.service-wrap .icon-box.black{filter:grayscale(1) brightness(0)}.md21727.service-wrap .icon-box img{width:100%;height:100%;object-fit:contain;transition:.3s}.md21727.service-wrap .icon-box svg{max-width:100%;max-height:100%;object-fit:contain;transition:.3s}.md21727.service-wrap .icon-box img:nth-child(2),.md21727.service-wrap .icon-box svg:nth-child(2){position:absolute;top:0;left:0;opacity:0;z-index:5}.md21727.service-wrap .hover-icon:hover .icon-box img:first-child,.md21727.service-wrap .active-icon .icon-box img:first-child{opacity:0}.md21727.service-wrap .hover-icon:hover .icon-box img:last-child,.md21727.service-wrap .active-icon .icon-box img:last-child{opacity:1}.md21727.service-wrap .cn-wh,.md21727.service-wrap .cn-w,.md21727.service-wrap .cv-wh,.md21727.service-wrap .cv-w{display:block;width:100%}.md21727.service-wrap .cn-wh,.md21727.service-wrap .cn-h,.md21727.service-wrap .cv-wh,.md21727.service-wrap .cv-h{display:block;height:100%}.md21727.service-wrap .cn-wh,.md21727.service-wrap .cn-w,.md21727.service-wrap .cn-h{object-fit:contain}.md21727.service-wrap .cv-wh,.md21727.service-wrap .cv-w,.md21727.service-wrap .cv-h{object-fit:cover}.md21727.service-wrap .pic-box{max-width:100%;max-height:100%}.md21727.service-wrap .pic-box img{max-width:100%;max-height:100%}.md21727.service-wrap.wrap,.md21727.service-wrap .wrap{padding-left:4%;padding-right:4%;max-width:100%}.md21727.service-wrap .area{margin:0 auto;width:100%;max-width:16rem}.md21727.service-wrap .area2{margin:0 auto;width:100%;max-width:14.5rem}.md21727.service-wrap button,.md21727.service-wrap input,.md21727.service-wrap textarea{border:none;outline:none;padding:0;background-color:rgba(0,0,0,0)}.md21727.service-wrap button{cursor:pointer}.md21727.service-wrap *,.md21727.service-wrap *::before,.md21727.service-wrap *::after{word-break:keep-all}.md21727.service-wrap .hide{display:none}.md21727.service-wrap img[data-src]{opacity:0;transition:.3s}.md21727.service-wrap img[src]{opacity:1}.md21727.service-wrap .service-title{line-height:1.2;text-align:center}.md21727.service-wrap .service-info{line-height:1.5625;margin-top:.305rem;margin-bottom:.515rem;text-align:center}.md21727.service-wrap .service-main{display:flex;align-items:center}.md21727.service-wrap .service-swp{width:11.2rem;max-width:100%}.md21727.service-wrap .service-item{display:block;min-width:5.42rem;overflow:hidden}.md21727.service-wrap .service-item{position:relative}.md21727.service-wrap .service-item::before{content:"";display:block;padding-top:100%}.md21727.service-wrap .service-item .fill{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;z-index:1;transition:.5s}.md21727.service-wrap .service-item img{transition:.5s}.md21727.service-wrap .service-item:hover img{transform:scale(1.1)}.md21727.service-wrap .cover{position:absolute;top:0;left:0;width:100%;height:100%;padding:.6rem .45rem;z-index:5}.md21727.service-wrap .swp-title{line-height:1.3333333333;margin-top:.35rem}.md21727.service-wrap .swp-btn{display:flex;align-items:center;justify-content:center;width:2em;height:2em;flex-shrink:0;transition:.3s}.md21727.service-wrap .swp-btn{box-shadow:0 0 0 1px #fff inset}.md21727.service-wrap .swp-btn.swp-prev{margin-right:.2rem}.md21727.service-wrap .swp-btn.swp-next{margin-left:.2rem}.md21727.service-wrap .swp-btn:hover{background-color:var(--theme-color)}.md21727.service-wrap .swp-btn:hover{box-shadow:0 0 0 1px hsla(0,0%,100%,0) inset}@media(max-width:500px){.md21727.service-wrap{padding-top:.6rem}}
/*! service end */

/*! experience start */
.md21728.experience-wrap {
    color: #222;
    padding-top: 1.05rem;
    padding-bottom: 1.1rem
}

.md21728.experience-wrap .icon-box {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
    max-width: 100%;
    max-height: 100%;
    transition: .3s
}

.md21728.experience-wrap .icon-box.reverse-x {
    transform: rotateY(180deg)
}

.md21728.experience-wrap .icon-box.reverse-y {
    transform: rotateX(180deg)
}

.md21728.experience-wrap .icon-box.white {
    filter: grayscale(1) brightness(15)
}

.md21728.experience-wrap .icon-box.black {
    filter: grayscale(1) brightness(0)
}

.md21728.experience-wrap .icon-box img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: .3s
}

.md21728.experience-wrap .icon-box svg {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    transition: .3s
}

.md21728.experience-wrap .icon-box img:nth-child(2),
.md21728.experience-wrap .icon-box svg:nth-child(2) {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 5
}

.md21728.experience-wrap .hover-icon:hover .icon-box img:first-child,
.md21728.experience-wrap .active-icon .icon-box img:first-child {
    opacity: 0
}

.md21728.experience-wrap .hover-icon:hover .icon-box img:last-child,
.md21728.experience-wrap .active-icon .icon-box img:last-child {
    opacity: 1
}

.md21728.experience-wrap .cn-wh,
.md21728.experience-wrap .cn-w,
.md21728.experience-wrap .cv-wh,
.md21728.experience-wrap .cv-w {
    display: block;
    width: 100%
}

.md21728.experience-wrap .cn-wh,
.md21728.experience-wrap .cn-h,
.md21728.experience-wrap .cv-wh,
.md21728.experience-wrap .cv-h {
    display: block;
    height: 100%
}

.md21728.experience-wrap .cn-wh,
.md21728.experience-wrap .cn-w,
.md21728.experience-wrap .cn-h {
    object-fit: contain
}

.md21728.experience-wrap .cv-wh,
.md21728.experience-wrap .cv-w,
.md21728.experience-wrap .cv-h {
    object-fit: cover
}

.md21728.experience-wrap .pic-box {
    max-width: 100%;
    max-height: 100%
}

.md21728.experience-wrap .pic-box img {
    max-width: 100%;
    max-height: 100%
}

.md21728.experience-wrap.wrap,
.md21728.experience-wrap .wrap {
    padding-left: 4%;
    padding-right: 4%;
    max-width: 100%
}

.md21728.experience-wrap .area {
    margin: 0 auto;
    width: 100%;
    max-width: 16rem
}

.md21728.experience-wrap .area2 {
    margin: 0 auto;
    width: 100%;
    max-width: 14.5rem
}

.md21728.experience-wrap button,
.md21728.experience-wrap input,
.md21728.experience-wrap textarea {
    border: none;
    outline: none;
    padding: 0;
    background-color: rgba(0, 0, 0, 0)
}

.md21728.experience-wrap button {
    cursor: pointer
}

.md21728.experience-wrap *,
.md21728.experience-wrap *::before,
.md21728.experience-wrap *::after {
    word-break: keep-all
}

.md21728.experience-wrap .hide {
    display: none
}

.md21728.experience-wrap img[data-src] {
    opacity: 0;
    transition: .3s
}

.md21728.experience-wrap img[src] {
    opacity: 1
}

.md21728.experience-wrap .dialog {
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5333333333);
    opacity: 0;
    pointer-events: none;
    transform: translateY(100%);
    z-index: 60
}

.md21728.experience-wrap .dialog.dialog-show {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0)
}

.md21728.experience-wrap .dialog.dialog-show .dialog-inner {
    animation: dialog-show .5s forwards
}

@keyframes dialog-show {
    0% {
        transform: scale(0) translateY(100%)
    }

    30% {
        transform: scale(0.001, 0.001) translateY(0)
    }

    60% {
        transform: scale(0.001, 1) translateY(0)
    }

    100% {
        transform: scale(1, 1) translateY(0)
    }
}

.md21728.experience-wrap .dialog-inner {
    position: relative;
    transition: .5s
}

.md21728.experience-wrap .dialog-main {
    padding: .3rem;
    border-radius: .08rem;
    background-color: #fff
}

.md21728.experience-wrap .dialog-cancel {
    position: absolute;
    top: .1rem;
    right: .1rem;
    width: 1em;
    height: 1em;
    color: #666;
    background-size: 100%;
    transition: .3s;
    cursor: pointer;
    z-index: 10
}

.md21728.experience-wrap .dialog-cancel .cross {
    position: relative;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
    aspect-ratio: 1;
    cursor: pointer
}

.md21728.experience-wrap .dialog-cancel .cross::before,
.md21728.experience-wrap .dialog-cancel .cross::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: .02rem;
    transform: translate(-50%, -50%);
    background-color: #fff;
    transition: .5s
}

.md21728.experience-wrap .dialog-cancel .cross::before {
    transform: translate(-50%, -50%) rotate(90deg)
}

.md21728.experience-wrap .dialog-cancel .cross::after {
    transform: translate(-50%, -50%) rotate(180deg)
}

.md21728.experience-wrap .dialog-cancel .cross {
    transform: rotate(45deg);
    transition: .3s
}

.md21728.experience-wrap .dialog-cancel:hover {
    transform: scale(1.1)
}

.md21728.experience-wrap .dialog-cancel:hover .cross {
    transform: rotate(135deg)
}

.md21728.experience-wrap .experience-main {
    display: flex;
    margin-top: .55rem
}

.md21728.experience-wrap .experience-big-item {
    position: relative;
    display: block;
    width: 5.76rem;
    flex-shrink: 0
}

.md21728.experience-wrap .experience-big-item {
    position: relative
}

.md21728.experience-wrap .experience-big-item::before {
    content: "";
    display: block;
    padding-top: 146.875%
}

.md21728.experience-wrap .experience-big-item .fill {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    z-index: 1;
    transition: .5s
}

.md21728.experience-wrap .experience-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-left: .3rem
}

.md21728.experience-wrap .experience-item {
    position: relative;
    width: calc((100% - .3rem)/2)
}

.md21728.experience-wrap .experience-item:nth-child(n+3) {
    margin-top: auto
}

.md21728.experience-wrap .vdo-ctrl {
    position: absolute;
    bottom: .35rem;
    right: .35rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 5
}

.md21728.experience-wrap .player {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 2em;
    height: 2em;
    border-radius: 50%;
    background: hsla(0, 0%, 100%, .1);
    transition: .3s
}

.md21728.experience-wrap .player {
    box-shadow: 0 0 0 1px hsla(0, 0%, 100%, .5) inset
}

.md21728.experience-wrap .player * {
    pointer-events: none
}

.md21728.experience-wrap .player:hover {
    background-color: var(--theme-color)
}

.md21728.experience-wrap .player:hover {
    box-shadow: 0 0 0 1px hsla(0, 0%, 100%, 0) inset
}

.md21728.experience-wrap .player-title {
    color: #fff;
    text-align: center;
    line-height: 1.7142857143;
    margin-top: .01rem
}

.md21728.experience-wrap .dialog-main {
    padding: 0;
    overflow: hidden
}

.md21728.experience-wrap .player-vdo {
    max-width: 80vw;
    max-height: 80vh
}

@media(max-width:750px) {
    .md21728.experience-wrap .experience-main {
        flex-direction: column
    }

    .md21728.experience-wrap .experience-big-item {
        width: 100%
    }

    .md21728.experience-wrap .experience-list {
        margin-left: 0
    }

    .md21728.experience-wrap .experience-item:nth-child(n) {
        width: 100%;
        margin-top: .3rem
    }
}

@media(max-width:500px) {
    .md21728.experience-wrap .experience-main {
        flex-direction: column
    }

    .md21728.experience-wrap .experience-big-item {
        width: 100%
    }

    .md21728.experience-wrap .experience-list {
        margin-left: 0
    }

    .md21728.experience-wrap .experience-item:nth-child(n) {
        width: 100%;
        margin-top: .3rem
    }
}

/*! experience end */

/*! brand start */
.md21729.brand-wrap{padding-top:1.1rem;padding-bottom:.9rem;background-position:center;background-size:cover;background-repeat:no-repeat}.md21729.brand-wrap .icon-box{position:relative;display:flex;align-items:center;justify-content:center;width:1em;height:1em;max-width:100%;max-height:100%;transition:.3s}.md21729.brand-wrap .icon-box.reverse-x{transform:rotateY(180deg)}.md21729.brand-wrap .icon-box.reverse-y{transform:rotateX(180deg)}.md21729.brand-wrap .icon-box.white{filter:grayscale(1) brightness(15)}.md21729.brand-wrap .icon-box.black{filter:grayscale(1) brightness(0)}.md21729.brand-wrap .icon-box img{width:100%;height:100%;object-fit:contain;transition:.3s}.md21729.brand-wrap .icon-box svg{max-width:100%;max-height:100%;object-fit:contain;transition:.3s}.md21729.brand-wrap .icon-box img:nth-child(2),.md21729.brand-wrap .icon-box svg:nth-child(2){position:absolute;top:0;left:0;opacity:0;z-index:5}.md21729.brand-wrap .hover-icon:hover .icon-box img:first-child,.md21729.brand-wrap .active-icon .icon-box img:first-child{opacity:0}.md21729.brand-wrap .hover-icon:hover .icon-box img:last-child,.md21729.brand-wrap .active-icon .icon-box img:last-child{opacity:1}.md21729.brand-wrap .cn-wh,.md21729.brand-wrap .cn-w,.md21729.brand-wrap .cv-wh,.md21729.brand-wrap .cv-w{display:block;width:100%}.md21729.brand-wrap .cn-wh,.md21729.brand-wrap .cn-h,.md21729.brand-wrap .cv-wh,.md21729.brand-wrap .cv-h{display:block;height:100%}.md21729.brand-wrap .cn-wh,.md21729.brand-wrap .cn-w,.md21729.brand-wrap .cn-h{object-fit:contain}.md21729.brand-wrap .cv-wh,.md21729.brand-wrap .cv-w,.md21729.brand-wrap .cv-h{object-fit:cover}.md21729.brand-wrap .pic-box{max-width:100%;max-height:100%}.md21729.brand-wrap .pic-box img{max-width:100%;max-height:100%}.md21729.brand-wrap.wrap,.md21729.brand-wrap .wrap{padding-left:4%;padding-right:4%;max-width:100%}.md21729.brand-wrap .area{margin:0 auto;width:100%;max-width:16rem}.md21729.brand-wrap .area2{margin:0 auto;width:100%;max-width:14.5rem}.md21729.brand-wrap button,.md21729.brand-wrap input,.md21729.brand-wrap textarea{border:none;outline:none;padding:0;background-color:rgba(0,0,0,0)}.md21729.brand-wrap button{cursor:pointer}.md21729.brand-wrap *,.md21729.brand-wrap *::before,.md21729.brand-wrap *::after{word-break:keep-all}.md21729.brand-wrap .hide{display:none}.md21729.brand-wrap img[data-src]{opacity:0;transition:.3s}.md21729.brand-wrap img[src]{opacity:1}.md21729.brand-wrap .brand-title{text-align:center;line-height:1.2;color:#fff;font-weight:bold}.md21729.brand-wrap .brand-main{margin-top:.5rem}.md21729.brand-wrap .brand-item{display:flex;flex-wrap:wrap}.md21729.brand-wrap .brand-img{width:calc(20% - .35rem);border:1px solid hsla(0,0%,100%,.15)}.md21729.brand-wrap .brand-img{position:relative}.md21729.brand-wrap .brand-img::before{content:"";display:block;padding-top:32.6923076923%}.md21729.brand-wrap .brand-img .fill{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;z-index:1;transition:.5s}.md21729.brand-wrap .brand-img{width:calc((100% - 1.4rem)/5)}.md21729.brand-wrap .brand-img:nth-child(n+2){margin-left:.35rem}.md21729.brand-wrap .brand-img:nth-child(5n+1){margin-left:0}.md21729.brand-wrap .brand-img:nth-child(n+6){margin-top:.35rem}.md21729.brand-wrap .swp-pagination{position:static;display:flex;justify-content:center;margin-top:.5rem}.md21729.brand-wrap .swiper-pagination-bullet{display:block;margin:0 .1rem;background-color:#fff;transition:.3s;opacity:.3}.md21729.brand-wrap .swiper-pagination-bullet.swiper-pagination-bullet-active{opacity:1}@media(max-width:900px){.md21729.brand-wrap .brand-img{width:calc((100% - 1.05rem)/4)}.md21729.brand-wrap .brand-img:nth-child(n+2){margin-left:.35rem}.md21729.brand-wrap .brand-img:nth-child(4n+1){margin-left:0}.md21729.brand-wrap .brand-img:nth-child(n+5){margin-top:.35rem}}@media(max-width:750px){.md21729.brand-wrap .brand-img{width:calc((100% - .7rem)/3)}.md21729.brand-wrap .brand-img:nth-child(n+2){margin-left:.35rem}.md21729.brand-wrap .brand-img:nth-child(3n+1){margin-left:0}.md21729.brand-wrap .brand-img:nth-child(n+4){margin-top:.35rem}}
/*! brand end */
