@charset "UTF-8";
/* ==========================================================================
   実践栄養アカデミーLP 前半 [pna_top]（デザイン: さやさん / 2026-10）
   ・すべて .pna-top の内側だけに書く（後半のSWELLブロックや他のLPに効かせない）
   ・SWELLが .post_content の中のタグに付ける装飾を、下の「リセット」で打ち消している
   ・見た目は .pna-* のクラスにだけ付ける（タグだけのセレクタで見た目を付けない）
   ・768px 未満がSP。PCのカンプは 1920px 幅・コンテンツ 1100px
   ========================================================================== */

/* ---- トークン ---------------------------------------------------------- */
.pna-top {
	--pna-text: #4D4D4D;
	--pna-text-strong: #333333;
	--pna-text-sub: #666666;
	--pna-coral: #F77A61;
	--pna-pink: #FFB9AE;
	--pna-pink-pale: #FFD8D2;
	--pna-teal: #56C6B8;
	--pna-teal-deep: #469B8F;
	--pna-mint: #AEF4E7;
	--pna-yellow: #FCEE21;
	--pna-orange: #F2633D;
	--pna-beige: #EAE4DA;
	--pna-line: #343434;
	--pna-content: 1100px;
	--pna-gutter: 20px;
	--pna-font: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

/* ---- 全幅（LPのコンテンツ幅900pxからはみ出させる） ------------------------ */
.pna-top.pna-top {
	position: relative;
	width: 100vw;
	max-width: none;
	margin: 0 calc(50% - 50vw);
	padding: 0;
	overflow-x: clip;
	box-sizing: border-box;
	font-family: var(--pna-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.8;
	letter-spacing: .05em;
	color: var(--pna-text);
	text-align: left;
	overflow-wrap: break-word;
	-webkit-text-size-adjust: 100%;
}
/* スクロールバーのある環境での 100vw のはみ出しは、SWELL が body・#body_wrap の overflow-x:clip で切っている。
   本文の入れ物（幅900px）で切ると前半が真ん中しか見えなくなるので、ここでは切らない */

/* ---- リセット（SWELLの .post_content の装飾を打ち消す） ---------------------
   ⚠ SWELL は「.post_content div > :first-child { margin-top: 0 !important }」
      「.post_content div > :last-child { margin-bottom: 0 !important }」を持つ。
      div の最初の子の margin-top・最後の子の margin-bottom は効かないので、間隔は padding か親の gap で取る。
      （効かせてしまうと lp-build の干渉テスト test-interference.php が FAIL で知らせる） */
.pna-top.pna-top *,
.pna-top.pna-top *::before,
.pna-top.pna-top *::after { box-sizing: border-box; }
.pna-top.pna-top :where(h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, figure, figcaption, table, thead, tbody, tr, th, td, blockquote, hr, small, strong, em, span, a, img, button) {
	margin: 0; padding: 0; border: 0; background: none; box-shadow: none; border-radius: 0;
	font: inherit; color: inherit; letter-spacing: inherit; line-height: inherit; text-align: inherit;
	list-style: none; text-decoration: none; text-shadow: none; position: static;
}
.pna-top.pna-top :where(h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, table, th, td, blockquote, a)::before,
.pna-top.pna-top :where(h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, table, th, td, blockquote, a)::after { content: none; }
.pna-top.pna-top :where(table) { width: auto; border-collapse: collapse; border-spacing: 0; table-layout: auto; }
.pna-top.pna-top :where(th, td) { width: auto; vertical-align: top; font-weight: inherit; }
.pna-top.pna-top :where(h1, h2, h3, h4, h5, h6) { z-index: auto; }
.pna-top.pna-top :where(strong) { font-weight: 700; }
.pna-top.pna-top :where(img) { display: block; max-width: 100%; height: auto; }

/* ---- 共通の箱 ---------------------------------------------------------- */
.pna-top .pna-sec { position: relative; }
.pna-top .pna-inner { width: min(var(--pna-content), 100% - var(--pna-gutter) * 2); margin-inline: auto; position: relative; }
.pna-top .pna-missing { display: block; width: 100%; aspect-ratio: 3 / 4; } /* 書き出し待ちの部品（場所だけ確保。design/書き出し依頼リスト.md） */
.pna-top.pna-top .pna-sr { position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pna-top .pna-grid-bg {
	background-color: #fff;
	background-image: linear-gradient(#E3F4F1 1px, transparent 1px), linear-gradient(90deg, #E3F4F1 1px, transparent 1px);
	background-size: 22px 22px;
}

/* ---- 申込ボタン -------------------------------------------------------- */
.pna-top .pna-btn {
	display: flex; align-items: center; justify-content: center; gap: 1.6em; position: relative;
	width: min(730px, 100%); min-height: 105px; margin-inline: auto; padding: .4em 1.2em;
	border: 2px solid #E5571E; border-radius: 14px; color: #fff; font-weight: 700; font-size: 34px; letter-spacing: .08em; line-height: 1.3;
	background: linear-gradient(to bottom, #FF8A2E 0%, #F05A14 100%);
	box-shadow: 0 7px 0 #D82E00;
	transition: transform .2s, box-shadow .2s;
}
.pna-top .pna-btn:hover { transform: translateY(3px); box-shadow: 0 4px 0 #D82E00; }
.pna-top .pna-btn__label { text-align: center; }
.pna-top .pna-btn__arrow { width: 52px; height: 52px; border-radius: 50%; background: #FFE3D2; position: relative; flex: none; }
.pna-top .pna-btn__arrow::before { content: ""; position: absolute; top: 50%; left: 14px; width: 22px; height: 3px; margin-top: -1.5px; background: #F05A14; border-radius: 2px; }
.pna-top .pna-btn__arrow::after { content: ""; position: absolute; top: 50%; left: 24px; width: 12px; height: 12px; margin-top: -7.5px; border-top: 3px solid #F05A14; border-right: 3px solid #F05A14; transform: rotate(45deg); }

@media (max-width: 767.98px) {
	.pna-top .pna-btn { width: min(348px, 100% - 26px); min-height: 57px; font-size: 20px; border-radius: 9px; box-shadow: 0 4px 0 #D82E00; gap: 1.2em; }
	.pna-top .pna-btn__arrow { width: 28px; height: 28px; }
	.pna-top .pna-btn__arrow::before { left: 7px; width: 13px; height: 2px; margin-top: -1px; }
	.pna-top .pna-btn__arrow::after { left: 13px; width: 7px; height: 7px; margin-top: -4px; border-width: 2px; }
}

/* ---- PC/SP の出し分け --------------------------------------------------- */
/* 出し分けは他の display 指定より必ず強くする（ドット等が後から display を指定しても消えるように） */
@media (min-width: 768px) { .pna-top .pna-sp { display: none !important; } }
@media (max-width: 767.98px) { .pna-top .pna-pc { display: none !important; } }
.pna-top .pna-nowrap { white-space: nowrap; }

/* ==========================================================================
   FV（デザイナー書き出しの完成画像 PC: 1920×960 相当 ／ SP: 1125×1685）
   画像の下に申込ボタン。ボタンの位置は完成版 PNG（PC 1238 / SP 2031 の高さ）に合わせる
   ========================================================================== */
.pna-top .pna-fv { container-type: inline-size; background: #4BC9B4; overflow: hidden; }
.pna-top .pna-fv__visual { display: block; }
.pna-top .pna-fv__img { display: block; width: 100%; max-width: none; height: auto; aspect-ratio: 2 / 1; object-fit: cover; object-position: 50% 0; }
.pna-top .pna-fv__cta { position: relative; z-index: 1; padding: clamp(30px, 3.125cqw, 60px) 0 clamp(40px, 5.47cqw, 105px); }
@media (max-width: 767.98px) {
	.pna-top .pna-fv__img { aspect-ratio: 2250 / 3370; }
	.pna-top .pna-fv__cta { padding: 5.33cqw 0 10cqw; }
}

/* ==========================================================================
   CTA（HP版.ai 6面目 1920×570 ／ SP版.ai 7面目 1125×800）
   ========================================================================== */
.pna-top .pna-cta { background: #59D3BC; padding: 138px 0 100px; }
.pna-top .pna-cta__inner { text-align: center; }
.pna-top .pna-cta__lead { font-size: 44px; font-weight: 700; line-height: 1.52; letter-spacing: .14em; color: var(--pna-text-strong); margin-bottom: 92px; }
.pna-top .pna-cta__sparkle { position: absolute; width: 110px; }
.pna-top .pna-cta__sparkle--l { left: calc(50% - 490px); top: -28px; }
.pna-top .pna-cta__sparkle--r { left: calc(50% + 370px); top: -28px; }
@media (max-width: 767.98px) {
	.pna-top .pna-cta { padding: 40px 0 38px; }
	.pna-top .pna-cta__inner { width: 100%; }
	.pna-top .pna-cta__lead { font-size: 20px; letter-spacing: .1em; margin-bottom: 26px; }
	.pna-top .pna-cta__sparkle { width: 38px; }
	.pna-top .pna-cta__sparkle--l { left: -6px; top: -26px; }
	.pna-top .pna-cta__sparkle--r { left: auto; right: -6px; top: -26px; }
}

/* ---- 共通: ドット・マーカー ---------------------------------------------- */
.pna-top .pna-dots { position: absolute; display: block; background-size: 2cqi 2cqi; }
.pna-top .pna-dots--white { background-image: radial-gradient(circle, #fff 0 32%, transparent 34%); }
.pna-top .pna-dots--black { background-image: radial-gradient(circle, #333 0 28%, transparent 30%); }
.pna-top .pna-marker { font-weight: 700; background: linear-gradient(transparent 12%, #FFEC3B 12%, #FFEC3B 94%, transparent 94%); }

/* ==========================================================================
   実践栄養アカデミーとは？（HP版.ai 3面目 0〜1150 ／ SP版.ai 2面目 0〜1990）
   下端は V 字。次の「生活はこう変わる！」が下に 150px もぐり込む
   ========================================================================== */
.pna-top .pna-about { position: relative; z-index: 2; padding: 100px 0 150px; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 150px), 50% 100%, 0 calc(100% - 150px)); }
.pna-top .pna-about__inner { text-align: center; }
.pna-top .pna-about__emblem { width: 190px; margin: 0 auto; }
.pna-top .pna-about__title { display: flex; justify-content: center; align-items: flex-end; gap: 2px; margin-top: 42px; }
.pna-top .pna-about__title-img { width: min(635px, 100% - 150px); }
.pna-top .pna-about__title-small { flex: none; white-space: nowrap; font-size: 44px; font-weight: 700; line-height: 1; color: var(--pna-text); padding-bottom: 6px; }
.pna-top .pna-about__lead { margin-top: 46px; font-size: 22px; line-height: 1.91; letter-spacing: .06em; color: #000; }
.pna-top .pna-about__band {
	position: relative; display: flex; align-items: center; justify-content: center;
	width: 728px; max-width: 100%; height: 77px; margin: 62px auto 0;
	background: var(--pna-teal); border: 3px solid #333; border-radius: 4px;
}
.pna-top .pna-about__band::after { content: ""; position: absolute; left: 50%; bottom: -13px; width: 22px; height: 22px; margin-left: -11px; background: var(--pna-teal); border-right: 3px solid #333; border-bottom: 3px solid #333; transform: rotate(45deg); }
.pna-top .pna-about__band .pna-svg { width: 620px; max-width: 92%; }
.pna-top .pna-about__tags { position: relative; width: 675px; max-width: 100%; margin: 70px auto 0; aspect-ratio: 675 / 308; container-type: inline-size; }
.pna-top .pna-about__bubbles { position: absolute; inset: 0; }
.pna-top .pna-about__tag { position: absolute; top: 0; width: 18.96cqi; }
.pna-top .pna-about__tag--1 { left: 4.44cqi; }
.pna-top .pna-about__tag--2 { left: 29.78cqi; }
.pna-top .pna-about__tag--3 { left: 54.81cqi; }
.pna-top .pna-about__tag--4 { left: 79.7cqi; }
.pna-top .pna-about__bubble {
	position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 1; border-radius: 50%;
	border: 2px dotted #4D4D4D; background: #fff; font-size: 3.11cqi; font-weight: 700; line-height: 1.33; color: #000; letter-spacing: .04em;
}
.pna-top .pna-about__bubble::after { content: ""; position: absolute; left: 50%; top: 100%; width: 2px; height: 5.6cqi; margin-left: -1px; background: repeating-linear-gradient(to bottom, #4D4D4D 0 2px, transparent 2px 6px); }
.pna-top .pna-about__people { position: absolute; left: 0; top: 21.2cqi; width: 100%; }

@media (max-width: 767.98px) {
	.pna-top .pna-about { padding: 37px 0 66px; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 31px), 50% 100%, 0 calc(100% - 31px)); }
	.pna-top .pna-about__emblem { width: 102px; }
	.pna-top .pna-about__title { margin-top: 22px; }
	.pna-top .pna-about__title-img { width: min(268px, 100% - 62px); }
	.pna-top .pna-about__title-small { font-size: 18.6px; padding-bottom: 3px; }
	.pna-top .pna-about__lead { margin-top: 22px; font-size: 14px; line-height: 1.84; letter-spacing: .04em; }
	.pna-top .pna-about__band { width: calc(100% + 13px); max-width: none; margin: 34px -6.5px 0; height: 73px; }
	.pna-top .pna-about__band .pna-svg { width: 220px; }
	.pna-top .pna-about__tags { width: min(375px, 100% + 40px); max-width: none; margin: 27px 0 0; left: 50%; transform: translateX(-50%); aspect-ratio: 375 / 165; } /* 画面幅に対して中央。375px を超える幅でも中央に置く */
	.pna-top .pna-about__tag { width: 17.3cqi; }
	.pna-top .pna-about__tag--1 { left: 6.93cqi; }
	.pna-top .pna-about__tag--2 { left: 30.49cqi; }
	.pna-top .pna-about__tag--3 { left: 54.31cqi; }
	.pna-top .pna-about__tag--4 { left: 78.22cqi; }
	.pna-top .pna-about__bubble { font-size: 2.92cqi; border-width: 2px; }
	.pna-top .pna-about__bubble::after { height: 6.5cqi; }
	.pna-top .pna-about__people { left: 4.09cqi; top: 23.5cqi; width: 88.1cqi; }
}

/* ==========================================================================
   生活はこう変わる！（HP版.ai 3面目 1000〜3050 ／ SP版.ai 2面目 1898〜5871）
   図の部分は .pna-inner（PC 1100px）の幅を基準にした cqi で .ai の座標を換算: px / 11 = cqi
   SP は内側（335px＝.ai 1005）基準: (x - 60) / 10.05 = cqi
   ========================================================================== */
.pna-top .pna-change { background: #FFEC3B; margin-top: -150px; padding: 265px 0 75px; }
.pna-top .pna-change__inner { container-type: inline-size; }
.pna-top .pna-change__title { width: 80cqi; margin: 0 auto; }
.pna-top .pna-change__title .pna-svg { width: 100%; }
.pna-top .pna-change__intro { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); min-height: 59.36cqi; margin-top: 9.1cqi; }
/* 部品は全部同じマスに重ね、margin で .ai の位置に置く（絶対位置にしないので、学べることが増えれば箱が伸びる） */
.pna-top .pna-change__intro > * { grid-area: 1 / 1; position: relative; align-self: start; justify-self: start; }
.pna-top .pna-change__lead { margin-left: 5cqi; padding-top: 2.3cqi; font-size: 2.18cqi; font-weight: 700; line-height: 1.75; letter-spacing: .1em; color: var(--pna-text-strong); }
.pna-top .pna-dots--white { position: absolute; left: -24.73cqi; top: 5.27cqi; width: 20.18cqi; height: 10cqi; }
.pna-top .pna-change__photo { margin-left: 54.27cqi; width: 46.18cqi; height: 30.82cqi; max-width: none; object-fit: cover; border-radius: 1.8cqi; }
.pna-top .pna-dots--black { position: absolute; left: 92.73cqi; top: 25cqi; width: 10.45cqi; height: 20.18cqi; z-index: 1; }
.pna-top .pna-change__learnbox { margin-top: 27.09cqi; width: 64.36cqi; min-height: 32.27cqi; background: var(--pna-teal); border-radius: 1.4cqi; padding: 4.3cqi 3.6cqi 2.2cqi 5cqi; z-index: 2; }
.pna-top .pna-change__learn-title {
	position: absolute; left: 18.09cqi; top: -2.55cqi; width: 28.36cqi; height: 5.64cqi; display: flex; align-items: center; justify-content: center;
	background: #fff; border: .27cqi solid var(--pna-teal); border-radius: 99px; font-size: 3.18cqi; font-weight: 700; color: var(--pna-text-strong); letter-spacing: .1em; line-height: 1;
}
.pna-top .pna-change__learn { position: relative; padding: 1.85cqi 0 1.85cqi 6.27cqi; font-size: 2.55cqi; font-weight: 700; line-height: 1.5; color: #fff; letter-spacing: .1em; border-bottom: .18cqi dashed rgba(255, 255, 255, .75); }
.pna-top .pna-change__learn:last-child { border-bottom: 0; }
.pna-top .pna-change__learn::before { content: ""; position: absolute; left: 0; top: 50%; width: 3.64cqi; height: 3.64cqi; margin-top: -1.82cqi; border-radius: 50%; background: rgba(255, 255, 255, .55); }
.pna-top .pna-change__learn::after { content: ""; position: absolute; left: 1.1cqi; top: 50%; width: 1.5cqi; height: .8cqi; margin-top: -.6cqi; border-left: .3cqi solid #fff; border-bottom: .3cqi solid #fff; transform: rotate(-45deg); }

.pna-top .pna-know { position: relative; width: 100.9cqi; margin: 4.45cqi 0 0 -.45cqi; padding-bottom: 1.4cqi; background: #fff; border: .45cqi solid #333; border-radius: 1.8cqi; }
.pna-top .pna-know__head { display: flex; justify-content: center; align-items: center; height: 9.91cqi; background: #EF8137; border-radius: 1.35cqi 1.35cqi 0 0; }
.pna-top .pna-know__head .pna-img { width: 72.7cqi; }
.pna-top .pna-know__body { position: relative; container-type: inline-size; margin: 0 .45cqi 0; }
.pna-top .pna-know__figure { width: 100%; }
/* 図の上に重ねる文字（PC: 図 1090×640 の中の位置。.ai の座標から換算） */
.pna-top .pna-know__item, .pna-top .pna-know__note, .pna-top .pna-know__summary, .pna-top .pna-know__badge { position: absolute; }
.pna-top .pna-know__q { font-size: 1.93cqi; font-weight: 700; line-height: 1.43; color: var(--pna-text-sub); text-align: center; letter-spacing: .05em; }
.pna-top .pna-know__item { transform: translateX(-50%); white-space: nowrap; }
.pna-top .pna-know__item--nutrition  { left: 15.1cqi; top: 19.4cqi; }
.pna-top .pna-know__item--psychology { left: 83.9cqi; top: 24.5cqi; }
.pna-top .pna-know__item--meal       { left: 21.6cqi; top: 46.6cqi; }
.pna-top .pna-know__note { left: 77.1cqi; top: .7cqi; font-size: 1.56cqi; font-weight: 700; line-height: 1.35; color: var(--pna-text-sub); white-space: nowrap; }
.pna-top .pna-know__summary { left: 54.4cqi; top: 38.4cqi; width: 41.5cqi; font-size: 2.02cqi; font-weight: 700; line-height: 1.73; letter-spacing: .1em; color: var(--pna-text); }
.pna-top .pna-know__badge { left: 48.7cqi; top: 33.6cqi; width: 4.6cqi; text-align: center; }
.pna-top .pna-know__mark { font-size: 3.03cqi; font-weight: 700; line-height: 1; color: #333; }

@media (max-width: 767.98px) {
	.pna-top .pna-change { margin-top: -31px; padding: 71px 0 37px; }
	.pna-top .pna-change__title { width: 102.4cqi; margin-left: -1.4cqi; }
	.pna-top .pna-change__intro { min-height: 133.6cqi; margin-top: 5.5cqi; }
	.pna-top .pna-change__lead { justify-self: stretch; margin-left: 0; padding-top: 0; text-align: center; font-size: 4.38cqi; line-height: 1.66; }
	.pna-top .pna-dots--white { left: auto; right: -6cqi; top: 4cqi; width: 9.45cqi; height: 21.4cqi; background-size: 4.7cqi 4.7cqi; }
	.pna-top .pna-change__photo { margin: 31cqi 0 0 25.4cqi; width: 80.6cqi; height: 56.1cqi; border-radius: 6cqi 0 0 6cqi; }
	.pna-top .pna-dots--black { left: -6cqi; top: 46.8cqi; width: 27.9cqi; height: 17.4cqi; background-size: 4.6cqi 4.6cqi; }
	.pna-top .pna-change__learnbox { margin: 82.6cqi 0 0 -6cqi; width: 101cqi; min-height: 51cqi; border-radius: 0 6cqi 6cqi 0; padding: 7cqi 4cqi 3cqi 6.5cqi; }
	.pna-top .pna-change__learn-title { left: 28.6cqi; top: -3.3cqi; width: 43.9cqi; height: 8.3cqi; font-size: 4.98cqi; border-width: .8cqi; }
	.pna-top .pna-change__learn { padding: 3.2cqi 0 3.2cqi 10.8cqi; font-size: 4cqi; border-bottom-width: .5cqi; }
	.pna-top .pna-change__learn::before { width: 5.5cqi; height: 5.5cqi; margin-top: -2.75cqi; }
	.pna-top .pna-change__learn::after { left: 1.6cqi; width: 2.4cqi; height: 1.2cqi; margin-top: -.9cqi; border-width: .6cqi; }
	.pna-top .pna-know { width: 104cqi; margin: 7.4cqi 0 0 -2cqi; padding-bottom: 2cqi; border-width: 1.2cqi; border-radius: 4cqi; }
	.pna-top .pna-know__head { height: 33.33cqi; border-radius: 2.8cqi 2.8cqi 0 0; }
	.pna-top .pna-know__head .pna-img { width: 96.5cqi; }
	.pna-top .pna-know__body { margin: 0; }
	/* SP: 図 1035×1660 の中の位置 */
	.pna-top .pna-know__q { font-size: 3.53cqi; line-height: 1.45; }
	.pna-top .pna-know__item--nutrition  { left: 19.2cqi; top: 32.4cqi; }
	.pna-top .pna-know__item--psychology { left: 80.4cqi; top: 34.2cqi; }
	.pna-top .pna-know__item--meal       { left: 18.8cqi; top: 100cqi; }
	.pna-top .pna-know__note { left: 61.6cqi; top: 87cqi; font-size: 2.46cqi; }
	.pna-top .pna-know__summary { left: 42.7cqi; top: 114.3cqi; width: 42cqi; font-size: 3.71cqi; line-height: 1.73; letter-spacing: .08em; }
	.pna-top .pna-know__badge { left: 50.4cqi; top: 100cqi; width: 8cqi; }
	.pna-top .pna-know__mark { font-size: 5.4cqi; }
}

/* ==========================================================================
   こんな家族のピンチどうしてますか？（HP版.ai 5面目 1920×1732 ／ SP版.ai 3面目 1125×4306）
   PC: .pna-pinch__inner（1100px＝.ai x410〜1510）基準の cqi＝px/11
   SP: .pna-pinch__inner（335px＝SP .ai x60〜1065）基準の cqi＝(.ai - 60)/10.05
   ========================================================================== */
.pna-top .pna-pinch { background: #EDE6DA; overflow: hidden; }
.pna-top .pna-pinch__inner { container-type: inline-size; }
/* ⚠ container-type を持つ要素自身の cqi は親の基準で計算される。高さ・余白は子に持たせる */
.pna-top .pna-pinch__head { position: relative; height: 36.27cqi; padding-top: 8.64cqi; } /* 箱の上端（.ai y399）まで */
.pna-top .pna-pinch__title { position: absolute; left: 20.91cqi; top: 8.64cqi; width: 60cqi; }
.pna-top .pna-pinch__title .pna-svg { width: 100%; }
.pna-top .pna-pinch__family { position: absolute; left: 85.45cqi; top: 8.64cqi; width: 30.91cqi; max-width: none; }
.pna-top .pna-pinch__cols { display: flex; gap: 2cqi; }
.pna-top .pna-pinch__box { position: relative; flex: 1; min-height: 45.45cqi; padding: 6.6cqi 2.1cqi 2cqi 4.1cqi; background: #fff; border: .27cqi solid #333; border-radius: .9cqi; }
.pna-top .pna-pinch__label {
	position: absolute; left: 4.73cqi; top: -3.27cqi; width: 40cqi; height: 8.27cqi; display: flex; align-items: center; justify-content: center;
	background: #59D3BC; border: .27cqi solid #333; border-radius: .5cqi;
}
.pna-top .pna-pinch__box--child .pna-pinch__label { background: none; }
.pna-top .pna-pinch__label::after { content: ""; position: absolute; left: 50%; bottom: -1.05cqi; width: 1.8cqi; height: 1.8cqi; margin-left: -.9cqi; background: inherit; border-right: .27cqi solid #333; border-bottom: .27cqi solid #333; transform: rotate(45deg); }
.pna-top .pna-pinch__label .pna-svg { width: 28.18cqi; }
.pna-top .pna-pinch__item { position: relative; display: flex; align-items: center; min-height: 6cqi; padding: .6cqi 0 .6cqi 3.73cqi; border-bottom: 1px dashed #CCC; font-size: 2cqi; font-weight: 700; line-height: 1.5; color: var(--pna-text); letter-spacing: .04em; }
.pna-top .pna-pinch__item:last-child { border-bottom: 0; }
.pna-top .pna-pinch__item::before { content: ""; position: absolute; left: 0; top: 50%; width: 2.18cqi; height: 2.18cqi; margin-top: -1.09cqi; border-radius: 50%; background: #333; }
.pna-top .pna-pinch__item::after { content: ""; position: absolute; left: .62cqi; top: 50%; width: .95cqi; height: .5cqi; margin-top: -.4cqi; border-left: .22cqi solid #fff; border-bottom: .22cqi solid #fff; transform: rotate(-45deg); }
.pna-top .pna-pinch__box--child .pna-pinch__item::after { border-color: #FCEE21; }
.pna-top .pna-pinch__arrow { position: relative; display: block; width: 4.6cqi; height: 6.4cqi; margin: 1.6cqi auto 0; }
.pna-top .pna-pinch__arrow::before, .pna-top .pna-pinch__arrow::after { content: ""; position: absolute; left: 50%; width: 3.8cqi; height: 3.8cqi; margin-left: -1.9cqi; border-right: .36cqi solid #555; border-bottom: .36cqi solid #555; transform: rotate(45deg); }
.pna-top .pna-pinch__arrow::before { top: 0; border-color: #999; }
.pna-top .pna-pinch__arrow::after { top: 1.8cqi; }
.pna-top .pna-pinch__answer { position: relative; width: 95.82cqi; min-height: 46.18cqi; margin: 4.1cqi auto 17.45cqi; padding: 6.09cqi 0 3cqi; text-align: center; }
.pna-top .pna-pinch__answer::before, .pna-top .pna-pinch__answer::after { content: ""; position: absolute; top: -.3cqi; width: 7.27cqi; height: 8.18cqi; border-top: .36cqi solid #333; }
.pna-top .pna-pinch__answer::before { left: -.3cqi; border-left: .36cqi solid #333; }
.pna-top .pna-pinch__answer::after { right: -.3cqi; border-right: .36cqi solid #333; }
.pna-top .pna-pinch__answer-title { width: 65.45cqi; margin: 0 auto; }
.pna-top .pna-pinch__answer-title .pna-svg { width: 100%; }
.pna-top .pna-pinch__answer-body { margin-top: 1.27cqi; font-size: 2cqi; line-height: 2; letter-spacing: .1em; color: var(--pna-text-strong); }
.pna-top .pna-pinch__woman { position: absolute; left: -.82cqi; top: 137.6cqi; width: 19.82cqi; aspect-ratio: 218 / 214; }
.pna-top .pna-pinch__man { position: absolute; left: 81.82cqi; top: 122.7cqi; width: 22.73cqi; }
.pna-top .pna-pinch__inner { position: relative; }

@media (max-width: 767.98px) {
	.pna-top .pna-pinch__head { height: 84.78cqi; padding-top: 7.76cqi; }
	.pna-top .pna-pinch__family { left: 28.36cqi; top: 7.76cqi; width: 43.88cqi; }
	.pna-top .pna-pinch__title { left: 10.55cqi; top: 43.8cqi; width: 79.9cqi; }
	.pna-top .pna-pinch__cols { flex-direction: column; gap: 11.1cqi; }
	.pna-top .pna-pinch__box { margin-left: 2.39cqi; width: 95.22cqi; flex: none; min-height: 88.46cqi; padding: 10.1cqi 3cqi 3cqi 3.6cqi; border-width: 2px; border-radius: 2cqi; }
	.pna-top .pna-pinch__label { left: 9.25cqi; top: -6.47cqi; width: 77.91cqi; height: 16.22cqi; border-width: 2px; border-radius: 1cqi; }
	.pna-top .pna-pinch__label::after { bottom: -2cqi; width: 3.4cqi; height: 3.4cqi; margin-left: -1.7cqi; border-width: 2px; }
	.pna-top .pna-pinch__label .pna-svg { width: 54.9cqi; }
	.pna-top .pna-pinch__item { min-height: 11.69cqi; padding-left: 11.8cqi; font-size: 3.9cqi; letter-spacing: .02em; }
	.pna-top .pna-pinch__item::before { left: 1.2cqi; width: 5.2cqi; height: 5.2cqi; margin-top: -2.6cqi; }
	.pna-top .pna-pinch__item::after { left: 2.65cqi; width: 2.3cqi; height: 1.2cqi; margin-top: -1cqi; border-width: .5cqi; }
	.pna-top .pna-pinch__arrow { width: 10cqi; height: 13cqi; margin-top: 5.5cqi; }
	.pna-top .pna-pinch__arrow::before, .pna-top .pna-pinch__arrow::after { width: 6.5cqi; height: 6.5cqi; margin-left: -3.25cqi; border-width: .6cqi; }
	.pna-top .pna-pinch__arrow::after { top: 3.8cqi; }
	.pna-top .pna-pinch__answer { width: 102.79cqi; margin: 8.46cqi 0 27.4cqi -1.39cqi; min-height: 101.3cqi; padding-top: 9.45cqi; }
	.pna-top .pna-pinch__answer::before, .pna-top .pna-pinch__answer::after { width: 9cqi; height: 10cqi; border-width: .8cqi; }
	.pna-top .pna-pinch__answer-title { width: 86cqi; }
	.pna-top .pna-pinch__answer-body { margin-top: 9cqi; font-size: 4.18cqi; line-height: 1.83; letter-spacing: .06em; }
	.pna-top .pna-pinch__woman { left: -3.38cqi; top: 378.8cqi; width: 26.77cqi; }
	.pna-top .pna-pinch__man { left: 69.65cqi; top: 372cqi; width: 34.83cqi; }
}

/* ==========================================================================
   5つの特徴（HP版.ai 2面目 1920×5265 ／ SP版.ai 4面目 1125×10371）
   ========================================================================== */
.pna-top .pna-features {
	background-color: #FFEEEB;
	background-image: linear-gradient(rgba(247, 122, 97, .18) 1px, transparent 1px), linear-gradient(90deg, rgba(247, 122, 97, .18) 1px, transparent 1px);
	background-size: 22px 22px;
}
.pna-top .pna-features__inner { container-type: inline-size; }
.pna-top .pna-features__title { width: 76.82cqi; margin-left: 15.45cqi; }
.pna-top .pna-features__title .pna-svg { width: 100%; }
.pna-top .pna-feature { position: relative; display: flow-root; /* カードの margin-top が記事の外へ抜けない（番号の位置がずれる）ように */ }
.pna-top .pna-feature > .pna-feature__num, .pna-top .pna-feature > .pna-img, .pna-top .pna-feature > .pna-svg { position: absolute; z-index: 2; }
.pna-top .pna-feature__num { container-type: inline-size; }
.pna-top .pna-feature__num .pna-svg { width: 100%; }
.pna-top .pna-feature__point { position: absolute; writing-mode: vertical-rl; transform: rotate(180deg); font-family: "Barlow", var(--pna-font); font-weight: 600; font-size: 12.44cqw; /* 縦書きの cqi は縦方向になるので cqw */ line-height: 1; letter-spacing: .12em; color: #FFB9AE; }
.pna-top .pna-feature__photo { object-fit: cover; border-radius: 1.8cqi; max-width: none; }
.pna-top .pna-feature--05 .pna-feature__photo { object-fit: contain; border-radius: 0; box-shadow: 0 .5cqi 1.6cqi rgba(0, 0, 0, .15); }
.pna-top .pna-feature__card { position: relative; z-index: 1; background: #fff; border-radius: 8cqi; }
.pna-top .pna-feature--right .pna-feature__title .pna-svg { margin-left: auto; }
.pna-top .pna-feature__title .pna-svg { width: 100%; }
.pna-top .pna-feature__body { width: 49.8cqi; font-size: 2cqi; line-height: 2; letter-spacing: .08em; color: var(--pna-text); }
.pna-top .pna-feature__note { margin: 1.6cqi 0 0 9cqi; font-size: 1.64cqi; letter-spacing: .05em; color: var(--pna-text); }
.pna-top .pna-em { color: var(--pna-coral); font-weight: 700; }

/* 比較表（PC: .ai x476〜1444, y1426〜1846） */
.pna-top .pna-compare { display: flex; gap: 1.64cqi; width: 88cqi; margin: 6.55cqi auto 0; }
.pna-top .pna-compare__col { position: relative; flex: 1; min-height: 38.18cqi; border-radius: 1cqi; background: #fff; box-shadow: 0 .6cqi 1.8cqi rgba(247, 122, 97, .25); overflow: hidden; padding-bottom: 2.4cqi; text-align: center; }
.pna-top .pna-compare__col--general { background: #F2F2F2; }
.pna-top .pna-compare__head { display: flex; align-items: center; justify-content: center; height: 8cqi; background: #56C6B8; color: #fff; font-size: 2.36cqi; font-weight: 700; letter-spacing: .1em; }
.pna-top .pna-compare__col--general .pna-compare__head { background: #999; }
.pna-top .pna-compare__list { padding: 2.5cqi 3cqi 0 3.6cqi; text-align: left; }
.pna-top .pna-compare__list li { position: relative; padding-left: 1.2em; font-size: 1.82cqi; line-height: 2.1; color: var(--pna-text); font-weight: 700; letter-spacing: .05em; }
.pna-top .pna-compare__list li::before { content: "・"; position: absolute; left: 0; }
.pna-top .pna-compare__col--general .pna-compare__list li { font-weight: 400; }
.pna-top .pna-compare__arrow { position: relative; display: block; width: 3cqi; height: 3cqi; margin: .8cqi auto 1.6cqi; }
.pna-top .pna-compare__arrow::before, .pna-top .pna-compare__arrow::after { content: ""; position: absolute; left: 50%; width: 1.6cqi; height: 1.6cqi; margin-left: -.8cqi; border-right: .18cqi solid #56C6B8; border-bottom: .18cqi solid #56C6B8; transform: rotate(45deg); }
.pna-top .pna-compare__arrow::after { top: .9cqi; }
.pna-top .pna-compare__col--general .pna-compare__arrow::before, .pna-top .pna-compare__col--general .pna-compare__arrow::after { border-color: #999; }
.pna-top .pna-compare__result { font-size: 2cqi; font-weight: 700; line-height: 1.6; color: var(--pna-text); letter-spacing: .05em; }
.pna-top .pna-compare__col--general .pna-compare__result { color: var(--pna-text-sub); }

@media (max-width: 767.98px) {
	.pna-top .pna-features { background-size: 15px 15px; }
	.pna-top .pna-features__title { width: 107cqi; margin-left: 1.9cqi; padding-top: 0; }
	.pna-top .pna-feature__photo { border-radius: 6cqi; }
	.pna-top .pna-feature--01 .pna-feature__photo, .pna-top .pna-feature--03 .pna-feature__photo { border-radius: 6cqi 0 0 6cqi; }
	.pna-top .pna-feature--02 .pna-feature__photo, .pna-top .pna-feature--04 .pna-feature__photo { border-radius: 0 6cqi 6cqi 0; }
	.pna-top .pna-feature--05 .pna-feature__photo { border-radius: 0; }
	.pna-top .pna-feature--left .pna-feature__card { border-radius: 0 12cqi 12cqi 0; }
	.pna-top .pna-feature--right .pna-feature__card { border-radius: 12cqi 0 0 12cqi; }
	.pna-top .pna-feature__body { letter-spacing: .1em; }
	.pna-top .pna-feature__note { margin: 3cqi 0 0 5.6cqi; font-size: 3.2cqi; }
	.pna-top .pna-compare { width: 106.27cqi; margin: 6.17cqi 0 0 -2.89cqi; gap: 2.29cqi; }
	.pna-top .pna-compare__col { min-height: 104.7cqi; border-radius: 2cqi; }
	.pna-top .pna-compare__head { height: 12.9cqi; font-size: 3.86cqi; }
	.pna-top .pna-compare__list { padding: 3.5cqi 2.5cqi 0 3.6cqi; }
	.pna-top .pna-compare__list li { font-size: 3.78cqi; line-height: 1.58; margin-bottom: 2.4cqi; letter-spacing: .1em; }
	.pna-top .pna-compare__arrow { width: 6cqi; height: 6cqi; margin: 1cqi auto 4cqi; }
	.pna-top .pna-compare__arrow::before, .pna-top .pna-compare__arrow::after { width: 3.4cqi; height: 3.4cqi; margin-left: -1.7cqi; border-width: .4cqi; }
	.pna-top .pna-compare__arrow::after { top: 1.9cqi; }
	.pna-top .pna-compare__result { font-size: 3.69cqi; line-height: 1.59; }
}
/* ==========================================================================
   受講スタイル（HP版.ai 7面目 1920×1590 ／ SP版.ai 5面目 1125×3484）
   PC: .pna-styles__inner（1100px）基準の cqi＝px/11　SP: (.ai - 60)/10.05
   ========================================================================== */
.pna-top .pna-styles { background: var(--pna-coral); }
.pna-top .pna-styles__inner { container-type: inline-size; }
.pna-top .pna-styles__title { width: 47.27cqi; margin: 0 auto; padding-top: 12.27cqi; }
.pna-top .pna-styles__title .pna-svg { width: 100%; }
.pna-top .pna-styles__lead { padding-top: 1.27cqi; text-align: center; color: #fff; font-size: 2cqi; line-height: 2; letter-spacing: .1em; }
.pna-top .pna-styles__grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 3.64cqi; row-gap: 3.9cqi; padding: 9.45cqi .18cqi 12.7cqi; }
.pna-top .pna-style { position: relative; min-height: 47.45cqi; background: #fff; border-radius: 1.3cqi; overflow: hidden; box-shadow: 0 .8cqi 2.4cqi rgba(160, 60, 40, .22); }
.pna-top .pna-style--3, .pna-top .pna-style--4 { min-height: 40.8cqi; }
.pna-top .pna-style__head { position: relative; display: flex; align-items: center; height: 18.36cqi; padding-left: 4cqi; background: #FFD8D2; }
.pna-top .pna-style__title { position: relative; z-index: 1; font-size: 4cqi; font-weight: 700; line-height: 1.25; letter-spacing: .08em; color: var(--pna-text-strong); }
.pna-top .pna-style__icon { position: absolute; }
.pna-top .pna-style--1 .pna-style__icon { left: 31.64cqi; top: 1.73cqi; width: 14.55cqi; }
.pna-top .pna-style--2 .pna-style__icon { left: 30.36cqi; top: 3.09cqi; width: 15.45cqi; }
.pna-top .pna-style--3 .pna-style__icon { left: 33cqi; top: 2.18cqi; width: 13.64cqi; }
.pna-top .pna-style--4 .pna-style__icon { left: 32.45cqi; top: 1.55cqi; width: 14.91cqi; }
.pna-top .pna-style__items { padding: 1.6cqi 2.5cqi 2.5cqi 0; }
.pna-top .pna-style__item { position: relative; margin-top: 1.8cqi; padding-left: 7.9cqi; font-size: 2cqi; line-height: 1.5; letter-spacing: .06em; color: var(--pna-text); }
.pna-top .pna-style__item::before { content: ""; position: absolute; left: 4.1cqi; top: .5cqi; width: 2cqi; height: 2cqi; border-radius: 50%; background: #FFD8D2; }
.pna-top .pna-style__item::after { content: ""; position: absolute; left: 4.65cqi; top: 1.05cqi; width: .95cqi; height: .5cqi; border-left: .2cqi solid var(--pna-coral); border-bottom: .2cqi solid var(--pna-coral); transform: rotate(-45deg); }

@media (max-width: 767.98px) {
	.pna-top .pna-styles__title { width: 53cqi; padding-top: 15.4cqi; }
	.pna-top .pna-styles__lead { padding-top: 2.4cqi; font-size: 3.05cqi; line-height: 1.99; letter-spacing: .06em; }
	.pna-top .pna-styles__grid { grid-template-columns: 1fr; row-gap: 4.9cqi; padding: 11cqi 0 9.35cqi; }
	.pna-top .pna-style { min-height: 0; border-radius: 2.6cqi; }
	.pna-top .pna-style--1 { min-height: 78.9cqi; }
	.pna-top .pna-style--2 { min-height: 63.1cqi; }
	.pna-top .pna-style--3 { min-height: 61.3cqi; }
	.pna-top .pna-style--4 { min-height: 62.5cqi; }
	.pna-top .pna-style__head { height: 21.4cqi; padding-left: 3.6cqi; }
	.pna-top .pna-style__title { font-size: 6cqi; }
	.pna-top .pna-style__title br { display: none; }
	.pna-top .pna-style--1 .pna-style__icon { left: 75.3cqi; top: 1.4cqi; width: 20cqi; }
	.pna-top .pna-style--2 .pna-style__icon { left: 78.7cqi; top: 1.3cqi; width: 18.9cqi; }
	.pna-top .pna-style--3 .pna-style__icon { left: 79.8cqi; top: 3.9cqi; width: 16.5cqi; }
	.pna-top .pna-style--4 .pna-style__icon { left: 78.7cqi; top: 1.8cqi; width: 18.9cqi; }
	.pna-top .pna-style__items { padding: 2cqi 3cqi 4cqi 0; }
	.pna-top .pna-style__item { margin-top: 3.4cqi; padding-left: 17.3cqi; font-size: 4.26cqi; letter-spacing: .04em; }
	.pna-top .pna-style__item::before { left: 6.4cqi; top: .9cqi; width: 4.6cqi; height: 4.6cqi; }
	.pna-top .pna-style__item::after { left: 7.6cqi; top: 2.1cqi; width: 2.2cqi; height: 1.1cqi; border-width: .45cqi; }
}

/* ==========================================================================
   あこ紹介（HP版.ai 4面目 1920×940 ／ SP版.ai 6面目 1125×2345）
   ========================================================================== */
.pna-top .pna-ako { background: var(--pna-mint); }
.pna-top .pna-ako__inner { container-type: inline-size; }
.pna-top .pna-ako__card { position: relative; z-index: 1; width: 61cqi; min-height: 66.64cqi; margin: 0; padding: 5.9cqi 15cqi 5.5cqi 6.6cqi; background: #fff; border: .27cqi solid #333; border-radius: 1.8cqi; }
.pna-top .pna-ako__photo { position: absolute; z-index: 2; left: 53.45cqi; top: 7.55cqi; width: 46.82cqi; height: 61.91cqi; max-width: none; object-fit: cover; border: .27cqi solid #333; border-radius: 1.8cqi; }
.pna-top .pna-ako__inner::before { content: ""; display: block; height: 11.9cqi; } /* 上の余白（カードの上端 .ai y131） */
.pna-top .pna-ako__inner::after { content: ""; display: block; height: 6.9cqi; }  /* 下の余白 */
.pna-top .pna-ako__badge { display: inline-block; padding: .35cqi 1.2cqi; background: #4BC9B4; color: #fff; font-size: 1.88cqi; font-weight: 700; letter-spacing: .1em; line-height: 1.5; }
.pna-top .pna-ako__count { margin-top: 1.5cqi; font-size: 1.88cqi; font-weight: 700; letter-spacing: .06em; color: var(--pna-text); }
.pna-top .pna-ako__num { font-size: 3.1cqi; letter-spacing: .04em; margin: 0 .2em; }
.pna-top .pna-ako__mark { font-weight: 400; }
.pna-top .pna-ako__lead { margin-top: 1.2cqi; font-size: 4cqi; font-weight: 700; line-height: 1.36; letter-spacing: .06em; color: var(--pna-text-strong); }
.pna-top .pna-ako__lead-em { color: #4BC9B4; margin-left: -.5em; }
.pna-top .pna-ako__body { margin-top: 3.3cqi; width: 42.7cqi; font-size: 1.82cqi; line-height: 1.9; letter-spacing: .1em; color: var(--pna-text); }
.pna-top .pna-ako__note { margin-top: 1.6cqi; width: 42.7cqi; font-size: 1.45cqi; line-height: 1.75; color: var(--pna-text); }

@media (max-width: 767.98px) {
	.pna-top .pna-ako { overflow: hidden; }
	.pna-top .pna-ako__inner::before { height: 84.8cqi; }
	.pna-top .pna-ako__inner::after { height: 10.1cqi; }
	.pna-top .pna-ako__en { position: absolute; left: -5.97cqi; top: 0; width: 43.78cqi; }
	.pna-top .pna-ako__dots { position: absolute; left: 21cqi; top: 45cqi; width: 15cqi; height: 21cqi; background-size: 4.4cqi 4.4cqi; }
	.pna-top .pna-ako__photo { left: 37.81cqi; top: 7.66cqi; width: 67.86cqi; height: 89.65cqi; border-width: 2px; border-radius: 4cqi 0 0 4cqi; z-index: 1; }
	.pna-top .pna-ako__card { z-index: 2; width: 103.48cqi; margin-left: -5.97cqi; min-height: 138.41cqi; padding: 10cqi 6cqi 6cqi 11.2cqi; border-width: 2px; border-left: 0; border-radius: 0 4cqi 4cqi 0; }
	.pna-top .pna-ako__badge { font-size: 3.19cqi; padding: .4cqi 1.6cqi; }
	.pna-top .pna-ako__count { font-size: 3.19cqi; margin-top: 2cqi; }
	.pna-top .pna-ako__num { font-size: 5.2cqi; }
	.pna-top .pna-ako__lead { font-size: 6.5cqi; margin-top: 2cqi; line-height: 1.4; }
	.pna-top .pna-ako__body { width: auto; margin-top: 6cqi; font-size: 4.18cqi; line-height: 1.83; letter-spacing: .06em; }
	.pna-top .pna-ako__note { width: auto; margin-top: 4cqi; font-size: 3.48cqi; line-height: 1.46; }
}

/* ---- 書き出し差し替え（2026-10-07 さやさん書き出し） ------------------------ */
/* ピンチのタブ: 形と文字ごと画像（PC・SP共通） */
.pna-top .pna-pinch__label { height: auto; background: none; border: 0; border-radius: 0; }
.pna-top .pna-pinch__label::after { content: none; }
.pna-top .pna-pinch__label .pna-svg { width: 100%; }
.pna-top .pna-pinch__woman { left: -.45cqi; top: 126.27cqi; width: 18.64cqi; aspect-ratio: auto; }
/* 受講スタイルのカード見出し（画像）。位置は完成版 PNG から */
.pna-top .pna-style__title { position: absolute; }
.pna-top .pna-style__title .pna-svg { width: 100%; }
.pna-top .pna-style--1 .pna-style__title { left: 4.36cqi; top: 5.55cqi; width: 29.27cqi; }
.pna-top .pna-style--2 .pna-style__title { left: 5.18cqi; top: 5.36cqi; width: 24.73cqi; }
.pna-top .pna-style--3 .pna-style__title { left: 4.36cqi; top: 4.73cqi; width: 28.64cqi; }
.pna-top .pna-style--4 .pna-style__title { left: 5.82cqi; top: 5.27cqi; width: 28.64cqi; }
/* あこ紹介の見出し（画像） */
.pna-top .pna-ako__lead .pna-svg { width: 37.82cqi; }
/* 特徴01 の鍋（PC） */
.pna-top .pna-feature__pot { left: 98.73cqi; top: 46.82cqi; width: 15.45cqi; }
@media (max-width: 767.98px) {
	.pna-top .pna-pinch__woman { left: -3.08cqi; top: 381.29cqi; width: 28.46cqi; }
	.pna-top .pna-pinch__man { left: 73.23cqi; top: 379.01cqi; width: 30.75cqi; }
	.pna-top .pna-style--1 .pna-style__title { left: 6.57cqi; top: 8.56cqi; width: 57.91cqi; }
	.pna-top .pna-style--2 .pna-style__title { left: 8.06cqi; top: 8.36cqi; width: 62.29cqi; }
	.pna-top .pna-style--3 .pna-style__title { left: 6.77cqi; top: 7.86cqi; width: 81.49cqi; }
	.pna-top .pna-style--4 .pna-style__title { left: 7.66cqi; top: 8.16cqi; width: 75.02cqi; }
	.pna-top .pna-ako__lead .pna-svg { width: 63.88cqi; }
	.pna-top.pna-top .pna-sr-sp { position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } /* SP では画像に置き換えて、文字は読み上げ用だけにする */
	.pna-top .pna-cta__lead .pna-svg { width: 61.16%; margin: 0 auto; }
}

/* 方眼（完成版 PNG から実測: PC 28.35px / SP 9.45px。特徴は PC 27.7px / SP 18.3px） */
.pna-top .pna-about { background-image: linear-gradient(#A8E5D4 1px, transparent 1px), linear-gradient(90deg, #A8E5D4 1px, transparent 1px); background-size: 28.35px 28.35px; background-position: 27px 21px; }
.pna-top .pna-pinch__answer { background-image: linear-gradient(#E9F8F4 1px, transparent 1px), linear-gradient(90deg, #E9F8F4 1px, transparent 1px); background-size: 28.35px 28.35px; }
.pna-top .pna-features { background-image: linear-gradient(#FAC6C1 1px, transparent 1px), linear-gradient(90deg, #FAC6C1 1px, transparent 1px); background-size: 27.7px 27.7px; }
.pna-top .pna-about__lead { margin-top: 79px; } /* 完成版はリード文の前が広い */
@media (max-width: 767.98px) {
	.pna-top .pna-about { background-size: 9.45px 9.45px; background-position: 8px 7px; }
	.pna-top .pna-pinch__answer { background-size: 9.45px 9.45px; }
	.pna-top .pna-features { background-size: 18.3px 18.3px; }
	.pna-top .pna-about__lead { margin-top: 22px; }
	.pna-top .pna-about__title { margin-top: 29px; }
}

/* 知識の図の上の文字（さやさん書き出しの SVG の文字位置から計算: 2026-10-07） */
.pna-top .pna-know__summary { left: 54.41cqi; top: 38.72cqi; width: 39.36cqi; line-height: 1.727; letter-spacing: 0.1em; }
.pna-top .pna-know__item--psychology { left: 84.01cqi; top: 23.90cqi; }
.pna-top .pna-know__item--nutrition { left: 15.45cqi; top: 18.57cqi; }
.pna-top .pna-know__item--meal { left: 21.53cqi; top: 46.13cqi; }
.pna-top .pna-know__badge { left: 48.36cqi; top: 33.32cqi; }
.pna-top .pna-know__note { left: 77.14cqi; top: 0.71cqi; line-height: 1.352; }
@media (max-width: 767.98px) {
	.pna-top .pna-know__summary { left: 42.75cqi; top: 109.21cqi; width: 48.69cqi; line-height: 1.729; letter-spacing: 0.1em; }
	.pna-top .pna-know__item--psychology { left: 80.50cqi; top: 29.78cqi; }
	.pna-top .pna-know__badge { left: 63.94cqi; top: 96.87cqi; }
	.pna-top .pna-know__note { left: 61.63cqi; top: 82.43cqi; line-height: 1.360; }
	.pna-top .pna-know__item--meal { left: 19.30cqi; top: 94.91cqi; }
	.pna-top .pna-know__item--nutrition { left: 19.51cqi; top: 27.41cqi; }
}
.pna-top .pna-know__head { position: relative; }
.pna-top .pna-know__head::after { content: ""; position: absolute; left: 50%; top: 100%; z-index: 1; width: 0; height: 0; margin-left: -1.1cqi; border: 1.1cqi solid transparent; border-top: 1.4cqi solid #EF8137; border-bottom: 0; }
@media (max-width: 767.98px) { .pna-top .pna-know__head::after { margin-left: -2.6cqi; border-width: 3.2cqi 2.6cqi 0; border-top-color: #EF8137; } }
/* SP の CTA（完成版 SP 7面: 1125×801） */
@media (max-width: 767.98px) {
	.pna-top .pna-cta { padding: 48.5px 0 30px; }
	.pna-top .pna-cta__lead { margin-bottom: 36px; }
	.pna-top .pna-cta__spk { position: absolute; }
	.pna-top .pna-cta__spk--l { left: calc(50% - 187.5px + 16.7px); top: 39px; width: 32.7px; }
	.pna-top .pna-cta__spk--r { left: calc(50% - 187.5px + 315px); top: -15px; width: 47px; }
}
/* SP の本文の字間（完成版に合わせる） */
@media (max-width: 767.98px) {
	.pna-top .pna-feature__body { letter-spacing: .1em; }
	.pna-top .pna-feature--03 .pna-feature__note { display: none; } /* 完成版の SP には無い */
	.pna-top .pna-styles__grid { row-gap: 5.4cqi; padding-top: 16.4cqi; }
	.pna-top .pna-style__items { padding-top: 3.4cqi; }
	.pna-top .pna-compare__list li { letter-spacing: .14em; }
	.pna-top .pna-compare__result { letter-spacing: .08em; }
}

/* --- PC（自動計算: lp-build/tools/gen_features_css.py。HP版.ai の座標 → cqi） --- */
.pna-top .pna-feature--01 { margin-top: 1cqi; }
.pna-top .pna-feature--01 .pna-feature__card { margin: 9cqi 0 0 0cqi; width: 70.18cqi; min-height: 65.82cqi; padding: 11.36cqi 0 8.18cqi; }
.pna-top .pna-feature--01 .pna-feature__title { margin-left: 9.55cqi; width: 33.64cqi; }
.pna-top .pna-feature--01 .pna-feature__body { margin: 4.36cqi 0 0 9.09cqi; }
.pna-top .pna-feature--01 .pna-feature__num { left: 8.45cqi; top: 0cqi; width: 19cqi; }
.pna-top .pna-feature--01 .pna-feature__point { left: 21.05%; top: 26.98%; }
.pna-top .pna-feature--01 .pna-feature__photo { left: 52.36cqi; top: 3.64cqi; width: 47.36cqi; height: 31.09cqi; }
.pna-top .pna-feature--01 .pna-feature__illust { left: 62.27cqi; top: 39cqi; width: 51.82cqi; }
.pna-top .pna-feature--02 { margin-top: 5cqi; }
.pna-top .pna-feature--02 .pna-feature__card { margin: 9cqi 0 0 29.82cqi; width: 70.18cqi; min-height: 58.55cqi; padding: 11.36cqi 0 8.18cqi; }
.pna-top .pna-feature--02 .pna-feature__title { margin-left: 25.64cqi; width: 34.09cqi; }
.pna-top .pna-feature--02 .pna-feature__body { margin: 4.82cqi 0 0 9cqi; }
.pna-top .pna-feature--02 .pna-feature__num { left: 67.18cqi; top: 0cqi; width: 22.91cqi; }
.pna-top .pna-feature--02 .pna-feature__point { left: 17.46%; top: 26.98%; }
.pna-top .pna-feature--02 .pna-feature__photo { left: -0.18cqi; top: 2.91cqi; width: 47.27cqi; height: 31.09cqi; }
.pna-top .pna-feature--02 .pna-feature__illust { left: 8.64cqi; top: 41.73cqi; width: 26.36cqi; }
.pna-top .pna-feature--03 { margin-top: 7cqi; }
.pna-top .pna-feature--03 .pna-feature__card { margin: 9cqi 0 0 0cqi; width: 74.55cqi; min-height: 70.27cqi; padding: 10.91cqi 0 8.18cqi; }
.pna-top .pna-feature--03 .pna-feature__title { margin-left: 9.27cqi; width: 34.36cqi; }
.pna-top .pna-feature--03 .pna-feature__body { margin: 1.82cqi 0 0 9cqi; }
.pna-top .pna-feature--03 .pna-feature__num { left: 8.45cqi; top: 0cqi; width: 23.18cqi; }
.pna-top .pna-feature--03 .pna-feature__point { left: 17.25%; top: 26.46%; }
.pna-top .pna-feature--03 .pna-feature__photo { left: 52.64cqi; top: 2.45cqi; width: 47.09cqi; height: 31.09cqi; }
.pna-top .pna-feature--03 .pna-feature__illust { left: 66.36cqi; top: 38.09cqi; width: 34.55cqi; }
.pna-top .pna-feature--04 { margin-top: 7.82cqi; }
.pna-top .pna-feature--04 .pna-feature__card { margin: 9cqi 0 0 29.82cqi; width: 70.18cqi; min-height: 53.09cqi; padding: 10.64cqi 0 8.18cqi; }
.pna-top .pna-feature--04 .pna-feature__title { margin-left: 26.55cqi; width: 34.09cqi; }
.pna-top .pna-feature--04 .pna-feature__body { margin: 3.64cqi 0 0 9cqi; }
.pna-top .pna-feature--04 .pna-feature__num { left: 66.73cqi; top: 0cqi; width: 24cqi; }
.pna-top .pna-feature--04 .pna-feature__point { left: 16.67%; top: 26.46%; }
.pna-top .pna-feature--04 .pna-feature__photo { left: -0.18cqi; top: 2.64cqi; width: 47.27cqi; height: 31.09cqi; }
.pna-top .pna-feature--04 .pna-feature__illust { left: 0.45cqi; top: 37.82cqi; width: 35.91cqi; }
.pna-top .pna-feature--05 { margin-top: 5cqi; }
.pna-top .pna-feature--05 .pna-feature__card { margin: 9.09cqi 0 0 0cqi; width: 74.55cqi; min-height: 56.64cqi; padding: 10.73cqi 0 8.18cqi; }
.pna-top .pna-feature--05 .pna-feature__title { margin-left: 9.27cqi; width: 43.45cqi; }
.pna-top .pna-feature--05 .pna-feature__body { margin: 3.45cqi 0 0 10cqi; }
.pna-top .pna-feature--05 .pna-feature__num { left: 8.45cqi; top: 0cqi; width: 23cqi; }
.pna-top .pna-feature--05 .pna-feature__point { left: 17.39%; top: 26.98%; }
.pna-top .pna-feature--05 .pna-feature__photo { left: 56.82cqi; top: 5.45cqi; width: 43.18cqi; height: 30.64cqi; }
.pna-top .pna-feature--05 .pna-feature__illust { left: 69.55cqi; top: 34.36cqi; width: 20.45cqi; }
.pna-top .pna-features { padding-bottom: 11.36cqi; }
@media (max-width: 767.98px) {
/* --- SP（自動計算: SP版.ai の座標 → cqi） --- */
	.pna-top .pna-feature--01 { margin-top: -10.05cqi; }
	.pna-top .pna-feature--01 .pna-feature__card { margin: 50.05cqi 0 0 -5.97cqi; width: 106.57cqi; min-height: 127.36cqi; padding: 24.78cqi 0 13.93cqi; }
	.pna-top .pna-feature--01 .pna-feature__title { margin-left: 10.35cqi; width: 59.4cqi; }
	.pna-top .pna-feature--01 .pna-feature__body { margin: 3.04cqi 0 0 11.64cqi; width: 87.56cqi; font-size: 4.18cqi; line-height: 1.833; }
	.pna-top .pna-feature--01 .pna-feature__num { left: 3.09cqi; top: 34.32cqi; width: 30.23cqi; }
	.pna-top .pna-feature--01 .pna-feature__photo { left: 44.38cqi; top: 10.95cqi; width: 61.59cqi; height: 57.91cqi; }
	.pna-top .pna-feature--01 .pna-svg--sp-f01-board { left: -17.91cqi; top: 0cqi; width: 55.72cqi; }
	.pna-top .pna-feature--01 .pna-svg--sp-f01-woman { left: 60.7cqi; top: 52.74cqi; width: 41.79cqi; }
	.pna-top .pna-feature--01 .pna-svg--sp-f01-pot { left: 78.61cqi; top: 164.18cqi; width: 24.88cqi; }
	.pna-top .pna-feature--02 { margin-top: 10.05cqi; }
	.pna-top .pna-feature--02 .pna-feature__card { margin: 39.2cqi 0 0 -0.6cqi; width: 106.57cqi; min-height: 123.78cqi; padding: 24.18cqi 0 13.93cqi; }
	.pna-top .pna-feature--02 .pna-feature__title { margin-left: 34.73cqi; width: 59.4cqi; }
	.pna-top .pna-feature--02 .pna-feature__body { margin: 8.22cqi 0 0 10.65cqi; width: 87.56cqi; font-size: 4.18cqi; line-height: 1.833; }
	.pna-top .pna-feature--02 .pna-feature__num { left: 62.49cqi; top: 23.37cqi; width: 36.45cqi; }
	.pna-top .pna-feature--02 .pna-feature__photo { left: -5.97cqi; top: 0cqi; width: 61.29cqi; height: 56.92cqi; }
	.pna-top .pna-feature--02 .pna-svg--sp-f02-woman { left: -3.98cqi; top: 55.92cqi; width: 29.85cqi; }
	.pna-top .pna-feature--03 { margin-top: 8.36cqi; }
	.pna-top .pna-feature--03 .pna-feature__card { margin: 43.88cqi 0 0 -5.97cqi; width: 106.57cqi; min-height: 140.5cqi; padding: 26.67cqi 0 13.93cqi; }
	.pna-top .pna-feature--03 .pna-feature__title { margin-left: 10.25cqi; width: 56.62cqi; }
	.pna-top .pna-feature--03 .pna-feature__body { margin: 4.61cqi 0 0 11.64cqi; width: 87.56cqi; font-size: 4.18cqi; line-height: 1.833; }
	.pna-top .pna-feature--03 .pna-feature__num { left: 3.09cqi; top: 28.29cqi; width: 36.88cqi; }
	.pna-top .pna-feature--03 .pna-feature__photo { left: 44.18cqi; top: 4.88cqi; width: 61.79cqi; height: 57.91cqi; }
	.pna-top .pna-feature--03 .pna-svg--sp-f03-veg { left: -1.49cqi; top: 0cqi; width: 19.4cqi; }
	.pna-top .pna-feature--03 .pna-svg--sp-f03-tomato { left: 23.88cqi; top: 12.94cqi; width: 14.93cqi; }
	.pna-top .pna-feature--03 .pna-svg--sp-f03-teacher { left: 62.69cqi; top: 63.68cqi; width: 43.78cqi; }
	.pna-top .pna-feature--04 { margin-top: 2.69cqi; }
	.pna-top .pna-feature--04 .pna-feature__card { margin: 48.46cqi 0 0 -0.6cqi; width: 106.57cqi; min-height: 97.31cqi; padding: 25.37cqi 0 13.93cqi; }
	.pna-top .pna-feature--04 .pna-feature__title { margin-left: 35.82cqi; width: 59.1cqi; }
	.pna-top .pna-feature--04 .pna-feature__body { margin: 4.39cqi 0 0 10.65cqi; width: 87.56cqi; font-size: 3.69cqi; line-height: 1.995; }
	.pna-top .pna-feature--04 .pna-feature__num { left: 62.49cqi; top: 32.87cqi; width: 38.18cqi; }
	.pna-top .pna-feature--04 .pna-feature__photo { left: -5.97cqi; top: 9.55cqi; width: 61cqi; height: 57.91cqi; }
	.pna-top .pna-feature--04 .pna-svg--sp-f04-magnifier { left: 45.77cqi; top: 0cqi; width: 28.86cqi; }
	.pna-top .pna-feature--04 .pna-svg--sp-f04-book { left: 3.48cqi; top: 75.62cqi; width: 27.36cqi; }
	.pna-top .pna-feature--05 { margin-top: 11.74cqi; }
	.pna-top .pna-feature--05 .pna-feature__card { margin: 35.92cqi 0 0 -5.97cqi; width: 106.57cqi; min-height: 118.51cqi; padding: 25.77cqi 0 13.93cqi; }
	.pna-top .pna-feature--05 .pna-feature__title { margin-left: 10.25cqi; width: 72.04cqi; }
	.pna-top .pna-feature--05 .pna-feature__body { margin: 4.43cqi 0 0 11.64cqi; width: 87.56cqi; font-size: 4.18cqi; line-height: 1.833; }
	.pna-top .pna-feature--05 .pna-feature__num { left: 3.09cqi; top: 20.09cqi; width: 36.59cqi; }
	.pna-top .pna-feature--05 .pna-feature__photo { left: 35.22cqi; top: 0cqi; width: 68.16cqi; height: 47.66cqi; }
	.pna-top .pna-feature--05 .pna-svg--sp-f05-woman { left: 79.1cqi; top: 47.96cqi; width: 25.37cqi; }
	.pna-top .pna-features { padding-bottom: 7.56cqi; }
}

/* 2026-10-07 素材差し替え・AI原稿に合わせた調整 */
.pna-top .pna-btn { padding-inline: 78px; }
.pna-top .pna-btn__label { display: block; width: 438px; max-width: 100%; aspect-ratio: 438 / 47; margin-right: 52px; font-size: 0; background: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/pna-asset-button-label.png") center / contain no-repeat; }
.pna-top .pna-btn__arrow { position: absolute; right: 56px; top: 50%; transform: translateY(-50%); }
.pna-top .pna-btn__arrow::before { inset: 0; margin: auto; width: 24px; height: 18px; border-radius: 0; background: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/button-arrow.png") center / contain no-repeat; }
.pna-top .pna-btn__arrow::after { content: none; }
.pna-top .pna-about, .pna-top .pna-pinch__answer { background-image: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/pna-media-about-grid-background.png"); background-size: 28.35px 28.35px; }
.pna-top .pna-features { background-image: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/pna-media-features-grid-background.png"); background-size: 27.7px 27.7px; }
.pna-top .pna-change__learn::before { background: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/pna-asset-learn-check.png") center / contain no-repeat; }
.pna-top .pna-change__learn::after { content: none; }
.pna-top .pna-pinch__item::before { background: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/pna-asset-pinch-adult-check.png") center / contain no-repeat; }
.pna-top .pna-pinch__box--child .pna-pinch__item::before { background-image: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/pna-asset-pinch-child-check.png"); }
.pna-top .pna-pinch__item::after { content: none; }
.pna-top .pna-pinch__arrow { background: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/pna-asset-pinch-down-arrow.png") center / contain no-repeat; }
.pna-top .pna-pinch__arrow::before, .pna-top .pna-pinch__arrow::after { content: none; }
.pna-top .pna-pinch__answer::before { border-top-left-radius: 10px; }
.pna-top .pna-pinch__answer::after { border-top-right-radius: 10px; }
.pna-top .pna-compare__arrow { background: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/pna-asset-compare-arrow-academy.png") center / contain no-repeat; }
.pna-top .pna-compare__col--general .pna-compare__arrow { background-image: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/pna-asset-compare-arrow-general.png"); }
.pna-top .pna-compare__arrow::before, .pna-top .pna-compare__arrow::after { content: none; }
.pna-top .pna-compare__list li { font-size: calc(1.82cqi + 1pt); }
.pna-top .pna-compare__result { font-size: calc(2cqi + 1pt); }
.pna-top .pna-style__item::before { background: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/pna-asset-style-list-check.png") center / contain no-repeat; }
.pna-top .pna-cta__lead .pna-svg--cta-invitation { width: 692px; max-width: 100%; margin-inline: auto; }
.pna-top .pna-feature__magnifier { left: .45cqi; top: 37.82cqi; width: 12cqi; }
.pna-top .pna-feature__book { left: 20cqi; top: 47.5cqi; width: 16.36cqi; }
@media (min-width: 768px) {
 .pna-top .pna-about__band { height: auto; border: 0; background: none; }
 .pna-top .pna-about__band::after { content: none; }
 .pna-top .pna-about__band .pna-svg { width: 100%; max-width: none; }
}
/* 吹き出しと人物は支給の1枚画像。重ねる文字だけをHTMLに残す。 */
.pna-top .pna-about__people { left: 0; top: 0; width: 100%; z-index: 0; }
.pna-top .pna-about__bubbles { z-index: 1; }
.pna-top .pna-about__bubble { border: 0; background: none; }
.pna-top .pna-about__bubble::after { content: none; }
.pna-top .pna-about__tag { width: 19.66cqi; top: 0; }
.pna-top .pna-about__tag--1 { left: 2.74cqi; }
.pna-top .pna-about__tag--2 { left: 28.51cqi; }
.pna-top .pna-about__tag--3 { left: 54.27cqi; }
.pna-top .pna-about__tag--4 { left: 80.18cqi; }
@media (max-width: 767.98px) {
 .pna-top .pna-btn { padding-inline: 34px; }
 .pna-top .pna-btn__label { width: 219px; margin-right: 24px; }
 .pna-top .pna-btn__arrow { right: 26px; }
 .pna-top .pna-btn__arrow::before { width: 13px; height: 10px; }
 .pna-top .pna-about, .pna-top .pna-pinch__answer { background-size: 9.45px 9.45px; }
 .pna-top .pna-features { background-size: 18.3px 18.3px; }
 .pna-top .pna-about__people { left: 4.09cqi; top: 0; width: 88.1cqi; }
 .pna-top .pna-about__tag { width: 17.32cqi; }
 .pna-top .pna-about__tag--1 { left: 6.51cqi; }
 .pna-top .pna-about__tag--2 { left: 29.21cqi; }
 .pna-top .pna-about__tag--3 { left: 51.90cqi; }
 .pna-top .pna-about__tag--4 { left: 74.73cqi; }
 .pna-top .pna-compare__list { padding-inline: 3cqi 1.4cqi; }
 .pna-top .pna-compare__list li { font-size: calc(3.78cqi + 1pt); letter-spacing: 0; line-height: 1.58; padding-left: .6em; }
 .pna-top .pna-compare__result { font-size: calc(3.69cqi + 1pt); letter-spacing: 0; line-height: 1.59; }
 /* SP原稿: オレンジ帯の直下から図の全体を表示（旧SVGは上43pxを切っていた）。 */
 .pna-top .pna-know__item--nutrition { top: 31.56cqi; }
 .pna-top .pna-know__item--psychology { top: 33.93cqi; }
 .pna-top .pna-know__item--meal { top: 99.06cqi; }
 .pna-top .pna-know__note { top: 86.58cqi; }
 .pna-top .pna-know__badge { top: 101.02cqi; }
 .pna-top .pna-know__summary { top: 113.36cqi; }
}

/* 支給の注意吹き出し（図内の旧パスと文字を置換） */
.pna-top .pna-know__badge { left: 46.6cqi; top: 32.29cqi; width: 6.24cqi; height: 6.24cqi; background: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/pna-asset-knowledge-alert-bubble.png") center / contain no-repeat; }
.pna-top .pna-know__mark { display: none; }
@media (max-width: 767.98px) {
 .pna-top .pna-know__badge { left: 60.87cqi; top: 99.32cqi; width: 10.82cqi; height: 10.82cqi; }
}

/* 2026-10-08 SP追加修正 */
@media (max-width: 767.98px) {
 .pna-top .pna-compare { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto auto auto auto; row-gap: 0; }
 .pna-top .pna-compare__col { display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 0; }
 .pna-top .pna-compare__arrow { justify-self: center; }
 .pna-top .pna-compare__result { align-self: center; }
 .pna-top .pna-pinch__answer::before { border-top-left-radius: 4px; }
 .pna-top .pna-pinch__answer::after { border-top-right-radius: 4px; }
 .pna-top .pna-ako__dots { left: 5.9051cqi; top: 54.7569cqi; width: 35.3545cqi; height: auto; z-index: 2; background: none; }
}

@media (max-width: 767.98px) {
 .pna-top .pna-feature--02 .pna-svg--sp-f02-woman { left: -4.9751cqi; width: 33.8308cqi; }
}

/* 2026-10-08 追加支給PNG: SPバナー・注意吹き出し・財布の女性 */
@media (max-width: 767.98px) {
 .pna-top .pna-about__band { height: auto; border: 0; background: none; }
 .pna-top .pna-about__band::after { content: none; }
 .pna-top .pna-about__band .pna-svg { width: 100%; max-width: none; }
 .pna-top .pna-know__badge { background-image: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/pna-asset-knowledge-alert-bubble-sp.png"); width: 11.11cqi; height: 12.66cqi; }
 .pna-top .pna-feature--02 .pna-svg--sp-f02-woman { left: -3.48cqi; width: 30.7463cqi; }
}

/* 2026-10-08 更新SP原稿: 一般講座の各項目を左右で同じ行にそろえる */
@media (max-width: 767.98px) {
 .pna-top .pna-compare__list { display: grid; grid-template-rows: repeat(3, minmax(0, 1fr)); align-items: start; }
 .pna-top .pna-compare__col--general .pna-compare__list li:first-child { padding-top: .7cqi; }
}

/* 2026-10-08 SP版.ai（作業フォルダ直下の最新版）: 家族と段違いの吹き出し。 */
@media (max-width: 767.98px) {
 .pna-top .pna-about__tags { aspect-ratio: 1125 / 680; margin-top: 11px; }
 .pna-top .pna-about__people { left: 2cqi; width: 94.58cqi; }
 .pna-top .pna-about__tag { width: 21.16cqi; }
 .pna-top .pna-about__tag--1 { left: 3.51cqi; top: 7.73cqi; }
 .pna-top .pna-about__tag--2 { left: 27.42cqi; top: 0; }
 .pna-top .pna-about__tag--3 { left: 51.24cqi; top: 7.73cqi; }
 .pna-top .pna-about__tag--4 { left: 75.07cqi; top: 3.02cqi; }
 .pna-top .pna-about__bubble { font-size: 3.877cqi; }
}

/* 2026-10-08 SPの読みやすさ調整（1pt = 4/3px）。 */
@media (max-width: 767.98px) {
 .pna-top .pna-about__title { width: calc(100% + 24px); margin-left: -12px; }
 .pna-top .pna-about__title-img { width: min(289.44px, 100% - 64px); }
 .pna-top .pna-about__title-small { font-size: 20.088px; }
 .pna-top .pna-about__lead { font-size: calc(14px + 2pt); }
 .pna-top .pna-change__learn { font-size: calc(4cqi + 2pt); }
 .pna-top .pna-ako__badge { font-size: 3.4452cqi; }
 .pna-top .pna-ako__lead .pna-svg { width: 68.9904cqi; }
 .pna-top .pna-ako__body { font-size: calc(4.18cqi + 1pt); }
 .pna-top .pna-pinch__item { font-size: calc(3.9cqi + 2pt); }
 .pna-top .pna-feature .pna-feature__body { font-size: calc(4.18cqi + 2pt); line-height: 1.833; }
 .pna-top .pna-compare__list li { padding-left: 1.5em; }
 .pna-top .pna-styles__title { width: 57.24cqi; }
 .pna-top .pna-styles__lead { font-size: calc(3.05cqi + 1pt); }
 .pna-top .pna-style--1 .pna-style__title { width: 62.5428cqi; }
 .pna-top .pna-style--2 .pna-style__title { width: 67.2732cqi; }
 .pna-top .pna-style--3 .pna-style__title { width: 88.0092cqi; }
 .pna-top .pna-style--4 .pna-style__title { width: 81.0216cqi; }
 .pna-top .pna-style__item { font-size: calc(4.26cqi + 1pt); }
}
@media (max-width: 767.98px) {
 /* 長くなった本文の下に鍋を置き、文字と重ならない余白を確保。 */
 .pna-top .pna-feature--01 .pna-feature__card { padding-bottom: 22cqi; }
 .pna-top .pna-feature--01 .pna-svg--sp-f01-pot { top: auto; bottom: 1cqi; }
}

/* SPボタン・あこ紹介の追加調整。文字の下移動はPC/SP共通。 */
.pna-top .pna-btn__label { transform: translateY(2px); }
@media (max-width: 767.98px) {
 .pna-top .pna-btn { min-height: 64px; padding-inline: 26px; }
 .pna-top .pna-btn__label { width: 235px; }
 .pna-top .pna-ako__lead .pna-svg { width: 74.5cqi; }
 .pna-top .pna-ako__badge { font-size: 3.72cqi; }
 .pna-top .pna-ako__count { font-size: 3.45cqi; }
 .pna-top .pna-ako__num { font-size: 5.62cqi; }
 .pna-top .pna-feature .pna-feature__body { font-size: calc(4.18cqi + 1pt); }
}

/* SP特徴カード：本文1行分の見出し間隔、本文3文字分の下余白。 */
@media (max-width: 767.98px) {
 .pna-top .pna-feature .pna-feature__card {
  font-size: calc(4.18cqi + 1pt);
  min-height: 0;
  padding-bottom: 3em;
 }
 .pna-top .pna-feature .pna-feature__body { margin-top: 1.833em; }
 .pna-top .pna-feature--01 .pna-svg--sp-f01-pot { bottom: -2cqi; }
}

/* SPチェック・ピンチ枠・紹介実績の追加調整。 */
@media (max-width: 767.98px) {
 .pna-top .pna-style__item::after { content: none; }
 .pna-top .pna-pinch__box { width: calc(100% + 20px); margin-left: -10px; padding-inline: 2cqi; border-width: 2.5px; }
 .pna-top .pna-pinch__label { left: 50%; transform: translateX(-50%); }
 .pna-top .pna-pinch__item { padding-left: 9.5cqi; }
 .pna-top .pna-pinch__item::before { width: 6cqi; height: 6cqi; margin-top: -3cqi; }
 .pna-top .pna-ako__badge { font-size: calc(3.72cqi + 2pt); }
 .pna-top .pna-ako__count { font-size: calc(3.45cqi + 2pt); }
 .pna-top .pna-ako__num { font-size: calc(5.62cqi + 2pt); }
}

@media (max-width: 767.98px) {
 .pna-top .pna-ako__count { letter-spacing: 0; }
 .pna-top .pna-ako__total { display: inline-block; white-space: nowrap; }
 .pna-top .pna-ako__num { margin-inline: .1em; }
}

/* チェック画像のみを表示し、丸を本文文字の約1.2倍に揃える。 */
.pna-top .pna-style__item::after { content: none; }
.pna-top .pna-style__item::before { width: 1.2em; height: 1.2em; top: .15em; }
@media (min-width: 768px) {
 .pna-top .pna-pinch__item::before { width: 2.5cqi; height: 2.5cqi; margin-top: -1.25cqi; }
}

/* 2026-10-10 Ai原稿：無料・説明動画を受け取る。 */
.pna-top .pna-btn__free { position: absolute; left: 34px; top: 50%; transform: translateY(-50%); width: 99px; height: 51px; border-radius: 7px; background: #FCEE21 url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/button-free-label.png") center / 65px auto no-repeat; }
.pna-top .pna-btn__label { position: absolute; left: 178px; top: 50%; transform: translateY(calc(-50% + 2px)); width: 390px; aspect-ratio: 394 / 47; margin: 0; background-image: url("https://lp.ayako-grace-kitchen.com/wp-content/uploads/2026/10/button-video-label.png"); }
@media (max-width: 767.98px) {
 .pna-top .pna-btn__free { left: 3.5%; width: 13.3%; height: 24px; border-radius: 3px; background-size: 67% auto; }
 .pna-top .pna-btn__label { left: 20.8%; width: 61.2%; }
 .pna-top .pna-btn__arrow { right: 16px; }
}

/* 2026-10-15 認定セルフケアサポーター：更新Aiの見出し幅・位置。 */
.pna-top .pna-feature--05 .pna-feature__title { margin-left: 10.35cqi; width: 55.57cqi; }
.pna-top .pna-feature--05 .pna-feature__photo { object-fit: contain; }
@media (max-width: 767.98px) {
 .pna-top .pna-feature--05 .pna-feature__title { margin-left: 11.97cqi; width: 60.14cqi; }
}
@media (min-width: 768px) {
 /* 更新Aiでは長い3行目が認定証の下へ回る位置。 */
 .pna-top .pna-feature--05 .pna-feature__card { padding-top: 16.64cqi; }
}