@charset "utf-8";
/*---------------------------------------------
 病院の工事事例（single-hospital_case / taxonomy-work_category）
 すべて #content.hc-page 配下にスコープ
---------------------------------------------*/

.hc-page {
  --hc-green: #007C4F;
  --hc-orange: #EF8701;
  --hc-orange-light: #F9D19D;
  --hc-bg-tag: #F0F6F6;
  --hc-bg-gray: #F9FAFA;
  --hc-line: #EDEEEE;
  --hc-text: #111;
  padding-bottom: 120px;
  color: var(--hc-text);
}
.hc-page .hc-pageTitle {
  text-align: center;
  font-family: "Zen Old Mincho", "游明朝", "Yu Mincho", "YuMincho", "Hiragino Mincho Pro", serif;
  font-weight: 700;
  font-size: 32px;
  letter-spacing: 0.1em;
  line-height: 1.5;
  color: var(--hc-green);
  padding: 0 0 90px;
}

/* レイアウト */
.hc-page .hc-layout {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.hc-page .hc-side {
  width: 250px;
  flex-shrink: 0;
}
.hc-page .hc-main {
  width: calc(100% - 339px);
  max-width: 761px;
}
/* #container〜footer の余白（PCのみ）
   body class は pageName() 出力のため WP標準の single-hospital_case / tax-work_category は付かない。
   本CSS自体が事例詳細・カテゴリページでのみ読込 ＋ #content.hc-page を直下に持つ #container に限定 */
@media screen and (min-width: 769px) {
  #container:has(> #content.hc-page) {
    padding-bottom: 90px;
  }
}
/* SP：小/中カテゴリページの本文とフッターの間に余白（layout.css の #content ID padding-bottom:0 を #container 側で回避。2026-10-06） */
@media screen and (max-width: 768px) {
  #container:has(> #content.hc-page--term) {
    padding-bottom: 60px;
  }
}

/* サイドナビ */
.hc-page .hc-side__top a {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 50px 0 16px;
  border-radius: 4px;
  line-height: 1.4;
}
.hc-page .hc-side__top a:after {
  content: "";
  position: absolute;
  right: 22px;
  top: 50%;
  width: 16px;
  height: 15px;
  transform: translateY(-50%);
  background: url("../images/common/arrow_w.svg") no-repeat center / contain;
}
.hc-page .hc-side__top a {
  min-height: 76px;
  background-color: var(--hc-orange);
  color: #FFF;
  font-size: 16px;
  padding-left: 18px;
}
.hc-page .hc-side__top a:hover {
  opacity: 0.75;
}
/* 中カテゴリ（ラベルのみ） */
.hc-page .hc-side__list {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
}
.hc-page .hc-side__mid + .hc-side__mid {
  margin-top: 16px;
}
.hc-page .hc-side__midLabel {
  display: flex;
  align-items: center;
  min-height: 60px;
  padding: 10px 16px;
  background-color: var(--hc-orange-light);
  color: #000;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}
/* 小カテゴリ（アーカイブへのリンク） */
.hc-page .hc-side__sub {
  list-style: none;
  margin: 0;
  padding: 0;
}
.hc-page .hc-side__sub li {
  border-bottom: 1px solid var(--hc-line);
}
.hc-page .hc-side__sub a {
  position: relative;
  display: block;
  padding: 14px 40px 14px 16px;
  color: #000;
  font-size: 14px;
  line-height: 1.5;
}
.hc-page .hc-side__sub a:after {
  content: "";
  position: absolute;
  right: 16px;
  top: 50%;
  width: 12px;
  height: 11px;
  transform: translateY(-50%);
  background-color: var(--hc-ar-color, var(--hc-orange));
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16.414 14.828'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-width='2'%3E%3Cpath d='M1 7.414h14M9 1.414l6 6M9 13.414l6-6'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16.414 14.828'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-width='2'%3E%3Cpath d='M1 7.414h14M9 1.414l6 6M9 13.414l6-6'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain;
}
.hc-page .hc-side__sub a:hover {
  opacity: 0.75;
}
/* 現在の小カテゴリ */
.hc-page .hc-side__sub li.is-current a {
  padding-left: 30px;
  background-color: var(--hc-bg-tag);
  color: var(--hc-green);
  font-weight: 700;
}
.hc-page .hc-side__sub li.is-current a:before {
  content: "";
  position: absolute;
  left: 14px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--hc-orange);
  transform: translateY(-50%);
}

/* テキスト共通 */
.hc-page .hc-tx {
  font-size: 16px;
  line-height: 1.875;
  letter-spacing: 0.08em;
}
.hc-page .hc-tx p {
  line-height: 1.875;
}
.hc-page .hc-wysiwyg p + p {
  margin-top: 1em;
}
.hc-page .hc-wysiwyg a {
  color: var(--hc-green);
  text-decoration: underline;
}

/* 見出し（緑バー） */
.hc-page .hc-heading {
  position: relative;
  margin: 0 0 45px;
  padding: 0 0 0 22px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.1em;
  color: #000;
}
.hc-page .hc-heading:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.15em;
  width: 7px;
  height: 1.2em;
  background-color: var(--hc-green);
}
.hc-page .hc-subTitle {
  margin: 45px 0 25px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: var(--hc-green);
}

