@charset "UTF-8";
/* ==========================================================================
   components.css ── 全ページで使う部品
   ボタン／ロゴ／見出しのかたまり／マーカー／記事カード／NEWS／「左から開く」動き
   ========================================================================== */

/* ---- ロゴ（文字） ---- */
.pw-logo { display: inline-flex; flex-direction: column; align-items: center; gap: 8px; color: var(--pw-color-text); }
.pw-logo__en {
	font-family: var(--pw-font-en); font-weight: 500; font-size: 32px; line-height: 24px;
	letter-spacing: .125em; color: var(--pw-color-logo); white-space: nowrap;
	margin-right: -.125em;               /* 末尾の字間ぶんを詰める（Figma の箱の幅 188 に合わせる） */
}
.pw-logo__ja { font-size: 10px; line-height: 12px; letter-spacing: .2em; margin-right: -.2em; white-space: nowrap; }
.pw-logo--white, .pw-logo--white .pw-logo__en { color: var(--pw-color-white); }

/* ---- 英字の小見出し・見出し・リード ---- */
.pw-eyebrow {
	font-family: var(--pw-font-en); font-weight: 500; font-size: 14px; line-height: 25px;
	letter-spacing: .06em; color: var(--pw-color-primary);
}
.pw-h2 { font-size: 26px; font-weight: 500; line-height: 47px; color: var(--pw-color-text); }
.pw-lead { font-size: 14px; line-height: 25px; letter-spacing: .16em; color: var(--pw-color-text); }
.pw-heading { display: flex; flex-direction: column; gap: 16px; }
.pw-heading--center { align-items: center; text-align: center; }
.pw-heading--center .pw-heading__title { display: flex; flex-direction: column; align-items: center; }
.pw-heading--white :where(.pw-eyebrow, .pw-h2, .pw-lead) { color: var(--pw-color-white); }
/* PC のリード文は Figma の改行（<br>）だけで折り返す。ブラウザは末尾の字間を幅に数えるため、Figma の箱の幅ちょうどだと1文字分はみ出して折り返してしまう */
@media (min-width: 1025px) { .pw-heading .pw-lead, .pw-contact-band__lead { white-space: nowrap; } }

/* 背景の大きな英字 */
.pw-bgword {
	font-family: var(--pw-font-en); font-weight: 500; font-size: 96px; line-height: 173px;
	letter-spacing: .06em; text-align: center; white-space: nowrap; user-select: none; pointer-events: none;
}

/* ---- マーカー（黄色の手描きの線）。文字の下端に、文字の「後ろ」に重ねる（Figma と同じ重なり順） ---- */
.pw-marker { position: relative; z-index: 0; display: inline-block; padding-bottom: 5px; }
.pw-marker::after {
	content: ""; position: absolute; z-index: -1; left: 0; right: 0; bottom: 0; height: 15px;
	background: url(../img/marker_why.svg) no-repeat center / 100% 100%;
	pointer-events: none;
}
.pw-marker--contact { padding-bottom: 10px; }
.pw-marker--contact::after { height: 20px; background-image: url(../img/marker_contact.svg); }
.pw-marker--concern { padding-bottom: 15px; }
.pw-marker--concern::after { height: 31px; background-image: url(../img/marker_concern.svg); }

/* ---- ボタン ---- */
.pw-btn {
	display: inline-flex; align-items: center; gap: 16px;
	height: 64px; padding: 0 16px; border-radius: 4px;
	font-size: 16px; line-height: 29px; color: var(--pw-color-white);
	background: var(--pw-btn-bg); white-space: nowrap;
	--pw-btn-bg: var(--pw-color-primary); --pw-btn-dark: var(--pw-color-primary-dark);
}
.pw-btn:link, .pw-btn:visited { color: var(--pw-color-white); }
.pw-btn--accent { --pw-btn-bg: var(--pw-color-accent); --pw-btn-dark: var(--pw-color-accent-dark); }
.pw-btn--line { --pw-btn-bg: var(--pw-color-line); --pw-btn-dark: var(--pw-color-line-dark); gap: 8px; padding: 0 18px 0 16px; }
.pw-btn__label { flex: 1 1 auto; min-width: 122px; }
/* 文字をボタン全体の左右中央に置く（2026-10-02 大浦さん「文字が左右中央にない」PC・SP とも）。
   Figma は矢印（30）＋間（16）の左側で中央＝ボタン中央より 23px 左。反対側に同じ 46px の空き（::before）を置いて対称にする。
   空きは flex-shrink で縮むので、固定幅のボタン（フォトギャラリー 307・事例 238）でも文字ははみ出さない（そのときだけ中央から少しずれる） */
