@charset "UTF-8";
/* =========================================================
    香川大学 医学部 看護学科 在宅看護学 特設ページ
    カンプ再現 (Illustrator bundle / baseWidth 1200)
    代替フォント:
    PA1GothicStd(モリサワ系ゴシック) → Noto Sans JP
    PA1MinchoStdN(明朝)            → Noto Serif JP
   ========================================================= */

:root {
  --font-gothic: "Noto Sans JP", "Hiragino Kaku Gothic ProN", sans-serif;
  /* 本来 PA1GothicStd */
  --font-mincho: "Noto Serif JP", "Hiragino Mincho ProN", serif;
  /* 本来 PA1MinchoStdN */

  --color-white: #ffffff;
  --color-text: #58585f;
  /* 本文 */
  --color-accent: #ff852a;
  /* オレンジ アクセント/CTA */
  --color-heading: #525a62;
  /* 見出しグレー */
  --color-cream: #fde9b8;
  /* 淡い黄色の背景（データ由来: 金グラデ50%を白上に合成した近似色。実背景は画像で敷く） */
  --color-yellow: #fff3c9;
  /* カード淡黄 */
  --color-tag: #ffe88d;
  /* モーダル経歴タグの黄（member-popupデータ由来） */

  --news-blue: #8bd2f2;
  --news-pink: #db94be;
  --news-green: #a5ce58;
  --news-purple: #9792d3;
  --news-magenta: #f570a1;
  --news-lblue: #6fa8dc;
  --news-salmon: #f29b82;
  --news-teal: #7fd8be;
  --news-gray: #b7b7b8;
}

body {
  font-family: var(--font-gothic);
  color: var(--color-text);
  background: var(--color-white);
  line-height: 1.7;
  overflow-x: clip;
}

img {
  max-width: 100%;
}

/* ---------- レイアウト共通 ---------- */
.l-container {
  width: 100%;
  max-width: 1040px;
  margin: 0 auto;
  padding: 0 20px;
}

@media (max-width: 600px) {
  .l-container {
    padding: 0 16px;
  }
}

.l-section {
  padding: 96px 0;
}

@media (max-width: 600px) {
  .l-section {
    padding: 56px 0;
  }
}

/* 別ページからのアンカー遷移・URL直打ち時に固定ヘッダーに隠れないようにする */
section[id] {
  scroll-margin-top: 112px;
}

@media (max-width: 900px) {
  section[id] {
    scroll-margin-top: 72px;
  }
}

@media (max-width: 600px) {
  section[id] {
    scroll-margin-top: 56px;
  }
}

/* 淡黄背景: カンプ実データ（金の微グラデ50%・raster-bg素材）を白地に敷く。
   画像は各セクション実寸で書き出されているため 100% 100% で忠実対応。
   非対応環境フォールバックは --color-cream */
.l-cream {
  background-color: var(--color-cream);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

/* SPは縦長になるため 100% 100% だとテクスチャが潰れる → coverで等比のまま切り抜き */
@media (max-width: 768px) {
  .l-cream {
    background-size: cover;
    background-position: center;
  }
}

.about.l-cream {
  background-image: url(../img/nursing/bg-about.webp);
  background-color: #fff;
}

.research.l-cream {
  background-image: url(../img/nursing/bg-research.webp);
  background-color: #fff;
}

.news.l-cream {
  background-image: url(../img/nursing/bg-news.webp);
  background-color: #fff;
}

@media (max-width: 600px) {
  .news.l-cream {
    padding-bottom: 0;
  }
}

.news-detail.l-cream {
  background-image: url(../img/nursing/bg-news-detail.webp);
  background-color: #fff;
}

/* ---------- セクション見出し (再利用) ---------- */
.p-head {
  text-align: center;
  margin-bottom: 40px;
}

.p-head--left {
  text-align: left;
}

.p-head__en {
  display: block;
  font-family: var(--font-gothic);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.7em;
  padding-left: 0.7em;
  color: var(--color-accent);
  margin-bottom: 12px;
}

.p-head--left .p-head__en {
  padding-left: 0;
}

.p-head__tag {
  display: inline-block;
  background: var(--color-accent);
  color: var(--color-white);
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 0.1em;
  padding: 5px 26px;
  border-radius: 999px;
}

.p-head__ttl {
  margin-top: 18px;
  font-weight: 500;
  font-size: clamp(19px, 1.83vw, 22px);
  letter-spacing: 0.1em;
  color: var(--color-heading);
}

.p-head__ttl--accent {
  color: var(--color-accent);
}

@media (max-width: 600px) {
  .p-head {
    margin-bottom: 32px;
  }
}

/* ---------- 共通パーツ ---------- */
/* オレンジ中見出し (学部/大学院/研究テーマ/CTA/aboutカード共通) */
.p-ttl {
  font-weight: 500;
  font-size: clamp(19px, 1.83vw, 22px);
  letter-spacing: 0.1em;
  color: var(--color-accent);
}

/* SPのみ有効になる改行 */
.u-br-sp {
  display: none;
}

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

/* 400px以下のみ有効になる改行 */
.u-br-sp400 {
  display: none;
}

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

/* 本文テキスト (PC 12px / SP 13px・行間2) */
.p-text {
  font-weight: 400;
  font-size: 12px;
  line-height: 2;
}

@media (max-width: 768px) {
  .p-text {
    font-size: 13px;
  }
}

/* セクションリード文 (中央寄せ806px) */
.p-lead {
  max-width: 806px;
  margin: 0 auto;
}

/* 白地×オレンジ文字のピル型ラベル (年次カード/大学院カード共通) */
.p-label {
  display: block;
  width: max-content;
  max-width: 100%;
  background: var(--color-white);
  color: var(--color-accent);
  font-weight: 500;
  font-size: 14px;
  border-radius: 999px;
  text-align: center;
}

/* ホバーで内包画像をズーム (メンバー/お知らせカード共通) */
.p-zoom {
  overflow: hidden;
}

.p-zoom img {
  transition: transform 0.6s ease;
}

.p-zoom-trigger:hover .p-zoom img {
  transform: scale(1.06);
}

/* 閉じる / 一覧を見る 等の丸みボタン */
.p-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 143px;
  padding: 8px 22px;
  border: 1px solid var(--color-accent);
  border-radius: 999px;
  background: var(--color-white);
  color: var(--color-accent);
  font-weight: 500;
  font-size: 15px;
  letter-spacing: 0.06em;
  transition: 0.3s;
  cursor: pointer;
}

.p-btn:hover {
  background: var(--color-accent);
  color: var(--color-white);
}

.p-btn:hover .p-btn__arrow {
  border-color: var(--color-white);
}

/* 右向き矢印 (CSSで生成) */
.p-btn__arrow {
  width: 7px;
  height: 7px;
  border-top: 1.5px solid var(--color-accent);
  border-right: 1.5px solid var(--color-accent);
  transform: rotate(45deg);
  transition: 0.3s;
}

/* SVG矢印アイコン (btn-arrow.svg と同形状): マスク+currentColorで文字色と同期して変色。
   file://直開きでも表示されるようデータURIで埋め込み */
.p-btn__icon {
  width: 8px;
  height: 14px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7.268 12.855'%3E%3Cpath d='M832.469,1049.769H829.62l4.419,6.428-4.419,6.427h2.849l4.419-6.427Z' transform='translate(-829.62 -1049.769)'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7.268 12.855'%3E%3Cpath d='M832.469,1049.769H829.62l4.419,6.428-4.419,6.427h2.849l4.419-6.427Z' transform='translate(-829.62 -1049.769)'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* アコーディオン開閉ボタン共通: SVG矢印を回転でトグル（閉時→右向き / 開時→下向き） */
.p-btn--toggle .p-btn__icon {
  transition: transform 0.3s;
}

.l-section:not(.is-collapsed) .p-btn--toggle .p-btn__icon {
  transform: rotate(90deg);
}

/* ラベル幅を固定(最長「経歴を見る」5文字+字間0.06em)し、文言が変わっても矢印位置を揃える */
.p-btn--toggle>span:first-child {
  min-width: 5.3em;
  text-align: center;
}

.p-btn-wrap {
  text-align: center;
  margin-top: 44px;
}

/* アコーディオン折りたたみ時に本文を隠す */
.is-collapsed .msg__history,
.is-collapsed .panel__body,
.is-collapsed .panel__text,
.is-collapsed .curriculum__grid,
.is-collapsed .grad__grid {
  display: none;
}

/* =========================================================
   ヘッダー
   ========================================================= */
.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  height: 104px;
  transition: background-color 0.3s;
}

.header.is-scrolled {
  background: var(--color-white);
}

.header.is-scrolled .header__logo-txt b {
  color: var(--color-heading);
}

.header.is-scrolled .header__nav-item a {
  color: var(--color-heading);
}

.header__inner {
  width: 100%;
  height: 104px;
  padding-left: 24px;
  display: flex;
  align-items: center;
  gap: 20px;
}

@media (max-width: 1400px) {
  .header__inner {
    padding-left: 16px;
    gap: 12px;
  }
}

/* トップページはロゴをh1にするため見出しスタイルを打ち消す */
.header__site-ttl {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  flex-shrink: 0;
}

.header__logo {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}

.header__logo-mark {
  width: 70px;
  height: auto;
}

@media (max-width: 1400px) {
  .header__logo-mark {
    width: 56px;
  }
}

.header__logo-txt {
  line-height: 1.5;
}

.header__logo-txt b {
  display: block;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.05em;
  color: var(--color-white);
}

@media (max-width: 1400px) {
  .header__logo-txt b {
    font-size: 13px;
  }
}

@media (max-width: 1200px) {
  .header__logo-txt b {
    font-size: 12px;
  }
}

.header__nav {
  margin-left: auto;
}

.header__nav-list {
  display: flex;
  align-items: center;
}

.header__nav-item {
  position: relative;
  padding: 0 24px;
}

