@charset "UTF-8";
blockquote, body, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, li, ol, p, pre, td, textarea, th, ul {
    margin: 0;
    padding: 0
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

address, caption, cite, code, dfn, em, strong, th, var {
    font-weight: 400;
    font-style: normal
}

ol, ul {
    list-style: none
}

caption, th {
    text-align: left
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
    font-size: 100%
}

q:after, q:before {
    content: ''
}

abbr, acronym, fieldset, img {
    border: 0
}

iframe {
    position: absolute
}

:focus {
    outline: 0
}

.cover-img {
    width: 100%;
    height: 100%;
}

#footer_ieg {
    text-align: center;
    font-size: 0.12rem;
    line-height: 0.19rem;
    min-width: 14.00rem;
    color: #fff
}

.wrap_ieg {
    margin: 0 auto;
    padding: 0.16rem 0.30rem;
    width: 9.40rem
}

.wrap_ieg a {
    color: #fff
}

#footer_ieg .e {
    font-size: 0.10rem;
    -webkit-text-size-adjust: none
}

.act_comm_box {
    background: #003249
}

.c:after, .c:before {
    content: "";
    display: table
}

.c:after {
    clear: both
}

.c {
    zoom: 1
}

html.nosc, html.nosc body {
    overflow: hidden
}

body {
    font-size: 0.12rem;
    background-color: #05070a;
    overflow-x: hidden;
    -webkit-text-size-adjust: none !important;
}

.wrap {
    min-width: 14.00rem;
    overflow: hidden
}

.pr {
    position: relative
}

.pa {
    position: absolute
}

.hide {
    display: block;
    width: 0;
    height: 0;
    overflow: hidden
}

.db {
    display: block;
    text-indent: -999em
}

.fl {
    float: left
}

.fr {
    float: right
}

img {
    display: block;
    margin: 0 auto
}

a {
    text-decoration: none
}

a:hover {
    text-decoration: none;
    animation: Light 0s linear both
}

@font-face {
    font-family: "ALIBABA-PUHUITI-REGULAR";
    src: url("../ossweb-img/font/ALIBABA-PUHUITI-REGULAR.OTF");
}

.flex {
    display: flex;
}

.flex-v {
    flex-direction: column;
}

.flex-1 {
    flex: 1;
}

.flex-align-center {
    align-items: center;
}

.flex-align-end {
    align-items: flex-end;
}

.flex-pack-center {
    justify-content: center;
}

.flex-pack-end {
    justify-content: flex-end;
}

.flex-pack-around {
    justify-content: space-around;
}

.flex-pack-justify {
    justify-content: space-between;
}

.flex-wrap {
    flex-wrap: wrap;
}

.text-right {
    text-align: right;
}

.text-center {
    text-align: center;
}

.g-wrap {
    max-width: 19.20rem;
    margin: 0 auto
}

.loading-section {
    width: 100%;
    min-height: 100vh;
    color: #b9bdc1;
    font-size: 0.18rem;
    font-family: "黑体";
    position: relative;
    background: url('../ossweb-img/pc/loading-bg.jpg') no-repeat top center;
}

.loading-section .logo-con {
    position: absolute;
    top: 3.80rem;
    left: 50%;
    transform: translateX(-50%);
}

.loading-section .logo {
    width: 218px;
    height: 175px;
    background: url("../ossweb-img/pc/loading-logo.png") no-repeat top/100% 100%;
}

.logo-line {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}

.logo-line path {
    stroke: #6eb9d9;
    stroke-width: 1;
    fill: #0d141d;
    stroke-dasharray: 500;
    stroke-dashoffset: 500;
}

@keyframes draw {
    0% {
        stroke-dashoffset: 500;
    }
    100% {
        stroke-dashoffset: 0;
    }
}

.loading-section .loading-content {
    position: absolute;
    top: 220px;
    left: 50%;
    transform: translateX(-50%);
}

.loading-section .loading-tips, .loading-section .loading-progress {
    font-family: "ALIBABA-PUHUITI-REGULAR";
    letter-spacing: 0.05rem;
}

.loading-section .loading-tips .loading-line {
    display: inline-block;
    width: 3.16rem;
    height: 0.04rem;
    background: url("../ossweb-img/pc/loading-line.png") no-repeat center center;
    background-size: 100%;
}

.loading-section .loading-tips .tips-content {
    width: 3.46rem;
    margin: 0 0.20rem;
    text-align: center;
}

.loading-section .loading-tips .right-line {
    transform: rotate(180deg);
}

