/*------------------- ホバー時にアニメーション -------------------*/

/* 上に上がる */
.hover-up {
    margin-top: 0px;
    transition: margin-top 0.3s ease; /* ← 追加 */
}

.hover-up:hover {
    margin-top: -15px;
}
/* 光エフェクト */
.shine-wrapper .relative::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    transform:translate(50%, -50%);
    width: 520px;
    height: 520px;
    border-radius: 50%;
    background: radial-gradient(circle farthest-side at 100% 0%, rgba(255,255,255,0), rgba(255,255,255,1));
    pointer-events: none;
    z-index: 10;
    opacity: 0;
}
  
  /* ↓ hoverではなく、クラス名でアニメ発火 */
  .shine-wrapper.animate .relative::before {
    animation: shine 0.6s forwards;
  }
  
  @keyframes shine {
    0% {
      width: 0px;
      height: 0px;
      opacity: 0.3;
    }
    100% {
      width: 520px;
      height: 520px;
      opacity: 0;
    }
  }