@charset "UTF-8";
/* =====================================================================
ポピンズ educare リニューアル
アフタースクール（学童・児童館）ページ専用CSS
（/educare/service/school-children/）
Figma: SP 129:26945
---------------------------------------------------------------------
■ 読み込み
header.php が is_page('service/school-children') のときだけ、
renewal/css/common.css の後に読み込む。

■ 名前空間
ページ固有の接頭辞は `rnw-as-`（as = after school）。
旧CSSでページ名に近いクラスは `.pg_title.third_level.school` と
`.label.after` の2つだけで、どちらも祖先クラス（.school / .after 単体）
としては使われていないことを確認済み。
`rnw` が旧CSS7ファイル（reset/common/contents/index/form/slick/aos）に
1件も無いことも確認済み。

■ 旧CSSとの同居について
このページは旧 header.php の分岐で css/contents.css が読み込まれる。
contents.css の装飾ルールはほぼ `main …` 配下にスコープされているため、
本文で <main> を使わず .rnw-as でラップすることで大半を回避している。
素の要素マージン等だけ下の 0. で打ち消す。

■ 画像・アイコン
本文（固定ページ）側はPHPが動かず rnw_asset_url() を呼べないため、
アイコンは全てこのCSSの mask-image / background-image（相対パス）で描画し、
本文には src 属性を置いていない。
・流用（複製しない）
img/front/mv_wave.png       … MVの波形（トップ 105:6665 と同一）
img/front/mv_illust.svg     … リード下のイラスト帯（トップ 105:6674 と同一）
img/front/texture_paper.jpg … 紙テクスチャ
img/front/icon_slider_next.svg … スライダーの前後ボタン（swiper_next2.svg）
img/icon_arrow_circle.svg      … 14px の丸矢印（メニュー項目）
img/icon_arrow_circle_lg.svg   … 50px の丸矢印（施設検索カード）
img/illust_search.svg          … 施設検索カードの虫めがね
img/consulting/icon_caret.svg  … ボタンのキャレット（weui:arrow-filled）
※consulting用に書き出した同一グラフィック。複製を避けてそのまま参照する。
・新規（img/school-children/）
icon_head_features.svg / icon_head_policy.svg / icon_head_schedule.svg /
icon_head_survey.svg / icon_head_faq.svg … 各セクション見出しのアイコン
wave.svg        … セクション上端の波形（Figma パス933／maskで着色）
chart_dummy.svg … 保護者アンケートの円グラフ（ダミー）

■ フォント
見出しの MOBO はフォントワークスの商用フォントでWeb配信が未確定のため、
--rnw-font-educare-title 経由で Zen Kaku Gothic New にフォールバックする。
（変数の定義と経緯は common.css を参照）

■ FAQ
Q&A本体はカスタム投稿から出力するショートコードに委ねているため、
このCSSにはセクション枠と見出しのスタイルしか無い。
タグ・アコーディオン・「もっと見る」のスタイルは出力側の責務。

■ PC
PCデザイン未確定。PC幅ではSPレイアウトを375pxで中央寄せする暫定対応。
確定後は末尾のレスポンシブブロックを差し替えること。
===================================================================== */
/* =====================================================================
0. ルート・リセット
===================================================================== */
/* Figma の SPフレーム自体が紙テクスチャ地。セクション側で背景指定が無い
ところ（施設検索・5つの特徴・FAQ 等）はこの地色がそのまま出る。
4%の重ねを擬似要素なしで再現するため、地色を96%の単色レイヤーとして
テクスチャの上に敷いている（＝テクスチャを4%で透かしたのと同じ見え方）。 */
.rnw-as {
  /* 固定ヘッダー（.rnw-header）の高さぶんの上余白。
  旧CSS側の上余白は #key_field / main にしか付かず、新マークアップは
  どちらも持たないためここで確保する。 */
  padding-top: var(--rnw-header-h-sp);
  color: var(--rnw-text);
  font-family: var(--rnw-font-jp);
  /* ▼2026-09-22 ページの地色は educare/bg-tex02 #FDF6F4（他ページと同じピンク）。
  デザインの書き出しを実測すると地の面は #FCF6F4 ＝ #FDF6F4 に紙テクスチャ4%。
  ミント #EAF9F6（educare/afterscholl_bg）は「地」ではなく、
  ページ内メニュー・ポピンズアプローチ・一日の流れ・保護者アンケートの
  「ブロックの面」に使う色（旧デザインの educare/bg2 #E7EFFB の置き換え）。
  紙テクスチャは地色を96%の単色レイヤーで重ねる作りなので、
  グラデーション側の rgba も必ず同じ色に合わせること。 */
  background-color: #FDF6F4;
  background-image: linear-gradient(rgba(253, 246, 244, 0.96), rgba(253, 246, 244, 0.96)), url('../../img/front/texture_paper.jpg');
  background-repeat: repeat, repeat;
  background-position: left top, left top;
  background-size: auto, 1228.8px 819.3px;
}

.rnw-as *, .rnw-as *::before, .rnw-as *::after {
  box-sizing: border-box;
}

/* :where() で詳細度0にしておく。ここを .rnw-as img（0-1-1）で書くと
height:auto が .rnw-as-head__ph 等（0-1-0）の固定高さに勝ってしまい、
写真の高さが崩れる。 */
:where(.rnw-as) img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* 見出し・段落のブラウザ既定マージンと旧CSSの余白を打ち消す。
詳細度は :where() で0、:is() の中身（要素）で 0-0-1。
コンポーネント側のクラス（0-1-0）には負けるので、
カードやタグの内側余白を巻き込まない。 */
:where(.rnw-as) :is(h1, h2, h3, h4, p, ul, ol, li, dl, dt, dd, figure) {
  margin: 0;
  padding: 0;
}

:where(.rnw-as) :is(ul, ol) {
  list-style: none;
}

:where(.rnw-as) :is(h1, h2, h3, h4) {
  font-family: var(--rnw-font-jp);
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1.6;
  color: var(--rnw-text);
}

/* ページ内アンカーの着地位置を固定ヘッダーのぶん下げる。 */
.rnw-as-features, .rnw-as-policy, .rnw-as-schedule, .rnw-as-survey, .rnw-as-faq {
  scroll-margin-top: var(--rnw-header-h-sp);
}

/* =====================================================================
1. 共通パーツ
===================================================================== */
/* --- 写真プレースホルダー ---
写真が未支給のため #D9D9D9 のベタ塗りで組んでいる。
（Figma上はグレー #626262 のベタ塗りの箇所もあるが、未支給枠であることが
分かるよう front.css / consulting.css と同じ #D9D9D9 で統一している）
支給後は該当要素を <img class="rnw-as-ph …"> に置き換えれば
width/height/object-fit がそのまま効く。 */
.rnw-as-ph {
  background-color: #D9D9D9;
  object-fit: cover;
}

/* 写真は本文HTMLの <img src="[theme_uri]/renewal/img/school-children/…"> で
読み込む（[theme_uri] は renewal/functions-renewal.php で登録）。
.rnw-as-ph は <img> と、写真未支給の <div>（MV 129:26949 /
5つの特徴の見出し 129:27058）の両方に付く共通の枠。
本文の width / height は書き出し比と一致しているので、下のセクション別の
サイズ指定（width:100% / height:◯◯px）と object-fit:cover でズレない。 */
/* --- 本文テキスト（Figma SP/title/educare/text）--- */
.rnw-as-text {
  font-family: var(--rnw-font-educare-title);
  /* Figma MOBO-SemiBold */
  font-size: 14px;
  font-weight: 600;
  line-height: 1.8;
  letter-spacing: 1.2px;
  color: var(--rnw-text);
}

/* --- セクション見出しブロック（写真帯＋カード）---
Figma 363:28003（5つの特徴）/ 363:28121（教育方針）/ 363:28198（一日の流れ）
保護者アンケート（363:28297）とFAQ（363:28365）は写真が無く、カードの
地色も持たない（--noimage / --plain）。 */
.rnw-as-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.rnw-as-head__ph {
  width: 100%;
  height: 200px;
  /* Figma実測 */
}

.rnw-as-head__card {
  /* margin-top のマイナス値だけでは写真に重ならない。
  CSSの描画順では、ブロックの背景（step 4）より <img> のような置換要素
  （インラインレベルの内容 / step 7）のほうが後に描かれるため、
  位置指定の無いカードは写真の下に潜ってしまう。
  position を付けて positioned な要素（step 8）にし、前面へ出す。 */
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  /* Figma実測 */
  width: calc(100% - 32px);
  /* Figma実測 343 ＝ 375 − 16×2 */
  max-width: 343px;
  margin-top: -40px;
  /* Figma実測 写真の mb-40 */
  padding: 24px;
  border-radius: 20px;
  background-color: #FFFFFF;
  text-align: center;
}

/* 5つの特徴・教育方針のカードは educare/bg2 地（Figma 363:28005 / 363:28123） */
.rnw-as-head__card--bg2 {
  background-color: #EAF9F6;
}

/* ▼2026-09-22 青→ミント */
/* 保護者アンケート・FAQ は地色なし（Figma 363:28298 / 363:28365） */
.rnw-as-head--noimage .rnw-as-head__card, .rnw-as-head__card--plain {
  margin-top: 0;
  padding: 0 24px;
  background-color: transparent;
}