@media (max-width: 1400px) {
  .header__nav-item {
    padding: 0 12px;
  }
}

@media (max-width: 1200px) {
  .header__nav-item {
    padding: 0 8px;
  }
}

.header__nav-item+.header__nav-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 25px;
  background: var(--color-accent);
}

.header__nav-item a {
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.05em;
  color: var(--color-white);
  white-space: nowrap;
  transition: 0.3s;
}

@media (max-width: 1400px) {
  .header__nav-item a {
    font-size: 12px;
  }
}

.header__nav-item a:hover {
  opacity: 0.7;
}

.header__actions {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

/* 縦積みタブ（テキスト上・封筒下）。langが右に10px重なるため、
   その分を幅と右paddingで確保して見た目の中央を保つ */
.header__contact {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 149px;
  height: 104px;
  padding-right: 10px;
  border-radius: 0 0 0 12px;
  background: #dad4c0;
  color: var(--color-heading);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.1em;
  transition: opacity 0.3s;
}

.header__contact:hover {
  opacity: 0.7;
}

@media (max-width: 1400px) {
  .header__contact {
    width: 120px;
    font-size: 13px;
  }
}

@media (max-width: 1200px) {
  .header__contact {
    width: 104px;
  }
}

.header__contact-icon {
  width: 30px;
  height: auto;
  display: block;
}

.header__lang {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  width: 139px;
  height: 104px;
  margin-left: -10px;
  border-radius: 0 0 0 10px;
  background: var(--color-heading);
  color: var(--color-white);
}

@media (max-width: 1400px) {
  .header__lang {
    width: 100px;
    gap: 14px;
  }
}

@media (max-width: 1200px) {
  .header__lang {
    width: 88px;
    gap: 10px;
  }
}

.header__lang b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 33px;
  height: 33px;
  border-radius: 50%;
  background: var(--color-accent);
  font-weight: 700;
  font-size: 13px;
}

@media (max-width: 1400px) {
  .header__lang b {
    width: 28px;
    height: 28px;
  }
}

.header__lang span {
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.05em;
}

/* ハンバーガー */
.header__hamburger {
  display: none;
  flex-direction: column;
  justify-content: space-between;
  width: 30px;
  height: 22px;
  background: transparent;
  border: none;
  cursor: pointer;
}

.header__hamburger span {
  display: block;
  width: 100%;
  height: 2px;
  background: var(--color-accent);
  transition: 0.3s;
}

.header__hamburger.is-active span:nth-child(1) {
  transform: translateY(10px) rotate(45deg);
}

.header__hamburger.is-active span:nth-child(2) {
  opacity: 0;
}

.header__hamburger.is-active span:nth-child(3) {
  transform: translateY(-10px) rotate(-45deg);
}

.sp-nav {
  display: none;
  position: fixed;
  top: 64px;
  left: 0;
  width: 100%;
  height: calc(100vh - 64px);
  background: rgba(255, 255, 255, 0.97);
  transform: translateX(100%);
  transition: transform 0.3s;
  z-index: 999;
  overflow-y: auto;
}

.sp-nav.is-open {
  transform: translateX(0);
}

.sp-nav__list {
  padding: 24px;
}

.sp-nav__item {
  border-bottom: 1px solid rgba(82, 90, 98, 0.15);
}

.sp-nav__item a {
  display: block;
  padding: 18px 4px;
  color: var(--color-heading);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.05em;
}

@media (max-width: 900px) {
  .header {
    height: 64px;
    background: var(--color-white);
  }

  .header__inner {
    height: 64px;
    padding: 0 20px;
  }

  .header__logo-mark {
    width: 40px;
  }

  .header__logo-txt b {
    font-size: 12px;
    color: var(--color-heading);
  }

  .header__nav {
    display: none;
  }

  .header__contact {
    display: none;
  }

  .header__lang {
    display: none;
  }

  .header__actions {
    margin-left: auto;
  }

  .header__hamburger {
    display: flex;
  }

  .sp-nav {
    display: block;
  }
}

/* 下層ページ用: 明るい背景の上に載る白ヘッダー */
.header--light {
  background: var(--color-white);
}

.header--light.is-scrolled {
  background: var(--color-white);
}

.header--light .header__logo-txt b {
  color: var(--color-heading);
}

.header--light .header__nav-item a {
  color: var(--color-heading);
}

.header--light .header__nav-item+.header__nav-item::before {
  background: var(--color-accent);
}

/* =========================================================
   ヒーロー
   ========================================================= */
/* 固定ヘッダー(104px)が重なる分を高さに含める */
.hero {
  position: relative;
  height: 724px;
  overflow: hidden;
}

/* 1200px以下はクロップせず動画全体(16:9)を表示
   (動画埋め込みのキャッチコピーが見切れないように) */
@media (max-width: 1200px) {
  .hero {
    height: auto;
    aspect-ratio: 16 / 9;
  }
}

/* SPは白背景の固定ヘッダー(64px)と重ならないよう下げる */
@media (max-width: 900px) {
  .hero {
    margin-top: 64px;
  }
}

