body {
    background-image: url(../img/back.png);
    background-size: contain;
    height: 100vh;
    position: relative;
    text-align: center;
    user-select: none;
}
body .pipe{
    width: 55px;
   position: fixed;
   /* transition: all 1s; */
}
.diban {
    position: fixed;
    z-index: 9999999;
}

.diban img {
    position: absolute;
    width: 100%;
    height: 100%;
}

/* 鸟 */
.bird {
    width: 34px;
    height: 24px;
    background-image: url(../img/hn1.png);
    position: fixed;
    
    transition: all linear 0.15s;
}

@keyframes instigateong {
    0% {
        background-image: url(../img/hn1.png);
    }

    50% {
        background-image: url(../img/hn2.png);
    }

    100% {
        background-image: url(../img/hn3.png);
    }
}

@keyframes instigatetwo {
    0% {
        background-image: url(../img/hn_blue_1.png);
    }

    50% {
        background-image: url(../img/hn_blue_2.png);
    }

    100% {
        background-image: url(../img/hn_blue_1.png);
    }

}

@keyframes instigatethress {
    0% {
        background-image: url(../img/hn_red_1.png);
    }

    50% {
        background-image: url(../img/hn_red_2.png);
    }

    100% {
        background-image: url(../img/hn_red_3.png);
    }
}

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

    50% {
        transform: translateY(10px);
    }

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

.bird_title {
    position: absolute;
    left: 50%;
    top: 40%;
    transform: translate(-50%, -40%);
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 999;
}

.bird_list {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.bird_list img {
    cursor: pointer;
}

.up{
    transform: rotate(-38deg);
}
.down{
    transform: rotate(90deg);
}
.start{
    font-size: 20px;
    margin: 10px 0;
    cursor: pointer;
}

.out{
    position: fixed;
    left: 30px;
    top:  30px;
}
.Goon,.Hungup{
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%)
}
.tite,.Hungup1{
    position: fixed;
    left: 50%;
    top: 36%;
    transform: translate(-55%,-42%);
}

.Integral{
    position: fixed;
    top:  30px;
    left: 50%;
    transform: translateX(-50%);
    
}
.pipe{
    transition: all 0.2s;
}