/* ノート風（2026-11-01）。11/3 方眼は人材のページ（body.paper-grid）だけに。ほかは事業ごとの無地の紙 */
html body { background-color: #FDFCFA; background-image: none; }
html body.paper-grid { background-color: #FEFEFC; background-image: linear-gradient(var(--note-grid) 1px, transparent 1px), linear-gradient(90deg, var(--note-grid) 1px, transparent 1px); background-size: 24px 24px; }
/* 自費リハビリ: 清潔で落ち着いた、ごく淡い水色の紙 */
html body.paper-rehab { background-color: #FBFDFE; background-image: linear-gradient(180deg, #EEF5FB 0, rgba(238,245,251,0) 520px); background-repeat: no-repeat; }
body.paper-rehab .section-sep { border-top-color: #D6E6F3; }
/* 訪問ネイル: やわらかい桜色の紙 */
html body.paper-nail { background-color: #FFFCFC; background-image: linear-gradient(180deg, #FBEFF3 0, rgba(251,239,243,0) 520px); background-repeat: no-repeat; }
body.paper-nail .section-sep { border-top-color: #EED7E0; }
body.paper-nail .cta-strip { background: #FBF0F4 !important; }
h1, h2, h3, h4 { font-weight: 600 !important; }
.watermark { display: none !important; }
:root { --note-grid: rgba(92, 80, 144, .055); --serif: "Klee One", "Noto Sans JP", sans-serif; --base: #FEFEFC; --radius: 8px; --radius2: 10px; --shadow: 0 2px 10px rgba(50, 44, 87, .06); }
h1, h2, h3, h4, .sec-label, .eyebrow-main, .brand-title, .lead { font-family: "Klee One", "Noto Sans JP", sans-serif; }
h1, h2, h3, h4, .brand-title, .lead { letter-spacing: .03em !important; }
.sec-label, .sec-label-accent, .sec-label-white, .eyebrow-main { display: flex !important; }
h2.sec-title { display: block; }
.hero-aurora, .orb { display: none !important; }
@media (max-width: 640px) { .hero-title-xl { font-size: 30px !important; } }
.section-white, .section-base, .hero { background: transparent !important; }
.hero::before, .hero::after, .page-hero::before, .page-hero::after, .cta-strip::before, .cta-strip::after { display: none !important; }
.section-sep { height: 0; background: none; border-top: 1px dashed var(--border-dark); }
.page-hero { background: transparent !important; color: var(--text) !important; }
.page-hero h1 { color: var(--main-deep) !important; }
.page-hero .lead { color: var(--text) !important; }
.page-hero .eyebrow-main { color: var(--main) !important; }
.page-hero .eyebrow-main::before { background: var(--main) !important; }
.cta-strip { background: #F3F1F8 !important; color: var(--text) !important; }
.cta-strip h2 { color: var(--main-deep) !important; }
.cta-strip p { color: var(--text) !important; }
.cta-strip .sec-label-white { color: var(--main) !important; }
.cta-strip .sec-label-white::before { background: var(--main) !important; }
.cta-strip .btn-white { border: 1px solid var(--main); }
.biz-card, .policy-item, .message-card, .card { box-shadow: var(--shadow); }
/* 11/4 お客様の声: 手書きノート風の付箋カード（色は薄く、文字は濃く） */
.voice-notes { display: grid; grid-template-columns: 1fr; gap: 18px; margin: 8px 0 20px; }
@media (min-width: 640px) { .voice-notes { grid-template-columns: repeat(2, 1fr); gap: 22px; } }
.voice-note { margin: 0; padding: 20px 20px 16px; border-radius: 4px 4px 14px 4px; box-shadow: 0 2px 8px rgba(40, 40, 60, .10); position: relative; color: #23303F; }
.voice-note::before { content: ""; position: absolute; top: -9px; left: 50%; width: 64px; height: 18px; margin-left: -32px; background: rgba(255, 255, 255, .7); border: 1px solid rgba(0, 0, 0, .05); transform: rotate(-2deg); }
.voice-note blockquote { margin: 0; font-family: "Klee One", "Noto Sans JP", sans-serif; font-size: 17.5px; line-height: 1.8; font-weight: 600; }
.voice-note figcaption { margin-top: 10px; font-size: 14px; color: #4A5868; text-align: right; }
.voice-note.vn-1 { background: #FFF6C9; transform: rotate(-.6deg); }
.voice-note.vn-2 { background: #E3F0FB; transform: rotate(.5deg); }
.voice-note.vn-3 { background: #FCE6EC; transform: rotate(.4deg); }
.voice-note.vn-4 { background: #E5F4E6; transform: rotate(-.5deg); }
.voice-disclaimer { font-size: 13px; color: #5A6573; margin-top: 14px; }
/* 11/4 訪問ネイル「担当ネイリストからのメッセージ」の手紙風カード（本文は添削待ち。ページへの挿入は本文確定後） */
.nail-letter { max-width: 720px; margin: 0 auto; padding: 30px 24px 26px; background: #FFFDFB; border: 1px solid #EFD3DF; border-top: 4px solid #9A4A6E; border-radius: 6px 6px 16px 6px; box-shadow: 0 3px 14px rgba(122, 53, 87, .10); color: #3A2733; font-size: 15.5px; line-height: 2; }
.nail-letter .nl-kicker { margin: 0 0 4px; font-size: 13.5px; letter-spacing: .08em; color: #7A3557; }
.nail-letter .nl-title { margin: 0 0 18px; font-family: "Klee One", "Noto Sans JP", sans-serif; font-size: 24px; color: #5E2944; }
.nail-letter p { margin: 0 0 14px; }
.nail-letter .nl-voices { list-style: none; margin: 0 0 14px; padding: 12px 16px; background: #FBF0F4; border-radius: 8px; }
.nail-letter .nl-voices li, .nail-letter .nl-q { font-family: "Klee One", "Noto Sans JP", sans-serif; font-weight: 600; color: #7A3557; }
.nail-letter .nl-sign { text-align: right; margin: 18px 0 0; font-family: "Klee One", "Noto Sans JP", sans-serif; color: #5E2944; }
.nail-letter .nl-cta { margin: 20px 0 0; text-align: center; } .nail-letter .nl-cta a { display: inline-block; padding: 12px 26px; border-radius: 999px; background: linear-gradient(135deg, #A9557B 0%, #7A3557 100%); color: #fff !important; font-weight: 700; text-decoration: none; }
.joint-note { margin: 18px 0 22px; font-size: 12.5px; color: #6A5A64; text-align: center; }
/* 11/4 訪問ネイルの料金表（ハンド／フット × ワンカラー・グラデーション・アート） */
.nail-price-wrap { max-width: 760px; margin: 0 auto 18px; }
.nail-price { width: 100%; border-collapse: separate; border-spacing: 0; background: #FFFDFB; border: 1px solid #EFD3DF; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 10px rgba(122, 53, 87, .07); table-layout: fixed; }
.nail-price th, .nail-price td { padding: 14px 6px; text-align: center; border-bottom: 1px dashed #EED7E0; font-size: 15px; line-height: 1.4; }
.nail-price thead th { background: #FBF0F4; color: #5E2944; font-weight: 700; font-size: 13.5px; }
.nail-price thead th:first-child, .nail-price tbody th { width: 22%; }
.nail-price tbody th { color: #7A3557; font-family: "Klee One", "Noto Sans JP", sans-serif; font-weight: 600; }
.nail-price td { font-weight: 700; color: #3B1F30; font-size: 16px; }
.nail-price tbody tr:last-child th, .nail-price tbody tr:last-child td { border-bottom: none; }
.nail-price .np-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.nail-price-wrap .np-cap { margin: 10px 2px 0; font-size: 14px; color: #6A5A64; line-height: 1.8; }
@media (max-width: 420px) { .nail-price thead th:first-child, .nail-price tbody th { width: 17%; } .nail-price th, .nail-price td { padding: 12px 2px; } .nail-price td { font-size: 14px; white-space: nowrap; } .nail-price thead th { font-size: 11.5px; white-space: nowrap; letter-spacing: 0; } .nail-price tbody th { font-size: 14px; } }

/* 施術例ギャラリー（2026-11-04）。保存しにくくする: 長押し・選択・ドラッグを止め、画像の上に透明な層 */
.nail-gallery { max-width: 960px; margin: 0 auto; }
.nail-gallery .ng-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (min-width: 720px) { .nail-gallery .ng-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
.nail-gallery .ng-item { margin: 0; background: #FFFDFB; border: 1px solid #EFD3DF; border-radius: 10px; padding: 6px 6px 8px; box-shadow: 0 2px 10px rgba(122, 53, 87, .07); }
.nail-gallery .ng-item:nth-child(odd) { transform: rotate(-.6deg); } .nail-gallery .ng-item:nth-child(even) { transform: rotate(.5deg); }
.nail-gallery .ng-open, .ng-dialog .ng-big { position: relative; display: block; width: 100%; padding: 0; border: 0; background: none; border-radius: 6px; overflow: hidden; }
.nail-gallery .ng-open { cursor: zoom-in; }
.nail-gallery img, .ng-dialog img { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; -webkit-user-drag: none; pointer-events: none; }
.nail-gallery .ng-shield, .ng-dialog .ng-shield { position: absolute; inset: 0; background: transparent; -webkit-touch-callout: none; }
.nail-gallery, .ng-dialog { -webkit-user-select: none; user-select: none; }
.nail-gallery .ng-open img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; }
.nail-gallery figcaption { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin-top: 6px; font-size: 14px; line-height: 1.5; color: #3A2733; }
.nail-gallery .ng-name { font-family: "Klee One", "Noto Sans JP", sans-serif; font-weight: 600; }
.nail-gallery .ng-tag { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: .02em; }
.nail-gallery .ng-one { background: #FAEDF2; color: #7A3557; } .nail-gallery .ng-grad { background: #F1E6F5; color: #5E2944; } .nail-gallery .ng-art { background: #7A3557; color: #fff; }
.nail-gallery .ng-more { margin-top: 14px; } .nail-gallery .ng-more > .ng-grid { margin-top: 14px; }
.nail-gallery .ng-more summary { display: block; width: max-content; max-width: 100%; margin: 0 auto; padding: 10px 22px; border: 1px solid #C98AA6; border-radius: 999px; color: #7A3557; font-weight: 700; cursor: pointer; list-style: none; background: #FFFDFB; }
.nail-gallery .ng-more summary::-webkit-details-marker { display: none; }
.nail-gallery .ng-note { margin: 12px 0 0; font-size: 14px; color: #6A5A64; line-height: 1.8; text-align: center; }
.ng-dialog { border: 0; padding: 10px; border-radius: 12px; max-width: min(92vw, 520px); width: 100%; background: #FFFDFB; box-shadow: 0 10px 40px rgba(0,0,0,.25); }
.ng-dialog::backdrop { background: rgba(40, 20, 30, .6); }
.ng-dialog img { display: block; width: 100%; height: auto; max-height: 76vh; object-fit: contain; }
.ng-dialog .ng-cap { margin: 8px 2px; font-family: "Klee One", "Noto Sans JP", sans-serif; font-weight: 600; color: #5E2944; text-align: center; }
.ng-dialog .ng-close { display: block; margin: 0 auto; padding: 8px 26px; border: 0; border-radius: 999px; background: linear-gradient(135deg, #A9557B 0%, #7A3557 100%); color: #fff; font-weight: 700; cursor: pointer; }

/* メッセージの続きを読む・施術例から料金表へ（2026-11-04） */
.nail-letter .nl-more { margin: 0; }
.nail-letter .nl-more > summary { display: inline-block; margin: 2px 0 12px; padding: 6px 18px; border: 1px solid #C98AA6; border-radius: 999px; color: #7A3557; font-weight: 700; font-size: 14px; cursor: pointer; list-style: none; background: #FFFDFB; }
.nail-letter .nl-more > summary::-webkit-details-marker { display: none; }
.nail-letter .nl-more[open] > summary { display: none; }
.nail-gallery .ng-price-link { margin: 8px 0 0; text-align: center; font-size: 14px; }
.nail-gallery .ng-price-link a { color: #7A3557; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }

/* 訪問ネイル: スクロールで浮き上がる・写真の拡大・拡大表示のフェード（2026-11-04）。JS が付けた ng-anim のときだけ隠す */
html.ng-anim .ng-rise { opacity: 0; translate: 0 18px; transition: opacity .6s ease, translate .6s cubic-bezier(.2,.7,.2,1); }
html.ng-anim .ng-rise.ng-in { opacity: 1; translate: 0 0; }
.nail-gallery .ng-open img { transition: transform .35s ease; }
.nail-gallery .ng-open:hover img, .nail-gallery .ng-open:focus-visible img, .nail-gallery .ng-open:active img { transform: scale(1.05); }
.ng-dialog[open] { animation: ngFadeIn .2s ease; } .ng-dialog[open]::backdrop { animation: ngFadeIn .2s ease; }
.ng-dialog.ng-closing { animation: ngFadeOut .18s ease forwards; } .ng-dialog.ng-closing::backdrop { animation: ngFadeOut .18s ease forwards; }
@keyframes ngFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes ngFadeOut { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  html.ng-anim .ng-rise { opacity: 1; translate: none; transition: none; }
  .nail-gallery .ng-open img { transition: none; } .nail-gallery .ng-open:hover img, .nail-gallery .ng-open:active img { transform: none; }
  .ng-dialog[open], .ng-dialog[open]::backdrop, .ng-dialog.ng-closing, .ng-dialog.ng-closing::backdrop { animation: none; }
}

/* ============================================================
   訪問ネイル刷新（2026-11-04、設計 04_資料・記録/訪問ネイルページ刷新_設計_20261104.md）
   全セレクタを body.paper-nail か .nh- で始める（paper-nail を持たない他ページには効かない）
   ============================================================ */
body.paper-nail { --nh-grape: #7A3557; --nh-grape2: #9A4A6E; --nh-deep: #5E2944; --nh-sakura: #FBF0F4; --nh-sakura2: #F5DCE6; --nh-line: #EFD3DF; --nh-text: #3A2733; --nh-sub: #6A5A64; }
body.paper-nail .nh-wrap { max-width: 960px; margin-left: auto; margin-right: auto; }

/* 節の余白・区切り・文字 */
body.paper-nail .nh-sec { padding-top: 56px; padding-bottom: 56px; font-size: 16.5px; line-height: 1.85; color: var(--nh-text); }
body.paper-nail .nh-sec + .nh-sec { border-top: 1px dashed #EED7E0; }
body.paper-nail .nh-head { margin: 0 0 24px; text-align: left; }
body.paper-nail .nh-head .sec-label, body.paper-nail .nh-head h6 { display: flex !important; align-items: center; justify-content: flex-start; gap: 10px; margin: 0 0 8px; font-family: "Noto Sans JP", sans-serif; font-size: 12px; font-weight: 700; letter-spacing: .18em; color: var(--nh-grape) !important; }
body.paper-nail .nh-head h6 { font-size: 14px; letter-spacing: .12em; }
body.paper-nail .nh-head .sec-label::before, body.paper-nail .nh-head h6::before { content: ""; flex: none; width: 24px; height: 1px; background: var(--nh-grape) !important; }
body.paper-nail .nh-head h2 { margin: 0; font-family: "Klee One", "Noto Sans JP", sans-serif; font-weight: 600 !important; font-size: 28px; line-height: 1.5; letter-spacing: .03em; color: var(--nh-deep); }
body.paper-nail .nh-head h2::after { content: ""; display: block; width: 40px; height: 2px; margin-top: 12px; border-radius: 2px; background: var(--nh-grape); }
body.paper-nail .nh-kicker { margin: 0 0 4px; font-size: 14px; font-weight: 700; letter-spacing: .14em; color: var(--nh-grape); }
body.paper-nail .nh-h3 { margin: 0 0 14px; font-family: "Klee One", "Noto Sans JP", sans-serif; font-weight: 600 !important; font-size: 20px; line-height: 1.55; color: var(--nh-deep); }

/* 2 列（左に見出し・右に本文） */
@media (min-width: 900px) {
  body.paper-nail .nh-2col { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 40px; align-items: start; }
  body.paper-nail .nh-2col > .nh-side { position: sticky; top: 100px; }
  body.paper-nail .nh-2col.nh-2col-even { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  body.paper-nail .nh-head h2 { font-size: 30px; }
}
@media (max-width: 899px) {
  body.paper-nail .nh-2col { display: flex; flex-direction: column; gap: 20px; }
  body.paper-nail .nh-2col.nh-2col-even { gap: 24px; }
  body.paper-nail .nh-sec { font-size: 16px; }
}
@media (max-width: 600px) {
  body.paper-nail .nh-sec { padding-top: 40px; padding-bottom: 40px; }
}

/* ---- ヒーロー ---- */
body.paper-nail .page-hero.nh-hero { padding: 40px 0 36px; }
body.paper-nail .hero.nh-hero { padding: 40px 32px 36px; overflow: visible; }
body.paper-nail .hero.nh-hero::before, body.paper-nail .hero.nh-hero::after { display: none !important; }
body.paper-nail .nh-hero-grid { display: grid; grid-template-columns: 52fr 48fr; grid-template-areas: "head photos" "body photos"; column-gap: 40px; align-items: start; }
body.paper-nail .nh-hero-head { grid-area: head; align-self: end; min-width: 0; }
body.paper-nail .nh-hero-body { grid-area: body; min-width: 0; }
body.paper-nail .nh-hero .eyebrow-main { margin-bottom: 12px; font-size: 12px; color: var(--nh-grape) !important; }
body.paper-nail .nh-hero .eyebrow-main::before { background: var(--nh-grape) !important; }
body.paper-nail .nh-hero h1 { margin: 0 0 14px; font-size: 44px; line-height: 1.4; letter-spacing: .04em; color: var(--nh-deep) !important; }
body.paper-nail .hero.nh-hero h1 { font-size: 38px; }
body.paper-nail .nh-hero .lead, body.paper-nail .nh-hero .hero-text { max-width: 30em; margin: 0; font-size: 16.5px; line-height: 1.9; color: var(--nh-text) !important; }
body.paper-nail .nh-hero .hero-lead { margin: 0 0 8px; font-size: 18px; font-weight: 700; color: var(--nh-grape); }
body.paper-nail .nh-badges { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 18px 0 0; padding: 0; }
body.paper-nail .nh-badge { display: inline-flex; align-items: center; min-height: 28px; padding: 2px 11px; border: 1px solid #E3A6BF; border-radius: 999px; background: #fff; font-size: 14px; font-weight: 700; line-height: 1.4; color: var(--nh-deep); }
body.paper-nail .nh-badge:first-child { background: var(--nh-grape); border-color: var(--nh-grape); color: #fff; }
body.paper-nail .nh-price-note { position: relative; display: inline-flex; flex-direction: column; gap: 4px; max-width: 100%; margin: 18px 0 0; padding: 12px 18px; background: #FDF7F9; border: 1px solid var(--nh-sakura2); border-radius: 4px 4px 12px 4px; box-shadow: 0 2px 8px rgba(122, 53, 87, .10); rotate: -1.2deg; }
body.paper-nail .nh-price-note::before { content: ""; position: absolute; top: -8px; left: 22px; width: 48px; height: 14px; background: rgba(245, 220, 230, .9); border: 1px solid rgba(201, 138, 166, .25); rotate: -4deg; }
body.paper-nail .nh-pn-main { display: flex; flex-wrap: wrap; column-gap: 10px; font-family: "Klee One", "Noto Sans JP", sans-serif; color: var(--nh-deep); line-height: 1.45; }
body.paper-nail .nh-pn-main b { font-weight: 600; font-size: 21px; letter-spacing: .01em; white-space: nowrap; }
body.paper-nail .nh-pn-main b + b::before { content: "・"; margin-right: 10px; color: var(--nh-grape2); }
body.paper-nail .nh-pn-sub { display: flex; flex-wrap: wrap; gap: 2px 14px; font-size: 14px; line-height: 1.6; color: var(--nh-sub); }
body.paper-nail .nh-pn-sub a { color: var(--nh-grape); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
body.paper-nail .nh-pn-sub a::after { content: " →"; }
body.paper-nail .nh-cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; margin-top: 22px; }
body.paper-nail a.nh-cta:not(.btn) { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 12px 30px; border-radius: 12px; background: linear-gradient(135deg, #A9557B 0%, #7A3557 100%); color: #fff !important; font-size: 16px; font-weight: 700; letter-spacing: .06em; text-decoration: none; box-shadow: 0 6px 16px rgba(122, 53, 87, .25); }
body.paper-nail a.nh-cta:not(.btn):hover { background: linear-gradient(135deg, #9A4A6E 0%, #5E2944 100%); }
body.paper-nail .nh-link { font-size: 15px; font-weight: 700; color: var(--nh-grape); text-decoration: underline; text-underline-offset: 4px; }
body.paper-nail .nh-link::after { content: " ↓"; }

/* ヒーローの写真（ノートに貼った写真の見た目） */
body.paper-nail .nh-photos { grid-area: photos; position: relative; height: 420px; align-self: center; -webkit-user-select: none; user-select: none; }
body.paper-nail .nh-photo { position: absolute; margin: 0; padding: 6px; background: #fff; border-radius: 6px; box-shadow: 0 6px 18px rgba(122, 53, 87, .14); transition: scale .35s ease; }
body.paper-nail .nh-photo::before { content: ""; position: absolute; z-index: 2; top: -8px; left: 50%; width: 56px; height: 16px; margin-left: -28px; background: rgba(245, 220, 230, .85); border: 1px solid rgba(201, 138, 166, .25); rotate: -3deg; }
body.paper-nail .nh-ph { display: block; overflow: hidden; border-radius: 3px; }
body.paper-nail .nh-ph img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; -webkit-user-drag: none; pointer-events: none; }
body.paper-nail .nh-photo .ng-shield { position: absolute; inset: 0; z-index: 1; background: transparent; -webkit-touch-callout: none; }
body.paper-nail .nh-photo.-main { left: 0; top: 26px; width: 280px; z-index: 1; }
body.paper-nail .nh-photo.-b { right: 0; top: 0; width: 170px; z-index: 0; rotate: -4deg; }
body.paper-nail .nh-photo.-a { right: 22px; bottom: 0; width: 200px; z-index: 3; rotate: 3deg; }
body.paper-nail .nh-photo:hover, body.paper-nail .nh-photo:active { scale: 1.03; }
@media (min-width: 900px) and (max-width: 1023px) {
  body.paper-nail .nh-hero-grid { grid-template-columns: 56fr 44fr; column-gap: 28px; }
  body.paper-nail .nh-photo.-main { width: 240px; }
  body.paper-nail .nh-photo.-b { width: 150px; }
  body.paper-nail .nh-photo.-a { width: 175px; right: 0; }
  body.paper-nail .nh-photos { height: 380px; }
}

/* ヒーローの動き（JS を待たない CSS アニメーション） */
@keyframes nhUp { from { opacity: .001; translate: 0 10px; } to { opacity: 1; translate: 0 0; } }
@keyframes nhPhotoIn { from { opacity: .001; translate: 0 14px; } to { opacity: 1; translate: 0 0; } }
@keyframes nhZoom { from { scale: 1; } to { scale: 1.04; } }
body.paper-nail .nh-hero .nh-hero-head > *, body.paper-nail .nh-hero .nh-hero-body > * { animation: nhUp .5s cubic-bezier(.2, .8, .2, 1) both; }
body.paper-nail .nh-hero .nh-hero-head > :nth-child(2) { animation-delay: .05s; }
body.paper-nail .nh-hero .nh-hero-head > :nth-child(3) { animation-delay: .1s; }
body.paper-nail .nh-hero .nh-hero-body > * { animation-delay: .15s; }
body.paper-nail .nh-photo { animation: nhPhotoIn .6s cubic-bezier(.2, .8, .2, 1) .2s both; }
body.paper-nail .nh-photo.-b { animation-delay: .32s; }
body.paper-nail .nh-photo.-a { animation-delay: .44s; }
body.paper-nail .nh-photo.-main .nh-ph img { animation: nhZoom 12s ease-out .6s both; }

/* ---- ヒーロー: スマートフォン ---- */
@media (max-width: 899px) {
  body.paper-nail .page-hero.nh-hero { padding: 20px 0 24px; }
  body.paper-nail .hero.nh-hero { padding: 20px 16px 24px; }
  body.paper-nail .nh-hero-grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "photos" "body"; }
  body.paper-nail .nh-hero .eyebrow-main { margin-bottom: 8px; font-size: 11.5px; }
  body.paper-nail .nh-hero h1 { margin-bottom: 8px; font-size: 34px; line-height: 1.35; }
  body.paper-nail .hero.nh-hero h1 { font-size: 26px; line-height: 1.45; }
  body.paper-nail .nh-hero .lead, body.paper-nail .nh-hero .hero-text { max-width: none; font-size: 15.5px; line-height: 1.8; }
  body.paper-nail .nh-hero .hero-lead { margin-bottom: 4px; font-size: 16px; }
  body.paper-nail .nh-photos { display: flex; justify-content: space-around; align-items: flex-start; height: auto; width: 100%; max-width: 440px; margin: 16px auto 0; }
  body.paper-nail .nh-photo, body.paper-nail .nh-photo.-main, body.paper-nail .nh-photo.-a { position: relative; top: auto; right: auto; bottom: auto; left: auto; }
  body.paper-nail .nh-photo.-main { width: 56%; rotate: -1deg; }
  body.paper-nail .nh-photo.-a { width: 40%; margin-top: 28px; rotate: 2.5deg; }
  body.paper-nail .hero.nh-hero .nh-photo.-main { width: 47%; }
  body.paper-nail .hero.nh-hero .nh-photo.-a { width: 36%; margin-top: 22px; }
  body.paper-nail .hero.nh-hero .hero-text { font-size: 15px; line-height: 1.75; }
  body.paper-nail .nh-photo.-b { display: none; }
  body.paper-nail .nh-badges { margin-top: 16px; }
  body.paper-nail .nh-price-note { display: flex; margin-top: 14px; padding: 10px 14px; rotate: -.8deg; }
  body.paper-nail .nh-pn-main { column-gap: 14px; }
  body.paper-nail .nh-pn-main b { font-size: 16px; letter-spacing: 0; }
  body.paper-nail .nh-pn-main b + b::before { content: none; }
  body.paper-nail .nh-cta-row { flex-direction: column; align-items: stretch; gap: 10px; margin-top: 16px; }
  body.paper-nail a.nh-cta:not(.btn) { width: 100%; min-height: 54px; }
  body.paper-nail .nh-link { align-self: center; font-size: 14px; }
}

/* ---- メッセージ（手紙カードを 960px の 2 列に） ---- */
body.paper-nail .nail-letter.nh-2col { max-width: none; margin: 0; padding: 32px 36px; font-size: 16.5px; line-height: 1.95; }
body.paper-nail .nail-letter.nh-2col .nl-title { font-size: 26px; }
body.paper-nail .nail-letter .nl-kicker { font-size: 14px; }
body.paper-nail .ng-dialog .ng-close { font-size: 15px; }
body.paper-nail .nail-letter.nh-2col .nl-cta { text-align: left; }
body.paper-nail .nail-letter.nh-2col .nh-main { max-width: 62ch; }
@media (max-width: 899px) {
  body.paper-nail .nail-letter.nh-2col { gap: 0; padding: 24px 18px; font-size: 16px; line-height: 1.85; }
  body.paper-nail .nail-letter.nh-2col .nh-side, body.paper-nail .nail-letter.nh-2col .nh-main { display: contents; }
  body.paper-nail .nail-letter.nh-2col .nh-main > * { order: 2; }
  body.paper-nail .nail-letter.nh-2col .nl-cta { order: 3; margin-top: 8px; text-align: center; }
  body.paper-nail .nail-letter.nh-2col .nl-title { font-size: 24px; }
}

/* ---- 特長（冒頭に「こんな方へ」の付箋）・連携例 ---- */
body.paper-nail .nh-notes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 8px 0 0; }
body.paper-nail .nh-sticky-note { position: relative; margin: 0; padding: 18px 14px 14px; background: #FDF7F9; border: 1px solid var(--nh-sakura2); border-radius: 3px 3px 12px 3px; box-shadow: 0 2px 8px rgba(122, 53, 87, .08); font-family: "Klee One", "Noto Sans JP", sans-serif; font-weight: 600; font-size: 15.5px; line-height: 1.65; color: var(--nh-deep); }
body.paper-nail .nh-sticky-note::before { content: ""; position: absolute; top: -7px; left: 12px; width: 40px; height: 13px; background: rgba(245, 220, 230, .9); border: 1px solid rgba(201, 138, 166, .25); rotate: -4deg; }
body.paper-nail .nh-notes .nh-sticky-note:nth-child(odd) { rotate: -.5deg; }
body.paper-nail .nh-notes .nh-sticky-note:nth-child(even) { rotate: .5deg; }
body.paper-nail .nh-closing { margin: 22px 0 0; font-family: "Klee One", "Noto Sans JP", sans-serif; font-weight: 600; font-size: 17px; line-height: 1.9; color: var(--nh-grape); }
body.paper-nail .nh-feats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 28px; }
body.paper-nail .nh-feats.nh-feats-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 0; }
body.paper-nail .nh-feat { position: relative; padding: 24px; background: #FFFDFB; border: 1px solid var(--nh-line); border-top: 2px solid var(--nh-grape2); border-radius: 6px 6px 12px 6px; box-shadow: 0 2px 10px rgba(122, 53, 87, .06); }
body.paper-nail .nh-feat .nh-ico { display: block; width: 28px; height: 28px; margin: 0 0 10px; color: var(--nh-grape); }
body.paper-nail .nh-feat h3 { margin: 0 0 8px; font-family: "Klee One", "Noto Sans JP", sans-serif; font-weight: 600 !important; font-size: 18px; line-height: 1.55; color: var(--nh-deep); }
body.paper-nail .nh-feat p { margin: 0; font-size: 15.5px; line-height: 1.85; color: var(--nh-text); }
body.paper-nail .nh-feat .nh-feat-kicker { margin: 0 0 4px; font-size: 14px; font-weight: 700; letter-spacing: .06em; color: var(--nh-grape); }
body.paper-nail .nh-feat .nh-feat-link { margin-top: 10px; }
body.paper-nail .nh-feat a { color: var(--nh-grape); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 899px) {
  body.paper-nail .nh-notes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  body.paper-nail .nh-sticky-note { padding: 16px 12px 12px; }
  body.paper-nail .nh-feats, body.paper-nail .nh-feats.nh-feats-2 { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  body.paper-nail .nh-feat { padding: 20px 18px; }
  body.paper-nail .nh-feat:has(.nh-ico) { display: grid; grid-template-columns: 28px minmax(0, 1fr); column-gap: 12px; align-items: center; }
  body.paper-nail .nh-feat:has(.nh-ico) > * { grid-column: 2; }
  body.paper-nail .nh-feat:has(.nh-ico) > .nh-ico { grid-column: 1; grid-row: 1 / span 2; margin: 0; }
  body.paper-nail .nh-feat:has(.nh-ico) > h3:nth-child(2) { grid-row: 1 / span 2; margin: 0; }
  body.paper-nail .nh-feat:has(.nh-ico) > p:not(.nh-feat-kicker) { grid-column: 1 / -1; margin-top: 10px; }
  body.paper-nail .nh-feat:has(.nh-ico) > .nh-feat-kicker + h3 { margin: 0; }
}

/* ---- 料金 ---- */
body.paper-nail .nh-price-2col .nail-price-wrap { max-width: none; margin: 0; }
body.paper-nail .nh-sticky-note.nh-women { margin: 0; padding: 14px 16px 12px; font-family: "Noto Sans JP", sans-serif; font-size: 16px; rotate: -.5deg; }
body.paper-nail .nh-facility p { margin: 14px 0 0; font-size: 14.5px; line-height: 1.85; color: var(--nh-text); }
body.paper-nail .nh-notes-small { margin: 14px 0 0; font-size: 14px; line-height: 1.8; color: var(--nh-sub); }
@media (max-width: 899px) {
  body.paper-nail .nh-price-2col { gap: 0; }
  body.paper-nail .nh-price-2col > .nh-side, body.paper-nail .nh-price-2col > .nh-main { display: contents; }
  body.paper-nail .nh-price-2col .nh-head { order: 0; }
  body.paper-nail .nh-price-2col .nh-women { order: 1; margin-bottom: 18px; }
  body.paper-nail .nh-price-2col .nail-price-wrap { order: 2; }
  body.paper-nail .nh-price-2col .nh-facility { order: 3; }
  body.paper-nail .nh-price-2col .nh-notes-small { order: 4; }
}

/* ---- 流れ・対応エリア・リハビリとあわせて ---- */
body.paper-nail .nh-step { position: relative; display: flex; gap: 14px; align-items: flex-start; padding: 0 0 22px; }
body.paper-nail .nh-step:last-child { padding-bottom: 0; }
body.paper-nail .nh-step:not(:last-child)::after { content: ""; position: absolute; left: 18px; top: 42px; bottom: 6px; border-left: 1px dashed #C98AA6; }
body.paper-nail .nh-step-n { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 1.5px solid var(--nh-grape); border-radius: 50%; background: var(--nh-sakura); color: var(--nh-grape); font-family: "Klee One", "Noto Sans JP", sans-serif; font-weight: 600; font-size: 17px; line-height: 1; }
body.paper-nail .nh-step h3 { margin: 4px 0 4px; font-family: "Klee One", "Noto Sans JP", sans-serif; font-weight: 600 !important; font-size: 18px; line-height: 1.5; color: var(--nh-deep); }
body.paper-nail .nh-step p { margin: 0; font-size: 15.5px; line-height: 1.85; color: var(--nh-text); }
body.paper-nail .nh-area > p:not(.nh-kicker) { margin: 0 0 14px; font-size: 15.5px; line-height: 1.85; }
body.paper-nail .nh-rail { display: flex; flex-wrap: wrap; gap: 8px 0; margin: 4px 0 0; }
body.paper-nail .nh-rail span { position: relative; display: inline-block; padding: 3px 12px; border: 1.5px solid #E3A6BF; border-radius: 999px; background: #fff; font-size: 14px; font-weight: 700; line-height: 1.5; color: var(--nh-deep); }
body.paper-nail .nh-rail span + span { margin-left: 14px; }
body.paper-nail .nh-rail span + span::before { content: ""; position: absolute; left: -15.5px; top: 50%; width: 14px; border-top: 1.5px solid #C98AA6; }
body.paper-nail .nh-rail span.-all { background: var(--nh-sakura2); border-color: var(--nh-sakura2); }
body.paper-nail .nh-rail span.-all::before { display: none; }
body.paper-nail .nh-rehab { margin-top: 24px; padding: 16px 20px; border-left: 3px solid var(--nh-grape); border-radius: 0 8px 8px 0; background: rgba(251, 240, 244, .6); }
body.paper-nail .nh-rehab .nh-kicker { margin-bottom: 2px; }
body.paper-nail .nh-rehab h3 { margin: 0 0 6px; font-family: "Klee One", "Noto Sans JP", sans-serif; font-weight: 600 !important; font-size: 18px; line-height: 1.5; color: var(--nh-deep); }
body.paper-nail .nh-rehab p:not(.nh-kicker) { margin: 0; font-size: 15px; line-height: 1.85; color: var(--nh-text); }
body.paper-nail .nh-rehab a { color: var(--nh-grape); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }

/* ---- お問い合わせ・共同事業の 1 行 ---- */
body.paper-nail .cta-strip.nh-contact { padding: 48px 0; }
body.paper-nail #contact.nh-contact { padding: 48px 20px; }
body.paper-nail .nh-contact h2 { font-size: 28px !important; }
body.paper-nail .nh-contact p { font-size: 16px; }
body.paper-nail .cta-strip.nh-contact p { margin-bottom: 24px; }
body.paper-nail .nh-contact .btn-white { min-height: 52px; }
body.paper-nail .nh-contact p.nh-contact-price { margin: 16px 0 0; font-size: 14px; line-height: 1.7; word-break: auto-phrase; text-wrap: balance; color: var(--nh-deep) !important; }
body.paper-nail .joint-note { font-size: 14px; }
@media (max-width: 600px) {
  body.paper-nail .cta-strip.nh-contact { padding: 36px 0; }
  body.paper-nail #contact.nh-contact { padding: 36px 18px; }
  body.paper-nail .cta-strip.nh-contact .btn-row, body.paper-nail .cta-strip.nh-contact .btn-white { width: 100%; }
}

/* co.jp: 375px だけの固定お問い合わせボタン（480px スクロールで表示） */
body.paper-nail .nh-sticky { display: none; }
@media (max-width: 767px) {
  body.paper-nail .nh-sticky { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px)); background: rgba(255, 252, 252, .95); border-top: 1px solid var(--nh-line); box-shadow: 0 -6px 20px rgba(122, 53, 87, .12); transform: translateY(110%); transition: transform .3s ease; }
  body.paper-nail .nh-sticky.show { transform: none; }
  body.paper-nail .nh-sticky a.nh-cta:not(.btn) { display: flex; width: 100%; min-height: 56px; }
  body.paper-nail:has(#nhSticky) { padding-bottom: 72px; }
}

@media (prefers-reduced-motion: reduce) {
  body.paper-nail .nh-hero .nh-hero-head > *, body.paper-nail .nh-hero .nh-hero-body > *, body.paper-nail .nh-photo, body.paper-nail .nh-photo.-main .nh-ph img { animation: none !important; opacity: 1; translate: none; }
  body.paper-nail .nh-photo { transition: none; } body.paper-nail .nh-photo:hover, body.paper-nail .nh-photo:active { scale: none; }
  body.paper-nail .nh-sticky { transition: none; }
}
