/* 下層ページの装飾アイコンは同梱SVGファイルを使用（Google Material Symbols / Apache-2.0）。
 * 翻訳プロキシがdata URIを書き換えるため、通常の相対画像URLを使用する。
 * 見出しの背景色を保つSVG背景と、文字色に追従するSVGマスクで描画する。
 * ライセンス: ../icons/LICENSE.txt
 */
/* =============================================================
   労働相談ページ（正本）— 写真ヘッダー版
   ・ヘッダー / フッター / 配色トークンは style.css 共通
   ・本文クラスは公開サイト用の語彙に統一
     （ui-consult-grp / ui-consult-title / site-block-table / ui-read-text 等）
     ※ WP移行時にそのまま流用できるよう、見た目だけ当CSSで再現
   コンセプト：軽い配色（淡グリーン＋白）／ナンバリング式の編集的見出し／
              ペルソナ＋吹き出しバブルの相談カラム
   ============================================================= */

.subpage {
  background: #fffdf1; /* 正本と統一 */
}

/* ---- パンくず（緑のタイトル帯の中） ---- */
.breadcrumb {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-bottom: 12px;
  color: rgba(255, 255, 255, .82);
  font-size: calc(13px * var(--fs));
  font-weight: 700;
}
.breadcrumb a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.breadcrumb a::after {
  content: ">";
  display: inline-block;
  margin-left: 10px;
  color: rgba(255, 255, 255, .55);
  text-decoration: none;
}

/* ---- ページタイトル（写真背景） ---- */
/* 画像URLだけを --pt-image で差し替え。緑グラデ（左＝文字の可読性確保）は全ページ共通 */
.page-title {
  --pt-image: url("../images/pixta_99258751.jpg");
  overflow: hidden;
  margin-bottom: 44px;
  background:
    linear-gradient(90deg, rgba(0, 80, 40, .90) 0%, rgba(0, 86, 43, .58) 42%, rgba(0, 92, 47, 0) 92%),
    var(--pt-image) center 48% / cover no-repeat,
    var(--green-900);
}
/* ページ別の見出し背景 */
.page-title.pt-labor     { --pt-image: url("../images/head_labor.webp"); }
.page-title.pt-workstyle { --pt-image: url("../images/head_workstyle.webp"); }
.page-title.pt-foreign   { --pt-image: url("../images/head_foreign.webp"); }
.page-title.pt-topics    { --pt-image: url("../images/head_topics.webp"); }
.page-title.pt-event     { --pt-image: url("../images/head_event.webp"); }
.page-title.pt-harassment{ --pt-image: url("../images/head_harassment.webp"); }
.page-title.pt-helpful   { --pt-image: url("../images/head_helpful.webp"); }
.page-title-inner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 240px;
  padding: 26px 0 30px;
  color: #fff;
}
.page-kicker {
  margin: 0 0 8px;
  color: var(--yellow);
  font-size: calc(15px * var(--fs));
  font-weight: 800;
  letter-spacing: .08em;
}
.page-title h1 {
  margin: 0;
  font-size: clamp(30px, 4.2vw, 46px);
  line-height: 1.2;
  letter-spacing: .03em;
}

.entry-content {
  padding-bottom: 80px;
}

/* ---- リード：背景なし・明朝体でタイポグラフィを際立たせる ---- */
.ui-read-text {
  margin: 4px 0 42px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--green-900);
  font-family: var(--font-sans, "Noto Sans JP", sans-serif);
  font-size: calc(clamp(20px, 2.4vw, 29px) * var(--fs));
  font-weight: 600;
  line-height: 1.9;
  letter-spacing: .02em;
  text-align: center;
}

/* WP標準の中央寄せ（バナー画像・CTA等） */
.entry-content .site-text-align-center { text-align: center; }
.entry-content > .site-text-align-center img { margin-inline: auto; }

/* ---- 相談カラム：ペルソナ＋吹き出しバブル（軽い） ---- */
.ui-consult-list-colmns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  margin-bottom: 46px;
}
.ui-consult-list-colmn {
  padding: 26px 24px 28px;
  border: 1px solid var(--c-line, var(--line-soft));
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 90, 45, .04);
}
/* 労働者＝オレンジ／使用者＝ブルー で色分け
   --c=装飾用（鮮やか）／--c-text=テキスト用（AA準拠の濃いめ） */
