/* page-column.css - コラム（一覧・個別ページ）　2026年10月1日作成
   ヘッダー・パンくず・固定CTA・ミニCTAの指定は page-faq.css と同じ。
   FAQ側を変更した場合はこちらも合わせて直すこと */

h2{font-size:clamp(1.05rem, 0.85rem + 2.2vw, 1.9rem);}

/* Header hamburger: square button, dark purple background, white lines */
  .c-hamburger--header{
    width:2.5rem; height:2.5rem;
    background:var(--purple-900);
    border-radius:8px;
  }

.c-hamburger--header span{
    left:0.625rem; right:0.625rem;
    background:#fff;
  }

.c-hamburger--header span:nth-child(1){top:0.8125rem;}

.c-hamburger--header span:nth-child(2){top:1.1875rem;}

.c-hamburger--header span:nth-child(3){top:1.5625rem;}

.c-hamburger--header.is-open span:nth-child(1){top:1.1875rem; transform:rotate(45deg);}

.c-hamburger--header.is-open span:nth-child(3){top:1.1875rem; transform:rotate(-45deg);}

@media(max-width:768px){
    .l-submenu__inner{display:none;}
    .c-hamburger--header{display:flex; align-items:center; justify-content:center;}
    .l-submenu{background:transparent; border-bottom:none;}
    .l-submenu.is-menu-open{background:var(--purple-900); border-bottom:1px solid rgba(255,255,255,.08);}
  }

.c-mini-cta .c-btn-group{max-width:40rem; margin:0 auto;}

/* ---------- Anchor offset for sticky header ---------- */
  section[id]{scroll-margin-top:118px;}

/* ----------------------------------------------------------------------
   下部固定CTAの余白について

   他のページCSSには body{padding-bottom:8.25rem;} が入っているが、
   common.css の 14rem（PC）／25rem（SP）を打ち消してしまうため
   このページでは意図的に指定していない。
   他ページと揃える必要が出た場合はここに1行足せば切り替わる。
   ---------------------------------------------------------------------- */

/* ---------- Fixed bottom CTA（写真とキャプションの位置） ---------- */
  .c-fixed-cta__photo{display:none;}

.c-fixed-cta__caption{display:none;}

@media(min-width:1100px){
    .c-fixed-cta__buttons{max-width:37.5rem; margin:0 auto;}
    .c-fixed-cta__photo{
      display:block;
      position:absolute;
      left:calc(50% + 18.75rem - 1rem); bottom:-0.625rem;
      pointer-events:none;
    }
    .c-fixed-cta__photo img{width:9.375rem; height:auto; display:block;}
    .c-fixed-cta__caption{
      display:block;
      position:absolute;
      left:calc(50% + 18.75rem - 1rem + 9.875rem);
      bottom:1.25rem;
      width:6.625rem;
      margin:0;
      font-size:.6rem;
      font-weight:700;
      color:var(--ink-soft);
      line-height:1.5;
      text-align:left;
      white-space:nowrap;
      pointer-events:none;
    }
  }

/* ----------------------------------------------------------------------
   パンくずリスト（page-faq.css と同じ指定）

   PC   … 1行に収め、入り切らない記事タイトルは末尾を省略記号にする
   SP   … 折り返さず、パンくずの帯だけ横スクロールで全文を読めるようにする
          （overflow-x は帯の内側だけに付けるため、ページ全体は横に動かない）
   ---------------------------------------------------------------------- */
.c-breadcrumb__inner{
    flex-wrap:nowrap;
  }

/* リンクと区切り記号は縮めない */
.c-breadcrumb__inner a,
.c-breadcrumb__sep{
    flex:none;
    white-space:nowrap;
  }

