/* =========================================================
   ORWA 基本スタイル
   クラス名はすべて orwa- で始める（プラグインとの衝突防止）
   ========================================================= */

*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  font-family: var(--orwa-font);
  font-size: var(--orwa-fs-md);
  line-height: var(--orwa-lh);
  color: var(--orwa-text);
  background: var(--orwa-bg);
  -webkit-font-smoothing: antialiased;
}

img, video { max-width: 100%; height: auto; }

a { color: var(--orwa-primary); }

/* --- レイアウト ----------------------------------------- */

.orwa-container {
  width: 100%;
  max-width: var(--orwa-w-wide);
  margin-inline: auto;
  padding-inline: var(--orwa-gutter);
}

.orwa-article {
  width: 100%;
  max-width: var(--orwa-w-article);
  margin-inline: auto;
  padding-inline: var(--orwa-gutter);
}

/* --- 本文 ----------------------------------------------- */

.orwa-entry h2 {
  font-size: var(--orwa-fs-2xl);
  line-height: var(--orwa-lh-tight);
  margin: var(--orwa-sp-6) 0 var(--orwa-sp-3);
  padding-bottom: var(--orwa-sp-2);
  border-bottom: 2px solid var(--orwa-primary);
}

.orwa-entry h3 {
  font-size: var(--orwa-fs-xl);
  line-height: var(--orwa-lh-tight);
  margin: var(--orwa-sp-5) 0 var(--orwa-sp-3);
}

.orwa-entry h4 {
  font-size: var(--orwa-fs-lg);
  margin: var(--orwa-sp-4) 0 var(--orwa-sp-2);
}

.orwa-entry p { margin: 0 0 var(--orwa-sp-4); }

.orwa-entry table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 var(--orwa-sp-4);
}
.orwa-entry th,
.orwa-entry td {
  border: 1px solid var(--orwa-border);
  padding: var(--orwa-sp-2) var(--orwa-sp-3);
  text-align: left;
}
.orwa-entry th { background: var(--orwa-bg-sub); }

/* 移行した記事は本文の作りがまちまちで、
   本文幅（820px）に収まらない要素が混ざっている。
   はみ出して横スクロールが出ないよう受け止める。 */

.orwa-entry { overflow-wrap: anywhere; }

/* 幅を指定した表が12記事ある。狭い画面では表だけ横に流す。 */
.orwa-entry table { display: block; overflow-x: auto; }

/* 動画の埋め込みが1記事ある。img と同じ扱いにする。
   img と video は冒頭で max-width を掛けてあるが、iframe は外れる。 */
.orwa-entry iframe {
  max-width: 100%;
  border: 0;
}

/* --- 注記 ------------------------------------------------
   .orwa-notice        テンプレートから出す汎用の注記
   .orwa-archive-notice アーカイブ記事の本文冒頭に自動挿入するもの
   見た目は同じ。用途が違うのでクラス名を分けている。 */

.orwa-notice,
.orwa-archive-notice {
  background: var(--orwa-notice-bg);
  border: 1px solid var(--orwa-notice-line);
  color: var(--orwa-notice-text);
  border-radius: var(--orwa-radius);
  padding: var(--orwa-sp-3) var(--orwa-sp-4);
  margin: 0 0 var(--orwa-sp-5);
  font-size: var(--orwa-fs-sm);
}

/* --- 見出しの前置きラベル --------------------------------
   .orwa-kicker  h2 の直前に置く短いラベル

   旧サイトが画像で作っていた小ラベルをテキストに置き換えるためのもの。
   画像のままだと TranslatePress が翻訳できず、多言語版で日本語が残る。

   h2 自身が上に 64px を持つため、そのままだとラベルと見出しが離れる。
   ラベル側で 64px を受け、直後の h2 の上余白を消して1組として見せる。 */

.orwa-entry .orwa-kicker {
  margin: var(--orwa-sp-6) 0 var(--orwa-sp-2);
  font-size: var(--orwa-fs-sm);
  font-weight: 700;
  line-height: var(--orwa-lh-tight);
  color: var(--orwa-accent);
}

.orwa-entry .orwa-kicker + h2 { margin-top: 0; }

/* --- 掲載状況による表示制御 ------------------------------
   受付終了・アーカイブの投稿では申込リンクを隠す */

.orwa-status-closed  .orwa-cta,
.orwa-status-archive .orwa-cta { display: none !important; }

/* --- ページ見出し ----------------------------------------
   一覧・詳細に共通する h1 まわり */

.orwa-page-header {
  margin: var(--orwa-sp-5) 0 var(--orwa-sp-4);
}

.orwa-page-header__parent {
  margin: 0 0 var(--orwa-sp-2);
  font-size: var(--orwa-fs-sm);
  color: var(--orwa-text-sub);
}

