/* ==========================================================================
   下層ページ・イラスト枠（v4）
   ========================================================================== */

/* --- ページ見出し：1画面を使い切らない、低く密度の高い見出し ------------
   1440×900 でヘッダー・パンくず・タイトル・説明文・イラストに加えて、
   次のコンテンツの冒頭までが同時に見える高さ（ヘッダーを除き 360〜430px）に収める。 */
.phn-pagehero {
  position: relative;
  padding-block: clamp(1rem, 0.75rem + 1vw, 1.75rem) clamp(1.25rem, 1rem + 1.2vw, 2rem);
  /* 見出しを色の面で塗らない。すぐ下のセクションと同じ地色にして、
     イラストの下に横一直線の境界が出ないようにする。 */
  background: var(--phn-white);
  overflow: hidden;
}
.phn-pagehero--tight { padding-bottom: clamp(1rem, 0.75rem + 0.9vw, 1.75rem); }
.phn-section--tight-top { padding-top: clamp(1.5rem, 1.1rem + 1.2vw, 2.25rem); }
/* 地色は「見出しのすぐ下に来るセクション」に合わせる。
   メンバーはアイボリーのセクションが続くため、ここだけアイボリー。 */
.phn-pagehero--ivory { background: var(--phn-ivory); }
.phn-pagehero--white, .phn-pagehero--sky, .phn-pagehero--green, .phn-pagehero--yellow { background: var(--phn-white); }

/* --- イラストのまわりの光 ------------------------------------------------
   四角い面ではなく、イラストを中心にした楕円のグラデーション。
   `farthest-side` と「100% で alpha 0」の組み合わせにより、見出しの上端・下端に
   届いた時点で色は完全に消えている。どこにも切り口（横線）ができない。 */
.phn-pagehero::before {
  content: "";
  position: absolute; z-index: 0; pointer-events: none;
  inset: 0 0 0 auto; inline-size: min(520px, 46vw);
  background: radial-gradient(farthest-side at 64% 50%,
    rgba(154, 214, 247, 0.32),
    rgba(154, 214, 247, 0.20) 26%,
    rgba(154, 214, 247, 0.08) 54%,
    rgba(154, 214, 247, 0.02) 78%,
    rgba(154, 214, 247, 0) 100%);
}
.phn-pagehero--green::before, .phn-pagehero--yellow::before {
  background: radial-gradient(farthest-side at 64% 50%,
    rgba(108, 194, 74, 0.19),
    rgba(108, 194, 74, 0.12) 26%,
    rgba(108, 194, 74, 0.05) 54%,
    rgba(108, 194, 74, 0.01) 78%,
    rgba(108, 194, 74, 0) 100%);
}
/* イラストを外した見出し（進学ページ）には光を置かない。 */
.phn-pagehero--plain::before { content: none; }

/* 見出しの直後のセクションは、上の余白を少しだけ詰めて第一画面の情報量を増やす */
.phn-pagehero + .phn-section { padding-top: calc(var(--phn-section) * 0.72); }

.phn-pagehero__inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--phn-space-5); align-items: center; }
.phn-pagehero__text { max-width: 44em; }
.phn-pagehero__title {
  font-size: var(--phn-h1-page); line-height: 1.26; letter-spacing: 0.03em;
  color: var(--phn-deep); margin-top: var(--phn-space-1);
}
.phn-pagehero .phn-crumb { margin-bottom: var(--phn-space-3); }
.phn-pagehero .phn-eyebrow { margin-bottom: 0; }
.phn-pagehero .phn-lead {
  margin-top: var(--phn-space-3);
  font-size: var(--phn-text-base); line-height: 1.85; letter-spacing: 0.04em;
  max-width: 38em;
}
.phn-pagehero__ill { inline-size: min(165px, 13.5vw); }

/* 小さな添え物（deco 指定のあるページだけ） */
.phn-pagehero__dot { position: absolute; z-index: 0; border-radius: 50%; pointer-events: none; }
.phn-pagehero__dot--a { inline-size: 12px; block-size: 12px; background: var(--phn-green-soft); top: 26%; right: 28%; opacity: .75; }
.phn-pagehero__dot--b { inline-size: 8px; block-size: 8px; background: var(--phn-sky); top: 70%; right: 34%; opacity: .8; }
.phn-pagehero__line {
  position: absolute; z-index: 0; pointer-events: none;
  top: 40%; right: 7%; inline-size: min(150px, 12vw); block-size: 0;
  border-top: 2px dotted var(--phn-sky-soft);
}
@media (max-width: 767px) { .phn-pagehero__dot, .phn-pagehero__line { display: none; } }

/* メンバーページの見出し：イラストだけ少し大きく */
.phn-pagehero--members .phn-pagehero__text { max-width: 36em; }
.phn-pagehero--members .phn-pagehero__ill { inline-size: min(185px, 15vw); }
.phn-pagehero--members { padding-bottom: clamp(1.25rem, 0.9rem + 1vw, 2rem); }

@media (max-width: 767px) {
  /* スマートフォンでは、PC よりもさらに低く収める */
  .phn-pagehero { padding-block: var(--phn-space-3) var(--phn-space-5); }
  .phn-pagehero__inner { grid-template-columns: minmax(0, 1fr); gap: var(--phn-space-2); }
  .phn-pagehero__ill, .phn-pagehero--members .phn-pagehero__ill { inline-size: 96px; order: -1; }
  /* イラストが左上に回るため、光の中心も左へ寄せる（上下は見出しの端で 0 のまま）*/
  /* イラストが見出しの上のほうに来るので、光の枠も上寄せにする。
     枠は見出しの内側に収まり、外周で alpha 0 になるため切り口はできない。 */
  .phn-pagehero::before {
    inset: 0 auto 26% 0; inline-size: min(360px, 88vw);
    background-image: radial-gradient(farthest-side at 20% 50%,
      rgba(154, 214, 247, 0.30), rgba(154, 214, 247, 0.18) 26%, rgba(154, 214, 247, 0.07) 54%,
      rgba(154, 214, 247, 0.02) 78%, rgba(154, 214, 247, 0) 100%);
  }
  .phn-pagehero--green::before, .phn-pagehero--yellow::before { background-image: radial-gradient(farthest-side at 20% 50%,
      rgba(108, 194, 74, 0.18), rgba(108, 194, 74, 0.11) 26%, rgba(108, 194, 74, 0.04) 54%,
      rgba(108, 194, 74, 0.01) 78%, rgba(108, 194, 74, 0) 100%); }
  .phn-pagehero .phn-crumb { margin-bottom: var(--phn-space-2); }
  .phn-pagehero .phn-lead { font-size: var(--phn-text-sm); line-height: 1.78; margin-top: var(--phn-space-2); }
}

/* --- パンくず ------------------------------------------------------------ */
.phn-crumb { margin-bottom: var(--phn-space-6); }
.phn-crumb ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0.45em; margin: 0; padding: 0; }
.phn-crumb li { display: flex; align-items: center; gap: 0.45em; font-size: var(--phn-text-xs); color: var(--phn-ink-muted); letter-spacing: 0.04em; }
.phn-crumb li + li::before { content: "／"; color: var(--phn-slate-soft); }
.phn-crumb a { color: var(--phn-green-ink); text-decoration: none; }
.phn-crumb a:hover { text-decoration: underline; }
.phn-crumb [aria-current="page"] { font-weight: 700; color: var(--phn-ink); }

/* --- 読み物本文 ---------------------------------------------------------- */
.phn-prose { max-width: var(--phn-measure); }
.phn-prose p { margin-bottom: 1.4em; }
.phn-prose h2 { margin: 2.2em 0 0.7em; font-size: var(--phn-h3); }
.phn-prose h3 { margin: 1.8em 0 0.5em; font-size: var(--phn-h4); }
.phn-prose ul, .phn-prose ol { margin: 0 0 1.4em 1.4em; }
.phn-prose li { list-style: disc; margin-bottom: 0.5em; }
.phn-prose a { color: var(--phn-green-ink); }

/* --- 2 カラム（文章＋小さなイラスト）------------------------------------ */
.phn-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 280px); gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: center; }
.phn-split--wide { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.phn-split__ill { display: flex; justify-content: center; }
.phn-split__ill .phn-ill { max-width: 220px !important; }
@media (max-width: 899px) {
  .phn-split, .phn-split--wide { grid-template-columns: minmax(0, 1fr); }
  .phn-split__ill { justify-content: flex-start; }
  .phn-split__ill .phn-ill { max-width: 160px !important; }
}

/* --- 研究テーマ（7 件の大きなカード）------------------------------------ */
.phn-projects { display: grid; gap: clamp(1.25rem, 1rem + 1.5vw, 2rem); }
.phn-project { scroll-margin-top: calc(var(--phn-header-h) + 32px); }
.phn-project__head { display: flex; align-items: flex-start; gap: var(--phn-space-5); margin-bottom: var(--phn-space-6); }
.phn-project__head .phn-research__icon { inline-size: 64px; block-size: 64px; flex: none; }
.phn-project__title { font-size: var(--phn-h3); color: var(--phn-deep); line-height: 1.5; margin-bottom: var(--phn-space-2); }
.phn-project__lead { margin: 0 0 var(--phn-space-4); font-weight: 700; color: var(--phn-green-ink); }
.phn-project__items { display: grid; gap: var(--phn-space-3); }
.phn-project__items li {
  padding: var(--phn-space-5) var(--phn-space-6);
  border-radius: var(--phn-radius-md);
  background: var(--phn-ivory);
  font-size: var(--phn-text-sm); line-height: 1.9;
}
.phn-card--white .phn-project__items li { background: var(--phn-ivory); }
.phn-project__items a { color: var(--phn-green-ink); text-decoration: underline; }
@media (max-width: 560px) { .phn-project__head { flex-direction: column; } }

.phn-research__pick { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.25rem, 1rem + 1.5vw, 2rem); }
@media (max-width: 1023px) { .phn-research__pick { grid-template-columns: minmax(0, 1fr); } }

