#remind {
    --font-size: var(--ffs-14);
    background-color: var(--white);
    font-size: var(--font-size);
    padding: 30px;
    padding-bottom: 2vw;
    text-align: center;
}

#remind .container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 15px 30px;
}

#remind .container .left {
    min-width: 300px;
}
#remind .container .left p {
    display: flex;
}

#remind .container .swipe_word {
    --padding: 15px;

    overflow: hidden;
    height: calc(var(--font-size) + (var(--padding) *2) );
    width: min-content;
    background: #D3C2B2;
    border: 6px double var(--white);
    border-radius: 4px;
    cursor: pointer;
    transition: .2s;
    list-style: normal;
}

#remind .swipe_word span {
    display: block;
    height: min-content;
    animation: swipe_words 8s infinite;
}

#remind .swipe_word span a {
	color: var(--white);
	display: block;
    line-height: var(--font-size);
    text-decoration: none;
    padding: var(--padding);
    white-space: nowrap;
}


@keyframes swipe_words {
    0% {
        transform: translateY(0%);
    }
    5% {
        transform: translateY(0%);
    }

    10% {
        transform: translateY(-122%);
    }
    25% {
        transform: translateY(-100%);
    }
    30% {
        transform: translateY(-100%);
    }

    35% {
        transform: translateY(-212%);
    }
    50% {
        transform: translateY(-200%);
    }
    55% {
        transform: translateY(-200%);
    }

    60% {
        transform: translateY(-88%);
    }
    75% {
        transform: translateY(-100%);
    }
    80% {
        transform: translateY(-100%);
    }

    85% {
        transform: translateY(12%);
    }
    100% {
        transform: translateY(0%);
    }
}

