@charset "utf-8";
/* ================================================================
   お知らせ（リリース / メディア掲載 / イベント）共通スタイル
   ----------------------------------------------------------------
   すべて .dz-release 配下に閉じてある。テーマの style.css / reset.css /
   archive.css / single.css を一切上書きしない。
   使う側:
     - single-post.php        … お知らせ詳細（全記事共通）
     - category-release.php   … /release/ 一覧
     - category-media.php     … /media/ 一覧
     - category-event.php     … /event/ 一覧

   前提（2026-09-02 ローカルDBで実測）:
     アイキャッチ 0/42 件・手動抜粋 0/42 件。
     → 画像前提のカードは作れない。文字組みで見せる設計にしてある。
        アイキャッチを入れ始めたら .dzr-card__thumb を足す（今は無い）。

   色は 147スレのデザイン実測に準拠:
     行動色 #FF5722 ／ 見積 #014099 ／ 濃紺 #1f3a5c
   html は font-size:62.5%（1rem = 10px）。
   ================================================================ */

.dz-release {
  --dzr-ink:      #1f2328;  /* 本文 */
  --dzr-ink-sub:  #5b6169;  /* 補足 */
  --dzr-ink-hint: #868d96;  /* 日付など */
  --dzr-navy:     #1f3a5c;  /* 見出し・タグ */
  --dzr-action:   #FF5722;  /* 行動色（サイト共通） */
  --dzr-quote:    #014099;  /* 見積色（サイト共通） */
  --dzr-line:     #e3e6ea;
  --dzr-line-str: #c9cfd6;
  --dzr-bg-soft:  #f6f8fa;
  --dzr-radius:   4px;      /* 記事系は 4px が正（製品ページの999pxではない） */

  color: var(--dzr-ink);
  font-size: 1.6rem;
  line-height: 1.9;
}

.dz-release .dzr-inner {
  max-width: 104rem;
  margin: 0 auto;
  padding: 0 2rem;
}

/* ---------------- 見出し（reset で 400 に落ちるので明示） ------------- */
.dz-release h1,
.dz-release h2,
.dz-release h3 {
  font-weight: 700;
  color: var(--dzr-navy);
}

/* ================================================================
   1. 詳細ページ
   ================================================================ */

/* --- ヘッダー --- */
.dz-release .dzr-head {
  padding: 4rem 0 3rem;
  border-bottom: 1px solid var(--dzr-line);
  margin-bottom: 4rem;
}

.dz-release .dzr-kicker {
  font-size: 1.1rem;
  letter-spacing: .18em;
  font-weight: 700;
  color: var(--dzr-ink-hint);
  margin: 0 0 1.2rem;
}

.dz-release .dzr-meta {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  margin-bottom: 1.4rem;
  flex-wrap: wrap;
}

.dz-release .dzr-badge {
  display: inline-block;
  padding: .4rem 1.2rem;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.6;
  color: #fff;
  background: var(--dzr-navy);
  border-radius: 2rem;
}

.dz-release .dzr-badge--media { background: #7a5c1f; }
.dz-release .dzr-badge--event { background: #b04a1f; }

.dz-release .dzr-date {
  font-size: 1.3rem;
  color: var(--dzr-ink-hint);
  letter-spacing: .04em;
}

.dz-release .dzr-head h1 {
  font-size: 3.2rem;
  line-height: 1.5;
  letter-spacing: -.01em;
  margin: 0;
}

.dz-release .dzr-lead {
  margin: 2rem 0 0;
  font-size: 1.7rem;
  line-height: 1.9;
  color: var(--dzr-ink-sub);
}

/* --- 本文2カラム --- */
.dz-release .dzr-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28rem;
  gap: 5rem;
  align-items: start;
  padding-bottom: 6rem;
}

/* --- 要点ボックス（カスタムフィールドがある記事だけ出る） --- */
.dz-release .dzr-facts {
  background: var(--dzr-bg-soft);
  border: 1px solid var(--dzr-line);
  border-radius: var(--dzr-radius);
  padding: 2.4rem 2.6rem;
  margin: 0 0 3.2rem;
}

.dz-release .dzr-facts dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.6rem 2.8rem;
  margin: 0;
}

.dz-release .dzr-facts dt {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--dzr-ink-hint);
  margin-bottom: .3rem;
}

.dz-release .dzr-facts dd {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.7;
}