/* 見出しアイコン。多色SVGのため mask ではなく背景画像で描く。
幅はFigma実測どおり個別指定（高さは40pxで共通）。 */
.rnw-as-head__icon {
  flex-shrink: 0;
  height: 40px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.rnw-as-head__icon--features {
  width: 42.222px;
  background-image: url('../../img/school-children/icon_head_features.svg');
}

.rnw-as-head__icon--policy {
  width: 42.222px;
  background-image: url('../../img/school-children/icon_head_policy.svg');
}

.rnw-as-head__icon--schedule {
  width: 40px;
  background-image: url('../../img/school-children/icon_head_schedule.svg');
}

.rnw-as-head__icon--survey {
  width: 51.782px;
  background-image: url('../../img/school-children/icon_head_survey.svg');
}

.rnw-as-head__icon--faq {
  width: 55.729px;
  background-image: url('../../img/school-children/icon_head_faq.svg');
}

.rnw-as-head__text {
  display: flex;
  flex-direction: column;
  gap: 4px;
  /* Figma実測 */
  width: 100%;
}

.rnw-as-head__en {
  font-family: 'Krona One', sans-serif;
  /* Figma実測 */
  font-size: 12px;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: 3.7px;
  /* Figma実測 */
  color: var(--rnw-accent);
  /* educare/accent #EC6E43 */
}

.rnw-as-head__ja {
  font-family: var(--rnw-font-educare-title);
  /* Figma MOBO-Bold */
  font-size: 24px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 1.2px;
  color: var(--rnw-main2);
  /* educare/main2 #507CB8 */
}

/* --- 波形（Figma パス933）---
白のシェイプをmaskで描き、色はセクション側から background-color で渡す。
（セクションごとに下地の色が違うため、着色できる形にしている）
2026-08-27改訂で4セクションすべてに波形が出るようになり、色も
白／紙テクスチャ地／educare-bg2 の3種類になったので修飾子を足した。 */
/* ▼2026-09-22 新デザイン（SP 1792:18522）で山形から円弧に変わった。
書き出したSVGは 375×89.3064 の circle cx=186.221 cy=369.51 r=369.51。
PCの円弧（1440×160 / r=1670.22）とは深さの比率が違う（r/幅 0.985 と 1.160）ので、
引き伸ばしでは同じ形にならない。SP専用に wave_arc_sp.svg を置いている。
帯の高さ（375:89.3064）は旧デザインの山と同じ比率なので変えていない。 */
.rnw-as-wave {
  width: 100%;
  aspect-ratio: 375 / 89.3064;
  /* 書き出しSVGの viewBox */
  background-color: #FFFFFF;
  -webkit-mask-image: url('../../img/front/wave_arc_sp.svg');
  mask-image: url('../../img/front/wave_arc_sp.svg');
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: left top;
  mask-position: left top;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

/* 教育方針（Figma 363:28119）。紙テクスチャ地。
.rnw-as と同じ重ね方だが、要素ごとに左上から敷き直すためタイルの
継ぎ目がずれる。テクスチャは4%でしか出ていないので見た目には出ない。 */
/* ▼2026-09-22 地色が #FAF7F2 → #FDF6F4（educare/bg-tex02）に変わった。
この帯（教育方針の上）だけは紙テクスチャ地のピンクで、ページ地のミントとは別。 */
.rnw-as-wave--paper {
  background-color: #FDF6F4;
  background-image: linear-gradient(rgba(253, 246, 244, 0.96), rgba(253, 246, 244, 0.96)), url('../../img/front/texture_paper.jpg');
  background-repeat: repeat, repeat;
  background-position: left top, left top;
  background-size: auto, 1228.8px 819.3px;
}

/* 一日の流れ（Figma 363:28194）
▼2026-09-22 塗りが educare/bg2（薄青）→ educare/afterscholl_bg #EAF9F6 に変わった。
SPは形も円弧のまま（書き出し 375×89.3064 / fill #EAF9F6）。
PCだけこの帯がパス933（山）なので、PC側で形を戻している。 */
.rnw-as-wave--bg2 {
  background-color: #EAF9F6;
}

/* --- メニュー項目（Figma 363:27961 ほか）---
2026-08-27改訂でセクション内メニュー（旧 129:27069）が無くなり、
ページ内メニュー（363:27959）専用になった。 */
/* 幅（141px）は親の grid-template-columns 側で持っている。
行の高さいっぱいに伸ばすため、li を flex にして子を stretch させる。 */
.rnw-as-menu__list > li {
  display: flex;
}

.rnw-as-menu__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 16px;
  border-radius: 8px;
  background-color: #FFFFFF;
  color: var(--rnw-text);
  text-decoration: none;
}

/* 「保護者／アンケート」だけ2行（Figma 363:27980）。
Figmaは6項目とも高さ57px固定で描かれていて2行だとはみ出しているが、
grid の行を伸ばして収めている（他の行の高さは変わらない）。 */
.rnw-as-menu__label {
  font-family: var(--rnw-font-jp);
  /* Figma common/text/caption */
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 1.2px;
}

/* common.css の .rnw-icon--arrow と同じアセットだが、あちらは右向きにするため
-90度回している。ここは下向きのまま使うので mask だけをローカル指定する。 */
.rnw-as-menu__icon {
  width: 14px;
  /* Figma実測 */
  height: 14px;
  -webkit-mask-image: url('../../img/icon_arrow_circle.svg');
  mask-image: url('../../img/icon_arrow_circle.svg');
}

/* =====================================================================
2. メインビジュアル（Figma SP 363:27892 ／ PC 453:38567）
===================================================================== */
.rnw-as-mv {
  position: relative;
  /* 地色・テクスチャは .rnw-as から継承（#FDF6F4＋紙テクスチャ） */
}

.rnw-as-mv__ph {
  width: 100%;
  height: 400px;
  /* Figma実測 129:26949 */
}

/* 写真の下端に70px重なるテキスト面（Figma 129:26950 の mb-70）。
下余白13.7pxはFigmaのフレーム高さ489pxとの差分。 */
.rnw-as-mv__panel {
  position: relative;
  margin-top: -70px;
  /* 下余白はリード文の margin-top 側に付け替えている（下のコメント参照）。 */
  padding: 52.31px 16px 0;
  /* Figma実測 テキスト面 mt52.31 */
}

/* 波形（Figma 129:26951 Union）。紙テクスチャが焼き込まれた透過PNG。
トップページMV（105:6665）と同一アセットのため複製せず流用している。
Figmaでは 375.192×89.306 の固定サイズだが、画面幅に対して伸縮させている。 */
.rnw-as-mv__panel::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  aspect-ratio: 375.192 / 89.306;
  /* Figma実測 */
  background-image: url('../../img/front/mv_wave.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}

.rnw-as-mv__head {
  position: relative;
  /* 波形より前面に出す */
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  /* Figma実測 129:26954 */
  text-align: center;
}

.rnw-as-mv__en {
  font-family: 'Krona One', sans-serif;
  /* Figma実測 */
  font-size: 12px;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: 3.7px;
  color: var(--rnw-accent);
}

/* Figmaは「学童・児童館」と「アフタースクール」で1つのテキスト要素
（行ごとにスタイル違い）。マークアップでは2要素に分けているため、
間に余白を入れず line-height だけで組む。 */
.rnw-as-mv__sub {
  font-family: var(--rnw-font-educare-title);
  /* Figma MOBO-SemiBold */
  font-size: 14px;
  font-weight: 600;
  line-height: 1.8;
  letter-spacing: 1.2px;
  color: var(--rnw-main2);
}

.rnw-as-mv__h1 {
  font-family: var(--rnw-font-educare-title);
  /* Figma MOBO-Bold */
  font-size: 32px;
  /* SP/title/educare/h1 */
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 1.2px;
  color: var(--rnw-main2);
}

/* リード文（Figma SP 363:27905 ／ PC 453:38587）。
SPのFigmaでは下のイラスト帯のセクションの中にあるが、PCではFV左カラムの
一部なのでマークアップはMV側に置いている。SPの見た目を元どおりにするため、
25.7px ＝ テキスト面の下余白13.7px ＋ 帯セクションの上余白12px。
左右8px ＝ テキスト面の16px と合わせて24px（Figma実測）。 */
.rnw-as-mv__lead {
  position: relative;
  /* 波形より前面に出す */
  z-index: 1;
  margin-top: 25.7px;
  padding: 0 8px;
  font-family: var(--rnw-font-educare-title);
  /* Figma MOBO-SemiBold */
  font-size: 14px;
  font-weight: 600;
  line-height: 1.8;
  letter-spacing: 1.2px;
  color: var(--rnw-text);
}

/* FV下部の斜線はPCだけ（Figma 453:38588）。 */
.rnw-as-mv__deco {
  display: none;
}

/* =====================================================================
3. イラスト帯（Figma 363:27906）
---------------------------------------------------------------------
リード文はMV側（.rnw-as-mv__lead）に移したので、ここは帯だけ。
上余白24pxはFigmaのリード文 → 帯の間隔。
===================================================================== */
.rnw-as-lead {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 24px 24px 0;
  /* Figma実測 */
}

/* イラスト帯（Figma 129:26961 / 129:26962）。
親の左右24pxを打ち消して全幅で出す（Figmaでも帯だけがはみ出している）。
▼2026-09-22 の更新でイラスト帯からピンクの円2つに変わった。
SPフレームから書き出したSVG（375.192×89.3069／circle 186.158,399.816,369.51 と
355.424,309.816,307.318／#FFD9E1・掛け算）は、ナーサリー・トップで使っている
renewal/img/front/mv_circles_sp.svg と図形がすべて一致したのでそのまま流用する。 */
.rnw-as-lead__illust {
  width: calc(100% + 48px);
  margin: 0 -24px;
  aspect-ratio: 375.192 / 89.3069;
  /* 書き出しSVGの viewBox */
  background-image: url('../../img/front/mv_circles_sp.svg');
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 100% 100%;
  mix-blend-mode: multiply;
}

/* =====================================================================
4. 施設検索＋ページ内メニュー（Figma SP 363:27944 ／ PC 453:38613）
===================================================================== */
.rnw-as-nav {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  /* Figma実測 */
  padding: 44px 24px;
  /* Figma実測 */
}

/* 施設検索カード（旧 4-1）はFIX版で削除された。
SP 694:81408 ／ PC 694:31878 のどちらにも無い。 */
/* ------------------------------------
4-2. ページ内メニュー（Figma 129:27014）
------------------------------------ */
.rnw-as-menu {
  width: 100%;
  padding: 24px 16px;
  /* Figma実測 */
  border-radius: 20px;
  background-color: #EAF9F6;
  /* ▼2026-09-22 educare/bg2(青) → educare/afterscholl_bg */
}

/* 2列×3行。Figmaは高さ210px固定・行間20px・列間12px。
行の高さを揃えるため grid で組んでいる（項目側は height:100%）。 */
.rnw-as-menu__list {
  display: grid;
  grid-template-columns: repeat(2, 141px);
  gap: 20px 12px;
  /* Figma実測 */
  justify-content: center;
}

/* =====================================================================
5. 5つの特徴（Figma 363:27997）
---------------------------------------------------------------------
2026-08-27改訂で全面的に組み替わった。
・波形（363:27999）がフレーム内に入って実際に描かれるようになった。
旧版は枠外（x=375.19）で見えず、高さぶんを padding-top で埋めていた。
・波形の背後は .rnw-as の紙地、波形とその下は白地。
・セクション内メニュー（旧 129:27069）が削除された。
・縦積みのパネル群＋「活用事例を見る」→ 横スライダーのカード5枚。
===================================================================== */
.rnw-as-features {
  display: flex;
  flex-direction: column;
}

.rnw-as-features__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 56px;
  /* Figma実測 */
  background-color: #FFFFFF;
}

/* Figma実測：見出しブロック → スライダー枠まで24px＋枠内側の上余白32px。 */
.rnw-as-features .rnw-as-slider {
  margin-top: 56px;
}

/* Figmaではカード5枚とも高さ401pxで揃っている。本文の長さが違うので
track 側で伸ばして揃える（他のスライダーは Figma でも不揃いなので
.rnw-as-slider__track の既定は flex-start のまま）。 */
.rnw-as-features .rnw-as-slider__track {
  align-items: stretch;
}

/* 特徴カード（Figma 363:28033 ほか） */
.rnw-as-fcard {
  display: flex;
  flex: 0 0 300px;
  /* Figma実測 */
  flex-direction: column;
  border-radius: 20px;
  background-color: #FFFFFF;
  box-shadow: 0 4px 28px rgba(0, 0, 0, 0.08);
  /* Figma実測 drop */
  scroll-snap-align: start;
}

.rnw-as-fcard__ph {
  width: 100%;
  height: 200px;
  /* Figma実測 */
  border-radius: 20px 20px 0 0;
}

.rnw-as-fcard__body {
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  gap: 12px;
  /* Figma実測 */
  padding: 16px;
  border-radius: 0 0 20px 20px;
  background-color: #FFFFFF;
}

.rnw-as-fcard__title {
  width: 100%;
  font-family: var(--rnw-font-educare-title);
  /* Figma MOBO-Bold */
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 1.2px;
  color: var(--rnw-text);
  text-align: center;
}

/* 本文だけ両端揃え（Figma 363:28039 は text-justify）。 */
.rnw-as-fcard__text {
  text-align: justify;
}

/* =====================================================================
5-2. ポピンズアプローチ（Figma 363:28071）
---------------------------------------------------------------------
旧版では「5つの特徴」の中のパネル（129:27111）だったものが、
2026-08-27改訂で educare/bg2 地の独立した帯になった。
4項目は横スライダー（「詳細をみる」ボタンは削除された）。
===================================================================== */
/* 内枠を1枚はさんでいるのは、PCでは白地の中に浮く1280pxの枠
（Figma 453:38724）になるため。SPでは内枠が全幅なので見た目は同じ。 */
.rnw-as-approach {
  display: flex;
  flex-direction: column;
}

.rnw-as-approach__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  /* Figma実測 */
  padding: 56px 16px;
  /* Figma実測 */
  border-radius: 8px;
  /* Figma実測。SPは全幅なので実際は角が見えない */
  background-color: #EAF9F6;
  /* ▼2026-09-22 educare/bg2(青) → educare/afterscholl_bg */
}

.rnw-as-approach__head {
  display: flex;
  flex-direction: column;
  gap: 12px;
  /* Figma実測 */
  width: 100%;
}

.rnw-as-approach__title {
  width: 100%;
  font-family: var(--rnw-font-educare-title);
  /* Figma MOBO-Bold */
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 1.2px;
  color: var(--rnw-main);
  text-align: center;
}

/* このセクションだけカードが311px・間隔24px（Figma 363:28091）。
セクション自体が左右16pxを持っているので、他のスライダーのような
全幅の流し込み（負のマージン）はせず、枠の内側で送る。 */
.rnw-as-approach .rnw-as-slider__track {
  gap: 24px;
  /* Figma実測 */
  width: 100%;
  margin: 0;
  padding: 0;
}

.rnw-as-acard {
  display: flex;
  flex: 0 0 100%;
  /* Figma実測 311px＝枠の内寸ちょうど */
  flex-direction: column;
  align-items: center;
  gap: 12px;
  /* Figma実測 */
  padding: 24px 16px;
  border-radius: 20px;
  background-color: #FFFFFF;
  scroll-snap-align: start;
}

.rnw-as-acard__title {
  width: 100%;
  font-family: var(--rnw-font-educare-title);
  /* Figma MOBO-Bold */
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 1.2px;
  color: var(--rnw-main);
  text-align: center;
}

/* =====================================================================
6. スライダー（教育方針 129:27234 ／ 一日の流れ 129:27301 で共通）
---------------------------------------------------------------------
スクロールはCSS（overflow-x + scroll-snap）、前後ボタンと進捗バーは
renewal/js/front.js が [data-rnw-slider] 契約で制御する。
JSが落ちても指でのスワイプはそのまま効く。
===================================================================== */
.rnw-as-slider {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  /* Figma実測 コントロール → カード列 */
  width: 100%;
  padding: 0 16px;
}

/* ------------------------------------
6-1. 前後ボタンと進捗バー
------------------------------------ */
.rnw-as-slider__ctrl {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 239px;
  /* Figma実測 */
  height: 24px;
}

/* アイコンは背景画像で描く（本文HTMLに src を置かないため）。
Figma の swiper_prev2.svg は swiper_next2.svg と同一グラフィックの180度回転
なので、アセットは1本だけ持ち「前へ」はCSSで回す。
トップ・consulting と同一アセットのため複製していない。 */
.rnw-as-slider__btn {
  flex-shrink: 0;
  width: 24px;
  /* Figma実測 */
  height: 24px;
  padding: 0;
  border: 0;
  background-color: transparent;
  background-image: url('../../img/front/icon_slider_next.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

.rnw-as-slider__btn--prev {
  transform: rotate(180deg);
}

/* --next は既定の向きのままなのでスタイルを持たせていない。
--prev と対になる目印としてマークアップにだけ付けている。 */
/* Figmaでは先頭表示のため「前へ」が opacity 50%。
JSが disabled を立てると同じ見た目になる。 */
.rnw-as-slider__btn:disabled {
  opacity: 0.5;
  cursor: default;
}

.rnw-as-slider__bar {
  position: relative;
  width: 160px;
  /* Figma実測 */
  height: 1px;
  background-color: var(--rnw-main);
}

.rnw-as-slider__bar-thumb {
  position: absolute;
  top: -1px;
  /* Figma実測 */
  left: 0;
  width: 40%;
  /* JSがスクロール量から上書きする */
  height: 3px;
  /* Figma実測 */
  border-radius: 10px;
  background-color: var(--rnw-main);
}

/* ------------------------------------
6-2. カード列
親の左右16pxを打ち消して全幅で流し、内側で16pxを取り直す。
------------------------------------ */
.rnw-as-slider__track {
  display: flex;
  align-items: flex-start;
  /* カードの高さはFigmaでも不揃い */
  gap: 16px;
  /* Figma実測 */
  width: calc(100% + 32px);
  margin: 0 -16px;
  padding: 0 16px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  /* Firefox */
  -ms-overflow-style: none;
  /* 旧Edge */
}

.rnw-as-slider__track::-webkit-scrollbar {
  display: none;
}

/* =====================================================================
7. 教育方針（Figma 363:28116）
---------------------------------------------------------------------
中身は旧版（129:27208）から変わっていない。2026-08-27改訂で地色だけ
反転し、波形とその下が紙テクスチャ地、波形の背後が白になった。
===================================================================== */
/* 波形の背後（Figma 363:28116 の地色）。 */
.rnw-as-policy {
  display: flex;
  flex-direction: column;
  background-color: #FFFFFF;
}

/* 波形の下は紙テクスチャ地（Figma 363:28120）。 */
.rnw-as-policy__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 56px;
  /* Figma実測 */
  background-color: #FDF6F4;
  background-image: linear-gradient(rgba(253, 246, 244, 0.96), rgba(253, 246, 244, 0.96)), url('../../img/front/texture_paper.jpg');
  background-repeat: repeat, repeat;
  background-position: left top, left top;
  background-size: auto, 1228.8px 819.3px;
}

.rnw-as-policy__lead {
  width: calc(100% - 32px);
  max-width: 343px;
  margin-top: 32px;
  /* Figma実測 129:27232 の y */
  font-family: var(--rnw-font-educare-title);
  /* Figma MOBO-SemiBold */
  font-size: 14px;
  font-weight: 600;
  line-height: 1.8;
  letter-spacing: 1.2px;
  color: var(--rnw-text);
}

/* Figma実測：リード文からスライダー枠まで32px＋枠内側の上余白32px。 */
.rnw-as-policy .rnw-as-slider {
  margin-top: 64px;
}

/* 教育方針のカード（Figma 129:27253 ほか） */
.rnw-as-pcard {
  display: flex;
  flex: 0 0 300px;
  /* Figma実測 */
  flex-direction: column;
  gap: 24px;
  /* Figma実測 */
  padding: 24px 16px;
  border-radius: 20px;
  background-color: #FFFFFF;
  scroll-snap-align: start;
}

.rnw-as-pcard__ph {
  width: 100%;
  height: 200px;
  /* Figma実測 */
}

.rnw-as-pcard__body {
  display: flex;
  flex-direction: column;
  gap: 24px;
  /* Figma実測 */
  width: 100%;
}

.rnw-as-pcard__title {
  width: 100%;
  font-family: var(--rnw-font-educare-title);
  /* Figma MOBO-Bold */
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 1.2px;
  color: var(--rnw-main2);
  text-align: center;
}

/* =====================================================================
8. 一日の流れ（Figma 363:28193）
---------------------------------------------------------------------
中身は旧版（129:27285）から変わっていない。旧版では波形（パス933）が
フレーム外（x=375.19）で見えず、高さぶんを padding-top で埋めていたが、
2026-08-27改訂でフレーム内に入り実際に描かれるようになった。
===================================================================== */
/* 波形の背後は .rnw-as の紙地がそのまま出る（Figma 363:28193）。 */
.rnw-as-schedule {
  display: flex;
  flex-direction: column;
}

/* 波形の下は educare/bg2（Figma 363:28195）。 */
.rnw-as-schedule__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 56px;
  /* Figma実測 */
  background-color: #EAF9F6;
  /* ▼2026-09-22 educare/bg2(青) → educare/afterscholl_bg */
}

