.loading {
    width: 100%;
    opacity: 0;
    transition: 1s;
    position: absolute;
    min-height: calc(100vh - 0.87rem);
    padding-bottom: 0.87rem;
    background: url(https://greatnews.swmob.com/laobing/indexBj.jpg) top left / 100% 100%;
}

.loading.active {
    z-index: 9;
    opacity: 1;
}

.home.active {
    z-index: 9;
    opacity: 1;
}

.indexImg1 {
    width: 5.67rem;
    padding-top: 0.58rem;
    height: 4.71rem;
    margin: auto
}

.indexImg2 {
    width: 5.67rem;
    margin: 0.45rem auto;
    height: 4.76rem;
}

.logo {
    width: 1.88rem;
    height: 0.52rem;
    margin: 0.14rem auto 0;
}

.indexText {
    width: 4.74rem;
    height: 0.44rem;
    margin: 0.4rem auto 0.45rem;
}

.jindutiao {
    width: 4.28rem;
    height: 0.22rem;
    background-color: #cbcbbb;
    box-shadow: inset 0rem 0.03rem 0.05rem 0rem rgba(110, 110, 110, 0.35);
    border-radius: 0.5rem;
    margin: 0 auto 0.33rem;
    border: solid 0.06rem #fffff1;
}

.jindutiao1 {
    font-size: 0.28rem;
    line-height: 0.48rem;
    text-align: center;
    color: #fffee9;
}

.jindutiao div {
    background-image: linear-gradient(-89deg,
            #ffa55a 0%,
            #ef0406 100%);
    position: relative;
    border-radius: 0.5rem;
    height: 0.22rem;
}

.jindutiao img {
    position: absolute;
    right: -0.48rem;
    width: 0.76rem;
    top: -0.26rem;
    height: 0.71rem;
}

.home {
    width: 100%;
    min-height: calc(100vh - 0.87rem);
    opacity: 0;
    transition: 1s;
    overflow-y: auto;
    position: absolute;
    background: url(https://greatnews.swmob.com/laobing/homeBJ.png) top left / 100% 100%;
}

.xiahuaBox .xiahuaImg {
    width: 3.04rem;
    margin: auto
}


.xiahuaBox .xiahuaIcon {
    width: 2.06rem;
    margin: auto;
    animation: xiahua 2s linear infinite;
}

.jinru {
    position: relative;
    margin: auto;
    width: 3.03rem !important;
    animation: huxi 2s linear infinite;
}

@keyframes huxi {
    0% {
        transform: scale(0.9);
    }

    50% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(0.9);
    }
}

@keyframes xiahua {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(0.2rem);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes zuo {
    0% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(-0.1rem);
    }

    100% {
        transform: translateX(0);
    }
}

@keyframes you {
    0% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(0.1rem);
    }

    100% {
        transform: translateY(0);
    }
}
.xiahuaBox {
    position: absolute;
    width: 100%;
    height: calc(3.29rem - 1.2rem);
    padding-top: 1.2rem;
    bottom: 0;
    left: 50%;
    background: url(https://greatnews.swmob.com/laobing/mengceng.png) top left / 100% 100%;
    opacity: 0;
    z-index: 99;
    transition: 1s;
    transform: translateX(-50%);
}

.xiahuaBox.active {
    opacity: 1;
}

.home::before {
    content: '';
    width: 5.57rem;
    position: fixed;
    height: 13.44rem;
    background: url(https://greatnews.swmob.com/laobing/homeBj1.png) top left / 100% 100%;
    top: 0.32rem;
    left: 1.13rem;
}

.homeTitle {
    width: 4.39rem;
    height: 0.72rem;
    margin: 0 0 3.39rem 0.59rem;
    padding-top: 0.52rem;
    opacity: 0;
    transition: 0.5s;
}

.homeTitle.active {
    opacity: 1;
}

.Text2 {
    width: 4.7rem;
    margin: 0 auto 0.22rem;
    opacity: 0;
    transition: 0.5s;
}

.Text3 {
    width: 4.7rem;
    margin: 0 auto 0.22rem;
    opacity: 0;
    transition: 0.5s;
}

.Text4 {
    width: 4.7rem;
    margin: 0 auto 0.22rem;
    opacity: 0;
    transition: 0.5s;
}

.Text5 {
    width: 4.7rem;
    margin: 0 auto 0.22rem;
    opacity: 0;
    transition: 0.5s;
}

.Text6 {
    width: 4.7rem;
    margin: 0 auto 0.22rem;
    opacity: 0;
    transition: 0.5s;
}

.Text7 {
    width: 4.7rem;
    margin: 0 auto 0.22rem;
    opacity: 0;
    transition: 0.5s;
}

.Text1 {
    width: 4.7rem;
    margin: 0 auto 0.22rem;
    opacity: 0;
    transition: 0.5s;
}

.Text1.active {
    opacity: 1;
}

.Text2.active {
    opacity: 1;
}

.Text3.active {
    opacity: 1;
}

.Text4.active {
    opacity: 1;
}

.Text5.active {
    opacity: 1;
}

.Text6.active {
    opacity: 1;
}

.Text7.active {
    opacity: 1;
}

.homeText2 {
    width: 5.59rem;
    height: 5.52rem;
    margin: 1.4rem auto 1rem;
    opacity: 0;
    transition: 1s;
}

.homeText2.active {
    opacity: 1;
}

.laobingImgBox {
    margin: 0 0.26rem;
    padding-top: 0.04rem;
    display: flex;
    opacity: 0;
    transition: 3s;
    flex-wrap: wrap;
}

.laobingImgBox.active {
    opacity: 1;
}

.homeItem1 {
    position: relative;
    opacity: 0;
    height: 100vh;
    transition: 1s;
}

.homeItem1.active {
    z-index: 9;
    opacity: 1;
}

.laobingImgBox img {
    width: 2.26rem;
    height: 2.27rem;
    margin-bottom: 0.12rem;
}

.laobingImgBox img:nth-child(3n + 2) {
    margin: 0 0.1rem 0 0.09rem;
}

.dzimg {
    animation: huxi 2s linear infinite;
}

.dz {
    width: 1.32rem;
    opacity: 0;
    position: relative;
    transition: 1s;
    height: 1.17rem;
    margin: 0 auto;
}

.dongxiao {
    width: 1.19rem !important;
    position: absolute;
    top: 10vh;
    left: -19vw;
    animation: run-right-right 1s .4s 1 linear, run-right-top 1s .4s 1 cubic-bezier(.66, .35, .51, .41);
    animation-fill-mode: forwards;
}

.jinruBox {
    position: relative;
}

.hint {
    width: 0.69rem !important;
    height: 0.76rem;
    top: 0.6rem;
    right: -0.1rem;
    position: absolute;
}


@keyframes run-right-right {
    0% {
        left: -19vw
    }

    100% {
        left: 24vw;
    }
}

@keyframes run-right-top {
    0% {
        top: 10vh;
    }

    100% {
        top: -10px;
    }
}


.dz.active {
    opacity: 1;
}

.homeText3 {
    width: 3.68rem;
    opacity: 0;
    transition: 1s;
    height: 0.36rem;
    margin: 0 auto;
    margin-top: 0.6rem;
}

.homeText3.active {
    opacity: 1;
}

.homeLogoBox {

    margin-top: 2.31rem;
}

.tbmximg {
    width: 2.67rem !important;
    margin: auto;
    margin-bottom: 0.2rem;
}

.homeLogo {
    width: 1.69rem !important;
    height: 0.45rem !important;
    margin: auto;
    padding-bottom: 0.87rem;
}


.homeShare {
    width: 0.66rem;
    height: 0.88rem;
    z-index: 99;
    position: fixed;
    right: 0.13rem;
    bottom: 3.06rem;
}

.shareImg {
    width: 6rem;
}

.popupItem {
    position: fixed;
    top: 50%;
    left: 50%;
    opacity: 0;
    transition: 1s;
    transform: translate(-50%, -50%);
    background-size: 100% 100%;
    z-index: 999;
}

.popupItem.active {
    opacity: 1;
}

.popupShareImg {
    width: 5.72rem;
	height: 11.56rem;
}

.dzPop {
    width: 7.42rem;
    height: calc(7.42rem - 0.93rem);
    padding-top: 0.93rem;
    opacity: 0;
    transition: 1s;
    background: url('https://greatnews.swmob.com/laobing/dzPop.png?v1') no-repeat center center / 100% 100%;
}

.dzPop.active {
    opacity: 1;
}


.dzPop img {
    width: 4.88rem;
    height: 4.69rem;
    margin: 0 auto;
    opacity: 0;
    transition: 1s;
}

.dzPop img.active {
    opacity: 1;
}

.dzPop .dzText {
    opacity: 0;
    transition: 1s;
}

.dzPop .dzText.active {
    opacity: 1;
}

.dzPopItem {
    position: fixed;
    top: 50%;
    z-index: 999;
    left: 50%;
    transform: translate(-50%, -50%);
}

.popupClose {
    width: 0.46rem;
    height: 0.46rem;
    position: absolute;
    z-index: 999;
    top: -0.17rem;
    right: -0.24rem;
}

.swiper-button-next,
.swiper-button-prev {
    width: 0.8rem;
    top: 4.77rem;
    margin: 0 !important;
    height: 2.02rem;
}

.swiper-button-prev {
    left: -0.78rem;
    background: url('https://greatnews.swmob.com/laobing/prev.png') no-repeat center center / 100% 100%;
    animation: 2s zuo linear infinite
}
.swiper-button-next {
    right: -0.78rem;
    background: url('https://greatnews.swmob.com/laobing/next.png') no-repeat center center / 100% 100%;
    animation: 2s you linear infinite
}

.popupText {
    font-size: 0.22rem;
    font-weight: normal;
    font-stretch: normal;
    line-height: 0.41rem;
    letter-spacing: 0.02rem;
    color: #ffffff;
    text-align: center;
    margin: 0.48rem 0;
}

.shadow {
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    z-index: 999;
    left: 0;
    opacity: 0;
    transition: 1s;
    background: rgba(0, 0, 0, 0.92);
}

.shadow.active {
    opacity: 1;
}

.homeItem2 {
    position: absolute;
    transition: 1s;
    opacity: 0;
    top: 0;
}

.homeItem2.active {
    opacity: 1;
    z-index: 9;
}

.laobingPopItem {
    position: fixed;
    top: 50%;
    left: 50%;
    opacity: 0;
    transition: 1s;
    transform: translate(-50%, -50%);
    background-size: 100% 100%;
    z-index: 999;
}

.laobingPopItem.active {
    opacity: 1;
}

.playIcon {
    position: fixed;
    top: 0.94rem;
    right: 0.19rem;
    width: 0.55rem;
    height: 0.55rem;
    z-index: 99;
    display: flex;
    justify-content: center;
    align-items: center;
}

.playIcon {
    animation: 2s xuanzhuan linear infinite
}

@keyframes xuanzhuan {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}


.playIcon.pause {
    animation: none
}

.playIcon img {
    height: 100%;
    width: unset;
}

.laobingPopImg {
    width: 6.78rem;
    height: 9.79rem;
}

.laobingPopClose {
    width: 0.46rem;
    height: 0.46rem;
    margin: 0.62rem auto 0;
}

.shadow1 {
    position: fixed;
    width: 100%;
    height: 100vh;
    z-index: 999;
    top: 0;
    backdrop-filter: blur(10px);
    left: 0;
    opacity: 0;
    transition: 1s;
    background: rgba(0, 0, 0, 0.62);
}

.shadow2 {
    position: fixed;
    width: 100%;
    z-index: 999;
    height: 100vh;
    top: 0;
    backdrop-filter: blur(10px);
    left: 0;
    background: rgba(0, 0, 0, 0.62);
    opacity: 0;
    transition: 1s;
}

.shadow1.active {
    opacity: 1;
}

.shadow2.active {
    opacity: 1;
}

.shadow2::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('https://greatnews.swmob.com/laobing/dzShareBj.png') no-repeat top left / 100% 100%;
}

.dzText {
    width: 2.7rem;
    height: 0.35rem;
    margin: auto;
}

.dzText img {
    width: 100%;
    height: 100%;
    margin-top: 1.32rem;
}

.dzShare {
    width: 4.92rem;
    height: 1.13rem;
    opacity: 0;
    transition: 1s;
    margin: 0.8rem auto 0;
}

.dzShare.active {
    opacity: 1;
}