diff --git a/style.css b/style.css index b454d52..569446c 100644 --- a/style.css +++ b/style.css @@ -545,15 +545,30 @@ padding: 8px 10px; } } -.invite-btn { - padding: 10px 15px; - background: #4287f5; - color: white; +.invite-cute-btn { + display: inline-block; + padding: 12px 20px; + font-size: 16px; + font-weight: bold; + border-radius: 25px; border: none; - border-radius: 8px; - font-size: 15px; - margin: 10px 0; + color: white; + background: linear-gradient(135deg, #6ea8ff, #3d7eff); + box-shadow: 0 4px 10px rgba(0, 100, 255, 0.3); + cursor: pointer; + transition: 0.25s ease; + letter-spacing: 0.5px; } -.invite-btn:hover { - opacity: 0.8; + +/* ホバー時にふわっと明るく */ +.invite-cute-btn:hover { + transform: translateY(-2px); + box-shadow: 0 8px 14px rgba(0, 100, 255, 0.35); + filter: brightness(1.1); +} + +/* 押した瞬間に“ぽよん” */ +.invite-cute-btn:active { + transform: scale(0.96); + box-shadow: 0 3px 8px rgba(0, 80, 200, 0.25); }