/* --- リンク一覧 ---------------------------------------------------------- */
.phn-linklist { display: grid; gap: var(--phn-space-3); max-width: 46em; }
.phn-linklist a {
  display: flex; align-items: center; gap: var(--phn-space-5);
  min-block-size: 72px; padding: var(--phn-space-5) var(--phn-space-6);
  border-radius: var(--phn-radius-md); background: var(--phn-surface); box-shadow: 0 2px 12px rgba(47, 79, 62, 0.04);
  color: var(--phn-ink); text-decoration: none;
}
.phn-linklist a:hover { background: var(--phn-sky-pale); color: var(--phn-ink); transform: translateX(4px); }
.phn-linklist span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.phn-linklist b { font-family: var(--phn-font-head); color: var(--phn-deep); font-size: var(--phn-text-base); }
.phn-linklist small { color: var(--phn-ink-muted); font-size: var(--phn-text-xs); }
.phn-linklist .phn-ext-icon { margin-left: auto; flex: none; color: var(--phn-green-ink); inline-size: 1em; block-size: 1em; }

/* --- メンバー -------------------------------------------------------------
   区分ごとの大きな色面はやめ、見出し・番号・細い線・人数だけで区切る。
   教員は全文を常時表示する横長カード、それ以外は大きさの揃った 3 列カード。 */
.phn-memberpage {
  padding-bottom: calc(var(--phn-section-end) + var(--phn-radius-band) * 0.5);
}
.phn-memberpage__grid {
  display: grid; grid-template-columns: minmax(0, 1fr) 200px;
  gap: clamp(2.5rem, 3vw, 3.5rem); align-items: start; max-width: 1248px;
}
.phn-memberpage__main { min-width: 0; }
.phn-memberpage__side { min-height: 1px; }
@media (max-width: 1279px) {
  .phn-memberpage__grid { grid-template-columns: minmax(0, 1fr); }
  .phn-memberpage__side { display: none; }
}
/* 追従ナビを、本文と同じ中央寄せの幅の内側に置く */
.phn-secnav--side:has(~ .phn-memberpage) { right: max(1.25rem, calc((100vw - 1248px) / 2)); }

/* --- 区分の見出し：日本語が主役、英字は後ろに小さく添える ---------------- */
.phn-memgroup + .phn-memgroup { margin-top: clamp(1.75rem, 1.25rem + 1.2vw, 2.5rem); }
.phn-memgroup__head {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 0.6rem;
  margin-bottom: var(--phn-space-4);
  padding-bottom: var(--phn-space-3);
  border-bottom: 1px solid var(--phn-line);
  font-size: var(--phn-h4); line-height: 1.4;
}
.phn-memgroup__no {
  font-family: var(--phn-font-en); font-size: 0.8125rem; font-weight: 800;
  letter-spacing: 0.06em; color: var(--phn-green); flex: none;
}
.phn-memgroup__ja {
  font-family: var(--phn-font-head); font-weight: 700; color: var(--phn-deep);
  letter-spacing: 0.04em;
}
.phn-memgroup__en {
  font-family: var(--phn-font-en); font-size: 0.6875rem; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--phn-slate-soft);
}
.phn-memgroup__count {
  margin-left: auto; flex: none;
  font-family: var(--phn-font-en); font-size: 0.8125rem; font-weight: 700;
  color: var(--phn-ink-muted); letter-spacing: 0.04em;
}
.phn-memgroup__count b { font-size: 1.0625rem; color: var(--phn-deep); margin-right: 0.15em; }

/* --- 項目（研究テーマ・ひとこと・論文題目など）-------------------------- */
.phn-mem__dl { margin: 0; display: grid; gap: 0.5rem; }
.phn-mem__row { margin: 0; }
.phn-mem__row dt {
  font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.06em;
  color: var(--phn-green-ink); line-height: 1.5;
}
.phn-mem__row dd {
  margin: 0.15rem 0 0; font-size: 0.8125rem; line-height: 1.68;
  letter-spacing: 0.02em; color: var(--phn-ink);
}
.phn-mem__row dd a { color: var(--phn-sky-ink); }

/* --- 教員：全文を最初から表示する横長カード ------------------------------ */
.phn-facultylist { display: grid; gap: var(--phn-space-4); }
.phn-faculty {
  position: relative; display: grid; grid-template-columns: 128px minmax(0, 1fr);
  gap: var(--phn-space-5); align-items: start;
  padding: var(--phn-space-5) var(--phn-space-6);
  border-radius: var(--phn-radius-lg); background: var(--phn-surface);
  box-shadow: 0 6px 20px rgba(47, 79, 62, 0.05);
  overflow: hidden;
}
.phn-faculty__photo {
  inline-size: 128px; block-size: 128px; border-radius: 50%; overflow: hidden;
  background: var(--phn-sky-pale); display: grid; place-items: center; flex: none;
}
.phn-faculty__photo .phn-ill { inline-size: 100% !important; block-size: 100%; max-width: none !important; object-fit: cover; object-position: 50% 28%; }
.phn-faculty__photo .phn-ill--mark { inline-size: 52% !important; block-size: auto; }
.phn-faculty__role { margin: 0; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; color: var(--phn-green-ink); }
.phn-faculty__name { margin-top: 0.1rem; font-size: 1.375rem; color: var(--phn-deep); line-height: 1.35; }
.phn-faculty__name small { display: inline-block; margin-left: 0.7em; font-family: var(--phn-font-en); font-size: 0.75rem; font-weight: 700; color: var(--phn-ink-muted); letter-spacing: 0.04em; }
.phn-faculty .phn-mem__dl { margin-top: var(--phn-space-4); gap: 0.65rem; }
.phn-faculty .phn-mem__row dd { font-size: 0.875rem; line-height: 1.75; }
.phn-faculty__mail { margin: var(--phn-space-3) 0 0; font-size: var(--phn-text-xs); }
.phn-faculty__mail a { color: var(--phn-green-ink); }

/* --- 教員以外：初期表示の大きさを揃えた 3 列カード ----------------------- */
/* align-items: start ＝ 開いたカードだけが伸び、同じ行の他のカードは高さを変えない */
.phn-memgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--phn-space-4); align-items: start; }
.phn-memcard {
  display: flex; flex-direction: column;
  /* 初期表示の高さを揃える：見出し 62 ＋ 本文 156 ＋ ボタン 44 ＋ 余白 40 */
  min-block-size: 314px;
  padding: var(--phn-space-5) var(--phn-space-5) var(--phn-space-4);
  border-radius: var(--phn-radius-md); background: var(--phn-surface);
  box-shadow: 0 6px 20px rgba(47, 79, 62, 0.05);
}
/* 学年の行は、記載が無いカードでも高さだけ確保して氏名の位置を揃える */
.phn-memcard__head { display: flex; align-items: flex-start; gap: var(--phn-space-3); min-block-size: 62px; }
.phn-memcard__avatar {
  inline-size: 48px; block-size: 48px; margin-top: 2px; border-radius: 50%; overflow: hidden; flex: none;
  background: var(--phn-sky-pale); display: grid; place-items: center;
}
.phn-memcard:nth-child(3n-1) .phn-memcard__avatar { background: var(--phn-green-pale); }
.phn-memcard:nth-child(3n) .phn-memcard__avatar { background: var(--phn-yellow-pale); }
.phn-memcard__avatar .phn-ill { inline-size: 100% !important; block-size: 100%; max-width: none !important; object-fit: cover; }
.phn-memcard__avatar .phn-ill--mark { inline-size: 54% !important; block-size: auto; }
.phn-memcard__id { min-width: 0; display: grid; grid-template-rows: 1.05rem auto; align-content: start; }
.phn-memcard__role { grid-row: 1; font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.06em; color: var(--phn-sky-ink); line-height: 1.05rem; }
.phn-memcard__name { grid-row: 2; font-size: 1.0625rem; color: var(--phn-deep); line-height: 1.4; }
.phn-memcard__name small { display: block; font-family: var(--phn-font-en); font-size: 0.6875rem; font-weight: 700; color: var(--phn-ink-muted); letter-spacing: 0.02em; line-height: 1.5; }

/* 本文：初期は研究テーマ 2 行・ひとこと 3 行まで。全文は「さらに見る」で開く */
.phn-memcard__fields { margin-top: var(--phn-space-3); min-block-size: 156px; overflow: hidden; }
/* 省略は JavaScript が動くときだけ。無効な環境では全文がそのまま並ぶ */
.phn-js .phn-memcard:not(.is-open) .phn-mem__row--rest { display: none; }
.phn-js .phn-memcard:not(.is-open) .phn-mem__row dd {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden;
}
.phn-js .phn-memcard:not(.is-open) .phn-mem__row--theme dd { -webkit-line-clamp: 2; line-clamp: 2; }