/* Figma実測：見出しブロックからスライダー枠まで24px＋枠内側の上余白32px。 */
.rnw-as-schedule .rnw-as-slider {
  margin-top: 56px;
}

.rnw-as-schedule__note {
  width: calc(100% - 32px);
  max-width: 343px;
  margin-top: 32px;
  /* Figma実測 129:27385 の y */
  font-family: var(--rnw-font-educare-title);
  /* Figma MOBO-SemiBold */
  font-size: 14px;
  font-weight: 600;
  line-height: 1.8;
  letter-spacing: 1.2px;
  color: var(--rnw-text);
}

/* タイムラインのカード（Figma 129:27321 ほか） */
.rnw-as-tcard {
  position: relative;
  display: flex;
  flex: 0 0 311px;
  /* Figma実測 */
  flex-direction: column;
  background-color: #FFFFFF;
  scroll-snap-align: start;
}

/* カード間をつなぐ線（Figma 129:27320 Vector 10 / educare/main）。
Figmaでは1本の直線が右側の一部にだけ引かれているが、時間軸をつなぐ
意図が明らかなので、各カードの右側16px（＝カード間の隙間）に出して
全体でつながって見えるようにしている。最後のカードには出さない。 */
.rnw-as-tcard::after {
  content: "";
  position: absolute;
  top: 35px;
  /* Figma実測 Vector 10 の y */
  left: 100%;
  width: 16px;
  /* カード間の gap と同値 */
  height: 1px;
  background-color: var(--rnw-main);
}

.rnw-as-tcard:last-child::after {
  content: none;
}

/* 時刻の帯。ここだけ紙テクスチャ地（Figma 129:27322）。 */
.rnw-as-tcard__time {
  padding: 16px 26px;
  /* Figma実測 */
  font-family: var(--rnw-font-jp);
  /* SP/text/large/bold */
  font-size: 18px;
  font-weight: 700;
  line-height: 1.8;
  letter-spacing: 0.216px;
  /* Figma実測 */
  color: var(--rnw-text);
  text-align: center;
  background-color: #FDF6F4;
  background-image: linear-gradient(rgba(253, 246, 244, 0.96), rgba(253, 246, 244, 0.96)), url('../../img/front/texture_paper.jpg');
  background-repeat: repeat, repeat;
  background-position: left top, left top;
  background-size: auto, 1228.8px 819.3px;
}

.rnw-as-tcard__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  /* Figma実測 */
  padding: 16px;
}

/* 見出しタグ（Figma コンポーネント tag / 129:27325 ほか） */
.rnw-as-tag {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 12px;
  /* Figma実測 */
  border: 0.745px solid var(--rnw-main);
  /* Figma実測 */
  border-radius: 58px;
  background-color: #FFFFFF;
  font-family: var(--rnw-font-educare-title);
  /* Figma MOBO-Bold */
  font-size: 14px;
  font-weight: 700;
  line-height: 1.8;
  letter-spacing: 1.2px;
  color: var(--rnw-main);
  text-align: center;
}

.rnw-as-tcard__ph {
  width: 100%;
  height: 130px;
  /* Figma実測 ▼ 2026-08-30 12章で上書き（≤1024は高さauto） */
}

/* =====================================================================
9. 保護者アンケート
---------------------------------------------------------------------
FIX版（Figma SP 694:81747）でナーサリースクールと同じ「満足度ドーナツ」に
置き換わったため、見た目は共通CSS
renewal/css/common.css「9. 保護者アンケート／満足度ドーナツ」へ移した。
旧版の .rnw-as-chart / .rnw-as-scard は削除済み
（img/school-children/chart_dummy.svg も未使用）。
このファイルが持つのはセクションの地色だけ。
===================================================================== */
.rnw-as-survey {
  display: flex;
  flex-direction: column;
  background-color: #EAF9F6;
  /* ▼2026-09-22 educare/bg2(青) → educare/afterscholl_bg */
}

/* =====================================================================
10. よくあるご質問（Figma 363:28364）
---------------------------------------------------------------------
Q&A本体はショートコード出力に委ねているため、ここはセクション枠と
見出しだけ。タグ・アコーディオン・「もっと見る」のスタイルは
ショートコード側で持つこと。
===================================================================== */
.rnw-as-faq {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  /* 見出し → ショートコード出力の間 */
  padding: 56px 24px;
  /* Figma実測 */
  /* 地色・テクスチャは .rnw-as から継承 */
}