.orwa-page-header__title {
  font-size: var(--orwa-fs-2xl);
  line-height: var(--orwa-lh-tight);
  margin: 0 0 var(--orwa-sp-3);
}

.orwa-page-header__lead p {
  margin: 0 0 var(--orwa-sp-2);
  color: var(--orwa-text-sub);
}

.orwa-page-header__count {
  margin: 0;
  font-size: var(--orwa-fs-sm);
  color: var(--orwa-text-sub);
}

/* 区画の見出し（施設情報・企業情報・この企業の会場 など） */
.orwa-section-title {
  font-size: var(--orwa-fs-xl);
  line-height: var(--orwa-lh-tight);
  margin: var(--orwa-sp-6) 0 var(--orwa-sp-3);
  padding-bottom: var(--orwa-sp-2);
  border-bottom: 2px solid var(--orwa-primary);
}

/* --- カード（一覧） -------------------------------------- */

.orwa-cards {
  display: grid;
  gap: var(--orwa-sp-4);
  grid-template-columns: 1fr;
}

.orwa-card {
  border: 1px solid var(--orwa-border);
  border-radius: var(--orwa-radius);
  overflow: hidden;
  background: var(--orwa-bg);
}

.orwa-card__link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.orwa-card__media {
  aspect-ratio: 4 / 3;
  background: var(--orwa-bg-sub);
  overflow: hidden;
}

.orwa-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ロゴは横長のものが多いため、写真用の 4:3 では縦が余りすぎる。
   カード内で説明文が押し下げられるのを避けるため 3:1 にしている。
   デザイン確定までの暫定値。 */
.orwa-card__media--member {
  aspect-ratio: 3 / 1;
  padding: var(--orwa-sp-3);
}

.orwa-card__image--logo {
  object-fit: contain;
}

.orwa-card__image--placeholder {
  background: color-mix(in srgb, var(--orwa-primary) 12%, var(--orwa-bg));
}

.orwa-card__noimage {
  display: block;
  width: 100%;
  height: 100%;
}

.orwa-card__body { padding: var(--orwa-sp-3); }

.orwa-card__title {
  font-size: var(--orwa-fs-lg);
  line-height: var(--orwa-lh-tight);
  margin: 0 0 var(--orwa-sp-2);
}

.orwa-card__meta {
  margin: 0;
  font-size: var(--orwa-fs-sm);
  color: var(--orwa-text-sub);
}

.orwa-card__terms {
  margin: 0;
  padding: 0 var(--orwa-sp-3) var(--orwa-sp-3);
  font-size: var(--orwa-fs-xs);
  color: var(--orwa-text-sub);
}

.orwa-card__label {
  display: inline-block;
  font-size: var(--orwa-fs-xs);
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--orwa-bg-sub);
  color: var(--orwa-text-sub);
  margin-bottom: var(--orwa-sp-2);
}

/* --- 会員企業ロゴ --------------------------------------- */

.orwa-member__logo {
  max-width: calc(var(--orwa-w-article) / 2);
  margin: 0 0 var(--orwa-sp-5);
  aspect-ratio: 4 / 3;
}

.orwa-member__logo-image {
  display: block;
  width: 100%;
  height: 100%;
  padding: var(--orwa-sp-4);
  object-fit: contain;
  background-color: var(--orwa-bg-sub);
}

.orwa-member__logo-image--placeholder {
  background: color-mix(in srgb, var(--orwa-primary) 12%, var(--orwa-bg));
}

/* 書誌情報の行（資料ライブラリ）。
   説明文より弱く見せて、タイトル → 説明文 → 書誌情報の順に読ませる。 */
.orwa-card__spec {
  margin: var(--orwa-sp-2) 0 0;
  font-size: var(--orwa-fs-xs);
  color: var(--orwa-text-sub);
}