/* --- 本文（the_content がそのまま入る） --- */
.dz-release .dzr-body { min-width: 0; }

.dz-release .dzr-body > p {
  margin: 0 0 2.4rem;
}

.dz-release .dzr-body h2 {
  font-size: 2.2rem;
  line-height: 1.6;
  margin: 5rem 0 2rem;
  padding-bottom: 1.2rem;
  border-bottom: 2px solid var(--dzr-navy);
}

.dz-release .dzr-body h3 {
  font-size: 1.8rem;
  line-height: 1.7;
  margin: 3.6rem 0 1.4rem;
  padding-left: 1.2rem;
  border-left: 3px solid var(--dzr-line-str);
}

.dz-release .dzr-body ul,
.dz-release .dzr-body ol {
  margin: 0 0 2.4rem;
  padding-left: 2.2rem;
}

.dz-release .dzr-body ul { list-style: disc; }
.dz-release .dzr-body ol { list-style: decimal; }
.dz-release .dzr-body li { margin-bottom: .8rem; }

/* 本文中のリンク。CTAボタン（.dzr-btn）は除く。
   :not() を外すと (0,2,1) がボタンの (0,2,0) に勝ち、
   ボタン文字が見積色 #014099 ＋下線になる（2026-09-03 実測） */
.dz-release .dzr-body a:not(.dzr-btn) {
  color: var(--dzr-quote);
  text-decoration: underline;
}

.dz-release .dzr-body a:not(.dzr-btn):hover { text-decoration: none; }

.dz-release .dzr-body img {
  max-width: 100%;
  height: auto;
  border-radius: var(--dzr-radius);
}

.dz-release .dzr-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 2.4rem;
  font-size: 1.5rem;
}

.dz-release .dzr-body th,
.dz-release .dzr-body td {
  border: 1px solid var(--dzr-line);
  padding: 1rem 1.2rem;
  text-align: left;
}

.dz-release .dzr-body th { background: var(--dzr-bg-soft); font-weight: 700; }

.dz-release .dzr-body blockquote {
  margin: 0 0 2.4rem;
  padding: 1.6rem 2rem;
  border-left: 3px solid var(--dzr-line-str);
  background: var(--dzr-bg-soft);
  color: var(--dzr-ink-sub);
}

/* --- 本文末のCTA --- */
.dz-release .dzr-cta {
  margin-top: 5rem;
  padding: 3rem 3.2rem;
  border: 1px solid var(--dzr-line);
  border-top: 3px solid var(--dzr-navy);
  border-radius: var(--dzr-radius);
  background: #fff;
}

.dz-release .dzr-cta h2 {
  font-size: 1.9rem;
  line-height: 1.6;
  margin: 0 0 1.2rem;
  padding: 0;
  border: 0;
}

.dz-release .dzr-cta p {
  margin: 0 0 2rem;
  font-size: 1.5rem;
  color: var(--dzr-ink-sub);
}

.dz-release .dzr-actions {
  display: flex;
  gap: 1.2rem;
  flex-wrap: wrap;
}

.dz-release .dzr-btn {
  display: inline-block;
  padding: 1.2rem 2.4rem;
  border-radius: var(--dzr-radius);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.6;
  text-align: center;
  text-decoration: none;
  transition: opacity .2s ease, background .2s ease, color .2s ease;
}

.dz-release .dzr-btn--primary {
  background: var(--dzr-action);
  border: 1px solid #d84719;
  color: #fff;
}

.dz-release .dzr-btn--quote {
  background: var(--dzr-quote);
  border: 1px solid var(--dzr-quote);
  color: #fff;
}

.dz-release .dzr-btn--ghost {
  background: #fff;
  border: 1px solid var(--dzr-line-str);
  color: var(--dzr-navy);
}

.dz-release .dzr-btn:hover { opacity: .85; }
.dz-release .dzr-btn--ghost:hover { opacity: 1; background: var(--dzr-bg-soft); }

/* --- 出典 --- */
.dz-release .dzr-source {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid var(--dzr-line);
  font-size: 1.3rem;
  color: var(--dzr-ink-hint);
}

.dz-release .dzr-source p { margin: 0 0 .6rem; font-weight: 700; }
.dz-release .dzr-source a { color: var(--dzr-quote); }

/* --- サイドバー --- */
.dz-release .dzr-side { min-width: 0; }