/* =====================================================================
11. PC（Figma 453:38564 ／ 1440幅）
---------------------------------------------------------------------
■ 横幅の考え方（nursery-school.css の11章と同じ）
Figmaは1440固定だが、写真が画面端まで抜けるデザイン（FV・見出しブロック）
なのでページ全体は固定幅にせず、地色と写真は全幅、中身だけを中央寄せする。
Figmaの左右余白はセクションごとに3種類あるので変数にしている。

--as-pad-1280 … FV・施設検索・ポピンズアプローチ（1440幅のとき80px）
--as-pad-1248 … 5つの特徴のカード列（1440幅のとき96px）
--as-pad-1200 … その他のセクション（1440幅のとき120px）

1440より広い画面では中身が中央に寄り、狭い画面では24pxまで詰まる。

■ スライダーの扱い
PCで横スクロールが残るのは「教育方針」だけ（Figma 453:38793 は
1728px幅で右に80pxはみ出す）。5つの特徴・ポピンズアプローチ・
一日の流れ・保護者アンケートは折り返し／グリッドになるので、
コントロールを display:none にしてカード列の overflow を戻している。
front.js は「スクロール量から進捗バーとボタンの状態を更新する」だけで、
スクロールが発生しなければ何もしないのでJS側の変更は不要。

■ Figmaと違えているところ
1. MVのコピー。PCフレーム（453:38584 / 453:38585）が
「Nursery School」「認可・認証・事業所内保育園 アフタースクール」と
ナーサリースクールのままなので、SP（363:27900 / 363:27901）の
「After School」「学童・児童館／アフタースクール」を採用している。
本文は共通なのでデザイン側が直れば自動で追従する。
2. 波形（パス933）。PCフレームでは4本とも x=1440 とフレームの外に
出されていて描かれていないが、160pxの帯（453:38667 / 453:38754 /
453:38826 / 453:38919）の地色がSPの「波形の背後の色」と完全に
一致しているので、作図上のずれと判断して nursery-school と同じく
160pxの波形として出している。
TODO: 意図的に直線にしているのであれば .rnw-as-wave を
PC幅で display:none にし、帯のぶんの高さを padding で足すこと。
3. 教育方針のリード文（363:28141「人生で最も重要な人間教育を目指します」）は
PCフレームに無い。PCで文章が消えるのは不都合なので出したままにし、
見出し → リード → スライダーの余白だけこちらで決めている。
4. アンケートPDFボタン（453:38973）はPCだけの要素。
===================================================================== */
@media only screen and (min-width: 768px) {
  /* ---------------------------------------------------------------
  11-0. 全体
  --------------------------------------------------------------- */
  /* ▼ 変数の中の 100% は、変数を「使う側」の包含ブロック幅で解決される。
  以下で使っているのはすべて全幅のブロックなので画面幅と一致する。 */
  .rnw-as {
    --as-pad-1280: max(24px, calc((100% - 1280px) / 2));
    --as-pad-1248: max(24px, calc((100% - 1248px) / 2));
    --as-pad-1200: max(24px, calc((100% - 1200px) / 2));
    padding-top: var(--rnw-header-h-pc);
  }

  .rnw-as-features, .rnw-as-policy, .rnw-as-schedule, .rnw-as-survey, .rnw-as-faq {
    scroll-margin-top: var(--rnw-header-h-pc);
  }

  /* 本文テキスト（PC/educare/text/small = MOBO-Bold 18px）。
  「一日の流れ」のカードとポピンズアプローチは別サイズなので後で戻す。 */
  .rnw-as-text {
    font-size: 18px;
    font-weight: 700;
  }

  /* 波形。SPは幅に対する比率で高さが決まるが、PCは画面幅によらず160px固定。 */
  .rnw-as-wave {
    height: 160px;
    aspect-ratio: auto;
  }

  /* ▼2026-09-22 新デザイン（Figma 1781:11873）で帯の形が4箇所とも指定し直された。
  Figmaから書き出したパスの値で確定させている（目視判断はしていない）。
  5つの特徴の上   1781:11929 … 円弧 circle cx=720 cy=1670.22 r=1670.22 / white
  教育方針の上     1781:12023 … 円弧 同上 / educare/bg-tex02 #FDF6F4＋紙テクスチャ
  一日の流れの上   1781:12092 … パス933（山）/ educare/afterscholl_bg #EAF9F6
  アンケートの上   1781:12185 … 円弧 同上 / white
  円弧は border-radius で描くと楕円になり中央が平たくなるため、円弧そのものを
  引いた wave_arc.svg（1440×160）を preserveAspectRatio="none" で伸ばしてマスクにする。
  ナーサリースクールで作った既存アセットをそのまま流用する（複製しない）。
  SPは別形（wave_arc_sp.svg）。基底の指定を上書きしている。 */
  .rnw-as-wave {
    -webkit-mask-image: url('../../img/front/wave_arc.svg');
    mask-image: url('../../img/front/wave_arc.svg');
  }

  /* 一日の流れの上（1781:12092）だけは、PCでは円弧ではなくパス933（山）。
  マスクだけ戻す（高さは上の160px固定のまま。Figmaのフレームも1440×160）。
  塗り（#EAF9F6）と他3箇所の円弧はSP側の指定がそのまま効く。 */
  .rnw-as-wave--bg2 {
    -webkit-mask-image: url('../../img/school-children/wave.svg');
    mask-image: url('../../img/school-children/wave.svg');
  }

  /* ---------------------------------------------------------------
  11-1. セクション見出しブロック
  写真あり … 5つの特徴 453:38671 ／ 教育方針 453:38758 ／
  一日の流れ 453:38830
  1000px幅の写真を左右どちらかに寄せ、カードを重ねて絶対配置する。
  カードの位置は「中身の端から80px内側」。
  写真なし … 保護者アンケート 453:38923 ／ FAQ 453:38985
  アイコンと文字を横並びにして中央に置くだけ。
  --------------------------------------------------------------- */
  .rnw-as-head {
    position: relative;
    flex-direction: row;
    align-items: center;
    padding: 0 var(--as-pad-1200);
  }

  .rnw-as-head__ph {
    flex: 0 1 1000px;
    /* Figma実測。狭い画面では縮める */
    width: auto;
    height: 535px;
    /* Figma実測（5つの特徴だけ530px。下で上書き） ▼ 2026-08-30 12章で上書き（iPad縦の比率保持） */
    border-radius: 20px;
  }

  .rnw-as-head__card {
    position: absolute;
    top: 50%;
    flex-direction: row;
    gap: 40px;
    /* Figma実測 */
    width: 400px;
    /* Figma実測 */
    max-width: none;
    height: 200px;
    margin-top: 0;
    /* SPの写真への食い込み（-40px）は使わない */
    padding: 24px;
    transform: translateY(-50%);
  }

  .rnw-as-head--noimage {
    justify-content: center;
  }

  .rnw-as-head--noimage .rnw-as-head__card, .rnw-as-head__card--plain {
    position: static;
    width: auto;
    height: auto;
    transform: none;
  }

  /* アイコンはSPのちょうど2倍（Figma実測 高さ80px）。 */
  .rnw-as-head__icon {
    height: 80px;
  }

  .rnw-as-head__icon--features {
    width: 84.444px;
  }

  .rnw-as-head__icon--policy {
    width: 84.444px;
  }

  .rnw-as-head__icon--schedule {
    width: 80px;
  }

  .rnw-as-head__icon--survey {
    width: 103.564px;
  }

  .rnw-as-head__icon--faq {
    width: 111.457px;
  }

  .rnw-as-head__text {
    width: auto;
  }

  .rnw-as-head__en {
    font-size: 20px;
  }

  /* Figma実測 */
  .rnw-as-head__ja {
    font-size: 32px;
  }

  /* PC/educare/title/h2 */
  /* ---------------------------------------------------------------
  11-2. スライダー共通（PCで横スクロールが残るのは教育方針だけ）
  Figma 453:38778
  --------------------------------------------------------------- */
  .rnw-as-slider__ctrl {
    width: 400px;
    /* Figma実測 */
    height: 40.167px;
  }

  .rnw-as-slider__btn {
    width: 40px;
    /* Figma実測 */
    height: 40px;
  }

  .rnw-as-slider__bar {
    width: 260px;
  }

  /* Figma実測 */
  .rnw-as-slider__bar-thumb {
    top: -1.67px;
    /* Figma実測 */
    height: 4px;
    border-radius: 16.736px;
  }

  /* ---------------------------------------------------------------
  11-3. メインビジュアル（Figma 453:38567 → 2026-09-22 1781:11876）
  写真は右端まで抜け、テキストは左。下端に装飾が2枚重なる。
  背面 … パス933（fv_wave.svg / ::before）
  前面 … ピンクの円2つ（fv_circles.svg / .rnw-as-mv__deco）
  2枚ともナーサリースクールのPC版FVとサイズ・位置が一致したので
  img/nursery-school/ のアセットをそのまま流用している（複製しない）。
  --------------------------------------------------------------- */
  .rnw-as-mv {
    height: 750px;
    /* Figma実測 */
    overflow: hidden;
    background-color: #FFFFFF;
  }

  .rnw-as-mv::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    /* ▼2026-09-22 イラスト（fv_illust.png）は新デザインで無くなった。
    残るのはパス933だけ（1781:11877 / 1440×349.447）。 */
    background-image: url('../../img/nursery-school/fv_wave.svg');
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 100% 349.447px;
    /* Figma実測 1781:11877 */
    pointer-events: none;
  }

  /* ▼2026-09-22 の更新で、斜線（fv_stripes.png）からピンクの円2つに変わった
  （Figma 1781:11886 / 1440×184）。書き出したSVGは
  img/nursery-school/fv_circles.svg とバイト単位で完全一致したので流用する。
  Figmaではフレームの最前面にあり写真の上にも重なる。掛け算なので
  写真に重なった部分は写真がピンクに沈む（ナーサリー・トップと同じ扱い）。 */
  .rnw-as-mv__deco {
    display: block;
    position: absolute;
    z-index: 2;
    inset: 0;
    background-image: url('../../img/nursery-school/fv_circles.svg');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 100% auto;
    /* SVGは1440×184。高さは幅に追従 */
    mix-blend-mode: multiply;
    pointer-events: none;
  }

  /* 写真（Figma 453:38580）。右端まで抜けるので左側だけ角丸。
  幅は 800/1440 の比率で持つ（px固定にするとタブレット幅で痩せるため）。 */
  .rnw-as-mv__ph {
    position: absolute;
    z-index: 1;
    top: 80px;
    /* Figma実測 */
    right: 0;
    /* ▼2026-09-22 1440px以上の 800px 頭打ち（min()）をやめた。
    テキスト側は画面が広がるほど右へ寄るのに写真だけ800pxで止まるため、
    増えた幅がまるごと中央の余白になっていた（ナーサリースクールと同じ対応）。
    1440px以下は 55.556% < 800px なので見た目は変わらない。
    ▼2026-09-26 800px 頭打ちに戻した（ナーサリースクールと同じ対応）。
    高さ590px固定のまま幅だけ伸びると枠が横長になり、写真の上下が削られて顔が切れるため。
    1441px以上はテキストと写真の間が空くが、それは許容（ハワイ英語と同じ形）。 */
    width: min(800px, 55.556%);
    /* 800 / 1440。1441px以上は800pxで止める */
    /* ▼2026-09-26 768〜1165px の高さ・写真の基準位置は12章で上書き（顔切れ） */
    height: 590px;
    border-radius: 20px 0 0 20px;
  }

  /* SPの波形（363:27896 Union）はPCでは使わない。 */
  .rnw-as-mv__panel::before {
    content: none;
  }

  /* 左のテキストカラム（Figma 453:38582）。上下中央。
  幅はFigma実測450pxだが、写真（右44.444%〜）と最低24px空けたいので、
  残りが450pxに満たない幅ではそちらに合わせて縮める。 */
  .rnw-as-mv__panel {
    position: absolute;
    z-index: 3;
    top: 50%;
    left: var(--as-pad-1280);
    width: min(450px, calc(44.444% - var(--as-pad-1280) - 24px));
    margin-top: 0;
    padding: 0;
    transform: translateY(-50%);
  }

  .rnw-as-mv__head {
    align-items: flex-start;
    gap: 16px;
    /* Figma実測 453:38583 */
    text-align: left;
  }

  .rnw-as-mv__en {
    font-size: 20px;
  }

  /* Figma実測 */
  .rnw-as-mv__sub {
    font-size: 20px;
  }

  /* Figma実測 */
  .rnw-as-mv__h1 {
    font-size: 48px;
  }

  /* Figma実測 */
  .rnw-as-mv__lead {
    margin-top: 20px;
    /* Figma実測 453:38582 の gap */
    padding: 0;
    font-size: 18px;
    /* PC/educare/text/small */
    font-weight: 700;
  }

  /* ---------------------------------------------------------------
  11-4. イラスト帯
  PCではFV側に別デザインの装飾が入るのでセクションごと出さない。
  --------------------------------------------------------------- */
  .rnw-as-lead {
    display: none;
  }

  /* ---------------------------------------------------------------
  11-5. 施設検索＋ページ内メニュー（Figma 453:38613）
  横並び。狭い画面では折り返してメニューが下段に落ちる。
  --------------------------------------------------------------- */
  .rnw-as-nav {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: center;
    gap: 40px;
    /* Figma実測 */
    padding: 80px var(--as-pad-1280);
  }

  /* 施設検索カードはFIX版で削除された（本文側のコメント参照）。 */
  /* 252×3 ＋ 列間12×2 ＋ 左右padding24×2 ＝ 828px */
  .rnw-as-menu {
    display: flex;
    flex: 1 1 828px;
    align-items: center;
    justify-content: center;
    padding: 24px;
  }

  .rnw-as-menu__list {
    grid-template-columns: repeat(3, 252px);
  }

  /* ▼ 2026-08-30 12章で上書き（iPad縦はみ出し対応） */
  .rnw-as-menu__item {
    padding: 16px;
  }

  .rnw-as-menu__label {
    font-family: var(--rnw-font-educare-title);
    /* Figma MOBO-Bold */
    font-size: 18px;
    font-weight: 700;
    line-height: 1.8;
    letter-spacing: 1.2px;
  }

  /* SPは「保護者／アンケート」を2行に折っているが、PCは1行（Figma 453:38650）。 */
  .rnw-as-menu__label br {
    display: none;
  }

  /* ---------------------------------------------------------------
  11-6. 5つの特徴（Figma 453:38669）
  スライダーをやめて3枚＋2枚の折り返しにする。
  1248 ＝ 400×3 ＋ 24×2 なので、そのまま3枚で1行になる。
  下端の余白はポピンズアプローチ側（11-7）が持つ。
  --------------------------------------------------------------- */
  .rnw-as-features__body {
    padding: 80px 0 0;
  }

  /* Figma実測 */
  .rnw-as-features .rnw-as-head {
    justify-content: flex-end;
  }

  .rnw-as-features .rnw-as-head__ph {
    height: 530px;
  }

  /* Figma実測 ▼ 2026-08-30 12章で上書き */
  .rnw-as-features .rnw-as-head__card {
    left: calc(var(--as-pad-1200) + 80px);
  }

  .rnw-as-features .rnw-as-slider {
    margin-top: 80px;
    /* Figma実測 */
    padding: 0 var(--as-pad-1248);
  }

  .rnw-as-features .rnw-as-slider__ctrl {
    display: none;
  }

  .rnw-as-features .rnw-as-slider__track {
    flex-wrap: wrap;
    justify-content: center;
    gap: 24px;
    /* Figma実測 */
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: visible;
    scroll-snap-type: none;
  }

  .rnw-as-fcard {
    flex: 0 0 400px;
  }

  /* Figma実測 ▼ 2026-08-30 12章で上書き（iPad縦の2列化） */
  .rnw-as-fcard__body {
    gap: 12px;
    /* Figma実測 */
    padding: 24px 40px;
    /* Figma実測 */
  }

  .rnw-as-fcard__title {
    font-size: 24px;
  }

  /* PC/educare/title/h3 */
  /* ---------------------------------------------------------------
  11-7. ポピンズアプローチ（Figma 453:38724）
  PCでは「5つの特徴」の白地の中に浮く1280pxの枠になる。
  内枠の外側（白地と上下の余白）はこのセクションが持つ。
  --------------------------------------------------------------- */
  .rnw-as-approach {
    padding: 80px var(--as-pad-1280) 120px;
    /* Figma実測 */
    background-color: #FFFFFF;
  }

  .rnw-as-approach__inner {
    gap: 32px;
    /* Figma実測 */
    padding: 40px;
    /* Figma実測 */
  }

  .rnw-as-approach__title {
    font-size: 24px;
  }

  /* PC/educare/title/h3 */
  .rnw-as-approach .rnw-as-slider {
    padding: 0;
  }

  .rnw-as-approach .rnw-as-slider__ctrl {
    display: none;
  }

  /* 1200 ＝ 288×4 ＋ 16×3 なので4枚が1行に収まる。 */
  .rnw-as-approach .rnw-as-slider__track {
    justify-content: center;
    gap: 16px;
    /* Figma実測 */
    overflow: visible;
    scroll-snap-type: none;
  }

  .rnw-as-acard {
    flex: 0 0 288px;
    /* Figma実測 */
  }

  .rnw-as-acard__title {
    font-size: 24px;
  }

  /* PC/educare/title/h3 */
  /* このカードの本文だけ16px（Figma 453:38735）。 */
  .rnw-as-acard .rnw-as-text {
    font-size: 16px;
  }

  /* ---------------------------------------------------------------
  11-8. 教育方針（Figma 453:38756）
  PCでもスライダーのまま。見出しの写真は左・カードは右で、
  5つの特徴／一日の流れとは左右が逆。
  --------------------------------------------------------------- */
  .rnw-as-policy__body {
    padding: 80px 0 120px;
  }

  /* Figma実測 */
  .rnw-as-policy .rnw-as-head {
    justify-content: flex-start;
  }

  .rnw-as-policy .rnw-as-head__card {
    right: calc(var(--as-pad-1200) + 80px);
  }

  /* PCフレームに無いリード文。消すと文章が落ちるので出したままにし、
  見出し → リード → スライダーの余白はここで決めている。 */
  .rnw-as-policy__lead {
    width: 100%;
    max-width: none;
    margin-top: 80px;
    padding: 0 var(--as-pad-1200);
    font-size: 18px;
    font-weight: 700;
    text-align: center;
  }

  .rnw-as-policy .rnw-as-slider {
    margin-top: 32px;
    /* Figma実測 453:38777 の gap */
    gap: 32px;
    padding: 0 var(--as-pad-1200);
  }

  /* カード列は右へはみ出したままスクロールさせる（Figma 453:38793 の pr-80）。 */
  .rnw-as-policy .rnw-as-slider__track {
    width: 100%;
    margin: 0;
    padding: 0 80px 0 0;
  }

  .rnw-as-pcard {
    flex: 0 0 400px;
  }

  /* Figma実測 */
  .rnw-as-pcard__title {
    font-size: 24px;
  }

  /* PC/educare/title/h3 */
  /* ---------------------------------------------------------------
  11-9. 一日の流れ（Figma 453:38828）
  2列×4行。Figmaは左列に1〜4番目、右列に5〜8番目が縦に並ぶので
  grid-auto-flow: column で列方向に流す（453:38844 / 453:38881）。
  --------------------------------------------------------------- */
  .rnw-as-schedule__body {
    padding: 80px 0 120px;
  }

  /* Figma実測 */
  .rnw-as-schedule .rnw-as-head {
    justify-content: flex-end;
  }

  .rnw-as-schedule .rnw-as-head__card {
    left: calc(var(--as-pad-1200) + 80px);
  }

  .rnw-as-schedule .rnw-as-slider {
    margin-top: 80px;
    /* Figma実測 */
    padding: 0 var(--as-pad-1200);
  }

  .rnw-as-schedule .rnw-as-slider__ctrl {
    display: none;
  }

  .rnw-as-schedule .rnw-as-slider__track {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(4, auto);
    gap: 24px;
    /* Figma実測 */
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: visible;
  }

  /* カード間をつなぐ線はPCデザインに無い。 */
  .rnw-as-tcard::after {
    content: none;
  }

  /* 写真が左、タグと本文が右（Figma 453:38848）。
  マークアップの並びは タグ → 写真 → 本文 なので、gridで置き直す。 ▼ 2026-08-30 12章でタブレット(768～1024)はSP縦積みに戻す */
  .rnw-as-tcard__body {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto 1fr;
    align-items: start;
    gap: 16px;
    /* Figma実測 */
    padding: 16px;
  }

  .rnw-as-tcard__ph {
    grid-column: 1;
    grid-row: 1 / span 2;
    height: 200px;
    /* Figma実測 */
  }

  .rnw-as-tag {
    grid-column: 2;
    grid-row: 1;
    font-size: 18px;
    /* PC/educare/text/small */
  }

  /* このセクションの本文だけFigmaもSPと同じ14px（Figma 453:38853）。 */
  .rnw-as-tcard .rnw-as-text {
    grid-column: 2;
    grid-row: 2;
    font-size: 14px;
    font-weight: 600;
  }

  .rnw-as-schedule__note {
    width: 100%;
    max-width: none;
    margin-top: 16px;
    /* Figma実測 453:38842 の gap */
    padding: 0 var(--as-pad-1200);
  }

  /* ---------------------------------------------------------------
  11-10. 保護者アンケート
  .rnw-voice（満足度ドーナツ）は共通コンポーネントになったので、
  PCの指定も renewal/css/common.css「9. 保護者アンケート／満足度ドーナツ」
  が持っている。このファイルには何も書かない。
  --------------------------------------------------------------- */
  /* ---------------------------------------------------------------
  11-11. よくあるご質問（Figma 453:38983）
  Q&A本体はショートコード [educare_faq] の出力（faq.css）。
  faq.css は他ページでも読まれるので、PC幅の上書きはこのセクション配下に
  スコープを切っている（nursery-school.css と同じ）。
  --------------------------------------------------------------- */
  .rnw-as-faq {
    gap: 56px;
    /* Figma実測 見出し → タグ */
    padding: 80px var(--as-pad-1200);
  }

  /* セクション側で左右余白を取っているので、見出しでは取らない。 */
  .rnw-as-faq .rnw-as-head {
    padding: 0;
  }

  .rnw-as-faq .rnw-faq {
    gap: 56px;
  }

  /* Figma実測 タグ → Q&A */
  .rnw-as-faq .rnw-faq__tab {
    font-size: 18px;
  }

  /* Figma実測（余白はSPと同じ） */
  /* PCはQ・AともZen Kaku Gothic New 16px（PC/text/dafalut）。
  SPのMOBO（--rnw-font-educare-title）とは書体自体が違う。 */
  .rnw-as-faq .rnw-faq__q-text, .rnw-as-faq .rnw-faq__a-text {
    font-family: var(--rnw-font-jp);
    font-size: 16px;
  }

  .rnw-as-faq .rnw-faq__q-text {
    font-weight: 700;
  }

  .rnw-as-faq .rnw-faq__a-text {
    font-weight: 500;
  }

}