.hero__movie {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* =========================================================
   MESSAGE (教授メッセージ + 経歴)
   ========================================================= */
/* 黄色グローのあしらい: カンプ素材 bg-msg-glow.webp をカンプ計測どおり9箇所に配置
   (大: 写真左, 右上 / 小: 左上・写真右・中央下・右・左端下・右上角) */
.msg {
  position: relative;
  background-color: var(--color-white);
  background-image:
    url(../img/nursing/bg-msg-glow.webp),
    url(../img/nursing/bg-msg-glow.webp),
    url(../img/nursing/bg-msg-glow.webp),
    url(../img/nursing/bg-msg-glow.webp),
    url(../img/nursing/bg-msg-glow.webp),
    url(../img/nursing/bg-msg-glow.webp),
    url(../img/nursing/bg-msg-glow.webp),
    url(../img/nursing/bg-msg-glow.webp),
    url(../img/nursing/bg-msg-glow.webp);
  background-repeat: no-repeat;
  background-position:
    left 103px top 255px,
    right 27px top 89px,
    left 240px top 481px,
    left 578px top 252px,
    left 71px top 141px,
    right 127px top 200px,
    left 724px top 549px,
    left -10px top 545px,
    right -27px top -17px;
  background-size:
    182px 182px,
    130px 130px,
    100px 100px,
    58px 58px,
    56px 56px,
    56px 56px,
    46px 46px,
    42px 42px,
    60px 60px;
}


.msg__top {
  display: flex;
  gap: 52px;
  align-items: flex-start;
}

.msg__photo {
  flex: 0 0 283px;
  max-width: 283px;
}

.msg__photo img {
  width: 100%;
  aspect-ratio: 283 / 401;
  object-fit: cover;
  border-radius: 20px;
}

.msg__photo figcaption {
  text-align: center;
  margin-top: 14px;
  font-weight: 400;
  line-height: 1.7;
}

.msg__role {
  font-size: 12px;
}

.msg__name {
  font-size: 15px;
  margin: 0 4px;
}

.msg__name-en {
  font-size: 12px;
  letter-spacing: 0.05em;
}

.msg__body {
  flex: 1 1 auto;
}

/* 見出し英字・タグは p-head__en / p-head__tag を再利用し、配置のみ調整 */
.msg__en {
  text-align: center;
}

.msg__tag {
  display: block;
  width: max-content;
  margin: 0 auto 26px;
}

.msg__lead {
  text-align: center;
  font-weight: 500;
  font-size: clamp(18px, 1.83vw, 22px);
  letter-spacing: 0.1em;
  color: var(--color-heading);
  margin-bottom: 24px;
}

/* 幅はリード(18文字×字間0.1em=19.8em)に揃える。書体は p-text */
.msg__text {
  max-width: calc(19.8 * clamp(18px, 1.83vw, 22px));
  margin: 0 auto;
}

.msg__close {
  margin-top: 28px;
  text-align: center;
}

/* 経歴テーブル */
.msg__history {
  margin-top: 44px;
}

.career {
  margin-bottom: 34px;
}

.career__head {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 14px;
}

.career__label {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 82px;
  padding: 3px 18px;
  border: 1px solid var(--color-accent);
  border-radius: 999px;
  color: var(--color-text);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.1em;
}

.career__line {
  flex: 1 1 auto;
  height: 1px;
  background: linear-gradient(90deg, var(--color-accent), rgba(255, 133, 42, 0.25));
}

.career__row {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 6px 24px;
  font-weight: 400;
  font-size: 12px;
  line-height: 2;
}

@media (max-width: 768px) {
  .msg__top {
    flex-direction: column;
    align-items: center;
    gap: 28px;
  }

  .msg__photo {
    flex-basis: 240px;
  }
}

@media (max-width: 600px) {
  .career__row {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .career__row dd {
    margin-bottom: 8px;
  }
}

/* 経歴 黄タグ版（メンバー詳細モーダル用 / member-popupデータ由来） */
.career--yellow {
  margin-bottom: 24px;
}

.career--yellow:last-child {
  margin-bottom: 0;
}

.career--yellow .career__head {
  gap: 0;
  margin-bottom: 16px;
}

.career--yellow .career__label {
  min-width: 83px;
  padding: 3px 6px;
  border: none;
  background: var(--color-tag);
}

.career--yellow .career__line {
  background: var(--color-tag);
}

.career--yellow .career__row {
  grid-template-columns: 64px 1fr;
  gap: 0 8px;
}

@media (max-width: 600px) {
  .career--yellow .career__row {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

/* =========================================================
   ABOUT (在宅看護学領域)
   ========================================================= */
.about {
  overflow: hidden;
}

/* 縦棒をセクション下端でクリップ */
.about__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: start;
}

.about__left {
  position: relative;
}

/* テキスト下からセクション最下端まで伸びる縦棒（カラム中央） */
.about__left::before {
  content: "";
  position: absolute;
  top: calc(100% + 46px);
  left: 50%;
  width: 1px;
  height: 600px;
  background: var(--color-accent);
}

.about__text {
  margin-top: 8px;
}

/* 書体は p-text */
.about__cards {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.about-card {
  position: relative;
  background: var(--color-white);
  border-radius: 22px;
  box-shadow: 0 8px 24px rgba(120, 100, 40, 0.12);
  padding: 30px 32px;
  min-height: 200px;
  overflow: hidden;
}

.about-card__ttl {
  margin-bottom: 14px;
}

/* 書体は p-ttl */
.about-card__text {
  max-width: 62%;
}

/* 書体は p-text */
/* 角丸・白フェードは画像(@2x webp)に焼き込み済み */
.about-card__img {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 190px;
  object-fit: cover;
}

/* カード内テキストの左端(padding 32px)に揃える */
.about__btn {
  margin-top: 24px;
  text-align: left;
  padding-left: 32px;
}

@media (max-width: 768px) {
  .about__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .about__left::before {
    display: none;
  }

  .about-card__text {
    max-width: 100%;
  }

  .about-card__img {
    position: static;
    width: 100%;
    height: 160px;
    border-radius: 16px;
    margin-top: 16px;
  }

  /* 人物の顔が中央トリミングで切れるため、画像を下にずらして上側を見せる */
  .about-card__img--research {
    object-position: center 25%;
  }

  .about__btn {
    text-align: center;
    padding-left: 0;
  }
}

/* =========================================================
   写真コラージュ (COMMUNITY / RESEARCH 共通)
   ========================================================= */
.collage {
  position: relative;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 40px;
  padding: 10px 0;
  overflow: hidden;
}

/* 無限ループスライダー: 3枚+複製3枚をtransformで流し、
   -50%地点(複製セット先頭)で巻き戻すことで継ぎ目なく周回する */
.collage__track {
  display: flex;
  width: max-content;
  animation: collage-scroll 40s linear infinite;
  will-change: transform;
}

@media (max-width: 900px) {
  .collage__track {
    animation-duration: 30s;
  }
}

@media (prefers-reduced-motion: reduce) {
  .collage__track {
    animation: none;
  }
}

@keyframes collage-scroll {
  to {
    transform: translateX(-50%);
  }
}

/* クラスタ合成画像 (1197x860 @2x → 表示598x430) */
.collage__item {
  position: relative;
  flex: 0 0 auto;
  width: 598px;
  /* gapだと-50%地点が画像間隔の途中に落ちて周回時にズレるため、
     アイテム自身のmarginで間隔を持たせセット幅を等分にする */
  margin-right: 20px;
}

@media (max-width: 900px) {

  /* 1枚+間隔+半分=画面幅になる幅で、常に1.5枚が見える */
  .collage__item {
    width: min(598px, calc((100vw - 16px) / 1.5));
    margin-right: 16px;
  }
}

.collage__item img {
  width: 100%;
  aspect-ratio: 1198 / 860;
  /* 読み込み前に高さを確保しレイアウトシフトを防ぐ */
  object-fit: cover;
  display: block;
}

.collage__label {
  position: absolute;
  top: 16px;
  left: 0;
  z-index: 3;
  background: var(--color-heading);
  color: var(--color-white);
  font-weight: 500;
  font-size: 16px;
  letter-spacing: 0.05em;
  padding: 3px 24px;
  border-radius: 6px;
}

@media (max-width: 600px) {
  .collage__label {
    font-size: 14px;
    padding: 3px 16px;
  }
}

/* リード文は p-text + p-lead を使用 */

/* =========================================================
   MEMBER (教室員・ゼミ生)
   ========================================================= */
.member__grid {
  display: grid;
  grid-template-columns: repeat(3, auto);
  gap: 40px 36px;
  justify-content: center;
}

.member-card {
  text-align: center;
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
}

/* テキストの行数差で行の高さが伸びてもbuttonの中央寄せで画像が下がらないよう、
   カードを行の上端に揃える */
@media (max-width: 768px) {
  .member-card {
    align-self: start;
  }
}

/* ズームは p-zoom / p-zoom-trigger */
.member-card__img-wrap {
  width: 200px;
  height: 236px;
  margin: 0 auto 16px;
  border-radius: 20px;
}

/* SP2カラム時は固定200pxだとはみ出すため列幅に追従させる */
@media (max-width: 480px) {
  .member-card__img-wrap {
    width: 100%;
    height: auto;
    aspect-ratio: 200 / 236;
  }
}

.member-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.member-card__role {
  font-weight: 400;
  font-size: 12px;
}

.member-card__name {
  font-weight: 400;
  font-size: 15px;
  margin: 2px 0;
}

.member-card__name small {
  font-size: 12px;
}

.member-card__en {
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.05em;
}

@media (max-width: 768px) {
  .member__grid {
    grid-template-columns: repeat(2, auto);
    gap: 32px 20px;
  }
}

@media (max-width: 480px) {
  .member__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px 16px;
  }
}

/* モーダル表示中は背面のヘッダーを隠す
   (半透明の背景越しにハンバーガー等が閉じるボタンへ透けて重なるのを防ぐ) */
.is-modal-open .header {
  visibility: hidden;
}

/* メンバー詳細モーダル */
.modal {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(60, 60, 66, 0.45);
}

.modal.is-open {
  display: flex;
}

.modal__panel {
  position: relative;
  width: 100%;
  max-width: 742px;
}

.modal__scroll {
  background: var(--color-white);
  border-radius: 16px;
  max-height: 86vh;
  overflow-y: auto;
  padding: 22px 38px 40px 24px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
}

@media (max-width: 600px) {
  .modal__scroll {
    padding: 24px 16px 32px;
  }
}

.modal__close {
  position: absolute;
  top: 0;
  left: calc(100% + 14px);
  width: 83px;
  height: 83px;
  padding: 0;
  background: var(--color-white);
  border: 2px solid var(--color-accent);
  border-radius: 14px;
  cursor: pointer;
  transition: 0.3s;
}

.modal__close:hover {
  opacity: 0.7;
}

/* ×印 */
.modal__close::before,
.modal__close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 46px;
  height: 4px;
  background: var(--color-accent);
  transform: translate(-50%, -50%) rotate(45deg);
}

.modal__close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

@media (max-width: 960px) {
  .modal__close {
    left: auto;
    top: -16px;
    right: -8px;
    width: 48px;
    height: 48px;
    border-radius: 10px;
  }

  .modal__close::before,
  .modal__close::after {
    width: 26px;
    height: 3px;
  }
}

.modal__body {
  display: flex;
  align-items: flex-start;
  gap: 36px;
}

@media (max-width: 600px) {
  .modal__body {
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }
}

.modal__photo {
  flex: 0 0 233px;
  width: 233px;
  height: 276px;
  object-fit: cover;
  border-radius: 16px;
}

@media (max-width: 600px) {
  .modal__photo {
    flex: 0 0 auto;
  }
}

/* 写真の見せ位置（カンプのマスク位置に合わせた object-position） */
.modal__photo--morita {
  object-position: 50% 45%;
}

.modal__photo--kanaji {
  object-position: 50% 30%;
}

.modal__photo--osaka {
  object-position: 50% 48%;
}

.modal__photo--seminar {
  object-position: 56% 50%;
}

.modal__info {
  flex: 1 1 auto;
  min-width: 0;
  padding-top: 20px;
}

@media (max-width: 600px) {
  .modal__info {
    padding-top: 0;
    width: 100%;
  }
}

.modal__role {
  font-weight: 400;
  font-size: 12px;
  line-height: 2;
}

.modal__name {
  font-weight: 400;
  font-size: 15px;
  line-height: 1.9;
}

.modal__name small {
  font-size: 12px;
}

.modal__en {
  font-weight: 400;
  font-size: 12px;
  line-height: 2;
  letter-spacing: 0.05em;
  margin-bottom: 20px;
}

.modal__names {
  font-weight: 400;
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 20px;
}

.modal__text {
  font-weight: 400;
  font-size: 12px;
  line-height: 2;
  margin-bottom: 20px;
}

/* =========================================================
   テキストリスト系 (THEME / 学部ゼミ生)
   コンテナ・見出しは panel / panel__head / p-ttl を再利用。
   本文は panel__body(アコーディオン開閉フック) + p-text
   ========================================================= */

/* THEME〜大学院はひと続きのブロックとして詰めて表示する。
   THEME直後に学部ゼミ生（間32px）、CURRICULUM直後に大学院（間32px） */
.theme.l-section {
  padding-top: 0;
  padding-bottom: 32px;
}

.seminar.l-section {
  padding: 0;
}

.curriculum.l-section {
  padding-bottom: 32px;
}

/* THEME上の区切り線: コンテナ幅のオレンジ罫。上余白(96px)は線の下側に持つ */
.theme .l-container {
  border-top: 1px solid var(--color-accent);
  padding-top: 96px;
}

/* 研究テーマ一覧（課程ごとのグループ + 1研究=1リスト項目） */
.thesis+.thesis {
  margin-top: 28px;
}

.thesis__ttl {
  font-weight: 500;
  font-size: 13px;
  margin-bottom: 14px;
}

.thesis__ttl::before {
  content: "◆ ";
}

.thesis__item+.thesis__item {
  margin-top: 16px;
}

.thesis__author {
  font-weight: 500;
}

.thesis__note {
  margin-left: 1em;
  font-weight: 400;
}

/* =========================================================
   CURRICULUM (学部) / 大学院 カード
   ========================================================= */
.panel {
  max-width: 806px;
  margin: 0 auto;
}

.panel__head {
  text-align: center;
  margin-bottom: 26px;
}

.panel__ttl {
  margin-bottom: 20px;
}

/* 書体は p-ttl */
.panel__text {
  font-weight: 400;
  font-size: 14px;
  line-height: 2;
  text-align: justify;
}

.panel__text p+p {
  margin-top: 28px;
}

/* 縦線はブロック全体でなく強調段落(panel__em)のみに付ける */
.panel__em {
  position: relative;
  padding-left: 16px;
}

.panel__em::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 3px;
  background: var(--color-accent);
}

.curriculum__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  max-width: 640px;
  margin: 44px auto 0;
}

