@-webkit-keyframes scale {
    0%,to {
        -webkit-transform: scale(1,1);
        transform: scale(1,1);
    }
    25%,75% {
        -webkit-transform: scale(1.1,1.1);
        transform: scale(1.1,1.1);
    }
    50% {
        -webkit-transform: scale(.9,.9);
        transform: scale(.9,.9);
    }
}
@keyframes scale {
    0%,to {
        -webkit-transform: scale(1,1);
        transform: scale(1,1);
    }
    25%,75% {
        -webkit-transform: scale(1.1,1.1);
        transform: scale(1.1,1.1);
    }
    50% {
        -webkit-transform: scale(.9,.9);
        transform: scale(.9,.9);
    }
}
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-webkit-keyframes fadeLeftR {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-1.4rem);
        transform: translateX(-1.4rem);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}
@keyframes fadeLeftR {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-1.4rem);
        transform: translateX(-1.4rem);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}
@-webkit-keyframes fadeRightL {
    0% {
        opacity: 0;
        -webkit-transform: translateX(1.4rem);
        transform: translateX(1.4rem);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}
@keyframes fadeRightL {
    0% {
        opacity: 0;
        -webkit-transform: translateX(1.4rem);
        transform: translateX(1.4rem);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}
@-webkit-keyframes rotate {
    to {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes rotate {
    to {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}


.wrap {
    margin: 0 auto;
}
#header,.main-bg,.news-box .hd li,.wrap {
    position: relative;
}
.main-bg .main-bg-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.bg-cover,.main-bg .main-bg-wrap .index-header-image {
    width: 100% !important;
    height: 100%;
}

.bg-cover {
    position: absolute;
    bottom: 0;
    left: 0;
    height: .45rem;
    background: url(/skin/default/images/header_cover-8cfdff9485.png) center bottom/100% 100%;
    z-index: 5;
}
.btn-video-play {
    background: url(/skin/default/images/btn_video-1f13167f2b.png) no-repeat 0 0/1.46rem 1.48rem;
    width: 1.46rem;
    height: 1.48rem;
    position: absolute;
    top: 6.5rem;
    left: 3rem;
    z-index: 90;
    -webkit-animation: scale 4s linear infinite alternate forwards;
    animation: scale 4s linear infinite alternate forwards;
}
#header .kv-btn {
    position: absolute;
    top: 9.8rem;
    left: 50%;
    margin-left: -1.4rem;
    z-index: 90;
}
#header .kv-btn a {
    display: block;
    margin-top: .1rem;
    font-size: 0;
}
#header .kv-btn .download {
    background: url(/skin/default/images/download-93e689f63f.png) no-repeat 0 0/2.8rem .78rem;
    width: 2.8rem;
    height: .78rem;
}
#header .kv-btn .server {
    background: url(/skin/default/images/servers-4d585268f1.png) no-repeat 0 0/2.8rem .78rem;
    width: 2.8rem;
    height: .78rem;
}
#content {
    background: url(/skin/default/images/content_bg-533d714dec.jpg) no-repeat center top/7.5rem 69.26rem;
    height: 20.26rem;
}
.hot-img-box,.section1 {
    background-image: url(/skin/default/images/154307-63f4760b66cd9.jpg);
background-repeat: no-repeat;
background-position: 0 0;
background-size: 100% 100%; /* 宽 高 */
    overflow: hidden;
}
.section1 .title {
    background: url(/skin/default/images/sec1_title-9a239b79a9.png) no-repeat 0 0/5.52rem 1.39rem;
    width: 5.52rem;
    height: 1.39rem;
    margin-top: .45rem;
    font-size: 0;
}
.hot-img-box {
    position: relative;
    margin: .35rem .15rem auto;
    width: 7.17rem;
    height: 4.64rem;
}
.hot-pic .swiper-slide span {
    position: absolute;
    display: block;
    bottom: .12rem;
    left: .12rem;
    width: 6.7rem;
    height: .5rem;
    padding-left: .3rem;
    line-height: .5rem;
    background-color: rgba(0,0,0,.7);
    color: #fff;
}
.hot-img-box img {
    width: 7rem;
    height: 4rem;
    margin: .07rem .09rem;
}
.hot-img-box .img-cover {
    background: url(/skin/default/images/sec1_img_cover-0e8a2e7630.png) no-repeat 0 0/7.17rem 4.24rem;
    width: 7.17rem;
    height: 4.24rem;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 25;
    pointer-events: none;
}
.section1 .swiper-pagination {
    position: absolute;
    bottom: .05rem;
    text-align: center;
    padding: 0 .15rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.section1 .swiper-pagination-bullet {
    background-color: #ccc;
    width: .16rem;
    height: .16rem;
    opacity: 1;
}
.section1 .swiper-pagination-bullet-active {
    background-color: #f5d58d;
    width: .35rem;
    border-radius: .075rem;
}

.section1 .news-box {
    background: url(/skin/default/images/sec1_bg-cce9c56232.png) no-repeat 0 0/7.18rem 5.32rem;
    width: 7.18rem;
    height: 7.32rem;
    position: relative;
    margin: .16rem auto 0;
    padding: .05rem .24rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.news-box .hd {
    height: .7rem;
    margin-top: 20px;
}
.news-box .hd ul {
    padding-left: .3rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.news-box .hd li {
    display: inline-block;
    height: .7rem;
    text-align: center;
    line-height: .85rem;
    font-size: .26rem;
    font-weight: 700;
    color: #000000; /* 未选中：黑色 */
    letter-spacing: .02rem;
    margin-right: .25rem;
    padding: 0 .15rem;
    cursor: pointer;
    z-index: 1;
}
.news-box .hd li.on {
    border-bottom: 2px solid #2468c8; /* 选中下划线：中蓝色 */
    color: #2468c8; /* 选中文字：中蓝色 */
    font-weight: 700;
}
.other-message {
    height: 2.59rem;
}
.other-message li {
    margin-bottom: .15rem;
    cursor: pointer;
    font-size: 0;
    float: left;
    margin-left: .14rem;
}
.other-message a {
    display: block;
    width: 3.55rem;
    height: 1.15rem;
}
.other-message .yl {
    background: url(/skin/default/images/news_yxgl-c346717787.png) no-repeat 0 0/3.55rem 1.14rem;
    width: 3.55rem;
    height: 1.14rem;
}
.other-message .zn {
    background: url(/skin/default/images/news_xrzn-f7f005b069.png) no-repeat 0 0/3.55rem 1.15rem;
    width: 3.55rem;
    height: 1.14rem;
}
.other-message .zj {
    background: url(/skin/default/images/news_zyzj-15ce3fb334.png) no-repeat 0 0/3.53rem 1.14rem;
    width: 3.55rem;
    height: 1.14rem;
}
.other-message .lt {
    background: url(/skin/default/images/news_yxlt-a9b5dcb0f2.png) no-repeat 0 0/3.53rem 1.15rem;
    width: 3.55rem;
    height: 1.14rem;
}
.news-box .bd {
    margin-top: 0;
}
.news-box .bd .news-list {
    margin-top: .05rem;
}
.news-box .bd .news-list li {
    display: block;
    font-size: .27rem;
    height: .8rem;
    line-height: .8rem;
    margin-top: .025rem;
}
.news-box .bd li i {
    background: url(/skin/default/images/dot-ea657bd7c9.png) no-repeat 0 0/.1rem .1rem;
    width: .1rem;
    height: .1rem;
    display: inline-block;
    margin-left: -.14rem;
    margin-right: .1rem;
}
.news-box a {
    position: relative;
    display: block;
    padding-left: .24rem;
    font-size: .29rem;
    line-height: .7rem;
    color: #000000;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    /* 删掉 text‑decoration，改用伪元素 */
}
/* 模拟中蓝色下划线 */
.news-box a::after {
    content: '';
    position: absolute;
    left: .24rem;
    right: 0;
    bottom: 0.12rem;
    height: 1px;
    background-color: #2468c8;
}
.news-box .bd .news-list li span,.news-box .hot-news-title {
    overflow: hidden;
    word-break: keep-all;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}
.news-box .bd .news-list li span {
    display: inline-block;
    width: 75%;
    vertical-align: middle;
    letter-spacing: .01rem;
}
.news-box .bd .news-list span.time {
    position: absolute;
    right: .15rem;
    top: .02rem;
    width: auto;
}
.news-box .more {
    position: absolute;
    top: .3rem;
    right: 0;
    margin-left: -1rem;
    width: 2rem;
    height: .51rem;
    text-align: center;
    text-indent: -7px;
    line-height: .48rem;
    font-size: .22rem;
    color: #e9f1ff;
}
.news-box .more i {
    background: url(/skin/default/images/more-839435d626.png) no-repeat 0 0/.17rem .16rem;
    width: .17rem;
    height: .16rem;
    display: inline-block;
    vertical-align: baseline;
    margin-left: .05rem;
}
.news-box .hot-news-title {
    height: .65rem;
    line-height: .68rem;
    margin-top: .53rem;
    font-size: .38rem;
    font-weight: 700;
    color: #f5d58d;
    text-align: center;
}

.section2 {
    margin: .65rem 0 1.05rem;
}
.section2 .title {
    background: url(/skin/default/images/sec2_title-ab464cc093.png) no-repeat 0 0/5.52rem 1.39rem;
    width: 5.52rem;
    height: 1.39rem;
}
.hero-bg {
    background: url(/skin/default/images/role_b_bg-33e90d4b86.png) no-repeat 0 0/7.19rem 6.26rem;
    width: 7.19rem;
    margin-left: .15rem;
    padding-top: .4rem;
    padding-left: .11rem;
    height: 5.6rem;
}
.hero-bg::before {
    content: "";
    display: block;
    height: .01rem;
}
.hero-list {
    width: 6.8rem;
    height: 5.26rem;
    overflow-y: auto;
    overflow-x: hidden;
}
.hero-list::-webkit-scrollbar {
    width: .03rem;
}
.hero-list::-webkit-scrollbar-track {
    background: rgba(0,0,0,.1);
}
.hero-list::-webkit-scrollbar-thumb {
    background: #bfad70;
    border-radius: .05rem;
}
.hero-list li {
    float: left;
    position: relative;
    margin: 0 .05rem .34rem .18rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    width: 1.43rem;
    height: 1.43rem;
}
.hero-list li a {
    background: url(/skin/default/images/role_one_bg-8b2e372bd8.png) no-repeat 0 0/1.43rem 1.43rem;
    width: 1.43rem;
    height: 1.43rem;
    display: block;
    padding: .04rem;
}
.hero-list li.active a {
    background: url(/skin/default/images/role_one_bg_active-32fe0c2f21.png) no-repeat 0 0/1.68rem 1.68rem;
    width: 1.68rem;
    height: 1.68rem;
    margin-left: -.13rem;
    margin-top: -.12rem;
    padding: .16rem;
}
.hero-list li img {
    width: 1.35rem;
    height: 1.35rem;
    -webkit-clip-path: polygon(0 0,calc(100% - .11rem) 0,100% .11rem,100% 100%,.11rem 100%,0 calc(100% - .11rem));
    clip-path: polygon(0 0,calc(100% - .11rem) 0,100% .11rem,100% 100%,.11rem 100%,0 calc(100% - .11rem));
}
.hero-list li .name {
    position: absolute;
    left: .01rem;
    bottom: .02rem;
    font-size: .16rem;
    padding-left: .2rem;
    color: #721917;
    font-weight: 700;
    background: url(/skin/default/images/role_one_name-a31e8648c9.png) no-repeat 0 0/1.35rem .36rem;
    width: 1.35rem;
    height: .36rem;
}
.hero-show {
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.7);
    z-index: 999;
}
.hero-show::before {
    content: "";
    display: block;
    position: absolute;
    top: 5rem;
    left: 3.2rem;
    width: .8rem;
    height: .8rem;
    border: .1rem solid #656565;
    border-top: .1rem solid #f3f3f3;
    border-radius: 50%;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}
.hero-show .hero_lihui,.hero-show .role-detail {
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}
.hero-show .hero_lihui {
    -webkit-clip-path: polygon(.3rem .12rem,1rem 0,calc(100% - 1rem) 0,calc(100% - .3rem) .12rem,calc(100% - .3rem) calc(100% - 1.2rem),3.3rem calc(100% - .6rem),.3rem calc(100% - 1.2rem));
    clip-path: polygon(.3rem .12rem,1rem 0,calc(100% - 1rem) 0,calc(100% - .3rem) .12rem,calc(100% - .3rem) calc(100% - 1.2rem),3.3rem calc(100% - .6rem),.3rem calc(100% - 1.2rem));
    top: 1.4rem;
    width: 6.47rem;
    height: 9.19rem;
}
.hero-show .hero_lihui video {
    margin-top: -.08rem;
    width: 6.47rem;
    height: 9.19rem;
}
.hero-show .role-detail {
    background: url(/skin/default/images/hero_detail-de4dc411b4.png) no-repeat 0 0/3.54rem .82rem;
    width: 3.54rem;
    height: .82rem;
    top: 11.45rem;
    z-index: 10;
    font-size: .18rem;
    line-height: .18rem;
    cursor: pointer;
    font-size: 0;
}
.hero-show .name {
    position: absolute;
    top: 1.4rem;
    left: 2.49rem;
    width: 2.56rem;
    height: .35rem;
    font-size: .3rem;
    color: #57452d;
    z-index: 20000;
    font-weight: 700;
    text-align: center;
}
.hero-show .hero-cover,.more-role {
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}
.hero-show .hero-cover {
    position: absolute;
    left: 50%;
    top: 1rem;
    background: url(/skin/default/images/lihui-46b8a3fa2d.png) no-repeat 0 0/6.47rem 9.19rem;
    z-index: 100;
    width: 6.47rem;
    height: 9.19rem;
}
.more-role {
    display: block;
    width: 2.4rem;
    height: .67rem;
    background-color: #20386f;
    color: #9cacc7;
    font-size: .35rem;
    text-align: center;
    line-height: .67rem;
    border: .02rem #3572ac solid;
    border-radius: .01rem;
    cursor: pointer;
    margin-left: 50%;
}
.hero-select {
    height: 1.73rem;
    width: 7.5rem;
    padding-left: .3rem;
}
.hero-select li {
    padding-right: .2rem;
    cursor: pointer;
    font-size: 0;
    float: left;
    width: 1.22rem;
    height: 1.26rem;
}
.hero-select li a,.pop-hero-bd .con li.on {
    display: block;
}
.hero-select .all {
    background: url(/skin/default/images/all-e74f295626.png) no-repeat 0 0/1.22rem 1.26rem;
}
.hero-select .water {
    background: url(/skin/default/images/water_hero-3a35e2a56a.png) no-repeat 0 0/1.22rem 1.27rem;
}
.hero-select .fire {
    background: url(/skin/default/images/fire-2f159abd0c.png) no-repeat 0 0/1.22rem 1.27rem;
}
.hero-select .wind {
    background: url(/skin/default/images/wind_hero-06d31aaafe.png) no-repeat 0 0/1.22rem 1.26rem;
}
.hero-select .soil {
    background: url(/skin/default/images/soil2-82aeaf3c57.png) no-repeat 0 0/1.21rem 1.26rem;
}
.hero-select .all,.hero-select .fire,.hero-select .soil,.hero-select .water,.hero-select .wind {
    width: 1.22rem;
    height: 1.27rem;
}
.hero-select .active {
    margin: -.26rem 0 -.26rem -.26rem;
}
.hero-select .all.active {
    background: url(/skin/default/images/all_active-5d47d0faca.png) no-repeat 0 0/1.74rem 1.78rem;
    width: 1.74rem;
    height: 1.78rem;
}
.hero-select .water.active {
    background: url(/skin/default/images/water_active-bed85194c3.png) no-repeat 0 0/1.74rem 1.78rem;
    width: 1.74rem;
    height: 1.78rem;
}
.hero-select .fire.active {
    background: url(/skin/default/images/fire_active-07c217d48e.png) no-repeat 0 0/1.74rem 1.78rem;
    width: 1.74rem;
    height: 1.78rem;
}
.hero-select .wind.active {
    background: url(/skin/default/images/wind_active-5287278e22.png) no-repeat 0 0/1.74rem 1.78rem;
    width: 1.74rem;
    height: 1.78rem;
}
.hero-select .soil.active {
    background: url(/skin/default/images/soil_active-5312494ec7.png) no-repeat 0 0/1.74rem 1.78rem;
    width: 1.74rem;
    height: 1.78rem;
}

.section3 .title {
    background: url(/skin/default/images/sec3_title-8e5bcd432b.png) no-repeat 0 0/5.52rem 1.39rem;
    width: 5.52rem;
    height: 1.39rem;
}
.tese,.tese li {
    position: relative;
}
.tese {
    margin-top: .35rem;
}
.tese li {
    background: url(/skin/default/images/sec3_img_bg-9647342bd9.png) no-repeat 0 0/6.6rem 3.83rem;
    width: 6.6rem;
    height: 3.83rem;
    background-position: center center;
}
.tese li img {
    width: 6.52rem;
    height: 3.67rem;
    margin: .05rem .5rem;
}
.tese .swiper-pagination {
    bottom: -.45rem;
}
.tese .swiper-pagination-bullet {
    width: .18rem;
    height: .18rem;
    background: #fff;
    opacity: 1;
}
.tese .swiper-pagination-bullet-active {
    background: url(/skin/default/images/page_dot-8c6ac20989.png) no-repeat 0 0/.26rem .25rem;
    width: .26rem;
    height: .25rem;
    vertical-align: middle;
    margin-top: -.05rem!important;
}
.tese .btn {
    background: url(/skin/default/images/sec3_arrow-c6dd936093.png) no-repeat 0 0/.45rem .78rem;
    width: .45rem;
    height: .78rem;
    position: absolute;
    top: 50%;
    margin-top: -.39rem;
    z-index: 10;
}
.tese .btn.prev {
    left: 0;
}
.tese .btn.next {
    right: 0;
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
.tese-show {
    margin: .6rem auto 0;
    padding-left: .3rem;
}
.tese-show li {
    margin-bottom: .2rem;
    overflow: hidden;
}
.tese-show li a {
    display: block;
    position: relative;
}
.tese-show li a span {
    display: block;
    position: absolute;
    right: .16rem;
    top: .1rem;
    font-size: .16rem;
    color: #e2c8a8;
    text-decoration: underline;
}
.tese-show li a span:hover {
    color: red;
}
.tese-show li .tese_bimg {
    position: relative;
    width: 6.75rem;
    height: 3.9rem;
    margin-left: .1rem;
    margin-top: .1rem;
}
.tese-show li .tese_bimg i {
    background: url(/skin/default/images/tese_b-6626b254d5.png) no-repeat 0 0/6.75rem 3.9rem;
    width: 6.75rem;
    height: 3.9rem;
    position: absolute;
    left: 0;
    top: 0;
}
.tese-show li .tese_bimg img {
    width: 6.55rem;
    height: 3.7rem;
    margin-left: .09rem;
    margin-top: .09rem;
}
.tese-show li .tese_mes {
    color: #f2e0b7;
}
.tese-show li h3 {
    display: inline-block;
    font-size: 400;
    margin: .2rem 0 .3rem;
    font-size: .48rem;
    margin-bottom: .1rem;
    line-height: 1rem;
    text-align: center;
}
.tese-show li h3.tese_xt {
    background: url(/skin/default/images/tese_xtt-2a8b92c0de.png) no-repeat 0 0/6.98rem 1.03rem;
    width: 6.98rem;
    height: 1.03rem;
    margin-left: .2rem;
    font-weight: 400;
    color: #f1db99;
}
.tese-show li h3.tese_xt span {
    background: -webkit-linear-gradient(90deg,#cbb67a,#f9edc7);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.tese-show li p,.tese-show li strong {
    font-size: .25rem;
    line-height: .35rem;
    padding: 0 .3rem 0 .1rem;
}
.tese-show li p {
    font-size: .2rem;
}
.tese-show .tese_limg .tese_bimg,.tese-show .tese_ltxt .tese_mes {
    margin-right: .2rem;
}
.tese-line {
    position: absolute;
    left: 1.38rem;
    top: 4.94rem;
    background: url(/skin/default/images/tese_line-7e37331e29.png) no-repeat 0 0/4.74rem .03rem;
    width: 4.74rem;
    height: .03rem;
}

.pop-hero,.pop-hero .mask {
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
}
.pop-hero {
    display: none;
    position: fixed;
    z-index: 10000;
}
.pop-hero i {
    display: inline-block;
    vertical-align: middle;
}
.pop-hero .mask {
    position: absolute;
    background: #000;
    opacity: .7;
    filter: alpha(opacity=70);
    z-index: 1;
}
.pop-hero-bd {
    background: url(/skin/default/images/hero_bg-7cadf59dd8.png) no-repeat 0 0/6.93rem 8.02rem;
    position: absolute;
    z-index: 2;
    width: 6.93rem;
    height: 8.02rem;
    top: 50%;
    left: 50%;
    margin-left: -3.465rem;
    margin-top: -4.21rem;
}
.pop-hero-bd .close {
    background: url(/skin/default/images/close-5d86bbc41a.png) no-repeat 0 0/1.09rem 1.09rem;
    width: 1.09rem;
    height: 1.09rem;
    position: absolute;
    bottom: -1.25rem;
    left: 50%;
    margin-left: -.55rem;
    cursor: pointer;
}
.pop-hero-bd .con {
    height: 100%;
    padding: .45rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.pop-hero-bd .con li,.pop-hero-bd .con ul {
    width: 100%;
    height: 100%;
    color: #e9f1ff;
}
.pop-hero-bd .con li {
    display: none;
}
.pop-hero-bd .title {
    text-indent: 0;
    height: 1.07rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.pop-hero-bd .title .symbol {
    margin-right: .1rem;
    margin-left: .2rem;
}
.hjjl .symbol,.sjzs .symbol {
    background: url(/skin/default/images/soil-3be63834bf.png) no-repeat 0 0/1.02rem 1.07rem;
    width: 1.02rem;
    height: 1.07rem;
}
.fyfl .symbol {
    background: url(/skin/default/images/wing-767c30ed48.png) no-repeat 0 0/.91rem .94rem;
    width: .91rem;
    height: .94rem;
}
.dyml .symbol,.lylz .symbol {
    background: url(/skin/default/images/light-c59efe2f6f.png) no-repeat 0 0/1.14rem 1.15rem;
    width: 1.14rem;
    height: 1.15rem;
}
.bsjl .symbol {
    background: url(/skin/default/images/water-ce7a22b193.png) no-repeat 0 0/.93rem .95rem;
    width: .93rem;
    height: .95rem;
}
.pop-hero-bd .info,.pop-hero-bd .title .right-tit {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}
.pop-hero-bd .title .right-tit {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}
.pop-hero-bd .title span {
    font-size: .46rem;
    display: inline-block;
}
.pop-hero-bd .title i {
    background: url(/skin/default/images/star-3fd1e0a4e0.png) no-repeat 0 0/1.68rem .28rem;
    width: 1.68rem;
    height: .28rem;
    margin-top: .15rem;
}
.pop-hero-bd .info {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: .22rem;
    font-weight: 700;
    height: .4rem;
    line-height: .4rem;
    margin-top: .2rem;
    padding: 0 .2rem;
}
.pop-hero-bd .info i {
    margin-right: .15rem;
}
.pop-hero-bd .info .type i {
    background: url(/skin/default/images/type-4a6d526038.png) no-repeat 0 0/.33rem .33rem;
    width: .33rem;
    height: .33rem;
}
.pop-hero-bd .info .command i {
    background: url(/skin/default/images/command-ffc7f71560.png) no-repeat 0 0/.33rem .33rem;
    width: .33rem;
    height: .33rem;
}
.pop-hero-bd .info .distance i {
    background: url(/skin/default/images/distance-2706e5d82f.png) no-repeat 0 0/.33rem .33rem;
    width: .33rem;
    height: .33rem;
}
.pop-hero-bd .line {
    display: block;
    width: 100%;
    height: 1px;
    margin: .2rem 0;
    background-image: -webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(white),to(rgba(255,255,255,0)));
    background-image: -webkit-linear-gradient(left,rgba(255,255,255,0),#fff,rgba(255,255,255,0));
    background-image: -o-linear-gradient(left,rgba(255,255,255,0),#fff,rgba(255,255,255,0));
    background-image: linear-gradient(to right,rgba(255,255,255,0),#fff,rgba(255,255,255,0));
}
.pop-hero-bd p {
    font-size: .22rem;
    letter-spacing: .6px;
    padding: 0 .1rem 0 .15rem;
}
.pop-hero-bd .data img {
    width: 4.49rem;
    height: 2.76rem;
    margin-top: .1rem;
    margin-left: .15rem;
}

.pop-video,.pop-video .mask {
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
}
.pop-video {
    display: none;
    position: fixed;
    z-index: 10005;
}
.pop-video .mask {
    position: absolute;
    background: #000;
    opacity: .7;
    filter: alpha(opacity=70);
    z-index: 1;
}
.pop-video .close {
    position: absolute;
    right: 0;
    top: 102%;
    left: 50%;
    -webkit-transform: translate(-50%);
    -ms-transform: translate(-50%);
    transform: translate(-50%);
    line-height: 99em;
    z-index: 3;
    overflow: hidden;
    cursor: pointer;
    -webkit-transition: transform .3s ease-in-out;
    -webkit-transition: -webkit-transform .3s ease-in-out;
    -o-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out,-webkit-transform .3s ease-in-out;
    background: url(/skin/default/images/close-5d86bbc41a.png) no-repeat 0 0/1.09rem 1.09rem;
    width: 1.09rem;
    height: 1.09rem;
}
.pop-video-bd {
    position: absolute;
    background: 0 0;
    z-index: 2;
    width: 7rem;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}