/* ---------- モーション低減 ---------- */
@media (prefers-reduced-motion: reduce) {
  .rnw-as-slider__track {
    scroll-behavior: auto;
  }

}

/* =====================================================================
12. 調整ログ（2026-08-30～）
---------------------------------------------------------------------
ここより下は、既存章の後に日付順で追記する調整履歴。
■ ルール
・変更は原則ここに追記し、既存章側には「▼ 日付 12章で上書き」の目印を残す。
・SP/PCで値を分ける場合は必ず @media で包む（素の追記はSP・PC両方に勝ってしまう）。
・元が複合セレクタなら同等以上の詳細度で書く。
===================================================================== */
/* --- 2026-08-30 ページ内メニュー：iPad縦（768～）で3列がはみ出す（PC上書き） --- */
@media only screen and (min-width: 768px) {
  .rnw-as-menu__list {
    grid-template-columns: repeat(3, minmax(0, 252px));
  }

}

/* --- 2026-08-30 5つの特徴：iPad縦（768～871）で1列に落ちる（PC上書き） --- */
/* basisを344pxに下げる（折り返し判定はbasis基準でshrinkだけでは2列にならない）。max-widthで≥1248pxは従来の400px×3列。 */
@media only screen and (min-width: 768px) {
  .rnw-as-fcard {
    flex: 1 1 344px;
    max-width: 400px;
  }

}

/* --- 2026-08-30 見出しブロックの写真：iPad縦で高さ535px固定のため縦に間延び（PC上書き） --- */
/* 幅連動の aspect-ratio に。flexはgrowなしで幅≤1000px→高さも上限で頭打ち、PC本来の見た目は不変。 */
@media only screen and (min-width: 768px) {
  .rnw-as-head__ph {
    aspect-ratio: 1000 / 535;
    height: auto;
  }

  .rnw-as-features .rnw-as-head__ph {
    aspect-ratio: 1000 / 530;
    height: auto;
  }

}

/* --- 2026-08-30 一日の流れ：iPad縦でカード内の2カラムが窮屈→縦積みに戻す（768～1024 上書き） --- */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .rnw-as-schedule .rnw-as-tcard__body {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .rnw-as-schedule .rnw-as-tag {
    font-size: 14px;
  }

  /* SPと同じ（PCは18px） */
}

/* --- 2026-08-30 一日の流れの写真：固定高coverで顔が切れる→高さauto（≤1024限定、PCは従来の固定高） --- */
@media only screen and (max-width: 1024px) {
  .rnw-as-schedule .rnw-as-tcard__ph {
    height: auto;
  }

  .rnw-as-schedule .rnw-as-tcard__ph .rnw-kb__img {
    height: auto;
  }

}

/* --- 2026-09-01 教育方針：カードの高さが揃っていない（6-2上書き） --- */
/* FIX版（SP 694:81640 ／ PC 694:32013）はカード4枚とも同じ高さ。本文の長さが違うので
track 側で伸ばして揃え、伸びしろは本文ブロックが受ける。 */
.rnw-as-policy .rnw-as-slider__track {
  align-items: stretch;
}

.rnw-as-pcard__body {
  flex: 1 0 0;
}

/* --- 2026-09-01 ページ内メニュー：PCで青いパネルだけが広がる（11-5上書き） --- */
/* FIX版 694:31878 は 4列×2行で、パネルは中身の幅（252×4 ＋ 12×3 ＋ 内側24×2 ＝ 1092px）に収まる。
施設検索カードがFIXで消えたのに横並びの flex-grow:1 が残っていたため、
パネルだけが 1280px まで伸びて中身が右に寄っていた。伸ばさず4列にする。 */
@media only screen and (min-width: 768px) {
  .rnw-as-menu {
    flex: 0 0 auto;
  }

  .rnw-as-menu__list {
    grid-template-columns: repeat(4, minmax(0, 252px));
  }

}

/* --- 2026-09-01 ポピンズアプローチ：カードに写真が付き、PCは2列×2行（5章・11-7上書き） --- */
/* FIX版 SP 694:81596 ／ PC 694:31975。
カードは「写真200px（上・角丸20px）＋本文（padding 16px）」の2段になり、
SPは300px幅の横スライダー、PCは 584px×2列（584×2 ＋ 32 ＝ 1200＝内枠1280 − padding40×2）。
写真はFigmaもグレーのベタ塗り（未支給）なので .rnw-as-ph のプレースホルダーで置いている。 */
.rnw-as-acard {
  flex: 0 0 300px;
  /* Figma実測（FIX版は枠いっぱいではなく次が少し覗く） */
  align-items: stretch;
  gap: 0;
  padding: 0;
}

.rnw-as-acard__ph {
  width: 100%;
  /* 固定200pxだとPC幅で画像(500×333)が上下に切り取られ高さ不足→画像本来の比率で高さを出す。
  SP(300px幅)は従来どおり約200px、PC(584px幅)は約389pxになる。 */
  aspect-ratio: 500 / 333;
  border-radius: 20px 20px 0 0;
}

.rnw-as-acard__body {
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  gap: 12px;
  /* Figma実測 */
  padding: 16px;
  /* Figma実測 */
  border-radius: 0 0 20px 20px;
  background-color: #FFFFFF;
}

/* カードの高さを行内で揃える（FIX版も行ごとに揃っている）。 */
.rnw-as-approach .rnw-as-slider__track {
  align-items: stretch;
}

@media only screen and (min-width: 768px) {
  .rnw-as-approach .rnw-as-slider__track {
    flex-wrap: wrap;
    gap: 32px;
    /* Figma実測 列間・行間とも32px */
  }

  .rnw-as-acard {
    flex: 0 0 584px;
  }

  /* Figma実測 */
}

/* --- 2026-09-01 一日の流れ：PCで左右のカードの高さが揃わない（11-9上書き） --- */
/* 6-2 の .rnw-as-slider__track が align-items:flex-start を持っており、
grid では align-items:start と同じ扱いになるためカードが引き伸ばされていなかった。
FIX版（694:32096）は8枚とも同じ高さなので、行も 1fr で揃える。
中身は本文ブロックが伸びしろを受ける。 */
@media only screen and (min-width: 768px) {
  .rnw-as-schedule .rnw-as-slider__track {
    grid-template-rows: repeat(4, 1fr);
    align-items: stretch;
  }

  .rnw-as-tcard__body {
    flex: 1 0 0;
  }

}

/* --- 2026-09-01 5つの特徴：SPでカード下のドロップシャドウが切れる（6-2上書き） --- */
/* overflow-x:auto のトラックは下方向も切り抜くため、box-shadow(0 4px 28px) の下端が欠ける。
下に28pxの内側余白を取り、同じだけ負のマージンで戻す（front / consulting と同じ形）。
影を持つのは .rnw-as-fcard だけなので5つの特徴に限定。
≥768pxはトラックが overflow:visible なので対象外。 */
@media only screen and (max-width: 767px) {
  .rnw-as-features .rnw-as-slider__track {
    margin: 0 -16px -28px;
    padding: 0 16px 28px;
  }

}

/* --- 2026-09-01 一日の流れ：SPでもカードの高さを揃える（6-2上書き。上のPC分と同じ理由） --- */
/* 横スライダーでも本文の長さでカードの高さがバラつくので、track で伸ばして揃える。 */
@media only screen and (max-width: 767px) {
  .rnw-as-schedule .rnw-as-slider__track {
    align-items: stretch;
  }

  .rnw-as-tcard__body {
    flex: 1 0 0;
  }

}

/* =====================================================================
2026-09-23 このページの青をすべて緑へ（educare/afterscholl_*）
---------------------------------------------------------------------
新デザイン（PC 1781:11873 / SP 1792:18522 / ヘッダー 1781:11874）の
アフタースクールには educare/main(#00429A)・main2(#507CB8)・bg(#E7EFFB) が
1か所も使われていない。Figmaの書き出しを実測した結果：
・PC帯（1781:11874 の _menu）… 地 #EAF9F6 ／ ピル 白 ／ 文字 #444444
・ページ内メニューのブロック（1781:11889）… #EAF9F6
・ポピンズアプローチのパネル（1781:11987）… #EAF9F6
・保護者アンケート（1781:12188）… #EAF9F6 ＋ 文字・ドーナツ #29846F
いずれも青は0ピクセル。

セレクタを1つずつ塗り替える方式だと、common.css 側の共通部品が青のまま残る。
実際に残っていたのは
・PCのページ内リンクの帯（.rnw-pagenav--bar）
・SPドロワー（.rnw-pagenav--card とその地）
・保護者アンケートのドーナツ・数字・吹き出し（.rnw-voice）
・FAQ本文中のリンク（[educare_faq] が出力する <a>）
で、どれも school-children.css には無く common.css の定義。
ヘッダー側は .rnw-as の外にあるので、ページのルート要素に限定した
スコープでも届かない。

このファイルはアフタースクールのページでしか読み込まれない
（header.php の is_page(['service/school-children','school-children'])）ので、
:root で変数を差し替えてもこのページ以外には影響しない。
common.css より後に読み込まれるため、同じ :root でも後勝ちで上書きされる。
===================================================================== */
/* ▼2026-09-23 セレクタは :root ではなく [data-property="educare"]。
色変数は common.css の 103行目で [data-property="educare"] に定義されていて、
この属性は <body> に付く（header.php:207）。:root（＝html）に書いても
body のほうが近い祖先になるため、body 配下のすべてで body 側の値が使われて
1つも効かない。同じセレクタで後から上書きする必要がある。 */
[data-property="educare"] {
  --rnw-main: #29846F;
  /* educare/afterscholl_main（旧 educare/main #00429A） */
  --rnw-main2: #29846F;
  /* 新デザインに main2 に当たる2色目は無い */
  --rnw-bg2: #EAF9F6;
  /* educare/afterscholl_bg（旧 educare/bg #E7EFFB） */
  --rnw-cta2-bg: #29846F;
  /* SPドロワーのCTA（旧 #507CB8） */
}

/* --- 変数を見ていない箇所（common.css にベタ書き）の上書き ---
保護者アンケートの吹き出しは、SPとPCで白／濃色が入れ替わる作りになっていて、
濃いほうが #507CB8 のベタ書き。変数を差し替えても変わらないので個別に指定する。
（common.css 2963 / 2970 / 3112 / 3120 / 3143 / 3154行） */
.rnw-voice__balloon--a, .rnw-voice__balloon--b, .rnw-voice__balloon--c, .rnw-voice__balloon--d {
  background-color: var(--rnw-bg2);
  color: var(--rnw-main);
}

.rnw-voice__balloon--b {
  background-color: #29846F;
  color: #FFFFFF;
}

.rnw-voice__balloon--b::after {
  border-top-color: #29846F;
}

@media only screen and (min-width: 768px) {
  .rnw-voice__balloon--a {
    background-color: #29846F;
    color: #FFFFFF;
  }

  .rnw-voice__balloon--a::after {
    border-top-color: #29846F;
  }

  .rnw-voice__balloon--b {
    background-color: #FFFFFF;
    color: var(--rnw-main);
  }

  .rnw-voice__balloon--b::after {
    border-top-color: #FFFFFF;
  }

  .rnw-voice__balloon--c {
    background-color: #29846F;
    color: #FFFFFF;
  }

  .rnw-voice__balloon--c::after {
    border-right-color: #29846F;
  }

  .rnw-voice__balloon--d {
    background-color: #FFFFFF;
    color: var(--rnw-main);
  }

}

/* スライダーの前後ボタンは、青い円がSVGに焼き込まれている
（img/front/icon_slider_next.svg の fill="#00429A"）。
CSSからは色を変えられないので、緑に差し替えた同じ図形のSVGを置いた。 */
.rnw-as-slider__btn {
  background-image: url('../../img/school-children/icon_slider_next.svg');
}

/* --- 2026-09-26 MV写真：768〜1165pxで顔が切れる（11-3上書き） --- */
/* 写真枠は高さ590px固定・幅55.556%なので、この幅では枠が縦長になり、
写真（pc/photo_mv.jpg 1600×1180 → 表示800×590）の左右が削られる。
Ken Burns で1.08倍まで拡大すると、さらに左右が削られる。
中央基準・高さ590pxのままで全員の顔が入るのは、枠幅 ≧ 648px（画面 ≧ 1166px）から。
残したい範囲は、左端のメガネの男の子の髪（元画像 x≒280）〜右端の女の子の髪（x≒1390）。
▼基準位置をずらすだけでは768〜1165pxで全員は入らない（大人か子どもが切れる）ので、
枠の縦横比を 11:10 で止め、高さを幅に追従させる。
1165px→約647×588px（1166px以上の590pxとほぼつながる）／975px→約542×492px／
834px→約463×421px／768px→約427×388px。
拡大時に見える範囲はどの幅でも x≒214〜1416（基準位置55%）。全員の顔が入る。
写真の下端が上がるため、この幅では下のピンクの円と写真は重ならない。 */
@media only screen and (min-width: 768px) and (max-width: 1165px) {
  .rnw-as-mv__ph {
    height: auto;
    aspect-ratio: 11 / 10;
  }

  .rnw-as-mv__ph .rnw-kb__img {
    object-position: 55% center;
  }

}

/* --- 2026-09-26 5つの特徴・教育方針の見出し写真：基準位置を上端に（全幅） --- */
/* 枠と写真の比率がずれて上下が削られるときは、下だけを削る（頭が切れないように）。 */
.rnw-as-features .rnw-as-head__ph .rnw-kb__img, .rnw-as-policy .rnw-as-head__ph .rnw-kb__img {
  object-position: center top;
}

/* --- 2026-09-26 一日の流れの見出し写真：基準位置を上から30%に（全幅） --- */
/* 上端だと右の女の子の口元から下が切れるため、少し下げる。
写真（photo_head_schedule.jpg 750×400）で、男性の髪の上端は y≒0、女の子のあごは y≒235。
枠が約3.6:1まで横長になると見えるのは高さ約208px分で、両方は同時に入らない。
30% だと見える範囲は y≒58〜266（女の子のあごまで入り、男性は髪の上側が切れる）。 */
.rnw-as-schedule .rnw-as-head__ph .rnw-kb__img {
  object-position: center 30%;
}