.yr-card {
  background: var(--color-yellow);
  border-radius: 18px;
  padding: 24px 28px 28px;
}

.yr-card__label {
  margin: 0 auto 18px;
  padding: 3px 34px;
  letter-spacing: 0.1em;
}

/* 見た目は p-label */
/* 箇条書きは最長項目を基準にカード中央へ寄せる */
.yr-card__list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: max-content;
  max-width: 100%;
  margin: 0 auto;
}

/* 3年生「看護研究クリティカルシンキング」: ドットなし・中央寄せ */
.yr-card__note {
  text-align: center;
  font-weight: 400;
  font-size: 13px;
  line-height: 1.5;
  margin-bottom: 12px;
}

.yr-card__list li {
  position: relative;
  padding-left: 22px;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.5;
}

.yr-card__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(0.5em - 2px);
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--color-accent);
}

@media (max-width: 600px) {
  .curriculum__grid {
    grid-template-columns: 1fr;
  }

  .panel__text {
    font-size: 13px;
  }

  .yr-card__list li {
    font-size: 14px;
  }
}

/* 大学院: CURRICULUMブロックに続けて表示（上余白なし）。次のお知らせセクションとの余白は110px */
.grad.l-section {
  padding-top: 0;
  padding-bottom: 110px;
}

@media (max-width: 600px) {
  .grad.l-section {
    padding-bottom: 32px;
  }
}

/* 大学院 2カード */
.grad__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  max-width: 770px;
  margin: 44px auto 0;
}

@media (max-width: 600px) {
  .grad__grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.grad-card {
  padding: 22px 26px 26px;
}

.grad-card__label {
  margin: 0 0 16px;
  padding: 3px 0;
  letter-spacing: 0.06em;
}

/* 見た目は p-label */
.grad-card__text {
  font-weight: 400;
  font-size: 15px;
  line-height: 1.9;
}

@media (max-width: 600px) {
  .grad-card__text {
    font-size: 14px;
  }
}

/* =========================================================
   NEWS
   ========================================================= */
.news__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 48px 40px;
  max-width: 960px;
  margin: 0 auto;
}

.news-card {
  text-align: center;
}

.news-card__link {
  display: block;
  color: inherit;
}

/* ズームは p-zoom / p-zoom-trigger */
.news-card__img-wrap {
  width: 100%;
  border-radius: 18px;
  margin-bottom: 16px;
}

.news-card__img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
}

.news-card__cap {
  font-weight: 400;
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 12px;
}

.news-card__tag {
  display: inline-block;
  color: var(--color-white);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.1em;
  padding: 3px 22px;
  border-radius: 999px;
  /* 最長カテゴリ「在宅研究会」(5文字)に合わせて全タグの横幅を統一 */
  min-width: 112px;
  text-align: center;
}

.news-card__tag--blue {
  background: var(--news-blue);
}

.news-card__tag--pink {
  background: var(--news-pink);
}

.news-card__tag--green {
  background: var(--news-green);
}

.news-card__tag--purple {
  background: var(--news-purple);
}

.news-card__tag--magenta {
  background: var(--news-magenta);
}

.news-card__tag--lblue {
  background: var(--news-lblue);
}

.news-card__tag--salmon {
  background: var(--news-salmon);
}

.news-card__tag--teal {
  background: var(--news-teal);
}

.news-card__tag--gray {
  background: var(--news-gray);
}

@media (max-width: 768px) {
  .news__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 36px 24px;
  }
}

@media (max-width: 480px) {
  .news__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 32px 16px;
  }
}

/* =========================================================
   NEWS 詳細 (news.html)
   ========================================================= */
.news-detail {
  margin-top: 104px;
  /* 固定ヘッダー分 */
  padding: 80px 0 96px;
}

@media (max-width: 900px) {
  .news-detail {
    margin-top: 64px;
  }
}

@media (max-width: 768px) {
  .news-detail {
    padding: 64px 0 72px;
  }
}

@media (max-width: 600px) {
  .news-detail {
    padding: 48px 0 56px;
  }
}

/* 見出しバッジ (オレンジ楕円) */
.news-detail__badge {
  width: 280px;
  max-width: 100%;
  margin: 0 auto;
  padding: 10px 0 8px;
  background: var(--color-accent);
  border-radius: 999px;
  text-align: center;
  color: var(--color-white);
}

.news-detail__badge-dept {
  display: block;
  width: 213px;
  margin: 0 auto;
  padding-bottom: 5px;
  border-bottom: 1px solid var(--color-white);
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 0.1em;
  line-height: 1.3;
}

.news-detail__badge-en {
  display: block;
  margin-top: 4px;
  font-weight: 500;
  font-size: clamp(19px, 1.83vw, 22px);
  letter-spacing: 0.1em;
  line-height: 1.2;
}

/* 記事タイトル */
.news-detail__ttl {
  margin-top: 40px;
  text-align: center;
  font-weight: 400;
  font-size: clamp(19px, 1.83vw, 22px);
  color: var(--color-text);
}

@media (max-width: 600px) {
  .news-detail__ttl {
    margin-top: 32px;
  }
}

/* カテゴリタグ (色・角丸は news-card__tag を再利用しサイズのみ上書き) */
.news-detail__tag-wrap {
  text-align: center;
  margin-top: 28px;
}

.news-detail__tag {
  font-size: 15px;
  padding: 3px 34px;
  line-height: 1.3;
}

/* フォトギャラリー */
.news-detail__gallery {
  max-width: 806px;
  margin: 38px auto 0;
}

@media (max-width: 600px) {
  .news-detail__gallery {
    margin-top: 32px;
  }
}

.news-detail__row {
  display: grid;
  gap: 27px;
}

@media (max-width: 600px) {
  .news-detail__row {
    gap: 16px;
  }
}

.news-detail__row+.news-detail__row {
  margin-top: 32px;
}

@media (max-width: 600px) {
  .news-detail__row+.news-detail__row {
    margin-top: 16px;
  }
}

.news-detail__row--three {
  grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 600px) {
  .news-detail__row--three {
    grid-template-columns: 1fr;
  }
}

.news-detail__row--two {
  grid-template-columns: 1fr 1fr;
  gap: 37px;
}