/* 現在位置（記事タイトル）だけを縮める。min-width:0 がないと省略が効かない */
.c-breadcrumb__current{
    flex:0 1 auto;
    min-width:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

@media(max-width:900px){
  /* 帯の内側だけ横スクロール。記事タイトルは省略せず全文を残す */
  .c-breadcrumb__inner{
    overflow-x:auto;
    scrollbar-width:thin;
    -webkit-overflow-scrolling:touch;
  }

  .c-breadcrumb__current{
    flex:none;
    overflow:visible;
    text-overflow:clip;
    padding-right:1.5rem;
  }
}

/* ----------------------------------------------------------------------
   ページタイトルの強調語
   費用ページ・流れページ（page-fee.css / page-flow.css）と同じ指定。
   黄色の下線ではなく赤字＋1.25emで、タイトルの見た目が3ページで揃う
   ---------------------------------------------------------------------- */
.c-hero h1 .c-highlight{
    background:none;
    color:#B31F31;
    font-size:1em;   /* h1本体を大きくしたため、強調語は同サイズにする */
  }

/* ======================================================================
   一覧ページ（/columns/）
   左にサムネイル、右にタイトル・概要・更新日（2026年10月2日 サムネイル付きに変更）
   ====================================================================== */
.p-column-list-section{padding-top:3rem;}

.p-column-list{
    list-style:none;
    margin:0 auto;
    padding:0;
    max-width:53.75rem;
  }

.p-column-list__item{border-bottom:1px solid var(--line);}

.p-column-list__item:first-child{border-top:1px solid var(--line);}

.p-column-list__link{
    display:flex;
    align-items:center;   /* 2026-10-08 写真をタイトル〜更新日に対して上下中央に */
    gap:1.75rem;
    padding:1.75rem 1rem;
    border-radius:8px;
    transition:background .2s ease;
  }

.p-column-list__link:hover{background:var(--purple-050);}

/* サムネイル（正方形）。2026-10-08 一覧専用の写真（list_thumb）を入れる形に戻した */
.p-column-list__thumb{
    flex:none;
    width:9.375rem;
    aspect-ratio:1 / 1;
    border-radius:4px;
    overflow:hidden;
    background:var(--purple-050);
  }

.p-column-list__thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .3s ease;
  }

.p-column-list__link:hover .p-column-list__thumb img{transform:scale(1.04);}

.p-column-list__body{
    flex:1 1 auto;
    min-width:0;
    display:flex;
    flex-direction:column;
  }

/* 記事タイトル。下に区切り線を引く */
.p-column-list__title{
    padding-bottom:0.75rem;
    border-bottom:1px solid var(--ink-soft);
    font-size:1.35rem;
    font-weight:700;
    line-height:1.6;
    color:var(--purple-900);
    text-wrap:balance;
    word-break:auto-phrase;
  }

/* 概要（meta description）。3行で切る */
.p-column-list__excerpt{
    margin-top:0.875rem;
    font-size:1.05rem;
    line-height:1.85;
    color:var(--ink-soft);
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }

/* 更新日 */
.p-column-list__date{
    margin-top:0.875rem;
    font-size:.85rem;
    font-weight:700;
    color:var(--purple-300);
    letter-spacing:.03em;
  }

/* 右端の「＞」。遷移を促す印（濃い紫）。行の上下中央に置く */
.p-column-list__chevron{
    flex:none;
    align-self:center;
    width:1.5rem;
    height:1.5rem;
    margin-left:-0.5rem;
    color:var(--purple-900);
    transition:transform .2s ease;
  }

.p-column-list__chevron svg{
    width:100%;
    height:100%;
    display:block;
    fill:none;
    stroke:currentColor;
    stroke-width:2.6;
    stroke-linecap:round;
    stroke-linejoin:round;
  }

.p-column-list__link:hover .p-column-list__chevron{transform:translateX(3px);}

/* 原稿未確定の行。公開前に必ず解消する */
.p-column-list__item--draft .p-column-list__title,
.p-column-list__item--draft .p-column-list__excerpt{color:var(--purple-300);}

.p-column-list__item--draft .p-column-list__title{border-bottom-color:var(--purple-300);}

.p-column-list__item--draft .p-column-list__thumb img{opacity:.55;}

.p-column-list__item--draft .p-column-list__chevron{color:var(--purple-300);}

/* ======================================================================
   個別ページ（/columns/001 〜）
   ====================================================================== */
.c-hero--column{padding:3.25rem 0 3rem;}

.c-hero--column h1.p-column-detail__title{
    max-width:53.75rem;
    margin:0 auto;
    font-size:min(2.1rem, 6vw);
    line-height:1.6;
    text-align:left;
    text-wrap:balance;         /* 2行以上になるときは行の長さをそろえる */
    word-break:auto-phrase;    /* 言葉の途中で改行しない（対応ブラウザのみ） */
  }