.dz-release .dzr-side-sticky {
  position: sticky;
  top: 2rem;
}

.dz-release .dzr-side-block {
  border: 1px solid var(--dzr-line);
  border-radius: var(--dzr-radius);
  padding: 2rem 2.2rem;
  margin-bottom: 1.6rem;
  background: #fff;
}

.dz-release .dzr-side-eyebrow {
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--dzr-ink-hint);
  margin: 0 0 1.4rem;
}

.dz-release .dzr-side-list { margin: 0; padding: 0; list-style: none; }

.dz-release .dzr-side-list li {
  padding: 1.2rem 0;
  border-bottom: 1px solid var(--dzr-line);
}

.dz-release .dzr-side-list li:first-child { padding-top: 0; }
.dz-release .dzr-side-list li:last-child { border-bottom: 0; padding-bottom: 0; }

.dz-release .dzr-side-list .d {
  display: block;
  font-size: 1.2rem;
  color: var(--dzr-ink-hint);
  margin-bottom: .3rem;
}

.dz-release .dzr-side-list a {
  color: var(--dzr-ink);
  font-size: 1.4rem;
  line-height: 1.6;
  text-decoration: none;
}

.dz-release .dzr-side-list a:hover { color: var(--dzr-quote); text-decoration: underline; }

.dz-release .dzr-prod {
  display: block;
  padding: 1.2rem 0;
  border-bottom: 1px solid var(--dzr-line);
  text-decoration: none;
  color: var(--dzr-ink);
}

.dz-release .dzr-prod:last-of-type { border-bottom: 0; }
.dz-release .dzr-prod span { display: block; font-size: 1.4rem; font-weight: 600; }
.dz-release .dzr-prod small { display: block; font-size: 1.2rem; color: var(--dzr-ink-hint); }
.dz-release .dzr-prod:hover span { color: var(--dzr-quote); }

.dz-release .dzr-side-block--contact { background: var(--dzr-bg-soft); }
.dz-release .dzr-side-block--contact p { font-size: 1.3rem; color: var(--dzr-ink-sub); margin: 0 0 1.6rem; }
.dz-release .dzr-side-block--contact .dzr-btn { display: block; }

/* ================================================================
   2. 一覧ページ
   ================================================================ */

.dz-release .dzr-arc-head {
  padding: 4.5rem 0 2.5rem;
  text-align: center;
}

.dz-release .dzr-arc-head h1 {
  font-size: 3rem;
  line-height: 1.5;
  margin: 0 0 1.2rem;
}

.dz-release .dzr-arc-head p {
  margin: 0;
  font-size: 1.5rem;
  color: var(--dzr-ink-sub);
}

/* --- カテゴリ切替 --- */
.dz-release .dzr-tabs {
  display: flex;
  justify-content: center;
  gap: .8rem;
  flex-wrap: wrap;
  margin-bottom: 3.5rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid var(--dzr-line);
}

.dz-release .dzr-tab {
  display: inline-block;
  padding: .8rem 1.8rem;
  border: 1px solid var(--dzr-line-str);
  border-radius: 2rem;
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--dzr-ink-sub);
  text-decoration: none;
  transition: all .2s ease;
}

.dz-release .dzr-tab:hover { background: var(--dzr-bg-soft); }

.dz-release .dzr-tab.is-current {
  background: var(--dzr-navy);
  border-color: var(--dzr-navy);
  color: #fff;
}

/* --- カード（サムネイル無し前提の文字組み） --- */
.dz-release .dzr-cards {
  display: grid;
  gap: 1.6rem;
  margin: 0 0 4rem;
  padding: 0;
  list-style: none;
}

.dz-release .dzr-card {
  display: block;
  padding: 2.4rem 2.6rem;
  border: 1px solid var(--dzr-line);
  border-left: 3px solid var(--dzr-line-str);
  border-radius: var(--dzr-radius);
  background: #fff;
  text-decoration: none;
  color: var(--dzr-ink);
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.dz-release .dzr-card:hover {
  border-left-color: var(--dzr-navy);
  box-shadow: 0 4px 16px rgba(31, 58, 92, .10);
  transform: translateY(-2px);
}

.dz-release .dzr-card__meta {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  margin-bottom: 1.2rem;
  flex-wrap: wrap;
}

.dz-release .dzr-card__title {
  font-size: 1.9rem;
  font-weight: 700;
  line-height: 1.6;
  color: var(--dzr-navy);
  margin: 0 0 1rem;
}

.dz-release .dzr-card:hover .dzr-card__title { color: var(--dzr-quote); }

.dz-release .dzr-card__excerpt {
  margin: 0;
  font-size: 1.4rem;
  line-height: 1.85;
  color: var(--dzr-ink-sub);
}

.dz-release .dzr-card__more {
  display: inline-block;
  margin-top: 1.4rem;
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--dzr-quote);
}