.loading-section .loading-progress {
    margin-top: 0.21rem;
}

.loading-section .loading-progress .loading-progress-num {
    font-size: 0.20rem;
    color: #fff;
    text-shadow: 0 0 0.03rem #fff;
    margin-left: 0.08rem;
}

.nav {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 100;
    width: 100%;
    height: 0.72rem;
    padding: 0 0.62rem;
    overflow: hidden;
    box-sizing: border-box;
    background: url("../ossweb-img/pc/nav-bg.png") no-repeat top / 100% 100%;
    background-size: cover;
}

.nav .logo img {
    width: 0.51rem;
    height: 0.50rem;
    margin-top: 0.04rem;
}

.nav .side-nav {
    height: 0.60rem;
    margin-left: 0.95rem;
}

.nav .nav-item {
    min-width: 0.50rem;
    margin-right: 0.52rem;
    position: relative;
    text-align: center;
}

.nav .nav-item:nth-child(4) {
    min-width: 0.90rem;
}

.nav .nav-item:last-child {
    margin-right: 0;
}

.nav .nav-item a {
    display: block;
    height: 0.72rem;
    color: #ebebeb;
    font-size: 0.18rem;
    font-family: "ALIBABA-PUHUITI-REGULAR";
    padding-top: 0.19rem;
    box-sizing: border-box;
}

.nav .nav-item-selected::after {
    display: block;
    content: "";
    width: 1.83rem;
    height: 0.60rem;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;
    background: url("../ossweb-img/pc/nav-selected-bg.png") no-repeat -0.03rem 0;
    background-size: cover;
}

.nav-select-icon {
    display: none;
}

.nav-select-icon-home {
    width: .27rem;
    height: .23rem;
}

.nav-select-icon-world {
    width: .26rem;
    height: .26rem;
}

.nav-select-icon-bg {
    width: .22rem;
    height: .22rem;
}

.nav-select-icon-mil {
    width: .21rem;
    height: .28rem;
}

.nav-share {
    position: absolute;
    right: .63rem;
    top: .2rem;
    width: 2.93rem;
    height: .26rem;
    display: flex;
    justify-content: space-between;
    align-items: self-end;
    /*background: url(../ossweb-img/pc/share-box.png) top/100% 100% no-repeat;*/
}

.share-item {
    cursor: pointer;
}

.share-dy {
    width: .16rem;
    height: .2rem;
    background: url(../ossweb-img/pc/share-dy.png) top/100% 100% no-repeat;
}

.share-dy:hover {
    background: url(../ossweb-img/pc/share-dy-act.png) top/100% 100% no-repeat;
}

.share-tap {
    width: .27rem;
    height: .16rem;
    background: url(../ossweb-img/pc/share-tap.png) top/100% 100% no-repeat;
}

.share-tap:hover {
    background: url(../ossweb-img/pc/share-tap-act.png) top/100% 100% no-repeat;
}

.share-bli {
    width: .22rem;
    height: .18rem;
    background: url(../ossweb-img/pc/share-bli.png) top/100% 100% no-repeat;
}

.share-bli:hover {
    background: url(../ossweb-img/pc/share-bli-act.png) top/100% 100% no-repeat;
}

.share-qq {
    width: .17rem;
    height: .18rem;
    background: url(../ossweb-img/pc/share-qq.png) top/100% 100% no-repeat;
}

.qq-qr {
    position: fixed;
    top: .72rem;
    right: .93rem;
    width: 1.95rem;
    height: 2.23rem;
    background: url(../ossweb-img/pc/qq-qr.png) top/100% 100% no-repeat;
    display: none;
}

.nav-share img {
    position: absolute;
    top: 0.58rem;
    left: 0.26rem;
    width: 1.45rem;
    height: 1.45rem;
}
.share-qq:hover {
    background: url(../ossweb-img/pc/share-qq-act.png) top/100% 100% no-repeat;
}

.share-qq:hover .qq-qr {
    display: block;
}

.share-wx {
    width: .24rem;
    height: .19rem;
    background: url(../ossweb-img/pc/share-wx.png) top/100% 100% no-repeat;
}

.wx-qr {
    position: fixed;
    top: .72rem;
    right: .4rem;
    width: 1.95rem;
    height: 2.23rem;
    background: url(../ossweb-img/pc/wx-qr.png) top/100% 100% no-repeat;
    display: none;
}

.share-wx:hover {
    background: url(../ossweb-img/pc/share-wx-act.png) top/100% 100% no-repeat;
}

