@charset "utf-8";
/* ============================================================
   fureasu 採用サイト｜アクセシビリティ支援CSS（JIS X 8341-3:2016 AA 対応）
   ・スキップリンク／フォーカス表示／ランドマーク
   ・見やすい表示＝高コントラスト（html[data-a11y-hc="1"]）
   ============================================================ */

main{ display:block; }
main:focus{ outline:none; }

/* ---------- スキップリンク ---------- */
.skip-link{
  position:fixed; left:1rem; top:-10rem; z-index:1000;
  background:var(--mg); color:#fff; font-size:16px; font-weight:700;
  padding:10px 18px; border-radius:0 0 6px 6px; text-decoration:none;
}
.skip-link:focus{ top:0; outline:3px solid #fff; outline-offset:-4px; }

/* ---------- キーボードフォーカスの可視化（2.4.7） ----------
   白い輪＋紫の輪の二重にして、紫の帯の上でも白地でも見えるようにする */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, summary:focus-visible, [tabindex]:focus-visible{
  outline:3px solid var(--mg); outline-offset:3px; box-shadow:0 0 0 3px #fff;
}
.gnav a:focus-visible{ outline-offset:0; }

/* ---------- 閉じているドロワー／モーダルにTabで入らないようにする ---------- */
.drawer:not(.is-open){ visibility:hidden; transition:opacity .25s, visibility 0s .25s; }

/* ---------- ページャーの操作対象サイズ（WCAG 2.2 2.5.8: 24×24px） ---------- */
.pager a, .pager span, #se-pager a, #se-pager span{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:24px; min-height:24px;
}
.jiv__pager button{
  font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; min-width:24px; min-height:24px;
}

/* フッター最下部の小さなリンク（SPで 24px 未満だった） */
.ft__legal a{ display:inline-flex; align-items:center; min-height:24px; padding:0 .3rem; }

/* ---------- 新しいタブで開くリンクの読み上げ用注記は .sr-only（common.css）を使う ---------- */

/* ---------- 動きを減らす設定を尊重する ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *, *::before, *::after{ transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; }
}

/* ============================================================
   ツールバー（PC: ヘッダーの読み上げ案内の右／SP: ドロワー上部）
   ============================================================ */
