.ico,
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list >.item::before,
.com-page-nav-wrap .nav-list .item::before,
.page4 .role-wrap .role-content .attr-list >.item:hover,
.page4 .role-wrap .role-content .attr-list >.item.active,
.page4 .role-wrap .role-content .attr-list >.item .select,
.page5 .strategy-wrap .wrap1 .con .title-wrap .title::before,
.page5 .strategy-wrap .wrap1 .con .title-wrap .title::after,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .sub-list >.item::before,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .op-wrap .btn,
.page6 .media-wrap >.list[data='video'] >.item .img-wrap::after,
.page6 .media-wrap >.list[data='video'] >.item .img-wrap .p6vl-btn-video::before,
.page6 .media-wrap >.list[data='video'] >.item .img-wrap .p6vl-btn-video::after {
  display: inline-block;
  background-image: url(../images/sprite.png?v=20260721);
  background-repeat: no-repeat;
  background-size: 3.86rem 3.29rem;
}
.ico-book {
  width: .27rem;
  height: .34rem;
  background-position: -3.58rem -.73rem;
}
.ico-btn-android {
  width: 2.30rem;
  height: .7rem;
  background-position: 0 0;
}
.ico-btn-ios {
  width: 2.30rem;
  height: .7rem;
  background-position: 0 -.72rem;
}
.ico-btn-more {
  width: .26rem;
  height: .26rem;
  background-position: -3.58rem -1.43rem;
}
.ico-btn-type1-1,
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list >.item::before {
  width: .88rem;
  height: .36rem;
  background-position: 0 -2.58rem;
}
.ico-btn-type1-2,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .op-wrap .btn {
  width: 1.18rem;
  height: .3rem;
  background-position: -.82rem -1.82rem;
}
.ico-btn-type1-3,
.com-page-nav-wrap .nav-list .item::before {
  width: 1.48rem;
  height: .36rem;
  background-position: -.82rem -1.44rem;
}
.ico-btn-type2-1,
.page4 .role-wrap .role-content .attr-list >.item:hover,
.page4 .role-wrap .role-content .attr-list >.item.active {
  width: 1.06rem;
  height: .30rem;
  background-position: 0 -2.26rem;
}
.ico-btn-video-border,
.page6 .media-wrap >.list[data='video'] >.item .img-wrap .p6vl-btn-video::before {
  width: .8rem;
  height: .8rem;
  background-position: 0 -1.44rem;
}
.ico-btn-video,
.page6 .media-wrap >.list[data='video'] >.item .img-wrap::after,
.page6 .media-wrap >.list[data='video'] >.item .img-wrap .p6vl-btn-video::after {
  width: .28rem;
  height: .34rem;
  background-position: -3.58rem -.37rem;
}
.ico-glzx-icon2-1 {
  width: .61rem;
  height: .68rem;
  background-position: -2.32rem 0;
}
.ico-glzx-icon2-2 {
  width: .61rem;
  height: .68rem;
  background-position: -2.32rem -.7rem;
}
.ico-glzx-icon2-3 {
  width: .61rem;
  height: .68rem;
  background-position: -2.32rem -1.4rem;
}
.ico-glzx-icon2-4 {
  width: .61rem;
  height: .68rem;;
  background-position: -2.95rem 0;
}
.ico-glzx-icon2-5 {
  width: .61rem;
  height: .68rem;
  background-position: -2.95rem -.7rem;
}
.ico-glzx-icon2-6 {
  width: .61rem;
  height: .68rem;
  background-position: -2.95rem -1.4rem;
}
.ico-house {
  width: .4rem;
  height: .33rem;
  background-position: 0 -2.96rem;
}
.ico-lantern {
  width: .28rem;
  height: .35rem;
  background-position: -3.58rem 0;
}
.ico-li1,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .sub-list >.item::before {
  width: .11rem;
  height: .11rem;
  background-position: -3.75rem -1.71rem;
}
.ico-line1 {
  width: 2.62rem;
  height: .5rem;
  background-position: -.9rem -2.58rem;
}
.ico-scroll {
  width: .24rem;
  height: .32rem;
  background-position: -3.58rem -1.09rem;
}
.ico-select-active,
.page4 .role-wrap .role-content .attr-list >.item:hover .select,
.page4 .role-wrap .role-content .attr-list >.item.active .select {
  width: .15rem;
  height: .15rem;
  background-position: -3.58rem -1.71rem;
}
.ico-select,
.page4 .role-wrap .role-content .attr-list >.item .select {
  width: .15rem;
  height: .15rem;
  background-position: -3.58rem -1.88rem;
}
.ico-title-dec2,
.page5 .strategy-wrap .wrap1 .con .title-wrap .title::before,
.page5 .strategy-wrap .wrap1 .con .title-wrap .title::after {
  width: 1.02rem;
  height: .21rem;
  background-position: -1.08rem -2.26rem;
}
.ico-txt,
.page4 .cloth-wrap .detail-list >.item .des::before {
  display: inline-block;
  background-image: url(../images/txt.png?v=d215cd9a);
  background-repeat: no-repeat;
  background-size: 1.58rem 1.59rem;
}
.ico-title-szjj,
.page4 .cloth-wrap .detail-list >.item .des::before {
  width: 1.16rem;
  height: .26rem;
  background-position: 0 0;
}
.ico-title-wdtj {
  width: 1.56rem;
  height: .31rem;
  background-position: 0 -.28rem;
}
.ico-title-yytr {
  width: 1.58rem;
  height: .31rem;
  background-position: 0 -.61rem;
}
.ico-title-zqrk {
  width: 1.51rem;
  height: .31rem;
  background-position: 0 -.94rem;
}
.ico-title-glzx {
  width: 1.57rem;
  height: .32rem;
  background-position: 0 -1.27rem;
}
.ico-accordion,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro {
  display: inline-block;
  background-image: url(../images/accordion.png?v=20260412);
  background-repeat: no-repeat;
  background-size: 8.78rem 8.52rem;
}
.ico-accordion-bg1-active,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(1):hover .intro,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(1).active .intro {
  width: .86rem;
  height: 4.25rem;
  background-position: 0 0;
}
.ico-accordion-bg1,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(1) .intro {
  width: .86rem;
  height: 4.25rem;
  background-position: -.88rem 0;
}
.ico-accordion-bg2-active,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(2):hover .intro,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(2).active .intro {
  width: .86rem;
  height: 4.25rem;
  background-position: -1.76rem 0;
}
.ico-accordion-bg2,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(2) .intro {
  width: .86rem;
  height: 4.25rem;
  background-position: -2.64rem 0;
}
.ico-accordion-bg3-active,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(3):hover .intro,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(3).active .intro {
  width: .86rem;
  height: 4.25rem;
  background-position: -3.52rem 0;
}
.ico-accordion-bg3,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(3) .intro {
  width: .86rem;
  height: 4.25rem;
  background-position: -4.4rem 0;
}
.ico-accordion-bg4-active,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(4):hover .intro,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(4).active .intro {
  width: .86rem;
  height: 4.25rem;
  background-position: -5.28rem 0;
}
.ico-accordion-bg4,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(4) .intro {
  width: .86rem;
  height: 4.25rem;
  background-position: -6.16rem 0;
}
.ico-accordion-bg5-active,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(5):hover .intro,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(5).active .intro {
  width: .86rem;
  height: 4.25rem;
  background-position: -7.04rem 0;
}
.ico-accordion-bg5,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(5) .intro {
  width: .86rem;
  height: 4.25rem;
  background-position: -7.92rem 0;
}
.ico-accordion-bg6-active,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(6):hover .intro,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(6).active .intro {
  width: .86rem;
  height: 4.25rem;
  background-position: 0 -4.27rem;
}
.ico-accordion-bg6,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(6) .intro {
  width: .86rem;
  height: 4.25rem;
  background-position: -.88rem -4.27rem;
}
body {
  font-size: 0;
}
img {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
/* @media only screen and (max-width: 1200px) {
  .topbar-wrapper {
    display: none;
  }
} */
.hid {
  display: none !important;
}
.footer-wrapper {
  overflow: auto;
  position: relative;
}
.footer-wrapper .LT-footer.light {
  background-color: transparent;
}
.content {
  position: relative;
  min-width: 8rem
}
.content .nav {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}
.content .nav .nav-top .logo {
  z-index: 1;
}
.content .nav .nav-bottom {
  position: absolute;
  width: 100%;
  background-color: rgba(255,255,255,0.95);
}
/* .main-nav-wrap
    height p2rem(76)
    position sticky
    z-index 11
    top 0
    user-select none
    $itemW = p2r(240)
    $itemH = p2r(56)
    $num = 4
    $codeW = p2r(170)
    .nav-header
        height 100%
        background-color rgba(255,255,255,.95)
        padding 0 p2r(70)
        display flex
        box-shadow 0 -1px 0 0 #e8e8e8 inset
        .game-info-wrap
            $w = p2rem(108)
            padding p2rem(15) 0 p2rem(15) $w
            position relative
            flex-shrink 0
            z-index 1
            .logo
                position absolute
                left 0
                display block
                width $w
                height $w
                background-image url('//ossstatic.leiting.com/static/game/images/wd_icon.png')
                background-size 100% 100%
            .des-wrap
                padding-left p2r(12)
                height 100%
                display flex
                flex-direction column
                justify-content space-around
                .title
                    font-size p2rem(22)
                    color #1fb7ba
                .des
                    font-size p2rem(16)
                    color #999
        .nav-list-wrap
            flex 1
            margin-left p2r(20)
            &:hover
                .mask
                    display block
                    opacity 0
                    animation headerMoveIn .2s linear forwards
                .nav-list
                    >.item
                        .sub-list
                            display block
                            opacity 0
                            animation headerMoveIn .2s linear forwards
                @keyframes headerMoveIn
                    0%
                        opacity 0
                    100%
                        opacity 1
            .nav-list
                height 100%
                display flex
                justify-content flex-end
                >.item
                    max-width $itemW
                    flex 1
                    height 100%
                    display flex
                    align-items center
                    justify-content center
                    position relative
                    z-index 1
                    box-sizing border-box
                    padding 0 p2r(10)
                    &:hover
                        .icon
                            background-color #1fb7ba
                        >.title
                            color #1fb7ba
                    .jump
                        ab-tl(0,0)
                        display block
                        width 100%
                        height 100%
                    .icon
                        background-color #888
                        mask-repeat no-repeat
                        &.icon1
                            w-h-mk-bg-img('icon/nav_icon1_1')
                        &.icon2
                            w-h-mk-bg-img('icon/nav_icon1_2')
                        &.icon3
                            w-h-mk-bg-img('icon/nav_icon1_3')
                        &.icon4
                            w-h-mk-bg-img('icon/nav_icon1_4')
                        &.icon5
                            w-h-mk-bg-img('icon/nav_icon1_5')
                        &+.title
                            margin-left p2r(10)
                    .title
                        f-c(18,#666)
                        white-space nowrap
                    .sub-list
                        ab-tl(100%,0)
                        width 100%
                        display none
                        >.item
                            min-height $itemH
                            position relative
                            &:hover
                                .title
                                    color #1fb7ba
                                .code
                                    display block
                            .jump
                                ab-tl(0,0)
                                width 100%
                                height 100%
                            .title
                                height $itemH
                                display flex
                                align-items center
                                justify-content center
                                f-c(18,#999)
                            .code
                                width $codeW
                                height $codeW
                                display none
                                margin 0 auto
            .mask
                display none
                ab-tl(100%,0)
                width 100%
                min-height $itemH * ($num + 1) + $codeW
                background-color rgba(255,255,255,.95)
    @media only screen and (max-width: $ipadW)
        height p2rem(100)
        .nav-header
            padding 0 p2r(10)
            .nav-list-wrap
                $codeW = p2r(100)
                .nav-list
                    justify-content flex-start
                    >.item
                        .icon
                            transform scale(.8)
                            &+.title
                                margin-left 0
                        .title
                            font-size p2r(14)
                        .sub-list
                            >.item
                                .title
                                    font-size p2r(14)
                                .code
                                    width $codeW
                                    height $codeW
                .mask
                    min-height $itemH * ($num + 1) + $codeW */
.page-wrap {
  position: relative;
}
.page-wrap .bg-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center 0;
  background-size: cover;
  pointer-events: none;
}
.page-wrap .bg-wrap .bd-img{
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: -1;
  pointer-events: none;
  max-width: 100%;
}
.no-webp .page-wrap .bg-wrap {
  background-image: url(../images/bg.jpg?v=20260412);
}
.webp .page-wrap .bg-wrap {
  background-image: url(../images/bg.jpg?v=20260412);
}
.page-wrap .bg-wrap .kv-wrap .kv {
  width: 100%;
  height: 8.5rem;
  -o-object-fit: cover;
     object-fit: cover;
}
.page-wrap .page-content {
  position: relative;
}
/* @media only screen and (max-width: 1350px) {
  .page-wrap .bg-wrap .kv-wrap .kv {
    height: 6.50rem;
  }
} */
.page1 {
  position: relative;
  height: 7.6rem;
  z-index: 1;
}
.page1 .page1-con{
  min-height: 7.6rem;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
}
.page1 .kv-wrap{
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.page1 .kv-more .kv-swiper{
  width: 100%;
  height: 100%;
}
.page1 .kv-more .kv-swiper a,
.page1 .kv-more .kv-swiper .kv{
  display: block;
  width: 100%;
  height: 100%;
}


.page1 .kv-one .kv-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.page1 .kv-one .kv-link{
  z-index: 5;
}

.page1 .kv-one .kv-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  -o-object-fit: cover;
     object-fit: cover;
}
.page1 .kv-one .slogan{
  position: absolute;
  display: block;
  z-index: 3;
}
.page1 .kv-one .pre-warp{
  position: absolute;
  z-index: 4;
  width: 100%;
  display: block;
  pointer-events: none;
  bottom: 0;
  left: 0;
}
.page1 .download-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  z-index: 2;
  top: 5.38rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.page1 .download-wrap .code-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  margin-left: 0.05rem;
  margin-right: 0.05rem;
  display: flex;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border: .02rem solid #92d6e2;
  border-radius: .15rem;
  width: 1.5rem;
  height: 1.5rem;
  background-color: #fff;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
  -webkit-box-pack: center;
      -ms-flex-align: center;
      -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.page1 .download-wrap .code-wrap .code {
  width: 1.4rem;
  height: 1.4rem;
}
.page1 .download-wrap .op-wrap {
  margin-left: 0.05rem;
  margin-right: 0.05rem;
}
.page1 .download-wrap .op-wrap .btn {
    width: 1.84rem;
    display: block;
}
.page1 .download-wrap .op-wrap .btn:hover {
    -webkit-filter: brightness(110%);
    filter: brightness(110%);
}
.page1 .download-wrap .op-wrap .btn+.btn {
  margin-top: .1rem;
}
.page1 .download-wrap .op-wrap .btn+.btn-pay {
    margin-top: .05rem;
}
.page1 .download-wrap .server-wrap {
  margin-left: 0.05rem;
  margin-right: 0.05rem;
  width: 1.4rem;
}
.page1 .download-wrap .server-wrap:hover {
  -webkit-filter: brightness(104%);
          filter: brightness(104%);
}
.page1 .download-wrap .server-wrap .server {
  width: 100%;
}
.page1 .download-wrap .pay-wrap {
  display: none;
  margin-left: 0.05rem;
  margin-right: 0.05rem;
  width: 1.1rem;
  height: 1.5rem;
}
.page1 .download-wrap .pay-wrap.active {
  display: block;
}
.page1 .download-wrap .pay-wrap:hover {
  -webkit-filter: brightness(104%);
          filter: brightness(104%);
}
.page1 .download-wrap .pay-wrap a {
  display: block;
  position: relative;
  height: 100%;
}
.page1 .download-wrap .pay-wrap a img {
  position: absolute;
  bottom: 0;
  left: 0;
  pointer-events: none;
  width: 100%;
}
/* @media only screen and (max-width: 1350px) {
  .page1 {
    height: 6rem;
  }
  .page1 .download-wrap {
    top: 4rem;
    -webkit-transform: translateX(-50%) scale(0.8);
            transform: translateX(-50%) scale(0.8);
  }
} */
.page2 {
  overflow: hidden;
  padding-top: .06rem;
  padding-bottom: 1rem;
  position: relative;
  z-index: 2;
}
.page2 .news-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: flex-start;
          align-items: flex-start;
  -webkit-box-align: start;
  -webkit-box-pack: center;
      -ms-flex-align: start;
      -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.page2 .news-wrap .news-swiper-wrap {
  position: relative;
  width: 7rem;
  height: 3.94rem;
}
.page2 .news-wrap .news-swiper-wrap::before {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 7.08rem;
  height: 4.02rem;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  content: '';
  will-change: transform;
}
.no-webp .page2 .news-wrap .news-swiper-wrap::before {
  background-image: url(../images/news_border.png?v=317b8674);
}
.webp .page2 .news-wrap .news-swiper-wrap::before {
  background-image: url(../webp/news_border.webp?v=c91fa820);
}
.page2 .news-wrap .news-swiper-wrap .news-swiper {
  width: 7rem;
  height: 3.94rem;
  background-color: #fff;
  -webkit-mask-image: url(../images/news_mask.png?v=de449823);
          mask-image: url(../images/news_mask.png?v=de449823);
  -webkit-mask-size: 7rem 3.94rem;
          mask-size: 7rem 3.94rem;
}
.page2 .news-wrap .news-swiper-wrap .news-swiper .swiper-wrapper {
  height: 100%;
}
.page2 .news-wrap .news-swiper-wrap .news-swiper .swiper-slide {
  position: relative;
  height: 100%;
}
.page2 .news-wrap .news-swiper-wrap .news-swiper .swiper-slide .jump {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.page2 .news-wrap .news-swiper-wrap .news-swiper .swiper-slide img {
  width: 100%;
  height: 100%;
  pointer-events: none;
  -o-object-fit: cover;
     object-fit: cover;
}
.page2 .news-wrap .news-swiper-wrap .news-swiper-pagination {
  position: absolute;
  bottom: .1rem;
  left: 50%;
  white-space: nowrap;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.page2 .news-wrap .news-swiper-wrap .news-swiper-pagination .swiper-pagination-bullet {
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: .04rem;
  width: .5rem;
  height: .08rem;
  background-color: transparent;
  background-color: rgba(255,255,255,0.5);
  opacity: 1;
  -webkit-box-shadow: 0 0 0 .01rem rgba(255,255,255,0.5) inset;
          box-shadow: 0 0 0 .01rem rgba(255,255,255,0.5) inset;
}
.page2 .news-wrap .news-swiper-wrap .news-swiper-pagination .swiper-pagination-bullet::after {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 400%;
  content: '';
  cursor: pointer;
}
.page2 .news-wrap .news-swiper-wrap .news-swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #fff;
}
.page2 .news-wrap .news-swiper-wrap .news-swiper-pagination .swiper-pagination-bullet+.swiper-pagination-bullet {
  margin-left: .16rem;
}
.page2 .news-wrap .news-list-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-left: .3rem;
  width: 5.5rem;
  height: 3.94rem;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}