/* タグ */
.hc-page .hc-tags__label {
  padding: 0 0 15px;
  border-bottom: 2px solid #EEE;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.05em;
}
.hc-page .hc-tags__list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 23px 0 0;
  padding: 0;
}
.hc-page .hc-tags__list li {
  min-width: 100px;
  padding: 11px 13px;
  background-color: var(--hc-bg-tag);
  color: var(--hc-green);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.1em;
  text-align: center;
}

/* 導入部 */
.hc-page .hc-lead {
  margin: 70px 0 0;
}
/* カテゴリページ：タグが無いので導入部を先頭に詰める */
.hc-page.hc-page--term .hc-main > .hc-lead:first-child {
  margin-top: 0;
}
.hc-page .hc-lead__title {
  margin: 0 0 35px;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: var(--hc-green);
}

/* 写真 */
.hc-page .hc-photos {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin: 60px 0 0;
}
.hc-page .hc-photo__link {
  display: block;
  overflow: hidden;
  border-radius: 10px;
  aspect-ratio: 16 / 9;
}
.hc-page .hc-photo__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease-in-out;
}
.hc-page .hc-photo__link:hover .hc-photo__img {
  transform: scale(1.04);
}
.hc-page .hc-photo__cap {
  margin: 20px 0 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.1em;
  text-align: center;
  color: var(--hc-green);
}
.hc-page .hc-photo--large .hc-photo__link {
  border-radius: 12px;
  aspect-ratio: 757 / 425;
}
.hc-page .hc-photo--large .hc-photo__cap {
  margin-top: 25px;
}

/* 事例本体 */
.hc-page .hc-case {
  margin: 80px 0 0;
  padding: 45px 0 0;
  border-top: 2px solid #F1F1F1;
}
/* カテゴリページ：事例ごとの枠（区切り線は枠側、タグ → 事例本体） */
.hc-page.hc-page--term .hc-caseItem {
  margin: 80px 0 0;
  padding: 45px 0 0;
  border-top: 2px solid #F1F1F1;
}
.hc-page.hc-page--term .hc-main > .hc-caseList:first-child > .hc-caseItem:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
.hc-page.hc-page--term .hc-caseItem .hc-case {
  margin: 45px 0 0;
  padding: 0;
  border-top: 0;
}
.hc-page.hc-page--term .hc-caseItem > .hc-case:first-child {
  margin-top: 0;
}
.hc-page .hc-client {
  margin: 0 0 60px;
  font-family: "Zen Old Mincho", "游明朝", "Yu Mincho", "YuMincho", "Hiragino Mincho Pro", serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: var(--hc-green);
}
.hc-page .hc-client a {
  color: inherit;
}
.hc-page .hc-client a:hover {
  opacity: 0.7;
}
.hc-page .hc-summary {
  margin: 0 0 45px;
}

/* 概要表 */
.hc-page .hc-spec {
  margin: 0;
  padding: 20px 66px 30px 57px;
  background-color: var(--hc-bg-gray);
}
.hc-page .hc-spec__row {
  display: flex;
  padding: 30px 0 28px;
  border-bottom: 1px solid var(--hc-line);
  font-size: 16px;
  line-height: 1.6;
  letter-spacing: 0.05em;
}
.hc-page .hc-spec dt {
  width: 125px;
  flex-shrink: 0;
  font-weight: 700;
  color: var(--hc-green);
}
.hc-page .hc-spec dd {
  margin: 0;
  flex: 1;
}

/* セクション */
.hc-page .hc-sec {
  margin: 80px 0 0;
}

/* 解決した課題 */
.hc-page .hc-issue__box {
  padding: 20px 24px;
  background-color: var(--hc-bg-tag);
}
.hc-page .hc-issue__list {
  list-style: none;
  margin: 0;
  padding: 27px 36px;
  background-color: #FFF;
}
.hc-page .hc-issue__list li {
  position: relative;
  padding-left: 1em;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.875;
}
.hc-page .hc-issue__list li:before {
  content: "・";
  position: absolute;
  left: 0;
}

/* 人物（お客様・担当者） */
.hc-page .hc-person {
  display: flex;
  align-items: center;
  margin: 0 0 40px;
}
.hc-page .hc-person__img {
  width: 315px;
  flex-shrink: 0;
  margin-right: 48px;
  overflow: hidden;
  border-radius: 10px;
  aspect-ratio: 315 / 177;
}
.hc-page .hc-person__img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hc-page .hc-person__tx p {
  font-size: 16px;
  line-height: 1.875;
  letter-spacing: 0.05em;
  color: var(--hc-green);
}

/* Q&A・FAQ共通 */
.hc-page .hc-qa__item,
.hc-page .hc-faq__item {
  background-color: var(--hc-bg-gray);
}
.hc-page .hc-qa__item + .hc-qa__item,
.hc-page .hc-faq__item + .hc-faq__item {
  margin-top: 24px;
}
.hc-page .hc-qa__item {
  padding: 25px 20px 35px 30px;
}
.hc-page .hc-qa__q,
.hc-page .hc-qa__a,
.hc-page .hc-faq__a {
  display: flex;
  align-items: flex-start;
}
.hc-page .hc-qa__a {
  margin-top: 18px;
}
.hc-page .hc-qa__mark {
  width: 33px;
  flex-shrink: 0;
  font-family: "Tenor Sans", sans-serif;
  font-size: 20px;
  line-height: 1.5;
  color: var(--hc-green);
}
.hc-page .hc-qa__a .hc-qa__mark,
.hc-page .hc-faq__a .hc-qa__mark {
  color: var(--hc-orange);
}
.hc-page .hc-qa__q p,
.hc-page .hc-faq__qtx {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: 0.1em;
  padding-top: 0.1em;
}
.hc-page .hc-qa__a p,
.hc-page .hc-faq__a p {
  font-size: 16px;
  line-height: 1.875;
  letter-spacing: 0.05em;
}