.pw-btn:not(.pw-btn--line)::before { content: ""; flex: 0 1 auto; width: 46px; min-width: 0; margin-right: -16px; }   /* 幅は width で明示（flex-basis だけだと中身で幅が決まるボタンで 0 に潰れる）。間 16 は負のマージンで打ち消す＝実質 30（矢印と同じ） */
.pw-btn--back:not(.pw-btn--line)::before { margin-right: 0; margin-left: -16px; }
.pw-btn:not(.pw-btn--line) { max-width: 100%; }   /* 空きのぶん広がったボタンが親の幅を超えない（超えるときは空きが縮む） */   /* 戻るボタンは並びが逆（row-reverse） */
.pw-btn:not(.pw-btn--line) .pw-btn__label { flex: 1 0 auto; min-width: 76px; text-align: center; }   /* 76＋46＝旧 122：ボタンの最小幅 200 を保つ */
.pw-btn--insta .pw-btn__body { justify-content: center; }   /* アイコン＋文字のまとまりを中央に */
.pw-btn--insta .pw-btn__label { flex: 0 0 auto; min-width: 0; }
.pw-btn--line .pw-btn__label { flex: 0 0 auto; min-width: 0; }
.pw-btn__body { display: inline-flex; align-items: center; gap: 8px; flex: 1 1 auto; }
.pw-btn__line { width: 34px; height: 34.07px; flex: none; }
.pw-btn--block { display: flex; width: 100%; }
.pw-btn--center .pw-btn__label { text-align: center; }
.pw-btn--block.pw-btn--line .pw-btn__body { justify-content: center; }

/* 矢印の箱（幅30×高さ16）。ホバーで箱が白、矢印が濃い色になり、矢印が右へ抜けて左から入る */
.pw-btn__arrow {
	position: relative; flex: none; width: 30px; height: 16px; border-radius: 2px; overflow: hidden;
	background: var(--pw-btn-dark); color: var(--pw-color-white);
	transition: background-color var(--pw-time-hover) var(--pw-ease-io), color var(--pw-time-hover) var(--pw-ease-io);
}
.pw-btn__arrow-icon, .pw-btn__arrow::after {
	position: absolute; left: 50%; top: 50%; width: 10px; height: 6px; margin: -3px 0 0 -5px;
}
.pw-btn__arrow::after {
	content: ""; background: currentColor;
	-webkit-mask: url(../img/arrow_button.svg) no-repeat center / 10px 6px; mask: url(../img/arrow_button.svg) no-repeat center / 10px 6px;
	translate: -30px 0;
}
@media (hover: hover) {
	:is(.pw-btn, .pw-navbtn):hover .pw-btn__arrow { background: var(--pw-color-white); color: var(--pw-btn-dark); }
	:is(.pw-btn, .pw-navbtn):hover .pw-btn__arrow-icon { translate: 30px 0; transition: translate var(--pw-time-hover) var(--pw-ease-io); }
	:is(.pw-btn, .pw-navbtn):hover .pw-btn__arrow::after { translate: 0 0; transition: translate var(--pw-time-hover) var(--pw-ease-io); }
}