.phn-memcard__more[hidden] { display: none; }
.phn-memcard__more {
  margin-top: auto; align-self: flex-start;
  display: inline-flex; align-items: center; gap: 0.4em;
  min-block-size: 44px; padding: 0 0.1em;
  background: none; border: 0; cursor: pointer;
  font-family: inherit; font-size: var(--phn-text-xs); font-weight: 700;
  letter-spacing: 0.04em; color: var(--phn-green-ink);
}
.phn-memcard__more:hover { color: var(--phn-deep); }
.phn-memcard__more .phn-acc__chev { inline-size: 1.05em; block-size: 1.05em; }
.phn-memcard.is-open .phn-memcard__more .phn-acc__chev { transform: rotate(180deg); }

@media (hover: hover) {
  .phn-faculty { transition: box-shadow var(--phn-duration) var(--phn-ease); }
  .phn-memcard:hover { box-shadow: 0 10px 24px rgba(47, 79, 62, 0.09); }
}

@media (max-width: 1023px) { .phn-memgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 719px) {
  .phn-memgrid { grid-template-columns: minmax(0, 1fr); gap: var(--phn-space-3); }
  .phn-memcard { min-block-size: 0; }
  .phn-memcard__fields { min-block-size: 0; }
  .phn-faculty { grid-template-columns: 88px minmax(0, 1fr); gap: var(--phn-space-4); padding: var(--phn-space-5) var(--phn-space-4); }
  .phn-faculty__photo { inline-size: 88px; block-size: 88px; }
  .phn-faculty__name { font-size: 1.1875rem; }
  .phn-faculty__name small { display: block; margin-left: 0; }
}

.phn-memberpage__alumni { margin-top: var(--phn-space-8); }

/* --- 修了生（年度ごとのアコーディオン）------------------------------------
   JavaScript を使わない details/summary なので、無効な環境でも開閉できる。 */
/* 見出しの説明文に続けて置く米印の注記（枠では囲わない） */
.phn-pagehero__note {
  display: block; margin-top: 0.5em;
  font-size: var(--phn-text-sm); line-height: 1.75; color: var(--phn-ink-muted);
}
@media (max-width: 767px) { .phn-pagehero__note { font-size: var(--phn-text-xs); } }
.phn-alumni__year {
  border-radius: var(--phn-radius-md); background: var(--phn-surface);
  box-shadow: 0 4px 14px rgba(47, 79, 62, 0.05);
  overflow: hidden;
}
.phn-alumni__year + .phn-alumni__year { margin-top: var(--phn-space-3); }
.phn-alumni__toggle {
  display: flex; align-items: center; gap: var(--phn-space-3);
  min-block-size: 56px; padding: var(--phn-space-3) var(--phn-space-5);
  cursor: pointer; list-style: none;
  font-family: var(--phn-font-head); color: var(--phn-deep);
}
.phn-alumni__toggle::-webkit-details-marker { display: none; }
.phn-alumni__toggle:hover { background: var(--phn-green-pale); }
.phn-alumni__yearname { font-size: var(--phn-h4); font-weight: 700; letter-spacing: 0.04em; }
.phn-alumni__count { font-family: var(--phn-font-en); font-size: var(--phn-text-xs); color: var(--phn-ink-muted); }
.phn-alumni__count b { font-size: 1rem; color: var(--phn-deep); margin-right: 0.15em; }
.phn-alumni__toggle .phn-acc__chev { margin-left: auto; inline-size: 1.2em; block-size: 1.2em; flex: none; color: var(--phn-green-ink); transition: transform var(--phn-duration) var(--phn-ease); }
.phn-alumni__year[open] .phn-alumni__toggle .phn-acc__chev { transform: rotate(180deg); }
.phn-alumni__year[open] .phn-alumni__toggle { border-bottom: 1px solid var(--phn-line); }

.phn-alumni__body { padding: var(--phn-space-5) var(--phn-space-5) var(--phn-space-6); }
.phn-alumni__course + .phn-alumni__course { margin-top: var(--phn-space-6); }
.phn-alumni__coursename {
  margin-bottom: var(--phn-space-3); padding-bottom: 0.4rem;
  border-bottom: 1px solid var(--phn-line);
  font-size: var(--phn-text-sm); font-weight: 700; letter-spacing: 0.06em; color: var(--phn-green-ink);
}
.phn-alumni__list { display: grid; gap: var(--phn-space-4); }
.phn-alumni__item { padding-left: var(--phn-space-4); border-left: 3px solid var(--phn-green-pale); }
.phn-alumni__name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.2rem 0.6rem; margin: 0; }
.phn-alumni__course-tag {
  padding: 0.1em 0.7em; border-radius: var(--phn-radius-pill);
  background: var(--phn-sky-pale); color: var(--phn-sky-ink);
  font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.04em; line-height: 1.8;
}
.phn-alumni__ja { font-family: var(--phn-font-head); font-size: 1.0625rem; font-weight: 700; color: var(--phn-deep); }
.phn-alumni__en { font-family: var(--phn-font-en); font-size: 0.75rem; font-weight: 700; color: var(--phn-ink-muted); letter-spacing: 0.02em; }
.phn-alumni__lab, .phn-alumni__meta { font-size: 0.75rem; color: var(--phn-ink-muted); }
.phn-alumni__dl { margin: 0.35rem 0 0; display: grid; gap: 0.3rem; }
.phn-alumni__row { margin: 0; }
.phn-alumni__row dt { font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.06em; color: var(--phn-green-ink); line-height: 1.5; }
.phn-alumni__row dd { margin: 0.1rem 0 0; font-size: 0.8125rem; line-height: 1.7; letter-spacing: 0.02em; color: var(--phn-ink); }
.phn-alumni__back { margin-top: var(--phn-space-8); }
@media (max-width: 719px) {
  .phn-alumni__toggle { padding-inline: var(--phn-space-4); }
  .phn-alumni__body { padding: var(--phn-space-4) var(--phn-space-4) var(--phn-space-5); }
  .phn-alumni__item { padding-left: var(--phn-space-3); }
}

/* --- 立場と氏名だけの区分（招へい教授・研究生）--------------------------- */
.phn-namelist { display: flex; flex-wrap: wrap; gap: var(--phn-space-3) var(--phn-space-5); }
.phn-namelist__item {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 0.15rem 0.7rem;
  padding: var(--phn-space-3) var(--phn-space-5);
  border-radius: var(--phn-radius-pill); background: var(--phn-surface);
  box-shadow: 0 4px 14px rgba(47, 79, 62, 0.05);
}
.phn-namelist__name { font-family: var(--phn-font-head); font-size: 1.0625rem; font-weight: 700; color: var(--phn-deep); }
.phn-namelist__en { font-family: var(--phn-font-en); font-size: 0.75rem; font-weight: 700; color: var(--phn-ink-muted); letter-spacing: 0.02em; }
.phn-namelist__rank { font-size: 0.75rem; color: var(--phn-ink-muted); }
/* メールアドレスを持つ人（招へい教授など）。氏名の下の行に、小さな封筒の印をつけて並べる */
.phn-namelist__item--mail { border-radius: var(--phn-radius-md); padding-block: var(--phn-space-3); }
.phn-namelist__mails { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 0 var(--phn-space-5); }
.phn-mailto {
  display: inline-flex; align-items: center; gap: 0.4em; min-height: 44px;
  font-size: 0.8125rem; letter-spacing: 0.02em; color: var(--phn-green-ink); text-decoration: none;
}
.phn-mailto__icon { inline-size: 0.95em; block-size: 0.95em; flex: none; opacity: 0.75; }
.phn-mailto:hover { text-decoration: underline; }
@media (max-width: 719px) { .phn-namelist { gap: var(--phn-space-2); } .phn-namelist__item { inline-size: 100%; } }

/* --- 研究室の構成（人数のまとめ）-----------------------------------------
   本文のカードと同じ左右の位置に収める（右側の追従ナビの分だけ内側で終わる）。 */
.phn-memsummary-section { padding-block: 0 var(--phn-space-6); }
.phn-memsummary-section > .phn-container { max-width: 1248px; }
.phn-memsummary {
  display: flex; flex-wrap: wrap; align-items: stretch; gap: var(--phn-space-2);
  max-width: calc(100% - 200px - clamp(2.5rem, 3vw, 3.5rem));
}
@media (max-width: 1279px) { .phn-memsummary { max-width: none; } }
.phn-memsummary__item a {
  display: flex; align-items: center; gap: 0.5rem; block-size: 100%;
  padding: 0.5rem 0.85rem 0.5rem 0.5rem; border-radius: var(--phn-radius-pill);
  background: var(--phn-surface); color: var(--phn-ink); text-decoration: none;
  box-shadow: 0 4px 14px rgba(47, 79, 62, 0.05);
  transition: transform var(--phn-duration) var(--phn-ease), box-shadow var(--phn-duration) var(--phn-ease);
}
.phn-memsummary__item a:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(47, 79, 62, 0.09); color: var(--phn-green-ink); }
/* 人数は必ず横一列。数字と「名」の間では折り返さない */
.phn-memsummary__num {
  display: inline-flex; align-items: baseline; justify-content: center; gap: 0.15em;
  min-inline-size: 36px; block-size: 34px; padding-inline: 0.55em;
  border-radius: var(--phn-radius-pill); background: var(--phn-sky-pale);
  font-family: var(--phn-font-en); font-size: 1rem; font-weight: 800; color: var(--phn-deep);
  line-height: 34px; white-space: nowrap; flex: none;
}
.phn-memsummary__num small { font-family: var(--phn-font-sans); font-size: 0.625rem; font-weight: 700; color: var(--phn-ink-muted); }
.phn-memsummary__label { font-family: var(--phn-font-head); font-size: var(--phn-text-xs); font-weight: 700; white-space: nowrap; }
.phn-memsummary__total {
  display: flex; align-items: center; gap: 0.35rem; margin-left: auto;
  block-size: 34px; align-self: center;
  font-size: var(--phn-text-xs); line-height: 34px; color: var(--phn-ink-muted); white-space: nowrap;
}
.phn-memsummary__total b { font-family: var(--phn-font-en); font-size: 1.0625rem; color: var(--phn-deep); }
@media (max-width: 719px) { .phn-memsummary__total { margin-left: 0; } }

