@charset "utf-8";

/* ========================================================================
	page.css  -  下層ページ（サイン事業部）
======================================================================== */

/* ------------------------------------------------------------------
	HERO
------------------------------------------------------------------ */
.p-shero {
  position: relative;
  min-height: 760px;
  display: flex;
  align-items: center;
  padding: 120px 0;
  color: #fff;
  overflow: hidden;
}
.p-shero__bg {
  position: absolute;
  inset: 0;
  z-index: -2;
}
.p-shero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-shero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    90deg,
    rgba(20, 24, 34, 0.78) 0%,
    rgba(20, 24, 34, 0.45) 55%,
    rgba(20, 24, 34, 0.25) 100%
  );
}
.p-shero__en {
  font-family: var(--ff-en);
  font-size: 2.2rem;
  letter-spacing: 0.1em;
  color: #fff;
  margin-bottom: 18px;
  text-shadow: 0 4px 30px rgba(28, 31, 38, 0.6);
}
.p-shero__catch {
  font-family: var(--ff-mincho);
  font-weight: 700;
  font-size: 4.8rem;
  line-height: 1.45;
  letter-spacing: 0.06em;
  text-shadow: 0 4px 30px rgba(0, 0, 0, 0.5);
}
.p-shero__lead {
  max-width: 620px;
  margin-top: 26px;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.5);
}
/* --- メインビジュアルのスライド（背景＋リード文が切り替わる）---
   背景・リード文ともクロスフェード。左右ドラッグ／スワイプでも切り替え可能 */
.p-shero--slider {
  /* 横方向のドラッグを拾いつつ、縦スクロールは邪魔しない */
  touch-action: pan-y;
  cursor: grab;
}
.p-shero--slider.is-dragging {
  cursor: grabbing;
  user-select: none;
  -webkit-user-select: none;
}
/* ボタンやリンクの上は通常のカーソルに戻す */
.p-shero--slider a,
.p-shero--slider button {
  cursor: pointer;
}
.p-shero__bg-item {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.2s var(--ease);
}
.p-shero__bg-item.is-active {
  opacity: 1;
}
/* リード文は重ねて配置。枠の高さは一番長い文に合わせて固定されるので
   下のボタンが切り替わりのたびに動かない */
.p-shero__leads {
  display: grid;
}
.p-shero__leads > .p-shero__lead {
  grid-area: 1 / 1;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition:
    opacity 0.8s var(--ease),
    transform 0.8s var(--ease),
    visibility 0.8s var(--ease);
}
.p-shero__leads > .p-shero__lead.is-active {
  opacity: 1;
  visibility: visible;
  transform: none;
}
/* 現在位置のドット */
.p-shero__dots {
  display: flex;
  gap: 10px;
  margin-top: 26px;
}
.p-shero__dot {
  width: 10px;
  height: 10px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  transition:
    background 0.3s var(--ease),
    transform 0.3s var(--ease);
}
.p-shero__dot.is-active {
  background: #fff;
  transform: scale(1.15);
}
.p-shero__dot:hover {
  background: rgba(255, 255, 255, 0.6);
}
/* 動きを減らす設定の環境では切り替えアニメーションを無効化 */
@media (prefers-reduced-motion: reduce) {
  .p-shero__bg-item,
  .p-shero__leads > .p-shero__lead {
    transition: none;
  }
}


.p-shero__btns {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 38px;
}
.p-shero__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 230px;
  padding: 16px 34px;
  border-radius: 40px;
  font-size: 1.6rem;
  letter-spacing: 0.05em;
  transition: opacity 0.3s var(--ease);
}
.p-shero__btn--primary {
  background: var(--navy);
  color: #fff;
}
.p-shero__btn--secondary {
  background: #fff;
  color: var(--ink);
}
.p-shero__btn:hover {
  opacity: 0.85;
}
.p-shero__tag {
  margin-top: 30px;
  font-size: 1.4rem;
  letter-spacing: 0.06em;
  color: rgba(255, 255, 255, 0.85);
}

/* ------------------------------------------------------------------
	ABOUT
------------------------------------------------------------------ */
.p-sabout {
  padding: 110px 0;
  background: linear-gradient(180deg, #fff, #f3f3f3);
}
.p-sabout .c-label {
  justify-content: left;
}
.p-sabout__heading {
  font-size: 3.6rem;
}
.p-sabout__sub {
  margin-top: 24px;
  text-align: center;
  font-size: 1.7rem;
  line-height: 2;
  letter-spacing: 0.05em;
}
.p-sabout__cols {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: min(80/1440 * 100vw, 80px);
  margin-top: 50px;
  padding: 0 min(80/1440 * 100vw, 80px);
}
.p-sabout__img {
  border-radius: 4px;
  overflow: hidden;
}
.p-sabout__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-sabout__text {
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
}
.p-sabout__list {
  margin-top: 26px;
	margin-bottom: 15px;
}
.p-sabout__list li {
  position: relative;
  padding: 0px 0 0px 30px;
  line-height: 2;
  font-size: 1.5rem;
  letter-spacing: 0.04em;
}
.p-sabout__list li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 50%;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  transform: translateY(-50%);
  background: var(--navy-light);
}

/* ------------------------------------------------------------------
	PPF ABOUT：対応サービス（チェックリスト）＋NDA帯
------------------------------------------------------------------ */
.p-ppfsvc__title {
  margin-top: 34px;
  font-family: var(--ff-jp);
  font-weight: 500;
  font-size: 2.8rem;
  line-height: 1.4;
  letter-spacing: 0.1em;
  color: var(--ink);
}
.p-ppfsvc__list {
  margin-top: 16px;
}
.p-ppfsvc__list li {
  position: relative;
  padding: 12px 0 12px 34px;
  font-size: 1.6rem;
  line-height: 1.7;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.p-ppfsvc__list li::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 50%;
  width: 7px;
  height: 13px;
  border-right: 2px solid var(--navy);
  border-bottom: 2px solid var(--navy);
  transform: translateY(-65%) rotate(45deg);
}
.p-ppfsvc__nda {
    margin: 0 min(80 / 1440 * 100vw, 80px);
    margin-top: 56px;
    padding: 26px 20px;
    text-align: center;
    background: #fff;
}
.p-ppfsvc__nda-text {
  font-size: 1.6rem;
  font-weight: 800;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--navy);
}
.p-ppfsvc__mark {
  color: var(--navy);
  font-size: 0.85em;
  vertical-align: super;
}
.p-ppfsvc__note {
  margin: 0 min(80 / 1440 * 100vw, 80px);
  margin-top: 25px;
  font-size: 1.4rem;
  line-height: 1.8;
  letter-spacing: 0.04em;
}

@media screen and (max-width: 767px) {
  .p-ppfsvc__nda {
    margin: initial;
    margin-top: 25px;
    padding: 15px 10px;
  }

  .p-ppfsvc__nda-text {
    font-size: 1.5rem;
  }

  .p-ppfsvc__note {
    margin: initial;
    margin-top: 15px;
  }
}

/* ------------------------------------------------------------------
	COURSE（コース紹介）
------------------------------------------------------------------ */
.p-scourse {
  padding: 110px 0;
  background: linear-gradient(180deg, #eff4fa 0%, #f2f2f2 100%);
}
.p-scourse__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-top: 56px;
}
.c-course {
  display: flex;
  flex-direction: column;
  background: #fff;
  padding: 41px 0 42px;
}
.c-course__name {
  padding: 0 30px;
  text-align: center;
  font-weight: 500;
  font-size: 2.4rem;
  line-height: 1.33;
	height: 1.5em;
  letter-spacing: 0.05em;
  color: var(--navy);
}
.c-course__img {
  margin-top: 36px;
  aspect-ratio: 380/210;
  overflow: hidden;
}
.c-course__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s var(--ease);
}
.c-course:hover .c-course__img img {
  transform: scale(1.05);
}
.c-course__price {
  margin-top: 32px;
  padding: 0 30px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.c-course__term {
  font-size: 1.8rem;
  color: var(--navy);
}
.c-course__sep {
  font-size: 1.8rem;
}
.c-course__num {
  font-size: 2.4rem;
  letter-spacing: 0.05em;
}
.c-course__tax {
  font-size: 1.8rem;
}
.c-course__note {
  margin-top: 11px;
  padding: 0 30px;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--ink);
}