.hd__a11y{ display:flex; align-items:center; gap:1.2rem; }
.hd__a11y .hd__note{ line-height:1.2; }
.a11y-bar{ display:flex; align-items:center; flex-wrap:wrap; gap:.4rem; }
.a11y-btn{
  font:inherit; font-size:1.1rem; font-weight:700; line-height:1; color:#333;
  background:#fff; border:1px solid #767676; border-radius:1.2rem;
  padding:0 .9rem; min-height:24px; min-width:24px; cursor:pointer; white-space:nowrap;
  display:inline-flex; align-items:center; justify-content:center; gap:.3rem;
}
.a11y-btn:hover{ border-color:var(--mg); color:var(--mg); }
/* モノクロモード（2026-09-14）: コーポレートサイトと同じ「目のアイコン＋モノクロモード OFF/ON」 */
.a11y-btn--mono::before{
  content:""; width:1.4rem; height:1.4rem; flex:none; background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5C6.5 5 2.3 8.6 1 12c1.3 3.4 5.5 7 11 7s9.7-3.6 11-7c-1.3-3.4-5.5-7-11-7zm0 11.5a4.5 4.5 0 1 1 0-9 4.5 4.5 0 0 1 0 9zm0-7a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5C6.5 5 2.3 8.6 1 12c1.3 3.4 5.5 7 11 7s9.7-3.6 11-7c-1.3-3.4-5.5-7-11-7zm0 11.5a4.5 4.5 0 1 1 0-9 4.5 4.5 0 0 1 0 9zm0-7a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5z'/%3E%3C/svg%3E") center/contain no-repeat;
}
/* html に filter を掛ける（ルート要素は position:fixed の基準にならない例外があるので、ヘッダー・固定UI・ポップアップが崩れない。body に掛けると崩れる） */
html[data-a11y-mono="1"]{ -webkit-filter:grayscale(100%); filter:grayscale(100%); }
.a11y-btn[aria-pressed="true"]{ background:var(--mg); border-color:var(--mg); color:#fff; }
.drawer__panel .a11y-bar{ margin:0 0 1.6rem; padding-bottom:1.4rem; border-bottom:.1rem solid #eee; }
.drawer__panel .a11y-btn{ font-size:1.3rem; min-height:36px; padding:0 1.2rem; }
@media (max-width:767px){
  .hd__a11y{ display:none; }
}

/* ---------- ヒーロースライドの一時停止（2.2.2） ---------- */
.hero__pause{
  position:absolute; left:1.7rem; top:calc(46% + 7.2rem); z-index:5;
  width:2.6rem; height:2.6rem; min-width:24px; min-height:24px; border-radius:50%;
  border:.15rem solid var(--mg); background:#fff; color:var(--mg); cursor:pointer;
  display:flex; align-items:center; justify-content:center; font-size:1rem; line-height:1; padding:0;
}
.hero__pause[aria-pressed="true"]{ background:var(--mg); color:#fff; }
@media (max-width:767px){
  .hero__pause{ left:1.2rem; top:auto; bottom:1.2rem; }
}

/* ============================================================
   見やすい表示（高コントラスト・ダーク配色）
   黒地に白文字・リンクは黄色＋下線・ボタンは白枠。写真はそのまま。
   ============================================================ */
html[data-a11y-hc="1"]{ background:#000; color-scheme:dark; }
html[data-a11y-hc="1"] body,
html[data-a11y-hc="1"] body *:not(img):not(picture):not(source):not(svg):not(video):not(iframe){
  background-color:#000 !important; background-image:none !important;
  color:#fff !important; border-color:#fff !important;
  box-shadow:none !important; text-shadow:none !important;
}
html[data-a11y-hc="1"] body *::before, html[data-a11y-hc="1"] body *::after{ color:#fff !important; text-shadow:none !important; }
html[data-a11y-hc="1"] a, html[data-a11y-hc="1"] a *:not(img){ color:#FFE600 !important; }
html[data-a11y-hc="1"] a{ text-decoration:underline !important; text-underline-offset:.15em; text-decoration-thickness:from-font; }
html[data-a11y-hc="1"] a:hover, html[data-a11y-hc="1"] a:focus-visible{ background-color:#333 !important; }
html[data-a11y-hc="1"] button, html[data-a11y-hc="1"] a[class*="btn"], html[data-a11y-hc="1"] .hcta, html[data-a11y-hc="1"] .fcta,   /* [class*="btn"] だと .quick__btn-em や .qsbtn__pill 等の内側の span にも枠が付くので a/button に限定（2026-09-11） */
html[data-a11y-hc="1"] .spbar a, html[data-a11y-hc="1"] .vtab, html[data-a11y-hc="1"] .quick__btn, html[data-a11y-hc="1"] .qsbtn,
html[data-a11y-hc="1"] .ft__pill, html[data-a11y-hc="1"] input, html[data-a11y-hc="1"] select, html[data-a11y-hc="1"] textarea{
  outline:2px solid #fff !important; outline-offset:-2px;
}
html[data-a11y-hc="1"] :focus-visible{ outline:3px solid #FFE600 !important; outline-offset:2px; box-shadow:0 0 0 3px #000 !important; }
html[data-a11y-hc="1"] .a11y-btn[aria-pressed="true"], html[data-a11y-hc="1"] .hero__pause[aria-pressed="true"],
html[data-a11y-hc="1"] .pager .is-active, html[data-a11y-hc="1"] .jiv__pager .is-on, html[data-a11y-hc="1"] .cat-tabs a.is-active{
  background-color:#FFE600 !important; color:#000 !important;
}
html[data-a11y-hc="1"] .skip-link:focus{ background-color:#FFE600 !important; color:#000 !important; }
/* ボーダー線などの装飾疑似要素は白に */
html[data-a11y-hc="1"] body *::before, html[data-a11y-hc="1"] body *::after{ border-color:#fff !important; }
/* 透過の写真マスク・薄い帯を黒に */
html[data-a11y-hc="1"] .hd{ border-bottom:2px solid #fff; }
html[data-a11y-hc="1"] .ft{ border-top:2px solid #fff; }
html[data-a11y-hc="1"] .acc, html[data-a11y-hc="1"] .qa, html[data-a11y-hc="1"] .kk-bcard, html[data-a11y-hc="1"] .ab-relcard,
html[data-a11y-hc="1"] .jivcard, html[data-a11y-hc="1"] .ivcard, html[data-a11y-hc="1"] .sd-apcard, html[data-a11y-hc="1"] .a11y-card,
html[data-a11y-hc="1"] .se-card, html[data-a11y-hc="1"] .news-card, html[data-a11y-hc="1"] .col-card{ outline:1px solid #fff; }
/* 見やすい表示では文字の白フチ・影・ぼかしを消す（黒地では縁取りが読みにくい） */
html[data-a11y-hc="1"] body *{ -webkit-text-stroke:0 !important; paint-order:normal !important; filter:none !important; text-shadow:none !important; }
/* 背景色で描いているアイコン類は黒地で消えるので白に（ハンバーガーの点・ヒーローのドット・チェック丸） */
html[data-a11y-hc="1"] .hd__sp-menu span, html[data-a11y-hc="1"] .hero__dots span{ background-color:#fff !important; border-color:#fff !important; }
html[data-a11y-hc="1"] .hero__dots span.is-on{ background-color:#FFE600 !important; }
html[data-a11y-hc="1"] .jwanted__box li::before{ background-color:#fff !important; }
/* 紫の筆記体（.script）・番号は黒地で沈むので白にする（ロゴは加工せず白背景を敷く: 2026-09-11 倉持さん指示）（filter:none の全体ルールより詳細度を高くして上書き） */
html[data-a11y-hc="1"] .script img, html[data-a11y-hc="1"] img[class*="sw-"], html[data-a11y-hc="1"] .jivcard__no img, html[data-a11y-hc="1"] .jpcard__no img,
html[data-a11y-hc="1"] .ivmodal__script img{ filter:brightness(0) invert(1) !important; }
/* ロゴは色を変えず、白い台座を敷いて元の色のまま見せる */
html[data-a11y-hc="1"] .hd__logo, html[data-a11y-hc="1"] .hd__sp-logo, html[data-a11y-hc="1"] .ft__logo, html[data-a11y-hc="1"] .ab-philosophy__logo{
  background-color:#fff !important; padding:.5rem .9rem; border-radius:.4rem; box-sizing:content-box;
}
html[data-a11y-hc="1"] .hd__logo *, html[data-a11y-hc="1"] .hd__sp-logo *{ color:#111 !important; background-color:#fff !important; }
/* JAPHICマークも加工せず白い台座（黒地で沈む） */
html[data-a11y-hc="1"] .ft__japhic{ background-color:#fff !important; padding:.6rem .8rem; border-radius:.4rem; display:inline-flex; gap:.8rem; align-items:center; top:auto; left:auto; }
html[data-a11y-hc="1"] .ft__japhic img{ position:static; bottom:auto; right:auto; }   /* 通常時の位置ずらしを解除して台座に収める */
/* 白抜きロゴなど白背景前提の画像を黒地で見えるようにする（必要なら個別追加） */
html[data-a11y-hc="1"] img{ background-color:transparent; }