/* 補足PDF */
.hc-page .hc-pdf {
  margin: 30px 0 0;
}
.hc-page .hc-pdf a {
  color: var(--hc-green);
  font-weight: 700;
  text-decoration: underline;
}

/* FAQ（アコーディオン） */
.hc-page .hc-faq__q {
  position: relative;
  display: flex;
  align-items: flex-start;
  width: 100%;
  padding: 25px 70px 22px 30px;
  border: 0;
  background: none;
  color: #000;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}
.hc-page .hc-faq__icon {
  position: absolute;
  right: 26px;
  top: 34px;
  width: 20px;
  height: 20px;
}
.hc-page .hc-faq__icon:before,
.hc-page .hc-faq__icon:after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 20px;
  height: 2px;
  margin-top: -1px;
  background-color: var(--hc-green);
  transition: transform 0.3s ease-in-out;
}
.hc-page .hc-faq__icon:after {
  transform: rotate(90deg);
}
.hc-page .hc-faq__q[aria-expanded="true"] .hc-faq__icon:after {
  transform: rotate(0deg);
}
.hc-page .hc-faq__a {
  margin: 0 26px 0 30px;
  padding: 22px 0 30px;
  border-top: 1px solid var(--hc-line);
}
.hc-page .hc-faq__item.is-close .hc-faq__a {
  display: none;
}

/* SP */
@media screen and (max-width: 1100px) {
  .hc-page .hc-side {
    width: 220px;
  }
  .hc-page .hc-main {
    width: calc(100% - 260px);
  }
}
@media screen and (max-width: 768px) {
  .hc-page {
    padding-bottom: 60px;
  }
  .hc-page .hc-pageTitle {
    font-size: 22px;
    padding-bottom: 40px;
  }
  .hc-page .hc-layout {
    flex-direction: column-reverse;
  }
  .hc-page .hc-side,
  .hc-page .hc-main {
    width: 100%;
    max-width: none;
  }
  .hc-page .hc-side {
    margin-top: 60px;
  }
  .hc-page .hc-tx,
  .hc-page .hc-qa__a p,
  .hc-page .hc-faq__a p,
  .hc-page .hc-qa__q p,
  .hc-page .hc-faq__qtx,
  .hc-page .hc-issue__list li,
  .hc-page .hc-spec__row {
    font-size: 14px;
  }
  .hc-page .hc-heading {
    font-size: 18px;
    margin-bottom: 25px;
  }
  .hc-page .hc-lead {
    margin-top: 40px;
  }
  .hc-page .hc-lead__title {
    font-size: 18px;
    margin-bottom: 20px;
  }
  .hc-page .hc-photos {
    gap: 10px;
    margin-top: 30px;
  }
  .hc-page .hc-photo__cap {
    margin-top: 10px;
    font-size: 12px;
    letter-spacing: 0.05em;
  }
  .hc-page .hc-case {
    margin-top: 50px;
    padding-top: 30px;
  }
  .hc-page.hc-page--term .hc-caseItem {
    margin-top: 50px;
    padding-top: 30px;
  }
  .hc-page.hc-page--term .hc-caseItem .hc-case {
    margin-top: 30px;
    padding-top: 0;
  }
  .hc-page .hc-client {
    font-size: 22px;
    margin-bottom: 30px;
  }
  .hc-page .hc-spec {
    padding: 5px 20px 15px;
  }
  .hc-page .hc-spec__row {
    padding: 15px 0;
  }
  .hc-page .hc-spec dt {
    width: 80px;
  }
  .hc-page .hc-sec {
    margin-top: 50px;
  }
  .hc-page .hc-issue__box {
    padding: 10px;
  }
  .hc-page .hc-issue__list {
    padding: 15px 20px;
  }
  .hc-page .hc-person {
    display: block;
    margin-bottom: 25px;
  }
  .hc-page .hc-person__img {
    width: 100%;
    margin: 0 0 15px;
  }
  .hc-page .hc-qa__item {
    padding: 20px 15px;
  }
  .hc-page .hc-faq__q {
    padding: 18px 50px 16px 15px;
  }
  .hc-page .hc-faq__icon {
    right: 15px;
    top: 24px;
    width: 16px;
  }
  .hc-page .hc-faq__icon:before,
  .hc-page .hc-faq__icon:after {
    width: 16px;
  }
  .hc-page .hc-faq__a {
    margin: 0 15px;
    padding: 15px 0 20px;
  }
}
@media screen and (max-width: 520px) {
  .hc-page .hc-photos {
    grid-template-columns: 1fr;
    gap: 25px;
  }
}