@media (min-width: 768px) {
  .orwa-cards { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
  .orwa-cards { grid-template-columns: repeat(3, 1fr); }
}

/* --- 定義リスト（施設情報・企業情報） --------------------- */

.orwa-datalist {
  margin: 0;
  border-top: 1px solid var(--orwa-border);
}

.orwa-datalist__row {
  border-bottom: 1px solid var(--orwa-border);
  padding: var(--orwa-sp-3) 0;
}

.orwa-datalist__term {
  font-size: var(--orwa-fs-sm);
  color: var(--orwa-text-sub);
  margin: 0 0 var(--orwa-sp-1);
}

.orwa-datalist__desc {
  margin: 0;
  overflow-wrap: anywhere;
}

@media (min-width: 768px) {
  .orwa-datalist__row {
    display: grid;
    grid-template-columns: 10em 1fr;
    gap: var(--orwa-sp-4);
    align-items: baseline;
  }
  .orwa-datalist__term { margin: 0; }
}

.orwa-section-title__count {
  font-size: var(--orwa-fs-sm);
  font-weight: normal;
  color: var(--orwa-text-sub);
  margin-left: var(--orwa-sp-2);
}

/* --- お知らせ一覧 ----------------------------------------
   カードのグリッドではなく縦に積む。
   309件のうちアイキャッチを持つのは20件だけで、
   カードにすると画像のない枠が大半になるため。 */

.orwa-news-list {
  border-top: 1px solid var(--orwa-border);
  margin: 0 0 var(--orwa-sp-6);
}

.orwa-news-item {
  border-bottom: 1px solid var(--orwa-border);
}

.orwa-news-item__link {
  display: flex;
  flex-direction: column;
  gap: var(--orwa-sp-3);
  padding: var(--orwa-sp-4) 0;
  color: inherit;
  text-decoration: none;
}

.orwa-news-item__media {
  flex: none;
}

.orwa-news-item__image {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--orwa-radius);
}

.orwa-news-item__body {
  min-width: 0;
}

.orwa-news-item__date {
  margin: 0 0 var(--orwa-sp-1);
  font-size: var(--orwa-fs-sm);
  color: var(--orwa-text-sub);
}

.orwa-news-item__title {
  margin: 0 0 var(--orwa-sp-2);
  font-size: var(--orwa-fs-lg);
  line-height: var(--orwa-lh-tight);
  color: var(--orwa-primary);
}

.orwa-news-item__link:hover .orwa-news-item__title {
  text-decoration: underline;
}

.orwa-news-item__excerpt {
  margin: 0;
  font-size: var(--orwa-fs-sm);
  color: var(--orwa-text-sub);
}

.orwa-news-item__terms {
  margin: 0 0 var(--orwa-sp-4);
  font-size: var(--orwa-fs-sm);
}

@media (min-width: 768px) {
  .orwa-news-item__link {
    flex-direction: row;
    align-items: flex-start;
  }
  .orwa-news-item__media { width: 200px; }
}

/* --- お知らせ詳細 ---------------------------------------- */

.orwa-news__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--orwa-sp-3);
  margin: 0;
  font-size: var(--orwa-fs-sm);
  color: var(--orwa-text-sub);
}

.orwa-news__thumbnail {
  margin: 0 0 var(--orwa-sp-5);
}

.orwa-news__thumbnail img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--orwa-radius);
}

.orwa-news__tags {
  margin: var(--orwa-sp-5) 0 0;
  font-size: var(--orwa-fs-sm);
}

/* --- 協会商品のプラン詳細 --------------------------------
   専用のスタイルシートは作らない。1ルールしかないため。
   増えるようなら roman.css と同じ形で products.css に分ける。 */

.orwa-plan__image {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 0 var(--orwa-sp-5);
  border-radius: var(--orwa-radius);
}

/* --- 前後の記事 ------------------------------------------ */

.orwa-adjacent {
  display: grid;
  gap: var(--orwa-sp-3);
  margin: var(--orwa-sp-6) 0;
  padding-top: var(--orwa-sp-4);
  border-top: 1px solid var(--orwa-border);
}

.orwa-adjacent__link {
  display: block;
  padding: var(--orwa-sp-3);
  border: 1px solid var(--orwa-border);
  border-radius: var(--orwa-radius);
  color: inherit;
  text-decoration: none;
}

.orwa-adjacent__link:hover {
  background: var(--orwa-bg-sub);
}

.orwa-adjacent__label {
  display: block;
  margin-bottom: var(--orwa-sp-1);
  font-size: var(--orwa-fs-sm);
  color: var(--orwa-text-sub);
}

.orwa-adjacent__title {
  display: block;
  color: var(--orwa-primary);
}

@media (min-width: 768px) {
  .orwa-adjacent { grid-template-columns: 1fr 1fr; }
  .orwa-adjacent__link--next {
    grid-column: 2;
    text-align: right;
  }
}

/* --- 絞り込み -------------------------------------------- */

.orwa-filters {
  margin: 0 0 var(--orwa-sp-6);
  padding: var(--orwa-sp-4);
  background: var(--orwa-bg-sub);
  border-radius: var(--orwa-radius);
}

.orwa-filter + .orwa-filter {
  margin-top: var(--orwa-sp-4);
}

.orwa-filter__title {
  font-size: var(--orwa-fs-sm);
  color: var(--orwa-text-sub);
  margin: 0 0 var(--orwa-sp-2);
}

.orwa-filter__group {
  margin: 0 0 var(--orwa-sp-3);
}

.orwa-filter__group:last-child {
  margin-bottom: 0;
}

.orwa-filter__group-title {
  font-size: var(--orwa-fs-xs);
  color: var(--orwa-text-sub);
  margin: 0 0 var(--orwa-sp-2);
}