/* --- 2026-09-26 教育方針の見出し写真：施主の見本どおりに拡大して切り抜く（全幅） --- */
/* 見本のスクショ（枠376×201）と photo_head_policy.jpg（750×400）を照合した値。
1.2倍に拡大し、右端はそろえ、上は枠の拡大分の約7%だけ削る
（左の男の子の肩と、下のボードゲームが削られる）。
枠（.rnw-kb）が overflow:hidden なので、はみ出した分は見えない。 */
.rnw-as-policy .rnw-as-head__ph .rnw-kb__img {
  transform: scale(1.2);
  transform-origin: 100% 7%;
}

/* 2026-10-27: Only MV through the section before the existing daily schedule. */
.rnw-as-update {
  --as-main: #29846f;
  --as-pale: #eaf9f6;
  background: #fff;
  color: #444;
  letter-spacing: 1.2px
}

.rnw-as-update *,.rnw-as-update *::before,.rnw-as-update *::after {
  box-sizing: border-box
}

.rnw-as-update :where(h1,h2,h3,p,ul,ol) {
  margin: 0;
  padding: 0
}

.rnw-as-update :where(ul,ol) {
  list-style: none
}

.rnw-as-update img {
  display: block;
  max-width: 100%
}

.rnw-as-update button {
  font: inherit;
  cursor: pointer;
  border: 0
}

.rnw-as-update [hidden] {
  display: none!important
}

.rnw-as-update :where(h2,h3) {
  font-family: var(--rnw-font-educare-title,var(--rnw-font-jp));
  font-weight: 700
}

.rnw-as-update :where(section[id]) {
  scroll-margin-top: calc(var(--rnw-header-h-pc,153px) + 90px)
}

.rnw-as-update .rnw-as-only-sp {
  display: none
}

.rnw-as-update .rnw-as-hero {
  width: 100%;
  height: auto;
  min-height: 0;
  aspect-ratio: 1440 / 800;
  max-height: min(800px, calc(100svh - var(--rnw-header-h-pc) - 40px - 13px * 1.8));
  position: relative;
  background: #fff
}

.rnw-as-update .rnw-as-hero picture {
  display: block;
  position: absolute;
  inset: 0;
  overflow: hidden
}

.rnw-as-update .rnw-as-hero__image {
  width: 100%;
  height: 100%;
  object-fit: cover
}

.rnw-as-update .rnw-as-hero picture::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(transparent 70.634%,#f6c3d0)
}

.rnw-as-update .rnw-as-hero__title {
  position: absolute;
  left: 3.4722%;
  bottom: 7%;
  color: #fff;
  filter: drop-shadow(0 3px 21px #72001c);
  font-family: "Noto Serif JP",serif
}

.rnw-as-update .rnw-as-hero__title p {
  font-size: 22px;
  line-height: 1.6;
  font-weight: 700;
  margin-bottom: 12px
}

.rnw-as-update .rnw-as-hero__title h1 {
  font-size: 48px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 2.1px
}

.rnw-as-update .rnw-as-badge {
  position: absolute;
  right: 2.7778%;
  bottom: 5%;
  width: 250px;
  height: 250px;
  color: #444;
  font-family: "Noto Serif JP",serif
}

.rnw-as-update .rnw-as-badge__base {
  position: absolute;
  left: -6.55%;
  top: -6.55%;
  width: 113.1%;
  height: 113.1%;
  max-width: none!important
}

.rnw-as-update .rnw-as-badge__crown {
  position: absolute;
  left: 42%;
  top: 5.55%;
  width: 16%;
  height: 13.13%
}

.rnw-as-update .rnw-as-badge__left {
  position: absolute;
  left: 5.7%;
  top: 20.68%;
  width: 19.04%;
  height: 60.09%
}

.rnw-as-update .rnw-as-badge__right {
  position: absolute;
  right: 5.7%;
  top: 20.68%;
  width: 19.04%;
  height: 60.09%
}

.rnw-as-update .rnw-as-badge__text {
  position: absolute;
  inset: 23.2% 12% 8%;
  text-align: center;
  display: flex;
  align-items: center;
  flex-direction: column;
  letter-spacing: 0
}

.rnw-as-update .rnw-as-badge__text b {
  font-size: 21px;
  line-height: 1.3
}

.rnw-as-update .rnw-as-badge__text>span {
  font-size: 18px;
  line-height: 1.3;
  border-block: 1px solid #c9a96e;
  padding: 3px 8px;
  margin-top: 7px
}

.rnw-as-update .rnw-as-badge__text strong {
  font-family: "Times New Roman",serif;
  font-size: 83px;
  font-weight: 400;
  line-height: 1.05;
  white-space: nowrap
}

.rnw-as-update .rnw-as-badge__text small {
  font-size: 26px;
  font-weight: 700
}

.rnw-as-update .rnw-as-badge__text em {
  display: inline-block;
  width: 20px;
  font: 10px/1.1 "Noto Serif JP",serif;
  font-style: normal;
  white-space: normal
}

.rnw-as-update .rnw-as-badge__text sup {
  font-size: 10px;
  line-height: 1
}

.rnw-as-update .rnw-as-message {
  padding: 70px 24px 80px;
  display: flex;
  justify-content: center;
  background: linear-gradient(#ffdfe7,rgba(255,255,255,.4))
}

.rnw-as-update .rnw-as-message>p {
  padding: 40px min(7vw,100px);
  border-radius: 20px;
  background: #fff;
  color: #7d2c45;
  box-shadow: 0 0 12px #0000001a;
  font: bold clamp(24px,2.917vw,42px)/1.7 "Noto Serif JP",serif;
  text-align: center
}

.rnw-as-update .rnw-as-localnav {
  padding: 80px 24px;
  background: #fdf6f4;
  position: relative;
  z-index: 5
}

.rnw-as-update .rnw-as-localnav ul {
  max-width: 1100px;
  margin: auto;
  padding: 24px;
  border-radius: 20px;
  background: var(--as-pale);
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 20px 12px
}

.rnw-as-update .rnw-as-localnav a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #fff;
  border-radius: 8px;
  padding: 16px;
  color: #444;
  font-size: 18px;
  font-weight: 700;
  text-decoration: none;
  line-height: 1.8;
  gap: 8px
}

.rnw-as-update .rnw-as-localnav .rnw-icon {
  display: block;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  background: var(--as-main);
  mask: url('../../img/icon_arrow_circle.svg') center/contain no-repeat
}

.rnw-as-update .rnw-as-goals {
  display: grid;
  grid-template-columns: minmax(0,650fr) minmax(0,570fr);
  gap: 59px;
  padding: 120px max(5.5556vw,24px);
  background: linear-gradient(270deg,#fff 2%,#ffdfE797 19%,#f5b5c552 27%,#fff 37%)
}

.rnw-as-update .rnw-as-goals__photos {
  position: relative;
  aspect-ratio: 650.59/368.57
}

.rnw-as-update .rnw-as-goals__photos img {
  position: absolute;
  border-radius: 32px;
  object-fit: cover
}

.rnw-as-update .rnw-as-goals__photos img:first-child {
  width: 50.45%;
  height: 67.12%;
  inset: 0 auto auto 0;
  object-position: 40% 50%
}

.rnw-as-update .rnw-as-goals__photos img:last-child {
  width: 56%;
  height: 69.25%;
  right: 0;
  bottom: 0
}

.rnw-as-update .rnw-as-goals__body {
  max-width: 570px;
  justify-self: end;
  min-width: 0
}

.rnw-as-update .rnw-as-goals__panel {
  padding: 24px;
  background: #fff;
  border-radius: 20px;
  font-family: "Noto Serif JP",serif;
  color: #912344
}

.rnw-as-update .rnw-as-goals h2 {
  font: bold 32px/1.6 "Noto Serif JP",serif;
  color: #00429a;
  margin-bottom: 16px
}

.rnw-as-update .rnw-as-goals h3 {
  font: 600 24px/1.7 "Noto Serif JP",serif;
  color: #912344;
  margin-bottom: 16px
}

.rnw-as-update .rnw-as-goals li {
  font: bold 24px/1.6 "Noto Serif JP",serif;
  margin-top: 16px
}

.rnw-as-update .rnw-as-goals__copy {
  font: 600 14px/1.8 "Noto Serif JP",serif;
  color: #626262;
  margin-top: 20px
}

.rnw-as-update .rnw-as-features {
  padding: 80px 0 120px;
  background: #fff
}

.rnw-as-update .rnw-as-heading {
  position: relative;
  max-width: 1280px;
  margin: auto;
  height: auto;
  min-height: 0;
  aspect-ratio: 1280/530
}

.rnw-as-update .rnw-as-heading__photo {
  position: absolute;
  inset: 0 0 0 21.875%;
  border-radius: 8px;
  overflow: hidden
}

.rnw-as-update .rnw-as-heading__photo>img {
  height: 100%;
  width: 100%;
  object-fit: cover
}

.rnw-as-update .rnw-as-heading__card {
  position: absolute;
  left: 12.5%;
  top: 31.13%;
  display: flex;
  gap: 40px;
  align-items: center;
  justify-content: center;
  width: 400px;
  min-height: 200px;
  padding: 32px;
  background: var(--as-pale);
  border-radius: 8px;
  color: var(--as-main);
  font-size: 32px;
  line-height: 1.6
}

.rnw-as-update .rnw-as-heading__card>img {
  width: 84.44px;
  height: 80px;
  object-fit: contain;
  flex-shrink: 0
}

.rnw-as-update .rnw-as-heading__card>span {
  display: block;
  text-align: center
}

.rnw-as-update .rnw-as-heading__card small {
  display: block;
  font: 600 20px/1.3 Montserrat,sans-serif;
  letter-spacing: 3.7px;
  color: #bc326c;
  margin-bottom: 4px
}

.rnw-as-update .rnw-as-features__note {
  max-width: 1280px;
  margin: 4px auto 0!important;
  text-align: right;
  font-size: 10px;
  line-height: 1.6;
  padding-left: 20px
}

.rnw-as-update .rnw-as-feature-list {
  max-width: 1280px;
  margin: 80px auto 0;
  padding: 0;
  display: grid;
  gap: 80px
}

.rnw-as-update .rnw-as-feature {
  border: 1px solid var(--as-main);
  border-radius: 8px;
  background: #ffffffe6;
  overflow: hidden
}

.rnw-as-update .rnw-as-feature__main {
  padding: 56px 80px;
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,500px);
  gap: 24px 40px;
  align-content: start
}

.rnw-as-update .rnw-as-feature__main h3 {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  background: var(--as-pale);
  border: 1px solid var(--as-main);
  text-align: center;
  font-size: 24px;
  line-height: 1.6;
  color: var(--as-main);
  padding: 17px 16px
}

.rnw-as-update .rnw-as-feature__text {
  grid-column: 1;
  grid-row: 2;
  font-size: 18px;
  line-height: 1.8;
  font-weight: 600;
  align-self: start
}

.rnw-as-update .rnw-as-feature__photo {
  grid-column: 2;
  grid-row: 1/3;
  height: 300px;
  overflow: hidden
}

.rnw-as-update .rnw-as-feature__photo>img {
  width: 100%;
  height: 100%;
  object-fit: cover
}

.rnw-as-update .rnw-as-feature__iso {
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  height: 100%;
  padding: 24px
}

.rnw-as-update .rnw-as-feature__iso img {
  height: auto;
  width: 40%;
  max-height: 252px;
  object-fit: contain
}

.rnw-as-update .rnw-as-detail-toggle,.rnw-as-update .rnw-as-detail [data-rnw-details-close] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: var(--as-main);
  color: #fff;
  width: 100%;
  padding: 16px 8px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  min-height: 55px
}

.rnw-as-update .rnw-as-detail-toggle>span {
  display: block;
  width: 12px;
  height: 12px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  transform: translateY(-3px) rotate(45deg)
}

.rnw-as-update .rnw-as-feature-details[open]>.rnw-as-detail-toggle {
  display: none
}

.rnw-as-update .rnw-as-detail button:hover,.rnw-as-update .rnw-as-detail-toggle:hover {
  filter: brightness(.95)
}

.rnw-as-update .rnw-as-detail button:focus-visible,.rnw-as-update .rnw-as-detail-toggle:focus-visible,.rnw-as-update .rnw-as-localnav a:focus-visible {
  outline: 3px solid #bc326c;
  outline-offset: -3px
}

.rnw-reveal-ready .rnw-as--202610 .rnw-as-update [data-rnw-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .8s ease,transform .8s ease
}

.rnw-reveal-ready .rnw-as--202610 .rnw-as-update [data-rnw-reveal].is-revealed {
  opacity: 1;
  transform: none
}

.rnw-reveal-ready .rnw-as--202610 .rnw-as-update [data-as-heading] .rnw-as-heading__photo {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .8s ease,transform .8s ease
}

.rnw-reveal-ready .rnw-as--202610 .rnw-as-update [data-as-heading] .rnw-as-heading__card {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .8s .2s ease,transform .8s .2s ease
}

.rnw-reveal-ready .rnw-as--202610 .rnw-as-update [data-as-heading] .rnw-as-heading__card>img {
  opacity: 0;
  transition: opacity .6s .35s ease
}

.rnw-reveal-ready .rnw-as--202610 .rnw-as-update [data-as-heading] .rnw-as-heading__card>span {
  opacity: 0;
  transition: opacity .8s .5s ease
}

.rnw-reveal-ready .rnw-as--202610 .rnw-as-update [data-as-heading].is-revealed :is(.rnw-as-heading__photo,.rnw-as-heading__card,.rnw-as-heading__card>img,.rnw-as-heading__card>span) {
  opacity: 1;
  transform: none
}

@media(min-width:1441px) {
  .rnw-as-update .rnw-as-goals {
    padding-inline: max(calc((100% - 1280px)/2),24px)
  }

}

@media(min-width:768px) and (max-width:1320px) {
  .rnw-as-update .rnw-as-feature-list {
    margin-inline: 5.5556%
  }

  .rnw-as-update .rnw-as-feature__main {
    padding: 40px;
    grid-template-columns: 1fr 45%
  }

  .rnw-as-update .rnw-as-goals {
    gap: 32px
  }

  .rnw-as-update .rnw-as-goals h2 {
    font-size: 28px
  }

  .rnw-as-update .rnw-as-goals h3,.rnw-as-update .rnw-as-goals li {
    font-size: 20px
  }

  .rnw-as-update .rnw-as-heading {
    margin-inline: 5.5556%
  }

  .rnw-as-update .rnw-as-heading__card {
    width: 36%;
    min-height: 160px;
    padding: 24px;
    gap: 20px;
    font-size: 26px
  }

  .rnw-as-update .rnw-as-heading__card>img {
    width: 64px;
    height: 60px
  }

}

