/* fork.css */
.character-img {
  height: clamp(130px, 23vw, 300px);
  width: auto;
  position: absolute;
  bottom: 60px;
  z-index: 2;
  pointer-events: none;
  object-fit: contain;
}

.character-left  { left:  clamp(-72px, -8vw, -120px); }
.character-right { right: clamp(-72px, -8vw, -120px); }


/* スマホだけの位置調整 */
@media screen and (max-width: 768px) {

  /* 左側キャラ */
  .character-img.character-left {
    left: 4vw;      /* 内側へ寄せる */
    bottom: 60px;   /* 上に持ち上げる */
  }

  /* 右側キャラ */
  .character-img.character-right {
    right: 4vw;     /* 内側へ寄せる */
    bottom: 44px;   /* 左よりやや低め */
  }

  /* デク右キャラ用：元の right:0 / max-width:120px を上書き */
  .item-section-deku .character-img.character-right {
    right: 4vw !important;
    max-width: none;
  }
}

/* NOVELTYのフレーム画像を自然サイズで収める */
.novelty-section .frame-title-bg {
  width: auto;           /* ← 親幅に合わせて無理に広げない */
  max-width: 500px;      /* ← PC上限 */
  height: auto;          /* ← 比率は画像そのまま */
  aspect-ratio: auto;    /* ← 強制比率を解除（上書き） */
  display: block;
  margin: 0 auto;
}

/* SPは小さめに */
@media (max-width: 899px) {
  .novelty-section .frame-title-bg { max-width: 300px; }
}