.orwa-filter__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--orwa-sp-2);
}

.orwa-filter__item { margin: 0; }

.orwa-filter__link {
  display: inline-block;
  padding: 4px 12px;
  border: 1px solid var(--orwa-border);
  border-radius: 999px;
  background: var(--orwa-bg);
  font-size: var(--orwa-fs-sm);
  text-decoration: none;
}

.orwa-filter__link--current {
  background: var(--orwa-primary);
  border-color: var(--orwa-primary);
  color: var(--orwa-bg);
}

.orwa-filter__count {
  margin-left: var(--orwa-sp-1);
  font-size: var(--orwa-fs-xs);
  color: var(--orwa-text-sub);
}

.orwa-filter__link--current .orwa-filter__count {
  color: inherit;
}

.orwa-filters__reset {
  margin: var(--orwa-sp-4) 0 0;
  font-size: var(--orwa-fs-sm);
}

/* --- ページ送り ------------------------------------------- */

.orwa-main .pagination {
  margin: var(--orwa-sp-6) 0;
}

.orwa-main .nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--orwa-sp-2);
  align-items: center;
}

.orwa-main .page-numbers {
  display: inline-block;
  min-width: 2.5em;
  padding: 6px 10px;
  border: 1px solid var(--orwa-border);
  border-radius: var(--orwa-radius);
  text-align: center;
  text-decoration: none;
  font-size: var(--orwa-fs-sm);
}

.orwa-main .page-numbers.current {
  background: var(--orwa-primary);
  border-color: var(--orwa-primary);
  color: var(--orwa-bg);
}

.orwa-main .page-numbers.dots {
  border-color: transparent;
}

.orwa-main .screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* --- エリアアーカイブの区画 ------------------------------- */

.orwa-area-group + .orwa-area-group {
  margin-top: var(--orwa-sp-6);
}

/* --- 一覧が空のとき / 戻るリンク -------------------------- */

.orwa-empty {
  padding: var(--orwa-sp-5) 0;
  color: var(--orwa-text-sub);
}

.orwa-backlink {
  margin: var(--orwa-sp-6) 0;
  font-size: var(--orwa-fs-sm);
}

/* --- 固定ページ ------------------------------------------
   末尾の形がページごとに違う（本文だけ／子の一覧／戻るリンク）。
   どの形でもフッターと詰まらないよう、記事全体で下に余白を持たせる。

   .orwa-article に上下の padding がないため、この margin は
   内側の最後の要素（.orwa-backlink など）の margin と相殺される。
   戻るリンクがあるページで余白が二重にならないのは意図どおり。 */

.orwa-page {
  margin-bottom: var(--orwa-sp-6);
}

/* --- 固定ページのリンク一覧 --------------------------------
   親ページの子一覧と、子ページの兄弟一覧で使う。
   枠付きのリンクを並べる形は .orwa-adjacent と同じだが、
   用途が違うのでクラス名を分けている
   （.orwa-notice と .orwa-archive-notice と同じ考え方）。 */

.orwa-pagelist {
  display: grid;
  gap: var(--orwa-sp-3);
  margin: 0;
  padding: 0;
  list-style: none;
}

.orwa-pagelist__item { margin: 0; }

.orwa-pagelist__link {
  display: block;
  padding: var(--orwa-sp-3);
  border: 1px solid var(--orwa-border);
  border-radius: var(--orwa-radius);
  color: var(--orwa-primary);
  text-decoration: none;
}

.orwa-pagelist__link:hover,
.orwa-pagelist__link:focus {
  background: var(--orwa-bg-sub);
}

@media (min-width: 768px) {
  .orwa-pagelist { grid-template-columns: 1fr 1fr; }
}

/* --- PDFのダウンロード（資料ライブラリ） -------------------
   資料ページで一番押してほしい要素なので、
   本文中のリンクとは別に面で見せる。 */

.orwa-download {
  margin: var(--orwa-sp-5) 0 0;
}

.orwa-download__link {
  display: block;
  padding: var(--orwa-sp-3) var(--orwa-sp-4);
  border: 1px solid var(--orwa-primary);
  border-radius: var(--orwa-radius);
  background: var(--orwa-primary);
  color: var(--orwa-on-primary);
  text-decoration: none;
  font-weight: bold;
}

.orwa-download__link:hover,
.orwa-download__link:focus {
  background: var(--orwa-primary-dark);
  border-color: var(--orwa-primary-dark);
}

.orwa-download__meta {
  display: block;
  margin-top: var(--orwa-sp-1);
  font-size: var(--orwa-fs-xs);
  font-weight: normal;
  opacity: .85;
}

@media (min-width: 768px) {
  .orwa-download__link {
    display: inline-block;
  }
}