/* ------------------------------------------------------------------
	CURRICULUM（カリキュラム詳細）
------------------------------------------------------------------ */
.p-scurriculum {
  padding: 110px 0;
  background: #fff;
}
.p-scurriculum .c-label {
  justify-content: left;
}
.p-scurriculum__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 50px;
}
.c-ctab {
  display: inline-flex;
  align-items: center;
  height: 40px;
  padding: 0 16px;
  border-radius: 40px;
  background: #fff;
  border: 1px solid #858585;
  color: #858585;
  font-family: var(--ff-jp);
  font-size: 1.6rem;
  letter-spacing: 0.05em;
  cursor: pointer;
  transition:
    background 0.3s var(--ease),
    color 0.3s var(--ease),
    border-color 0.3s var(--ease);
}
.c-ctab:hover {
  border-color: var(--navy);
  color: var(--navy);
}
.c-ctab.is-active {
  background: var(--navy);
  border-color: var(--navy);
  color: #fff;
}
.p-scurriculum__panel {
  margin-top: 38px;
}
.p-scurriculum__panel[hidden] {
  display: none;
}
.p-scurriculum__panel-head {
  font-weight: 500;
  font-size: 2.4rem;
  line-height: 1.33;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.p-scurriculum__days {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px 80px;
  margin-top: 30px;
}
.c-cday {
  background: #eff4fa;
  padding: 33px 40px 36px;
  min-height: 288px;
}
.c-cday__label {
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.c-cday__list {
  margin-top: 14px;
}
.c-cday__list li {
  position: relative;
  padding: 0 0 0 26px;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.c-cday__list li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--navy-light);
}

/* ------------------------------------------------------------------
	INSTRUCTOR（講師紹介）
------------------------------------------------------------------ */
.p-sinstructor {
  padding: 110px 0;
  background: #fff;
}
.p-sinstructor .c-label {
  justify-content: left;
}
.p-sinstructor__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 48px;
  margin-top: 50px;
}
.c-instructor {
  background: #fff;
}
.c-instructor__img {
  aspect-ratio: 560/346;
  overflow: hidden;
}
.c-instructor__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.c-instructor__body {
  padding: 34px 40px 0;
}
.c-instructor__role {
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.c-instructor__text {
  margin-top: 13px;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--ink);
}

/* ------------------------------------------------------------------
	共通：画像カード（初めての方へ）
------------------------------------------------------------------ */
.p-sfirst {
  padding: 110px 0;
  background: #fff;
}
.p-sfirst .c-label {
  justify-content: start;
}
.p-sfirst__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 56px;
}
/* 画像カード：テキスト量に追従（はみ出し防止）。画像は背面absolute、
   本文はflexで上＝タイトル / 下＝説明文。グリッドで全カード同じ高さに揃う。 */
.c-imgcard {
  position: relative;
  display: flex;
  border-radius: 4px;
  overflow: hidden;
  min-height: 300px;
  color: #fff;
  transition: transform 0.4s var(--ease);
}
.c-imgcard__img {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.c-imgcard__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.c-imgcard::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(
    180deg,
    rgba(20, 24, 34, 0.25),
    rgba(20, 24, 34, 0.78)
  );
}
.c-imgcard__body {
  position: relative;
  z-index: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  padding: 46px 24px 30px;
}
.c-imgcard__title {
  text-align: center;
  font-weight: 500;
  font-size: 3.2rem;
  line-height: 1.25;
  letter-spacing: 0.1em;
}
.c-imgcard__text {
  margin-top: auto;
  padding-top: 28px;
  text-align: left;
  font-size: 1.6rem;
  line-height: 1.9;
  letter-spacing: 0.05em;
}
/* .c-imgcard:hover {
  transform: translateY(-6px);
  opacity: 1;
} */

/* ------------------------------------------------------------------
	提供サービス / 看板製作について（カード）
------------------------------------------------------------------ */
.p-sservice {
  padding: 110px 0;
  background: linear-gradient(180deg, #eff4fa 0%, #f2f2f2 100%);
}
.p-sservice .c-label {
  justify-content: left;
}
.p-sservice__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px 30px;
  margin-top: 56px;
}
.p-sknow__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-top: 56px;
}
.c-svc {
  display: block;
  color: var(--ink);
}
.c-svc__img {
  border-radius: 4px;
  overflow: hidden;
  aspect-ratio: 320/200;
}
.c-svc__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s var(--ease);
}
.c-svc:hover {
  opacity: 1;
}
/* .c-svc:hover .c-svc__img img {
  transform: scale(1.05);
} */
.c-svc__title {
  margin-top: 18px;
  font-weight: 500;
  font-size: 1.9rem;
  line-height: 1.4;
  letter-spacing: 0.04em;
  text-align: center;
}
.c-svc__text {
  margin-top: 12px;
  font-size: 1.4rem;
  line-height: 1.8;
  letter-spacing: 0.03em;
}

/* ------------------------------------------------------------------
	施工事例（横並びカード）
------------------------------------------------------------------ */
.p-sworks {
  padding: 110px 0;
  background: #fff;
}
.p-sworks .c-label {
  justify-content: left;
}
.p-sworks__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 48px 40px;
  margin-top: 56px;
}
.c-case2 {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  color: var(--ink);
}
.c-case2__img {
  border-radius: 4px;
  overflow: hidden;
  aspect-ratio: 320/230;
}
.c-case2__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.c-case2:hover {
  opacity: 1;
}
.c-case2__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.c-chip2 {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 4px 16px;
  border: 1px solid var(--navy);
  border-radius: 40px;
  font-size: 1.4rem;
  line-height: 1;
  color: var(--navy);
  letter-spacing: 0.05em;
}
.c-chip2--type {
  border-color: var(--navy);
  color: var(--navy);
}
.c-case2__title {
  margin-top: 14px;
  font-weight: 500;
  font-size: 2rem;
  letter-spacing: 0.05em;
}
.c-case2__text {
  margin-top: 10px;
  font-size: 1.4rem;
  line-height: 1.8;
  letter-spacing: 0.03em;
  color: #3a3f4b;
}
.p-sworks__empty {
  margin-top: 56px;
  text-align: center;
  font-size: 1.6rem;
  line-height: 1.9;
  color: #5a6072;
}
.p-sworks__foot {
  margin-top: 50px;
  text-align: center;
}

/* ------------------------------------------------------------------
	施工料金の目安（PRICE / 濃紺背景＋白カード）
------------------------------------------------------------------ */
.p-sprice {
  position: relative;
  padding: 110px 0;
  background: #2b3c5b;
  color: #fff;
  overflow: hidden;
}
.p-sprice__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.p-sprice__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.5;
}
.p-sprice::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(
    180deg,
    rgba(28, 38, 60, 0.82),
    rgba(28, 38, 60, 0.7)
  );
}
.p-sprice > .dl-inner {
  position: relative;
  z-index: 1;
}
.p-sprice .c-label {
  justify-content: left;
}
.p-sprice .c-heading {
  color: #fff;
}
/* 濃紺背景：ラベル文字を白、矢印を明色のCSS三角に差し替え */
.p-sprice .c-label__en {
  color: #fff;
}
.p-sprice .c-label__en::before {
  background: none;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 9px;
  border-color: transparent transparent transparent var(--navy-light);
}
.p-sprice__lead {
  margin-top: 24px;
  text-align: center;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
  color: rgba(255, 255, 255, 0.88);
}
.p-sprice__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-top: 56px;
}
.c-price {
  background: #fff;
  border-radius: 6px;
  padding: 40px 30px;
  text-align: center;
  color: var(--ink);
}
.c-price__title {
  font-weight: 700;
  font-size: 2rem;
  letter-spacing: 0.06em;
  color: var(--navy);
}
.c-price__value {
  margin-top: 18px;
  font-weight: 700;
  font-size: 3.6rem;
  letter-spacing: 0.02em;
  color: var(--ink);
}
.c-price__note {
  margin-top: 18px;
  font-size: 1.4rem;
  line-height: 1.8;
  letter-spacing: 0.04em;
  color: #5a6072;
}

