.plat {
    font-feature-settings: "palt";
}

.noto, .noto * {
    font-family: 'Noto Sans JP', sans-serif;
}

.zen, .zen * {
    font-family: 'Zen Maru Gothic', sans-serif;
}

.marker {
    background: linear-gradient(transparent 50%, var(--color-accent) 50%);
}

.animate {
    opacity: 0;
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

/* フェードイン：透明度のみ */
.fade-in.active {
    opacity: 1;
}

/* フェードアップ：下から上に移動 */
.fade-up {
    transform: translateY(50px);
}

.fade-up.active {
    opacity: 1;
    transform: translateY(0);
}

/* フェード左：右から左に移動 */
.fade-left {
    transform: translateX(50px);
}

.fade-left.active {
    opacity: 1;
    transform: translateX(0);
}

/* フェード右：左から右に移動 */
.fade-right {
    transform: translateX(-50px);
}

.fade-right.active {
    opacity: 1;
    transform: translateX(0);
}

/* ズームイン：小さいサイズから拡大 */
.zoom-in {
    transform: scale(0.8);
}

.zoom-in.active {
    opacity: 1;
    transform: scale(1);
}