.okuyami-jump-btn {
  position: fixed !important;
  right: 16px !important;   /* 右端からの距離 */
  top: 50% !important;      /* 画面の縦中央 */
  transform: translateY(-50%) !important; /* 縦方向中央に補正 */
  z-index: 9999 !important;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 0;
  background: #8a5e9b;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
  cursor: pointer;
  transition: none !important;
  opacity: 0.9;
}

/* 上下オフセット（中央からのずれ） */
.okuyami-jump-top   { transform: translateY(calc(-50% - 34px)) !important; }
.okuyami-jump-bottom{ transform: translateY(calc(-50% + 34px)) !important; }

/* 内側ラッパー：アニメーションはここで行う */
.okuyami-jump-inner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  transition: transform .12s ease, box-shadow .12s ease;
  transform: translateY(0);
}

/* ホバー時は inner を少し上に動かす（外側の transform は変わらない） */
.okuyami-jump-btn:hover .okuyami-jump-inner {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0,0,0,.22);
}

/* クリック時の見た目 */
.okuyami-jump-btn:active .okuyami-jump-inner {
  transform: translateY(0);
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}

/* SVG */
.okuyami-jump-btn svg { width: 20px; height: 20px; pointer-events: none; }

/* モバイル調整（モバイルは幅 <= 781px） */
@media (max-width: 781px) {
  .okuyami-jump-btn { right: 12px; width: 48px; height: 48px; }
  .okuyami-jump-top  { --center: calc(-50% - 28px); }
  .okuyami-jump-bottom { --center: calc(-50% + 28px); }
}

/* デスクトップ非表示（デスクトップは幅 >= 782px） */
@media (min-width: 782px) {
  .okuyami-jump-btn { display: none !important; pointer-events: none !important; visibility: hidden !important; }
}