/* ------------------------------------------------------------------
	選ばれる理由（reasonカード）
------------------------------------------------------------------ */
.p-sstrength {
  padding: 110px 0;
  background: #fff;
}
.p-sstrength .c-label {
  justify-content: left;
}
.p-sstrength__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
  margin-top: 56px;
}
/* トップページのc-reasonと同形式（番号をアイコン円の左上に重ねて左寄せ）*/
.c-reason {
  position: relative;
  text-align: center;
  padding-top: 12px;
}
.c-reason__num {
  position: absolute;
  top: 0;
  left: calc(50% - 70px);
  z-index: 2;
  text-align: left;
  line-height: 1;
  font-family: var(--ff-en);
  color: var(--ink);
}
.c-reason__num-label {
  display: block;
  font-size: 1.4rem;
  letter-spacing: 0.3em;
}
.c-reason__num-value {
  display: block;
  margin-top: 4px;
  font-size: 4rem;
  letter-spacing: 0.2em;
}
.c-reason__icon {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 140px;
  height: 140px;
  margin: 28px auto 0;
  border-radius: 50%;
  background: #eef1f7;
}
.c-reason__icon img {
  width: auto;
  height: 58px;
}
.c-reason__title {
  margin-top: 26px;
  font-weight: 500;
  font-size: 1.9rem;
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: var(--navy);
}
.c-reason__text {
  margin-top: 16px;
  font-size: 1.4rem;
  line-height: 1.8;
  text-align: left;
}
/* FLOW（施工の流れ：reasonカードを5ステップで流用）*/
.p-sflow .c-label {
  justify-content: center;
}
.p-sflow__list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  margin-top: 56px;
}
.p-sflow__list .c-reason__num {
  color: #aeb6c2;
}
.p-sflow__list .c-reason__text {
  text-align: center;
}
/* アイコン画像は縦長・横長どちらでも円内に収まるよう両辺をmaxで制限 */
.p-sflow__list .c-reason__icon img,
.p-sflow__list .c-reason__icon svg {
  width: auto;
  height: auto;
  max-width: 64px;
  max-height: 58px;
  object-fit: contain;
}

/* ------------------------------------------------------------------
	看板製作・施工について（KNOWLEDGE）
------------------------------------------------------------------ */
.p-sknow {
  padding: 110px 0;
  background: linear-gradient(180deg, #eff4fa 0%, #f2f2f2 100%);
}
.p-sknow .c-label {
  justify-content: left;
}

/* maintenance（独立セクション）*/

.p-smaint {
  padding: 80px 0;
  background: #f2f2f2;
}
.p-smaint__feature {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 520px);
  gap: 50px;
  align-items: center;
  padding: 48px 56px;
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 14px 40px rgba(28, 31, 38, 0.06);
}
.p-smaint__body .c-label {
  justify-content: flex-start;
}
.p-smaint__title {
  margin-top: 14px;
  font-weight: 500;
  font-size: 2.8rem;
  line-height: 1.4;
  letter-spacing: 0.06em;
}
.p-smaint__text {
  margin-top: 22px;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
	margin-bottom: 15px;
}
.p-smaint__img {
  border-radius: 4px;
  overflow: hidden;
  aspect-ratio: 560/360;
}
.p-smaint__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* 法人の方へ：見出し・本文をラベル文字の左端に揃える */
#business .p-smaint__title,
#business .p-smaint__text {
  padding-left: 22px;
}
/* 法人の方へ：画像内キャプション */
.p-sbiz__img {
  position: relative;
}
.p-sbiz__note {
  position: absolute;
  left: 22px;
  bottom: 18px;
  z-index: 1;
  color: #fff;
  font-size: 1.3rem;
  letter-spacing: 0.04em;
  line-height: 1.6;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
}

/* ------------------------------------------------------------------
	VIDEO
------------------------------------------------------------------ */
.p-svideo {
  padding: 110px 0;
  background: #f2f2f2;
}
.p-svideo .c-label {
  justify-content: left;
}
.p-svideo__frame {
  position: relative;
  max-width: 1000px;
  margin: 50px auto 0;
  border-radius: 6px;
  overflow: hidden;
  aspect-ratio: 1000/560;
  box-shadow: 0 20px 50px rgba(28, 31, 38, 0.18);
}
.p-svideo__frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-svideo__play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  line-height: 0;
  transition: transform 0.3s var(--ease);
}
.p-svideo__play:hover {
  transform: translate(-50%, -50%) scale(1.08);
}

/* ------------------------------------------------------------------
	FAQ（アコーディオン）
------------------------------------------------------------------ */
.p-sfaq {
  padding: 110px 0;
  background: #fff;
}
.p-sfaq .c-label {
  justify-content: left;
}
.p-sfaq__list {
  max-width: 1200px;
  margin: 50px auto 0;
}
/* 常時表示のQ&A（アコーディオンなし）*/
.c-faq + .c-faq {
  margin-top: 10px;
}
.c-faq__q,
.c-faq__a {
  display: grid;
  grid-template-columns: 56px 1fr;
  align-items: start;
  gap: 0 18px;
  padding: 24px 0;
}
.c-faq__q {
  border-bottom: 1px solid #d9d9d9;
}
.c-faq__mark {
  font-family: var(--ff-en);
  line-height: 1;
}
.c-faq__q .c-faq__mark {
  color: var(--navy);
  font-size: 3.6rem;
  letter-spacing: 0.05em;
}
.c-faq__a .c-faq__mark {
  color: var(--navy-light);
  font-size: 2rem;
  text-align: center;
  line-height: 1.8;
}
.c-faq__qtext {
  font-weight: 700;
  font-size: 1.8rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.c-faq__atext {
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--ink);
}

/* ------------------------------------------------------------------
	NEWS
------------------------------------------------------------------ */
.p-snews {
  position: relative;
  padding: 100px 0;
  background: #f2f2f2;
  background: url(../../image/page/sign/case-news-bg.webp) no-repeat center;
  background-size: cover;
  background-color: #f2f2f2;
  background-blend-mode: soft-light, normal;
}
.p-snews__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
}
.p-snews__head-left {
  flex-shrink: 0;
}
.p-snews__head .c-heading {
  margin-top: 8px;
}
.p-snews__lead {
  font-size: 1.5rem;
  line-height: 1.9;
  letter-spacing: 0.04em;
}
.p-snews__list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 44px;
}
.p-snews .c-news-row {
  background: #fff;
  border: none;
  border-radius: 50px;
  box-shadow: 0 6px 20px rgba(28, 31, 38, 0.04);
  transition:
    box-shadow 0.3s var(--ease),
    transform 0.3s var(--ease);
}
.p-snews .c-news-row:hover {
  box-shadow: 0 10px 26px rgba(28, 31, 38, 0.08);
  transform: translateY(-2px);
}
.p-snews .c-news-row__link {
  display: flex;
  align-items: center;
  gap: 28px;
  padding: 22px 40px;
}
.p-snews .c-news-row__date {
  font-size: 1.5rem;
  color: #5a6072;
  flex-shrink: 0;
}
.p-snews .c-news-row__title {
  font-size: 1.55rem;
  letter-spacing: 0.04em;
}
.p-snews__empty {
  margin-top: 44px;
  text-align: center;
  font-size: 1.6rem;
  line-height: 1.9;
  color: #5a6072;
}
.p-snews__foot {
  margin-top: 44px;
  text-align: center;
}
/* PPF用：お知らせ背景（サインとは別画像）*/
.p-snews--ppf {
  background-image: url(../../image/page/ppf/news_bg.webp);
}