/* --- 研究室の日常（写真が置かれたときだけ出る）--------------------------- */
.phn-labphotos { margin-top: var(--phn-space-7); }
.phn-labphotos__grid { display: grid; gap: var(--phn-space-3); grid-template-columns: repeat(3, minmax(0, 1fr)); }
.phn-labphotos__item { margin: 0; border-radius: var(--phn-radius-md); overflow: hidden; background: var(--phn-green-pale); }
.phn-labphotos__item .phn-ill { inline-size: 100% !important; max-width: none !important; block-size: 100%; object-fit: cover; }
.phn-labphotos__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.phn-labphotos__grid--3 .phn-labphotos__item:first-child { grid-row: span 2; grid-column: span 2; }
@media (max-width: 719px) { .phn-labphotos__grid, .phn-labphotos__grid--2 { grid-template-columns: minmax(0, 1fr); } .phn-labphotos__grid--3 .phn-labphotos__item:first-child { grid-column: span 1; grid-row: span 1; } }

/* --- 進学案内のステップ（カードをやめ、番号をつないだ流れで見せる）------ */
.phn-steps {
  --phn-step-gap: clamp(1.5rem, 1rem + 2vw, 3.25rem);
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--phn-step-gap); margin: 0; padding: 0;
}
.phn-steps__item { position: relative; display: flex; flex-direction: column; padding-top: 4.25rem; list-style: none; }
.phn-steps__num {
  position: absolute; top: 0; left: 0;
  display: inline-flex; align-items: center; justify-content: center;
  inline-size: 52px; block-size: 52px; border-radius: 50%;
  background: var(--phn-green-ink); color: #fff;
  font-family: var(--phn-font-en); font-size: 1.0625rem; font-weight: 800; letter-spacing: 0.04em;
}
/* 番号と番号をつなぐ点線 */
.phn-steps__item::before {
  content: ""; position: absolute; top: 26px; left: 64px;
  right: calc(var(--phn-step-gap) * -1);
  border-top: 2px dotted var(--phn-green-soft);
}
.phn-steps__item:last-child::before { display: none; }
.phn-steps__title { font-size: var(--phn-h3); color: var(--phn-deep); }
.phn-steps__body { margin: var(--phn-space-3) 0 0; color: var(--phn-ink-muted); font-size: var(--phn-card-body); }
.phn-steps__item .phn-textlink { margin-top: auto; padding-top: var(--phn-space-4); }
.phn-steps__item .phn-btn { margin-top: auto; align-self: flex-start; }
@media (max-width: 1023px) {
  .phn-steps { grid-template-columns: minmax(0, 1fr); gap: var(--phn-space-6); }
  .phn-steps__item { padding-top: 0; padding-left: 4.5rem; padding-bottom: var(--phn-space-5); }
  .phn-steps__num { inline-size: 46px; block-size: 46px; }
  .phn-steps__item::before {
    top: 54px; left: 22px; right: auto; bottom: calc(var(--phn-space-6) * -1);
    border-top: 0; border-left: 2px dotted var(--phn-green-soft);
  }
}

/* --- ページ末尾の CTA（カードにしない。細い線と余白で区切る）------------- */
.phn-finalcta {
  display: grid; grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--phn-space-6) clamp(2rem, 1rem + 4vw, 5rem); align-items: center;
  padding-top: clamp(2rem, 1.5rem + 1.5vw, 3rem);
  border-top: 1px solid var(--phn-line);
}
/* 2つともボタンにしたので、幅をそろえて縦に並べる（狭い方が広い方に合う） */
.phn-finalcta__actions { display: flex; flex-direction: column; align-items: stretch; gap: var(--phn-space-3); }
.phn-finalcta__actions .phn-btn { white-space: nowrap; }
@media (max-width: 899px) {
  .phn-finalcta__actions { align-items: flex-start; }
  .phn-finalcta__actions .phn-btn { inline-size: 100%; max-inline-size: 24em; }
}
.phn-finalcta .phn-lead { margin-top: var(--phn-space-3); }
@media (max-width: 899px) { .phn-finalcta { grid-template-columns: minmax(0, 1fr); } }

/* --- FAQ ----------------------------------------------------------------- */
.phn-faq { display: grid; gap: var(--phn-space-2); max-width: 52em; }
.phn-faq__item { border-radius: var(--phn-radius-md); background: var(--phn-surface); overflow: hidden; box-shadow: 0 2px 12px rgba(47, 79, 62, 0.04); }
.phn-faq__q {
  display: flex; align-items: center; gap: var(--phn-space-3);
  padding: var(--phn-space-3) var(--phn-space-5);
  min-block-size: 60px;
  font-family: var(--phn-font-head); font-size: var(--phn-text-base); font-weight: 700; color: var(--phn-deep);
  cursor: pointer; list-style: none;
}
.phn-faq__q::-webkit-details-marker { display: none; }
.phn-faq__mark {
  display: inline-flex; align-items: center; justify-content: center;
  inline-size: 32px; block-size: 32px; border-radius: 50%;
  background: var(--phn-sky-soft); color: var(--phn-deep);
  font-family: var(--phn-font-en); font-size: var(--phn-text-sm); font-weight: 800; flex: none;
}
.phn-faq__chev { inline-size: 1.2em; block-size: 1.2em; margin-left: auto; flex: none; color: var(--phn-green-ink); transition: transform var(--phn-duration) var(--phn-ease); }
.phn-faq__item[open] .phn-faq__chev { transform: rotate(180deg); }
.phn-faq__a { padding: 0 var(--phn-space-5) var(--phn-space-5) calc(var(--phn-space-5) + 32px + var(--phn-space-3)); }
.phn-faq__a p { color: var(--phn-ink); font-size: var(--phn-card-body); }
@media (max-width: 560px) { .phn-faq__a { padding-inline: var(--phn-space-6); } }

/* --- 教員別の連絡先 ------------------------------------------------------ */
.phn-contactlist { display: grid; gap: var(--phn-space-3); }
.phn-contactlist li { display: grid; gap: 2px; padding: var(--phn-space-4) var(--phn-space-5); border-radius: var(--phn-radius-md); background: rgba(255, 255, 255, 0.78); }
.phn-contactlist__role { font-family: var(--phn-font-en); font-size: var(--phn-text-xs); font-weight: 800; letter-spacing: 0.08em; color: var(--phn-sky-ink); }
.phn-contactlist__name { font-family: var(--phn-font-head); font-weight: 700; color: var(--phn-deep); }
.phn-contactlist a { font-size: var(--phn-text-sm); color: var(--phn-green-ink); }

/* --- はじめての方（3 つの入口）------------------------------------------- */
/* 3 枚のカードで、対象者・タイトル・説明文・リンクの位置を揃える */
.phn-audience {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: auto auto minmax(3rem, 1fr) auto;
  column-gap: clamp(1.25rem, 1rem + 1.5vw, 2rem); row-gap: var(--phn-space-3);
}
.phn-audience__item {
  display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: var(--phn-space-3);
  padding: var(--phn-card-pad);
}
@supports not (grid-template-rows: subgrid) {
  .phn-audience { grid-template-rows: none; }
  .phn-audience__item { display: flex; flex-direction: column; grid-row: auto; }
  .phn-audience__body { margin-bottom: auto; }
}
.phn-audience__for { align-self: start; font-family: var(--phn-font-en); font-size: var(--phn-text-xs); font-weight: 800; letter-spacing: 0.08em; color: var(--phn-sky-ink); margin: 0; }
.phn-audience__for--ja { font-family: var(--phn-font-head); letter-spacing: 0.05em; }
.phn-audience__title { align-self: start; font-size: var(--phn-h4); color: var(--phn-deep); }
.phn-audience__body { align-self: start; margin: 0; color: var(--phn-ink-muted); font-size: var(--phn-card-body); }
.phn-audience__item .phn-textlink { align-self: end; margin-top: 0; padding-top: 0; }
@media (max-width: 1023px) { .phn-audience { grid-template-columns: minmax(0, 1fr); } }

/* --- 学習会・教材 ---------------------------------------------------------- */
/* 体裁は「04 学習会・教材」の節（このファイル後半）に一本化している。
   ここには列数・面の色を書かない。 */
.phn-learning__icon { inline-size: 64px; block-size: 64px; }
.phn-learning__title { font-size: var(--phn-h4); color: var(--phn-deep); }
.phn-learning__body { margin: 0; color: var(--phn-ink-muted); font-size: var(--phn-text-sm); }
.phn-learning__meta { display: flex; flex-wrap: wrap; gap: var(--phn-space-2); margin: 0; }
.phn-learning__item .phn-textlink { margin-top: auto; padding-top: var(--phn-space-3); }
.phn-learning__links { margin-top: var(--phn-space-8); display: flex; flex-wrap: wrap; gap: var(--phn-space-3); }
.phn-learning__notice { margin-bottom: var(--phn-space-8); max-width: 52em; }

/* --- ページ送り・投稿ナビ ------------------------------------------------ */
/* 一覧と同じ幅（--phn-news-width）に収め、下にフッターと重ならないだけの余白を置く。
   フッター側の余白には頼らず、この要素自身が間隔を持つ。 */