/*---------------------------------------------
 大カテゴリページ（design4）　#content.hc-page--large 配下
 ※ layout.css の #content p（ID指定）に負けないよう #content から指定
---------------------------------------------*/
#content.hc-page--large .hc-lg-title {
  margin: 0 0 70px;
  text-align: center;
  font-family: "Zen Old Mincho", "游明朝", "Yu Mincho", "YuMincho", "Hiragino Mincho Pro", serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.1em;
  color: var(--hc-green);
}
#content.hc-page--large .hc-lg-wysiwyg p {
  margin: 0;
  padding: 0;
  font-size: 16px;
  line-height: 1.875;
}
#content.hc-page--large .hc-lg-wysiwyg p + p {
  margin-top: 1.875em;
}
#content.hc-page--large .hc-lg-wysiwyg a {
  color: var(--hc-green);
  font-weight: 700;
}
#content.hc-page--large .hc-lg-wysiwyg a:hover {
  text-decoration: underline;
}

/* 導入 */
#content.hc-page--large .hc-lg-intro {
  padding: 0 0 90px;
  text-align: center;
}
#content.hc-page--large .hc-lg-intro .hc-lg-title {
  margin-bottom: 80px;
}
#content.hc-page--large .hc-lg-intro__heading {
  margin: 0 0 30px;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.875;
}
/* 導入本文内リンク：メインカラー */
#content.hc-page--large .hc-lg-intro__body a {
  color: #007C4F;
}
/* AUN7 導入小見出し（large_intro_subheading）：company_about p.sub と同じ明朝。見出し→小見出し→本文 */
#content.hc-page--large .hc-lg-intro .hc-lg-subtitle {
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  font-family: "游明朝","Yu Mincho","游明朝体","YuMincho","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","HiraMinProN-W3","HGS明朝E","ＭＳ Ｐ明朝","MS PMincho",serif;
  color: #333;
  padding: 0 0 20px; /* 本文の上なので控えめ。参照(p.sub)は 0 0 60px */
}
@media screen and (max-width: 768px) {
  #content.hc-page--large .hc-lg-intro .hc-lg-subtitle {
    font-size: 18px;
    padding: 0 0 16px;
  }
}

/* 工事の流れ */
#content.hc-page--large .hc-lg-flow {
  padding: 95px 0 90px;
  background-color: var(--hc-bg-gray);
}
#content.hc-page--large .hc-lg-flow__steps {
  list-style: none;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  grid-template-rows: auto 1fr;
  gap: 10px 6px;
  margin: 0;
  padding: 32px 36px 32px 20px;
  background-color: var(--hc-bg-tag);
}
#content.hc-page--large .hc-lg-flow__step {
  --hc-lg-step: #297B5C;
  display: grid;
  grid-row: span 2;
  grid-template-rows: subgrid; /* ヘッダー高さを列間で揃える */
  row-gap: 10px;
  min-width: 0;
  list-style: none;
}
#content.hc-page--large .hc-lg-flow__step:nth-child(4n+2) { --hc-lg-step: #1B786A; }
#content.hc-page--large .hc-lg-flow__step:nth-child(4n+3) { --hc-lg-step: #44878F; }
#content.hc-page--large .hc-lg-flow__step:nth-child(4n) { --hc-lg-step: #32737D; }
/* ===== 病院カテゴリのみ：工事の流れ フローチャート色（2026-10-06 先方指定） ===== */
#content.hc-page--large .hc-lg-flow--hospital .hc-lg-flow__step { --hc-lg-step: #EF9E02; }                 /* 01（左） */
#content.hc-page--large .hc-lg-flow--hospital .hc-lg-flow__step:nth-child(4n+2) { --hc-lg-step: #EF8802; } /* 02 */
#content.hc-page--large .hc-lg-flow--hospital .hc-lg-flow__step:nth-child(4n+3) { --hc-lg-step: #EF6802; } /* 03 */
#content.hc-page--large .hc-lg-flow--hospital .hc-lg-flow__step:nth-child(4n) { --hc-lg-step: #D74D07; }   /* 04 */
#content.hc-page--large .hc-lg-flow--hospital .hc-lg-flow__items li:before { background-color: #EF8802; }
#content.hc-page--large .hc-lg-flow__head {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 93px;
  margin-right: -16px;
  padding: 10px 18px 10px 26px;
  background-color: var(--hc-lg-step);
  color: #FFF;
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 0 100%, 16px 50%);
}
#content.hc-page--large .hc-lg-flow__step:first-child .hc-lg-flow__head {
  padding-left: 18px;
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 0 100%);
}
#content.hc-page--large .hc-lg-flow__num {
  flex-shrink: 0;
  font-family: "Jost", "Roboto", sans-serif;
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
}
#content.hc-page--large .hc-lg-flow__title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0;
}
#content.hc-page--large .hc-lg-flow__lead {
  margin-top: 4px;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.4;
}
#content.hc-page--large .hc-lg-flow__items {
  list-style: none;
  margin: 0;
  padding: 24px 16px 24px 22px;
  background-color: #FFF;
}
#content.hc-page--large .hc-lg-flow__items li {
  position: relative;
  padding-left: 16px;
  list-style: none; /* layout.css の ol li{decimal} が入れ子に効くため */
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  color: #000;
}
#content.hc-page--large .hc-lg-flow__items li + li {
  margin-top: 12px;
}
#content.hc-page--large .hc-lg-flow__items li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.5em;
  width: 8px;
  height: 8px;
  background-color: var(--hc-lg-step);
}
#content.hc-page--large .hc-lg-flow__footer {
  margin-top: 80px;
  text-align: center;
}