/* 海外のお客様へ（白背景・黒文字）*/
.p-sglobal {
  padding: 100px 0;
  background: #fff;
}
.p-sglobal__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 505px);
  gap: 60px;
  align-items: center;
}
.p-sglobal .c-label {
  justify-content: flex-start;
}
.p-sglobal__title {
  margin-top: 18px;
  font-family: var(--ff-jp);
  font-weight: 500;
  font-size: 4rem;
  line-height: 1.3;
  letter-spacing: 0.1em;
  color: var(--ink);
}
.p-sglobal__text {
  margin-top: 24px;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.p-sglobal__text + .p-sglobal__text {
  margin-top: 20px;
	margin-bottom: 15px;
}
.p-sglobal__img {
  border-radius: 4px;
  overflow: hidden;
  aspect-ratio: 640/460;
}
.p-sglobal__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ------------------------------------------------------------------
	CTA（トップと共通デザイン）
------------------------------------------------------------------ */
/* CTA（CONTACT）は common.css に共通化 */

/* ========================================================================
	Responsive
======================================================================== */
@media screen and (min-width: 768px) and (max-width: 1100px) {
  .p-sservice__grid,
  .p-sworks__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .p-sknow__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .p-sstrength__list {
    grid-template-columns: repeat(2, 1fr);
  }
  .p-sflow__list {
    grid-template-columns: repeat(3, 1fr);
    row-gap: 48px;
  }
  .p-shero__catch {
    font-size: 4rem;
  }
  .p-snews__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  /* コース紹介（3カラム維持・余白を詰める） */
  .p-scourse__grid {
    gap: 20px;
  }
	.c-course__name {
		height: initial;
	}
  .c-course__name,
  .c-course__price,
  .c-course__note {
    padding: 0 20px;
  }
  /* カリキュラム（2カラム維持・列間を詰める） */
  .p-scurriculum__days {
    gap: 30px 40px;
  }
  .c-cday {
    padding: 28px 28px 30px;
    min-height: 0;
  }
  /* 講師紹介（2カラム維持・列間を詰める） */
  .p-sinstructor__grid {
    gap: 30px;
  }
  .c-instructor__body {
    padding: 26px 24px 0;
  }
  /* 画像カード（3カラム維持）：幅が縮んでも収まるよう詰める */
  .p-sfirst__cards {
    gap: 18px;
  }
  .c-imgcard__body {
    padding: 38px 18px 24px;
  }
  .c-imgcard__title {
    font-size: 2.6rem;
  }
  .c-imgcard__text {
    font-size: 1.45rem;
    line-height: 1.8;
    padding-top: 20px;
  }
}

@media screen and (max-width: 767px) {
  /* HERO */
  .p-shero {
    min-height: 0;
    padding: 90px 0 70px;
  }
  .p-shero::before {
    background: linear-gradient(
      180deg,
      rgba(20, 24, 34, 0.7),
      rgba(20, 24, 34, 0.55)
    );
  }
  .p-shero__catch {
    font-size: 3.2rem;
    line-height: 1.4;
  }
  .p-shero__lead {
    font-size: 1.5rem;
  }
  .p-shero__btns {
    flex-direction: column;
  }
  .p-shero__btn {
    width: 100%;
    max-width: 340px;
  }

  /* ABOUT */
  .p-sabout {
    padding: 64px 0;
  }
  .p-sabout__sub {
    font-size: 1.5rem;
    text-align: left;
  }
  .p-sabout__cols {
    grid-template-columns: 1fr;
    gap: 28px;
    margin-top: 36px;
    padding: 0;
  }
  .p-sabout__text {
    font-size: 1.5rem;
  }

  /* コース紹介 */
  .p-scourse {
    padding: 64px 0;
  }
  .p-scourse__grid {
    grid-template-columns: 1fr;
    gap: 24px;
    margin-top: 36px;
  }
  .c-course {
    padding: 32px 0 32px;
  }
  .c-course__img {
    margin-top: 28px;
  }
  .c-course__price {
    margin-top: 26px;
  }

  /* カリキュラム */
  .p-scurriculum {
    padding: 64px 0;
  }
  .p-scurriculum__tabs {
    gap: 12px;
    margin-top: 32px;
  }
  .c-ctab {
    height: 38px;
    padding: 0 14px;
    font-size: 1.4rem;
  }
  .p-scurriculum__panel {
    margin-top: 28px;
  }
  .p-scurriculum__panel-head {
    font-size: 2rem;
  }
  .p-scurriculum__days {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 24px;
  }
  .c-cday {
    padding: 24px 22px 26px;
    min-height: 0;
  }
  .c-cday__label {
    font-size: 1.8rem;
  }

  /* 講師紹介 */
  .p-sinstructor {
    padding: 64px 0;
  }
  .p-sinstructor__grid {
    grid-template-columns: 1fr;
    gap: 28px;
    margin-top: 36px;
  }
  .c-instructor__body {
    padding: 22px 4px 0;
  }
  .c-instructor__role {
    font-size: 1.8rem;
  }

  /* 初めての方へ */
  .p-sfirst {
    padding: 64px 0;
  }
  .p-sfirst__cards {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 40px;
  }
  .c-imgcard {
    min-height: 240px;
  }
  .c-imgcard__body {
    padding: 36px 22px 26px;
  }
  .c-imgcard__title {
    font-size: 2.6rem;
  }
  .c-imgcard__text {
    font-size: 1.5rem;
  }

  /* サービス / 看板製作 */
  .p-sservice,
  .p-sknow {
    padding: 64px 0;
  }
  .p-sservice__grid,
  .p-sknow__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px 16px;
    margin-top: 40px;
  }
  .c-svc__title {
    font-size: 1.6rem;
  }
  .c-svc__text {
    font-size: 1.3rem;
  }
  .p-smaint {
    padding: 48px 0 64px;
  }
  .p-smaint__feature {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 28px 22px;
  }
  .p-smaint__img {
    order: -1;
  }
  .p-smaint__title {
    font-size: 2.2rem;
  }

  /* 施工事例 */
  .p-sworks {
    padding: 64px 0;
  }
  .p-sworks__grid {
    grid-template-columns: 1fr;
    gap: 36px;
    margin-top: 40px;
  }

  /* 施工料金の目安 */
  .p-sprice {
    padding: 56px 0;
  }
  .p-sprice__grid {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 36px;
  }
  .c-price {
    padding: 32px 24px;
  }
  .c-price__value {
    font-size: 3.2rem;
  }

  /* 選ばれる理由 */
  .p-sstrength {
    padding: 64px 0;
  }
  .p-sstrength__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 32px 16px;
    margin-top: 40px;
  }
  .p-sflow__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 40px 16px;
    margin-top: 40px;
  }
  .c-reason__icon {
    width: 110px;
    height: 110px;
  }
  .c-reason__num {
    left: calc(50% - 55px);
  }
  .c-reason__num-value {
    font-size: 3.4rem;
  }
  .c-reason__icon img {
    width: auto;
    height: 50px;
  }
  .p-sflow__list .c-reason__icon img,
  .p-sflow__list .c-reason__icon svg {
    max-width: 52px;
    max-height: 48px;
  }

  /* VIDEO */
  .p-svideo {
    padding: 64px 0;
  }
  .p-svideo__play svg {
    width: 60px;
    height: 60px;
  }

  /* FAQ */
  .p-sfaq {
    padding: 64px 0;
  }
  .c-faq__q,
  .c-faq__a {
    grid-template-columns: 36px 1fr;
    gap: 0 12px;
    padding: 18px 0;
  }
  .c-faq__q .c-faq__mark {
    font-size: 2.6rem;
  }
  .c-faq__a .c-faq__mark {
    font-size: 1.7rem;
  }
  .c-faq__qtext {
    font-size: 1.55rem;
  }
  .c-faq__atext {
    font-size: 1.4rem;
  }

  /* 海外のお客様へ */
  .p-sglobal {
    padding: 56px 0;
  }
  .p-sglobal__inner {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .p-sglobal__img {
    order: -1;
  }
  .p-sglobal__title {
    font-size: 2.6rem;
  }
  .p-sglobal__text {
    margin-top: 18px;
    font-size: 1.45rem;
  }

  /* NEWS */
  .p-snews {
    padding: 64px 0;
  }
  .p-snews__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }
  .p-snews__lead {
    font-size: 1.4rem;
  }
  .p-snews__list {
    margin-top: 32px;
  }
  .p-snews .c-news-row__link {
    flex-wrap: wrap;
    gap: 8px 16px;
    padding: 18px 20px;
  }
  .p-snews .c-news-row__title {
    width: 100%;
    font-size: 1.4rem;
  }

  /* CTA は common.css に共通化 */
}