.phn-pagination {
  margin-block: var(--phn-space-8) clamp(3rem, 2rem + 3vw, 5rem);
  max-inline-size: var(--phn-news-width);
  display: flex; flex-wrap: wrap; align-items: center;
  gap: var(--phn-space-2);
}
.phn-pagination .page-numbers {
  display: inline-flex; align-items: center; justify-content: center;
  min-inline-size: 48px; min-block-size: 48px; padding-inline: 0.85rem;
  border-radius: var(--phn-radius-pill); background: var(--phn-surface); color: var(--phn-ink);
  font-family: var(--phn-font-en); font-weight: 800; text-decoration: none;
}
.phn-pagination .page-numbers:hover { background: var(--phn-sky-pale); color: var(--phn-green-ink); }
.phn-pagination .page-numbers.current { background: var(--phn-green-ink); color: #fff; }

.phn-news__list--full { max-width: var(--phn-news-width); }

/* スマートフォンでは番号を少し詰めて、1 行に収まりやすくする。 */
@media (max-width: 560px) {
  .phn-pagination { gap: var(--phn-space-1); }
  .phn-pagination .page-numbers { min-inline-size: 44px; min-block-size: 44px; padding-inline: 0.6rem; font-size: var(--phn-text-sm); }
}

/* ==========================================================================
   イラスト枠（差し替え可能なスロット）。小さく点在させ、本文に重ねない。
   ========================================================================== */
.phn-ill { display: block; inline-size: 100%; block-size: auto; }
.phn-ill--placeholder {
  position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  border: 1.5px dashed var(--phn-slate-soft); border-radius: var(--phn-radius-md);
  background: rgba(255, 255, 255, 0.55); color: var(--phn-ink-muted);
  text-align: center; padding: 8%; overflow: hidden;
}
.phn-ill__deco { inline-size: 42%; max-width: 120px; opacity: .8; margin-bottom: 4px; }
.phn-ill__name { font-family: var(--phn-font-en); font-size: 0.75rem; font-weight: 800; letter-spacing: .08em; }
.phn-ill__hint { font-size: 0.75rem; line-height: 1.5; color: var(--phn-ink-muted); }
.phn-ill--mark { display: block; inline-size: 100%; block-size: 100%; }
.phn-ill--mark svg { inline-size: 100%; block-size: 100%; display: block; }

/* セクションの角に置く小さなイラスト（本文より背面、幅 120〜180px） */
/* 装飾は必ず本文より背面に置く（カードに重なっても、カードの下へ隠れる） */
.phn-corner { position: absolute; z-index: 0; pointer-events: none; inline-size: min(180px, 14vw); }
/* 下に装飾があるセクションは、その分だけ下の余白を足して重なりを避ける */
.phn-section:has(> .phn-corner--br), .phn-section:has(> .phn-corner--bl), .phn-section:has(> .phn-deco) {
  padding-bottom: calc(var(--phn-section-end) + 1rem);
}
/* 上に装飾があるセクションは、見出しが装飾の幅まで伸びないようにする */
@media (min-width: 1200px) {
  .phn-section:has(> .phn-corner--tr) .phn-section__head,
  .phn-section:has(> .phn-corner--tl) .phn-section__head { max-width: calc(100% - 220px); }
}
.phn-corner--tr { top: clamp(1.5rem, 3vw, 3rem); right: clamp(1.5rem, 4vw, 4rem); }
.phn-corner--tl { top: clamp(1.5rem, 3vw, 3rem); left: clamp(1.5rem, 4vw, 4rem); }
.phn-corner--br { bottom: clamp(1.5rem, 3vw, 3rem); right: clamp(1.5rem, 4vw, 4rem); }
.phn-corner--bl { bottom: clamp(1.5rem, 3vw, 3rem); left: clamp(1.5rem, 4vw, 4rem); }
.phn-corner--sm { inline-size: min(140px, 11vw); }
.phn-corner .phn-ill { max-width: 100% !important; }
.phn-corner .phn-ill__hint { display: none; }
@media (max-width: 1199px) { .phn-corner { display: none; } }

/* カード上部の小さなイラスト */
.phn-card__ill { display: flex; }

/* ==========================================================================
   お問い合わせ（人とのつながり）/ アクセス（場所とのつながり）
   ========================================================================== */

/* --- お問い合わせ：教員別の連絡先カード ---------------------------------- */
.phn-contactpage__wash  { inline-size: min(620px, 46vw); block-size: min(620px, 46vw); right: -14%; top: 8%; }
.phn-contactpage__wash2 { inline-size: min(660px, 50vw); block-size: min(660px, 50vw); left: -16%; bottom: 6%; }

.phn-contactcards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--phn-card-gap); }
.phn-contactcard { display: flex; flex-direction: column; align-items: flex-start; padding: var(--phn-card-pad); }
.phn-contactcard__avatar {
  display: block; inline-size: 84px; block-size: 84px; border-radius: 50%;
  overflow: hidden; background: var(--phn-green-pale); margin-bottom: var(--phn-space-5);
}
.phn-contactcard__avatar .phn-ill { inline-size: 100% !important; block-size: 100%; max-width: none !important; object-fit: cover; object-position: 50% 30%; }
.phn-contactcard__name { margin: 0.1rem 0 var(--phn-space-4); font-family: var(--phn-font-head); font-size: var(--phn-card-title); font-weight: 700; color: var(--phn-deep); }
.phn-contactcard .phn-textlink { font-size: var(--phn-text-sm); }
@media (max-width: 899px) { .phn-contactcards { grid-template-columns: minmax(0, 1fr); } }

/* --- お問い合わせの前に -------------------------------------------------- */
.phn-notelist { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--phn-card-gap); }
.phn-notelist > li { display: flex; flex-direction: column; padding: var(--phn-card-pad); }
.phn-notelist .phn-card__body { font-size: var(--phn-card-body); }
.phn-notelist .phn-card__foot { margin-top: auto; padding-top: var(--phn-space-5); }
@media (max-width: 899px) { .phn-notelist { grid-template-columns: minmax(0, 1fr); } }

/* --- アクセス：場所の情報 ------------------------------------------------ */
/* セクションの高さに収まる大きさにする（はみ出すと、切り口が横線に見えるため）*/
.phn-accesspage__wash { inline-size: min(460px, 36vw); block-size: min(460px, 36vw); right: -10%; bottom: 4%; }

.phn-placeinfo {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 0; margin: 0; max-width: 60em;
  border-radius: var(--phn-radius-lg); background: var(--phn-surface);
  box-shadow: 0 2px 12px rgba(47, 79, 62, 0.04);
  overflow: hidden;
}
.phn-placeinfo > div { padding: var(--phn-card-pad); }
.phn-placeinfo > div + div { border-left: 1px solid var(--phn-line); }
.phn-placeinfo dt {
  font-family: var(--phn-font-en); font-size: var(--phn-text-xs); font-weight: 800;
  letter-spacing: 0.14em; color: var(--phn-green-ink); margin-bottom: var(--phn-space-3);
}
.phn-placeinfo dd { margin: 0; font-family: var(--phn-font-head); font-size: var(--phn-text-md); font-weight: 700; color: var(--phn-deep); line-height: 1.6; word-break: auto-phrase; }
.phn-placeinfo__todo { font-family: var(--phn-font-sans) !important; font-size: var(--phn-text-sm) !important; font-weight: 400 !important; color: var(--phn-ink-muted) !important; line-height: 1.9; }
@media (max-width: 899px) {
  .phn-placeinfo { grid-template-columns: minmax(0, 1fr); }
  .phn-placeinfo > div + div { border-left: 0; border-top: 1px solid var(--phn-line); }
}

.phn-access__campus { margin-top: var(--phn-space-8); max-width: 260px; }
.phn-access__campus:empty { display: none; }

.phn-routecards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--phn-card-gap); }
.phn-routecards .phn-card { display: flex; flex-direction: column; padding: var(--phn-card-pad); }
.phn-routecards .phn-card__body { font-size: var(--phn-card-body); }
.phn-routecards .phn-card__foot { margin-top: auto; padding-top: var(--phn-space-6); }
@media (max-width: 799px) { .phn-routecards { grid-template-columns: minmax(0, 1fr); } }

/* ==========================================================================
   研究内容ページ（01 研究テーマ / 02 研究プロジェクト / 03 業績 / 04 学習会・教材）
   ========================================================================== */

/* --- 見出しの通し番号 ---------------------------------------------------- */
.phn-eyebrow__num {
  display: inline-flex; align-items: center; justify-content: center;
  inline-size: 22px; block-size: 22px; margin-right: 0.15em;
  border-radius: 50%; background: var(--phn-green-pale);
  font-size: 0.6875rem; letter-spacing: 0.04em; color: var(--phn-green-ink);
}

/* --- ページ内ナビゲーション ---------------------------------------------- */
/* 右の追従ナビと本文が重ならないよう、広い要素だけ右に余白を取る */
.phn-secnav__scope { position: relative; --phn-navgutter: 0px; }
@media (min-width: 1280px) { .phn-secnav__scope { --phn-navgutter: 210px; } }
@media (min-width: 1640px) { .phn-secnav__scope { --phn-navgutter: 0px; } }
.phn-secnav__scope .phn-themes,
.phn-secnav__scope .phn-projectrow,
.phn-secnav__scope .phn-learning,
.phn-secnav__scope .phn-works,
.phn-secnav__scope .phn-learning__notice,
.phn-secnav__scope .phn-section__head,
.phn-secnav__scope .phn-note { padding-inline-end: var(--phn-navgutter); }
.phn-secnav ol { list-style: none; margin: 0; padding: 0; }
.phn-secnav a { display: flex; align-items: center; text-decoration: none; }
.phn-secnav__num { font-family: var(--phn-font-en); font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.1em; }
.phn-secnav__label { font-family: var(--phn-font-head); font-weight: 700; letter-spacing: 0.04em; }