@media screen and (max-width: 1100px) {
  #content.hc-page--large .hc-lg-flow__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
}
@media screen and (max-width: 768px) {
  #content.hc-page--large .hc-lg-title {
    margin-bottom: 40px;
    font-size: 22px;
  }
  #content.hc-page--large .hc-lg-intro {
    padding-bottom: 60px;
  }
  #content.hc-page--large .hc-lg-intro .hc-lg-title {
    margin-bottom: 40px;
  }
  #content.hc-page--large .hc-lg-intro,
  #content.hc-page--large .hc-lg-flow__footer {
    text-align: left;
  }
  #content.hc-page--large .hc-lg-wysiwyg p,
  #content.hc-page--large .hc-lg-intro__heading {
    font-size: 14px;
  }
  #content.hc-page--large .hc-lg-flow {
    padding: 60px 0;
  }
  #content.hc-page--large .hc-lg-flow__steps {
    grid-auto-flow: row;
    grid-template-rows: none;
    gap: 16px;
    padding: 16px;
  }
  #content.hc-page--large .hc-lg-flow__head,
  #content.hc-page--large .hc-lg-flow__step:first-child .hc-lg-flow__head {
    flex-direction: row;
    align-items: center;
    min-height: 0;
    margin-right: 0;
    padding: 14px 16px;
    clip-path: none;
  }
  #content.hc-page--large .hc-lg-flow__step {
    row-gap: 0;
  }
  #content.hc-page--large .hc-lg-flow__items {
    padding: 18px 16px;
  }
  #content.hc-page--large .hc-lg-flow__items li {
    font-size: 13px;
  }
  #content.hc-page--large .hc-lg-flow__footer {
    margin-top: 40px;
  }
}

/* 大カテゴリページ：工事事例ブロック（中＋事例のある小） */
#content.hc-page--large .hc-lg-cases {
  padding: 95px 0 0;
}
#content.hc-page--large .hc-lg-cases__box {
  padding: 60px 40px 80px;
  border-radius: 10px;
  background-color: var(--hc-bg-gray);
}
#content.hc-page--large .hc-lg-cases__title {
  display: flex;
  align-items: center;
  width: 320px;
  max-width: 100%;
  min-height: 77px;
  margin: 0 auto 60px;
  padding: 10px 20px;
  border-radius: 4px;
  background-color: var(--hc-ar-color, var(--hc-orange));
  color: #FFF;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.05em;
}
#content.hc-page--large .hc-lg-cases__list {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, 250px);
  justify-content: center;
  align-items: start;
  gap: 30px 24px;
  margin: 0;
  padding: 0;
}
#content.hc-page--large .hc-lg-cases__mid,
#content.hc-page--large .hc-lg-cases__sub li {
  list-style: none;
}
#content.hc-page--large .hc-lg-cases__midLabel {
  display: flex;
  align-items: center;
  min-height: 47px;
  padding: 8px 15px;
  background-color: var(--hc-ar-light, var(--hc-orange-light));
  color: #000;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.05em;
}
#content.hc-page--large .hc-lg-cases__sub {
  list-style: none;
  margin: 0;
  padding: 0;
}
#content.hc-page--large .hc-lg-cases__sub li {
  border-bottom: 1px solid var(--hc-line);
  background-color: #FFF;
}
#content.hc-page--large .hc-lg-cases__sub a {
  position: relative;
  display: block;
  padding: 12px 36px 12px 15px;
  color: #000;
  font-size: 14px;
  line-height: 1.5;
}
#content.hc-page--large .hc-lg-cases__sub a:after {
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  width: 12px;
  height: 11px;
  transform: translateY(-50%);
  background-color: var(--hc-ar-color, var(--hc-orange));
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16.414 14.828'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-width='2'%3E%3Cpath d='M1 7.414h14M9 1.414l6 6M9 13.414l6-6'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16.414 14.828'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-width='2'%3E%3Cpath d='M1 7.414h14M9 1.414l6 6M9 13.414l6-6'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain;
}
#content.hc-page--large .hc-lg-cases__sub a:hover {
  opacity: 0.75;
}
@media screen and (max-width: 1100px) {
  #content.hc-page--large .hc-lg-cases__list {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  }
}
@media screen and (max-width: 768px) {
  #content.hc-page--large .hc-lg-cases {
    padding-top: 60px;
  }
  #content.hc-page--large .hc-lg-cases__box {
    padding: 30px 16px 40px;
  }
  #content.hc-page--large .hc-lg-cases__title {
    min-height: 60px;
    margin-bottom: 30px;
  }
  #content.hc-page--large .hc-lg-cases__list {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

/*---------------------------------------------
 事例紹介トップ（/case/　design3）　#content.hc-page--archive 配下
 ※ layout.css の #content p／button（12px角・text-indent）を打ち消すため #content から指定
---------------------------------------------*/
/* 大カテゴリ色パレットは .hc-page 基底に定義（archive 以外のサイドメニューでも var(--hc-ar-*) を解決させるため。2026-10-06） */
#content.hc-page {
  --hc-ar-hospital: #EF8701;
  --hc-ar-hospital-light: #F9D19D;
  --hc-ar-clinic: #007C4F;
  --hc-ar-clinic-light: #D2E4E2;
  --hc-ar-equipment: #0B96AE;
  --hc-ar-equipment-light: #D3E5EC;
  --hc-ar-building: #6B2A9B;
  --hc-ar-building-light: #E7D8F2;
}
#content.hc-page--archive {
  padding-bottom: 0;
}
/* ===== サイドメニュー：病院以外は大カテゴリ色（2026-10-06 先方指定）。病院は現状(orange)維持 ===== */
.hc-page .hc-side--clinic { --hc-ar-color: var(--hc-ar-clinic); --hc-ar-light: var(--hc-ar-clinic-light); }
.hc-page .hc-side--medical-equipment { --hc-ar-color: var(--hc-ar-equipment); --hc-ar-light: var(--hc-ar-equipment-light); }
.hc-page .hc-side--building-park { --hc-ar-color: var(--hc-ar-building); --hc-ar-light: var(--hc-ar-building-light); }