@media (max-width: 600px) {
  .news-detail__row--two {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

/* 写真枠: カンプのマスク座標を % 化して同じトリミングを再現 */
.news-detail__crop {
  position: relative;
  overflow: hidden;
  aspect-ratio: 385 / 266;
  border-radius: 8px;
}

.news-detail__row--three .news-detail__crop {
  aspect-ratio: 251 / 266;
}

@media (max-width: 600px) {
  .news-detail__row--three .news-detail__crop {
    aspect-ratio: 385 / 266;
  }
}

.news-detail__crop img {
  position: absolute;
  max-width: none;
  display: block;
}

.news-detail__crop--tea1 img {
  width: 123.4%;
  top: -8%;
  left: -4.11%;
}

.news-detail__crop--tea2 img {
  width: 117.92%;
  top: 0;
  left: -3.55%;
}

.news-detail__crop--tea3 img {
  width: 131.18%;
  top: -20.31%;
  left: -15.57%;
}

.news-detail__crop--zoom img {
  width: 116.21%;
  top: -3.04%;
  left: -14.42%;
}

.news-detail__crop--care img {
  width: 123.98%;
  top: -89.49%;
  left: -9.7%;
}

.news-detail__crop--market img {
  width: 110.14%;
  top: -82.21%;
  left: -5.66%;
}

/* 白カード + 動画キャプチャ帯 */
.news-detail__crop--video {
  background: var(--color-white);
}

.news-detail__crop--video img {
  width: 118.6%;
  top: 29.2%;
  left: -2.9%;
}

/* ホームに戻る */
.news-detail__btn {
  margin-top: 88px;
}

@media (max-width: 600px) {
  .news-detail__btn {
    margin-top: 48px;
  }
}

/* =========================================================
   CTA (大学受験をお考えの方へ)
   ========================================================= */
/* PCの下余白は親セクション(.news .l-section)の96pxに任せ、二重にしない */
.cta {
  padding: 96px 0 0;
}

@media (max-width: 600px) {
  .cta {
    padding-bottom: 96px;
  }
}

.cta__head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  margin-bottom: 28px;
}

.cta__head::before,
.cta__head::after {
  content: "";
  width: min(180px, 22vw);
  height: 1px;
  background: rgba(255, 133, 42, 0.6);
}

/* 見出しは途中で折り返さない(SPは u-br-sp の意図した改行位置のみ) */
.cta__head .p-ttl {
  white-space: nowrap;
  flex-shrink: 0;
}

@media (max-width: 600px) {
  .cta__head .p-ttl {
    text-align: center;
  }
}

.cta__text {
  text-align: center;
  font-weight: 400;
  font-size: 15px;
  line-height: 2;
  margin-bottom: 30px;
}

@media (max-width: 600px) {
  .cta__text {
    text-align: left;
  }
}

.cta__btn {
  text-align: center;
}

.cta__btn .p-btn {
  min-width: 320px;
}

@media (max-width: 600px) {
  .cta__text {
    font-size: 14px;
  }

  .cta__btn .p-btn {
    min-width: 0;
    width: 100%;
    font-size: 14px;
  }
}

@media (max-width: 400px) {
  .cta__btn .p-btn {
    font-size: 13px;
  }
}

/* =========================================================
   フッター
   ========================================================= */
.footer {
  background: linear-gradient(90deg, #ff852a 26%, #ffc84a 100%);
  color: var(--color-white);
  padding: 48px 0 44px;
}

.footer__inner {
  width: 88vw;
  margin: 0 auto;
}

.footer__ttl {
  font-weight: 700;
  font-size: clamp(16px, 1.5vw, 18px);
  letter-spacing: 0.05em;
  margin-bottom: 24px;
}

.footer__ttl a {
  color: inherit;
  transition: 0.3s;
}

.footer__ttl a:hover {
  opacity: 0.75;
}

.footer__links {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 32px;
}

.footer__links a {
  width: fit-content;
  font-weight: 400;
  font-size: 13px;
  line-height: 1.9;
  transition: 0.3s;
}

.footer__links a::before {
  content: "・";
}

.footer__links a:hover {
  opacity: 0.75;
}

.footer__copy {
  font-weight: 400;
  font-size: 15px;
  letter-spacing: 0.1em;
}

/* ============================================
   NEWS DETAIL 個別ページ（news32〜news51）
   ============================================ */

/* ---- news32.html ---- */
/* =========================================================
   NEWS 詳細 32「特別研究の様子」(news32.html)
   ページ固有: ギャラリー各写真のクロップのみ
   (行構成・枠のアスペクト比・ラウンドは style.css の
    .news-detail__row--two / .news-detail__crop を再利用)

   算出根拠 (design-spec geometry / baseWidth 1200):
     枠1 (197.0, 409.6, 385.5x266.4) / 画像 (187.6, 406.9, 403.8x306.7)
     枠2 (619.7, 409.6, 383.3x266.4) / 画像 (576.1, 364.7, 454.9x338.3)
     枠3 (199.2, 710.4, 383.3x266.4) / 画像 (191.8, 547.7, 393.8x521.6)
     枠4 (618.6, 710.4, 385.5x266.4) / 画像 (616.9, 700.2, 495.9x371.4)
   width% = 画像W/枠W, top% = (画像y-枠y)/枠H, left% = (画像x-枠x)/枠W
   ========================================================= */

.news-detail__crop--n32-1 img {
  width: 104.75%;
  top: -1.01%;
  left: -2.44%;
}

.news-detail__crop--n32-2 img {
  width: 118.68%;
  top: -16.85%;
  left: -11.37%;
}

.news-detail__crop--n32-3 img {
  width: 102.74%;
  top: -61.07%;
  left: -1.93%;
}

.news-detail__crop--n32-4 img {
  width: 128.64%;
  top: -3.83%;
  left: -0.44%;
}

/* ---- news33.html ---- */
/* =========================================================
   NEWS 詳細 33 (news33.html) 固有スタイル
   在宅看護学概論・在宅対象論の様子
   行構成: 2列 / 2列 / 3列（design-spec のマスク枠 y クラスタ）
   クロップ%はマスク枠に対する画像座標から算出
   (width% = 画像W/枠W, top% = (画像y-枠y)/枠H, left% = (画像x-枠x)/枠W)
   ========================================================= */

/* 1行目 左: 会食・交流 (枠385.5x266.4 / 画像404.9x304.9) */
.news-detail__crop--n33-1 img {
  width: 105.03%;
  top: -2.97%;
  left: -3.09%;
}

/* 1行目 右: 講義の様子 (枠383.3x266.4 / 画像463.5x309) */
.news-detail__crop--n33-2 img {
  width: 120.92%;
  top: 0;
  left: -14.95%;
}

/* 2行目 左: 教室での講義 (枠385.5x266.4 / 画像461.1x346.5) */
.news-detail__crop--n33-3 img {
  width: 119.61%;
  top: -11%;
  left: -9.81%;
}

/* 2行目 右: 訪問診療の講義 (枠383.3x266.4 / 画像481.8x323.2) */
.news-detail__crop--n33-4 img {
  width: 125.7%;
  top: -19.93%;
  left: -19.54%;
}

/* 3行目 左: 大教室 (枠250.5x266.4 / 画像435.1x327) */
.news-detail__crop--n33-5 img {
  width: 173.69%;
  top: -2.85%;
  left: -38.64%;
}

/* 3行目 中: スライド講義 (枠250.5x266.4 / 画像367.7x274.5) */
.news-detail__crop--n33-6 img {
  width: 146.79%;
  top: -1.05%;
  left: -42.75%;
}

/* 3行目 右: 講師 (枠250.5x266.4 / 画像355.8x268.4) */
.news-detail__crop--n33-7 img {
  width: 142.04%;
  top: 0;
  left: -7.86%;
}

/* ---- news34.html ---- */
/* =========================================================
   NEWS 詳細 34「在宅援助論の様子」ページ固有
   ギャラリー: 2枚1行 (news-detail__row--two)
   クロップ%はカンプのマスク座標から算出 (枠に対する%)
   ========================================================= */

/* 左: 移乗実習 (元画像 388.9x516.8 / 枠 385.5x266.4) */
.news-detail__crop--n34-1 img {
  width: 100.88%;
  top: -36.37%;
  left: -0.42%;
}

/* 右: 実習室全景 (元画像 505x378.1 / 枠 383.3x266.4) */
.news-detail__crop--n34-2 img {
  width: 131.75%;
  top: -15.77%;
  left: -9.68%;
}

/* ---- news35.html ---- */
/* =========================================================
   NEWS 詳細 news35「さぬきの暮らしと健康実習（2025）」固有
   ギャラリー: 2枚横並び1行（.news-detail__row--two 再利用）
   クロップ%はカンプの枠/画像座標から算出
   ========================================================= */

/* 左: 枠 385.5x266.4 / 画像 393.2x296.1 */
.news-detail__crop--n35-1 img {
  width: 102%;
  top: -4.32%;
  left: -0.99%;
}

/* 右: 枠 383.3x266.4 / 画像 597.8x400.6 */
.news-detail__crop--n35-2 {
  aspect-ratio: 383 / 266;
}

.news-detail__crop--n35-2 img {
  width: 155.96%;
  top: -23.54%;
  left: -18.13%;
}

/* ---- news36.html ---- */
/* =========================================================
   NEWS 詳細 news36「防災訓練を実施しました」固有
   ギャラリー: 3枚×2行 + 2枚×1行（.news-detail__row--three / --two 再利用）
   クロップ%はカンプの枠/画像座標から算出
   ========================================================= */

/* --- 1行目 (3枚 / 枠 250.5x266.4) --- */

/* 枠(197,409.6) / 画像(197,409.6,308.7x336.1) */
.news-detail__crop--n36-1 img {
  width: 123.23%;
  top: 0;
  left: 0;
}

/* 枠(474.8,409.6) / 画像(362.8,408,501.7x267.4) */
.news-detail__crop--n36-2 img {
  width: 200.28%;
  top: -0.6%;
  left: -44.71%;
}

/* 枠(752.5,409.6) / 画像(752.5,404.7,250.5x271.3) */
.news-detail__crop--n36-3 img {
  width: 100%;
  top: -1.84%;
  left: 0;
}

/* --- 2行目 (3枚 / 枠 250.5x266.4) --- */

/* 枠(199.2,710.4) / 画像(163.8,664,283.7x376.4) */
.news-detail__crop--n36-4 img {
  width: 113.25%;
  top: -17.42%;
  left: -14.13%;
}

/* 枠(474.8,710.4) / 画像(473.2,710.4,253.6x337.2) */
.news-detail__crop--n36-5 img {
  width: 101.24%;
  top: 0;
  left: -0.64%;
}

/* 枠(752.5,710.4) / 画像(694.5,681.4,393.7x295.4) */
.news-detail__crop--n36-6 img {
  width: 157.17%;
  top: -10.89%;
  left: -23.15%;
}

/* --- 3行目 (2枚 / 枠 385.5x266.4・383.3x266.4) --- */

/* 枠(197,1011.6,385.5x266.4) / 画像(139.4,1011.6,500.8x266.4) */
.news-detail__crop--n36-7 img {
  width: 129.91%;
  top: 0;
  left: -14.94%;
}

/* 枠(619.7,1011.6,383.3x266.4) / 画像(567.2,1012.1,501.1x265.3) */
.news-detail__crop--n36-8 {
  aspect-ratio: 383 / 266;
}

.news-detail__crop--n36-8 img {
  width: 130.73%;
  top: 0.19%;
  left: -13.7%;
}

/* ---- news37.html ---- */
/* =========================================================
   NEWS 詳細 37「個別避難計画、マイタイムラインを作成しました」(news37.html)
   ページ固有: ギャラリー各写真のクロップと白カード枠のみ
   (行構成・枠のアスペクト比・ラウンドは style.css の
    .news-detail__row--three / --two / .news-detail__crop を再利用)

   算出根拠 (design-spec geometry / baseWidth 1200):
     枠1  (197.0, 409.6, 250.5x266.4)  / 画像 (196.0, 390.7, 256.9x341.5)
     枠2  (474.8, 409.6, 250.5x266.4)  / 画像 (474.2, 359.9, 251.5x337.1)
     枠3  (752.5, 409.6, 250.5x266.4)  / 画像 (725.3, 352.4, 286.0x380.7)
     枠4  (199.2, 710.4, 250.5x266.4)  / 画像 (168.0, 676.0, 300.6x403.7)
     枠5  (474.8, 710.4, 250.5x266.4)  / 画像 (473.0, 697.5, 270.2x361.1)
     枠6  (752.5, 710.4, 250.5x266.4)  / 画像 (746.8, 672.8, 256.2x338.9)
     枠7  (197.0, 1011.6, 385.5x266.4) / 画像 (191.9, 876.7, 390.6x518.9)
     枠8  (619.7, 1011.6, 383.3x266.4) / 画像 (612.3, 932.6, 398.2x530.9)
     枠9  (197.0, 1312.7, 385.5x266.4) / 画像 (185.7, 1294.5, 403.0x302.7)
     枠10 (619.7, 1312.7, 383.3x266.4) / 画像 (651.2, 1328.1, 320.3x237.0)
       ※枠10は白背景カード (spec 5449 SOLID #ffffff) に書類画像を余白付きで配置
   width% = 画像W/枠W, top% = (画像y-枠y)/枠H, left% = (画像x-枠x)/枠W
   ========================================================= */

.news-detail__crop--n37-1 img {
  width: 102.55%;
  top: -7.09%;
  left: -0.40%;
}

.news-detail__crop--n37-2 img {
  width: 100.40%;
  top: -18.66%;
  left: -0.24%;
}

.news-detail__crop--n37-3 img {
  width: 114.17%;
  top: -21.47%;
  left: -10.86%;
}

.news-detail__crop--n37-4 img {
  width: 120.00%;
  top: -12.91%;
  left: -12.46%;
}

.news-detail__crop--n37-5 img {
  width: 107.86%;
  top: -4.84%;
  left: -0.72%;
}

.news-detail__crop--n37-6 img {
  width: 102.28%;
  top: -14.11%;
  left: -2.28%;
}

.news-detail__crop--n37-7 img {
  width: 101.32%;
  top: -50.64%;
  left: -1.32%;
}

.news-detail__crop--n37-8 img {
  width: 103.89%;
  top: -29.65%;
  left: -1.93%;
}

.news-detail__crop--n37-9 img {
  width: 104.54%;
  top: -6.83%;
  left: -2.93%;
}

/* 白カード + マイ・タイムライン様式 (画像が枠より小さく余白が見える) */
.news-detail__crop--n37-10 {
  background: var(--color-white);
}

.news-detail__crop--n37-10 img {
  width: 83.56%;
  top: 5.78%;
  left: 8.22%;
}

/* ---- news38.html ---- */
/* =========================================================
   NEWS 詳細 38「話にきーまいふれあいプロジェクト（2025.8-2026.3）」ページ固有
   ギャラリー: 3枚×5行 (news-detail__row--three / 枠 250.5x266.4)
   クロップ%はカンプのマスク座標から算出 (枠に対する%)
   ========================================================= */

/* 1行目 */
.news-detail__crop--n38-1 img {
  width: 186.27%;
  top: -6.61%;
  left: -31.94%;
}

.news-detail__crop--n38-2 img {
  width: 171.78%;
  top: -6.94%;
  left: -23.59%;
}

.news-detail__crop--n38-3 img {
  width: 168.58%;
  top: -7.62%;
  left: -35.69%;
}

/* 2行目 */
.news-detail__crop--n38-4 img {
  width: 167.07%;
  top: -18.43%;
  left: -35.97%;
}

.news-detail__crop--n38-5 img {
  width: 164.79%;
  top: -3.42%;
  left: 0;
}

.news-detail__crop--n38-6 img {
  width: 160.48%;
  top: -0.41%;
  left: -45.55%;
}

/* 3行目 */
.news-detail__crop--n38-7 img {
  width: 162.08%;
  top: -2.14%;
  left: -36.57%;
}

.news-detail__crop--n38-8 img {
  width: 159.68%;
  top: -3.83%;
  left: -59.72%;
}

.news-detail__crop--n38-9 img {
  width: 159.08%;
  top: 0;
  left: -27.74%;
}

/* 4行目 */
.news-detail__crop--n38-10 img {
  width: 219.64%;
  top: -9.95%;
  left: -69.98%;
}

.news-detail__crop--n38-11 img {
  width: 179.56%;
  top: -3.79%;
  left: -27.43%;
}

.news-detail__crop--n38-12 img {
  width: 188.78%;
  top: -19.63%;
  left: -29.86%;
}

/* 5行目 */
.news-detail__crop--n38-13 img {
  width: 213.49%;
  top: -19.63%;
  left: -59.68%;
}

.news-detail__crop--n38-14 img {
  width: 175.85%;
  top: -8.63%;
  left: -44.19%;
}

.news-detail__crop--n38-15 img {
  width: 144.11%;
  top: -2.03%;
  left: -32.34%;
}

/* ---- news39.html ---- */
/* =========================================================
   NEWS 詳細 39「放送大学特別講義（2025-2026）」(news39.html)
   ページ固有: 写真1枚の中央寄せ行と、そのクロップのみ
   (枠のラウンド・余白は style.css の
    .news-detail__gallery / .news-detail__row / .news-detail__crop を再利用)

   算出根拠 (design-spec geometry / baseWidth 1200):
     マスク枠 (377.2, 409.6, 445.5x313.5) ※中心 x=600 ちょうどのセンター配置
     画像     (345.3, 406.0, 482.4x323.1)
   width% = 画像W/枠W, top% = (画像y-枠y)/枠H, left% = (画像x-枠x)/枠W
   ========================================================= */

/* 写真1枚の行: 枠実寸 445.5px を上限に中央寄せ */
.news-detail__row--n39-one {
  grid-template-columns: 1fr;
  max-width: 446px;
  margin: 0 auto;
}

/* 枠のアスペクト比はマスク実寸 (445.5x313.5) */
.news-detail__crop--n39-1 {
  aspect-ratio: 445.5 / 313.5;
}

.news-detail__crop--n39-1 img {
  width: 108.28%;
  top: -1.15%;
  left: -7.16%;
}

/* ---- news40.html ---- */
/* =========================================================
   NEWS 詳細 40 (news40.html) 固有スタイル
   タンポポプロジェクト（地域防災啓発事業2026.0701）
   ギャラリー: 写真1枚のみ・中央寄せ（design-spec のマスク枠 445.5x313.5）
   クロップ%はマスク枠に対する画像座標から算出
   (width% = 画像W/枠W, top% = (画像y-枠y)/枠H, left% = (画像x-枠x)/枠W)
   ========================================================= */

/* 1枚のみの行: 枠実寸446pxで中央配置 */
.news-detail__row--n40-single {
  grid-template-columns: min(446px, 100%);
  justify-content: center;
}

/* 写真: 枠445.5x313.5 / 画像565.7x320 @ (375.3, 403.1) */
.news-detail__crop--n40-1 {
  aspect-ratio: 891 / 627;
}

.news-detail__crop--n40-1 img {
  width: 126.98%;
  top: -2.07%;
  left: -0.43%;
}

/* ---- news41.html ---- */
/* =========================================================
   NEWS 詳細 41「地域支援活動（2026.0518）」ページ固有
   ギャラリー: 2枚1行 (news-detail__row--two)
   クロップ%はカンプのマスク座標から算出 (枠に対する%)
   ========================================================= */

/* 左: 集会所での交流 (元画像 627.9x474.6 / 枠 385.5x266.4) */
.news-detail__crop--n41-1 img {
  width: 162.88%;
  top: -70.68%;
  left: -57.95%;
}

/* 右: 学生と地域の方々 (元画像 446.8x336.2 / 枠 383.3x266.4) */
.news-detail__crop--n41-2 img {
  width: 116.57%;
  top: -13.10%;
  left: -4.54%;
}

/* ---- news42.html ---- */
/* =========================================================
   NEWS 詳細 42「浴衣でTea Ceremony健康相談カフェ（2025）」ページ固有
   ギャラリー: 3枚×2行 (news-detail__row--three) + 2枚1行 (news-detail__row--two)
   クロップ%はカンプのマスク座標から算出 (枠に対する%)
   ========================================================= */

/* 1段目左: ポスターを持つ記念撮影 (元画像 364.1x274.5 / 枠 250.5x266.4) */
.news-detail__crop--n42-1 img {
  width: 145.35%;
  top: -1.54%;
  left: -20.72%;
}

/* 1段目中: 体組成測定 (元画像 379.9x286.4 / 枠 250.5x266.4) */
.news-detail__crop--n42-2 img {
  width: 151.66%;
  top: -2.44%;
  left: -20.40%;
}

/* 1段目右: テーブルでの交流 (元画像 384.7x287.7 / 枠 250.5x266.4) */
.news-detail__crop--n42-3 img {
  width: 153.57%;
  top: -5.97%;
  left: -26.79%;
}

/* 2段目左: お茶を囲む歓談 (元画像 359.1x273 / 枠 250.5x266.4) */
.news-detail__crop--n42-4 img {
  width: 143.35%;
  top: -1.69%;
  left: -19.60%;
}

/* 2段目中: 案内ポスター (元画像 308.9x408.2 / 枠 250.5x266.4) */
.news-detail__crop--n42-5 img {
  width: 123.31%;
  top: -17.76%;
  left: -7.82%;
}

/* 2段目右: 健康相談の様子 (元画像 371.3x277.7 / 枠 250.5x266.4) */
.news-detail__crop--n42-6 img {
  width: 148.22%;
  top: -4.24%;
  left: -41.64%;
}

/* 3段目左: カフェの全景 (元画像 533.9x402.9 / 枠 385.5x266.4) */
.news-detail__crop--n42-7 img {
  width: 138.50%;
  top: -30.22%;
  left: -19.25%;
}

/* 3段目右: 茶道具 (元画像 427x319.8 / 枠 383.3x266.4) */
.news-detail__crop--n42-8 img {
  width: 111.40%;
  top: -6.08%;
  left: -0.55%;
}

/* ---- news43.html ---- */
/* =========================================================
   NEWS 詳細 43「香川労災病院看護部研究指導（2026.2）」(news43.html)
   ページ固有: 写真1枚の中央寄せ行と、そのクロップのみ
   (枠のラウンド・余白は style.css の
    .news-detail__gallery / .news-detail__row / .news-detail__crop を再利用)

   算出根拠 (design-spec geometry / baseWidth 1200):
     マスク枠 (377.2, 409.6, 445.5x313.5) ※中心 x=600 ちょうどのセンター配置
     画像     (376.5, 389.7, 455.5x343.9)
   width% = 画像W/枠W, top% = (画像y-枠y)/枠H, left% = (画像x-枠x)/枠W
   ========================================================= */

/* 写真1枚の行: 枠実寸 445.5px を上限に中央寄せ */
.news-detail__row--n43-one {
  grid-template-columns: 1fr;
  max-width: 446px;
  margin: 0 auto;
}

/* 枠のアスペクト比はマスク実寸 (445.5x313.5) */
.news-detail__crop--n43-1 {
  aspect-ratio: 445.5 / 313.5;
}

.news-detail__crop--n43-1 img {
  width: 102.24%;
  top: -6.35%;
  left: -0.16%;
}

/* ---- news44.html ---- */
/* =========================================================
   NEWS 詳細 44「ニュージーランドでの活動」(news44.html)
   ページ固有: ギャラリー各写真のクロップのみ
   (行構成・枠のアスペクト比・ラウンドは style.css の
    .news-detail__row--three / --two / .news-detail__crop を再利用)

   算出根拠 (design-spec geometry / baseWidth 1200):
     行1 (3枠 250.5x266.4):
       枠1 (197.0, 409.6)  / 画像 (137.6, 405.9,  362.7x272.6)
       枠2 (474.8, 409.6)  / 画像 (375.4, 346.9,  465.5x348.5)
       枠3 (752.5, 409.6)  / 画像 (717.6, 332.6,  364.9x486.9)
     行2 (3枠 250.5x266.4):
       枠4 (199.2, 710.4)  / 画像 (191.3, 690.2,  261.8x393.8)
       枠5 (474.8, 710.4)  / 画像 (387.7, 695.4,  389.6x293.0)
       枠6 (752.5, 710.4)  / 画像 (741.3, 664.0,  267.3x357.3)
     行3 (2枠 385.5/383.3 x266.4):
       枠7 (197.0, 1011.6) / 画像 (169.6, 976.4,  433.8x327.7)
       枠8 (619.7, 1011.6) / 画像 (583.3, 999.9,  456.1x293.3)
     行4 (2枠 385.5/383.3 x266.4):
       枠9 (197.0, 1312.7) / 画像 (193.4, 1277.0, 424.3x320.9)
       枠10 (619.7, 1312.7)/ 画像 (611.0, 1293.3, 419.7x313.9)
   width% = 画像W/枠W, top% = (画像y-枠y)/枠H, left% = (画像x-枠x)/枠W
   ========================================================= */

.news-detail__crop--n44-1 img {
  width: 144.79%;
  top: -1.39%;
  left: -23.71%;
}

.news-detail__crop--n44-2 img {
  width: 185.83%;
  top: -23.54%;
  left: -39.68%;
}

.news-detail__crop--n44-3 img {
  width: 145.67%;
  top: -28.9%;
  left: -13.93%;
}

.news-detail__crop--n44-4 img {
  width: 104.51%;
  top: -7.58%;
  left: -3.15%;
}

.news-detail__crop--n44-5 img {
  width: 155.53%;
  top: -5.63%;
  left: -34.77%;
}

.news-detail__crop--n44-6 img {
  width: 106.71%;
  top: -17.42%;
  left: -4.47%;
}

.news-detail__crop--n44-7 img {
  width: 112.53%;
  top: -13.21%;
  left: -7.11%;
}

.news-detail__crop--n44-8 img {
  width: 118.99%;
  top: -4.39%;
  left: -9.5%;
}

.news-detail__crop--n44-9 img {
  width: 110.06%;
  top: -13.4%;
  left: -0.93%;
}

.news-detail__crop--n44-10 img {
  width: 109.5%;
  top: -7.28%;
  left: -2.27%;
}

/* ---- news45.html ---- */
/* =========================================================
   news45.html 固有スタイル
   「英国・オーストラリア・台湾・シンガポール・タイ・韓国での活動」
   ギャラリー各写真のクロップ (design-spec の枠/画像座標を%化)
   行構成・枠比率は style.css の news-detail__row--three / --two を再利用
   ========================================================= */

/* --- 1行目 (3カラム) --- */
.news-detail__crop--n45-1 img {
  width: 102.63%;
  top: -11.64%;
  left: -1.32%;
}

.news-detail__crop--n45-2 img {
  width: 148.14%;
  top: -2.25%;
  left: -26.47%;
}

.news-detail__crop--n45-3 img {
  width: 153.69%;
  top: -1.95%;
  left: -17.96%;
}

/* --- 2行目 (3カラム) --- */
.news-detail__crop--n45-4 img {
  width: 107.39%;
  top: -1.54%;
  left: -0.32%;
}

.news-detail__crop--n45-5 img {
  width: 117.33%;
  top: -16.78%;
  left: -10.94%;
}

.news-detail__crop--n45-6 img {
  width: 155.89%;
  top: -6.23%;
  left: -31.58%;
}

/* --- 3行目 (2カラム) --- */
.news-detail__crop--n45-7 img {
  width: 118.68%;
  top: -16.70%;
  left: -5.71%;
}

.news-detail__crop--n45-8 img {
  width: 105.22%;
  top: -6.23%;
  left: -3.03%;
}

/* --- 4行目 (2カラム) --- */
.news-detail__crop--n45-9 img {
  width: 122.23%;
  top: -23.31%;
  left: -9.81%;
}

.news-detail__crop--n45-10 img {
  width: 114.11%;
  top: -13.06%;
  left: -8.61%;
}

/* ---- news46.html ---- */
/* =========================================================
   NEWS 詳細 news46「学会発表に参加しました」固有スタイル
   ギャラリー骨格・タグ色は style.css の
   .news-detail__* / .news-card__tag--magenta を再利用。
   ここは各写真のクロップ（カンプのマスク座標を%化）のみ。
   width% = 画像W/枠W×100 / top% = (画像y−枠y)/枠H×100 / left% 同様
   ========================================================= */

/* 1行目（3列 / 枠 250.5×266.4） */
.news-detail__crop--n46-1 img {
  width: 132.89%;
  top: -28.9%;
  left: -32.06%;
}

.news-detail__crop--n46-2 img {
  width: 109.3%;
  top: -11.6%;
  left: -1.96%;
}

.news-detail__crop--n46-3 img {
  width: 130.42%;
  top: -29.92%;
  left: -10.54%;
}

/* 2行目（3列） */
.news-detail__crop--n46-4 img {
  width: 128.66%;
  top: -28.12%;
  left: -10.94%;
}

.news-detail__crop--n46-5 img {
  width: 113.61%;
  top: -12.91%;
  left: -3.59%;
}

.news-detail__crop--n46-6 img {
  width: 102.16%;
  top: -7.13%;
  left: -1.16%;
}

/* 3行目（3列） */
.news-detail__crop--n46-7 img {
  width: 144.67%;
  top: -1.35%;
  left: -23.79%;
}

.news-detail__crop--n46-8 img {
  width: 123.63%;
  top: -20.01%;
  left: -11.86%;
}

.news-detail__crop--n46-9 img {
  width: 132.65%;
  top: -17.87%;
  left: -13.45%;
}

/* 4行目（2列 / 枠 385.5×266.4・383.3×266.4） */
.news-detail__crop--n46-10 img {
  width: 110.74%;
  top: -10.59%;
  left: -1.97%;
}

.news-detail__crop--n46-11 {
  aspect-ratio: 383 / 266;
}

.news-detail__crop--n46-11 img {
  width: 116.41%;
  top: -11.45%;
  left: -9.99%;
}

/* ---- news47.html ---- */
/* =========================================================
   NEWS 詳細 47「在宅研究会を開催しました」(news47.html)
   ページ固有: ギャラリー各写真のクロップのみ
   (行構成・枠のアスペクト比・ラウンドは style.css の
    .news-detail__row--three / --two / .news-detail__crop を再利用)

   算出根拠 (design-spec geometry / baseWidth 1200):
     枠1 (197.0, 409.6, 250.5x266.4)  / 画像 (72.6, 389.5, 425.1x286.5)
     枠2 (474.8, 409.6, 250.5x266.4)  / 画像 (367.1, 373.0, 472.0x315.0)
     枠3 (752.5, 409.6, 250.5x266.4)  / 画像 (645.9, 381.3, 447.7x300.4)
     枠4 (200.0, 710.4, 385.5x266.4)  / 画像 (99.6, 644.3, 500.4x377.1)
     枠5 (622.7, 710.4, 383.3x266.4)  / 画像 (600.1, 707.6, 412.1x275.8)
     枠6 (200.0, 1017.8, 385.5x266.4) / 画像 (186.1, 890.5, 399.4x536.1)
     枠7 (622.7, 1017.8, 383.3x266.4) / 画像 (637.8, 1051.6, 353.2x198.6)
   width% = 画像W/枠W, top% = (画像y-枠y)/枠H, left% = (画像x-枠x)/枠W
   ========================================================= */

.news-detail__crop--n47-1 img {
  width: 169.70%;
  top: -7.55%;
  left: -49.66%;
}

.news-detail__crop--n47-2 img {
  width: 188.42%;
  top: -13.74%;
  left: -42.99%;
}

.news-detail__crop--n47-3 img {
  width: 178.72%;
  top: -10.62%;
  left: -42.55%;
}

.news-detail__crop--n47-4 img {
  width: 129.81%;
  top: -24.81%;
  left: -26.04%;
}

.news-detail__crop--n47-5 img {
  width: 107.51%;
  top: -1.05%;
  left: -5.90%;
}

.news-detail__crop--n47-6 img {
  width: 103.61%;
  top: -47.79%;
  left: -3.61%;
}

/* 白カード + 案内チラシ (枠より小さい画像を白地の上に配置) */
.news-detail__crop--n47-7 {
  background: var(--color-white);
}

.news-detail__crop--n47-7 img {
  width: 92.15%;
  top: 12.69%;
  left: 3.94%;
}

/* ---- news48.html ---- */
/* =========================================================
   NEWS 詳細 48「ゼミの様子」(news48.html)
   ページ固有: ギャラリー各写真のクロップのみ
   (行構成・枠のアスペクト比・ラウンドは style.css の
    .news-detail__row--three / .news-detail__crop を再利用。
    全21枠とも 250.5x266.4 = aspect-ratio 251/266)

   算出根拠 (design-spec geometry / baseWidth 1200):
     width% = 画像W/枠W, top% = (画像y-枠y)/枠H, left% = (画像x-枠x)/枠W
     枠x: 197.0(1,7) / 199.2(4,10,13,16,19) / 474.8 / 752.5
     枠y: 409.6 / 710.4 / 1011.9 / 1312.7 / 1616.7 / 1918.8 / 2219.0
   ========================================================= */

.news-detail__crop--n48-1 img {
  width: 146.07%;
  top: -37.5%;
  left: -13.57%;
}

.news-detail__crop--n48-2 img {
  width: 155.61%;
  top: -6.94%;
  left: -35.77%;
}

.news-detail__crop--n48-3 img {
  width: 139.96%;
  top: -29.24%;
  left: -21.36%;
}

.news-detail__crop--n48-4 img {
  width: 181.44%;
  top: -12.91%;
  left: -37.84%;
}

.news-detail__crop--n48-5 img {
  width: 149.18%;
  top: -2.55%;
  left: -16.93%;
}

.news-detail__crop--n48-6 img {
  width: 160.76%;
  top: -0.23%;
  left: -36.13%;
}

.news-detail__crop--n48-7 img {
  width: 153.57%;
  top: -9.46%;
  left: -42.67%;
}

.news-detail__crop--n48-8 img {
  width: 205.79%;
  top: -42.87%;
  left: -55.17%;
}

.news-detail__crop--n48-9 img {
  width: 142%;
  top: -0.11%;
  left: -23.31%;
}

.news-detail__crop--n48-10 img {
  width: 136.25%;
  top: -0.34%;
  left: -22.99%;
}

.news-detail__crop--n48-11 img {
  width: 142.83%;
  top: 0;
  left: -24.23%;
}

.news-detail__crop--n48-12 img {
  width: 168.98%;
  top: -1.61%;
  left: -42.71%;
}

.news-detail__crop--n48-13 img {
  width: 160.76%;
  top: -28.6%;
  left: -20.48%;
}

.news-detail__crop--n48-14 img {
  width: 115.13%;
  top: -7.96%;
  left: -13.85%;
}

.news-detail__crop--n48-15 img {
  width: 164.39%;
  top: -8.93%;
  left: -32.5%;
}

.news-detail__crop--n48-16 img {
  width: 142.71%;
  top: -0.64%;
  left: -21.4%;
}

.news-detail__crop--n48-17 img {
  width: 138.2%;
  top: -33.71%;
  left: -19.12%;
}

.news-detail__crop--n48-18 img {
  width: 131.9%;
  top: -2.63%;
  left: -24.87%;
}

.news-detail__crop--n48-19 img {
  width: 142.87%;
  top: 0;
  left: -14.09%;
}

.news-detail__crop--n48-20 img {
  width: 155.41%;
  top: -1.88%;
  left: -38.6%;
}

.news-detail__crop--n48-21 img {
  width: 114.93%;
  top: -0.98%;
  left: -7.47%;
}

/* ---- news49.html ---- */
/* =========================================================
   NEWS 詳細 49「「第8回キャタピラーSTEM賞 学生部門」を受賞しました」(news49.html)
   ページ固有: ギャラリー各写真のクロップのみ
   (行構成・枠のアスペクト比・ラウンドは style.css の
    .news-detail__row--three / --two / .news-detail__crop を再利用)

   算出根拠 (design-spec geometry / baseWidth 1200):
     行1 (3枠 250.5x266.4):
       枠1 (197.0, 409.6)  / 画像 (184.9, 365.8,  279.1x372.6)
       枠2 (474.8, 409.6)  / 画像 (359.8, 406.2,  421.2x280.0)
       枠3 (752.5, 409.6)  / 画像 (629.6, 373.0,  448.3x337.4)
     行2 (3枠 250.5x266.4):
       枠4 (197.0, 712.1)  / 画像 (132.1, 712.1,  450.0x266.4)
       枠5 (474.8, 712.1)  / 画像 (378.7, 690.6,  415.7x312.9)
       枠6 (752.5, 712.1)  / 画像 (682.7, 695.8,  395.6x296.7)
     行3 (2枠 385.5/383.3 x266.4):
       枠7 (197.0, 1011.6) / 画像 (119.1, 1008.7, 519.4x272.4)
       枠8 (619.7, 1011.6) / 画像 (563.0, 945.4,  488.7x332.5)
   width% = 画像W/枠W, top% = (画像y-枠y)/枠H, left% = (画像x-枠x)/枠W
   ========================================================= */

.news-detail__crop--n49-1 img {
  width: 111.42%;
  top: -16.44%;
  left: -4.83%;
}

.news-detail__crop--n49-2 img {
  width: 168.14%;
  top: -1.28%;
  left: -45.91%;
}

.news-detail__crop--n49-3 img {
  width: 178.96%;
  top: -13.74%;
  left: -49.06%;
}

.news-detail__crop--n49-4 img {
  width: 179.64%;
  top: 0;
  left: -25.91%;
}

.news-detail__crop--n49-5 img {
  width: 165.95%;
  top: -8.07%;
  left: -38.36%;
}

.news-detail__crop--n49-6 img {
  width: 157.92%;
  top: -6.12%;
  left: -27.86%;
}

.news-detail__crop--n49-7 img {
  width: 134.73%;
  top: -1.09%;
  left: -20.21%;
}

.news-detail__crop--n49-8 img {
  width: 127.5%;
  top: -24.85%;
  left: -14.79%;
}

/* ---- news50.html ---- */
/* =========================================================
   NEWS 詳細 news50.html
   「健康相談うみまちカフェ」を開催しました（その他）
   ギャラリー: 3カラム×4行（枠 250.5×266.4 / 共通 --three を再利用）
   クロップ%はカンプのマスク座標から算出（枠に対する%）
   ========================================================= */

.news-detail__crop--n50-1 img {
  width: 167.43%;
  top: -2.03%;
  left: -53.61%;
}

.news-detail__crop--n50-2 img {
  width: 142.36%;
  top: -0.60%;
  left: -21.20%;
}

.news-detail__crop--n50-3 img {
  width: 143.39%;
  top: -29.92%;
  left: -34.69%;
}

.news-detail__crop--n50-4 img {
  width: 150.50%;
  top: -4.09%;
  left: -30.78%;
}

.news-detail__crop--n50-5 img {
  width: 153.37%;
  top: -6.46%;
  left: -33.73%;
}

.news-detail__crop--n50-6 img {
  width: 142.48%;
  top: -0.19%;
  left: -29.30%;
}

.news-detail__crop--n50-7 img {
  width: 144.55%;
  top: -1.43%;
  left: -23.75%;
}

.news-detail__crop--n50-8 img {
  width: 143.71%;
  top: -0.56%;
  left: -15.65%;
}

/* 白カード + チラシ（縦長画像を中央配置。SPで枠比が変わっても崩れない高さ基準） */
.news-detail__crop--n50-9 {
  background: var(--color-white);
}

.news-detail__crop--n50-9 img {
  width: auto;
  height: 90.32%;
  top: 4.84%;
  left: 50%;
  transform: translateX(-50%);
}

.news-detail__crop--n50-10 img {
  width: 157.92%;
  top: -8.67%;
  left: -34.33%;
}

.news-detail__crop--n50-11 img {
  width: 142.00%;
  top: -0.64%;
  left: -21.00%;
}

.news-detail__crop--n50-12 img {
  width: 103.27%;
  top: -2.59%;
  left: -1.64%;
}

/* ---- news51.html ---- */
/* =========================================================
   NEWS 詳細 news51「相談会を開催しました」個別スタイル
   ギャラリー: 3列 × 3行（全枠 251/266 = 既存 --three をそのまま利用）
   クロップ値はカンプのマスク座標を枠に対する % で算出
   ========================================================= */

.news-detail__crop--n51-1 img {
  width: 143.27%;
  top: -0.53%;
  left: -32.38%;
}

.news-detail__crop--n51-2 img {
  width: 162.95%;
  top: -1.28%;
  left: -33.77%;
}

.news-detail__crop--n51-3 img {
  width: 179.16%;
  top: -16.22%;
  left: -50.66%;
}

.news-detail__crop--n51-4 img {
  width: 142.40%;
  top: -0.41%;
  left: -12.73%;
}

.news-detail__crop--n51-5 img {
  width: 172.53%;
  top: -11.41%;
  left: -38.52%;
}

.news-detail__crop--n51-6 img {
  width: 144.59%;
  top: -1.28%;
  left: -35.41%;
}

.news-detail__crop--n51-7 img {
  width: 164.27%;
  top: -8.15%;
  left: -36.09%;
}

.news-detail__crop--n51-8 img {
  width: 158.08%;
  top: -11.45%;
  left: -39.28%;
}

.news-detail__crop--n51-9 img {
  width: 144.87%;
  top: -1.09%;
  left: -35.57%;
}

/* =========================================================
   NEWS 一覧 (news/index.html)
   ========================================================= */
.news-archive {
  margin-top: 104px;
  /* 固定ヘッダー分 */
  padding: 80px 0 96px;
}

@media (max-width: 900px) {
  .news-archive {
    margin-top: 64px;
  }
}

@media (max-width: 768px) {
  .news-archive {
    padding: 64px 0 72px;
  }
}

@media (max-width: 600px) {
  .news-archive {
    padding: 48px 0 56px;
  }
}

.news-archive.l-cream {
  background-image: url(../img/nursing/bg-news.webp);
  background-color: #fff;
}

/* お知らせ一覧（タイトルのみのテキストリスト） */
.news-archive__list {
  max-width: 720px;
  margin: 48px auto 0;
}

@media (max-width: 600px) {
  .news-archive__list {
    margin-top: 32px;
  }
}

.news-archive__item {
  border-bottom: 1px solid #ddd;
}

.news-archive__link {
  display: block;
  padding: 18px 8px;
  color: inherit;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.6;
}

.news-archive__link:hover {
  color: var(--color-accent);
}

@media (max-width: 600px) {
  .news-archive__link {
    padding: 14px 4px;
    font-size: 14px;
  }
}

.news-archive__btn {
  margin-top: 88px;
}

@media (max-width: 600px) {
  .news-archive__btn {
    margin-top: 48px;
  }
}