html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#bottombar {
    display: none !important;
}

* {
    margin: 0;
    text-decoration: none;
    padding: 0;
    -webkit-tap-highlight-color: transparent;
    outline: none;
    -webkit-touch-callout: none;
}


img {
    width: 100%;
    height: 100%;
    display: block;
}

body {
    transform-origin: 0 0;
    width: 100vh;
    overflow: hidden;
    height: 100vw;
    transform: rotateZ(90deg) translateY(-100%);
    overscroll-behavior: none;
    touch-action: none;
}

.strikethrough {
    text-decoration: line-through;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(60px) rotate(-3deg);
    }

    to {
        opacity: 1;
        transform: translateY(0) rotate(-3deg);
    }
}

@keyframes slideInDown {
    from {
        opacity: 0;
        transform: translateY(-60px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translateX(-40px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes slideInLeft1 {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(40px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.8);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes bounceIn {
    0% {
        opacity: 0;

    }

    100% {
        opacity: 1;
    }
}

@keyframes heightExpand {
    from {
        opacity: 0;
        height: 0;
        overflow: hidden;
    }

    to {
        opacity: 1;
        height: 6.79rem;
        overflow: hidden;
    }
}

.animate-hidden {
    opacity: 0;
}

.animate-fadeIn {
    opacity: 0;
    animation: fadeIn 0.8s ease-out forwards;
}

.animate-slideUp {
    opacity: 0;
    animation: slideInUp 0.8s ease-out forwards;
}

.animate-slideDown {
    opacity: 0;
    animation: slideInDown 0.8s ease-out forwards;
}

.animate-slideLeft {
    opacity: 0;
    animation: slideInLeft 0.8s ease-out forwards;
}

.animate-slideLeft1 {
    opacity: 0;
    animation: slideInLeft1 0.8s ease-out forwards;
}

.animate-slideRight {
    opacity: 0;
    animation: slideInRight 0.8s ease-out forwards;
}

.animate-scaleIn {
    opacity: 0;
    animation: scaleIn 0.8s ease-out forwards;
}

.animate-bounceIn {
    opacity: 0;
    animation: bounceIn 0.8s ease-out forwards;
}

.animate-heightExpand {
    opacity: 0;
    height: 0;
    overflow: hidden;
    animation: heightExpand 1.2s ease-out forwards;
}

@keyframes breathe {

    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.1);
        opacity: 1;
    }
}


.animate-breathe {
    opacity: 1;
    animation: breathe 2s ease-in-out infinite;
}


@keyframes swing {

    0% {
        transform: rotate(-3deg);
    }

    50% {
        transform: rotate(3deg);
    }

    100% {
        transform: rotate(-3deg);
    }
}

.animate-swing {
    opacity: 1;
    animation: swing 2s ease-in-out infinite;
    transform-origin: center center;
}

.animate-fadeOut {
    animation: fadeOut 0.8s ease-out forwards;
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

/* 分享弹窗 */
.navShare {
    position: absolute;
    right: 0.16rem;
    top: 0.36rem;
    z-index: 99999999;
}

.navShare img {
    width: 0.75rem;
    height: 0.7rem;
}
.navShare div {
    font-size: 0.18rem;
    font-weight: normal;
    font-stretch: normal;
    letter-spacing: 0rem;
    text-align: center;
    margin-top: 0.06rem;
    color: #9d6300;
}
.shareMask {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vh;
    height: 100vw;
    z-index: 99999999;
    background: rgba(0, 0, 0, 0.6);
}
.shareMask .guide {
    position: fixed;
    top: 0.48rem;
    left: 0.24rem;
    width: 5.97rem;
    height: 3.51rem;
}
.shareMask .shareBtn {
    position: fixed;
    bottom: 2.13rem;
    left: 3.35rem;
    width: 1.87rem;
    height: 0.78rem;
}