.hc-page .hc-side--clinic .hc-side__top a,
.hc-page .hc-side--medical-equipment .hc-side__top a,
.hc-page .hc-side--building-park .hc-side__top a { background-color: var(--hc-ar-color); }

.hc-page .hc-side--clinic .hc-side__midLabel,
.hc-page .hc-side--medical-equipment .hc-side__midLabel,
.hc-page .hc-side--building-park .hc-side__midLabel { background-color: var(--hc-ar-light); }
/* ===== 大カテゴリ工事事例ブロック：病院以外はカテゴリ色（2026-10-06 先方指定）。病院は未設定→orange フォールバック ===== */
.hc-page .hc-lg-cases--clinic { --hc-ar-color: var(--hc-ar-clinic); --hc-ar-light: var(--hc-ar-clinic-light); }
.hc-page .hc-lg-cases--medical-equipment { --hc-ar-color: var(--hc-ar-equipment); --hc-ar-light: var(--hc-ar-equipment-light); }
.hc-page .hc-lg-cases--building-park { --hc-ar-color: var(--hc-ar-building); --hc-ar-light: var(--hc-ar-building-light); }
#content.hc-page--archive .hc-ar-title {
  margin: 0 0 80px;
  text-align: center;
  font-family: "Zen Old Mincho", "游明朝", "Yu Mincho", "YuMincho", "Hiragino Mincho Pro", serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.1em;
  color: var(--hc-green);
}

/* 導入 */
#content.hc-page--archive .hc-ar-intro {
  padding: 0 0 120px;
  text-align: center;
}
#content.hc-page--archive .hc-ar-intro__body p {
  margin: 0;
  padding: 0;
  font-size: 16px;
  line-height: 1.875;
}
#content.hc-page--archive .hc-ar-intro__body p + p {
  margin-top: 1.875em;
}
#content.hc-page--archive .hc-ar-intro__body a {
  color: var(--hc-green);
  font-weight: 700;
}
#content.hc-page--archive .hc-ar-intro__body a:hover {
  text-decoration: underline;
}

/* 改修・リニューアル・医療設備（4カラム） */
#content.hc-page--archive .hc-ar-works {
  padding: 95px 0 90px;
  background-color: var(--hc-bg-gray);
}
#content.hc-page--archive .hc-ar-works__box {
  padding: 24px 20px 40px;
  border-radius: 8px;
  background-color: var(--hc-bg-tag);
}
#content.hc-page--archive .hc-ar-cols {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: start;
  gap: 20px;
}
#content.hc-page--archive .hc-ar-col {
  --hc-ar-color: var(--hc-green);
  --hc-ar-light: var(--hc-bg-tag);
}
#content.hc-page--archive .hc-ar-col--hospital { --hc-ar-color: var(--hc-ar-hospital); --hc-ar-light: var(--hc-ar-hospital-light); }
#content.hc-page--archive .hc-ar-col--clinic { --hc-ar-color: var(--hc-ar-clinic); --hc-ar-light: var(--hc-ar-clinic-light); }
#content.hc-page--archive .hc-ar-col--equipment { --hc-ar-color: var(--hc-ar-equipment); --hc-ar-light: var(--hc-ar-equipment-light); }
#content.hc-page--archive .hc-ar-col--building { --hc-ar-color: var(--hc-ar-building); --hc-ar-light: var(--hc-ar-building-light); }

#content.hc-page--archive .hc-ar-col__head {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 76px;
  padding: 10px 50px 10px 18px;
  border-radius: 4px;
  background-color: var(--hc-ar-color);
  color: #FFF;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.05em;
}
#content.hc-page--archive a.hc-ar-col__head:after {
  content: "";
  position: absolute;
  right: 22px;
  top: 50%;
  width: 16px;
  height: 15px;
  transform: translateY(-50%);
  background: url("../images/common/arrow_w.svg") no-repeat center / contain;
}
#content.hc-page--archive a.hc-ar-col__head:hover {
  opacity: 0.75;
}
#content.hc-page--archive .hc-ar-col__list,
#content.hc-page--archive .hc-ar-col__sub {
  list-style: none;
  margin: 0;
  padding: 0;
}
#content.hc-page--archive .hc-ar-col__list {
  margin-top: 24px;
}
#content.hc-page--archive .hc-ar-col__mid,
#content.hc-page--archive .hc-ar-col__sub li {
  list-style: none; /* layout.css の ol li{decimal} 対策 */
}
#content.hc-page--archive .hc-ar-col__mid + .hc-ar-col__mid {
  margin-top: 15px;
}
#content.hc-page--archive .hc-ar-col__midLabel {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 47px;
  padding: 8px 15px;
  background-color: var(--hc-ar-light);
  color: #000;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.05em;
}
#content.hc-page--archive .hc-ar-col__sub {
  padding: 22px 15px 24px;
  background-color: #FFF;
}
#content.hc-page--archive .hc-ar-col__sub li + li {
  margin-top: 6px;
}
#content.hc-page--archive .hc-ar-col__sub a {
  color: var(--hc-ar-color);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.05em;
}
#content.hc-page--archive .hc-ar-col__sub a:hover {
  text-decoration: underline;
}