.share-wx:hover .wx-qr {
    display: block;
}

.share-music {
    width: .29rem;
    height: .25rem;
    background: url(../ossweb-img/pc/music.png) top/auto 100% no-repeat;
}

.share-music-act {
    width: .29rem;
    height: .25rem;
    background: url(../ossweb-img/pc/music-act.png) top/100% 100% no-repeat;
}

.section {
    min-height: 100vh;
}

.video-container {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
}

.section-home {
    overflow: hidden;
}

.section-home .game-info-container {
    position: absolute;
    top: 3.3rem;
    left: 50%;
    transform: translateX(-50%);
}

.section-home .subscribe-container {
    position: absolute;
    top: 6.7rem;
    left: 50%;
    transform: translateX(-50%);
}

.section-home .game-info-container .gameLogo .logo {
    width: 5.22rem;
    height: 4.17rem;
    margin: 0 auto;
}

.section-home .game-info-container .playKVBtn {
    width: 0.79rem;
    height: 0.79rem;
    cursor: pointer;
    position: absolute;
    bottom: 1.1rem;
    right: 0.93rem;
}

.section-home .subscribe-people-con {
    margin: 0 0.12rem;
}

.subscribe-btn {
    display: block;
    width: 3.23rem;
    height: 0.72rem;
    background: url("../ossweb-img/pc/book-now-btn.png") no-repeat center center;
    background-size: 100%;
    margin: 0.55rem auto 0;
    cursor: pointer;
}

.section-home .subscribe-people-num {
    color: #c5c8c4;
    font-size: 0.18rem;
    margin-top: 0.16rem;
    letter-spacing: 0.05rem;
    font-family: "ALIBABA-PUHUITI-REGULAR";
}

.section-home .subscribe-people-num::before, .section-home .subscribe-people-num::after {
    content: "";
    display: block;
    width: 3.16rem;
    height: 0.04rem;

    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.section-home .subscribe-people-num::before {
    background: url("../ossweb-img/pc/subscribe-left-line.png") no-repeat center center;
    background-size: 100%;
    left: -3.16rem;
}

.section-home .subscribe-people-num::after {
    background: url("../ossweb-img/pc/subscribe-right-line.png") no-repeat top / 100% 100%;
    background-size: 100%;
    right: -3.16rem;
}

.section-home .subscribe-num, .section-schedule-milestones .subscribe-num {
    color: #fff;
    text-shadow: 0.05rem 0.05rem .1rem #71caf5, -0.05rem -0.05rem .1rem #71caf5, -0.05rem 0.05rem .1rem #71caf5, 0.05rem -0.05rem .1rem #71caf5;
}

@keyframes showBackdrop3 {
    0% {
        opacity: 1;
        text-shadow: 0 0 0.1rem #fff;
    }
    50% {
        opacity: 0.8;
        text-shadow: 0 0 0 #fff;
    }
    100% {
        opacity: 1;
        text-shadow: 0 0 0.1rem #fff;
    }
}

.section-backdrop {
    position: relative;
    font-family: "黑体";
    /*background: url("../ossweb-img/pc/backdrop/backdrop-bg.jpg") no-repeat center / auto 100%;*/
}

.section-backdrop-main {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    background: url("../ossweb-img/pc/backdrop/backdrop-bg.jpg") no-repeat center / cover;
}

.section-backdrop-shadow {
    animation: showBackdrop .5s cubic-bezier(0.455, 0.03, 0.515, 0.955) forwards;
}

.section-backdrop .section-story1 .story-text-icon {
    margin: 0.5rem auto;
    width: .43rem;
    height: .42rem;
    background: url("../ossweb-img/pc/backdrop/icon-1.png") no-repeat top/100% 100%;
    animation: downES .5s linear infinite alternate;
}

@keyframes downES {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(.1rem)
    }
}

@keyframes showBackdrop {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0.5;
    }
}

.section-backdrop-shadow2 {
    animation: showBackdrop2 .5s cubic-bezier(0.455, 0.03, 0.515, 0.955) forwards;
}

@keyframes showBackdrop2 {
    0% {
        opacity: 0.5;
    }
    100% {
        opacity: 1;
    }
}

.world-swiper, .world-img {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto;
    overflow: hidden;
}

.world-swiper-container {
    height: 100vh;
}

.section-backdrop .story-title-container {
    padding-top: 2.05rem;
}

.section-backdrop .story-title-container .story-title {
    width: 6.15rem;
    height: 1.22rem;
    margin-bottom: 0.35rem;
}