@media(max-width:767px) {
  .rnw-as-update .rnw-as-only-pc {
    display: none!important
  }

  .rnw-as-update .rnw-as-only-sp {
    display: initial
  }

  .rnw-as-update :where(section[id]) {
    scroll-margin-top: calc(var(--rnw-header-h-sp,59px) + 110px)
  }

  .rnw-as-update .rnw-as-hero {
    height: auto;
    aspect-ratio: 375 / 475;
    max-height: calc(100svh - var(--rnw-header-h-sp) - 20px - 12px * 1.8 - 48.51px);
    min-height: 0;
    background: #fff;
  }

  .rnw-as-update .rnw-as-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(#ffdfe7 70%, #ffe8f166);
  }

  @media (prefers-reduced-motion: no-preference) {
    .rnw-as-update .rnw-as-hero::before {
      animation: rnw-mv-fade 1.4s ease 1.8s both;
    }
  }

  .rnw-as-update .rnw-as-hero picture {
    width: 100%;
    height: auto;
    aspect-ratio: 375 / 333;
    max-height: calc(100% - 142px);
    inset: 0 0 auto
  }

  .rnw-as-update .rnw-as-hero__image {
    width: 149.45%;
    max-width: none;
    height: auto;
    position: absolute;
    left: -27.35%;
    object-fit: cover
  }

  .rnw-as-update .rnw-as-hero picture::after {
    content: none;
  }

  .rnw-as-update .rnw-as-hero__title {
    left: 40px;
    bottom: 24px;
    z-index: 2;
    color: var(--as-main);
    filter: none;
    font-family: var(--rnw-font-jp)
  }

  .rnw-as-update .rnw-as-hero__title p {
    font-size: 14px;
    line-height: 1.8;
    margin-bottom: 0;
    font-weight: 600
  }

  .rnw-as-update .rnw-as-hero__title h1 {
    font-size: 32px;
    line-height: 1.3;
    letter-spacing: 1.2px
  }

  .rnw-as-update .rnw-as-badge {
    width: 150px;
    height: 150px;
    top: auto;
    right: 16px;
    bottom: 122px
  }

  .rnw-as-update .rnw-as-badge__text b {
    font-size: 12.767px
  }

  .rnw-as-update .rnw-as-badge__text>span {
    font-size: 10.803px;
    margin-top: 4px;
    padding: 2px 5px
  }

  .rnw-as-update .rnw-as-badge__text strong {
    font-size: 50px
  }

  .rnw-as-update .rnw-as-badge__text small {
    font-size: 15.7px
  }

  .rnw-as-update .rnw-as-badge__text em {
    font-size: 5.89px;
    width: 12px
  }

  .rnw-as-update .rnw-as-badge__text sup {
    font-size: 9px
  }

  .rnw-as-update .rnw-as-message {
    display: none
  }

  .rnw-as-update .rnw-as-localnav {
    padding: 32px 16px 56px;
    background: #fff
  }

  .rnw-as-update .rnw-as-localnav ul {
    padding: 16px;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px;
    border-radius: 8px
  }

  .rnw-as-update .rnw-as-localnav a {
    font-size: 14px;
    padding: 12px 8px;
    min-height: 49px
  }

  .rnw-as-update .rnw-as-goals {
    display: block;
    padding: 0 0 56px;
    background: #fff;
    min-height: 765px
  }

  .rnw-as-update .rnw-as-goals__photos {
    display: grid;
    grid-template-columns: 47.39fr 52.61fr;
    gap: 0;
    aspect-ratio: 375/123.4;
    width: 100%
  }

  .rnw-as-update .rnw-as-goals__photos img {
    position: static;
    display: block;
    min-width: 0;
    margin: 0;
    transform: none;
    box-shadow: none;
    border-radius: 0;
    height: 100%!important;
    top: 0;
    bottom: auto!important
  }

  .rnw-as-update .rnw-as-goals__photos img:first-child {
    width: 100%
  }

  .rnw-as-update .rnw-as-goals__photos img:last-child {
    width: 100%
  }

  .rnw-as-update .rnw-as-goals__body {
    position: relative;
    max-width: none;
    width: calc(100% - 32px);
    margin: -30px auto 0
  }

  .rnw-as-update .rnw-as-goals__panel {
    padding: 32px 20px;
    background: #ffffffe6;
    border-radius: 4px;
    box-shadow: 0 8px 54px #00000014;
    color: #626262
  }

  .rnw-as-update .rnw-as-goals h2 {
    font: 700 24px/1.6 var(--rnw-font-jp);
    color: var(--as-main);
    margin-bottom: 4px
  }

  .rnw-as-update .rnw-as-goals h3 {
    font-size: 20px;
    color: #912344;
    margin-bottom: 16px
  }

  .rnw-as-update .rnw-as-goals__sp-copy {
    display: block;
    font: 600 14px/1.6 "Noto Serif JP",serif
  }

  .rnw-as-update .rnw-as-goals ul {
    border-block: 1px solid #e2e2e2;
    margin-top: 16px;
    padding: 16px 0;
    display: grid;
    gap: 8px
  }

  .rnw-as-update .rnw-as-goals li {
    position: relative;
    font-size: 16px;
    margin: 0;
    border-left: 0;
    padding-left: 12px;
    line-height: 1.6
  }

  .rnw-as-update .rnw-as-goals li::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 2px;
    height: 26px;
    transform: translateY(-50%);
    background: linear-gradient(to bottom, #f3f5f6, #29846f);
  }

  .rnw-as-update .rnw-as-features {
    padding: 0 0 56px
  }

  .rnw-as-update .rnw-as-heading {
    aspect-ratio: auto;
    min-height: 0;
    display: flex;
    flex-direction: column
  }

  .rnw-as-update .rnw-as-heading__photo {
    position: relative;
    inset: auto;
    height: 200px;
    width: 100%;
    border-radius: 0
  }

  .rnw-as-update .rnw-as-heading__card {
    position: relative;
    left: auto;
    top: auto;
    min-height: 0;
    width: calc(100% - 32px);
    margin: -40px 16px 0;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    border-radius: 20px;
    font-size: 24px
  }

  .rnw-as-update .rnw-as-heading__card>img {
    width: 42.22px;
    height: 40px
  }

  .rnw-as-update .rnw-as-heading__card small {
    font-size: 12px
  }

  .rnw-as-update .rnw-as-feature-list {
    margin: 56px 16px 0;
    gap: 32px
  }

  .rnw-as-update .rnw-as-feature {
    border-radius: 0
  }

  .rnw-as-update .rnw-as-feature__main {
    display: flex;
    flex-direction: column;
    padding: 0;
    gap: 0
  }

  .rnw-as-update .rnw-as-feature__main h3 {
    width: 100%;
    border-width: 0 0 1px;
    padding: 17px 20px;
    font-size: 20px;
    line-height: 1.6;
    order: 0
  }

  .rnw-as-update .rnw-as-feature:first-child h3 {
    font-size: 18px;
    line-height: 1.8
  }

  .rnw-as-update .rnw-as-feature__photo {
    width: calc(100% - 32px);
    height: 200px;
    margin: 16px 16px 0;
    order: 1
  }

  .rnw-as-update .rnw-as-feature__text {
    padding: 16px;
    font-size: 14px;
    line-height: 1.8;
    order: 2
  }

  .rnw-as-update .rnw-as-feature__iso {
    padding: 20px;
    gap: 14px
  }

  .rnw-as-update .rnw-as-feature__iso img {
    width: auto;
    max-width: 44%;
    height: 153px
  }

}

@media(prefers-reduced-motion:reduce) {
  .rnw-reveal-ready .rnw-as--202610 .rnw-as-update [data-rnw-reveal],.rnw-reveal-ready .rnw-as--202610 .rnw-as-update [data-as-heading] * {
    opacity: 1!important;
    transform: none!important;
    transition: none!important
  }

}

.rnw-as-update .rnw-as-close-caret {
  width: 10px;
  height: 10px;
  border-left: 2px solid;
  border-top: 2px solid;
  transform: translateY(3px) rotate(45deg)
}

@media(max-width:767px) {
  .rnw-as-update .rnw-as-localnav {
    padding: 44px 24px
  }

  .rnw-as-update .rnw-as-localnav ul {
    padding: 24px 16px;
    gap: 20px 12px
  }

  .rnw-as-update .rnw-as-localnav a {
    font-size: 12px;
    min-height: 56px;
    line-height: 1.3;
    padding: 16px
  }

  .rnw-as-update .rnw-as-hero picture::after {
    z-index: 1
  }

  .rnw-as-update .rnw-as-hero__image {
    max-width: none!important;
    width: 149.45%!important
  }

  .rnw-as-update .rnw-as-goals__photos {
    overflow: hidden
  }

}

.rnw-as-update .rnw-as-close-caret {
  display: block;
  width: 24px;
  height: 12px;
  border: 0;
  transform: none;
  position: relative
}

.rnw-as-update .rnw-as-close-caret img {
  position: absolute;
  left: 6px;
  top: -6px;
  width: 12px;
  height: 24px;
  transform: rotate(-90deg)
}

.rnw-as-update .rnw-as-detail-toggle>span {
  display: block;
  position: relative;
  width: 24px;
  height: 12px;
  border: 0;
  transform: none
}

.rnw-as-update .rnw-as-detail-toggle>span img {
  position: absolute;
  left: 6px;
  top: -6px;
  width: 12px;
  height: 24px;
  transform: rotate(90deg)
}

/* The updated feature heading remains a block inside the legacy page shell. */
.rnw-as-update .rnw-as-features {
  display: block
}

.rnw-as-update .rnw-as-hero__title h1 {
  color: inherit
}

/* Section boundaries use the existing wave geometry as images so file previews
and WordPress render the same shape without local-file mask restrictions. */
.rnw-as-schedule {
  background-color: #fff
}

.rnw-as-schedule>.rnw-as-wave,.rnw-as-survey>.rnw-as-wave {
  -webkit-mask-image:none;
  mask-image: none;
  background: none;
  overflow: hidden;
  flex-shrink: 0;
}

.rnw-as-schedule>.rnw-as-wave>picture,.rnw-as-survey>.rnw-as-wave>picture {
  display: block;
  width: 100%;
  height: 100%
}

.rnw-as-schedule>.rnw-as-wave>picture>img,.rnw-as-survey>.rnw-as-wave>picture>img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none
}

/* Parents voices follow the updated Figma design; only the boundary keeps the existing circular arc. */
.rnw-as-parents {
  position: relative;
  background: #fff;
  padding: 160px 24px 120px;
  border-radius: 50% 50% 0 0/160px 160px 0 0;
  margin-top: -1px
}

.rnw-as-parents::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 160px;
  background: var(--as-pale);
  z-index: -1
}

.rnw-as-parents__body>h2 {
  text-align: center;
  color: var(--as-main);
  font-family: var(--rnw-font-educare-title, sans-serif);
  font-weight: 700;
  font-size: 32px;
  line-height: 1.6
}

.rnw-as-parents__body>h2>small {
  display: block;
  font: 600 20px/1.3 Montserrat,sans-serif;
  letter-spacing: 3.7px;
  color: #bc326c;
  margin-bottom: 4px
}

.rnw-as-parents__intro {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 32px auto 80px;
  max-width: 603px
}

.rnw-as-parents__intro>p {
  font-size: 18px;
  line-height: 1.8;
  font-weight: 600;
  flex: 1
}

.rnw-as-parents__meter {
  position: relative;
  width: 200px;
  height: 200px;
  flex-shrink: 0;
  color: #00429a;
  text-align: center
}

.rnw-as-parents__meter>img {
  position: absolute;
  inset: 0;
  width: 200px;
  height: 200px
}

.rnw-as-parents__meter>span {
  position: absolute;
  inset: 47px 0 auto;
  font-family: var(--rnw-font-educare-title, sans-serif);
  font-size: 16px;
  font-weight: 700
}

.rnw-as-parents__meter>b {
  position: absolute;
  top: 39.17px;
  left: 40px;
  display: flex;
  align-items: baseline;
  gap: 4px;
  font: 700 79.167px/1.8 var(--rnw-font-educare-title, sans-serif);
  letter-spacing: -4.8333px;
}

.rnw-as-parents__meter small {
  font-family: inherit;
  font-size: 25.833px;
  font-weight: inherit;
  line-height: 1;
  letter-spacing: 0;
}

.rnw-as-parents__meter sup {
  position: absolute;
  left: 88px;
  top: 155px;
  font-size: 10px;
  color: #444
}

.rnw-as-parents__cards {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 40px;
  max-width: 1200px;
  margin: auto
}

.rnw-as-parents__cards article {
  background: #fff;
  padding: 24px 16px;
  box-shadow: 0 4px 28px #00000014;
  border-radius: 0 0 20px 20px
}

.rnw-as-parents__cards h3 {
  display: flex;
  gap: 4px;
  color: #00429a;
  font-size: 24px;
  line-height: 1.6;
  border-bottom: 1px solid #d8a0b5;
  padding-bottom: 12px;
  margin-bottom: 12px
}

.rnw-as-parents__cards h3>img {
  width: 25px;
  height: 25px;
  flex-shrink: 0;
  margin-top: 8px
}

.rnw-as-parents__cards p {
  font-size: 14px;
  line-height: 1.8;
  font-weight: 600
}

@media(max-width:767px) {
  .rnw-as-parents {
    padding: 89px 24px 56px;
    border-radius: 50% 50% 0 0/89px 89px 0 0
  }

  .rnw-as-parents__body>h2 {
    font-size: 24px
  }

  .rnw-as-parents__body>h2>small {
    font-size: 12px
  }

  .rnw-as-parents__intro {
    flex-direction: column;
    margin: 16px auto;
    gap: 20px
  }

  .rnw-as-parents__intro>p {
    font-size: 18px
  }

  .rnw-as-parents__intro>p br {
    display: none
  }

  .rnw-as-parents__cards {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px
  }

  .rnw-as-parents__cards article {
    min-height: 246px
  }

  .rnw-as-parents__cards h3 {
    font-size: 20px;
    line-height: 1.6
  }

  .rnw-as-parents__cards p {
    font-size: 12px;
    line-height: 1.8
  }

}

