.bgltsb {

        background-repeat: no-repeat;
        background-image: url("../image/jinlingaoqing.jpg");
        background-size: 100%;
        background-position: center top;
        background-color: #b3201b;
    }
    @keyframes btnShake1 {
        0% {
            transform: scale(1)
        }

        40% {
            transform: scale(1.1)
        }

        60% {
            transform: scale(.9)
        }

        80% {
            transform: scale(1.2)
        }

        100% {
            transform: scale(1)
        }
    }
    .dh-active{
        animation: btnShake1 2s infinite;
    }
    .needwai{
        transform:rotate(-6deg);
        display:inline-block;
    }
    .needzheng{
        transform:rotate(6deg);
        display:inline-block;
    }


    .share-contanier .share-head::after {
        width: 100%;
        height: 325px;
        left: 0;
        border-radius: 0 0 50% 50% / 10px 10px 22% 22%;
        background: url('../image/external/a2db8d0627587b59.png') center;
        background-size: cover
    }

    @keyframes btn1 {
        0% {
            transform: rotate(-720deg)
        }

        100% {
            transform: rotate(0deg)
        }
    }

    @keyframes show2 {
        0% {
            opacity: 0;
            transform: translateY(50%)
        }

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

    @keyframes btn2 {
        0% {
            transform: scale(0)
        }

        100% {
            transform: scale(1)
        }
    }

    @keyframes show3 {
        0% {
            opacity: 0;
            transform: translateY(-50%)
        }

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

    @keyframes btn3 {
        0% {
            transform: scale(0)
        }

        100% {
            transform: scale(1)
        }
    }

    @keyframes show4 {
        0% {
            opacity: 0;
            border-radius: 100%
        }

        100% {
            opacity: 1;
            border-radius: 0%
        }
    }

    @keyframes btn4 {
        0% {
            transform: scale(1, 0)
        }

        100% {
            transform: scale(1, 1)
        }
    }

    @keyframes btnShake1 {
        0% {
            transform: scale(1)
        }

        40% {
            transform: scale(1.1)
        }

        60% {
            transform: scale(.9)
        }

        80% {
            transform: scale(1.2)
        }

        100% {
            transform: scale(1)
        }
    }

    @keyframes btnShake2 {
        0% {
            transform: scale(1)
        }

        40% {
            transform: scale(1.1, 0.9)
        }

        60% {
            transform: scale(.9, 1.1)
        }

        80% {
            transform: scale(1.2, 0.8)
        }

        100% {
            transform: scale(1)
        }
    }

    @keyframes btnShake3 {
        0% {
            transform: scale(1, 1) rotate(0deg)
        }

        10% {
            transform: scale(1.2, 0.8)
        }

        20% {
            transform: scale(0.8, 1.2)
        }

        30% {
            transform: scale(1.2, 0.8)
        }

        40% {
            transform: scale(0.8, 1.2)
        }

        50% {
            transform: scale(1, 1)
        }

        60% {
            transform: rotate(-15deg)
        }

        70% {
            transform: rotate(15deg)
        }

        80% {
            transform: rotate(-25deg)
        }

        90% {
            transform: rotate(25deg)
        }

        100% {
            transform: scale(1, 1) rotate(0deg)
        }
    }

    @keyframes btnShake4 {
        0% {
            transform: rotate(0deg);
            opacity: 1
        }

        10% {
            transform: scale(1.2, 0.8)
        }

        20% {
            transform: scale(0.8, 1.2)
        }

        30% {
            transform: scale(1.2, 0.8)
        }

        40% {
            transform: scale(0.8, 1.2)
        }

        50% {
            transform: scale(1, 1)
        }

        60% {
            opacity: 1
        }

        70% {
            opacity: 0.5
        }

        80% {
            opacity: 1
        }

        90% {
            opacity: 0.5
        }

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

    @keyframes btnMove {
        from {
            transform: rotateY(180deg)
        }

        to {
            transform: rotateY(360deg)
        }
    }

    @keyframes itemMove1 {
        0% {
            height: 0rem
        }

        100% {
            height: 1.2rem
        }
    }

    @keyframes itemMove2 {
        0% {
            height: 0rem;
            transform: scaleY(0)
        }

        40% {
            height: 1.2rem;
            transform: scaleY(0)
        }

        100% {
            transform: scaleY(1)
        }
    }

    @keyframes itemMove3 {
        0% {
            height: 0rem;
            transform: translateX(2rem);
            opacity: 0
        }

        40% {
            height: 1.2rem;
            transform: translateX(2rem);
            opacity: 0
        }

        100% {
            transform: translateX(0rem);
            opacity: 1
        }
    }

    @keyframes itemMove4 {
        0% {
            height: 0rem;
            transform: translateX(-2rem);
            opacity: 0
        }

        40% {
            height: 1.2rem;
            transform: translateX(-2rem);
            opacity: 0
        }

        100% {
            transform: translateX(0rem);
            opacity: 1
        }
    }

    @keyframes tipMove {
        0% {
            transform: translate(0rem, 0%)
        }

        40% {
            transform: translate(-0.2rem, 30%)
        }

        100% {
            transform: translate(0rem, 0%)
        }
    }
    .hide{
        display: none;
    }


    .wave {
        margin: auto;
        position: relative;
        width: 100px;
        height: 100px;
        text-align: center;
        line-height: 100px;
        font-size: 28px;
    }

    .wave .circle {
        position: absolute;
        border-radius: 50%;
        opacity: 0;
    }
    .wave.ripple .circle {
        width: calc(100% - 6px);
        height: calc(100% - 6px);
        border: 3px solid #fff;
    }

    .wave.ripple .circle:first-child {
        animation: circle-opacity 2s infinite;
    }

    .wave.ripple .circle:nth-child(2) {
        animation: circle-opacity 2s infinite;
        animation-delay: .3s;
    }

    .wave.ripple .circle:nth-child(3) {
        animation: circle-opacity 2s infinite;
        animation-delay: .6s;
    }

    .wave.ripple.danger {
        color: red;
        position: relative;
        top: -10px;
    }

    .wave.ripple.danger .circle {
        border-color: red;
    }

    .wave.ripple.warning {
        color: orange;
    }

    .wave.ripple.warning .circle {
        border-color: orange;
    }
    .wave.solid .circle {
        width: 100%;
        height: 100%;
        background: #fff;
    }

    .wave.solid .circle:first-child {
        animation: circle-opacity 2s infinite;
    }

    .wave.solid.danger {
        color: red;
    }

    .wave.solid.danger .circle {
        background: red;
    }

    .wave.solid.warning {
        color: orange;
    }

    .wave.solid.warning .circle {
        background: orange;
    }

    @keyframes circle-opacity {
        from {
            opacity: 1;
            transform: scale(2);
        }
        to {
            opacity: 0;
            transform: scale(1);
        }
    }

    .none {
        display: none;
    }

    .hide {
        display: none;
    }

    .shows {
        display: block;
    }

    .guidespot {
        display: none;
    }
    .progress {
    --bs-progress-height: 2rem;
    --bs-progress-bar-color: #fff;
    --bs-progress-bar-bg: #07c160;
    height: var(--bs-progress-height);
    background-color: #fff;
    overflow: hidden;
    font-size: 1.25rem;
    border-radius: 1.5rem;
    position: relative;
    display: flex;
    --bs-progress-bar-transition: width 0.6s ease
}

.progress-bar {
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    text-align: center;
    white-space: nowrap;
    background-color: var(--bs-progress-bar-bg);
    transition: var(--bs-progress-bar-transition);
    font-size: 1rem;
    color: #fff;
    font-weight: 700
}

.progress-bar-animated {
    animation: progress-bar-stripes-1715dfc0 1s linear infinite;
}

@keyframes progress-bar-stripes-1715dfc0 {
    0% {
        background-position-x: var(--bs-progress-height)
    }
}

.progress-bar-striped {
    background-image: linear-gradient(45deg,hsla(0,0%,100%,.15) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.15) 0,hsla(0,0%,100%,.15) 75%,transparent 0,transparent);
    background-size: var(--bs-progress-height) var(--bs-progress-height)
}
@keyframes progressGrow {
      from {
        width: 40%;
      }
      to {
        width: 60%;
      }
    }
@keyframes progressGrow1 {
      from {
        width: 60%;
      }
      to {
        width: 80%;
      }
    }    
@keyframes progressGrow2 {
      from {
        width: 80%;
      }
      to {
        width: 86%;
      }
    }
@keyframes progressGrow3 {
      from {
        width: 86%;
      }
      to {
        width: 90%;
      }
    } 
@keyframes progressGrow4 {
      from {
        width: 90%;
      }
      to {
        width: 95%;
      }
    }
@keyframes progressGrow5 {
      from {
        width: 95%;
      }
      to {
        width: 99%;
      }
    }
@keyframes progressGrow6 {
      from {
        width: 99%;
      }
      to {
        width: 100%;
      }
    }
    .msg-container{
         align-items: flex-start;
             padding-top: 2vh;
    }
    .msg-container .msg-box .msg-content {
    padding: 0 2vw;
    }
    .share-contanier .share-head .subtitle {
        font-size: 20px;
    }
    .share-contanier .share-head .auth {
        font-size: 17px;
    }