/* 共通の「.c-hero p」（説明文の幅）より優先させ、タイトルと左端をそろえる */
.c-hero--column p.p-column-detail__dates{
    max-width:53.75rem;
    margin:1rem auto 0;
    justify-content:flex-start;
    display:flex;
    flex-wrap:wrap;
    gap:0.25rem 1.5rem;
    font-size:.95rem;
    font-weight:700;
    color:var(--purple);
    text-align:left;
  }

.p-column-detail{padding-top:3rem;}

/* 記事の画像（タイトル・日付の下）。切り抜かず、本文と同じ幅で表示 */
.p-column-detail__eyecatch{
    max-width:53.75rem;
    margin:0 auto 2.25rem;
  }

.p-column-detail__eyecatch img{
    display:block;
    width:100%;
    height:auto;
    border-radius:6px;
  }

.p-column-detail__article{max-width:53.75rem; margin:0 auto;}

/* 導入文（背景・縦線なし。本文と同じ地色の上に置く） */
.p-column-detail__lead{
    margin:0 0 2.25rem;
    padding:0;
    font-size:1.25rem;
    line-height:1.9;
  }

/* 導入文が複数段落のとき（2026年10月7日） */
.p-column-detail__lead p{margin:0;}
.p-column-detail__lead p + p{margin-top:1.25rem;}

/* ---------- 目次 ---------- */
.p-column-toc{
    margin:0 0 2.75rem;
    padding:1.5rem 1.75rem;
    border:2px solid var(--purple-100);
    border-radius:12px;
    background:#fff;
  }

.p-column-toc__title{
    margin:0 0 0.75rem;
    font-size:1.25rem;
    font-weight:700;
    color:var(--purple-900);
  }

.p-column-toc__list{margin:0; padding-left:1.5rem;}

.p-column-toc__list li{font-size:1.1rem; line-height:1.8;}

.p-column-toc__list li + li{margin-top:0.25rem;}

.p-column-toc__list a{color:var(--purple); text-decoration:underline; text-underline-offset:3px;}

.p-column-toc__list a:hover{color:var(--purple-900);}

/* ---------- 本文 ---------- */
.p-column-detail__body p{
    margin:0;
    font-size:1.25rem;
    line-height:1.9;
  }

.p-column-detail__body p + p{margin-top:1.25rem;}

/* 「請求者（権利者）：」などの項目名：太字のみ（黄色の下線なし）2026年10月8日 */
.p-column-label{font-weight:700; color:var(--purple-900);}

/* 本文と導入文の強調（太字＋黄色の下線）。2026年10月8日 導入文にも適用 */
.p-column-detail__body strong,
.p-column-detail__lead strong{
    font-weight:700;
    color:var(--purple-900);
    /* 2026年10月8日：下線の色がページの地色とほぼ同じで見えていなかったため、見える濃さの黄色に変更 */
    background:linear-gradient(transparent 62%, rgba(242,201,76,.45) 62%);
  }

/* 大見出し（データ側で行頭が「## 」の段落） */
.p-column-detail__body h2{
    margin:3rem 0 1.25rem;
    padding:0.75rem 1rem;
    background:var(--purple-900);
    color:#fff;
    border-radius:6px;
    font-size:1.6rem;
    line-height:1.6;
    scroll-margin-top:1.5rem;
  }

.p-column-detail__body h2:first-child{margin-top:0;}

/* 小見出し（データ側で行頭が「### 」の段落）。FAQ回答内の小見出しと同じ1.45rem */
.p-column-detail__body h3{
    margin:2.25rem 0 1rem;
    padding-left:0.875rem;
    border-left:4px solid var(--yellow);
    font-size:1.45rem;
    line-height:1.6;
    color:var(--purple-900);
  }

/* 箇条書き（データ側で行頭が「- 」の段落）2026年10月7日 */
.p-column-detail__list{
    margin:1rem 0 1.25rem;
    padding:1.125rem 1.25rem 1.125rem 1.25rem;
    list-style:none;
    background:var(--purple-050);
    border-radius:8px;
  }

