@charset "UTF-8";
/* ============================================================
   CT生物図鑑 生物ページ共通の調整（/ex/js/ex-common.js と組みで使う）
   各ページの </head> の直前で読み込む。直したら読み込み行の ?v= を上げる。
   ============================================================ */

/* スマホで文字が自動で拡大されないように */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

@media screen and (max-width: 800px) {
  /* すばやく2回タップしたときにページが拡大されないように（ピンチでの拡大縮小はそのまま） */
  body { touch-action: manipulation; }

  /* グローバルナビが上部に固定される幅では、ナビの下からコンテンツを始める
     （ナビの高さは ex-common.js が実測して --gnav-h に入れる。
       余白だけでは下がらない要素（タイトル・切り替えボタン等）は ex-common.js が個別に下げる） */
  .lower-nav ~ #mainwrapper { padding-top: var(--gnav-h, 14vw); }
  html.gnav-measure .lower-nav ~ #mainwrapper { padding-top: 0 !important; }   /* 測定用（一瞬だけ） */
}

/* 上へ・下へのボタン：細い白線の丸。触れると CT生物図鑑の青に
   （元の矢印画像は ex-common.js がこのボタンに置き換える） */
.ct-arrow-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.6);
  background: rgba(16, 19, 22, 0.55);
  color: #fff;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.ct-arrow-btn svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ct-arrow-btn:hover,
.ct-arrow-btn:focus-visible {
  background: #0096ff;
  border-color: #0096ff;
  outline: none;
}
#nav #btn {
  margin-left: auto;
  margin-right: auto;
}