/* Google Fontsの適用 */ body { font-family: 'Inter', 'Noto Sans JP', sans-serif; } /* スクロールバーを隠すユーティリティ */ .scrollbar-hide::-webkit-scrollbar { display: none; } .scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; } /* 画像のアスペクト比を維持するカード */ .card-image-wrapper { position: relative; padding-top: 150%; /* 2:3 aspect ratio */ overflow: hidden; } .card-image-wrapper img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; } /* カードホバー時のエフェクト */ .voice-card:hover img { transform: scale(1.05); } .voice-card { transition: box-shadow 0.3s ease, transform 0.2s ease; cursor: pointer; } .voice-card:hover { box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1); transform: translateY(-2px); } /* 選択状態のボーダー */ .voice-card.selected { border-color: #6366f1; /* Indigo-500 */ box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.2); }