.dz-release .dzr-card__more::after { content: " ›"; }

.dz-release .dzr-empty {
  padding: 5rem 2rem;
  text-align: center;
  color: var(--dzr-ink-hint);
  border: 1px dashed var(--dzr-line-str);
  border-radius: var(--dzr-radius);
  margin-bottom: 4rem;
}

/* --- ページネーション（wp_pagenavi。テーマ既定を壊さないよう配下限定） --- */
.dz-release .wp-pagenavi {
  display: flex;
  justify-content: center;
  gap: .6rem;
  flex-wrap: wrap;
  margin: 0 0 5rem;
  border: 0;
}

.dz-release .wp-pagenavi a,
.dz-release .wp-pagenavi span {
  display: inline-block;
  padding: .8rem 1.4rem;
  border: 1px solid var(--dzr-line-str);
  border-radius: var(--dzr-radius);
  font-size: 1.3rem;
  text-decoration: none;
  color: var(--dzr-ink-sub);
  margin: 0;
}

.dz-release .wp-pagenavi span.current {
  background: var(--dzr-navy);
  border-color: var(--dzr-navy);
  color: #fff;
  font-weight: 700;
}

.dz-release .wp-pagenavi a:hover { background: var(--dzr-bg-soft); }

/* --- 一覧末尾のCTA --- */
.dz-release .dzr-arc-cta {
  padding: 3.5rem 3rem;
  margin-bottom: 6rem;
  text-align: center;
  background: var(--dzr-bg-soft);
  border-radius: var(--dzr-radius);
}

.dz-release .dzr-arc-cta h2 { font-size: 2rem; margin: 0 0 1rem; }
.dz-release .dzr-arc-cta p { margin: 0 0 2.4rem; font-size: 1.5rem; color: var(--dzr-ink-sub); }
.dz-release .dzr-arc-cta .dzr-actions { justify-content: center; }

/* ================================================================
   3. レスポンシブ
   ================================================================ */

@media screen and (max-width: 900px) {
  .dz-release .dzr-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 4rem;
  }
  .dz-release .dzr-side-sticky { position: static; }
  .dz-release .dzr-head h1 { font-size: 2.6rem; }
}

@media screen and (max-width: 600px) {
  .dz-release { font-size: 1.5rem; }
  .dz-release .dzr-inner { padding: 0 1.6rem; }
  .dz-release .dzr-head { padding: 3rem 0 2.4rem; margin-bottom: 3rem; }
  .dz-release .dzr-head h1 { font-size: 2.2rem; line-height: 1.55; }
  .dz-release .dzr-lead { font-size: 1.5rem; }
  .dz-release .dzr-body h2 { font-size: 1.9rem; margin: 4rem 0 1.6rem; }
  .dz-release .dzr-body h3 { font-size: 1.65rem; }
  .dz-release .dzr-facts { padding: 1.8rem 2rem; }
  .dz-release .dzr-facts dl { grid-template-columns: minmax(0, 1fr); gap: 1.4rem; }
  .dz-release .dzr-cta { padding: 2.4rem 2rem; }
  .dz-release .dzr-cta h2 { font-size: 1.7rem; }
  .dz-release .dzr-actions { flex-direction: column; }
  .dz-release .dzr-btn { display: block; width: 100%; }
  .dz-release .dzr-card { padding: 2rem 1.8rem; }
  .dz-release .dzr-card__title { font-size: 1.65rem; }
  .dz-release .dzr-arc-head { padding: 3.5rem 0 2rem; }
  .dz-release .dzr-arc-head h1 { font-size: 2.4rem; }
  .dz-release .dzr-arc-cta { padding: 2.8rem 2rem; }
}

/* 演出を切っている人には動かさない */
@media (prefers-reduced-motion: reduce) {
  .dz-release .dzr-card { transition: none; }
  .dz-release .dzr-card:hover { transform: none; }
}