/* PC：画面右に細く追従する。背景は透明、現在地だけを緑で示す */
.phn-secnav--side {
  position: fixed; z-index: 700; inline-size: 165px;
  right: clamp(1.25rem, 2.5vw, 3rem); top: 50%; transform: translateY(-50%);
  max-block-size: 74vh; overflow-y: auto; overscroll-behavior: contain;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 420ms var(--phn-ease), visibility 420ms var(--phn-ease);
}
.phn-secnav--side.is-visible { opacity: 1; visibility: visible; pointer-events: auto; }
.phn-secnav--side ol { display: grid; gap: 0.15rem; border-left: 1px solid var(--phn-line); }
.phn-secnav--side a {
  gap: 0.6em; min-block-size: 44px; padding: 0.5rem 0 0.5rem 1rem; margin-left: -1px;
  border-left: 2px solid transparent;
  color: var(--phn-ink-muted); font-size: 0.8125rem;
  transition: color var(--phn-duration) var(--phn-ease), border-color var(--phn-duration) var(--phn-ease), transform var(--phn-duration) var(--phn-ease);
}
.phn-secnav--side a:hover { color: var(--phn-green-ink); transform: translateX(2px); }
.phn-secnav--side .phn-secnav__num { color: var(--phn-slate-soft); }
.phn-secnav--side .phn-secnav__label { font-weight: 600; }
.phn-secnav--side a.is-current { color: var(--phn-green-ink); border-left-color: var(--phn-green); }
.phn-secnav--side a.is-current .phn-secnav__label { font-weight: 800; }
.phn-secnav--top a.is-current .phn-secnav__label { font-weight: 800; }
.phn-secnav--side a.is-current .phn-secnav__num { color: var(--phn-green); }
@media (max-width: 1279px) { .phn-secnav--side { display: none; } }

/* スマートフォン：ヘッダー直下に横スクロールで置く */
.phn-secnav--top {
  position: sticky; top: calc(var(--phn-header-h) - 1px); z-index: 700;
  background: rgba(250, 248, 241, 0.94);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.phn-secnav--top ol {
  display: flex; gap: 0.5rem; overflow-x: auto; scrollbar-width: none;
  padding-block: 0.6rem; -webkit-overflow-scrolling: touch;
}
.phn-secnav--top ol::-webkit-scrollbar { display: none; }
.phn-secnav--top li { flex: none; }
.phn-secnav--top a {
  gap: 0.45em; min-block-size: 44px; padding-inline: 1rem;
  border-radius: var(--phn-radius-pill); background: var(--phn-surface);
  color: var(--phn-ink-muted); font-size: 0.8125rem; white-space: nowrap;
}
.phn-secnav--top .phn-secnav__num { color: var(--phn-slate-soft); }
.phn-secnav--top a.is-current { background: var(--phn-green-ink); color: #fff; }
.phn-secnav--top a.is-current .phn-secnav__num { color: var(--phn-green-soft); }
@media (min-width: 1280px) { .phn-secnav--top { display: none; } }

/* ページ内リンクの着地位置（固定ヘッダーとスマホ用ナビの分だけ下げる） */
.phn-secnav-target { scroll-margin-top: calc(var(--phn-header-h) + 68px); }
@media (min-width: 1280px) { .phn-secnav-target { scroll-margin-top: calc(var(--phn-header-h) + 24px); } }
[id^="theme-"] { scroll-margin-top: calc(var(--phn-header-h) + 84px); }

/* --- 01 研究テーマ：俯瞰できる小さなカード＋展開 ------------------------- */
.phn-themes__wash { inline-size: min(620px, 46vw); block-size: min(620px, 46vw); right: -14%; top: 12%; }
/* PC 2 列／スマートフォン 1 列。1 枚だけ横長にしたり強調したりしない。
   `align-items` は既定の stretch のままにして、同じ行のカードの高さをそろえる。 */
.phn-themes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--phn-card-gap); }
.phn-themecard {
  display: flex; flex-direction: column; gap: var(--phn-space-3);
  padding: var(--phn-card-pad);
  border-radius: var(--phn-radius-lg);
  background: var(--phn-surface);
  box-shadow: 0 2px 12px rgba(47, 79, 62, 0.04);
}
.phn-themecard__title { font-size: var(--phn-card-title); color: var(--phn-deep); line-height: 1.5; letter-spacing: 0.03em; }
.phn-themecard__meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 1rem;
  margin: 0; font-size: var(--phn-text-xs); color: var(--phn-ink-muted);
}
/* 文章量が違っても「主な研究業績を見る」の位置がそろうよう、下に寄せる。 */
.phn-themecard .phn-acc { margin-top: auto; }
.phn-themecard__owner { display: inline-flex; align-items: center; gap: 0.4em; font-weight: 700; }
.phn-themecard__owner svg { inline-size: 1em; block-size: 1em; flex: none; }
.phn-themecard__count {
  display: inline-block; padding: 0.15em 0.7em; border-radius: var(--phn-radius-pill);
  background: var(--phn-green-pale); color: var(--phn-green-ink); font-weight: 700;
}

/* --- 展開（アコーディオン）----------------------------------------------- */
.phn-acc { margin-top: var(--phn-space-5); border-top: 1px solid var(--phn-line); }
.phn-acc__toggle {
  display: flex; align-items: center; gap: 0.5em;
  min-block-size: 52px; padding-top: var(--phn-space-3);
  font-family: var(--phn-font-head); font-size: var(--phn-text-sm); font-weight: 700;
  color: var(--phn-green-ink); cursor: pointer; list-style: none;
}
.phn-acc__toggle::-webkit-details-marker { display: none; }
.phn-acc__toggle:hover { color: var(--phn-deep); }
.phn-acc__chev { inline-size: 1.1em; block-size: 1.1em; flex: none; transition: transform var(--phn-duration) var(--phn-ease); }
.phn-acc[open] > .phn-acc__toggle .phn-acc__chev { transform: rotate(180deg); }
.phn-acc__body { display: grid; gap: var(--phn-space-3); padding-bottom: var(--phn-space-2); }
.phn-acc__body li {
  padding: var(--phn-space-4) var(--phn-space-5);
  border-radius: var(--phn-radius-md); background: var(--phn-ivory);
  font-size: var(--phn-card-body); line-height: 1.9;
}
.phn-acc__body a { color: var(--phn-green-ink); text-decoration: underline; }
.phn-acc--more { margin-top: var(--phn-space-6); border-top: 0; }
.phn-acc--more > .phn-acc__toggle {
  justify-content: center; min-block-size: 56px; padding: 0 1.6rem;
  border: 2px solid var(--phn-green-ink); border-radius: var(--phn-radius-pill);
  inline-size: fit-content;
}
.phn-acc--more[open] > .phn-acc__toggle { margin-bottom: var(--phn-space-5); }

@media (max-width: 899px) { .phn-themes { grid-template-columns: minmax(0, 1fr); } }

/* --- 02 研究プロジェクト：カードを使わない軽い横並び --------------------- */
.phn-projectrow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 1rem + 2vw, 3rem); }
/* 以前は項目の上に緑の点線を引いていたが、導入文のすぐ下に横一列の点線が
   出て読みにくかったため廃止した。区切りは余白だけでつける。 */
.phn-projectrow__item { padding-top: var(--phn-space-2); }
.phn-projectrow__item .phn-research__icon { inline-size: 48px; block-size: 48px; margin-bottom: var(--phn-space-4); }
.phn-projectrow__title { font-size: var(--phn-text-md); color: var(--phn-deep); line-height: 1.6; letter-spacing: 0.03em; }
@media (max-width: 899px) { .phn-projectrow { grid-template-columns: minmax(0, 1fr); gap: var(--phn-space-6); } }

/* --- 03 業績：年つきのリスト（カードにしない）--------------------------- */
.phn-works { display: grid; gap: 0; border-top: 1px solid var(--phn-line); max-width: 62em; }
.phn-works__item {
  display: grid; grid-template-columns: 4.5rem minmax(0, 1fr);
  gap: var(--phn-space-4); align-items: baseline;
  padding-block: var(--phn-space-5); border-bottom: 1px solid var(--phn-line);
}
.phn-works__year { font-family: var(--phn-font-en); font-size: var(--phn-text-sm); font-weight: 800; color: var(--phn-green-ink); letter-spacing: 0.04em; }
.phn-works__body { display: block; }
.phn-works__text { display: block; font-size: var(--phn-card-body); line-height: 1.9; }
.phn-works__text a { color: var(--phn-green-ink); text-decoration: underline; }
.phn-works__owner { display: inline-block; margin-top: var(--phn-space-2); font-size: var(--phn-text-xs); color: var(--phn-ink-muted); }
@media (max-width: 560px) {
  .phn-works__item { grid-template-columns: minmax(0, 1fr); gap: var(--phn-space-2); }
}
/* --- 業績の最後に置く researchmap への案内 -------------------------------
   業績セクションと同じ白。細い罫線と余白だけで「このセクションの続き」に見せる。 */