/* 病院カラム：中カテゴリ＝開閉ボタン */
#content.hc-page--archive button.hc-ar-col__toggle {
  position: relative;
  height: auto;
  margin: 0;
  padding-right: 40px;
  border: none;
  border-radius: 0;
  text-indent: 0;
  text-align: left;
  font-family: inherit;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
#content.hc-page--archive button.hc-ar-col__toggle:before,
#content.hc-page--archive button.hc-ar-col__toggle:after {
  content: "";
  position: absolute;
  right: 15px;
  top: 50%;
  width: 12px;
  height: 2px;
  margin-top: -1px;
  background-color: var(--hc-ar-color);
  transition: transform 0.2s;
}
#content.hc-page--archive button.hc-ar-col__toggle:after {
  transform: rotate(90deg);
}
#content.hc-page--archive .hc-ar-col__mid:not(.is-close) button.hc-ar-col__toggle:after {
  transform: rotate(0deg);
}
#content.hc-page--archive button.hc-ar-col__toggle:focus-visible {
  outline: 2px solid var(--hc-ar-color);
  outline-offset: 2px;
}
#content.hc-page--archive .hc-ar-col__mid.is-close .hc-ar-col__sub {
  display: none;
}
/* /case/ 4カラム：PCは病院のみドロワー。病院以外は常時展開の静的表示に戻す（SPは全カラムドロワー。2026-10-06） */
@media screen and (min-width: 769px) {
  #content.hc-page--archive .hc-ar-col:not(.hc-ar-col--hospital) .hc-ar-col__mid.is-close .hc-ar-col__sub { display: block; }
  #content.hc-page--archive .hc-ar-col:not(.hc-ar-col--hospital) button.hc-ar-col__toggle { pointer-events: none; cursor: default; padding-right: 15px; }
  #content.hc-page--archive .hc-ar-col:not(.hc-ar-col--hospital) button.hc-ar-col__toggle:before,
  #content.hc-page--archive .hc-ar-col:not(.hc-ar-col--hospital) button.hc-ar-col__toggle:after { display: none; }
}

@media screen and (max-width: 1100px) {
  #content.hc-page--archive .hc-ar-cols {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 20px;
  }
}
@media screen and (max-width: 768px) {
  #content.hc-page--archive .hc-ar-title {
    margin-bottom: 40px;
    font-size: 22px;
  }
  #content.hc-page--archive .hc-ar-intro {
    padding-bottom: 60px;
    text-align: left;
  }
  #content.hc-page--archive .hc-ar-intro__body p {
    font-size: 14px;
  }
  #content.hc-page--archive .hc-ar-intro__body .hc-pcBr {
    display: none;
  }
  #content.hc-page--archive .hc-ar-works {
    padding: 60px 0;
  }
  #content.hc-page--archive .hc-ar-works__box {
    padding: 20px 16px 30px;
  }
  #content.hc-page--archive .hc-ar-cols {
    grid-template-columns: 1fr;
  }
  #content.hc-page--archive .hc-ar-col__head {
    min-height: 60px;
  }
}

/* 事例紹介トップ：MV背景
   .pageMain は header.php（pageTitle()）で #container の直前に出るため #content の配下に入らない。
   直後の #container が #content.hc-page--archive を持つ .pageMain だけに限定する（layout.css の SP 用 .pageMain 背景より詳細度が高い）
   トーンは既存サブページMVと同じく画像側に焼き込み済み（CSSオーバーレイなし） */
.pageMain:has(+ #container > #content.hc-page--archive) {
  background-image: url("../images/content/case_mv.webp");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

/* 事例紹介トップ：お客様の声（design3。4カラムの後・最大3件）
   カードは 1〜2件でも中央に寄るよう flex ＋ 3列分の固定幅。ボタンは共通 .btn（緑枠・矢印） */
#content.hc-page--archive .hc-ar-voice {
  padding: 90px 0 90px;
}
#content.hc-page--archive .hc-ar-voice__list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 25px;
  margin: 0;
  padding: 0;
}
#content.hc-page--archive .hc-ar-voice__card {
  list-style: none; /* layout.css の ol li{decimal} 対策 */
  width: calc((100% - 50px) / 3);
}
#content.hc-page--archive .hc-ar-voice__box {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 111px;
  padding: 15px 20px;
  border-radius: 8px;
  background-color: #F0F7F7;
  color: var(--hc-green);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.1em;
  text-align: center;
}
#content.hc-page--archive .hc-ar-voice__part {
  display: inline-block;
}
#content.hc-page--archive a.hc-ar-voice__box {
  transition: opacity 0.3s;
}
#content.hc-page--archive a.hc-ar-voice__box:hover {
  opacity: 0.75;
}
#content.hc-page--archive .hc-ar-voice__btn {
  margin: 80px auto 0;
}
@media screen and (max-width: 768px) {
  #content.hc-page--archive .hc-ar-voice {
    padding: 60px 0;
  }
  #content.hc-page--archive .hc-ar-voice__list {
    gap: 10px;
  }
  #content.hc-page--archive .hc-ar-voice__card {
    width: 100%;
  }
  #content.hc-page--archive .hc-ar-voice__box {
    min-height: 70px;
    font-size: 14px;
  }
  #content.hc-page--archive .hc-ar-voice__btn {
    margin-top: 40px;
  }
}