.ui-consult-list-colmns .ui-consult-list-colmn:nth-of-type(1) { --c: #ef9f1a; --c-soft: #fff3da; --c-line: #f2d8a0; --c-text: #b45309; }
.ui-consult-list-colmns .ui-consult-list-colmn:nth-of-type(2) { --c: #0f86c9; --c-soft: #e4f1fb; --c-line: #bcdaf0; --c-text: #0c6aa0; }

.ui-consult-list-colmn h2 {
  display: flex;
  align-items: center;
  gap: 13px;
  margin: 0 0 18px;
  padding-bottom: 16px;
  border-bottom: 2px dotted var(--c-line);
  color: var(--c-text);
  font-size: calc(19px * var(--fs));
  letter-spacing: .02em;
}
.ui-consult-list-colmn h2::before {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  background: var(--c-soft);
  color: var(--c);
  font-size: calc(26px * var(--fs));
  font-weight: normal;
}
.ui-consult-list-colmns .ui-consult-list-colmn:nth-of-type(1) h2::before { content: ""; 
  background-image: url("../icons/material/person-ef9f1a.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
.ui-consult-list-colmns .ui-consult-list-colmn:nth-of-type(2) h2::before { content: ""; 
  background-image: url("../icons/material/business_center-0f86c9.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}

.ui-consult-list-colmn ul {
  display: grid;
  gap: 11px;
  margin: 0;
  padding: 0;
  list-style: none;
}
/* 質問を吹き出しバブルに */
.ui-consult-list-colmn li {
  position: relative;
  margin-left: 8px;
  padding: 12px 16px;
  border-radius: 14px;
  background: var(--c-soft);
  border: 1px solid var(--c-line);
  color: #2b3a2d;
  font-size: calc(14.5px * var(--fs));
  font-weight: 600;
  line-height: 1.65;
}
/* 吹き出しの“しっぽ” */
.ui-consult-list-colmn li::before {
  content: "";
  position: absolute;
  left: -7px;
  top: 50%;
  width: 12px;
  height: 12px;
  background: var(--c-soft);
  border-left: 1px solid var(--c-line);
  border-bottom: 1px solid var(--c-line);
  transform: translateY(-50%) rotate(45deg);
}

/* ---- 本文：連続した白パネル＋ナンバリング式の編集的見出し ---- */
.ui-consult-body {
  counter-reset: secnum;
  overflow: hidden;
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0, 90, 45, .05);
}
.ui-consult-grp {
  padding: 30px 34px;
  /* 見出しのアクセントは 04 の色（ティール）で全セクション統一
     --accent=装飾用／--accent-text=テキスト用（AA準拠の濃いめ） */
  --accent: #079e89;
  --accent-soft: #daf2ee;
  --accent-text: #05675a;
}

/* メニューの下層リンク等のアンカー先：固定ヘッダーに隠れないようオフセット
   （JS無効時のフォールバック。通常は site.js が実ヘッダー高さで補正） */
.ui-consult-grp[id],
.ui-consult-block-title[id] { scroll-margin-top: 162px; }
@media (max-width: 980px) {
  .ui-consult-grp[id],
  .ui-consult-block-title[id] { scroll-margin-top: 88px; }
}

/* ナンバリング見出し（淡い番号チップ＋細い下線・軽い） */
.ui-consult-grp h2 {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 22px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
  color: var(--green-900);
  font-size: calc(clamp(20px, 2.1vw, 26px) * var(--fs));
  line-height: 1.4;
}
.ui-consult-grp h2 {
  border-bottom-color: var(--accent);
}
.ui-consult-grp h2::before {
  content: "";
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: var(--accent-soft);
  color: var(--accent-text);
  font-size: calc(27px * var(--fs));
  font-weight: normal;

  background-image: var(--sec-icon, url("../icons/material/label-05675a.svg"));
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}

/* セクションごとのアイコン（内容に合わせて割当・id基準で3ページ共通管理）
   ※ WPでセクション(Groupブロック)に同じid（高度な設定＞HTMLアンカー）を付ければ自動で対応アイコンに */
#ui-consult-consultation { --sec-icon: url("../icons/material/support_agent-05675a.svg"); }     /* 相談窓口・電話/対面相談 */
#ui-consult-online       { --sec-icon: url("../icons/material/videocam-05675a.svg"); }          /* オンライン相談 */
#ui-consult-mail         { --sec-icon: url("../icons/material/mail-05675a.svg"); }              /* メール相談 */
#ui-consult-solution     { --sec-icon: url("../icons/material/handshake-05675a.svg"); }         /* 個別労使紛争解決支援 */
#ui-consult-mental       { --sec-icon: url("../icons/material/psychology-05675a.svg"); }        /* メンタルヘルス */
#ui-consult-global       { --sec-icon: url("../icons/material/translate-05675a.svg"); }         /* 外国語通訳相談 */
#ui-consult-workrule     { --sec-icon: url("../icons/material/menu_book-05675a.svg"); }         /* ワークルール冊子 */
#ui-consult-ukraine      { --sec-icon: url("../icons/material/volunteer_activism-05675a.svg"); }/* ウクライナ避難民支援 */
#ui-consult-news         { --sec-icon: url("../icons/material/campaign-05675a.svg"); }          /* 新着情報 */
#ui-consult-hyogo        { --sec-icon: url("../icons/material/edit_note-05675a.svg"); }         /* 標語募集 */
#ui-consult-about        { --sec-icon: url("../icons/material/help-05675a.svg"); }              /* ハラスメントって? */
#ui-consult-poster       { --sec-icon: url("../icons/material/imagesmode-05675a.svg"); }        /* ポスター・啓発物 */
#ui-consult-other        { --sec-icon: url("../icons/material/more_horiz-05675a.svg"); }        /* その他の取組み */
#ui-consult-entry        { --sec-icon: url("../icons/material/lightbulb-05675a.svg"); }         /* 応募内容（標語） */
#ui-consult-theme        { --sec-icon: url("../icons/material/category-05675a.svg"); }          /* 応募テーマ */
#ui-consult-guideline    { --sec-icon: url("../icons/material/assignment-05675a.svg"); }        /* 応募要項 */
#ui-consult-contact      { --sec-icon: url("../icons/material/call-05675a.svg"); }              /* 問合せ先 */
#ui-consult-attractive   { --sec-icon: url("../icons/material/rocket_launch-05675a.svg"); }     /* 魅力ある企業づくり */
#ui-consult-support      { --sec-icon: url("../icons/material/groups-05675a.svg"); }            /* 職場環境づくり支援 */
#ui-consult-worries      { --sec-icon: url("../icons/material/quiz-05675a.svg"); }              /* こんなお悩み */
#ui-consult-cases        { --sec-icon: url("../icons/material/fact_check-05675a.svg"); }        /* 取組み事例 */
#ui-consult-telework     { --sec-icon: url("../icons/material/home_work-05675a.svg"); }         /* テレワークとは */
#ui-consult-faq          { --sec-icon: url("../icons/material/forum-05675a.svg"); }             /* テレワークFAQ */
#ui-consult-leaflet      { --sec-icon: url("../icons/material/menu_book-05675a.svg"); }         /* 啓発冊子・リーフレット */
#ui-consult-hara-info    { --sec-icon: url("../icons/material/report-05675a.svg"); }            /* ハラスメントについて */
#ui-consult-dispatch     { --sec-icon: url("../icons/material/co_present-05675a.svg"); }        /* 講師派遣 */
#ui-consult-contact-tw   { --sec-icon: url("../icons/material/call-05675a.svg"); }              /* 問合せ先（テレワーク） */

/* ---- ページ内の2大ブロック大見出し（働き方改革／テレワーク） ----
   .ui-consult-body の中を .ui-consult-block で2つに分け、各ブロックの先頭に
   .ui-consult-block-title（h2）を置く。ブロックごとに白パネルを分け、間を余白で
   区切る（背景は2ブロックの境界で一旦途切れさせてよい）。各ブロック内では
   セクションを連続させ、区切りは見出し＋細い罫線のみ。
   ※ WPでは Group ブロックに id を付ければ自動でアイコンが当たる。 */
/* このページは外側パネル（.ui-consult-body）を透明にし、ブロックごとに白パネル化。
   他ページ（単一パネル構成）には影響させない。 */
.ui-consult-body:has(.ui-consult-block) {
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  overflow: visible;
}
.ui-consult-block {
  overflow: hidden;
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0, 90, 45, .05);
}
.ui-consult-block + .ui-consult-block {
  margin-top: 26px;
}
.ui-consult-block-title {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  padding: 34px 34px 0;
  color: var(--green-900);
  font-size: calc(clamp(22px, 2.7vw, 30px) * var(--fs));
  font-weight: 800;
  line-height: 1.4;
}
.ui-consult-block-title::before {
  content: "";
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 54px;
  height: 54px;
  border-radius: 14px;
  background: #079e89;
  color: #fff;
  font-size: calc(30px * var(--fs));
  font-weight: normal;

  background-image: var(--block-icon, url("../icons/material/label-fff.svg"));
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
#ui-consult-block-reform   { --block-icon: url("../icons/material/diversity_3-fff.svg"); }   /* 働き方改革ブロック */
#ui-consult-block-telework { --block-icon: url("../icons/material/devices-fff.svg"); }       /* テレワークブロック */

/* 問合せ先テーブル（本番準拠＝1セルにラベル＋電話番号） */
.ui-improvement-tbl td strong { font-size: calc(19px * var(--fs)); letter-spacing: .02em; white-space: nowrap; }
.ui-improvement-tbl-note { margin: 10px 0 0; font-size: calc(14px * var(--fs)); color: #5a6b5e; line-height: 1.7; }

/* ブロック大見出し直下のスローガン（中央キャッチ） */
.ui-consult-block-lead {
  margin: 0;
  padding: 20px 34px 0;
  text-align: center;
  color: var(--green-900);
  font-size: calc(clamp(17px, 1.95vw, 22px) * var(--fs));
  font-weight: 700;
  line-height: 1.75;
  letter-spacing: .02em;
}

/* 見出しに番号が書かれているセクション（.ui-sec-num）は、
   アイコンの代わりに連番数字をチップに表示。.ui-sec-num だけ採番するので
   番号なしセクション（アイコン表示）を飛ばして 1,2,3… と正しく振られる */
.ui-consult-grp.ui-sec-num { counter-increment: secnum; }
.ui-consult-grp.ui-sec-num h2::before {
  content: counter(secnum);
  font-family: var(--font-sans, "Noto Sans JP", sans-serif);
  font-variation-settings: normal;
  font-weight: 800;
  font-size: calc(22px * var(--fs));
  letter-spacing: .04em;

  background-image: none;
}

/* 小見出し：左アクセントバー（細め・軽い） */
.ui-consult-grp h3,
.ui-consult-grp h4 {
  margin: 28px 0 12px;
  padding-left: 13px;
  border-left: 4px solid var(--accent);
  color: var(--green-900);
  font-size: calc(18px * var(--fs));
  line-height: 1.5;
}

.ui-consult-grp p {
  margin: 0 0 16px;
  line-height: 1.8;
}
.ui-consult-grp strong {
  font-weight: 800;
}
/* 黄色マーカー（既存サイトの ystdb-inline--1 相当）。
   本番サイトがマーカーを使っている箇所だけに .ui-marker を付与する。 */
.ui-consult-grp .ui-marker {
  background: linear-gradient(transparent 58%, rgba(255, 230, 102, .95) 58%);
}
.ui-consult-grp a {
  color: var(--blue);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 4px;
  transition: color .15s ease;
}
.ui-consult-grp a:hover {
  color: #005e96;
}

/* =============================================================
   本文リンクのアイコン自動付与
   ・WP本番で初心者がリンクを貼るだけで、URLから自動で種別判定→アイコン表示
   ・外部リンク（http始まり／自サイト以外）＝ open_in_new
   ・PDF/Word/Excel/PowerPoint/ZIP＝拡張子で判定（内部・外部問わず付与）
   ・ファイルリンクはファイルアイコンを優先（外部アイコンは付けない）
   ・本番ドメイン roudou-soudan-center.pref.osaka.lg.jp は内部扱い＝除外
   ============================================================= */
.entry-content a[href^="http"]:not([href*="roudou-soudan-center.pref.osaka.lg.jp"]):not([href$=".pdf" i]):not([href$=".doc" i]):not([href$=".docx" i]):not([href$=".xls" i]):not([href$=".xlsx" i]):not([href$=".ppt" i]):not([href$=".pptx" i]):not([href$=".zip" i])::after,
.entry-content a[href$=".pdf" i]::after,
.entry-content a[href$=".doc" i]::after,
.entry-content a[href$=".docx" i]::after,
.entry-content a[href$=".xls" i]::after,
.entry-content a[href$=".xlsx" i]::after,
.entry-content a[href$=".ppt" i]::after,
.entry-content a[href$=".pptx" i]::after,
.entry-content a[href$=".zip" i]::after {
  font-weight: normal;
  font-style: normal;
  font-size: 1.05em;
  line-height: 1;
  vertical-align: -0.18em;
  margin-left: .25em;
  display: inline-block;
  text-decoration: none;
}
/* 外部リンク（ファイル以外） */
.entry-content a[href^="http"]:not([href*="roudou-soudan-center.pref.osaka.lg.jp"]):not([href$=".pdf" i]):not([href$=".doc" i]):not([href$=".docx" i]):not([href$=".xls" i]):not([href$=".xlsx" i]):not([href$=".ppt" i]):not([href$=".pptx" i]):not([href$=".zip" i])::after {
  content: "";

  display: inline-block;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: url("../icons/material/open_in_new-000.svg") center / contain no-repeat;
  mask: url("../icons/material/open_in_new-000.svg") center / contain no-repeat;
}
/* ファイル種別 */
.entry-content a[href$=".pdf" i]::after  { content: ""; 
  display: inline-block;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: url("../icons/material/picture_as_pdf-000.svg") center / contain no-repeat;
  mask: url("../icons/material/picture_as_pdf-000.svg") center / contain no-repeat;
}
.entry-content a[href$=".doc" i]::after,
.entry-content a[href$=".docx" i]::after { content: ""; 
  display: inline-block;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: url("../icons/material/description-000.svg") center / contain no-repeat;
  mask: url("../icons/material/description-000.svg") center / contain no-repeat;
}
.entry-content a[href$=".xls" i]::after,
.entry-content a[href$=".xlsx" i]::after { content: ""; 
  display: inline-block;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: url("../icons/material/table_chart-000.svg") center / contain no-repeat;
  mask: url("../icons/material/table_chart-000.svg") center / contain no-repeat;
}
.entry-content a[href$=".ppt" i]::after,
.entry-content a[href$=".pptx" i]::after { content: ""; 
  display: inline-block;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: url("../icons/material/co_present-000.svg") center / contain no-repeat;
  mask: url("../icons/material/co_present-000.svg") center / contain no-repeat;
}
.entry-content a[href$=".zip" i]::after  { content: ""; 
  display: inline-block;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: url("../icons/material/folder_zip-000.svg") center / contain no-repeat;
  mask: url("../icons/material/folder_zip-000.svg") center / contain no-repeat;
}
/* 画像を内包するリンク（バナー等）にはアイコンを付けない
   ※ファイル/外部の各ルールより特異度が低いので !important で確実に抑制 */
.entry-content a:has(img)::after { content: none !important; }

.site-font-size-medium { font-size: calc(17px * var(--fs)); }
.larger { font-size: calc(18px * var(--fs)); font-weight: 700; }
/* リスト内の補足注記 */
.entry-content .ui-note { display: block; margin-top: 2px; font-size: .88em; font-weight: 400; color: #5a6b5e; }

/* 画像ブロック（figure の既定マージン消し） */
.ui-consult-grp .site-block-image { margin: 0 0 16px; }
.ui-consult-grp .site-block-image img { max-width: 100%; height: auto; }
.ui-consult-grp .site-block-image p { margin: 0 0 8px; font-weight: 700; }

/* WPのalignleft/alignright＝本文に画像を回り込み（編集者は画像の配置を選ぶだけ）
   写真は角丸＋3:2でトリミングし、本文の横にすっきり収める。 */
.ui-consult-grp .site-block-image.alignright,
.ui-consult-grp .site-block-image.alignleft {
  max-width: 42%;
  margin-top: 4px;
  margin-bottom: 10px;
}
.ui-consult-grp .site-block-image.alignright { float: right; margin-left: 28px; }
.ui-consult-grp .site-block-image.alignleft  { float: left;  margin-right: 28px; }
.ui-consult-grp .site-block-image.alignright img,
.ui-consult-grp .site-block-image.alignleft img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0, 90, 45, .06);
}
/* 各セクションでフロートを内包（次セクションや罫線への回り込み防止） */
.ui-consult-grp::after { content: ""; display: block; clear: both; }

/* セクション内カラム（ポスター・ステッカー等）はPCで横並び
   ※ペルソナ2カラム(.ui-consult-list-colmns)はセクション外なので非干渉 */
.ui-consult-grp .site-block-columns {
  display: flex;
  gap: 22px;
  align-items: flex-start;
  margin: 0 0 16px;
}
.ui-consult-grp .site-block-column {
  flex: 1 1 0;
  min-width: 0;
}
.ui-consult-grp .site-block-column .site-block-image img { width: 100%; }

/* 固定ページの動画ブロック。公開側のクラス名に対応。 */
.ui-consult-grp :is(.site-block-embed, .site-core-block-embed).is-type-video {
  margin: 0 0 16px;
  min-width: 0;
}
.ui-consult-grp :is(.site-block-embed, .site-core-block-embed).is-type-video
  :is(.site-block-embed__wrapper, .site-core-block-embed__wrapper) {
  min-width: 0;
  overflow-wrap: anywhere;
}
/* 動画の比率確保用疑似要素と二重に高さを取らない。 */
.ui-consult-grp :is(.site-block-embed, .site-core-block-embed).is-type-video
  :is(.site-block-embed__wrapper, .site-core-block-embed__wrapper):has(iframe)::before {
  content: none;
}
.ui-consult-grp :is(.site-block-embed, .site-core-block-embed).is-type-video iframe {
  position: static;
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border: 0;
}
.ui-consult-grp :is(.site-block-embed, .site-core-block-embed).site-core-embed-aspect-4-3 iframe {
  aspect-ratio: 4 / 3;
}

/* 標語投票ページだけに適用。既存のハラスメントページには影響させない。 */
.ui-vote-page .ui-vote-banner {
  margin: 0 auto 32px;
  max-width: 1024px;
}
.ui-vote-page .ui-vote-banner img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}
.ui-vote-page .ui-vote-works {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
.ui-vote-page .ui-vote-works img {
  display: block;
  margin-inline: auto;
  height: auto;
}
.ui-vote-page .ui-consult-grp p {
  overflow-wrap: anywhere;
}
@media (max-width: 640px) {
  .ui-vote-page .ui-vote-works {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }
  .ui-vote-page .ui-vote-works .site-block-column .site-block-image img {
    max-width: 100%;
  }
}

/* ---- テレワークQ&A：チャット風カード（アイコン画像を使わずCSSでQ/Aバッジ） ---- */
.ui-telework-faq {
  display: grid;
  gap: 22px;
  margin-top: 4px;
}
.ui-telework-faq-pair {
  display: grid;
  gap: 10px;
}
.ui-telework-faq-q,
.ui-telework-faq-a {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 15px 18px;
  border-radius: 16px;
  line-height: 1.7;
}
/* Q / A の丸バッジ（CSSで生成） */
.ui-telework-faq-q::before,
.ui-telework-faq-a::before {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  color: #fff;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: calc(19px * var(--fs));
  font-weight: 700;
  line-height: 1;
}
/* 質問：淡イエロー／オレンジのQバッジ */
.ui-telework-faq-q {
  background: #fff8e2;
  border: 1px solid #f1e0a3;
  box-shadow: 0 1px 3px rgba(150, 120, 0, .06);
}
.ui-telework-faq-q::before { content: "Q"; background: #e0a200; }
/* 回答：淡グリーン／ティールのAバッジ・少し右に寄せて返信感 */
.ui-telework-faq-a {
  margin-left: 26px;
  background: #ebf7ee;
  border: 1px solid #c6e6cd;
  box-shadow: 0 1px 3px rgba(0, 90, 45, .05);
}
.ui-telework-faq-a::before { content: "A"; background: var(--accent, #079e89); }
/* 吹き出し内のテキスト（pのデフォルト余白を打ち消し） */
.ui-telework-faq-text {
  margin: 0;
  padding-top: 6px;
}
.ui-telework-faq-q .ui-telework-faq-text { color: var(--green-900); }

/* ---- 「こんなお悩み」3カテゴリー：アイコンバッジ付きカード＋チェックリスト ---- */
.ui-consult-grp .ui-improvement-lists-columns { align-items: stretch; gap: 18px; }
.ui-improvement-lists-column {
  --cat: #079e89;
  --cat-soft: #def1ec;
  --cat-bg: #f1faf7;
  padding: 24px 22px 22px;
  border: 1px solid var(--cat-soft);
  border-radius: 14px;
  background: var(--cat-bg);
}
.ui-improvement-lists-column:nth-of-type(1) { --cat: #079e89; --cat-soft: #d3ece5; --cat-bg: #f1faf7; }
.ui-improvement-lists-column:nth-of-type(2) { --cat: #d68a0a; --cat-soft: #f1e2bd; --cat-bg: #fdf8ef; }
.ui-improvement-lists-column:nth-of-type(3) { --cat: #0f86c9; --cat-soft: #cce2f2; --cat-bg: #f1f8fc; }

/* カテゴリー見出し（アイコンバッジ＋タイトル／既定の左バーは打ち消し） */
.ui-improvement-lists-column > h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
  padding: 0 0 14px;
  border: 0;
  border-bottom: 1px solid var(--cat);
  color: var(--cat);
  font-size: calc(18px * var(--fs));
}
.ui-improvement-lists-column > h3::before {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: var(--cat-soft);
  color: var(--cat);
  font-size: calc(24px * var(--fs));
}
.ui-improvement-lists-column:nth-of-type(1) > h3::before { content: ""; 
  background-image: url("../icons/material/rule-079e89.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
.ui-improvement-lists-column:nth-of-type(2) > h3::before { content: ""; 
  background-image: url("../icons/material/person_add-d68a0a.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
.ui-improvement-lists-column:nth-of-type(3) > h3::before { content: ""; 
  background-image: url("../icons/material/verified_user-0f86c9.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}

/* チェックマーカー付きリスト */
.ui-improvement-lists-column ul {
  display: grid;
  gap: 11px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ui-improvement-lists-column li {
  position: relative;
  padding-left: 28px;
  font-size: calc(15px * var(--fs));
  line-height: 1.6;
}
.ui-improvement-lists-column li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1px;
  color: var(--cat);
  font-size: calc(19px * var(--fs));

  display: inline-block;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: url("../icons/material/check_circle-000.svg") center / contain no-repeat;
  mask: url("../icons/material/check_circle-000.svg") center / contain no-repeat;
}

/* ---- 表：軽い淡グリーン＋緑の左アクセント ---- */
.site-block-table {
  margin: 0;
  overflow: hidden;
  border: 1px solid #d9e8ca;
  border-radius: 10px;
  background: #fff;
}
.site-block-table table {
  width: 100%;
  border-collapse: collapse;
}
.site-block-table th,
.site-block-table td {
  padding: 15px 18px;
  border-bottom: 1px solid #d9e8ca;
  vertical-align: top;
  text-align: left;
  line-height: 1.8;
}
.site-block-table tr:last-child th,
.site-block-table tr:last-child td {
  border-bottom: 0;
}
.site-block-table th {
  width: 30%;
  background: #fcfff6;
  color: var(--green-900);
  font-weight: 800;
}
.site-block-table thead th {
  width: auto;
  color: #fff;
  background: var(--green-800);
}

/* ---- セミナー・イベント一覧（登録イベントのカード出力） ---- */
.ui-event-list {
  display: grid;
  gap: 18px;
}
.ui-event-list .is-card {
  position: relative;
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0, 90, 45, .05);
  padding: 22px 24px;
  transition: box-shadow .2s ease, transform .2s ease;
}
/* 受付状況バッジ（カード右上） */
.ui-el-status {
  position: absolute;
  top: 0;
  right: 0;
  padding: 6px 18px;
  border-radius: 0 14px 0 14px;
  font-size: calc(13px * var(--fs));
  font-weight: 800;
  letter-spacing: .08em;
  color: #fff;
  background: var(--green-700, #0a8a52);
}
.ui-event-list .is-card:hover {
  box-shadow: 0 6px 18px rgba(0, 90, 45, .12);
  transform: translateY(-2px);
}
.ui-el-header {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 14px;
}
.ui-el-date-label {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 76px;
  padding: 9px 6px;
  border-radius: 12px;
  background: var(--green-800);
  color: #fff;
  line-height: 1.1;
}
.ui-el-date { margin: 0; font-family: "Helvetica Neue", Arial, sans-serif; font-size: calc(23px * var(--fs)); font-weight: 700; }
.ui-el-week-day { margin: 3px 0 0; font-family: "Helvetica Neue", Arial, sans-serif; font-size: calc(12px * var(--fs)); font-weight: 700; letter-spacing: .1em; opacity: .9; }
.ui-el-title { align-self: center; }
.ui-el-title h2 { margin: 0; font-size: calc(19px * var(--fs)); line-height: 1.5; color: var(--green-900); }
.ui-el-title h2 a { color: inherit; text-decoration: none; }
.ui-el-title h2 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ui-el-desc { margin: 0 0 14px; line-height: 1.8; color: #3a4a3d; }
.ui-el-info-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 18px;
  font-size: calc(15px * var(--fs));
}
.ui-el-info-table th,
.ui-el-info-table td {
  padding: 9px 13px;
  border: 1px solid #e3eed6;
  text-align: left;
  vertical-align: top;
  line-height: 1.7;
}
.ui-el-info-table th {
  width: 22%;
  white-space: nowrap;
  background: #f3f9e8;
  color: var(--green-900);
  font-weight: 700;
}
.ui-el-btn-more {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 9px 14px 9px 22px;
  border-radius: 999px;
  background: var(--green-800);
  color: #fff;
  font-weight: 700;
  font-size: calc(15px * var(--fs));
  text-decoration: none;
}
.ui-el-btn-more:hover { background: var(--green-900); color: #fff; }
.ui-el-btn-more::after {
  content: "";
  font-size: calc(20px * var(--fs));

  display: inline-block;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: url("../icons/material/chevron_right-000.svg") center / contain no-repeat;
  mask: url("../icons/material/chevron_right-000.svg") center / contain no-repeat;
}
/* ===== 終了したイベント：はっきり「終了」と分かるようにグレーアウト＋クリック不可 ===== */
.ui-event-list .is-card.tag-end {
  background: #f3f4f2;
  border-color: #e0e3de;
}
.ui-event-list .is-card.tag-end:hover {
  box-shadow: 0 2px 10px rgba(0, 90, 45, .05);
  transform: none;            /* ホバーの浮き上がりを無効化 */
}
.ui-event-list .is-card.tag-end .ui-el-status { background: #8a938c; }
.ui-event-list .is-card.tag-end .ui-el-date-label { background: #a7afa8; }
/* 文字を全体的に淡く */
.ui-event-list .is-card.tag-end .ui-el-title h2,
.ui-event-list .is-card.tag-end .ui-el-desc,
.ui-event-list .is-card.tag-end .ui-el-info-table td { color: #828a82; }
.ui-event-list .is-card.tag-end .ui-el-info-table th { background: #eaece7; color: #757d75; }
.ui-event-list .is-card.tag-end .ui-el-info-table th,
.ui-event-list .is-card.tag-end .ui-el-info-table td { border-color: #e4e7e1; }
/* リンクは全てクリック不可・装飾も無効化 */
.ui-event-list .is-card.tag-end a {
  pointer-events: none;
  color: inherit;
  text-decoration: none;
  cursor: default;
}
/* 終了カードの外部リンクアイコンも消す */
.ui-event-list .is-card.tag-end a::after { content: none !important; }
/* 「受付を終了しました」ボタン（クリック不可表示） */
.ui-el-btn-more.is-ended {
  background: #aab1a9;
  cursor: default;
  pointer-events: none;
}
.ui-el-btn-more.is-ended::after {
  content: "";
  font-variation-settings: "wght" 500;

  display: inline-block;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: url("../icons/material/block-000.svg") center / contain no-repeat;
  mask: url("../icons/material/block-000.svg") center / contain no-repeat;
}

/* ---- トピックス（お知らせ一覧：登録投稿を新着順に出力） ---- */
.ui-topics-list {
  overflow: hidden;
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0, 90, 45, .05);
}
.ui-topics-item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 26px;
  padding: 26px 46px 26px 30px;
  border-bottom: 1px solid #e7f0db;
  color: inherit;
  text-decoration: none;
  transition: background .15s ease;
}
.ui-topics-item:last-child { border-bottom: 0; }
.ui-topics-item:hover { background: #f5faec; }
.ui-topics-date {
  flex: 0 0 auto;
  white-space: nowrap;
  color: #05675a;
  font-weight: 700;
  font-size: calc(15px * var(--fs));
  line-height: 1.65;
  letter-spacing: .02em;
}
.ui-topics-body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.ui-topics-title {
  color: var(--green-900);
  font-weight: 600;
  line-height: 1.6;
}
.ui-topics-item:hover .ui-topics-title { text-decoration: underline; text-underline-offset: 3px; }
.ui-topics-excerpt {
  color: #5a6b5e;
  font-size: calc(14px * var(--fs));
  line-height: 1.75;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ui-topics-item::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #079e89;
  font-size: calc(22px * var(--fs));

  display: inline-block;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: url("../icons/material/chevron_right-000.svg") center / contain no-repeat;
  mask: url("../icons/material/chevron_right-000.svg") center / contain no-repeat;
}

/* ---- 記事詳細（編集しやすいプレーン本文＋お知らせサイドバー） ---- */
.page-title.is-article .page-title-inner { min-height: 200px; }
.page-title.is-article h1 { font-size: clamp(21px, 2.5vw, 30px); line-height: 1.45; }

/* 2カラム：本文＋サイドバー */
.ui-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 290px;
  gap: 40px;
  align-items: start;
}

/* 画像の固有幅や改行のないURLで、記事カラムが画面幅を超えないようにする。 */
.ui-detail-main,
.ui-detail-side {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* 本文・サイドバーは白背景パネル（中身のHTMLはプレーンなまま） */
.ui-detail-main {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0, 90, 45, .05);
  padding: 36px 40px 40px;
}
.ui-detail-side {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0, 90, 45, .05);
  padding: 24px 24px 28px;
}

/* 本文：装飾なし・プレーン（WPでは本文だけ差し替えればよい） */
.ui-detail-main .ui-detail-title {
  margin: 0 0 10px;
  color: var(--green-900);
  font-size: calc(clamp(20px, 2.4vw, 27px) * var(--fs));
  line-height: 1.5;
}
.ui-detail-main .article-date { margin: 0 0 20px; color: #5a6b5e; font-weight: 700; font-size: calc(14px * var(--fs)); }
.ui-detail-main p { margin: 0 0 18px; line-height: 1.95; }
.ui-detail-main a { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
/* 移行したイベント本文の画像・ギャラリーを本文幅の中に収める。
   公開側ではWP標準ブロックCSSを外しているため、テーマ側でレスポンシブ化する。 */
.ui-detail-main img {
  display: block;
  max-width: 100%;
  height: auto;
}
.ui-detail-main figure {
  min-width: 0;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}
.ui-detail-main .site-block-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: 18px;
  margin: 0 0 24px;
  padding: 0;
}
.ui-detail-main .site-block-gallery .site-block-image {
  min-width: 0;
  margin: 0;
}
.ui-detail-main .site-block-gallery .site-block-image img {
  width: 100%;
}
/* 埋め込み動画は貼るだけで自動的に横幅100%・16:9レスポンシブに
   （YouTube等のiframe／埋め込み要素の両方に対応） */
.ui-detail-main iframe,
.ui-detail-main video,
.ui-detail-main .site-block-embed__wrapper iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  margin: 6px 0 22px;
  border: 0;
}
.ui-detail-main .site-block-embed { margin: 6px 0 22px; }
.ui-detail-main .site-block-embed,
.ui-detail-main .site-block-embed__wrapper {
  min-width: 0;
  max-width: 100%;
}
.ui-detail-main pre {
  max-width: 100%;
  overflow-x: auto;
}
.ui-detail-main .site-block-embed iframe { margin: 0; }
.ui-detail-main .ui-detail-back { display: inline-block; margin-top: 18px; color: var(--green-800); font-weight: 700; text-decoration: none; }
.ui-detail-main .ui-detail-back:hover { text-decoration: underline; text-underline-offset: 3px; }

/* サイドバー：お知らせ一覧 */
.ui-side-title {
  margin: 0 0 4px;
  padding: 0 0 10px;
  border-bottom: 2px solid var(--green-800);
  color: var(--green-900);
  font-size: calc(17px * var(--fs));
}
.ui-side-list { margin: 0; padding: 0; list-style: none; }
.ui-side-list li { border-bottom: 1px solid var(--line); }
.ui-side-list a { display: block; padding: 12px 2px; color: inherit; text-decoration: none; }
.ui-side-list a:hover .ui-side-ttl { color: var(--green-800); text-decoration: underline; text-underline-offset: 3px; }
.ui-side-date { display: block; margin-bottom: 3px; color: #05675a; font-weight: 700; font-size: calc(12px * var(--fs)); }
.ui-side-ttl {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: calc(14px * var(--fs));
  line-height: 1.55;
  color: var(--text);
}
.ui-side-more { display: inline-block; margin-top: 14px; color: var(--green-800); font-weight: 700; font-size: calc(14px * var(--fs)); }

@media (max-width: 900px) {
  .ui-consult-list-colmns {
    grid-template-columns: 1fr;
  }
  /* 記事詳細：本文とサイドバーを縦並びに */
  .ui-detail-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 34px;
  }
}

/* ---- SP：表を縦並びカードに（横スクロール廃止・軽い見出し） ---- */
@media (max-width: 768px) {
  .site-block-table {
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
  .site-block-table table { display: block; width: 100%; }
  .site-block-table thead { display: none; }
  .site-block-table tbody { display: block; }
  .site-block-table tr {
    display: block;
    margin-bottom: 14px;
    border: 1px solid #d9e8ca;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
  }
  .site-block-table tr:last-child { margin-bottom: 0; }
  .site-block-table th,
  .site-block-table td { display: block; width: 100%; border-bottom: 0; }
  .site-block-table th {
    padding: 10px 16px;
    background: #eef6df;
    color: var(--green-900);
    font-size: .95em;
  }
  .site-block-table th:empty { display: none; }
  .site-block-table td { padding: 13px 16px; line-height: 1.75; }
  .site-block-table td + td { border-top: 1px solid #eef0e6; }
  .site-block-table td[data-label]::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 6px;
    padding-bottom: 6px;
    border-bottom: 1px dashed #cfe2b4;
    color: var(--green-900);
    font-weight: 800;
    font-size: .9em;
  }
}

@media (max-width: 640px) {
  .page-title {
    margin-bottom: 26px;
    background:
      linear-gradient(90deg, rgba(0, 80, 40, .92) 0%, rgba(0, 86, 43, .66) 55%, rgba(0, 92, 47, 0) 100%),
      var(--pt-image) center 48% / cover no-repeat,
      var(--green-900);
  }
  .page-title-inner,
  .entry-content {
    width: min(calc(100% - 28px), var(--container));
  }
  .page-title-inner {
    min-height: 150px;
    padding: 18px 0 22px;
  }
  .breadcrumb {
    margin-bottom: 8px;
    font-size: calc(12px * var(--fs));
  }
  .page-title h1 { font-size: calc(29px * var(--fs)); }

  .entry-content { padding-bottom: 48px; }

  .ui-read-text {
    margin-bottom: 30px;
    padding: 0;
    font-size: calc(19px * var(--fs));
    line-height: 1.85;
  }
  .ui-read-text br { display: none; }

  .ui-consult-list-colmns { gap: 14px; margin-bottom: 28px; }
  .ui-consult-list-colmn { padding: 20px 18px 22px; }
  .ui-consult-list-colmn h2 { font-size: calc(17px * var(--fs)); }
  .ui-consult-list-colmn h2::before { width: 40px; height: 40px; font-size: calc(22px * var(--fs)); }

  .ui-consult-block-title {
    gap: 12px;
    padding: 26px 16px 0;
    font-size: calc(20px * var(--fs));
  }
  .ui-consult-block-title::before {
    width: 44px;
    height: 44px;
    font-size: calc(25px * var(--fs));
  }
  .ui-consult-block-lead {
    padding: 16px 16px 0;
    font-size: calc(16px * var(--fs));
  }
  .ui-consult-block-lead br { display: none; }
  .ui-consult-grp { padding: 22px 16px; }
  .ui-consult-grp h2 {
    gap: 12px;
    font-size: calc(19px * var(--fs));
  }
  .ui-consult-grp h2::before {
    width: 40px;
    height: 40px;
    font-size: calc(23px * var(--fs));
  }
  .ui-consult-grp h3,
  .ui-consult-grp h4 {
    margin: 22px 0 10px;
    font-size: calc(16.5px * var(--fs));
  }
  .ui-consult-grp p { margin-bottom: 13px; }
  .site-font-size-medium { font-size: calc(16px * var(--fs)); }

  /* 回り込み画像はSPで全幅に戻して縦積み */
  .ui-consult-grp .site-block-image.alignright,
  .ui-consult-grp .site-block-image.alignleft {
    float: none;
    max-width: 100%;
    margin: 0 0 14px;
  }

  /* セクション内カラムはSPで縦積み（画像は250px上限に戻す） */
  .ui-consult-grp .site-block-columns { flex-direction: column; align-items: stretch; gap: 16px; }
  /* 縦並びでは本文量で列幅が縮まないようにし、動画の幅と高さを揃える。 */
  .ui-consult-grp .site-block-column { flex: 0 0 auto; width: 100%; }
  .ui-consult-grp .site-block-column .site-block-image img { max-width: 250px; }

  /* Q&Aはバッジ・インデントを詰める */
  .ui-telework-faq-a { margin-left: 12px; }
  .ui-telework-faq-q, .ui-telework-faq-a { gap: 11px; padding: 13px 14px; }
  .ui-telework-faq-q::before, .ui-telework-faq-a::before { width: 32px; height: 32px; font-size: calc(16px * var(--fs)); }

  /* イベントカード：情報テーブルを縦並びカードに */
  .ui-event-list .is-card { padding: 18px 16px; }
  .ui-el-header { gap: 12px; }
  .ui-el-date-label { width: 64px; }
  .ui-el-title h2 { font-size: calc(17px * var(--fs)); }
  .ui-el-info-table, .ui-el-info-table tbody, .ui-el-info-table tr, .ui-el-info-table th, .ui-el-info-table td { display: block; width: 100%; }
  .ui-el-info-table th { white-space: normal; border-bottom: 0; }
  .ui-el-info-table td { border-top: 0; }
  .ui-el-info-table tr { margin-bottom: 8px; }

  /* トピックス：日付を上に積む */
  .ui-topics-item { flex-direction: column; gap: 7px; padding: 20px 34px 20px 18px; }
  .ui-topics-date { font-size: calc(13px * var(--fs)); }

  /* 記事詳細パネル：余白を詰める */
  .ui-detail-main { padding: 24px 18px 28px; }
  .ui-detail-side { padding: 20px 16px 24px; }
}

/* ---- 前のページへ戻るボタン（index以外の各ページ下部） ---- */
.page-back {
  margin: 8px auto 56px;
  text-align: center;
}
.page-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 30px 13px 24px;
  border: 2px solid var(--green-700);
  border-radius: 999px;
  background: #fff;
  color: var(--green-800);
  font-family: inherit;
  font-size: calc(16px * var(--fs));
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: background .2s, color .2s, box-shadow .2s;
}
.page-back-btn .material-symbols-outlined { font-size: calc(20px * var(--fs)); }
.page-back-btn:hover,
.page-back-btn:focus-visible {
  background: var(--green-700);
  color: #fff;
  box-shadow: 0 6px 16px rgba(0, 122, 61, .22);
}
@media (max-width: 640px) {
  .page-back { margin: 4px auto 40px; }
  .page-back-btn { padding: 13px 26px; }
}

/* ---- サイトマップ ---- */
/* 本文は他ページ同様に白い1枚パネル */
.ui-sitemap {
  margin: 4px 0 8px;
  padding: 34px 36px;
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0, 90, 45, .05);
}
.ui-sitemap-list {
  margin: 0;
  padding: 0;
  list-style: none;
  column-count: 2;
  column-gap: 40px;
}
.ui-sitemap-item {
  break-inside: avoid;
  margin-bottom: 28px;
}
.ui-sitemap-parent,
.ui-sitemap-item > a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--line);
  color: var(--green-900);
  font-size: calc(19px * var(--fs));
  font-weight: 800;
}
.ui-sitemap-parent::before,
.ui-sitemap-item > a::before {
  content: "";
  font-weight: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: var(--green-100);
  color: var(--green-800);
  font-size: calc(21px * var(--fs));

  background-image: url("../icons/material/link-008f46.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
.sitemap-icon-home > a::before { content: ""; 
  background-image: url("../icons/material/home-008f46.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
.sitemap-icon-support_agent > a::before { content: ""; 
  background-image: url("../icons/material/support_agent-008f46.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
.sitemap-icon-language > a::before { content: ""; 
  background-image: url("../icons/material/language-008f46.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
.sitemap-icon-front_hand > a::before { content: ""; 
  background-image: url("../icons/material/front_hand-008f46.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
.sitemap-icon-laptop_mac > a::before { content: ""; 
  background-image: url("../icons/material/laptop_mac-008f46.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
.sitemap-icon-diversity_3 > a::before { content: ""; background-image: url("../icons/material/diversity_3-008f46.svg"); }
.sitemap-icon-event > a::before { content: ""; 
  background-image: url("../icons/material/event-008f46.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
.sitemap-icon-campaign > a::before { content: ""; 
  background-image: url("../icons/material/campaign-008f46.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
.sitemap-icon-account_tree > a::before { content: ""; 
  background-image: url("../icons/material/account_tree-008f46.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}
.ui-sitemap-parent:hover,
.ui-sitemap-item > a:hover { color: var(--green-700); }
.ui-sitemap-sub {
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}
.ui-sitemap-sub li { margin: 0 0 2px; }
.ui-sitemap-sub a {
  display: block;
  padding: 8px 12px;
  border-radius: 8px;
  color: #2b3a2d;
  font-size: calc(15px * var(--fs));
  font-weight: 600;
  transition: background .15s, color .15s;
}
.ui-sitemap-sub a::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 11px;
  border-right: 2px solid var(--green-700);
  border-bottom: 2px solid var(--green-700);
  transform: rotate(-45deg);
  vertical-align: middle;
}
.ui-sitemap-sub a:hover { background: var(--green-50); color: var(--green-900); }
@media (max-width: 640px) {
  .ui-sitemap { padding: 22px 18px; }
  .ui-sitemap-list { column-count: 1; }
  .ui-sitemap-item { margin-bottom: 22px; }
}

/* ---- ページネーション（トピックス一覧・検索・アーカイブ共通） ----
   home.php=the_posts_pagination / page-topics.php=paginate_links を
   どちらも .pagination > .nav-links > .page-numbers の構造に揃えて適用 */
.pagination {
  margin-top: 48px;
}
.pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  padding: 0 13px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: #fff;
  color: var(--green-900);
  font-size: calc(15px * var(--fs));
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: background-color .15s, border-color .15s, color .15s;
}
.pagination a.page-numbers:hover,
.pagination a.page-numbers:focus-visible {
  background: var(--green-50);
  border-color: var(--green-700);
  color: var(--green-800);
}
.pagination .page-numbers.current {
  background: var(--green-900);
  border-color: var(--green-900);
  color: #fff;
}
.pagination .page-numbers.dots {
  min-width: auto;
  padding: 0 4px;
  border-color: transparent;
  background: transparent;
  color: var(--muted);
}
.pagination .page-numbers.prev,
.pagination .page-numbers.next {
  gap: 4px;
  font-weight: 800;
}

@media (max-width: 600px) {
  .pagination { margin-top: 36px; }
  .pagination .nav-links { gap: 6px; }
  .pagination .page-numbers { min-width: 40px; height: 40px; padding: 0 10px; font-size: 14px; }
}

/* スクリーンリーダー用見出し（the_posts_pagination が出す h2 を視覚的に隠す） */
.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ---- 見出しブロックのスタイル（編集画面「スタイル」から選択） ----
   register_block_style('core/heading', …) で登録。クラス入力不要でワンクリック適用。
   .ui-consult-grp の外でも効くよう各変数にフォールバックを付ける。
   labor-consultation.css は add_editor_style でも読むため編集画面にも反映される。 */

/* セクション見出し（アイコンチップ＋罫線）＝ .ui-consult-grp h2 相当 */
.is-style-consult-heading {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 8px 0 22px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--accent, #079e89);
  color: var(--green-900);
  font-size: calc(clamp(20px, 2.1vw, 26px) * var(--fs, 1));
  line-height: 1.4;
}
.is-style-consult-heading::before {
  content: "";
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: var(--accent-soft, #e6f7f4);
  color: var(--accent-text, #057a68);
  font-size: calc(27px * var(--fs, 1));
  font-weight: normal;

  background-image: var(--sec-icon, url("../icons/material/label-05675a.svg"));
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em 1em;
}

/* 見出し（アクセント下線のみ・アイコンなし・汎用） */
.is-style-consult-underline {
  margin: 8px 0 18px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--accent, #079e89);
  color: var(--green-900);
  font-size: calc(clamp(19px, 2vw, 24px) * var(--fs, 1));
  font-weight: 800;
  line-height: 1.4;
}

/* ============================================================
   フル・ネイティブブロック化 対応（2026-07-16）
   - 黄色マーカーを <mark class="ui-marker"> で表現（旧 <strong class="ui-marker">）
   - 行見出しテーブルを core/table 化したため <th> ではなく td:first-child を
     ラベルとして装飾。スマホはカード崩しをやめ横スクロールで構造保持。
   ※値は既存 .site-block-table th / 768px カード指定に合わせている。
   ============================================================ */
.ui-consult-grp mark.ui-marker {
  color: inherit;
  font-weight: 800;
}
/* 行見出しテーブル：1列目をラベル表示（旧 th 相当）。
   thead を持つ表（先頭行が見出し）の1列目には適用しない。 */
.ui-consult-grp .site-block-table table:not(:has(thead)) tbody td:first-child {
  width: 30%;
  background: #fcfff6;
  color: var(--green-900);
  font-weight: 800;
}
@media (max-width: 768px) {
  /* consult 系テーブルはカード崩しをやめ、構造を保ったまま横スクロール */
  .ui-consult-grp .site-block-table {
    overflow-x: auto;
    border: 1px solid #d9e8ca;
    border-radius: 10px;
    background: #fff;
  }
  .ui-consult-grp .site-block-table table { display: table; width: 100%; }
  .ui-consult-grp .site-block-table thead { display: table-header-group; }
  .ui-consult-grp .site-block-table tbody { display: table-row-group; }
  .ui-consult-grp .site-block-table tr {
    display: table-row;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
  .ui-consult-grp .site-block-table th,
  .ui-consult-grp .site-block-table td {
    display: table-cell;
    width: auto;
    border-bottom: 1px solid #d9e8ca;
  }
  .ui-consult-grp .site-block-table table:not(:has(thead)) tbody td:first-child {
    background: #fcfff6;
    color: var(--green-900);
    font-weight: 800;
  }
  .ui-consult-grp .site-block-table td + td { border-top: 0; }
}

/* ------------------------------------------------------------
   ネイティブブロック化に伴う既定CSSの上書き是正
   （フォントサイズのプリセットがB案指定より後に読まれ勝つため、
    .entry-content を前置して特異度を上げ B案の値を確実に効かせる）
   ------------------------------------------------------------ */
.entry-content .site-font-size-medium { font-size: calc(17px * var(--fs)); }
.entry-content .ui-consult-grp h2 { font-size: calc(clamp(20px, 2.1vw, 26px) * var(--fs)); }
.entry-content .ui-consult-list-colmn h2 { font-size: calc(19px * var(--fs)); }
@media (max-width: 768px) {
  .entry-content .site-font-size-medium { font-size: calc(16px * var(--fs)); }
  .entry-content .ui-consult-grp h2 { font-size: calc(19px * var(--fs)); }
  .entry-content .ui-consult-list-colmn h2 { font-size: calc(17px * var(--fs)); }
}

/* リード文：既定のx-largeプリセットに負けるのを是正（B案 .ui-read-text の値を再指定） */
.entry-content .ui-read-text { font-size: calc(clamp(20px, 2.4vw, 29px) * var(--fs)); }

/* テーブル枠線：標準テーブルの「全セル枠（グリッド）」を打ち消し、
   B案どおり外枠＋横罫線のみにする（.ui-consult-grp で特異度を確保） */
.ui-consult-grp .site-block-table {
  border: 1px solid #d9e8ca;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}
.ui-consult-grp .site-block-table th,
.ui-consult-grp .site-block-table td {
  border: 0;
  border-bottom: 1px solid #d9e8ca;
}
.ui-consult-grp .site-block-table tr:last-child th,
.ui-consult-grp .site-block-table tr:last-child td {
  border-bottom: 0;
}
@media (max-width: 768px) {
  .entry-content .ui-read-text { font-size: calc(19px * var(--fs)); }
}

/* ------------------------------------------------------------
   フォントサイズ確定（重要）
   font-sizeプリセットは!important付きで出力されるため、
   B案の値も !important で上書きしないと勝てない。
   ------------------------------------------------------------ */
.entry-content .ui-read-text { font-size: calc(clamp(20px, 2.4vw, 29px) * var(--fs)) !important; }
.entry-content .site-font-size-medium { font-size: calc(17px * var(--fs)) !important; }
@media (max-width: 768px) {
  .entry-content .ui-read-text { font-size: calc(19px * var(--fs)) !important; }
  .entry-content .site-font-size-medium { font-size: calc(16px * var(--fs)) !important; }
}