.section-backdrop .story-title-container .story-content {
    color: #ffffff;
    font-size: 0.25rem;
}

.section-backdrop .story-title-container .story-content p {
    margin-bottom: 0.25rem;
    text-shadow: 0 0 0.15rem #000;
}

.section-backdrop .section-story {
    height: 10.00rem;
    box-sizing: border-box;
    position: relative;
}

.section-story .left-card {
    width: 19.2rem;
    height: 9.16rem;
    padding-top: 0.73rem;
    background: url("../ossweb-img/pc/backdrop/left-hero-bg.png") no-repeat;
    background-size: 100% auto;
}

.section-story .right-card {
    height: 9.16rem;
    padding-top: 0.73rem;
    background: url("../ossweb-img/pc/backdrop/right-hero-bg.png") no-repeat;
    background-size: 100% auto;
}

.section-backdrop .section-story2 .hero {
    left: 2.27rem;
    top: -0.07rem;
}

.section-backdrop .section-story2 .hero img {
    width: 4.88rem;
    height: 10.75rem;
}

.section-backdrop .section-story3 .hero {
    right: 3.10rem;
    top: -0.27rem;
}

.section-backdrop .section-story3 .hero img {
    width: 3.49rem;
    height: 10.13rem;
}

.section-backdrop .section-story4 .hero {
    left: 0;
    top: -0.34rem;
}

.section-backdrop .section-story4 .hero img {
    width: 7.5rem;
    height: 10.48rem;
}

.section-backdrop .section-story5 .hero {
    right: 0;
    top: -0.48rem;
}

.section-backdrop .section-story5 .hero img {
    width: 10.07rem;
    height: 9.93rem;
}

.section-backdrop .section-story6 .hero {
    left: 2.00rem;
    top: -0.18rem;
}

.section-backdrop .section-story6 .hero img {
    width: 5.03rem;
    height: 11.36rem;
}

.section-backdrop .section-story7 .hero {
    right: 0.44rem;
    top: 1.30rem;
}

.section-backdrop .section-story7 .hero img {
    width: 9.07rem;
    height: 6.63rem;
}

.section-backdrop .left-card .hero-introduce {
    left: 9rem;
    top: 2.28rem
}

.section-backdrop .right-card .hero-introduce {
    right: 9rem;
    top: 2.28rem
}

.section-backdrop .hero-introduce-title {
    color: #fefff7;
}

.section-backdrop .hero-introduce-title .hero-name {
    font-size: 0.64rem;
    font-weight: bold;
    font-family: 'DIME';
}

.section-backdrop .left-card .hero-introduce-title .hero-role {
    bottom: 0.05rem;
    left: 2.64rem;
    font-size: 0.24rem;
}

.section-backdrop .right-card .hero-introduce-title .hero-role {
    bottom: 0.05rem;
    right: 2.64rem;
    font-size: 0.24rem;
}

.section-backdrop .hero-introduce-content {
    margin-top: 0.44rem;
    color: #fff;
    font-size: 0.23rem;
}

.section-backdrop .hero-introduce-content p {
    margin-bottom: 0.11rem;
}

.section-backdrop .hero-introduce-content p:last-child {
    margin-bottom: 0;
}

.section-world {
    overflow: hidden;
}

.section-world .world-type-list {
    position: absolute;
    top: 50%;
    right: 0.58rem;
    z-index: 20;
    transform: translateY(-50%);
}

.section-world .world-type-list .world-item {
    cursor: pointer;
    margin-bottom: 0.29rem;

}

.section-world .world-type-list .world-item:last-child {
    margin-bottom: 0;
}

.section-world .world-type-list .world-item-title {
    font-size: 0.19rem;
    font-family: "ALIBABA-PUHUITI-REGULAR";
    color: #ffffff;
    margin-bottom: 0.04rem;
}

.section-world .world-type-list .world-video-poster {
    border: 0.06rem solid transparent;
}

.section-world .world-type-list .world-video-poster img {
    width: 1.34rem;
    height: 0.71rem;
}

.section-world .world-type-list .world-item-selected {
    border-color: #62c9ff;
}

.section-world .world-video-title-con {
    top: 2rem;
    left: 2rem;
    z-index: 20;
    overflow: hidden;
}

.section-world .world-video-title-con .world-video-title {
    animation-delay: .5s;
    position: relative;
}

.section-world .world-video-title-con .world-video-title .videoPlayIcon {
    width: 0.79rem;
    height: 0.79rem;
    position: absolute;
    z-index: 10;
    cursor: pointer;
}