/* 事例紹介トップ：プロデュース事例（design3。病医院＝グレー帯 4×2段／ヘルスケア＝白 4×1段）
   カード 248×74 の枠線ボタン。hover は共通 .btn と同じ（緑地・白文字・白矢印） */
#content.hc-page--archive .hc-ar-produce {
  padding: 90px 0 90px;
}
#content.hc-page--archive .hc-ar-produce--hospital {
  background-color: #F9FBFB;
}
#content.hc-page--archive .hc-ar-produce--service {
  background-color: #FFF;
}
#content.hc-page--archive .hc-ar-produce__list {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 248px));
  justify-content: center;
  gap: 63px 35px;
  margin: 0;
  padding: 0;
}
#content.hc-page--archive .hc-ar-produce__card {
  list-style: none; /* layout.css の ol li{decimal} 対策 */
}
#content.hc-page--archive .hc-ar-produce__card a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 100%;
  min-height: 74px;
  padding: 10px 40px 10px 18px; /* 左は design3 実測（枠外側から文字まで約20px − 枠2px） */
  border: 2px solid #007C4F;
  border-radius: 5px;
  background-color: #FFF;
  color: #007C4F;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.05em;
  text-align: left;
  transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}
#content.hc-page--archive .hc-ar-produce__card a:before {
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  width: 15px;
  height: 15px;
  transform: translateY(-50%);
  background: url("../images/common/arrow.svg") no-repeat center;
}
#content.hc-page--archive .hc-ar-produce__card a:hover {
  opacity: 1;
  background-color: #007C4F;
  color: #FFF;
}
#content.hc-page--archive .hc-ar-produce__card a:hover:before {
  background-image: url("../images/common/arrow_w.svg");
}
@media screen and (max-width: 768px) {
  #content.hc-page--archive .hc-ar-produce {
    padding: 60px 0;
  }
  #content.hc-page--archive .hc-ar-produce__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  #content.hc-page--archive .hc-ar-produce__card a {
    min-height: 64px;
    padding: 10px 30px 10px 18px;
    font-size: 14px;
  }
  #content.hc-page--archive .hc-ar-produce__card a:before {
    right: 10px;
    width: 12px;
    height: 12px;
    background-size: contain;
  }
}

/* サイドナビ（SP）：画面下部の固定バー（大カテゴリ名）＋タップで中・小カテゴリをポップアップ
   開閉は js/hospital_case.js（.hc-side に is-open）。PC（769px以上）は従来どおり */
@media screen and (max-width: 768px) {
  .hc-page .hc-side {
    --hc-bar-h: 56px;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    margin-top: 0;
    z-index: 60;
    background-color: #FFF;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.12);
  }
  /* 開いている間は背面を暗くする（タップで閉じる） */
  .hc-page .hc-side:before {
    content: "";
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
  }
  .hc-page .hc-side.is-open:before {
    opacity: 1;
    visibility: visible;
  }
  .hc-page .hc-side__nav {
    position: relative;
  }
  /* 固定バー */
  .hc-page .hc-side__top {
    position: relative;
    z-index: 2;
  }
  .hc-page .hc-side__top a {
    min-height: var(--hc-bar-h);
    border-radius: 0;
    font-size: 15px;
  }
  .hc-page .hc-side__top a:hover {
    opacity: 1;
  }
  /* インジケータ：既存の白矢印を上向き（閉）／下向き（開）に */
  .hc-page .hc-side__top a:after {
    transform: translateY(-50%) rotate(-90deg);
    transition: transform 0.3s;
  }
  .hc-page .hc-side.is-open .hc-side__top a:after {
    transform: translateY(-50%) rotate(90deg);
  }
  /* ポップアップ（中カテゴリ以降）：バーの上に下からせり上がる */
  .hc-page .hc-side__list {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    z-index: 1;
    margin: 0;
    padding: 20px 20px 24px;
    max-height: calc(100vh - var(--hc-bar-h) - 90px);
    max-height: calc(100dvh - var(--hc-bar-h) - 90px);
    overflow-y: auto;
    overscroll-behavior: contain;
    background-color: #FFF;
    border-radius: 12px 12px 0 0;
    transform: translateY(20px);
    opacity: 0;
    visibility: hidden;
    transition: transform 0.3s, opacity 0.3s, visibility 0.3s;
  }
  .hc-page .hc-side.is-open .hc-side__list {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
  }
  /* バーで本文末尾・フッター最下部が隠れないよう、バー高さ分を確保 */
  body:has(.hc-page .hc-side) {
    padding-bottom: 56px;
  }
  /* ページトップボタンをバーの上へ。bottom は script.js がインラインで動かす（SP 30px／隠すとき -200px）ため transform でずらす。ポップアップ中は隠す */
  body:has(.hc-page .hc-side) #page-top {
    transform: translateY(-56px);
  }
  body:has(.hc-page .hc-side.is-open) #page-top {
    display: none !important;
  }
  /* ハンバーガーメニュー（.menus_sp、z-index 4）を開いている間はバーを隠す */
  body:has(.menus_sp.active) .hc-page .hc-side {
    display: none;
  }
}