@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&family=Zen+Maru+Gothic:wght@500;700;900&display=swap');

/* 全体基本設定 */
html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Zen Maru Gothic', 'Noto Sans JP', sans-serif;
    word-break: break-word;
    overflow-wrap: break-word;
    background-color: #FAF8F5;
}

/* ユニバーサルデザイン配慮：フォーカス時のハイライト */
a:focus-visible,
button:focus-visible {
    outline: 3px solid #0284C7;
    outline-offset: 3px;
    border-radius: 4px;
}

/* ふんわり浮遊するアニメーション */
@keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-8px);
    }
}

.animate-float {
    animation: float 4s ease-in-out infinite;
}

/* カード要素のホバーアニメーション */
.hover-card-bounce {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
}

.hover-card-bounce:hover {
    transform: translateY(-6px);
}

/* スクロールバーのパステルカスタマイズ */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #FAF8F5;
}

::-webkit-scrollbar-thumb {
    background: #BAE6FD;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #38BDF8;
}