.section-world .world-video-title-con .world-title-explore {
    width: 6.06rem;
    height: 5.77rem;
    background: url("../ossweb-img/pc/world/world-explore-title.png") no-repeat top center/100%;
}

.section-world .world-video-title-con .world-title-explore .videoPlayIcon {
    right: 1.78rem;
    top: 1.58rem;
}

.section-world .world-video-title-con .world-title-survive {
    width: 6.57rem;
    height: 6.03rem;
    background: url("../ossweb-img/pc/world/world-explore-title3.png") no-repeat top center/100%;
}

.section-world .world-video-title-con .world-title-survive .videoPlayIcon {
    right: 2.05rem;
    top: 1.47rem;
}

.section-world .world-video-title-con .world-title-build {
    width: 6.37rem;
    height: 5.82rem;
    background: url("../ossweb-img/pc/world/world-explore-title2.png") no-repeat top center/100%;
}

.section-world .world-video-title-con .world-title-build .videoPlayIcon {
    right: 1.93rem;
    top: 1.51rem;
}

.section-world .world-video-title-con .world-title-collect {
    width: 5.56rem;
    height: 5.16rem;
    background: url("../ossweb-img/pc/world/world-explore-title4.png") no-repeat top center/100%;
}

.section-world .world-video-title-con .world-title-collect .videoPlayIcon {
    right: 1.7rem;
    top: 0.84rem;
}

.section-world .world-video-title-con .world-title-bigWorld {
    width: 5.56rem;
    height: 5.16rem;
    background: url("../ossweb-img/pc/world/world-explore-title5.png") no-repeat top center/100%;
}

.section-world .world-video-title-con .world-title-bigWorld .videoPlayIcon {
    right: 1.7rem;
    top: 0.84rem;
}

.section-world .world-img-1 {
    background: url("../ossweb-img/pc/world/world1.jpg") no-repeat center/cover;
}

.section-world .world-img-2 {
    background: url("../ossweb-img/pc/world/world2.jpg") no-repeat center/cover;
}

.section-world .world-img-3 {
    background: url("../ossweb-img/pc/world/world3.jpg") no-repeat center/cover;
}

.section-world .world-img-4 {
    background: url("../ossweb-img/pc/world/world4.jpg") no-repeat center/cover;
}

.section-world .world-img-5 {
    background: url("../ossweb-img/pc/world/world4.jpg") no-repeat center/cover;
}

.section-schedule-milestones {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    background: url("../ossweb-img/pc/scheduleMilestones/schedule-milestones-bg.jpg") no-repeat top center/100% 100%;
}

.section-schedule-milestones .reserve-con {
    /*top: 1.72rem;*/
    /*left: 50%;*/
    /*transform: translateX(-50%);*/
    font-family: "ALIBABA-PUHUITI-REGULAR";
    text-align: center;
}

.section-schedule-milestones .subscribe-num {
    /*text-shadow: 0 0 0.04rem #fff;*/
}

.section-schedule-milestones .subscribe-people-num, .section-schedule-milestones .ready {
    color: #ffffff;
    font-size: 0.29rem;
    letter-spacing: 0.05rem;
}

.section-schedule-milestones .subscribe-people-num p {
    padding: 0 0.14rem;
}