.p-column-detail__list li{
    position:relative;
    padding-left:1.25rem;
    font-size:1.2rem;
    line-height:1.8;
  }

.p-column-detail__list li + li{margin-top:0.5rem;}

.p-column-detail__list li::before{
    content:"";
    position:absolute;
    left:0.125rem;
    top:0.72em;
    width:0.5rem;
    height:0.5rem;
    border-radius:50%;
    background:var(--purple);
  }

/* 本文中の画像（データ側で「[画像1]」） */
.p-column-detail__figure{margin:1.75rem 0;}

.p-column-detail__figure img{display:block; width:100%; height:auto; border-radius:6px;}

/* 縦長の画像などは幅を抑えて中央に置く（データの narrow） */
/* 2026年10月8日：枠（figure）は本文と同じ幅にし、画像だけを幅を抑えて中央に置く。
   画像の上の小見出しが、画像の左端ではなく本文の左端にそろう */
.p-column-detail__figure--narrow img{max-width:32.5rem; margin-left:auto; margin-right:auto;}

/* 枠線（書類の画像は白地なので、背景と区別できるように細い線を付ける） */
.p-column-detail__figure--narrow img{border:1px solid var(--line); border-radius:4px;}

/* 画像の上の小見出し（データの caption） */
.p-column-detail__caption{
    margin:0 0 0.5rem;
    font-size:.95rem;
    font-weight:700;
    line-height:1.5;
    color:var(--ink-soft);
    text-align:left;   /* 2026年10月8日 中央 → 左ぞろえ */
  }

/* ---------- 流れの図（データの diagrams）2026年10月8日 ---------- */
.p-column-flow{margin:2rem 0;}

.p-column-flow .p-column-detail__caption{font-size:1.05rem; color:var(--purple-900); margin-bottom:0.75rem;}

.p-column-flow__list{margin:0; padding:0; list-style:none;}

.p-column-flow__step{
    position:relative;
    display:flex;
    align-items:center;
    gap:1.25rem;
    padding:1.125rem 1.5rem;
    border-radius:12px;
    background:var(--purple-050);
  }

/* 段階の間の下向きの矢印 */
.p-column-flow__step + .p-column-flow__step{margin-top:1.75rem;}

.p-column-flow__step + .p-column-flow__step::before{
    content:"";
    position:absolute;
    left:50%;
    top:-1.375rem;
    margin-left:-0.8rem;
    border-left:0.8rem solid transparent;
    border-right:0.8rem solid transparent;
    border-top:0.8rem solid var(--purple-900);
  }