.rnw-as-parents {
  --as-main: #29846f;
  --as-pale: #eaf9f6;
  padding: 0;
  border-radius: 0;
  margin: 0;
  background: #eaf9f6;
  letter-spacing: 1.2px;
  scroll-margin-top: var(--rnw-header-h-pc)
}

.rnw-as-parents::before {
  content: none
}

.rnw-as-parents__wave {
  height: 160px;
  width: 100%;
  overflow: hidden
}

.rnw-as-parents__wave picture,.rnw-as-parents__wave img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none
}

.rnw-as-parents__body {
  padding: 80px 24px 120px;
  background: #fff
}

.rnw-as-parents__sp {
  display: none
}

.rnw-reveal-ready .rnw-as--202610 .rnw-as-parents [data-rnw-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .8s ease,transform .8s ease
}

.rnw-reveal-ready .rnw-as--202610 .rnw-as-parents [data-rnw-reveal].is-revealed {
  opacity: 1;
  transform: none
}

@media(max-width:767px) {
  .rnw-as-parents__wave {
    height: auto;
    aspect-ratio: 375/89.3064
  }

  .rnw-as-parents__body {
    padding: 0 24px 56px
  }

  .rnw-as-parents__pc {
    display: none
  }

  .rnw-as-parents__sp {
    display: initial
  }

}

@media(prefers-reduced-motion:reduce) {
  .rnw-reveal-ready .rnw-as--202610 .rnw-as-parents [data-rnw-reveal] {
    opacity: 1;
    transform: none;
    transition: none
  }

}

.rnw-as-parents__body>h2,.rnw-as-parents__cards h3 {
  font-family: var(--rnw-font-educare-title,var(--rnw-font-jp));
  font-weight: 700
}

/* Match the existing native details/summary pattern used by the nursery page. */
.rnw-as-update summary.rnw-as-detail-toggle {
  list-style: none;
  cursor: pointer;
  font-family: var(--rnw-font-jp)
}

.rnw-as-update summary.rnw-as-detail-toggle::-webkit-details-marker {
  display: none
}

/* Explicit states and class-based close links survive fixed-page editor changes. */
.rnw-as-update .rnw-as-feature-details:not([open])>.rnw-as-detail,.rnw-as-update .rnw-as-detail {
  display: none
}

.rnw-as-update .rnw-as-feature-details[open]>.rnw-as-detail,.rnw-as-update .rnw-as-detail.is-open {
  display: block
}

.rnw-as-update .rnw-as-feature-details[open]>.rnw-as-detail-toggle,.rnw-as-update .rnw-as-detail-toggle.is-open {
  display: none
}

.rnw-as-update .rnw-as-detail a.rnw-as-detail-close {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  min-height: 55px;
  margin: 0;
  padding: 16px 8px;
  border: 0;
  border-radius: 0;
  background: #29846f;
  color: #fff;
  font: 700 18px/1.3 var(--rnw-font-jp);
  letter-spacing: 1.2px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

.rnw-as-update .rnw-as-detail a.rnw-as-detail-close:hover {
  color: #fff;
  filter: brightness(.95)
}

.rnw-as-update .rnw-as-detail a.rnw-as-detail-close:focus-visible {
  outline: 3px solid #bc326c;
  outline-offset: -3px
}

/* =====================================================================
詳細コンテンツ共通
本文は意味のある見出し・カード・リストで構成する。
開閉は既存の details/summary と front.js が担当する。
===================================================================== */
.rnw-as-update .rnw-as-detail-section {
  padding: 80px;
  background: #faf7f2;
  font-family: var(--rnw-font-jp);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.8;
  letter-spacing: 1.2px;
  color: #444;
}

.rnw-as-update .rnw-as-detail-header {
  display: grid;
  gap: 12px;
}

.rnw-as-update .rnw-as-detail-title {
  margin: 0;
  color: var(--as-main);
  font-family: var(--rnw-font-educare-title, var(--rnw-font-jp));
  font-size: 24px;
  font-weight: 700;
  line-height: 1.6;
  text-align: center;
}

.rnw-as-update .rnw-as-detail-bar {
  margin: 0;
  padding: 16px 24px;
  border-radius: 4px;
  background: var(--as-main);
  color: #fff;
  font: 700 18px/1.3 var(--rnw-font-jp);
  text-align: center;
}

.rnw-as-update .rnw-as-detail-caption {
  font-size: 12px;
  line-height: 1.3;
}

.rnw-as-update .rnw-as-detail-copy--sp {
  display: none;
}

/* アプローチ：PCは書籍と3要素を左右に配置する。 */
.rnw-as-update .rnw-as-approach-detail {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas: "header header" "book elements";
  gap: 40px;
}

.rnw-as-update .rnw-as-approach-detail .rnw-as-detail-header {
  grid-area: header;
  gap: 20px;
}

.rnw-as-update .rnw-as-approach-detail__intro {
  text-align: center;
}

.rnw-as-update .rnw-as-approach-detail__book {
  grid-area: book;
  display: block;
  width: 100%;
  aspect-ratio: 1;
}

.rnw-as-update .rnw-as-approach-detail__book img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rnw-as-update .rnw-as-approach-detail__elements {
  grid-area: elements;
  display: grid;
  align-content: start;
  gap: 16px;
}

.rnw-as-update .rnw-as-approach-detail__elements .rnw-as-detail-bar {
  text-align: left;
}

.rnw-as-update .rnw-as-approach-detail__list {
  display: grid;
  gap: 12px;
}

.rnw-as-update .rnw-as-approach-detail__list li {
  display: grid;
  gap: 12px;
}

.rnw-as-update .rnw-as-approach-detail__list h6 {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  margin: 0;
  color: var(--as-main);
  font: 700 20px/1.6 var(--rnw-font-jp);
}

.rnw-as-update .rnw-as-approach-detail__number {
  flex: none;
  background: linear-gradient(#f3f5f6, var(--as-main) 52.4%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-size: 34px;
  line-height: 1.3;
}

/* 学術連携：カードは大学名、説明、研修実績の3要素で構成する。 */
.rnw-as-update .rnw-as-research-detail {
  display: grid;
  gap: 40px;
  background: #fff;
}

.rnw-as-update .rnw-as-research-detail__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 40px;
}

.rnw-as-update .rnw-as-university-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  border-radius: 0 0 20px 20px;
  background: #fff;
  box-shadow: 0 4px 28px #00000014;
}

.rnw-as-update .rnw-as-university-card h6 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  color: var(--as-main);
  font: 600 20px/1.8 var(--rnw-font-jp);
}

.rnw-as-update .rnw-as-university-card h6 img {
  width: 50px;
  height: 35px;
  object-fit: cover;
  flex-shrink: 0;
}

.rnw-as-update .rnw-as-university-card__description {
  text-align: center;
}

.rnw-as-update .rnw-as-university-card__history {
  display: grid;
  gap: 8px;
  font-size: 12px;
}

.rnw-as-update .rnw-as-university-card__history li {
  margin-left: 18px;
  list-style: disc;
}

.rnw-as-update .rnw-as-university-card__year {
  display: table;
  padding: 4px 16px;
  border-radius: 8px;
  background: #faf7f2;
  font: 700 12px/1.3 var(--rnw-font-jp);
}

.rnw-as-update .rnw-as-research-detail>.rnw-as-detail-caption {
  text-align: center;
}

/* SDGs：アイコン群と写真群を分け、写真を内容ごとに並べる。 */
.rnw-as-update .rnw-as-sdgs-detail {
  display: grid;
  gap: 16px;
}

.rnw-as-update .rnw-as-sdgs-detail__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px 16px;
}

.rnw-as-update .rnw-as-sdgs-card {
  display: grid;
  align-content: start;
  gap: 16px;
}

.rnw-as-update .rnw-as-sdgs-card__media {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  max-width: 500px;
  margin: auto;
}

.rnw-as-update .rnw-as-sdgs-card__icons {
  display: flex;
  gap: 12px;
  flex-shrink: 0;
}

.rnw-as-update .rnw-as-sdgs-card__icons picture {
  display: block;
  width: 80px;
  height: 80px;
}

.rnw-as-update .rnw-as-sdgs-card__icons img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.rnw-as-update .rnw-as-sdgs-card__photos {
  display: flex;
  flex: 1;
  min-width: 0;
}

.rnw-as-update .rnw-as-sdgs-card__photos picture {
  display: block;
  flex: 1;
  min-width: 0;
  height: 90.805px;
}

.rnw-as-update .rnw-as-sdgs-card__photos img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* グローバル教育：概念図の横にPC用の説明を配置する。 */
.rnw-as-update .rnw-as-competence-detail {
  display: grid;
  grid-template-columns: minmax(0, 600fr) minmax(0, 480fr);
  grid-template-areas: "title title" "image copy";
  gap: 40px;
}

.rnw-as-update .rnw-as-competence-detail .rnw-as-detail-title {
  grid-area: title;
}

.rnw-as-update .rnw-as-competence-detail__image {
  grid-area: image;
  display: block;
  width: 100%;
  aspect-ratio: auto;
}

.rnw-as-update .rnw-as-competence-detail__image img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.rnw-as-update .rnw-as-competence-detail>.rnw-as-detail-copy--pc, .rnw-as-update .rnw-as-competence-detail>.rnw-as-detail-copy--sp {
  grid-area: copy;
}

.rnw-as-update .rnw-as-world-detail {
  display: none;
}

.rnw-as-update .rnw-as-english-detail {
  display: grid;
  gap: 16px;
  background: #fff;
}

.rnw-as-update .rnw-as-detail-gallery {
  display: flex;
  gap: 40px;
  margin-top: 24px;
}

.rnw-as-update .rnw-as-detail-gallery>picture {
  display: block;
  flex: 1;
  min-width: 0;
  height: 250px;
}

.rnw-as-update .rnw-as-detail-gallery>picture>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* タブレット：文章が狭い列に押し込まれないよう、内容単位で縦に流す。 */
@media (min-width: 768px) and (max-width: 1100px) {
  .rnw-as-update .rnw-as-detail-section {
    padding: 48px 32px;
  }

  .rnw-as-update .rnw-as-approach-detail {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "header" "book" "elements";
  }

  .rnw-as-update .rnw-as-approach-detail__book {
    max-width: 500px;
    margin: auto;
  }

  .rnw-as-update .rnw-as-research-detail__cards, .rnw-as-update .rnw-as-sdgs-detail__grid {
    grid-template-columns: minmax(0, 1fr);
  }

}

/* スマートフォン：Figmaの掲載順に、書籍→説明→3要素へ切り替える。
ワールドツアーズと英語教育の文章も、スマートフォン用を表示する。 */
@media (max-width: 767px) {
  .rnw-as-update .rnw-as-detail-section {
    padding: 24px 16px;
    font-size: 14px;
  }

  .rnw-as-update .rnw-as-detail-title {
    font-size: 20px;
  }

  .rnw-as-update .rnw-as-detail-bar {
    padding: 16px;
    font-size: 14px;
  }

  .rnw-as-update .rnw-as-detail-copy--pc {
    display: none;
  }

  .rnw-as-update .rnw-as-detail-copy--sp {
    display: block;
  }

  .rnw-as-update .rnw-as-approach-detail {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "title" "book" "intro" "elements";
    gap: 12px;
  }

  .rnw-as-update .rnw-as-approach-detail .rnw-as-detail-header {
    display: contents;
  }

  .rnw-as-update .rnw-as-approach-detail .rnw-as-detail-title {
    grid-area: title;
  }

  .rnw-as-update .rnw-as-approach-detail__intro {
    grid-area: intro;
    text-align: left;
  }

  .rnw-as-update .rnw-as-approach-detail__book {
    aspect-ratio: 279/180;
  }

  .rnw-as-update .rnw-as-approach-detail__elements {
    gap: 16px;
  }

  .rnw-as-update .rnw-as-approach-detail__list h6 {
    font-size: 18px;
  }

  .rnw-as-update .rnw-as-approach-detail__number {
    font-size: 28px;
  }

  .rnw-as-update .rnw-as-research-detail {
    gap: 16px;
  }

  .rnw-as-update .rnw-as-research-detail__cards {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    margin: 0 16px;
  }

  .rnw-as-update .rnw-as-university-card h6 {
    font-size: 18px;
  }

  .rnw-as-update .rnw-as-sdgs-detail__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }

  .rnw-as-update .rnw-as-sdgs-card__media {
    flex-direction: column;
    gap: 4px;
  }

  .rnw-as-update .rnw-as-sdgs-card__photos {
    width: 100%;
    flex: none;
  }

  .rnw-as-update .rnw-as-competence-detail {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "title" "image" "copy";
    gap: 12px;
  }

  .rnw-as-update .rnw-as-world-detail {
    display: grid;
    gap: 16px;
    background: #fff;
  }

  .rnw-as-update .rnw-as-english-detail {
    background: #faf7f2;
  }

  .rnw-as-update .rnw-as-detail-gallery {
    flex-direction: column;
    gap: 4px;
    margin-top: 0;
  }

  .rnw-as-update .rnw-as-detail-gallery>img, .rnw-as-update .rnw-as-detail-gallery>picture {
    width: 100%;
    height: 250px;
    flex: none;
    object-fit: cover;
  }

}

/* スマートフォンでは画像の元サイズに引っ張られず、グリッド内に収める。 */
.rnw-as-update .rnw-as-sdgs-detail,
.rnw-as-update .rnw-as-sdgs-card {
  min-width: 0;
}

/* カードの罫線画像を直接配置し、装飾だけのラッパーを増やさない。 */

.rnw-as-update .rnw-as-university-card__divider {
  display: block;
  width: 100%;
  height: 1px;
}


/* エデュケア目標：メインメッセージと説明文の可読性、学童の配色。 */
.rnw-as-update .rnw-as-goals {
  background: linear-gradient(270deg, #fff 2%, var(--as-pale) 19%, #eaf9f680 27%, #fff 37%);
}

.rnw-as-update .rnw-as-goals h2,
.rnw-as-update .rnw-as-goals li {
  color: var(--as-main);
}

.rnw-as-update .rnw-as-goals h3 {
  color: #333;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.6;
}

.rnw-as-update .rnw-as-goals__copy,
.rnw-as-update .rnw-as-goals__sp-copy {
  font-size: 16px;
  line-height: 1.8;
  overflow-wrap: anywhere;
}

@media (max-width: 767px) {
  .rnw-as-update .rnw-as-goals h3 {
    font-size: 22px;
  }
}

@media (max-width: 767px) {
  .rnw-as-update .rnw-as-goals__sp-copy {
    font-size: 15px;
    font-weight: 500;
  }
}