.section-schedule-milestones .subscribe-people-num::before, .section-schedule-milestones .subscribe-people-num::after {
    content: "";
    display: block;
    width: 3.16rem;
    height: 0.04rem;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.section-schedule-milestones .subscribe-people-num::before {
    background: url("../ossweb-img/pc/subscribe-left-line.png") no-repeat center center;
    background-size: 100%;
    left: -3.16rem;
}

.section-schedule-milestones .subscribe-people-num::after {
    background: url("../ossweb-img/pc/subscribe-right-line.png") no-repeat center center;
    background-size: 100%;
    right: -3.16rem;
}

.section-schedule-milestones .reward-list {
    /*top: 2.79rem;*/
    /*left: 3.40rem;*/
    justify-content: center;
}

.section-schedule-milestones .reward-item {
    width: 1.95rem;
    height: 4.09rem;
    margin-right: 0.65rem;
    background: url("../ossweb-img/pc/scheduleMilestones/reward-common-bg.png") no-repeat top/cover;
}

.section-schedule-milestones .reward-item-active {
    background: url("../ossweb-img/pc/scheduleMilestones/achieved-bg.png") no-repeat top/cover;
}

.section-schedule-milestones .reward-item:last-child {
    width: 2.14rem;
    height: 4.50rem;
    margin-right: 0;
    background: url("../ossweb-img/pc/scheduleMilestones/final-bg.png") no-repeat top/cover;
}

.section-schedule-milestones .final-item.reward-item-active {
    background: url("../ossweb-img/pc/scheduleMilestones/actived-final-bg.png") no-repeat top/cover;
}

.section-schedule-milestones .reward-item .reward-num {
    top: 0.60rem;
    left: 0.08rem;
    color: #dfdfdf;
    font-size: 0.24rem;
    font-family: "ALIBABA-PUHUITI-REGULAR";
    opacity: 0.6;
}

.section-schedule-milestones .reward-item .reward-num5 {
    color: #d5bb7a;
}

.section-schedule-milestones .reward-item img {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.section-schedule-milestones .reward-item:nth-child(1) img {
    width: 2.06rem;
    height: 1.71rem;
    top: 0.95rem;
}

.section-schedule-milestones .reward-item:nth-child(2) img {
    width: 1.63rem;
    height: 1.11rem;
    top: 1.51rem;
}

.section-schedule-milestones .reward-item:nth-child(3) img {
    width: 1.42rem;
    height: 1.29rem;
    top: 1.33rem;
}

.section-schedule-milestones .reward-item:nth-child(4) img {
    width: 1.51rem;
    height: 1.29rem;
    top: 1.33rem;
}

.section-schedule-milestones .reward-item:nth-child(5) img {
    width: 2.68rem;
    height: 2.27rem;
    top: 1.20rem;
    left: -0.40rem;
    transform: translateX(0);
}

.section-schedule-milestones .reward-name {
    position: absolute;
    bottom: 0.52rem;
    left: 0;
    right: 0;
    color: rgb(75, 107, 143);
    font-size: 0.20rem;
    font-family: "ALIBABA-PUHUITI-REGULAR";
    text-align: center;
}

.section-schedule-milestones .reward-item-active .reward-name {
    bottom: 1.00rem;
    color: rgb(254, 254, 254);
}

.section-schedule-milestones .achieved-btn {
    display: none;
    position: absolute;
    left: -0.15rem;
    bottom: 0.38rem;
    width: 1.95rem;
    height: 0.46rem;
    background: url("../ossweb-img/pc/scheduleMilestones/achieved-btn.png") no-repeat top/cover;
}

.section-schedule-milestones .light {
    display: none;
    position: absolute;
    left: -0.15rem;
    top: 0.74rem;
    width: 2.69rem;
    height: 2.07rem;
}

.light1 {
    position: absolute;
    width: .4rem;
    height: .4rem;
    left: .98rem;
    top: 0;
    background: url("../ossweb-img/pc/scheduleMilestones/reward-light.png") no-repeat;
    background-size: 2.69rem, 2.07rem;
    background-position: -0.98rem 0;
    animation: light1 1s linear infinite;
}

@keyframes light1 {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.light2 {
    position: absolute;
    width: .4rem;
    height: .4rem;
    left: 1.4rem;
    top: 0.1rem;
    background: url("../ossweb-img/pc/scheduleMilestones/reward-light.png") no-repeat;
    background-size: 2.69rem, 2.07rem;
    background-position: -1.4rem -0.1rem;
    animation: light1 1s linear infinite;
    animation-delay: .5s;
}

.light3 {
    position: absolute;
    width: .4rem;
    height: .4rem;
    left: 0;
    top: .7rem;
    background: url("../ossweb-img/pc/scheduleMilestones/reward-light.png") no-repeat;
    background-size: 2.69rem, 2.07rem;
    background-position: 0 -0.7rem;
    animation: light1 1s linear infinite;
    animation-delay: 1s;
}

.light4 {
    position: absolute;
    width: .4rem;
    height: .4rem;
    left: .98rem;
    top: 1.6rem;
    background: url("../ossweb-img/pc/scheduleMilestones/reward-light.png") no-repeat;
    background-size: 2.69rem, 2.07rem;
    background-position: -.98rem -1.6rem;
    animation: light1 1s linear infinite;
    animation-delay: 1.5s;
}

.light5 {
    position: absolute;
    width: .4rem;
    height: .4rem;
    left: 1.7rem;
    top: 1.4rem;
    background: url("../ossweb-img/pc/scheduleMilestones/reward-light.png") no-repeat;
    background-size: 2.69rem, 2.07rem;
    background-position: -1.7rem -1.4rem;
    animation: light1 1s linear infinite;
    animation-delay: 2s;
}

.section-schedule-milestones .reward-item-active .achieved-btn {
    display: block;
}

.section-schedule-milestones .reward-item-active .light {
    display: block;
}

.section-schedule-milestones .reward-item-active .reward2 {
    top: 1.31rem !important;
}

.section-schedule-milestones .reward-item-active .reward3, .section-schedule-milestones .reward-item-active .reward4 {
    top: 1.18rem !important;
}

.section-schedule-milestones .final-item.reward-item-active .achieved-btn {
    width: 2.35rem;
    height: 0.58rem;
    bottom: 0.38rem;
    left: -0.35rem;
    background: url("../ossweb-img/pc/scheduleMilestones/final-achieved-btn.png") no-repeat top/cover;
}

.section-schedule-milestones .final-item.reward-item-active .light-decorate {
    position: absolute;
    left: 50%;
    top: 1.15rem;
    width: 2.88rem;
    height: 1.37rem;
    transform: translateX(-50%);
    background: url("../ossweb-img/pc/scheduleMilestones/reward-final-lights.png") no-repeat top/cover;
}

.section-schedule-milestones .final-item.reward-item-active img {
    top: 0.98rem;
    z-index: 30;
}

.section-schedule-milestones .final-item.reward-item-active .reward-name {
    color: rgb(75, 107, 143);
}

.section-schedule-milestones .subscribe-btn {
    /*position: absolute;*/
    cursor: pointer;
    margin: 0.85rem auto 0;
    /*left: 50%;*/
    /*transform: translateX(-50%);*/
}

.section-schedule-milestones .progress-container {
    /*position: absolute;*/
    /*top: 6.44rem;*/
    /*left: 0;*/
    /*right: 0;*/
    width: 19.20rem;
    margin-top: -0.5rem;
}

.section-schedule-milestones .progress-line-bg {
    height: 1.23rem;
    background: url("../ossweb-img/pc/scheduleMilestones/step-line.png") no-repeat center / 100% auto;
}

.section-schedule-milestones .step-line-active1 {
    height: 1.23rem;
    background: url("../ossweb-img/pc/scheduleMilestones/step-line-active1.png") no-repeat center / 100% 100%;
}

.section-schedule-milestones .step-line-active2 {
    height: 1.23rem;
    background: url("../ossweb-img/pc/scheduleMilestones/step-line-active2.png") no-repeat center / 100% 100%;
}

.section-schedule-milestones .step-line-active3 {
    height: 1.23rem;
    background: url("../ossweb-img/pc/scheduleMilestones/step-line-active3.png") no-repeat center / 100% 100%;
}

.section-schedule-milestones .step-line-active4 {
    height: 1.23rem;
    background: url("../ossweb-img/pc/scheduleMilestones/step-line-active4.png") no-repeat center / 100% 100%;
}

.section-schedule-milestones .step-line-active5 {
    height: 1.23rem;
    background: url("../ossweb-img/pc/scheduleMilestones/step-line-active5.png") no-repeat center / 100% 100%;
}

.section-schedule-milestones .progress-container .progress-item {
    color: #fff;
    font-size: 0.28rem;
    font-family: "ALIBABA-PUHUITI-REGULAR";
    position: absolute;
    top: 1.15rem;
}

.section-schedule-milestones .progress-container .progress1 {
    left: 3.95rem;
}

.section-schedule-milestones .progress-container .progress2 {
    left: 6.61rem;
}

.section-schedule-milestones .progress-container .progress3 {
    left: 9.29rem;
}

.section-schedule-milestones .progress-container .progress4 {
    left: 11.85rem;
}

.section-schedule-milestones .progress-container .progress5 {
    left: 14.5rem;
}

.progress-item-active p {
    text-shadow: 0.05rem 0.05rem .1rem #71caf5, -0.05rem -0.05rem .1rem #71caf5, -0.05rem 0.05rem .1rem #71caf5, 0.05rem -0.05rem .1rem #71caf5;
}

.progress-item-active p:before {
    content: '';
    width: calc(100% + 0.5rem);
    height: 0.18rem;
    position: absolute;
    top: calc(50% - 0.09rem);
    left: -0.25rem;
    background: url("../ossweb-img/pc/pass-act.png") no-repeat top/100% 100%;
}

/*播放视频*/
.tips_video {
    position: fixed;
    z-index: 100;
}

.tips_video, .tips_video .marks {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.tips_video .marks {
    position: absolute;
    z-index: 1;
    background-color: rgba(0, 0, 0, .5);
}

.tips_video, .tips_video .marks {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.dialog {
    position: fixed;
    z-index: 100;
    display: none;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.8);
}

#s1_video {
    width: 9.68rem;
    height: 5.44rem;
    object-fit: cover;
    border-radius: .05rem;
    position: relative;

}

.video-dialog .videoContainer {
    width: 9.37rem;
    height: 5.42rem;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    background: url("../ossweb-img/pc/video-player-bg.png") no-repeat top/cover;
}

.video-dialog #video-card {
    position: absolute;
    top: 0.22rem;
    left: 0.21rem;
    right: 0.21rem;
    bottom: 0.25rem;
    background-color: #000;
}

.btn_close {
    display: block;
    width: .54rem;
    height: .54rem;
    position: absolute;
    top: -0.65rem;
    right: 0.17rem;
    z-index: 99;
    cursor: pointer;
    background: url("../ossweb-img/pc/close-video-btn.png") 0/100% 100% no-repeat;
}

.login-dialog .loginContainer {
    width: 5.71rem;
    height: 5.63rem;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    background: url("../ossweb-img/pc/book-info-bg.png") no-repeat top/cover;
}

.login-title {
    width: 2.50rem;
    height: .52rem;
    position: absolute;
    top: .29rem;
    left: 50%;
    transform: translateX(-50%);
    background: url("../ossweb-img/pc/book-title.png") top/100% 100% no-repeat;
}

.login-equipment-con {
    width: 4.22rem;
    height: .55rem;
    position: absolute;
    top: 1.1rem;
    left: 50%;
    transform: translateX(-50%);
    background: url("../ossweb-img/pc/equipment-bg.png") top/100% 100% no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-equipment-item {
    width: 1.35rem;
    height: .48rem;
    margin: 0 .02rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-equipment-item .img {
    width: auto;
    height: .2rem;
}

.login-equipment-item:nth-child(1) .img {
    width: auto;
    height: .18rem;
}

.login-equipment-item .img-act {
    width: auto;
    height: .41rem;
    display: none;
}

.login-equipment-item-act .img {
    display: none;
}

.login-equipment-item-act .img-act {
    display: block;
}

.login-equipment-item-act {
    background: url("../ossweb-img/pc/equipment-pc-act.png") top/100% 100% no-repeat;
}

.login-phone {
    width: 4.22rem;
    height: .51rem;
    position: absolute;
    top: 2.1rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
    background: url("../ossweb-img/pc/phone-input.png") top/100% 100% no-repeat;
}

.phone-input {
    width: 3.8rem;
    height: .4rem;
    border: none;
    outline: none;
    background-color: transparent !important;
    font-size: .22rem;
    color: #a9bbcc !important;
}

.phone-input::placeholder {
    background-color: transparent !important;
    font-size: .22rem;
    color: #a9bbcc !important;
}

.login-sms-box {
    width: 4.22rem;
    height: .51rem;
    position: absolute;
    top: 3.1rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.login-sms {
    width: 2.68rem;
    height: .51rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background: url("../ossweb-img/pc/sms-input.png") top/100% 100% no-repeat;
}

.sms-input {
    width: 2.2rem;
    height: .4rem;
    border: none;
    outline: none;
    background-color: transparent;
    font-size: .22rem;
    color: #a9bbcc;
}

.sms-input::placeholder {
    font-size: .22rem;
    color: #a9bbcc;
}

.sms-btn {
    width: 1.39rem;
    height: .51rem;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    color: #43aff0;
    font-size: .22rem;
    background: url("../ossweb-img/pc/get-sms.png") top/100% 100% no-repeat;
}

#smsNum {
    transform: translatey(-0.02rem);
}

.login-btn {
    width: 2.75rem;
    height: .72rem;
    position: absolute;
    top: 4.3rem;
    left: 50%;
    transform: translateX(-50%);
    background: url("../ossweb-img/pc/submit.png") top/100% 100% no-repeat;
    cursor: pointer;
}

.tips-dialog .tipsContainer {
    width: 5.71rem;
    height: 3.41rem;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    background: url("../ossweb-img/pc/tips-bg.png") no-repeat top/cover;
}

.tips-text {
    width: 80%;
    height: 1.5rem;
    position: absolute;
    top: 0.9rem;
    left: 50%;
    transform: translateX(-50%);
    font-size: .22rem;
    text-align: center;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tips-dialog .login-btn {
    width: 2.22rem;
    height: .59rem;
    top: 2.6rem;
}

#video-card video {
    width: 100%;
    height: 100%;
}

.logo-opacity {
    opacity: 0;
}