/* 3番目（意見照会書が届く）：黄色で目立たせる */
.p-column-flow__step.is-highlight{background:#fdf0b8; box-shadow:0 0 0 2px #f6dc72 inset;}

.p-column-flow__no{
    flex:none;
    width:3.25rem;
    height:3.25rem;
    border-radius:50%;
    background:var(--purple-900);
    color:#fff;
    font-size:1.6rem;
    font-weight:700;
    line-height:3.25rem;
    text-align:center;
  }

.p-column-flow__body{flex:1 1 auto; min-width:0;}

/* 本文の段落の指定（.p-column-detail__body p）より優先させるため、親の名前を付けて指定する */
.p-column-detail__body .p-column-flow__title{
    margin:0 0 0.375rem;
    font-size:1.45rem;
    font-weight:700;
    line-height:1.4;
    color:var(--purple-900);
    text-wrap:balance;
    word-break:auto-phrase;
  }

.p-column-flow__title em{font-style:normal; color:#B31F31;}

.p-column-detail__body .p-column-flow__text{margin:0; font-size:1.05rem; line-height:1.75; color:var(--ink-soft); text-wrap:pretty; word-break:auto-phrase;}

.p-column-flow__icon{flex:none; width:9rem; height:6rem;}

@media(max-width:768px){
  .p-column-flow__step{gap:0.75rem; padding:0.875rem 0.875rem;}
  .p-column-flow__no{width:2.5rem; height:2.5rem; font-size:1.25rem; line-height:2.5rem;}
  .p-column-detail__body .p-column-flow__title{font-size:1.35rem;}
  .p-column-flow__title br{display:none;}
  .p-column-detail__body .p-column-flow__text{font-size:1.15rem; line-height:1.7;}
  .p-column-flow__icon{width:5.25rem; height:3.5rem;}
}

/* 画像が未着の間の仮の枠 */
.p-column-detail__figure--placeholder{
    display:flex;
    align-items:center;
    justify-content:center;
    aspect-ratio:16 / 10;
    border:2px dashed var(--purple-300);
    border-radius:8px;
    background:var(--purple-050);
    color:var(--purple-300);
    font-size:1.1rem;
    font-weight:700;
  }

/* ---------- 監修者情報（記事の最後） ---------- */
.p-column-sv{
    margin-top:3.5rem;
    border:2px solid var(--purple-100);
    border-radius:12px;
    overflow:hidden;
    background:#fff;
  }

.p-column-sv__title{
    margin:0;
    padding:0.75rem 1.25rem;
    background:var(--purple-900);
    color:#fff;
    font-size:1.2rem;
    line-height:1.5;
  }

.p-column-sv__inner{
    display:flex;
    gap:1.75rem;
    padding:1.75rem 1.75rem 1.875rem;
  }

.p-column-sv__photo{
    flex:none;
    width:8.75rem;
    height:8.75rem;
    border-radius:50%;
    overflow:hidden;
    background:var(--purple-050);
  }

/* 写真は全身なので、顔のあたりを拡大して丸く切り抜く */
.p-column-sv__photo img{width:100%; height:100%; object-fit:cover; object-position:50% 0%; display:block; transform:scale(1.65); transform-origin:90% 6%;}  /* 人物の頭は写真の左右65.6%の位置。拡大後に丸の中央へ来る中心点 */

.p-column-sv__body{flex:1 1 auto; min-width:0;}

.p-column-sv__name{
    margin:0 0 0.75rem;
    font-size:1.5rem;
    font-weight:700;
    line-height:1.4;
    color:var(--purple-900);
  }

.p-column-sv__kana{margin-left:0.875rem; font-size:.95rem; font-weight:500; color:var(--ink-soft);}

.p-column-sv__rows{margin:0 0 1rem; display:grid; gap:0.375rem;}

.p-column-sv__row{display:grid; grid-template-columns:5.5rem minmax(0,1fr); gap:0.75rem; align-items:baseline;}

.p-column-sv__row dt{
    padding:0.1rem 0.5rem;
    border-radius:4px;
    background:var(--purple-050);
    color:var(--purple-900);
    font-size:.95rem;
    font-weight:700;
    text-align:center;
  }

.p-column-sv__row dd{margin:0; font-size:1.05rem; line-height:1.7;}

.p-column-sv__message{padding-top:1rem; border-top:1px dashed var(--line);}

.p-column-sv__message p{margin:0; font-size:1.05rem; line-height:1.85; color:var(--ink-soft);}

.p-column-sv__message p + p{margin-top:0.5rem;}

/* このコラムでわかること（画像の下・導入文の上）2026年10月7日 */
.p-column-points{
    max-width:53.75rem;
    margin:0 auto 2.25rem;
    border:2px solid var(--purple-900);
    border-radius:10px;
    background:#fff;
    overflow:hidden;
  }

.p-column-points__title{
    margin:0;
    padding:0.625rem 1.25rem;
    background:var(--purple-900);
    color:#fff;
    font-size:1.15rem;
    font-weight:700;
    line-height:1.5;
  }

.p-column-points__list{
    margin:0;
    padding:1.125rem 1.25rem 1.25rem;
    list-style:none;
    counter-reset:pt;
  }

.p-column-points__list li{
    position:relative;
    padding-left:2.25rem;
    font-size:1.3rem;   /* 2026-10-13 1.15rem → 1.3rem（一回り大きく） */
    font-weight:700;
    line-height:1.7;
    color:var(--purple-900);
    counter-increment:pt;
    text-wrap:balance;        /* 2行になるときは行の長さをそろえ、最後の1〜2文字だけが残らないようにする */
    word-break:auto-phrase;   /* 言葉の途中で改行しない（対応ブラウザのみ） */
  }

.p-column-points__list li + li{margin-top:0.75rem; padding-top:0.75rem; border-top:1px dashed var(--line);}

/* 番号（1〜3）を黄色の丸で表示 */
.p-column-points__list li::before{
    content:counter(pt);
    position:absolute;
    left:0;
    top:0.1em;
    width:1.6rem;
    height:1.6rem;
    border-radius:50%;
    background:var(--yellow);
    color:var(--purple-900);
    font-size:.95rem;
    font-weight:700;
    line-height:1.6rem;
    text-align:center;
  }

.p-column-points__list li + li::before{top:calc(0.75rem + 0.1em);}

/* ---------- 表（データの tables）2026-10-09 ---------- */
.p-column-table-wrap{margin:1.5rem 0 1.75rem; overflow-x:auto; -webkit-overflow-scrolling:touch;}

.p-column-table{
    width:100%;
    border-collapse:collapse;
    font-size:1.05rem;
    line-height:1.7;
    background:#fff;
  }

.p-column-table th,
.p-column-table td{
    word-break:auto-phrase;   /* 言葉の途中で改行しない（対応ブラウザのみ） */
    padding:0.875rem 1rem;
    border:1px solid var(--purple-100);
    vertical-align:top;
    text-align:left;
  }

.p-column-table thead th{
    background:var(--purple-900);
    color:#fff;
    font-weight:700;
    text-align:center;
    vertical-align:middle;
  }

.p-column-table thead th.p-column-table__corner{background:var(--purple-050); border-color:var(--purple-100);}

.p-column-table tbody th{
    width:9rem;
    background:var(--purple-050);
    color:var(--purple-900);
    font-weight:700;
    white-space:nowrap;
  }

/* 出典（行頭が「出典：」の段落）2026-10-13。直前の段落に寄せ、小さめの文字で表示 */
.p-column-detail__body p.p-column-detail__source{
    margin-top:0.5rem;
    font-size:.9rem;
    line-height:1.7;
    color:var(--ink-soft);
    word-break:auto-phrase;
  }

.p-column-detail__body p.p-column-detail__source a{
    color:var(--purple);
    text-decoration:underline;
    text-underline-offset:2px;
  }

.p-column-detail__body p.p-column-detail__source a:hover{color:var(--purple-900);}

/* 注記（行頭が「※」の段落） */
.p-column-detail__body p.p-column-detail__note{font-size:.95rem; line-height:1.75; color:var(--ink-soft);}

/* 原稿未確定の注意書き（FAQと同じ） */
.p-column-detail__draft{
    max-width:53.75rem;
    margin:0 auto 2rem;
    padding:0.875rem 1.25rem;
    border:2px dashed var(--purple-300);
    border-radius:8px;
    font-size:1.05rem;
    font-weight:700;
    color:var(--purple);
  }

/* ----------------------------------------------------------------------
   ミニCTA
   page-top.css の「Mini CTA band」と同じ指定。
   コラムページは page-top.css を読み込まないため、ここに複製している。
   TOP側を変更した場合はこちらも合わせて直すこと
   ---------------------------------------------------------------------- */
.c-mini-cta{
    background:var(--purple-900);
    padding:2.75rem 0;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    text-align:center;
  }

.c-mini-cta p{
    font-family:"Noto Sans JP",sans-serif;
    font-weight:700;
    color:#fff;
    font-size:1.2rem;
    margin:0 0 1.375rem;
  }

.c-mini-cta__note{
    margin:-0.75rem 0 1.375rem;
    color:#fff;
    font-family:"Noto Sans JP",sans-serif;
    font-weight:700;
  }

/* ---------- 関連コラム ---------- */
/* 個別ページは最終CTAを置かないため、下側の余白を確保する */
.p-column-foot{padding-top:3.5rem; padding-bottom:4.5rem;}

.p-column-related{max-width:53.75rem; margin:0 auto;}

.p-column-related__title{
    font-size:1.45rem;
    line-height:1.6;
    padding-bottom:0.75rem;
    border-bottom:2px solid var(--purple-100);
  }

.p-column-related__list{list-style:none; margin:0; padding:0;}

.p-column-related__item{border-bottom:1px solid var(--line);}

.p-column-related__link{
    display:block;
    padding:1.125rem 0.25rem;
    font-size:1.25rem;
    line-height:1.7;
    border-radius:8px;
    transition:background .2s ease;
  }

.p-column-related__link:hover{background:var(--purple-050);}

/* ---------- 一覧へ戻るボタン（FAQと同じ） ---------- */
.p-column-back{
    display:flex;
    align-items:center;
    justify-content:center;
    max-width:26.25rem;
    margin:3rem auto 0;
    padding:1.125rem 1.5rem;
    border:2px solid var(--purple-900);
    border-radius:999px;
    background:#fff;
    color:var(--purple-900);
    font-size:1.25rem;
    font-weight:700;
    line-height:1.6;
    text-align:center;
    transition:background .2s ease, color .2s ease;
  }

.p-column-back:hover{background:var(--purple-900); color:#fff;}

/* タイトルの1行分（データの title_html で使う）。途中で折り返さない。2026-10-08
   SPの文字の大きさ（4.6vw）は、1行目の18文字が本文の幅に収まるように決めている */
.p-column-title-line{white-space:nowrap;}

/* SPのときだけ改行する（データの title_html で使う）2026-10-08 */
.p-column-br-sp{display:none;}
@media(max-width:900px){ .p-column-br-sp{display:inline;} }

/* ======================================================================
   SP表示（判定は900px以下でサイト共通に揃える）
   ====================================================================== */
@media(max-width:900px){

  .p-column-list__link{gap:1rem; padding:1.25rem 0.5rem;}

  .p-column-list__thumb{width:6.25rem;}

  .p-column-list__chevron{width:1.25rem; height:1.25rem; margin-left:-0.25rem;}

  .p-column-list__title{font-size:1.25rem; padding-bottom:0.5rem;}

  .p-column-list__excerpt{margin-top:0.625rem; font-size:1rem; line-height:1.75;}

  .p-column-list__date{margin-top:0.625rem;}

  /* 2026-10-08 SPのタイトル：大見出し（h2）と同じく本文の幅いっぱいに表示する。
     行の長さをそろえる指定を外し、1行目（〜届いたら？　18文字）が本文の幅に収まる大きさにする */
  .c-hero--column h1.p-column-detail__title{font-size:min(4.6vw, 1.75rem); text-wrap:wrap; letter-spacing:0;}   /* 2026-10-08 4.85vw → 4.6vw（機種による文字幅の差でも「届いたら？」まで1行目に収まる余裕） */

  .p-column-detail__lead{font-size:1.2rem;}

  .p-column-toc{padding:1.25rem 1.25rem;}

  .p-column-detail__body h2{font-size:1.5rem;}

  .p-column-detail__body h3{font-size:1.4rem;}

  .p-column-back{max-width:100%; font-size:1.35rem;}

  .p-column-detail__list{padding:1rem 1rem;}

  /* 表：SPは文字を少し小さくし、画面の幅の中で折り返す（横スクロールにしない） */
  .p-column-table{font-size:.95rem;}

  .p-column-table th,
  .p-column-table td{padding:0.625rem 0.75rem;}

  .p-column-table tbody th{width:6.5rem; white-space:normal;}

  .p-column-points__list{padding:1rem 0.6rem 1.125rem;}   /* 2026-10-13 左右の余白を少し詰め、大きくした文字でも1行に収める */

  .p-column-points__list li{font-size:1.18rem; padding-left:1.75rem;}   /* 2026-10-13 1.06rem → 1.18rem（SPのみさらに一回り大きく）。001の②など長い項目は、文節の区切りで行の長さをそろえて2行になる */
  .p-column-points__list li::before{width:1.4rem; height:1.4rem; line-height:1.4rem; font-size:.85rem;}   /* 番号の丸を少し小さくして、文章の幅を確保 */

  .p-column-detail__list li{font-size:1.1rem;}

  .p-column-sv__inner{flex-direction:column; align-items:center; gap:1.125rem; padding:1.5rem 1.125rem;}

  .p-column-sv__photo{width:7.5rem; height:7.5rem;}

  .p-column-sv__name{text-align:center;}

  .p-column-sv__kana{display:block; margin:0.25rem 0 0;}

}

/* ---------- Utility classes ---------- */
.u-br-sp{display:none;}

@media(max-width:768px){.u-br-sp{display:inline;}}

.c-eyebrow--center{justify-content:center;}