/* ========================================================================
	施工事例一覧ページ（case.html）
======================================================================== */

/* ページタイトル */
.p-phead {
  position: relative;
  padding: 120px 0 140px;
  color: #fff;
  overflow: hidden;
}
.p-phead__bg {
  position: absolute;
  inset: 0;
  z-index: -2;
}
.p-phead__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-phead::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: rgba(20, 24, 34, 0.68);
}
.p-phead__inner {
  text-align: center;
}
.p-phead__en {
  font-size: 1.5rem;
  letter-spacing: 0.3em;
  color: #fff;
	font-family: var(--ff-en);
}
.p-phead__title {
  margin-top: 14px;
  font-weight: 500;
  font-size: 4rem;
  letter-spacing: 0.1em;
}

/* パンくず */
/* パンくずはヘッダー画像（p-phead）の左下に重ねる */
.p-breadcrumb {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 1;
}
.p-breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 0 22px;
  font-size: 1.3rem;
  color: rgba(255, 255, 255, 0.85);
}
.p-breadcrumb__list li {
  display: flex;
  align-items: center;
  gap: 8px;
}
.p-breadcrumb__list li:not(:last-child)::after {
  content: "・";
  color: rgba(255, 255, 255, 0.5);
}
.p-breadcrumb__list a {
  color: rgba(255, 255, 255, 0.85);
}
.p-breadcrumb__list a:hover {
  color: #fff;
  opacity: 1;
}

/* ------------------------------------------------------------------
	固定ページ本文（page.html）
------------------------------------------------------------------ */
.p-page {
  padding: 40px 0 100px;
  background: #fff;
}
.p-page__inner {
  max-width: calc(var(--inner) + var(--side) * 2);
}
.p-page__lead {
  font-size: 1.7rem;
  line-height: 2;
  letter-spacing: 0.04em;
}
.p-page__body {
  margin-top: 40px;
}
.p-page__body h2 {
  margin: 56px 0 22px;
  font-weight: 700;
  font-size: 3.2rem;
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.p-page__body h3 {
  margin: 44px 0 18px;
  font-weight: 700;
  font-size: 2.6rem;
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.p-page__body h4 {
  margin: 36px 0 14px;
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.p-page__body h5 {
  margin: 30px 0 12px;
  font-weight: 700;
  font-size: 1.7rem;
  line-height: 1.7;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.p-page__body h6 {
  margin: 30px 0 12px;
  font-weight: 700;
  font-size: 1.7rem;
  line-height: 1.7;
  letter-spacing: 0.05em;
  color: var(--navy);
}
.p-page__body > :first-child {
  margin-top: 0;
}
.p-page__body p {
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.p-page__body p + p {
  margin-top: 20px;
}
.p-page__body ul {
  margin: 20px 0;
}
.p-page__body ul li {
  position: relative;
  padding: 8px 0 8px 22px;
  font-size: 1.6rem;
  line-height: 1.8;
  letter-spacing: 0.04em;
}
.p-page__body ul li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 1.05em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--navy-light);
}
.p-page__body a {
  color: var(--navy);
  text-decoration: underline;
}
.p-page__table {
  width: 100%;
  margin: 24px 0;
  border-top: 1px solid var(--line);
}
.p-page__table th,
.p-page__table td {
  padding: 18px 22px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--line);
  font-size: 1.55rem;
  line-height: 1.8;
  letter-spacing: 0.04em;
}
.p-page__table th {
  width: 200px;
  background: #f4f6fa;
  font-weight: 500;
  color: var(--ink);
}
.p-page__table td {
  color: #3a3f4b;
}

/* 条件から探す */
.p-search {
  padding: 90px 0 60px;
  background: #fff;
}
.p-search__lead {
  margin-top: 22px;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
}
.p-search__box {
  margin-top: 36px;
  padding: 34px 36px;
  background: #eef1f7;
  border-radius: 10px;
}
.p-search__fields {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 18px;
}
.p-search__field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1 1 150px;
  min-width: 130px;
}
.p-search__field--keyword {
  flex: 2 1 240px;
}
.p-search__flabel {
  position: relative;
  padding-left: 12px;
  font-size: 1.3rem;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.p-search__flabel::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 3px;
  height: 14px;
  transform: translateY(-50%);
  background: var(--navy);
}
.p-search__select,
.p-search__input {
  width: 100%;
  height: 46px;
  padding: 0 14px;
  border: 1px solid #d3d7e0;
  border-radius: 6px;
  background: #fff;
  font-size: 1.4rem;
  color: var(--ink);
  -webkit-appearance: none;
  appearance: none;
}
.p-search__select {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%235a6072' stroke-width='1.6'/></svg>");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 34px;
  cursor: pointer;
}
.p-search__submit {
  flex: 0 0 auto;
  width: 50px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--navy);
  border-radius: 50%;
  transition: opacity 0.3s var(--ease);
}
.p-search__submit:hover {
  opacity: 0.85;
}
.p-search__popular {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 22px;
}
.p-search__popular-label {
  display: inline-flex;
  align-items: center;
  padding: 7px 18px;
  background: var(--navy);
  color: #fff;
  border-radius: 40px;
  font-size: 1.3rem;
  letter-spacing: 0.04em;
}
/* 未選択＝白背景＋グレー枠 / 選択中（.is-active）＝ネイビー塗り */
.c-chip3 {
  padding: 7px 18px;
  border: 1px solid #858585;
  border-radius: 40px;
  background: #fff;
  font-size: 1.3rem;
  color: #858585;
  letter-spacing: 0.04em;
  transition:
    background 0.3s var(--ease),
    border-color 0.3s var(--ease),
    color 0.3s var(--ease);
}
.c-chip3:hover {
  border-color: var(--navy);
  color: var(--navy);
  opacity: 1;
}
.p-search__count {
  margin-top: 22px;
  font-size: 1.4rem;
  color: #5a6072;
  letter-spacing: 0.04em;
}

/* 事例一覧グリッド */
.p-archive {
  padding: 60px 0 100px;
  background: #fff;
}
.p-archive .c-label {
  justify-content: left;
}
.p-archive__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 48px 40px;
  margin-top: 50px;
}
.p-archive__empty {
  margin-top: 50px;
}

/* ------------------------------------------------------------------
	お知らせ・ブログ（archive.php / single.php）
------------------------------------------------------------------ */
.p-newscat {
  padding: 90px 0 0;
}
.p-newscat__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 40px;
}
.c-catchip {
  display: inline-block;
  padding: 9px 24px;
  border: 1px solid var(--navy);
  border-radius: 40px;
  font-size: 1.4rem;
  letter-spacing: 0.04em;
  color: var(--navy);
  transition: background 0.3s var(--ease), color 0.3s var(--ease);
}
.c-catchip:hover,
.c-catchip.is-current {
  background: var(--navy);
  color: #fff;
  opacity: 1;
}
.p-newslist {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 1000px;
  margin: 48px auto 0;
}
.p-newslist .c-news-row {
  background: #fff;
  border-radius: 50px;
  box-shadow: 0 6px 20px rgba(28, 31, 38, 0.04);
  transition: box-shadow 0.3s var(--ease), transform 0.3s var(--ease);
}
.p-newslist .c-news-row:hover {
  box-shadow: 0 10px 26px rgba(28, 31, 38, 0.08);
  transform: translateY(-2px);
}
.p-newslist .c-news-row__link {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 22px 36px;
}
.p-newslist .c-news-row__date {
  flex-shrink: 0;
  font-size: 1.5rem;
  color: #5a6072;
}
.p-newslist .c-news-row__title {
  font-size: 1.55rem;
  letter-spacing: 0.04em;
}
.p-archive .p-pager .page-numbers {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin: 50px 0 0;
  padding: 0;
  list-style: none;
}
.p-archive .p-pager .page-numbers a,
.p-archive .p-pager .page-numbers span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  padding: 0 10px;
  border: 1px solid var(--ink);
  border-radius: 6px;
  font-family: var(--ff-en);
  font-size: 1.4rem;
  color: var(--ink);
}
.p-archive .p-pager .page-numbers a:hover {
  background: #eef1f7;
  opacity: 1;
}
.p-archive .p-pager .page-numbers .current {
  background: var(--ink);
  color: #fff;
}
.p-post__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 20px;
}
.p-post__date {
  font-size: 1.5rem;
  color: #5a6072;
}
.p-post__foot {
  margin-top: 50px;
  text-align: center;
}
.p-page__thumbnail {
  max-width: 750px;
  width: 100%;
  margin: 0 auto 80px;
  text-align: center;
}