.phn-rmap {
  margin-top: clamp(2.25rem, 1.75rem + 2vw, 3.5rem);
  max-width: 62em;
  padding: var(--phn-card-pad);
  border: 1px solid var(--phn-line); border-radius: var(--phn-radius-lg);
  background: var(--phn-surface);
}
.phn-rmap__title { font-size: var(--phn-h4); color: var(--phn-deep); margin: 0; letter-spacing: 0.03em; }
.phn-rmap__body {
  margin: var(--phn-space-3) 0 0; max-width: 40em;
  font-size: var(--phn-card-body); line-height: 1.9; color: var(--phn-ink-muted);
}
/* ボタンは同じ幅で横並び。入りきらない幅では自動的に折り返して縦に積む。 */
.phn-rmap__list {
  list-style: none; margin: var(--phn-space-6) 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
  gap: var(--phn-space-3);
}
.phn-rmap__btn { inline-size: 100%; text-align: center; }
.phn-rmap__btn .phn-ext-icon { inline-size: 1em; block-size: 1em; flex: none; margin-left: 0.15em; }

/* --- 04 学習会・教材：淡い面のグリッド（研究テーマと印象を変える）-------- */
/* PC 3 列／タブレット 2 列／スマートフォン 1 列。
   面の色分け（水色・緑）は廃止し、すべて白＋同じ枠線・角丸・余白にそろえる。
   色はタグとアイコンだけに残す。`align-items` は既定の stretch なので、
   同じ行のカードの高さは自動的にそろう。 */