.page2 .news-wrap .news-list-wrap .nav-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  padding-bottom: .06rem;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
.page2 .news-wrap .news-list-wrap .nav-wrap::after {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  border-top: .01rem solid rgba(189,164,96,0.5);
  border-bottom: .01rem solid #bda460;
  width: 100%;
  height: .01rem;
  content: '';
}
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
      -ms-flex-align: center;
}
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list >.item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  width: .88rem;
  height: .36rem;
  cursor: pointer;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
  -webkit-box-pack: center;
      -ms-flex-align: center;
      -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list >.item[data="newsCategory_5"] {
  width: 1.15rem;
}
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list >.item+.item {
  margin-left: .04rem;
}
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list >.item:hover::before,
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list >.item.active::before {
  display: block;
}
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list >.item:hover .txt,
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list >.item.active .txt {
  color: #fff;
}
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list >.item::before {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
}
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list >.item[data="newsCategory_5"]::before {
  width: 1.15rem;
  height: .36rem;
  background-position: -0.88rem -2.93rem;
}
.page2 .news-wrap .news-list-wrap .nav-wrap .type-list >.item .txt {
  overflow: hidden;
  position: relative;
  font-size: .2rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #333;
}
.page2 .news-wrap .news-list-wrap .nav-wrap .btn-more {
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
.page2 .news-wrap .news-list-wrap .nav-wrap .btn-more:hover {
  -webkit-transform: rotateZ(180deg);
          transform: rotateZ(180deg);
}
.page2 .news-wrap .news-list-wrap .news-content-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-flex: 1;
  -webkit-box-orient: vertical;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .top-news-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  border-bottom: .01rem dashed #ccc;
  padding: .16rem 0;
  width: 100%;
  cursor: pointer;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .top-news-wrap:hover .des-wrap {
  -webkit-filter: brightness(110%);
          filter: brightness(110%);
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .top-news-wrap .jump {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .top-news-wrap .cover-wrap {
  overflow: hidden;
  border-radius: .1rem;
  width: 1.8rem;
  height: .86rem;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .top-news-wrap .cover-wrap .cover {
  width: 100%;
  height: 100%;
  pointer-events: none;
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
  -o-object-fit: cover;
     object-fit: cover;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .top-news-wrap .des-wrap {
  margin-left: .24rem;
  min-width: 0;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .top-news-wrap .des-wrap .title {
  overflow: hidden;
  font-size: .18rem;
  font-weight: 700;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #bda460;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .top-news-wrap .des-wrap .des {
  display: -webkit-box;
  overflow: hidden;
  margin-top: .12rem;
  font-size: .16rem;
  line-height: 1.5;
  text-overflow: ellipsis;
  color: #999;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap .news-list {
  display: none;
  height: 100%;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap .news-list.active {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap .news-list >.item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  max-height: .5rem;
  cursor: pointer;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
      -ms-flex-align: center;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap .news-list >.item:hover .type,
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap .news-list >.item:hover .title,
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap .news-list >.item:hover .time {
  -webkit-filter: brightness(110%);
          filter: brightness(110%);
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap .news-list >.item+.item {
  border-top: .01rem dashed #e5e7e8;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap .news-list >.item .jump {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap .news-list >.item .type {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  font-size: .18rem;
  font-weight: 700;
  white-space: nowrap;
  color: #bfa46c;
  pointer-events: none;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap .news-list >.item .type::after {
  display: block;
  margin-left: .06rem;
  width: .01rem;
  height: .16rem;
  background-color: #bfa46c;
  content: '';
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap .news-list >.item .title {
  overflow: hidden;
  padding: 0 .12rem;
  font-size: .16rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #777;
  pointer-events: none;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.page2 .news-wrap .news-list-wrap .news-content-wrap .news-sub-list-wrap .news-list >.item .time {
  font-size: .16rem;
  color: #bbb;
  pointer-events: none;
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
/* @media only screen and (max-width: 1350px) {
  .page2 .news-wrap {
    -webkit-align-items: center;
            align-items: center;
    -webkit-box-align: center;
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
        -ms-flex-align: center;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .page2 .news-wrap .news-list-wrap {
    margin-top: .3rem;
    margin-left: 0;
    width: .700rem;
  }
} */
.com-page-nav-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  margin: 0 auto;
  width: 12.8rem;
  -webkit-transition: width 0.1s linear;
  transition: width 0.1s linear;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
}
.com-page-nav-wrap .title-bg-wrap {
  position: absolute;
  bottom: -.1rem;
  left: 0;
  width: 100%;
  height: .5rem;
  background-image: url(../images/title_bg_c.png?v=20260412);
  background-size: .1rem .5rem;
  pointer-events: none;
}
.com-page-nav-wrap .title-bg-wrap::before {
  display: block;
  position: absolute;
  top: 0;
  left: -1.3rem;
  width: 1.3rem;
  height: .5rem;
  background: url(../images/title_bg_l.png?v=20260412);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  content: '';
}
.com-page-nav-wrap .title-bg-wrap::after {
  display: block;
  position: absolute;
  top: 0;
  right: -.8rem;
  width: .8rem;
  height: .5rem;
  background: url(../images/title_bg_r.png?v=20260412);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  content: '';
}
.com-page-nav-wrap .title-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
.com-page-nav-wrap .title-wrap .ico+.title {
  margin-left: .06rem;
}
.com-page-nav-wrap .nav-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-box-pack: end;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
      -ms-flex-pack: end;
  -webkit-justify-content: flex-end;
          justify-content: flex-end;
}
.com-page-nav-wrap .nav-list .item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  width: 1.48rem;
  height: .36rem;
  cursor: pointer;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
  -webkit-box-pack: center;
      -ms-flex-align: center;
      -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.com-page-nav-wrap .nav-list .item+.item {
  margin-left: .04rem;
}
.com-page-nav-wrap .nav-list .item:hover::before,
.com-page-nav-wrap .nav-list .item.active::before {
  display: block;
}
.com-page-nav-wrap .nav-list .item:hover .txt,
.com-page-nav-wrap .nav-list .item.active .txt {
  color: #fff;
}
.com-page-nav-wrap .nav-list .item::before {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
}
.com-page-nav-wrap .nav-list .item .txt {
  overflow: hidden;
  position: relative;
  font-size: .2rem;
  line-height: 1.4;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #333;
}
.com-page-nav-wrap .btn-more {
  margin-left: .4rem;
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}
.com-page-nav-wrap .btn-more:hover {
  -webkit-transform: rotateZ(180deg);
          transform: rotateZ(180deg);
}
/* @media only screen and (max-width: 1350px) {
  .com-page-nav-wrap {
    width: 80%;
  }
  .com-page-nav-wrap .title-wrap {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
    -webkit-transform-origin: 0% 50%;
            transform-origin: 0% 50%;
  }
} */
.page3 {
  overflow: hidden;
  padding-top: .1rem;
  padding-bottom: 1rem;
}
.page3 .project-wrap {
  margin: 0 auto;
  margin-top: .26rem;
  width: 12.8rem;
  -webkit-transition: width 0.1s linear;
  transition: width 0.1s linear;
}
.page3 .project-wrap .project-content .project-list {
  display: none;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
          justify-content: space-between;
}
.page3 .project-wrap .project-content .project-list.active {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.page3 .project-wrap .project-content .project-list .item {
  position: relative;
  width: 3.06rem;
  height: 1.63rem;
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
.page3 .project-wrap .project-content .project-list .item+.item {
  margin-left: .1rem;
}
.page3 .project-wrap .project-content .project-list .item:hover {
  -webkit-filter: brightness(102%);
          filter: brightness(102%);
}
.page3 .project-wrap .project-content .project-list .item .jump {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.page3 .project-wrap .project-content .project-list .item img {
  width: 100%;
  height: 100%;
  pointer-events: none;
  -o-object-fit: cover;
     object-fit: cover;
}
.page4 {
  overflow: hidden;
  padding-top: .1rem;
  padding-bottom: 1rem;
}
.page4 .com-page-nav-wrap {
  z-index: 1;
}
.page4 .con-wrap {
  margin-top: 1.05rem;
}
.page4 .con-wrap .con-item {
  display: none;
}
.page4 .con-wrap .con-item.active {
  display: block;
}
.page4 .role-wrap {
  position: relative;
  height: 6.5rem;
}
.page4 .role-wrap .video-bg-wrap {
  overflow: hidden;
  height: 100%;
}
.page4 .role-wrap .video-bg-wrap .video-wrap {
  display: none;
  height: 100%;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
  -webkit-justify-content: flex-end;
          justify-content: flex-end;
  -webkit-mask-image: url(../images/role_mask.png?v=e4b7be72);
          mask-image: url(../images/role_mask.png?v=e4b7be72);
  -webkit-mask-size: 100% 100%;
          mask-size: 100% 100%;
}
.page4 .role-wrap .video-bg-wrap .video-wrap.active {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.page4 .role-wrap .video-bg-wrap .video-wrap .role-video {
  position: relative;
  right: -5rem;
  height: 100%;
}
.page4 .role-wrap .role-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.page4 .role-wrap .role-content .role {
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-left: -6.4rem;
  width: 9.73rem;
  height: 7.3rem;
  pointer-events: none;
}
.page4 .role-wrap .role-content .role::before {
  display: block;
  position: absolute;
  right: -.1rem;
  bottom: 0;
  width: 12.98rem;
  height: 3.13rem;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  content: '';
}
.no-webp .page4 .role-wrap .role-content .role::before {
  background-image: url(../images/role/role_dec.png?v=20260412);
}
.webp .page4 .role-wrap .role-content .role::before {
  background-image: url(../webp/role/role_dec.webp?v=20260412);
}
.page4 .role-wrap .role-content .role .img {
  display: none;
  position: relative;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}
.page4 .role-wrap .role-content .role .img.active {
  display: block;
  -webkit-animation: roleMoveIn 0.5s ease-in-out;
          animation: roleMoveIn 0.5s ease-in-out;
}
@-webkit-keyframes roleMoveIn {
  0% {
    opacity: 0.5;
    -webkit-transform: translateX(-1.5rem);
            transform: translateX(-.5rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes roleMoveIn {
  0% {
    opacity: 0.5;
    -webkit-transform: translateX(-1.5rem);
            transform: translateX(-1.5rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
.page4 .role-wrap .role-content .attr-list {
  position: absolute;
  top: .1rem;
  left: 50%;
  margin-left: -5.3rem;
}
.page4 .role-wrap .role-content .attr-list >.item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0 .14rem;
  width: 1.06rem;
  height: .3rem;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
}
.page4 .role-wrap .role-content .attr-list >.item+.item {
  margin-top: .46rem;
}
.page4 .role-wrap .role-content .attr-list >.item:hover,
.page4 .role-wrap .role-content .attr-list >.item.active {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 0;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.page4 .role-wrap .role-content .attr-list >.item:hover::before,
.page4 .role-wrap .role-content .attr-list >.item.active::before {
  background-color: #f5a42e;
}
.page4 .role-wrap .role-content .attr-list >.item:hover .txt,
.page4 .role-wrap .role-content .attr-list >.item.active .txt {
  color: #fff;
}
.page4 .role-wrap .role-content .attr-list >.item::before {
  display: block;
  position: absolute;
  top: 50%;
  left: -.6rem;
  width: .42rem;
  height: .57rem;
  background-color: #dfce7f;
  -webkit-transform: translateY(-60%);
          transform: translateY(-60%);
  content: '';
  -webkit-mask-size: .42rem .57rem;
          mask-size: .42rem .57rem;
}
.page4 .role-wrap .role-content .attr-list >.item::after {
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  width: 150%;
  height: 200%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  content: '';
}
.page4 .role-wrap .role-content .attr-list >.item .txt {
  margin-left: .09rem;
  font-size: .18rem;
  color: #333;
}
.page4 .role-wrap .role-content .attr-list >.item.type1::before {
  width: .42rem;
  height: .57rem;
  -webkit-mask-image: url(../images/icon/attr_icon1.png?v=20260412);
          mask-image: url(../images/icon/attr_icon1.png?v=20260412);
  -webkit-mask-size: .42rem .57rem;
  mask-size: .42rem .57rem;
}
.page4 .role-wrap .role-content .attr-list >.item.type2::before {
  width: .42rem;
  height:.57rem;
  -webkit-mask-image: url(../images/icon/attr_icon2.png?v=20260412);
          mask-image: url(../images/icon/attr_icon2.png?v=20260412);
  -webkit-mask-size: .42rem .57rem;
  mask-size: .42rem .57rem;
}
.page4 .role-wrap .role-content .attr-list >.item.type3::before {
  width: .42rem;
  height: .57rem;
  -webkit-mask-image: url(../images/icon/attr_icon3.png?v=20260412);
          mask-image: url(../images/icon/attr_icon3.png?v=20260412);
  -webkit-mask-size: .42rem .57rem;
  mask-size: .42rem .57rem;
}
.page4 .role-wrap .role-content .attr-list >.item.type4::before {
  width: .42rem;
  height: .57rem;
  -webkit-mask-image: url(../images/icon/attr_icon4.png?v=20260412);
          mask-image: url(../images/icon/attr_icon4.png?v=20260412);
  -webkit-mask-size: .42rem .57rem;
          mask-size: .42rem .57rem;
}
.page4 .role-wrap .role-content .attr-list >.item.type5::before {
  width: .42rem;
  height: .57rem;
  -webkit-mask-image: url(../images/icon/attr_icon5.png?v=20260412);
          mask-image: url(../images/icon/attr_icon5.png?v=20260412);
  -webkit-mask-size: .42rem .57rem;
          mask-size: .42rem .57rem;
}
.page4 .role-wrap .role-content .gender-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  position: absolute;
  bottom: .46rem;
  left: 50%;
  margin-left: -2.6rem;
  border-radius: .44rem;
  width: 1.64rem;
  height: .44rem;
  background-color: #fff;
  -webkit-box-shadow: 0 0 0 .02rem #f0a138 inset;
          box-shadow: 0 0 0 .02rem #f0a138 inset;
}
.page4 .role-wrap .role-content .gender-list >.item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  font-size: .24rem;
  font-weight: 700;
  color: #f0a138;
  cursor: pointer;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
  -webkit-box-flex: 1;
  -webkit-box-pack: center;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
      -ms-flex-align: center;
      -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.page4 .role-wrap .role-content .gender-list >.item:hover,
.page4 .role-wrap .role-content .gender-list >.item.active {
  color: #fff;
  background-image: url(../images/btn_type3_bg.jpg?v=20260412);
  background-size: 1.64rem .44rem;
}
.page4 .role-wrap .role-content .gender-list >.item:nth-child(2) {
  background-position: 100% 0%;
}
.page4 .role-wrap .role-content .detail-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: .70rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.page4 .role-wrap .role-content .detail-wrap .detail-item {
  display: none;
  width: 5.96rem;
  height: 3.46rem;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.no-webp .page4 .role-wrap .role-content .detail-wrap .detail-item {
  background-image: url(../images/role/role_des_bg.png?v=20260412);
}
.webp .page4 .role-wrap .role-content .detail-wrap .detail-item {
  background-image: url(../webp/role/role_des_bg.webp?v=20260412);
}
.page4 .role-wrap .role-content .detail-wrap .detail-item.active {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-animation: roleDetailMoveIn 0.5s ease-in-out;
          animation: roleDetailMoveIn 0.5s ease-in-out;
}
@-webkit-keyframes roleDetailMoveIn {
  0% {
    opacity: 0.5;
    -webkit-transform: translateX(1.5rem);
            transform: translateX(1.5rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes roleDetailMoveIn {
  0% {
    opacity: 0.5;
    -webkit-transform: translateX(1.5rem);
            transform: translateX(1.5rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 1.56rem;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-box-pack: center;
      -ms-flex-align: center;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
      -ms-flex-negative: 0;
      -ms-flex-pack: center;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
  -webkit-justify-content: center;
          justify-content: center;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  border-radius: .3rem;
  width: 1.3rem;
  height: .3rem;
  background-color: #be8b1d;
  cursor: pointer;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
  -webkit-box-pack: center;
      -ms-flex-align: center;
      -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item+.item {
  margin-top: .28rem;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item:hover,
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item.active {
  background-image: url(../images/btn_type4_bg.png?v=0bacfb95);
  background-size: 100% 100%;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item:hover .de-icon,
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item.active .de-icon {
  background-color: #cd6302;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item:hover .title,
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item.active .title {
  font-weight: 700;
  color: #cd6302;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item .de-icon {
  display: block;
  background-color: #ffe7b3;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item .de-icon.icon1 {
  width: .16rem;
  height: .15rem;
  -webkit-mask-image: url(../images/icon/attr_detail_icon1.png?v=20260412);
          mask-image: url(../images/icon/attr_detail_icon1.png?v=20260412);
  -webkit-mask-size: .16rem .15rem;
          mask-size: .16rem .15rem;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item .de-icon.icon2 {
  width: .2rem;
  height: .17rem;
  -webkit-mask-image: url(../images/icon/attr_detail_icon2.png?v=20260412);
          mask-image: url(../images/icon/attr_detail_icon2.png?v=20260412);
  -webkit-mask-size: .2rem .17rem;
          mask-size: .2rem .17rem;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item .de-icon.icon3 {
  width: .15rem;
  height: .15rem;
  -webkit-mask-image: url(../images/icon/attr_detail_icon3.png?v=20260412);
          mask-image: url(../images/icon/attr_detail_icon3.png?v=20260412);
  -webkit-mask-size: .15rem .15rem;
          mask-size: .15rem .15rem;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item .de-icon.icon4 {
  width: .14rem;
  height: .16rem;
  -webkit-mask-image: url(../images/icon/attr_detail_icon4.png?v=20260412);
          mask-image: url(../images/icon/attr_detail_icon4.png?v=20260412);
  -webkit-mask-size: .14rem .16rem;
          mask-size: .14rem .16rem;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .type-list >.item .title {
  margin-left: .07rem;
  font-size: .18rem;
  color: #fff;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list-wrap {
  padding: .1rem .3rem .1rem .5rem;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list {
  height: 100%;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item {
  display: none;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: .1rem 0 .4rem;
  width: 100%;
  height: 100%;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-box-pack: center;
      -ms-flex-align: center;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
      -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item.active {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item .text {
  margin: auto 0;
  width: 100%;
  font-size: .16rem;
  line-height: 1.5;
  text-align: justify;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item.sub-page {
  height: 100%;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item.sub-page .text {
  display: none;
  overflow: auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  scrollbar-color: rgba(0,0,0,0.3) rgba(0,0,0,0);
  scrollbar-width: thin;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item.sub-page .text::-webkit-scrollbar {
/*---滚动条整体样式--*/
  width: .04rem;
  height: 04rem;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item.sub-page .text::-webkit-scrollbar-thumb {
/*---滑块部分--*/
  border-radius: .1rem;
  background-color: rgba(0,0,0,0.3);
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item.sub-page .text::-webkit-scrollbar-track-piece {
/*---轨道部分--*/
  background-color: transparent;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item.sub-page .text.active {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item.sub-page .text .text-con {
  margin: auto 0;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item .circle {
  position: absolute;
  bottom: .04rem;
  left: 0;
  width: 100%;
  text-align: center;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item .circle span {
  display: inline-block;
  margin: 0 .02rem;
  border: .01rem solid #ddd;
  border-radius: 50%;
  width: .2rem;
  height: .2rem;
  background: #fff;
  cursor: pointer;
}
.page4 .role-wrap .role-content .detail-wrap .detail-item .detail-list >.item .circle span.active {
  background: #dec463;
}
.page4 .pet-wrap {
  overflow: hidden;
  height: 5.5rem;
}
.page4 .pet-wrap .pet-swiper-wrap {
  height: 100%;
}
.page4 .pet-wrap .pet-swiper-wrap .pet-swiper {
  height: 100%;
}
.page4 .pet-wrap .pet-swiper-wrap .pet-swiper .swiper-slide {
  position: relative;
  width: 3.4rem;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
.no-webp .page4 .pet-wrap .pet-swiper-wrap .pet-swiper .swiper-slide.type1 {
  background-image: url(../images/pet/pet_bg1.jpg?v=668713cb);
}
.webp .page4 .pet-wrap .pet-swiper-wrap .pet-swiper .swiper-slide.type1 {
  background-image: url(../webp/pet/pet_bg1.webp?v=3eff93a1);
}
.no-webp .page4 .pet-wrap .pet-swiper-wrap .pet-swiper .swiper-slide.type2 {
  background-image: url(../images/pet/pet_bg2.jpg?v=e0a107b7);
}
.webp .page4 .pet-wrap .pet-swiper-wrap .pet-swiper .swiper-slide.type2 {
  background-image: url(../webp/pet/pet_bg2.webp?v=f95c5d90);
}
.page4 .pet-wrap .pet-swiper-wrap .pet-swiper .swiper-slide:hover {
  -webkit-filter: brightness(102%);
          filter: brightness(102%);
}
.page4 .pet-wrap .pet-swiper-wrap .pet-swiper .swiper-slide:hover img {
  -webkit-transform: scale(1.04);
          transform: scale(1.04);
}
.page4 .pet-wrap .pet-swiper-wrap .pet-swiper .swiper-slide .jump {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.page4 .pet-wrap .pet-swiper-wrap .pet-swiper .swiper-slide img {
  width: 100%;
  height: 100%;
  -webkit-transition: -webkit-transform 0.3s ease-out;
  transition: -webkit-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
  pointer-events: none;
  -o-object-fit: contain;
     object-fit: contain;
}
.page4 .pet-wrap .pet-list {
  height: 100%;
  white-space: nowrap;
  will-change: transform;
}
.page4 .pet-wrap .pet-list.with-ipad {
  display: none;
}
.page4 .pet-wrap .pet-list >.item {
  display: inline-block;
  overflow: hidden;
  position: relative;
  width: 3.4rem;
  height: 100%;
  background-size: 100% 100%;
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
.no-webp .page4 .pet-wrap .pet-list >.item.type1 {
  background-image: url(../images/pet/pet_bg1.jpg?v=668713cb);
}
.webp .page4 .pet-wrap .pet-list >.item.type1 {
  background-image: url(../webp/pet/pet_bg1.webp?v=3eff93a1);
}
.no-webp .page4 .pet-wrap .pet-list >.item.type2 {
  background-image: url(../images/pet/pet_bg2.jpg?v=e0a107b7);
}
.webp .page4 .pet-wrap .pet-list >.item.type2 {
  background-image: url(../webp/pet/pet_bg2.webp?v=f95c5d90);
}
.page4 .pet-wrap .pet-list >.item:hover {
  -webkit-filter: brightness(102%);
          filter: brightness(102%);
}
.page4 .pet-wrap .pet-list >.item:hover img {
  -webkit-transform: scale(1.04);
          transform: scale(1.04);
}
.page4 .pet-wrap .pet-list >.item .jump {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.page4 .pet-wrap .pet-list >.item img {
  width: 100%;
  height: 100%;
  -webkit-transition: -webkit-transform 0.3s ease-out;
  transition: -webkit-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
  pointer-events: none;
  -o-object-fit: contain;
     object-fit: contain;
}
.page4 .cloth-wrap {
  position: relative;
  height: 6.5rem;
  background-image: url(../images/cloth/jdsz_bg.jpg?v=71932611);
  background-size: 100% 100%;
}
.page4 .cloth-wrap .cloth-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.page4 .cloth-wrap .cloth-img .item {
  display: none;
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-left: -9.54rem;
  width: 12.55rem;
}
.page4 .cloth-wrap .cloth-img .item .jump {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 6.5rem;
}
.page4 .cloth-wrap .cloth-img .item img {
  width: 100%;
}
.page4 .cloth-wrap .cloth-img .item.active {
  display: block;
  -webkit-animation: clothMoveIn 0.5s ease-in-out;
          animation: clothMoveIn 0.5s ease-in-out;
}
@-webkit-keyframes clothMoveIn {
  0% {
    opacity: 0.5;
    -webkit-transform: translateX(-1.5rem);
            transform: translateX(-1.5rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes clothMoveIn {
  0% {
    opacity: 0.5;
    -webkit-transform: translateX(-1.5rem);
            transform: translateX(-1.5rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
.page4 .cloth-wrap .detail-list {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: 1.6rem;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding-top: 2rem;
  width: 3.4rem;
  height: 100%;
}
.page4 .cloth-wrap .detail-list >.item {
  display: none;
}
.page4 .cloth-wrap .detail-list >.item.active {
  display: block;
  -webkit-animation: clothDetailMoveIn 0.5s ease-in-out;
          animation: clothDetailMoveIn 0.5s ease-in-out;
}
@-webkit-keyframes clothDetailMoveIn {
  0% {
    opacity: 0;
    -webkit-transform: translateY(.5rem);
            transform: translateY(.5rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes clothDetailMoveIn {
  0% {
    opacity: 0;
    -webkit-transform: translateY(.5rem);
            transform: translateY(.5rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
.page4 .cloth-wrap .detail-list >.item .title-wrap {
  height: .84rem;
}
.page4 .cloth-wrap .detail-list >.item .title-wrap >img {
  height: 100%;
  pointer-events: none;
}
.page4 .cloth-wrap .detail-list >.item .des {
  position: relative;
  margin-top: .3rem;
  padding-top: .4rem;
  font-size: .16rem;
  line-height: 1.5;
  color: #487783;
}
.page4 .cloth-wrap .detail-list >.item .des::before {
  position: absolute;
  top: 0;
  left: 0;
  content: '';
}
.page4 .cloth-wrap .nav-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: auto;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: 5.2rem;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: .64rem 0;
  height: 100%;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-box-pack: justify;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
      -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
          justify-content: space-between;
}
.page4 .cloth-wrap .nav-list >.item {
  width: 1.1rem;
  height: 1.1rem;
  cursor: pointer;
  -webkit-filter: grayscale(100%);
          filter: grayscale(100%);
}
.page4 .cloth-wrap .nav-list >.item:hover,
.page4 .cloth-wrap .nav-list >.item.active {
  -webkit-filter: grayscale(0%);
          filter: grayscale(0%);
}
.page4 .cloth-wrap .nav-list >.item+.item {
  margin-top: .1rem;
}
.page4 .cloth-wrap .nav-list >.item >img {
  width: 100%;
  height: 100%;
  pointer-events: none;
}
/* @media only screen and (max-width: 1350px) {
  .page4 .role-wrap .role-content .attr-list {
    left: 1rem;
    margin-left: 0;
  }
  .page4 .role-wrap .role-content .detail-wrap {
    margin-left: -.5rem;
  }
  .page4 .pet-wrap {
    overflow: auto;
  }
  .page4 .pet-wrap .pet-swiper-wrap {
    display: none;
  }
  .page4 .pet-wrap .pet-list {
    display: none;
  }
  .page4 .pet-wrap .pet-list.with-ipad {
    display: block;
  }
  .page4 .cloth-wrap .cloth-img .item {
    margin-left: -10.50rem;
  }
  .page4 .cloth-wrap .detail-list {
    right: 1.5rem;
    left: auto;
    margin-left: 0;
  }
  .page4 .cloth-wrap .nav-list {
    right: .2rem;
    left: auto;
    margin-left: 0;
  }
}
@media only screen and (max-width: 1100px) {
  .page4 .role-wrap {
    margin-bottom: 1rem;
  }
  .page4 .role-wrap .role-content .role {
    margin-left: -4.5rem;
  }
  .page4 .role-wrap .role-content .gender-list {
    top: .5rem;
    right: .5rem;
    bottom: auto;
    left: auto;
    margin-left: 0;
  }
  .page4 .role-wrap .role-content .detail-wrap {
    top: auto;
    bottom: -1rem;
    margin-left: 0;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  .page4 .cloth-wrap {
    height: 5.5rem;
  }
  .page4 .cloth-wrap .detail-list {
    right: 1rem;
    padding-top: 1rem;
  }
  .page4 .cloth-wrap .nav-list {
    padding: .3rem 0;
  }
  .page4 .cloth-wrap .nav-list >.item {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
  .page4 .cloth-wrap .cloth-img {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
    -webkit-transform-origin: 50% 100%;
            transform-origin: 50% 100%;
  }
  .page4 .cloth-wrap .cloth-img .item {
    margin-left: -10rem;
  }
} */
.page5 {
  overflow: hidden;
  padding-top: .1rem;
  padding-bottom: 1rem;
/* 手风琴数据 */
}
.page5 .strategy-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin: 0 auto;
  margin-top: .44rem;
  width: 12.8rem;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
          justify-content: space-between;
}
.page5 .strategy-wrap .wrap1 {
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: .1rem;
  width: 3.4rem;
  min-height: 5.9rem;
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
.page5 .strategy-wrap .wrap1 .bg {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-width: 0;
  border-width: .3rem .3rem .3rem .3rem;
  border-style: solid;
  border-color: #fff;
  -webkit-border-image: url(../images/content_bg1.png?v=54b277bb);
       -o-border-image: url(../images/content_bg1.png?v=54b277bb);
          border-image: url(../images/content_bg1.png?v=54b277bb);
  border-image-slice: 30 30 30 30;
  border-image-width: .3rem .3rem .3rem .3rem;
  border-image-repeat: repeat;
  width: 100%;
  height: 100%;
}
.page5 .strategy-wrap .wrap1 .bg .bg-con {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(100% + .04rem);
  height: calc(100% + .04rem);
  background-color: #fff;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.page5 .strategy-wrap .wrap1 .con {
  position: relative;
  padding-bottom: .2rem;
}
.page5 .strategy-wrap .wrap1 .con .title-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: .2rem 0;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.page5 .strategy-wrap .wrap1 .con .title-wrap .title {
  position: relative;
  font-size: .2rem;
  font-weight: 700;
  color: #bfa46c;
}
.page5 .strategy-wrap .wrap1 .con .title-wrap .title::before,
.page5 .strategy-wrap .wrap1 .con .title-wrap .title::after {
  position: absolute;
  top: 50%;
  content: '';
}
.page5 .strategy-wrap .wrap1 .con .title-wrap .title::before {
  left: -.9rem;
  -webkit-transform: rotate(-180deg) translateY(20%);
          transform: rotate(-180deg) translateY(20%);
}
.page5 .strategy-wrap .wrap1 .con .title-wrap .title::after {
  right: -.9rem;
  -webkit-transform: translateY(-60%);
          transform: translateY(-60%);
}
.page5 .strategy-wrap .wrap1 .con .list {
  text-align: center;
}
.page5 .strategy-wrap .wrap1 .con .list >.item {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  margin-top: .16rem;
  padding-bottom: .24rem;
  width: 33%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.page5 .strategy-wrap .wrap1 .con .list >.item:hover {
  -webkit-filter: brightness(105%);
          filter: brightness(105%);
}
.page5 .strategy-wrap .wrap1 .con .list >.item .str-icon {
  width: .61rem;
  height: .62rem;
}
.page5 .strategy-wrap .wrap1 .con .list >.item .str-icon img {
  width: 100%;
  height: 100%;
  border: 0;
}
.page5 .strategy-wrap .wrap1 .con .list >.item .jump {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.page5 .strategy-wrap .wrap1 .con .list >.item .des {
  overflow: hidden;
  position: absolute;
  bottom: 0;
  left: 50%;
  max-width: 90%;
  font-size: .14rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #777;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  pointer-events: none;
}
.page5 .strategy-wrap .sub-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-box-pack: justify;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
      -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
          justify-content: space-between;
}
.page5 .strategy-wrap .sub-wrap .wrap2 {
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list {
  overflow: hidden;
  position: relative;
  margin: 0 auto;
  width: 9rem;
  height: 4.25rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  width: 4.7rem;
  height: 100%;
  white-space: nowrap;
  -webkit-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(1) {
  -webkit-transform: translateX(0);
          transform: translateX(0);
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(2) {
  -webkit-transform: translateX(4.7rem);
          transform: translateX(4.7rem);
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(3) {
  -webkit-transform: translateX(5.56rem);
          transform: translateX(5.56rem);
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(4) {
  -webkit-transform: translateX(6.42rem);
          transform: translateX(6.42rem);
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(5) {
  -webkit-transform: translateX(7.28rem);
          transform: translateX(7.28rem);
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:nth-child(6) {
  -webkit-transform: translateX(8.14rem);
          transform: translateX(8.14rem);
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:hover .intro .title-wrap::before,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item.active .intro .title-wrap::before,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:hover .intro .title-wrap::after,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item.active .intro .title-wrap::after {
  background-color: rgba(255,255,255,0.4);
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item:hover .intro .title-wrap >.title,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item.active .intro .title-wrap >.title {
  background-color: #fff;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding-top: .3rem;
  width: .86rem;
  height: 100%;
  vertical-align: top;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
      -ms-flex-align: center;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro .title-wrap {
  position: relative;
  margin-top: .76rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro .title-wrap::before,
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro .title-wrap::after {
  display: block;
  position: absolute;
  left: 50%;
  margin-left: -.05rem;
  width: .1rem;
  height: .08rem;
  background-color: rgba(191,164,108,0.4);
  content: '';
  -webkit-mask-image: url(../images/title_dec1.png?v=04ddca3d);
          mask-image: url(../images/title_dec1.png?v=04ddca3d);
  -webkit-mask-size: .1rem .08rem;
          mask-size: .1rem .08rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro .title-wrap::before {
  top: -.3rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro .title-wrap::after {
  bottom: -.3rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro .title-wrap >.title {
  display: block;
  background-color: #bfa46c;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro .title-wrap >.title.title-zxgl {
  width: .27rem;
  height: 1.13rem;
  -webkit-mask-image: url(../images/title/title_zxgl.png?v=1f4dcdc8);
          mask-image: url(../images/title/title_zxgl.png?v=1f4dcdc8);
  -webkit-mask-size: .27rem 1.13rem;
          mask-size: .27rem 1.13rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro .title-wrap >.title.title-mpzy {
  width: .27rem;
  height: 1.13rem;
  -webkit-mask-image: url(../images/title/title_mpzy.png?v=e93d9438);
          mask-image: url(../images/title/title_mpzy.png?v=e93d9438);
  -webkit-mask-size: .27rem 1.13rem;
          mask-size: .27rem 1.13rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro .title-wrap >.title.title-zhcw {
  width: .26rem;
  height: 1.12rem;
  -webkit-mask-image: url(../images/title/title_zhcw.png?v=e9a02fb4);
          mask-image: url(../images/title/title_zhcw.png?v=e9a02fb4);
  -webkit-mask-size: .26rem 1.12rem;
          mask-size: .26rem 1.12rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro .title-wrap >.title.title-fbgl {
  width: .27rem;
  height: 1.12rem;
  -webkit-mask-image: url(../images/title/title_fbgl.png?v=a64fdff0);
          mask-image: url(../images/title/title_fbgl.png?v=a64fdff0);
  -webkit-mask-size: .27rem 1.12rem;
          mask-size: .27rem 1.12rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro .title-wrap >.title.title-xsrm {
  width: .27rem;
  height: 1.12rem;
  -webkit-mask-image: url(../images/title/title_xsrm.png?v=94a69634);
          mask-image: url(../images/title/title_xsrm.png?v=94a69634);
  -webkit-mask-size: .27rem 1.12rem;
          mask-size: .27rem 1.12rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .intro .title-wrap >.title.title-rchd {
  width: .27rem;
  height: 1.12rem;
  -webkit-mask-image: url(../images/title/title_rchd.png?v=31cf42d8);
          mask-image: url(../images/title/title_rchd.png?v=31cf42d8);
  -webkit-mask-size: .27rem 1.12rem;
          mask-size: .27rem 1.12rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail {
  display: inline-block;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: .18rem;
  width: 3.84rem;
  height: 100%;
  vertical-align: top;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .bg {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-width: 0;
  border-width: .1rem .1rem .1rem .1rem;
  border-style: solid;
  border-color: #fff;
  -webkit-border-image: url(../images/content_bg2.png?v=20260412);
       -o-border-image: url(../images/content_bg2.png?v=20260412);
          border-image: url(../images/content_bg2.png?v=20260412);
  border-image-slice: 10 10 10 10;
  border-image-width: .1rem .1rem .1rem .1rem;
  border-image-repeat: repeat;
  width: 100%;
  height: 100%;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .bg .bg-con {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(100% + .04rem);
  height: calc(100% + .04rem);
  background-color: #fff;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  height: 100%;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .sub-list {
  overflow: auto;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .sub-list::-webkit-scrollbar {
/*---滚动条整体样式--*/
  width: .1rem;
  height: .1rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .sub-list::-webkit-scrollbar-thumb {
/*---滑块部分--*/
  border-radius: .1rem;
  background-color: rgba(0,0,0,0.3);
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .sub-list::-webkit-scrollbar-track-piece {
/*---轨道部分--*/
  background-color: transparent;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .sub-list >.item {
  position: relative;
  padding-left: .2rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .sub-list >.item::before {
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  content: '';
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .sub-list >.item+.item {
  margin-top: .26rem;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .sub-list >.item:hover .des {
  color: #aaa;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .sub-list >.item .jump {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .sub-list >.item .des {
  overflow: hidden;
  font-size: .16rem;
  line-height: 1.5;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #777;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .op-wrap {
  margin-top: .26rem;
  text-align: center;
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .op-wrap .btn {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  overflow: hidden;
  font-size: .16rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #fff;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
  -webkit-box-pack: center;
      -ms-flex-align: center;
      -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.page5 .strategy-wrap .sub-wrap .wrap2 .accordion-list >.accordion-item .detail .con .op-wrap .btn:hover {
  -webkit-filter: brightness(105%);
          filter: brightness(105%);
}
.page5 .strategy-wrap .sub-wrap .wrap3 {
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
.page5 .strategy-wrap .sub-wrap .wrap3 >.list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
          justify-content: space-between;
}
.page5 .strategy-wrap .sub-wrap .wrap3 >.list >.item {
  overflow: hidden;
  position: relative;
  border-radius: .16rem;
  width: 2.94rem;
  height: 1.5rem;
      -ms-flex-negative: 0;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
}
.page5 .strategy-wrap .sub-wrap .wrap3 >.list >.item:nth-child(n+4) {
  display: none;
}
.page5 .strategy-wrap .sub-wrap .wrap3 >.list >.item:hover {
  -webkit-filter: brightness(105%);
          filter: brightness(105%);
}
.page5 .strategy-wrap .sub-wrap .wrap3 >.list >.item .jump {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.page5 .strategy-wrap .sub-wrap .wrap3 >.list >.item >img {
  width: 100%;
  height: 100%;
  pointer-events: none;
  -o-object-fit: cover;
     object-fit: cover;
}
/* @media only screen and (max-width: 1350px) {
  .page5 .strategy-wrap {
    width: 10rem;
    -webkit-align-items: center;
            align-items: center;
    -webkit-box-align: center;
    -webkit-box-direction: reverse;
    -webkit-box-orient: vertical;
        -ms-flex-align: center;
    -webkit-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
  .page5 .strategy-wrap .wrap1 {
    width: 9rem;
    min-height: auto;
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
    will-change: transform;
  }
  .page5 .strategy-wrap .wrap1 .con .list >.item {
    width: 20%;
  }
  .page5 .strategy-wrap .sub-wrap {
    width: 100%;
    -webkit-align-items: center;
            align-items: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
  }
  .page5 .strategy-wrap .sub-wrap .wrap2 {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
    will-change: transform;
  }
  .page5 .strategy-wrap .sub-wrap .wrap3 {
    width: 9rem;
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
    will-change: transform;
  }
}
@media only screen and (max-width: 1100px) {
  .page5 .strategy-wrap {
    width: 8rem;
  }
  .page5 .strategy-wrap .wrap1 {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
  .page5 .strategy-wrap .sub-wrap .wrap2 {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
  .page5 .strategy-wrap .sub-wrap .wrap3 {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
} */
.page6 {
  overflow: hidden;
  padding-top: .1rem;
  padding-bottom: .5rem;
}
.page6 .com-page-nav-wrap .btn-more {
  display: none;
}
.page6 .com-page-nav-wrap .btn-more.active {
  display: block;
}
.page6 .media-wrap {
  margin: 0 auto;
  margin-top: .44rem;
  width: calc(12.80rem + .26rem);
}
.page6 .media-wrap >.list {
  display: none;
  text-align: center;
}
.page6 .media-wrap >.list.active {
  display: block;
}
.page6 .media-wrap >.list[data='video'] >.item {
  position: relative;
}
.page6 .media-wrap >.list[data='video'] >.item .img-wrap::before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.5);
  opacity: 0;
  -webkit-transition: opacity 0.3s linear;
  transition: opacity 0.3s linear;
  content: '';
}
.page6 .media-wrap >.list[data='video'] >.item .img-wrap::after {
  content: '';
}
.page6 .media-wrap >.list[data='video'] >.item .img-wrap .p6vl-btn-video {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  width: .8rem;
  height: .8rem;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.page6 .media-wrap >.list[data='video'] >.item .img-wrap .p6vl-btn-video::before {
  position: absolute;
  top: 0;
  left: 0;
  content: '';
}
.page6 .media-wrap >.list[data='video'] >.item .img-wrap .p6vl-btn-video::after {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-.09rem, -50%);
          transform: translate(-.09rem, -50%);
  content: '';
}
.page6 .media-wrap >.list[data='video'] >.item:hover .img-wrap::before {
  opacity: 1;
}
.page6 .media-wrap >.list[data='video'] >.item:hover .img-wrap .p6vl-btn-video::before {
  -webkit-animation: btnVideoRo 4s linear infinite;
          animation: btnVideoRo 4s linear infinite;
}
@-webkit-keyframes btnVideoRo {
  0% {
    -webkit-transform: rotateZ(0);
            transform: rotateZ(0);
  }
  100% {
    -webkit-transform: rotateZ(360deg);
            transform: rotateZ(360deg);
  }
}
@keyframes btnVideoRo {
  0% {
    -webkit-transform: rotateZ(0);
            transform: rotateZ(0);
  }
  100% {
    -webkit-transform: rotateZ(360deg);
            transform: rotateZ(360deg);
  }
}
.page6 .media-wrap >.list >.item {
  display: inline-block;
  position: relative;
  margin: 0 .13rem .3rem;
  width: 3rem;
  vertical-align: top;
  cursor: pointer;
}
.page6 .media-wrap >.list >.item .img-wrap {
  overflow: hidden;
  position: relative;
  border-radius: .16rem;
  width: 100%;
  height: 1.7rem;
}
.page6 .media-wrap >.list >.item .img-wrap img {
  width: 100%;
  height: 100%;
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  pointer-events: none;
  -o-object-fit: cover;
     object-fit: cover;
  will-change: transform;
}
.page6 .media-wrap >.list >.item .des {
  overflow: hidden;
  margin-top: .1rem;
  width: 100%;
  font-size: .16rem;
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #818181;
}
.page6 .media-wrap >.list >.item:hover .img-wrap img {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}
/* @media only screen and (max-width: 1350px) {
  .page6 .media-wrap {
    width: 90%;
  }
} */
.page7 {
  overflow: hidden;
  padding: .6rem 0 .8rem;
}
.page7 .community-content >.list {
  text-align: center;
}
.page7 .community-content >.list >.item {
  display: inline-block;
  position: relative;
  vertical-align: top;
}
.page7 .community-content >.list >.item+.item {
  margin-left: 1rem;
}
.page7 .community-content >.list >.item:hover .code-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.page7 .community-content >.list >.item[data-type='href']:hover .icon-wrap {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}
.page7 .community-content >.list >.item .jump {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.page7 .community-content >.list >.item .icon-wrap {
  width: .6rem;
  height: .6rem;
  -webkit-transition: -webkit-transform 0.2s ease-out;
  transition: -webkit-transform 0.2s ease-out;
  transition: transform 0.2s ease-out;
  transition: transform 0.2s ease-out, -webkit-transform 0.2s ease-out;
}
.page7 .community-content >.list >.item .icon-wrap >img {
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.page7 .community-content >.list >.item .des {
  position: absolute;
  bottom: -.2rem;
  left: 50%;
  font-size: .16rem;
  white-space: nowrap;
  color: #333;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.page7 .community-content >.list >.item .code-wrap {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: .1rem;
  width: 1.6rem;
  height: 1.6rem;
  background-color: #fff;
  -webkit-box-shadow: 0 0 0 .02rem #b79355 inset;
          box-shadow: 0 0 0 .02rem #b79355 inset;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  cursor: none;
  -webkit-align-items: center;
          align-items: center;
  -webkit-box-align: center;
  -webkit-box-pack: center;
      -ms-flex-align: center;
      -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.page7 .community-content >.list >.item .code-wrap img {
  width: 1.35rem;
  height: 1.35rem;
}
a {
  -webkit-tap-highlight-color: transparent;
}
.modal {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: auto;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10000;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: .2rem 0;
  background-color: rgba(0,0,0,0.8);
  opacity: 0;
  overscroll-behavior: contain;
  -ms-scroll-chaining: contain;
}
.modal.modal-hide {
  opacity: 0;
  -webkit-animation: fadeOut 0s linear forwards;
          animation: fadeOut 0s linear forwards;
}
.modal.modal-hide .modal-wrapper {
  opacity: 0;
/* 此处可自定义动画 */
  -webkit-animation: fadeOut 0s linear forwards;
          animation: fadeOut 0s linear forwards;
}
.modal.modal-active {
  opacity: 1;
  -webkit-animation: fadeIn 0.3s linear forwards;
          animation: fadeIn 0.3s linear forwards;
}
.modal.modal-active .modal-wrapper {
  opacity: 1;
/* 此处可自定义动画 */
  -webkit-animation: fadeIn 0.3s linear forwards;
          animation: fadeIn 0.3s linear forwards;
}
.modal-open {
  position: fixed;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
}
.modal-open-scroll-through {
  overflow: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
}
.btn-close {
  display: block;
  overflow: hidden;
  position: absolute;
  width: .4rem;
  height: .4rem;
  cursor: pointer;
}
.btn-close::before,
.btn-close::after {
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
/*粗细*/
  height: .02rem;
/*默认颜色*/
  background-color: #aaa;
  content: '';
}
.btn-close::before {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.btn-close::after {
  -webkit-transform: rotate(135deg);
          transform: rotate(135deg);
}
.btn-close:hover::before,
.btn-close:hover::after {
/*hover颜色*/
  background-color: #eee;
}
.btn-close.close-hid {
  opacity: 0;
}
.modal-wrapper {
  position: relative;
  z-index: 10001;
  margin: auto;
  font-size: 0;
}
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.server-code-modal .btn-close {
  bottom: -.5rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.server-code-modal .modal-body {
  overflow: hidden;
  border-radius: .05rem;
  background-color: #fff;
}
.server-code-modal .code-wrap {
  width: 2rem;
  height: 2rem;
}
.server-code-modal .code-wrap >img {
  width: 100%;
  height: 100%;
}
.server-code-modal .des {
  overflow: hidden;
  padding: 0 .1rem .1rem .1rem;
  font-size: .15rem;
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #000;
}
.p6-picture-modal .modal-body >img {
  max-width: 14.6rem;
  max-height: 8rem;
}
.p6-video-modal .modal-wrapper video {
  max-width: 8rem;
  max-height: 7rem;
}

.side-bar.opacity0{
	opacity: 0;
	pointer-events: none;
}