.p-page__thumbnail img {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 600px;
  vertical-align: bottom;
}

@media screen and (max-width: 767px) {
  .p-newscat {
    padding: 64px 0 0;
  }
  .p-newslist {
    margin-top: 32px;
  }
  .p-newslist .c-news-row__link {
    flex-wrap: wrap;
    gap: 8px 14px;
    padding: 18px 22px;
  }
  .p-newslist .c-news-row__title {
    width: 100%;
    font-size: 1.45rem;
  }
}

.c-wcard {
  display: block;
  color: var(--ink);
}
.c-wcard__img {
  border-radius: 4px;
  overflow: hidden;
  aspect-ratio: 360/240;
}
.c-wcard__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s var(--ease);
}
.c-wcard:hover {
  opacity: 1;
}
.c-wcard:hover .c-wcard__img img {
  transform: scale(1.05);
}
.c-wcard__title {
  margin-top: 18px;
  font-weight: 500;
  font-size: 2rem;
  letter-spacing: 0.05em;
}
.c-wcard__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.c-wcard__text {
  margin-top: 12px;
  font-size: 1.4rem;
  line-height: 1.8;
  letter-spacing: 0.03em;
  color: #3a3f4b;
}

/* ページネーション */
.p-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 64px;
}
/* 数字：未選択＝白円＋細枠 / 現在ページ＝ダーク塗り */
.p-pager__num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid var(--ink);
  background: #fff;
  font-family: var(--ff-en);
  font-size: 1.5rem;
  color: var(--ink);
  transition:
    background 0.3s var(--ease),
    color 0.3s var(--ease);
}
.p-pager__num:hover {
  background: #eef1f7;
  opacity: 1;
}
.p-pager__num.is-current {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}
.p-pager__dots {
  color: var(--ink);
  padding: 0 2px;
  letter-spacing: 0.1em;
}
/* 前後：横長カプセル＋長い矢印 */
.p-pager__arrow {
  position: relative;
  width: 64px;
  height: 20px;
  border: 1px solid var(--ink);
  border-radius: 40px;
  background: #fff;
  transition: background 0.3s var(--ease);
}
.p-pager__arrow::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 19px;
  right: 19px;
  height: 1px;
  background: var(--ink);
  transform: translateY(-50%);
}
.p-pager__arrow::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 7px;
  height: 7px;
  border-top: 1px solid var(--ink);
  border-right: 1px solid var(--ink);
}
.p-pager__arrow--next::after {
  right: 18px;
  transform: translateY(-50%) rotate(45deg);
}
.p-pager__arrow--prev::after {
  left: 18px;
  transform: translateY(-50%) rotate(-135deg);
}
.p-pager__arrow:hover {
  background: var(--ink);
}
.p-pager__arrow:hover::before {
  background: #fff;
}
.p-pager__arrow:hover::after {
  border-color: #fff;
}

@media screen and (min-width: 768px) and (max-width: 1100px) {
  .p-archive__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 767px) {
  .p-phead {
    padding: 80px 0 64px;
  }
  .p-phead__title {
    font-size: 2.8rem;
  }
  .p-breadcrumb__list {
    padding-bottom: 16px;
    font-size: 1.2rem;
    gap: 6px;
  }
  /* 固定ページ本文 */
  .p-page {
    padding: 48px 0 64px;
  }
  .p-page__lead {
    font-size: 1.5rem;
  }
  .p-page__body {
    margin-top: 32px;
  }
  .p-page__body h2 {
    font-size: 2.6rem;
    margin: 40px 0 18px;
  }
  .p-page__body h3 {
    font-size: 2.2rem;
  }
  .p-page__body h4 {
    font-size: 1.8rem;
  }
  .p-page__body h5,
  .p-page__body h6 {
    font-size: 1.6rem;
  }
  .p-page__body p,
  .p-page__body ul li {
    font-size: 1.5rem;
  }
  .p-page__table th,
  .p-page__table td {
    display: block;
    width: 100%;
    padding: 12px 16px;
  }
  .p-page__table th {
    border-bottom: none;
  }
  .p-search {
    padding: 56px 0 40px;
  }
  .p-search__lead {
    font-size: 1.5rem;
  }
  .p-search__box {
    padding: 24px 20px;
  }
  .p-search__fields {
    gap: 14px;
  }
  .p-search__field {
    flex: 1 1 100%;
  }
  .p-search__submit {
    width: 100%;
    border-radius: 6px;
  }
  .p-archive {
    padding: 40px 0 64px;
  }
  .p-archive__grid {
    grid-template-columns: 1fr;
    gap: 36px;
    margin-top: 36px;
  }
  .p-pager {
    margin-top: 44px;
    gap: 10px;
  }
  .p-pager__num {
    width: 40px;
    height: 40px;
    font-size: 1.4rem;
  }
  .p-pager__arrow {
    width: 54px;
    height: 40px;
  }
  .p-pager__arrow::before {
    left: 16px;
    right: 16px;
  }
  .p-pager__arrow--next::after {
    right: 15px;
  }
  .p-pager__arrow--prev::after {
    left: 15px;
  }
}

/* ========================================================================
	検索結果ページ（result.html）追加分
======================================================================== */

/* セレクトに値が入っている状態 */
.p-search__select.is-selected {
  color: var(--ink);
  border-color: var(--navy);
  font-weight: 500;
}

/* 選択中のカテゴリー */
.p-search__selected {
  margin-top: 20px;
  padding: 18px 22px;
  background: #fff;
  border-radius: 8px;
}
.p-search__selected-label {
  position: relative;
  padding-left: 12px;
  font-size: 1.3rem;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.p-search__selected-label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 3px;
  height: 14px;
  transform: translateY(-50%);
  background: var(--navy);
}
.p-search__selected-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
}
.p-search__clear {
  font-size: 1.3rem;
  color: var(--navy);
  text-decoration: underline;
  letter-spacing: 0.04em;
}
.p-search__clear:hover {
  opacity: 0.8;
}
.p-archive__empty {
  margin-top: 50px;
  text-align: center;
  font-size: 1.6rem;
  line-height: 1.9;
  color: #5a6072;
}
.p-taxlead {
  padding: 40px 0 0;
  background: #fff;
}
.p-taxlead__text {
  font-size: 1.6rem;
  line-height: 1.9;
  letter-spacing: 0.04em;
  color: #3a3f4b;
}
.c-seltag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px 7px 10px;
  background: #eef1f7;
  border: 1px solid var(--navy);
  border-radius: 40px;
  font-size: 1.3rem;
  color: var(--navy);
  letter-spacing: 0.03em;
}
.c-seltag__close {
  position: relative;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--navy);
  flex-shrink: 0;
}
.c-seltag__close::before,
.c-seltag__close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 1.4px;
  background: #fff;
}
.c-seltag__close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
.c-seltag__close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* 人気条件 アクティブ */
.c-chip3.is-active {
  background: var(--navy);
  border-color: var(--navy);
  color: #fff;
}
.c-chip3.is-active:hover {
  color: #fff;
}