/* ---- NEWS（TOP の FV） ---- */
.pw-news { display: flex; flex-direction: column; align-items: flex-start; }
.pw-news__label {
	padding: 0 24px; font-family: var(--pw-font-en); font-weight: 500; font-size: 14px; line-height: 25px;
	letter-spacing: .06em; color: var(--pw-color-primary);
}
.pw-news__box {
	display: flex; align-items: center; gap: 16px; width: 100%; margin-top: -6px; padding: 8px 24px;
	border-radius: 4px; background: var(--pw-color-bg-yellowgreen);
}
.pw-news__text { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.pw-news__date { font-size: 12px; line-height: 22px; color: var(--pw-color-primary); }
.pw-news__title { font-size: 14px; line-height: 25px; color: var(--pw-color-text); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }   /* 長い題名でも2行まで（FV の高さを保つ） */
.pw-news__arrow {
	position: relative; flex: none; width: 40px; height: 24px; border-radius: 2px; overflow: hidden;
	display: grid; place-items: center;
	background: var(--pw-color-primary-dark); color: var(--pw-color-white);
	transition: background-color var(--pw-time-hover) var(--pw-ease-io), color var(--pw-time-hover) var(--pw-ease-io);
}
.pw-news__arrow svg { grid-area: 1 / 1; width: 8px; height: 8px; }
.pw-news__arrow::after {
	content: ""; grid-area: 1 / 1; width: 8px; height: 8px; background: currentColor;
	-webkit-mask: url(../img/arrow_news.svg) no-repeat center / 8px 8px; mask: url(../img/arrow_news.svg) no-repeat center / 8px 8px;
	translate: -28px 28px;
}
@media (hover: hover) {
	.pw-news__box:hover .pw-news__arrow { background: var(--pw-color-white); color: var(--pw-color-primary-dark); }
	.pw-news__box:hover .pw-news__arrow svg { translate: 28px -28px; transition: translate var(--pw-time-hover) var(--pw-ease-io); }
	.pw-news__box:hover .pw-news__arrow::after { translate: 0 0; transition: translate var(--pw-time-hover) var(--pw-ease-io); }
}

/* ---- 記事カード ---- */
.pw-blogcards { display: grid; grid-template-columns: repeat(3, minmax(0, 360px)); justify-content: space-between; column-gap: 24px; row-gap: 32px; }
.pw-blogcard__link { display: flex; flex-direction: column; gap: 16px; }
.pw-blogcard__figure { aspect-ratio: 360 / 220; overflow: hidden; background: var(--pw-color-placeholder); }
.pw-blogcard__img { width: 100%; height: 100%; object-fit: cover; transition: scale .7s cubic-bezier(.19, 1, .22, 1); }
.pw-blogcard__body { display: flex; flex-direction: column; gap: 8px; }
.pw-blogcard__meta { display: flex; justify-content: space-between; align-items: flex-end; }
.pw-blogcard__tag { padding: 2px 8px; font-size: 14px; line-height: 20px; color: var(--pw-color-white); background: var(--pw-color-primary); }
.pw-blogcard__date { font-size: 12px; line-height: 22px; color: var(--pw-color-caption); }
.pw-blogcard__text { display: flex; flex-direction: column; gap: 4px; }
.pw-blogcard__title { font-size: 18px; font-weight: 500; line-height: 32px; color: var(--pw-color-primary); }
.pw-blogcard__excerpt {
	font-size: 16px; line-height: 29px; color: var(--pw-color-text);
	display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden;
}
@media (hover: hover) {
	.pw-blogcard__link:hover .pw-blogcard__img { scale: 1.05; }
}

/* ---- 下層で共用する部品（シニア・1対1ケアで初出） ---- */
/* 白い箱（緑の線1px・角丸8） */
.pw-sbox { padding: 32px; background: var(--pw-color-white); border: 1px solid var(--pw-color-primary); border-radius: 8px; }
/* チェックの付いた一覧（丸24＋文字18） */
.pw-checklist__item { position: relative; padding-left: 39px; font-size: 18px; line-height: 32px; }
.pw-checklist__item::before { content: ""; position: absolute; left: 0; top: 4px; width: 24px; height: 24px; background: url(../img/senior/check.svg) no-repeat center / 24px 24px; }
/* 注記の箱（淡い黄緑・肉球のアイコン） */
.pw-note { padding: 16px 24px; background: var(--pw-color-bg-yellowgreen); }
.pw-note__head { display: flex; align-items: flex-start; gap: 24px; }
.pw-note__head img { flex: none; width: 34.7px; height: 29.5px; }
.pw-note__ttl { font-size: 16px; line-height: 29px; color: var(--pw-color-primary); }
.pw-note__desc { margin-top: 10px; padding-left: 58.7px; font-size: 14px; line-height: 25px; }
.pw-note__small { margin-top: 13px; padding-left: 58.7px; font-size: 12px; line-height: 22px; }
/* 点つきの一覧（30px の枠の中央に 4px の点） */
.pw-dotlist { display: flex; flex-direction: column; gap: 16px; }
.pw-dotlist li { position: relative; min-height: 30px; padding-left: 30px; font-size: 16px; line-height: 29px; }
.pw-dotlist li::before { content: ""; position: absolute; left: 13px; top: 13px; width: 4px; height: 4px; background: var(--pw-color-primary); }
/* 番号＋イラスト＋見出し＋本文のカード（Philosophy と同じ形） */
.pw-iconcards { display: grid; gap: 20px 16px; }
.pw-iconcard { display: flex; flex-direction: column; padding: 24px 32px; background: var(--pw-color-white); border-radius: 4px; }
.pw-iconcard__num { font-family: var(--pw-font-en); font-weight: 500; font-size: 24px; line-height: 29px; color: var(--pw-color-primary); }
.pw-iconcard__icon { display: flex; justify-content: center; align-items: center; height: 132px; margin-top: 8px; }
.pw-iconcard__ttl { margin-top: 8px; font-size: 18px; font-weight: 500; line-height: 32px; text-align: center; color: var(--pw-color-primary); }
.pw-iconcard__desc { margin-top: 8px; font-size: 16px; line-height: 29px; }

/* ---- コースのカード（TOP の Our Course・メニュー・料金で共通） ---- */
.pw-courses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 40px; align-self: stretch; }
.pw-course { display: flex; }
.pw-course__link { display: flex; flex-direction: column; gap: 32px; flex: 1 1 auto; min-width: 0; padding: 24px 32px; border-radius: 20px; background: var(--pw-color-white); }
/* 写真は Figma の画像の枠（454.8×346 に cover）を、453×291 の窓で切り抜いた状態を再現する */
.pw-course__figure { position: relative; aspect-ratio: 453 / 291; overflow: hidden; background: #D9D9D9; }
.pw-course__figure img { position: absolute; left: -9.05%; top: -13.75%; width: 114.57%; height: 118.9%; max-width: none; object-fit: cover; transition: scale .7s cubic-bezier(.19, 1, .22, 1); }
@media (hover: hover) { .pw-course__link:hover .pw-course__figure img { scale: 1.05; } }
.pw-course__body { display: flex; flex-direction: column; gap: 16px; padding: 0 8px; }
.pw-course__head { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 0 8px 8px; border-bottom: 1px solid var(--pw-color-secondary); }
.pw-course__tag { display: flex; }
.pw-course__tag span { padding: 0 16px; font-size: 16px; line-height: 1.5; color: var(--pw-color-white); background: var(--pw-color-primary); }
.pw-course__title { font-size: 26px; font-weight: 500; line-height: 47px; color: var(--pw-color-primary); }
.pw-course__detail { display: flex; flex-direction: column; gap: 16px; padding: 0 8px; }
.pw-course__desc { font-size: 16px; line-height: 29px; }
.pw-course__prices { display: flex; flex-direction: column; }
.pw-course__price { display: flex; justify-content: space-between; align-items: center; font-size: 20px; line-height: 36px; letter-spacing: .16em; }
.pw-course__price--end { justify-content: flex-end; }
.pw-course__price dt { margin-right: -.16em; white-space: nowrap; }
.pw-course__price dd { display: flex; align-items: center; white-space: nowrap; }
.pw-course__yen { color: var(--pw-color-primary); margin-right: -.16em; }
.pw-course__tax { font-size: 12px; line-height: 22px; letter-spacing: 0; }
.pw-course__hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (min-width: 768px) and (max-width: 1024px) {
	.pw-course__title { font-size: 20px; line-height: 36px; }
	.pw-course__price { flex-wrap: wrap; }
	.pw-course__price dd { margin-left: auto; }
}

/* ---- STEP の縦並び（ご予約・お問い合わせ／メニュー・料金で共通）：白い箱・緑の丸・間の三角 ---- */
.pw-steps__list { display: flex; flex-direction: column; width: min(920px, 100%); margin-inline: auto; }
.pw-steps__item { display: flex; align-items: center; gap: 52px; padding: 15px 16px; background: var(--pw-color-white); border: 1px solid var(--pw-color-border); border-radius: 8px; }
.pw-steps__item + .pw-steps__item { position: relative; margin-top: 56px; }
.pw-steps__item + .pw-steps__item::before { content: ""; position: absolute; left: 50%; top: -40px; width: 30px; height: 24px; margin-left: -15px; background: var(--pw-color-primary); clip-path: polygon(50% 100%, 0 0, 100% 0); }   /* Figma の Polygon Shape 30×24 */
.pw-steps__num { flex: none; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 72px; height: 72px; color: var(--pw-color-white); background: var(--pw-color-secondary); border-radius: 50%; }
.pw-steps__step { font-family: var(--pw-font-en); font-size: 14px; line-height: 25px; letter-spacing: .057em; }
.pw-steps__n { font-family: var(--pw-font-en); font-size: 24px; line-height: 29px; }
.pw-steps__body { flex: 1 1 0; min-width: 0; }
.pw-steps__ttl { font-size: 18px; font-weight: 500; line-height: 32px; color: var(--pw-color-primary); }
.pw-steps__desc { margin-top: 8px; font-size: 16px; line-height: 29px; }

/* ---- ピル（緑の線・角丸100。店舗案内の営業時間／メニュー・料金の「含まれるもの」） ---- */
.pw-pill { flex: none; padding: 0 7px; font-size: 14px; line-height: 25px; letter-spacing: .16em; color: var(--pw-color-primary); border: 1px solid var(--pw-color-primary); border-radius: 100px; }

/* ---- チェックつきの一覧（白い箱・緑の線。店舗案内の安全対策／採用の求める人物像） と 基本情報の表（店舗案内／採用の募集要項） ---- */
.pw-ssafe__list { display: flex; flex-direction: column; gap: 8px; width: min(920px, 100%); margin: 48px auto 0; padding: 31px; background: var(--pw-color-white); border: 1px solid var(--pw-color-primary); border-radius: 8px; }
.pw-ssafe__list li { position: relative; padding-left: 39px; font-size: 18px; line-height: 32px; }
.pw-ssafe__list li::before { content: ""; position: absolute; left: 0; top: 4px; width: 24px; height: 24px; background: url(../img/senior/check.svg) no-repeat center / 24px 24px; }   /* Figma：24px の円（r20）。store/check24.svg は角丸四角で書き出されていたので使わない */
.pw-ssafe__list strong, .pw-dotlist strong, .pw-mnote strong { font-weight: 500; color: var(--pw-color-primary); }   /* 文中の強調＝緑（Figma の characterStyleOverrides。figma_rich.py で抽出） */
.pw-sinfo__list { display: flex; flex-direction: column; gap: 24px; margin-top: 48px; }
.pw-sinfo__row { display: flex; align-items: center; font-size: 18px; line-height: 32px; border-bottom: 1px solid var(--pw-color-border); }
.pw-sinfo__row dt { flex: none; width: 190px; }
.pw-sinfo__row dd { flex: 1 1 0; min-width: 0; max-width: 443px; }
.pw-sinfo__row dd a { color: inherit; }
.pw-sinfo__row--btn { align-items: center; }
.pw-sinfo__row--btn .pw-btn { display: inline-flex; min-width: 244px; }   /* Figma 244。文字を中央に置くため文字に合わせて広げる（2026-10-02） */
@media (hover: hover) { .pw-sinfo__row dd a:hover { color: var(--pw-color-primary); } }

/* ---- 肉球つきの注記（黄緑の帯。メニュー・料金／採用） ---- */
.pw-mnote { display: flex; align-items: flex-start; gap: 24px; width: min(920px, 100%); margin-inline: auto; padding: 16px 24px; background: var(--pw-color-bg-yellowgreen); }
.pw-mnote--bg { background: var(--pw-color-bg); }
.pw-mnote__icon { flex: none; width: 34.7px; height: 29.5px; }
.pw-mnote__body { flex: 1 1 0; min-width: 0; }
.pw-mnote__text { flex: 1 1 0; min-width: 0; font-size: 14px; line-height: 25px; }
.pw-mnote__small { margin-top: 8px; font-size: 12px; line-height: 22px; }

/* ---- カテゴリ一覧（ブログ・よくあるご質問の左の列。選択中は緑） ---- */
.pw-catlist { display: flex; flex-direction: column; gap: 16px; font-size: 16px; line-height: 29px; }
.pw-catlist a { display: inline-block; color: var(--pw-color-text); transition: color .3s ease-in-out; }
.pw-catlist .is-current a { color: var(--pw-color-primary); }
@media (hover: hover) { .pw-catlist a:hover { color: var(--pw-color-primary); } }

/* ---- ページ送り（ブログ一覧・フォトギャラリー） ---- */
.pw-pager { margin-top: 40px; }
.pw-pager__list { display: flex; justify-content: center; align-items: center; gap: 4px; }
.pw-pager__item > a, .pw-pager__item > span { display: flex; justify-content: center; align-items: center; min-width: 50px; height: 50px; font-family: var(--pw-font-en); font-size: 24px; line-height: 29px; color: var(--pw-color-text); transition: color .3s ease-in-out; }
.pw-pager__item > .current { color: var(--pw-color-white); background: var(--pw-color-primary); }
.pw-pager__item--text > a { min-width: 0; margin-left: 50px; font-size: 20px; line-height: 38px; }
.pw-pager__item--text:first-child > a { margin-left: 0; margin-right: 50px; }
@media (hover: hover) { .pw-pager__item > a:hover { color: var(--pw-color-primary); } }

/* ---- 表の横スクロール＋「スクロールできます」（SP・全クライアント共通ルール #68） ----
   枠 .pw-tsh-wrap（position:relative・余白と枠線なし）の中の .pw-tsh-scroll が横にスクロールする。案内 .pw-tsh は main.js が枠に足す。
   見た目と動きは ScrollHint v1.2.5（appleple・MIT）の既定値。移植元＝めぐみや 記事の .mg-tsh（値は打ち直していない） */
.pw-tsh-wrap { position: relative; }
.pw-tsh-scroll { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }   /* overflow-y を auto のままにすると、表の負のマージンぶんで縦のスクロールバーが出る */
.pw-tsh { display: none; }
@media (max-width: 767px) {
	.pw-tsh { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-height: 100%; pointer-events: none; margin: 0; padding: 0; }
	.pw-tsh__icon { display: block; position: absolute; top: calc(50% - 25px); left: calc(50% - 60px); box-sizing: border-box; width: 120px; height: 80px; margin: 0; padding: 20px 10px 10px 10px; border-radius: 5px; background: rgba(0, 0, 0, .7); text-align: center; opacity: 0; transition: opacity .3s; }
	.pw-tsh.is-active .pw-tsh__icon { opacity: .8; }
	.pw-tsh__text { display: block; margin: 5px 0 0; padding: 0; font-size: 10px; line-height: 1.5; color: #FFF; }
	.pw-tsh__text::before { content: "スクロールできます"; }
	.pw-tsh__icon::before { content: ""; display: inline-block; width: 40px; height: 40px; vertical-align: middle; background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNS43NyIgaGVpZ2h0PSIzMC41MiIgdmlld0JveD0iMCAwIDI1Ljc3IDMwLjUyIj48dGl0bGU+44Ki44K744OD44OIIDM8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxwYXRoIGQ9Ik0yMS4zMywzMC41Mkg3Ljg1QTEuNTUsMS41NSwwLDAsMSw2LjMsMjlhMTIuNDYsMTIuNDYsMCwwLDAtLjYzLTQuNDIsMjUuMTYsMjUuMTYsMCwwLDAtNC4yNS01bC0uMDYtLjA2QTUsNSwwLDAsMSwwLDE1Ljg2YTMuNjQsMy42NCwwLDAsMSwxLjE3LTIuNjIsMy42MywzLjYzLDAsMCwxLDUuMTQuMDdWMy43N2EzLjc3LDMuNzcsMCwxLDEsNy41NCwwVjguMzNhMy4zNSwzLjM1LDAsMCwxLDEuMjYsMCwzLDMsMCwwLDEsMiwxLjIyLDMuNSwzLjUsMCwwLDEsMi0uMDYsMy4yMSwzLjIxLDAsMCwxLDIsMS41NCwzLjc0LDMuNzQsMCwwLDEsMywuNDdBNC4yMSw0LjIxLDAsMCwxLDI1Ljc0LDE1YzAsLjExLDAsLjI3LDAsLjQ2YTE5LjI2LDE5LjI2LDAsMCwxLS44NCw3Yy0uMTQuMzgtLjM2LjgxLS41NiwxLjIybC0uMTEuMjJjMCwuMDctLjA5LjE0LS4xNC4yMWE3LjEzLDcuMTMsMCwwLDAtMS4xNywyLjE3Yy0uMDYuNTYtLjA2LDIuMTUtLjA1LDIuNzFBMS41NSwxLjU1LDAsMCwxLDIxLjMzLDMwLjUyWk04LjYxLDI4LjIxaDEyYzAtLjcxLDAtMS43MS4wNy0yLjIzYTguNzQsOC43NCwwLDAsMSwxLjU5LTMuMjVsLjA2LS4xMmExMCwxMCwwLDAsMCwuNDYtMSwxNi44LDE2LjgsMCwwLDAsLjctNi4xMmMwLS4yMywwLS40MSwwLS41NGgwYTIsMiwwLDAsMC0uNjQtMS41MiwxLjMzLDEuMzMsMCwwLDAtMS41NS4wOCwxLjEzLDEuMTMsMCwwLDEtMS4xOC4yOCwxLjE1LDEuMTUsMCwwLDEtLjc4LS45NCwxLjI2LDEuMjYsMCwwLDAtLjc1LTEuMTEsMSwxLDAsMCwwLTEuMTEuMjhsLS4xLjFhMS4xNSwxLjE1LDAsMCwxLTEuMTkuMjksMS4xNiwxLjE2LDAsMCwxLS43OC0uOTVjLS4wOS0uNjgtLjIxLS43Ny0uNy0uODdhLjgyLjgyLDAsMCwwLTEsLjQ4LDEuMTYsMS4xNiwwLDAsMS0yLjE2LS41OFYzLjc3YTEuNDYsMS40NiwwLDEsMC0yLjkyLDB2Ny44NWwwLDQuMzNhMS4xNywxLjE3LDAsMCwxLS44MywxLjExLDEuMTUsMS4xNSwwLDAsMS0xLjItLjM1bC0xLS45MWMtLjQ3LS40Mi0uNzMtLjY2LS44NC0uNzdhMS4zNSwxLjM1LDAsMCwwLTItLjEyTDIuNywxNWExLjMyLDEuMzIsMCwwLDAtLjM5LDFBMi41NywyLjU3LDAsMCwwLDMsMTcuODVsMCwwYTI3LjI0LDI3LjI0LDAsMCwxLDQuNyw1LjYyQTEyLjYzLDEyLjYzLDAsMCwxLDguNjEsMjguMjFaTTIzLjIsMjMuMzVaTTYuNTEsMTYuNTlaIiBmaWxsPSIjZmZmIi8+PC9nPjwvZz48L3N2Zz4=) center center/contain no-repeat; }
	.pw-tsh__icon::after { content: ""; display: block; position: absolute; top: 10px; left: 50%; width: 34px; height: 14px; margin-left: -20px; background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMy4yOSIgaGVpZ2h0PSIxMi4wMiIgdmlld0JveD0iMCAwIDMzLjI5IDEyLjAyIj48dGl0bGU+44Ki44K744OD44OIIDE8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxsaW5lIHgxPSIxLjg1IiB5MT0iNi4wMSIgeDI9IjEwLjQiIHkyPSI2LjAxIiBmaWxsPSIjZmZmIi8+PHBhdGggZD0iTTEwLjQsNy4xN0gxLjg1YTEuMTYsMS4xNiwwLDEsMSwwLTIuMzFIMTAuNGExLjE2LDEuMTYsMCwxLDEsMCwyLjMxWiIgZmlsbD0iI2ZmZiIvPjxwYXRoIGQ9Ik03LjQsMTJhMS4xNSwxLjE1LDAsMCwxLS43Mi0uMjVsLTYuMjUtNUExLjIsMS4yLDAsMCwxLDAsNS44NywxLjE0LDEuMTQsMCwwLDEsLjQ2LDVMNi43LjIzQTEuMTYsMS4xNiwwLDAsMSw4LjEsMi4wOEwzLDUuOTEsOC4xMiwxMEExLjE2LDEuMTYsMCwwLDEsNy40LDEyWiIgZmlsbD0iI2ZmZiIvPjxsaW5lIHgxPSIzMS40NSIgeTE9IjYuMDEiIHgyPSIyMi44OSIgeTI9IjYuMDEiIGZpbGw9IiNmZmYiLz48cGF0aCBkPSJNMzEuNDUsNy4xN0gyMi44OWExLjE2LDEuMTYsMCwxLDEsMC0yLjMxaDguNTZhMS4xNiwxLjE2LDAsMCwxLDAsMi4zMVoiIGZpbGw9IiNmZmYiLz48cGF0aCBkPSJNMjUuOSwxMmExLjE4LDEuMTgsMCwwLDEtLjkxLS40M0ExLjE3LDEuMTcsMCwwLDEsMjUuMTcsMTBsNS4wOS00LjA1TDI1LjIsMi4wOEExLjE2LDEuMTYsMCwwLDEsMjYuNTkuMjNMMzIuODQsNWExLjE2LDEuMTYsMCwwLDEsLjQ1LjkxLDEuMTQsMS4xNCwwLDAsMS0uNDMuOTJsLTYuMjQsNUExLjE3LDEuMTcsMCwwLDEsMjUuOSwxMloiIGZpbGw9IiNmZmYiLz48L2c+PC9nPjwvc3ZnPg==) no-repeat; opacity: 0; transition: opacity 0s 2.4s; }
	.pw-tsh.is-active .pw-tsh__icon::after { opacity: 1; }
	.pw-tsh.is-active .pw-tsh__icon::before { animation: pw-tsh-appear 1.2s linear 2; }
}
@keyframes pw-tsh-appear { 0% { transform: translateX(40px); opacity: 0; } 10% { opacity: 1; } 50%, 100% { transform: translateX(-40px); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .pw-tsh.is-active .pw-tsh__icon::before { animation: none; } .pw-tsh__icon::after { transition: none; } }

/* ---- 「左から開く」動き（JS が動くときだけ隠す。JS が無ければ最初から表示） ---- */
.pw-js .pw-reveal { clip-path: inset(0 100% 0 0); }
.pw-js .pw-reveal.is-in { clip-path: inset(0 0 0 0); transition: clip-path .5s ease-out .1s; }
.pw-js .pw-reveal--photo.is-in { transition: clip-path .8s ease 0s; }
.pw-js .pw-reveal.is-done { clip-path: none; }

/* ---- SP ---- */
@media (max-width: 767px) {
	.pw-h2 { font-size: 20px; line-height: 36px; }
	.pw-mnote { flex-direction: column; align-items: center; gap: 8px; padding: 16px 24px; }
	.pw-mnote__text, .pw-mnote__body { width: 100%; }
	.pw-ssafe__list { margin-top: 24px; padding: 31px 15px; }
	.pw-sinfo__list { margin-top: 24px; }
	.pw-sinfo__row { flex-direction: column; }
	.pw-sinfo__row dt { width: 100%; }
	.pw-sinfo__row dd { width: 100%; max-width: none; }
	.pw-sinfo__row--btn { align-items: flex-start; }
	/* STEP の縦並び */
	.pw-steps__item { flex-direction: column; gap: 16px; padding: 15px 16px; }
	.pw-steps__item + .pw-steps__item { margin-top: 48px; }
	.pw-steps__item + .pw-steps__item::before { top: -32px; width: 20px; height: 16px; margin-left: -10px; }
	.pw-steps__body { width: 100%; text-align: center; }
	.pw-steps__desc { margin-top: 4px; text-align: left; }
	/* コースのカード */
	.pw-courses { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.pw-course__link { padding: 24px 8px; }
	.pw-course__figure { aspect-ratio: auto; height: 240px; }
	.pw-course__figure img { left: -29.7%; top: -22.9%; width: 159.4%; height: 141.25%; }
	.pw-course__head { padding: 0 0 8px; }
	.pw-course__title { font-size: 20px; line-height: 36px; }
	.pw-course__price { flex-direction: column; align-items: flex-start; }
	.pw-course__price--end { align-items: flex-start; }
	.pw-pager { margin-top: 24px; }
	.pw-pager__list { gap: 12px; }
	.pw-pager__item > a, .pw-pager__item > span { min-width: 40px; height: 40px; font-size: 20px; line-height: 24px; }
	.pw-pager__item--text > a { margin-left: 0; line-height: 38px; }
	.pw-pager__item--text:first-child > a { margin-right: 0; }

	.pw-bgword { font-size: 40px; line-height: 72px; }
	.pw-blogcards { grid-template-columns: minmax(0, 1fr); row-gap: 32px; }
	.pw-blogcard__figure { aspect-ratio: auto; height: 220px; }
	.pw-blogcard__excerpt { -webkit-line-clamp: 4; line-clamp: 4; }
	.pw-sbox { padding: 16px; }
	.pw-note { padding: 16px; }
	.pw-note__desc, .pw-note__small { margin-top: 8px; padding-left: 0; }
	.pw-iconcards { grid-template-columns: minmax(0, 1fr); }
}