.phn-learning { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--phn-card-gap); }
.phn-learning__item {
  display: flex; flex-direction: column; gap: var(--phn-space-4);
  padding: var(--phn-card-pad);
  border: 1px solid var(--phn-line); border-radius: var(--phn-radius-lg);
  background: var(--phn-surface);
  box-shadow: 0 2px 12px rgba(47, 79, 62, 0.04);
}
.phn-learning__item .phn-learning__icon { inline-size: 56px; block-size: 56px; }
@media (max-width: 1023px) { .phn-learning { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 699px) { .phn-learning { grid-template-columns: minmax(0, 1fr); } }

/* ==========================================================================
   進学ページ（/admission/）：一続きに読ませる流れ（2026-09-22）
   横線や色面の切り替えで区切らず、アイボリー1色のうえで
   「余白 → 英字ラベル → 見出し」の繰り返しだけで段落を分ける。
   ========================================================================== */

/* 面の色をそろえる。ページヒーローからフッターまでが 1 枚の紙に見える状態にする。
   地色はラッパー側だけが持ち、各セクションは透明にして、下に敷いた緑を透かす。 */
.phn-admissionflow { position: relative; background: var(--phn-ivory); }
.phn-admissionflow .phn-pagehero,
.phn-admissionflow .phn-section { background: transparent; }
/* セクションの境目で切れないよう、ページ全体にかかる大きさで 1 枚だけ置く。 */
.phn-admissionflow__wash {
  inline-size: min(880px, 62vw); block-size: min(880px, 62vw);
  left: -14%; top: 12%;
}
@media (max-width: 899px) {
  .phn-admissionflow__wash { inline-size: min(560px, 120vw); block-size: min(560px, 120vw); left: -34%; top: 14%; }
}

/* セクションの上下余白。取りすぎると「別のブロック」に見えるので詰め気味にする。 */
.phn-admissionflow .phn-section--msg { padding-block: clamp(2rem, 1.5rem + 1.4vw, 3rem); }
.phn-admissionflow .phn-section--faq { padding-block: clamp(2rem, 1.5rem + 1.4vw, 3rem) clamp(2.25rem, 1.7rem + 1.5vw, 3.25rem); }
/* 末尾の CTA だけは下を広くとり、フッターとはっきり分ける。 */
.phn-admissionflow .phn-section--endcta { padding-block: clamp(2.5rem, 1.9rem + 1.8vw, 3.75rem) clamp(3.5rem, 2.5rem + 3vw, 6rem); }

/* 末尾 CTA の上の細い罫線をやめ、余白だけで区切る。 */
.phn-admissionflow .phn-finalcta { border-top: 0; padding-top: 0; }

/* --- イラストを外したページ見出し --------------------------------------
   イラストがないぶん 1 カラムで組むが、文字の大きさと余白は他ページの
   見出しと同じにする。ここだけ見出しが大きいと別サイトのように見える。 */
.phn-pagehero--plain .phn-pagehero__inner { grid-template-columns: minmax(0, 1fr); }

/* --- 院生募集メッセージ（左：文章／右：お問い合わせボタン）-------------- */
/* 文章全体を太字にせず、本文のウェイトに戻す。強調は .phn-mark の語だけ。 */
.phn-admission__quote--body {
  margin: var(--phn-space-5) 0 0;
  font-family: var(--phn-font-sans);
  font-size: var(--phn-text-base);
  font-weight: 400;
  line-height: var(--phn-leading-body);
  letter-spacing: var(--phn-tracking-body);
  color: var(--phn-ink);
}
.phn-split--msg { align-items: center; }
.phn-msgcta { display: flex; justify-content: flex-end; }
.phn-msgcta .phn-btn { white-space: nowrap; }
/* スマートフォンでは文章の下にボタンを置く（.phn-split が 1 カラムに切り替わる）。 */
@media (max-width: 899px) {
  .phn-msgcta { justify-content: flex-start; margin-top: var(--phn-space-5); }
  .phn-msgcta .phn-btn { inline-size: 100%; max-inline-size: 22em; justify-content: center; }
}

/* ==========================================================================
   アクセスページ（/access/）：所在地・地図・交通アクセスだけの短いページ（2026-09-23）
   ========================================================================== */

/* 進学ページと同じく、面の色を切り替えず 1 枚の紙に見せる。 */
.phn-accessflow { position: relative; background: var(--phn-ivory); }
.phn-accessflow .phn-section { background: transparent; }
/* 説明文を置いていないぶん、見出しの下は詰める。 */
.phn-pagehero--access { background: var(--phn-ivory); padding-bottom: clamp(1rem, 0.75rem + 0.9vw, 1.75rem); }
.phn-accessflow .phn-section--place { padding-block: clamp(1.75rem, 1.3rem + 1.4vw, 2.75rem) clamp(2rem, 1.5rem + 1.4vw, 3rem); }
.phn-accessflow .phn-section--endcta { padding-block: clamp(2.5rem, 1.9rem + 1.8vw, 3.75rem) clamp(3.5rem, 2.5rem + 3vw, 6rem); }
.phn-accessflow .phn-finalcta { border-top: 0; padding-top: 0; }

/* --- 所在地（ページ内で 1 回だけ）--------------------------------------- */
.phn-address__label {
  margin: 0 0 var(--phn-space-2);
  font-family: var(--phn-font-en); font-size: var(--phn-text-xs); font-weight: 800;
  letter-spacing: 0.14em; color: var(--phn-green-ink);
}
.phn-address__value { color: var(--phn-deep); line-height: 1.5; word-break: auto-phrase; }

/* --- Google マップ：大きく、本文と同じ角丸で ----------------------------- */
.phn-map {
  margin-top: clamp(1.5rem, 1.1rem + 1.2vw, 2.25rem);
  border-radius: var(--phn-radius-lg);
  overflow: hidden;
  background: var(--phn-white);
  box-shadow: var(--phn-shadow-soft);
  aspect-ratio: 16 / 9;
  /* 大きく見せつつ、1 画面を丸ごと使い切らない高さに抑える。 */
  max-block-size: 600px;
}
.phn-map iframe { display: block; inline-size: 100%; block-size: 100%; border: 0; }
@media (max-width: 899px) { .phn-map { aspect-ratio: 4 / 3; border-radius: var(--phn-radius-md); } }
@media (max-width: 560px) { .phn-map { aspect-ratio: 1 / 1; } }

.phn-access__actions { margin: clamp(1.5rem, 1.1rem + 1.2vw, 2.25rem) 0 0; }
@media (max-width: 560px) {
  .phn-access__actions .phn-btn { inline-size: 100%; justify-content: center; }
}

/* 以下は簡素化で使わなくなった（.phn-placeinfo / .phn-routecards /
   .phn-access__campus / .phn-accesspage__wash）。元に戻せるよう定義だけ残している。 */

/* ==========================================================================
   スマートフォン（max-width: 767px）の共通調整（2026-09-26）
   下層ページの見出し・カード・幅の調整をここにまとめる。
   ファイル末尾に置くことで、上の各節にある 560px / 719px などの指定より優先される。
   ========================================================================== */
@media (max-width: 767px) {
  /* --- 幅：1 カラムの子要素は内容の幅で広がらない -------------------- */
  .phn-themecard, .phn-learning__item, .phn-contactcard, .phn-notelist > li,
  .phn-audience__item, .phn-memcard, .phn-faculty, .phn-alumni__year,
  .phn-steps__item, .phn-projectrow__item, .phn-rmap, .phn-works__item,
  .phn-pagehero__text, .phn-split > *, .phn-finalcta > * { min-width: 0; }

  /* --- 文節折り返しの解除（pages.css 側で auto-phrase を指定している要素）--- */
  .phn-placeinfo dd, .phn-address__value { word-break: normal; overflow-wrap: break-word; line-break: strict; }

  /* --- 装飾の光は、ページ幅を超えた分をラッパー側で切る ----------------
     body の overflow-x: hidden に頼らず、はみ出す要素そのものを収める。 */
  .phn-admissionflow, .phn-accessflow { overflow: hidden; }

  /* --- 内側余白：カードの端から 24px、リスト項目は 16〜20px ---------------- */
  .phn-project__items li, .phn-acc__body li { padding: var(--phn-space-4) var(--phn-space-5); }
  .phn-linklist a { padding: var(--phn-space-4) var(--phn-space-5); gap: var(--phn-space-4); }
  /* FAQ の回答は Q マークの分だけ字下げしていたが、375px では本文が 243px に狭まるため
     質問文と同じ左端にそろえる */
  .phn-faq__a { padding: 0 var(--phn-space-5) var(--phn-space-5); }

  /* --- メンバー：教員カード ---------------------------------------------
     写真 88px ＋ 本文の 2 列グリッドでは本文が 199px に狭まり、行末が凸凹になる。
     写真は左に回り込ませ（役職・氏名はその右）、研究テーマ以降は写真の下で全幅にする。 */
  .phn-faculty { display: block; padding: var(--phn-space-5); }
  .phn-faculty__photo { float: left; inline-size: 72px; block-size: 72px; margin: 0 var(--phn-space-4) var(--phn-space-3) 0; }
  .phn-faculty__body { min-width: 0; }
  .phn-faculty__role { min-block-size: 0; }
  .phn-faculty__name { font-size: 1.125rem; }
  .phn-faculty .phn-mem__dl { clear: both; padding-top: var(--phn-space-2); }
  .phn-faculty__mail { clear: both; }
  .phn-mem__row dd a, .phn-faculty__mail a { overflow-wrap: anywhere; }

  /* --- 業績・研究テーマの見出しは 17〜18px ---------------------------------- */
  .phn-project__title, .phn-steps__title { font-size: var(--phn-h3); }
  .phn-projectrow__title { font-size: var(--phn-h4); }
}

/* --- スマートフォン：ページ末尾の 2 つのボタンを横並びに（2026-09-26 第 2 回）--- */
@media (max-width: 767px) {
  .phn-finalcta__actions {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem;
  }
  .phn-finalcta__actions .phn-btn {
    inline-size: auto; max-inline-size: none;
    min-height: 48px; padding: 0.5em 0.5em; gap: 0.3em;
    font-size: 0.8125rem; letter-spacing: 0.02em; white-space: nowrap;
  }
}

/* ==========================================================================
   スマートフォン：下層ページ・研究内容ページ（2026-09-26 第 4 回）
   すべて 767px 以下だけ。PC の値は上の各節のまま。
   ========================================================================== */
@media (max-width: 767px) {
  /* --- 3. ページ見出しの装飾イラスト（全ページ共通）は出さない ------------
     イラストの後ろの光（::before）も、イラストが無いと左上に色だけ残るので消す。
     見出しの grid は 1 列なので、消した列の高さ・余白は残らない。 */
  .phn-pagehero__ill { display: none; }
  .phn-pagehero::before { content: none; }
  .phn-pagehero__inner { gap: 0; }

  /* --- 4. ページ内ナビ（研究内容・メンバー）：横スクロールのピルをやめ、本文幅の 2 列一覧にする --
     研究内容は 4 項目 → 2 行、メンバーは 8 区分 → 4 行。追従（sticky）はやめて見出しの下に置く。
     ol は .phn-container だが、上の `.phn-secnav ol { margin: 0 }` が中央寄せ（margin-inline: auto）に
     勝って左端 0px から始まっていた（「左に寄りすぎ」の原因）。本文と同じ左右位置に戻す */
  .phn-secnav--top {
    position: static; background: transparent;
    backdrop-filter: none; -webkit-backdrop-filter: none;
  }
  .phn-secnav--top ol {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 0.75rem;
    overflow: visible; padding-block: 0; margin-inline: auto;
    border-top: 1px solid var(--phn-line);
  }
  .phn-secnav--top li { min-width: 0; border-bottom: 1px solid var(--phn-line); }
  .phn-secnav--top a {
    position: relative;
    display: flex; align-items: center; gap: 0.4em;
    block-size: 100%; min-block-size: 44px; padding: 0.5rem 1.25rem 0.5rem 0;
    border-radius: 0; background: transparent;
    color: var(--phn-deep); font-size: 0.875rem; letter-spacing: 0.01em;
    white-space: normal; line-height: 1.4;
  }
  .phn-secnav--top .phn-secnav__num { font-size: 0.625rem; color: var(--phn-green); flex: none; }
  /* 共通の字間 0.04em だと 360px 幅で「研究プロジェクト」（8 文字）が 1 文字分あふれて折り返すため詰める */
  .phn-secnav--top .phn-secnav__label { letter-spacing: 0.01em; }
  /* 右端に小さな下向きの山形（ページ内リンク）。長い区分名は山形の手前で折り返す */
  .phn-secnav--top a::after {
    content: ""; position: absolute; right: 0.35rem; top: 50%;
    inline-size: 7px; block-size: 7px;
    border-right: 2px solid var(--phn-green-soft); border-bottom: 2px solid var(--phn-green-soft);
    transform: translateY(-70%) rotate(45deg);
  }
  /* 現在地は文字色だけで示す（塗りつぶしは使わない） */
  .phn-secnav--top a.is-current { background: transparent; color: var(--phn-green-ink); }
  .phn-secnav--top a.is-current .phn-secnav__num { color: var(--phn-green-ink); }
  .phn-secnav--top a:focus-visible { outline-offset: -3px; }
  /* ナビが追従しなくなった分、移動先の余白は html の scroll-padding-top（ヘッダー＋24px）だけでよい。
     scroll-margin-top は scroll-padding に加算されるため 0 にする（以前は sticky ナビの分 68px を足していた） */
  .phn-secnav-target, [id^="theme-"] { scroll-margin-top: 0; }

  /* --- 5. 研究プロジェクト：アイコンを外し、研究テーマと同じ白いカードにする -- */
  .phn-projectrow { gap: 0.75rem; }
  .phn-projectrow__item {
    display: flex; flex-direction: column; gap: var(--phn-space-3);
    padding: var(--phn-card-pad);
    border-radius: var(--phn-radius-lg); background: var(--phn-surface);
    box-shadow: 0 2px 12px rgba(47, 79, 62, 0.04);
  }
  .phn-projectrow__item .phn-research__icon { display: none; }
  .phn-projectrow__title { font-size: var(--phn-card-title); line-height: 1.5; }

  /* --- 6. 学習会・教材：アイコンを外し、枠線をやめて研究テーマ・プロジェクトと同じ面にそろえる -- */
  .phn-learning { gap: 0.75rem; }
  .phn-learning__item { gap: var(--phn-space-3); border: 0; }
  .phn-learning__item .phn-learning__icon { display: none; }
  .phn-learning__title { font-size: var(--phn-card-title); line-height: 1.5; }
  .phn-learning__item .phn-textlink { padding-top: 0; }
}

/* --- スマートフォン：メンバーページのナビ統合（2026-09-26 第 5 回・改）------------
   上部ナビは番号なしの 2 列×4 段（区分名・人数バッジ・下向きの山形）。ナビの上に合計人数。
   重複していた「研究室の構成」（人数ピル）は出さない。PC は従来どおり（右側ナビ＋研究室の構成）。 */
@media (max-width: 767px) {
  /* 「研究室の構成」の節ごと非表示。節の上下余白も一緒に消え、読み上げ・タブ移動の対象からも外れる */
  .phn-memsummary-section { display: none; }

  /* 番号は出さない（本文の見出しの「01 教員」は従来どおり） */
  .phn-secnav--top .phn-secnav__num { display: none; }
  /* 列間 16px。行の高さはグリッドが行ごとにそろえる */
  .phn-secnav--top ol { column-gap: 1rem; }
  .phn-secnav--top .phn-secnav__label { min-width: 0; }

  /* 人数バッジ：区分名の右、山形の手前。淡い緑の面に濃い緑の文字（4.7:1）。1 桁でも 2 桁でも同じ大きさ */
  .phn-secnav--top .phn-secnav__count {
    display: inline-flex; align-items: baseline; justify-content: center;
    margin-left: auto; flex: none; min-inline-size: 2.6em;
    padding: 0.1em 0.45em; border-radius: var(--phn-radius-pill);
    background: var(--phn-green-pale); color: var(--phn-green-ink);
    font-family: var(--phn-font-en); font-size: 0.6875rem; font-weight: 800; line-height: 1.6;
    letter-spacing: 0.02em; white-space: nowrap;
  }
  .phn-secnav--top .phn-secnav__count small { font-family: var(--phn-font-sans); font-size: 0.625rem; font-weight: 700; margin-left: 0.1em; }
  /* バッジと山形の間は 8px 程度あける */
  .phn-secnav--top a:has(.phn-secnav__count) { padding-right: 1.25rem; }

  /* 合計人数：説明文とナビの間、右寄せの小さなピル。ナビとの間隔 12px */
  .phn-secnav__total {
    display: flex; justify-content: flex-end; margin: 0 auto 0.75rem;
    font-size: 0.8125rem; color: var(--phn-green-ink); letter-spacing: 0.04em;
  }
  .phn-secnav__total span {
    display: inline-flex; align-items: baseline; gap: 0.1em;
    padding: 0.15em 0.75em; border-radius: var(--phn-radius-pill); background: var(--phn-green-pale);
  }
  .phn-secnav__total b { font-family: var(--phn-font-en); font-size: 0.9375rem; font-weight: 800; }

  /* 「研究室の構成」の節を消した分、ナビと最初の区分見出しの間に余白を置く（節の下余白 32px と同じ） */
  .phn-memberpage { padding-top: var(--phn-space-6); }
}
/* 360px 幅では「博士前期課程M2 7名」が 1 列に収まりきらないため、ナビの文字だけ 13px にする */
@media (max-width: 370px) {
  .phn-secnav--top a { font-size: 0.8125rem; }
}