/* 件数 + 並び替え */
.p-search__result-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 22px;
}
.p-search__result-bar .p-search__count {
  margin-top: 0;
}
.p-search__sort {
  display: flex;
  gap: 22px;
}
.p-search__sort-item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  font-size: 1.4rem;
  color: #5a6072;
  cursor: pointer;
  line-height: 1;
}
.p-search__sort-item input {
  width: 15px;
  height: 15px;
  accent-color: var(--navy);
  cursor: pointer;
}

@media screen and (max-width: 767px) {
  .p-search__selected {
    padding: 16px 16px;
  }
  .p-search__result-bar {
    flex-direction: column;
    align-items: flex-start;
  }
  .p-search__sort {
    gap: 16px;
    flex-wrap: wrap;
  }
}

/* ========================================================================
	施工事例 詳細ページ（detail.html）
======================================================================== */

/* 事例本体 */
.p-detail {
  padding: 90px 0 70px;
  background: #fff;
}
.p-detail__title {
  margin-top: 14px;
  font-weight: 500;
  font-size: 3.2rem;
  line-height: 1.45;
  letter-spacing: 0.06em;
}
.p-detail__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}
.c-seltag--static {
  background: #fff;
}
.p-detail__main {
  margin: 0 auto;
  margin-top: 36px;
  border-radius: 6px;
  overflow: hidden;
  max-width: 960px;
  background: #d9d9d9;
}
.p-detail__main img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-detail__desc {
  margin-top: 36px;
}
.p-detail__desc p {
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
}
.p-detail__desc p + p {
  margin-top: 24px;
}

/* 仕様テーブル */
.p-detail__spec {
  width: 100%;
  margin-top: 44px;
  border-top: 1px solid var(--line);
}
.p-detail__spec th,
.p-detail__spec td {
  padding: 18px 20px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--line);
  font-size: 1.5rem;
  letter-spacing: 0.04em;
}
.p-detail__spec th {
  width: 140px;
  background: #f4f6fa;
  font-weight: 500;
  color: var(--ink);
}
.p-detail__spec td {
  color: #3a3f4b;
}

/* プロジェクト概要 */
.p-story {
  padding: 90px 0;
  background: linear-gradient(180deg, #eff4fa 0%, #f2f2f2 100%);
}
.p-story .c-label {
  justify-content: center;
}
.p-story__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-top: 50px;
}
.c-story {
  background: #fff;
  padding: 48px 30px 44px;
  text-align: center;
}
.c-story__title {
  font-weight: 700;
  font-size: 2.4rem;
  letter-spacing: 0.05em;
  color: var(--ink);
}
/* 英語ラベル＋アイコンを内包する大きめの円 */
.c-story__media {
  position: relative;
  width: 156px;
  height: 156px;
  margin: 28px auto 0;
  border-radius: 50%;
  background: linear-gradient(160deg, #f5f8fc 0%, #e6edf7 100%);
}
.c-story__en {
  position: absolute;
  top: 24px;
  left: 0;
  right: 0;
  font-family: var(--ff-en);
  font-size: 1.4rem;
  letter-spacing: 0.28em;
  color: #8b93a3;
  text-align: center;
}
.c-story__icon {
  position: absolute;
  top: 56%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
}
.c-story__icon svg {
  width: 46px;
  height: 46px;
}
.c-story__text {
  margin-top: 30px;
  font-size: 1.5rem;
  line-height: 1.9;
  letter-spacing: 0.04em;
  text-align: left;
  color: var(--ink);
}

/* ギャラリー */
.p-gallery {
  padding: 90px 0;
  background: #fff;
}
.p-gallery .c-label {
  justify-content: center;
}
/* --- ギャラリー：ジャスティファイド配置 -----------------------------
   各写真の幅を「縦横比」に比例させることで、同じ行の写真の高さが自動的に
   そろい、行の左右も端まで詰まる。画像はトリミングされず全部見える。
   縦横比は config.js が読み込み後に --ar として各写真へ渡す。
   --gallery-row は1行あたりのおおよその高さ（大きくすると写真が大きくなる）*/
.p-gallery__grid {
  --gallery-row: 320px; /* 1行あたりの基準の高さ */
  --gallery-max: 430px; /* 1行の写真が少ないときの高さの上限 */
  display: flex;
  flex-wrap: wrap;
  /* 最終行に写真が少し余ったときは中央に寄せる（埋まっている行には影響なし）*/
  justify-content: center;
  gap: 20px;
  margin-top: 50px;
}
.c-gphoto {
  --ar: 1.5; /* 画像読み込み前の暫定値（3:2）*/
  position: relative;
  /* 幅・伸長率とも縦横比に比例させるのがポイント。
     これにより行内の写真は必ず同じ高さになる */
  flex: var(--ar) 1 calc(var(--ar) * var(--gallery-row));
  /* 最終行に写真が1〜2枚だけ残ったとき、極端に大きくならないよう上限を設ける */
  max-width: calc(var(--ar) * var(--gallery-max));
  min-width: 0;
  border-radius: 4px;
  overflow: hidden;
}
.c-gphoto img {
  display: block;
  width: 100%;
  height: auto;
  transition: transform 0.5s var(--ease);
}
@media screen and (min-width: 768px) and (max-width: 1199px) {
  .p-gallery__grid {
    --gallery-row: 220px;
    --gallery-max: 300px;
  }
}
.c-gphoto:hover {
  opacity: 1;
}
/* .c-gphoto:hover img {
  transform: scale(1.05);
} */
.c-gphoto__cap {
  position: absolute;
  top: 18px;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #fff;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

/* 関連情報 */
.p-related {
  padding: 90px 0 100px;
  background: #f2f2f2;
}
.p-related__head {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 1.6rem;
  letter-spacing: 0.08em;
  color: var(--ink);
}
.p-related__line {
  width: 28px;
  height: 1px;
  background: var(--ink);
}
.p-related__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  margin-top: 36px;
}
.p-related__label {
  position: relative;
  padding-left: 18px;
  margin-bottom: 18px;
  font-family: var(--ff-en);
  font-size: 1.4rem;
  letter-spacing: 0.1em;
  color: var(--navy);
}
.p-related__label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 9px;
  height: 12px;
  transform: translateY(-50%);
  background: var(--navy-light);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}

@media screen and (min-width: 768px) and (max-width: 1100px) {
  .p-story__cards {
    grid-template-columns: 1fr;
  }
  .p-related__grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}
@media screen and (max-width: 767px) {
  .p-detail {
    padding: 56px 0 48px;
  }
  .p-detail__title {
    font-size: 2.4rem;
  }
  .p-detail__desc p {
    font-size: 1.5rem;
  }
  .p-detail__spec th,
  .p-detail__spec td {
    display: block;
    width: 100%;
    padding: 12px 16px;
  }
  .p-detail__spec th {
    border-bottom: none;
  }
  .p-story {
    padding: 56px 0;
  }
  .p-story__cards {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 36px;
  }
  .c-story {
    padding: 30px 24px;
  }
  .p-gallery {
    padding: 56px 0;
  }
  .p-gallery__grid {
    gap: 12px;
    margin-top: 36px;
  }
  /* SPは1枚ずつ縦積み */
  .c-gphoto {
    flex: 1 1 100%;
    max-width: 100%;
  }
  .p-related {
    padding: 56px 0 64px;
  }
  .p-related__grid {
    grid-template-columns: 1fr;
    gap: 32px;
    margin-top: 28px;
  }
}

/* ========================================================================
	カーラッピング講習会ページ（training/index.html）追加分
======================================================================== */

/* ABOUT：ラベル・見出し中央寄せ（講習会版）*/
.p-sabout--c .c-label {
  justify-content: center;
}
.p-sabout--c .p-sabout__heading {
  text-align: center;
}

/* コース紹介・カリキュラム詳細・講師紹介のCSSは、本ファイル上部（COURSE / CURRICULUM / INSTRUCTOR セクション）に統合しました（重複定義を解消） */

