@charset "UTF-8";

/* 旧 css/style.css から移した要素単位の基礎ルール（見た目・順序は変えていない） */

/* ==========================================================================
   アクセシビリティ＆インタラクション共通規則 (ガイドライン準拠)
   ========================================================================== */
a,
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
label[for],
select {
  cursor: pointer;
}

/* スマホ・タッチデバイスでのホバー残り対策 (@media (any-hover: hover)。マウスなどでホバーできる端末だけ) */
@media (any-hover: hover) {
  a:hover {
    opacity: 0.8;
    transition: opacity 0.25s ease;
  }

  button:hover,
  [type="submit"]:hover {
    opacity: 0.85;
    transition: opacity 0.25s ease;
  }
}

/* キーボード操作のフォーカス表示（AUDIT OP-1）：マウスでは出ない（:focus-visible のみ）。
   #555555 は白・#f9f9f9 の背景で 7:1 以上、緑（#93c572）・橙（#f7b560）の背景でも 3:1 以上。
   お問い合わせの入力欄・ボタンは、それぞれのファイルで緑の枠を指定している（詳細度が高いのでそちらが勝つ） */
:focus-visible {
  outline: 2px solid var(--color-text);
  outline-offset: 2px;
}

/* スキップリンク（AUDIT MK-1）：通常は画面の上に隠し、キーボードでフォーカスされたときだけ表示する。
   WordPress 本体の .screen-reader-text の規則には頼らず（クラスは付けない）、ここで完結させる */
.skip-link {
  position: fixed;
  top: calc(var(--admin-bar-h) + 8px);
  left: 8px;
  z-index: 400; /* ヘッダー（300）・ドロワー（290）・News ポップ（295）の上 */
  padding: 12px 20px;
  transform: translateY(-300%);
}

/* メニューを開いている間は、ヘッダー（300）以外をドロワー（290）の下にする。js/main.js が背面（スキップリンク含む）を inert にするので、フォーカスは届かない */
.is-drawer-open .skip-link {
  z-index: 280;
}

.skip-link:focus {
  font-family: var(--font-ja);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-text);
  text-decoration: none;
  background-color: var(--color-white);
  box-shadow: var(--shadow-btn);
  transform: none;
}

/* iframe のレスポンシブ対応（アスペクト比維持・はみ出し防止） */
iframe {
  max-width: 100%;
}
