@charset "utf-8";
/* CSS Document */

/* モーダルウインドウのスライドダウンアニメーション */
.modal-card.slide-down {
    animation: slideDown 0.5s forwards;
}

/* モーダルウインドウのスライドアップアニメーション */
.modal-card.slide-up {
    animation: slideUp 0.5s forwards;
}

/* 背景のフェードインアニメーション */
.modal-background.fade-in {
    animation: fadeIn 0.5s forwards;
}

/* 背景のフェードアウトアニメーション */
.modal-background.fade-out {
    animation: fadeOut 0.5s forwards;
}

@keyframes slideDown {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes slideUp {
    from {
        transform: translateY(0);
        opacity: 1;
    }
    to {
        transform: translateY(-100%);
        opacity: 0;
    }
}

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

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