/* 受講生の声 */
.p-svoice {
  padding: 110px 0;
  background: linear-gradient(180deg, #eff4fa 0%, #f2f2f2 100%);
}
.p-svoice .c-label {
  justify-content: left;
}
.p-svoice__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-top: 56px;
  align-items: stretch;
}
.c-voice {
  display: flex;
  flex-direction: column;
  padding: 40px 30px 38px;
  background: #fff;
}
.c-voice__head {
  position: relative;
  width: 136px;
  margin: 0 auto;
}
.c-voice__avatar {
  display: block;
  width: 136px;
  height: 136px;
  border-radius: 50%;
  object-fit: cover;
  background: linear-gradient(180deg, #eff4fa 0%, #f2f2f2 100%);
}
.c-voice__no {
  position: absolute;
  top: -6px;
  left: -30px;
  z-index: 1;
  display: flex;
  flex-direction: column;
  font-family: var(--ff-en);
  line-height: 1;
}
.c-voice__en {
  font-size: 1.4rem;
  letter-spacing: 0.3em;
  color: #9aa1ad;
}
.c-voice__num {
  margin-top: 6px;
  font-size: 4rem;
  line-height: 1;
  letter-spacing: 0.08em;
  color: var(--ink);
}
.c-voice__text {
  margin-top: 26px;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.c-voice__attr {
  margin-top: auto;
  padding-top: 24px;
  text-align: right;
  font-size: 1.6rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: var(--ink);
}
.c-voice__pdf {
  display: flex;
  align-self: center;
  width: 100%;
  max-width: 240px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  height: 48px;
  margin-top: 20px;
  padding: 0 20px 0 24px;
  background: var(--navy);
  border: 1px solid var(--navy);
  border-radius: 40px;
  color: #fff;
  font-size: 1.4rem;
  letter-spacing: 0.05em;
  transition: opacity 0.3s var(--ease);
}
.c-voice__pdf:hover {
  opacity: 0.85;
}
.c-voice__pdf-icon {
  flex-shrink: 0;
}

/* お知らせ：講習会用背景（サイン・PPFとは別画像）*/
.p-snews--training {
  background-image: url(../../image/page/training/news_bg.webp);
}

@media screen and (min-width: 768px) and (max-width: 1100px) {
  .p-svoice__grid {
    grid-template-columns: 1fr;
  }
}
@media screen and (max-width: 767px) {
  .p-svoice {
    padding: 56px 0;
  }
  .p-svoice__grid {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 36px;
  }
}

/* ========================================================================
	WPパーツ
======================================================================== */
/* テーブル */
.p-page .table-top-header,
.p-page .table-left-header {
  margin-top: 20px;
  margin-bottom: 40px;
}

.p-page .table-top-header thead th,
.p-page .table-left-header th {
  background: #eff4fa;
  text-align: left;
}

/* ３カラム */
.page-wp-column3 {
  margin-top: 20px;
  margin-bottom: 40px;
}

.page-wp-column3 h3 {
  font-weight: 500;
  font-size: 3.2rem;
  line-height: 1.25;
  letter-spacing: 0.1em;
  min-height: 1.5em;
}

.page-wp-column3 figure {
  margin-top: 18px;
  border-radius: 2px;
  overflow: hidden;
  aspect-ratio: 440/300;
}

.page-wp-column3 p {
  margin-top: 22px;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
}

.page-wp-column3 figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media screen and (max-width: 767px) {
  .page-wp-column3 h3 {
    min-height: 0;
    font-size: 3rem;
  }
}

/* 4カラム */
.page-wp-column4 {
  margin-top: 20px;
  margin-bottom: 40px;
}

.page-wp-column4 figure {
  overflow: hidden;
  aspect-ratio: 340/230;
}

.page-wp-column4 figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-page__body .page-wp-column4__text {
  margin-top: 8px;
  font-size: 1.7rem;
  letter-spacing: 0.04em;
  margin-top: 0;
}

.p-page__body .page-wp-column4__text--blue {
  margin-top: 14px;
  font-size: 1.3rem;
  color: var(--navy);
  letter-spacing: 0.04em;
  margin-bottom: 0;
}

/* ボタン */
.page-wp-btn a {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: fit-content;
  gap: 40px;
  min-width: 240px;
  padding: 10px 65px 10px 24px;
  border: 1px solid var(--ink);
  border-radius: 40px;
  font-size: 1.5rem;
  letter-spacing: 0.05em;
  color: var(--ink);
  transition:
    background 0.3s var(--ease),
    color 0.3s var(--ease);
  background: #fff;
}

.page-wp-btn a::after {
  content: "";
  background: url(../../image/common/right-black-arw.png) no-repeat center;
  background-size: 45px 15px;
  width: 45px;
  height: 15px;
  position: absolute;
  top: 50%;
  right: 15px;
  translate: 0 -50%;
  transition: all 0.3s;
}

.page-wp-btn a:hover {
  background: var(--ink);
  color: #fff;
  transition: all 0.3s;
}

.page-wp-btn a:hover::after {
  content: "";
  background: url(../../image/common/right-white-arw.png) no-repeat center;
  background-size: 45px 15px;
  transition: all 0.3s;
}

/* 2カラム */
.page-wp-column2 {
  margin-top: 20px;
  margin-bottom: 40px;
}

.page-wp-column2 figure {
  aspect-ratio: 560/346;
  overflow: hidden;
}

.page-wp-column2 figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page-wp-column2 h4 {
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: var(--ink);
}

.page-wp-column2 p {
  margin-top: 13px;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--ink);
}

@media screen and (max-width: 767px) {
  .page-wp-column2 h4 {
    font-size: 1.8rem;
  }
}

/* FAQ */
.page-wp-faq {
  margin-top: 20px;
  margin-bottom: 40px;
}

.page-wp-faq .faq_q,
.page-wp-faq .faq_a {
  display: grid;
  grid-template-columns: 56px 1fr;
  align-items: start;
  gap: 0 18px;
  padding: 24px 0;
}

.page-wp-faq .faq_q {
  font-weight: 700;
  font-size: 1.8rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: var(--ink);
  border-bottom: 1px solid #d9d9d9;
}

.page-wp-faq .faq_q::before {
  position: relative;
  box-shadow: none;
  color: var(--navy);
  font-size: 3.6rem;
  letter-spacing: 0.05em;
  font-family: var(--ff-en);
  line-height: 1;
  top: initial;
  width: initial;
}

.page-wp-faq .faq_a {
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--ink);
}

.page-wp-faq .faq_a p {
  margin-bottom: 0;
}

.page-wp-faq .faq_a::before {
  position: relative;
  box-shadow: none;
  color: var(--navy-light);
  font-size: 2rem;
  text-align: center;
  line-height: 1.8;
  font-family: var(--ff-en);
  line-height: 1;
  top: initial;
  width: initial;
  display: block;
  height: 100%;
  line-height: 1.8;
}

@media screen and (max-width: 767px) {
  .page-wp-faq .faq_a {
    font-size: 1.55rem;
  }

  .page-wp-faq .faq_a::before {
    font-size: 2.6rem;
  }

  .page-wp-faq .faq_a p {
    font-size: 1.4rem;
  }

  .page-wp-faq .faq_a::before {
    font-size: 1.7rem;
  }
}

/* 見出し */
.wp-page-title {
  position: relative;
  font-size: 2.4rem;
  display: flex;
  align-items: center;
}

.wp-page-title::before {
  content: "";
  width: 15px;
  height: 2px;
  background: #2c4378;
  margin-right: 0.5em;
}

@media screen and (max-width: 767px) {
  .wp-page-title {
    font-size: 2rem;
  }
}

/* グラデーション背景 */
.page-wp-bg {
  background: linear-gradient(180deg, #eff4fa 0%, #f2f2f2 100%);
}

/* 英語装飾文字 */
.wp-page-en-decoration {
  position: relative;
  padding-left: 22px;
  font-family: var(--ff-en);
  font-size: 1.4rem;
  letter-spacing: 0.3em;
  color: var(--ink);
}

.wp-page-en-decoration::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  background: url(../../image/common/title-icon.webp) no-repeat center;
  background-size: 9px 13px;
  width: 9px;
  height: 13px;
  transform: translateY(-50%);
}