:root{
--blue:#1763E9;
--blue-dark:#0E4FC4;
--blue-deep:#0B1F3A;
--navy:#102A43;
--blue-soft:#EAF2FF;
--blue-soft2:#F4F8FF;
--ink:#1A2230;
--gray:#5B6473;
--gray-light:#8A93A3;
--line:#E3E8F0;
--bg-gray:#EDEFF3;
--radius:16px;
--shadow:0 14px 34px rgba(67,40,160,.18);
--shadow-lg:0 22px 55px rgba(67,40,160,.26);
--font-en:'Outfit',sans-serif;
--font-head:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans",sans-serif;
/* CTA / recommended accent : reddish purple (high saturation) */
--cta:#E5097F;
--cta-dark:#B112C4;
--cta-soft:#FCE3F1;
--cta-icon:#E5097F;
/* CTAボタン専用：オレンジ（最も目立たせる行動ボタン・彩度高め） */
--btn-top:#FFB23D;
--btn:#FF8400;
--btn-dark:#F24400;
--btn-shadow:242,68,0;
/* コース別カラー（料金タブ＝比較表＝カリキュラム＝診断結果で共通） */
--grad-full:linear-gradient(135deg,#9A24D4,#5B2BD8); /* フルサポート：紫（青寄り・CTAより離す） */
--grad-skill:linear-gradient(135deg,#4A63E4,#3F2BD2); /* スキルアップ：青 */
--grad-practice:linear-gradient(135deg,#03A0C2,#0A6BC9); /* 実践：ティール→青 */
--c-full:#7E27D2; --c-skill:#3F2BD2; --c-practice:#0A6BC9;
}
/* Outfit utilities for English + figures */
.en{font-family:var(--font-en);font-weight:800;font-style:normal;letter-spacing:.01em;}
.fig{font-family:var(--font-en);font-weight:800;font-style:normal;letter-spacing:0;line-height:1;}
.fig-xl{font-family:var(--font-en);font-weight:900;font-style:normal;line-height:.9;letter-spacing:-.01em;}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:88px;}
body{
font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP","Yu Gothic",YuGothic,Meiryo,sans-serif;
color:var(--ink);
line-height:1.8;
background:#fff;
font-size:15px;
-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
/* カード（影・余白を除いた箱）が実寸1080pxになるよう、左右24px余白の外側を加味して1128px */
.wrap{max-width:1128px;margin:0 auto;padding:0 24px;}
.wrap-narrow{max-width:920px;margin:0 auto;padding:0 24px;}
/* photo / face / book placeholders */
/* 写真枠。未挿入/未読込時もプレースホルダ（しましま・キャプション・縁）は表示しない */
.photo-note{
background:none;border:0;border-radius:12px;
display:flex;align-items:center;justify-content:center;
min-height:150px;
}
.photo-note > span{display:none;}
/* buttons */
.btn-cta{
display:inline-flex;align-items:center;justify-content:center;gap:10px;
background:linear-gradient(180deg,var(--btn-top) 0%,var(--btn) 26%,var(--btn-dark) 100%);
color:#fff;font-weight:900;font-size:16px;letter-spacing:.02em;
-webkit-text-stroke:.3px currentColor;
padding:18px 40px;border-radius:999px;border:none;cursor:pointer;
box-shadow:0 10px 24px rgba(var(--btn-shadow),.4),
inset 0 1px 0 rgba(255,255,255,.6),
inset 0 -3px 7px rgba(150,40,0,.28);
text-shadow:0 1px 1px rgba(150,40,0,.32);
transition:transform .18s ease,box-shadow .18s ease;
text-align:center;
}
.btn-cta:hover{transform:translateY(-2px);
box-shadow:0 16px 32px rgba(var(--btn-shadow),.52),
inset 0 1px 0 rgba(255,255,255,.7),
inset 0 -3px 7px rgba(150,40,0,.28);}
.btn-cta::after{
content:"";width:1.4em;height:1.4em;flex:none;
background:url('data:image/svg+xml;utf8,') center/contain no-repeat;
}
.btn-ghost{
display:inline-flex;align-items:center;gap:8px;
border:1.5px solid var(--blue);color:var(--blue);font-weight:800;
padding:14px 30px;border-radius:999px;background:#fff;transition:.18s;
}
.btn-ghost:hover{background:var(--blue-soft);}
.btn-ghost::after{
content:"";width:1.4em;height:1.4em;flex:none;
background:url('data:image/svg+xml;utf8,') center/contain no-repeat;
}
/* ===== Tabler inline icons (stroke 1, 1.5em, high-saturation red-purple) ===== */
/* illustrative icons : 120% size, stroke 1 */
.tic{display:inline-block;width:1.8em;height:1.8em;flex:none;vertical-align:-.4em;color:var(--cta-icon);}
.tic svg{width:100%;height:100%;display:block;stroke:var(--blue);stroke-width:1.2;}
/* functional / arrow icons : stroke 2 */
.tic-ui{display:inline-block;width:1.5em;height:1.5em;flex:none;vertical-align:-.32em;color:var(--cta-icon);}
.tic-ui svg{width:100%;height:100%;display:block;stroke:var(--blue);stroke-width:3.6;}
/* icon-as-background helpers for ::before pseudo markers */
.ic-arrow,.ic-check{display:inline-block;width:1.5em;height:1.5em;flex:none;vertical-align:-.32em;background-repeat:no-repeat;background-position:center;background-size:contain;}
.ic-arrow{background-image:url('data:image/svg+xml;utf8,');}
.ic-check{background-image:url('data:image/svg+xml;utf8,');}
/* section heading */
.sec{padding:84px 0;}
.sec-gray{background:linear-gradient(135deg,#F5F6FA 0%,#F3F6FB 50%,#F0F6FC 100%);}
/* 重要セクション用：少し色味を強めたグラデ（白カードが映える程度／CTAは邪魔しない） */
.sec-accent{background:linear-gradient(135deg,#F4E6F4 0%,#E9E5F8 48%,#E1EBFB 100%);}
.sec-soft{background:var(--blue-soft2);}
/* カリキュラム直下のCTAボタン（ボタンのみ） */
.cur-cta{text-align:center;margin-top:44px;}
.eyebrow{
display:block;text-align:center;color:var(--blue);
font-family:var(--font-en);font-weight:800;
letter-spacing:.18em;font-size:15px;margin-bottom:10px;
}
.h2{
position:relative;text-align:center;font-family:var(--font-head);
font-size:34px;font-weight:900;line-height:1.4;
letter-spacing:.02em;margin-bottom:16px;
}
/* arched Outfit word as heading decoration (generated by JS via SVG textPath) */
.sec-arch{display:flex;justify-content:center;margin:-10px 0 -70px;pointer-events:none;}
.sec-arch svg{width:min(420px,80%);height:auto;overflow:visible;display:block;}
.sec-arch text{font-family:var(--font-en);font-weight:800;font-size:30px;letter-spacing:.04em;
fill:url(#archgrad);fill-opacity:.5;}
.h2 .accent{color:var(--blue);}
/* oversized count number inside headings (3つ / 5つ) */
.h2 .h2-num{
font-family:var(--font-en);font-weight:900;
font-size:1.85em;line-height:.8;color:var(--blue);
margin:0 .04em;vertical-align:-.12em;letter-spacing:-.01em;
}
.h2 .accent-mark{
background:linear-gradient(transparent 62%,rgba(23,99,233,.18) 62%);
padding:0 .1em;
}
.h2-sub{text-align:center;color:var(--gray);font-family:"Noto Sans JP",sans-serif;font-size:18px;font-weight:500;line-height:1.9;max-width:720px;margin:0 auto 48px;}
.h2-sub-wide{max-width:none;} /* 横幅をコンテンツエリア幅に */
.h2::after{
content:"";display:block;width:54px;height:4px;border-radius:2px;
background:transparent;margin:18px auto 0;
}
/* ===== Header ===== */
header.site{
position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);
backdrop-filter:blur(10px);border-bottom:1px solid var(--line);
}
/* ヘッダーはコンテンツより広く＝既存NWサイト(.mainContainer)と同じ1240px */
.site .wrap{max-width:1560px;display:flex;align-items:center;justify-content:space-between;gap:24px;height:72px;padding:0 44px;}
.logo{display:flex;align-items:center;flex:none;}
.logo img{height:25px;width:auto;display:block;}
.site-nav{display:flex;align-items:center;gap:28px;margin-left:auto;}
.site-nav a{font-size:14px;font-weight:700;color:var(--ink);letter-spacing:.02em;white-space:nowrap;transition:color .15s;}
.site-nav a:hover{color:var(--blue);}
.site .btn-cta{flex:none;padding:12px 22px;font-size:14px;}
/* SPハンバーガー */
.hb{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;padding:0;margin-left:auto;border:0;background:none;cursor:pointer;flex:none;}
.hb span{display:block;width:26px;height:2px;background:var(--ink);border-radius:2px;transition:transform .25s ease,opacity .2s ease;}
.hb[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hb[aria-expanded="true"] span:nth-child(2){opacity:0;}
.hb[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.sp-menu{display:none;position:fixed;top:64px;left:0;right:0;bottom:0;z-index:49;background:#fff;padding:8px 24px 40px;flex-direction:column;overflow-y:auto;}
.sp-menu.open{display:flex;}
.sp-menu nav{display:flex;flex-direction:column;}
.sp-menu nav a{padding:18px 4px;border-bottom:1px solid var(--line);font-weight:700;font-size:16px;color:var(--ink);}
.sp-menu .btn-cta{margin-top:24px;width:100%;}
body.menu-open{overflow:hidden;}
/* ===== Hero ===== */
.hero{
position:relative;overflow:hidden;
background:
radial-gradient(680px 520px at 30% 6%, rgba(214,9,127,.55), transparent 58%),
radial-gradient(820px 720px at 2% 98%, rgba(124,58,237,.55), transparent 60%),
radial-gradient(700px 600px at 60% 50%, rgba(37,99,235,.45), transparent 60%),
linear-gradient(135deg,#2a1370 0%,#2733a8 45%,#1763E9 100%);
color:#fff;padding:50px 0 50px;
}
/* right-side white panel (KV reference look) */
.hero-white{position:absolute;top:0;right:0;bottom:0;width:calc(38% - 100px);background:#E7EBF3;z-index:1;
box-shadow:-26px 0 70px rgba(16,42,67,.28);}
.hero::before{
content:"";position:absolute;inset:0;
background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
background-size:46px 46px;mask-image:radial-gradient(600px 400px at 20% 30%,#000,transparent);
}
/* 背景のブラシ模様（透過素材を左右に。左はマゼンタ寄せ） */
/* 背景の模様は1枚絵（kv-bg.png）で全面に敷く。画像が届くまではheroのグラデが下地として見える */
.hero-bgfull{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;pointer-events:none;user-select:none;}
.hero-bgfull-sp{display:none;} /* SP用背景はSPのみ表示 */
/* ブラシ装飾。背景(z-index:0)の上に重ねてブレンド。位置は背景の模様に合わせる */
.hero-brush{position:absolute;z-index:0;height:auto;pointer-events:none;user-select:none;}
/* サイズ固定px。左(b1)は左上座標固定／右(b2)は右下座標固定。リキッドしない */
.hero-brush.b1{display:none;} /* brush01 非表示 */
.hero-brush.b2{right:0;bottom:-24px;width:456px;mix-blend-mode:overlay;} /* オーバーレイ 右下の紫の波線 */
/* ブラシの上に重ねるライン装飾。サイズ固定px・座標固定 */
.hero-line{position:absolute;z-index:0;height:auto;pointer-events:none;user-select:none;display:none;} /* line01/02 非表示 */
/* 線は約1024px(タブレット)以下で少しずつ縮小。下限は高め＝小さくなりすぎない */
.hero-line.l1{left:-175px;top:10px;width:clamp(285px,calc(20vw + 165px),370px);} /* 左上座標固定 */
.hero-line.l2{right:-10px;bottom:16px;width:clamp(180px,calc(20vw + 24px),229px);} /* 右下座標固定 */
/* 左右の人物写真（透過PNG）。背景画像の上に前面で重ねる。
男性=右上・女性=左下の角にピッタリ配置。広い画面では380px固定、
約1426px以下になると男性PCがテキストに被らないよう自動でリキッド縮小(余白20px一定)。
タブレット/SP(≤900px)は下の@mediaで縮小（角配置は同じ）。 */
.hero-bg{position:absolute;z-index:1;height:auto;pointer-events:none;user-select:none;width:clamp(150px,calc(25vw + 45px),380px);}
/* 女性(kv_student)：コンテンツエリア(1200)右端から40px内側。狭くなっても左へずれず、コンテンツ位置で見切れる */
.hero-bg.l{left:auto;right:calc(50% - 560px);bottom:-15px;width:500px;}
.hero-bg.r{display:none;} /* 男性(teacher)は非表示 */
/* コンテンツ幅(1200)より狭い時：左位置を固定し、右端からはみ出した分は見切れる（左へスライドさせない） */
@media(max-width:1200px){
.hero-bg.l{left:660px;right:auto;}
}
.hero .wrap{position:relative;z-index:2;max-width:1200px;display:grid;grid-template-columns:1fr;justify-items:start;gap:46px;align-items:center;}
.hero-left{text-align:center;margin-left:0;max-width:720px;}
.hero-pre{text-align:center;margin-bottom:14px;font-size:15px;font-weight:700;letter-spacing:.08em;color:#fff;}
.hero-pre-deco{display:block;width:283px;height:auto;margin:-11px auto 0;transform:scaleX(-1);}
.hero h1{position:relative;display:inline-flex;flex-direction:column;align-items:center;gap:6px;font-family:var(--font-head);font-weight:900;letter-spacing:.01em;line-height:1;}
.hero h1 .h1-main{display:inline-flex;align-items:baseline;}
.hero h1 .en{font-family:var(--font-en);font-weight:900;font-size:128px;letter-spacing:-.01em;} /* さらに120% */
.hero h1 .x{font-family:var(--font-en);color:#7DB4FF;font-weight:800;font-size:84px;margin:0 .06em;} /* さらに120% */
.hero h1 .h1-jp{font-size:46px;line-height:1.1;font-weight:900;text-align:left;white-space:nowrap;}
.hero h1 .h1-jp br{display:none;} /* PCも1行に */
/* タイトル(h1)内に絶対配置＝タイトルと連動。幅も固定px（ビューポートで伸縮させない） */
.hero-writing{position:absolute;left:360px;top:41px;width:259px;height:auto;pointer-events:none;z-index:2;} /* SEOに重なる（元の位置関係を維持・右寄り） */
.hw-pc{display:none;} /* 白版は使わない */
.hw-sp{display:block;} /* 色付き版をPCでも使用 */
.spbr{display:none;} /* SP限定の改行（PCでは改行しない） */
.hero-lead{margin:22px 0 28px;font-size:18px;font-weight:700;opacity:.95;line-height:1.85;}
/* 3 circular "medal" badges with laurel wreath */
.hero-badges{display:flex;flex-wrap:nowrap;gap:16px;margin-bottom:30px;justify-content:center;}
.hero-badges>span{
position:relative;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
min-height:59px;padding:0 22px;font-size:14px;font-weight:700;line-height:1.4;color:#F5E790;white-space:nowrap;
}
.hero-badges .bg-l1{display:block;line-height:1.25;} /* 1行目（指定ワードのみ20px、他は14px） */
.hero-badges .bg-em{font-size:20px;}
.hero-badges>span::before,.hero-badges>span::after{
content:"";position:absolute;top:50%;width:23px;height:59px;pointer-events:none;
background:url('../images/laurel.svg') center/contain no-repeat;
}
.hero-badges>span::before{left:0;transform:translateY(-50%);}
.hero-badges>span::after{right:0;transform:translateY(-50%) scaleX(-1);}
.hero-cta-row{display:flex;flex-direction:column;align-items:stretch;gap:16px;width:fit-content;margin-left:auto;margin-right:auto;}
.hero-link{color:#fff;font-weight:600;font-size:14px;border-bottom:1px solid rgba(255,255,255,.5);padding-bottom:2px;display:inline-flex;align-items:center;justify-content:center;gap:4px;align-self:center;}
.hero-form{
position:relative;z-index:2;margin-left:-46px;margin-right:-24px;width:calc(100% + 70px);
background:#fff;border-radius:20px;box-shadow:0 24px 60px rgba(16,42,67,.30);
padding:30px;color:var(--ink);
}
.hero-form .ff-title{font-weight:800;font-size:18px;text-align:center;margin-bottom:6px;}
.hero-form .ff-sub{text-align:center;color:var(--gray);font-size:12.5px;margin-bottom:18px;}
.ff-field{margin-bottom:14px;}
.ff-field label{display:block;font-size:12.5px;font-weight:700;margin-bottom:6px;color:var(--navy);}
.ff-field input,.ff-field select{
width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font-size:14px;background:#fafbfd;font-family:inherit;
}
.hero-form .btn-cta{width:100%;margin-top:6px;}
/* ===== Logos ===== */
.logos{padding:16px 0 1px;background:#fff;border-bottom:1px solid var(--line);}
.logos .ttl{text-align:center;font-weight:700;font-size:17px;margin-bottom:6px;display:flex;align-items:baseline;justify-content:center;gap:2px 8px;flex-wrap:wrap;}
.logos .ttl .ttl-fig{display:inline-flex;align-items:baseline;justify-content:center;gap:8px;}
.logos .ttl b{color:var(--blue);font-weight:700;}
.logos .ttl .fig{color:var(--blue);font-size:36px;}
.logos .ttl .unit{font-weight:800;font-size:17px;color:var(--blue);}
/* 企業ロゴ 無限スクロール（自社LP共通パーツと同方式） */
/* 2つの同一リストを並べ、ラッパーごと0→-50%で動かす＝シームレス無限ループ（隙間なし） */
@keyframes logomarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.logo-marquee{overflow:hidden;}
.logo-marquee__wrap{display:flex;width:max-content;animation:logomarquee 50s linear infinite;}
.logo-marquee__list{display:flex;align-items:center;height:96px;white-space:nowrap;gap:0 30px;padding-right:30px;margin:0;list-style:none;flex:0 0 auto;}
.logo-marquee__item{display:inline-flex;align-items:center;padding:0 10px;}
.logo-marquee__item img{width:auto;max-height:55px;max-width:144px;display:block;}
/* ===== Worries ===== */
.worry-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px 16px;}
.worry{
display:flex;gap:12px;align-items:center;background:#fff;box-shadow:var(--shadow);
border-radius:12px;padding:18px 18px;font-weight:600;font-size:15px;line-height:1.55;
}
.worry .chk{flex:0 0 96px;width:96px;display:flex;align-items:center;justify-content:center;}
.worry .chk img{width:100%;height:auto;display:block;}
.worry .wtxt{flex:1;min-width:0;}
.worry .wkey{color:var(--blue);font-size:18px;font-weight:700;}
.arrow-down{display:flex;justify-content:center;margin:30px 0;font-size:30px;}
.arrow-down i{width:1.5em;height:1.5em;display:block;
background:url('data:image/svg+xml;utf8,') center/contain no-repeat;}
/* 解決：青バンドがお悩み下部に食い込む。左右イラストはflexの別カラムでテキストに絶対被らない */
.worries-sec{position:relative;overflow:hidden;padding-bottom:0;}
.worries-sec .worry-grid{position:relative;z-index:1;}
.solve-band{position:relative;z-index:0;overflow:hidden;margin-top:-150px;background:linear-gradient(135deg,#7625A6 0%,#1763E9 100%);color:#fff;padding:200px 16px 0;}
.solve-band::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);z-index:2;
border-left:50vw solid transparent;border-right:50vw solid transparent;border-top:120px solid #F2F5FB;}
.solve-inner{position:relative;display:flex;align-items:center;justify-content:center;min-height:340px;max-width:1340px;margin:0 auto;padding-bottom:60px;}
.solve-ill{width:clamp(130px,16vw,290px);height:auto;display:block;pointer-events:none;user-select:none;position:absolute;bottom:0;}
.solve-ill-l{left:calc(50% - 670px);bottom:0;width:290px;transform:translateY(10px) scale(0.986);}
/* 右イラスト：PCはサイズ固定(95%=276px)・位置固定で、画面が狭まるとリキッドせず右に見切れる */
.solve-ill-r{right:calc(50% - 670px);bottom:124px;width:276px;transform:none;}
.solve{max-width:660px;text-align:center;}
.solve h3{font-family:var(--font-head);font-size:27px;font-weight:900;line-height:1.5;color:#fff;}
.solve h3 .accent{color:#fff;font-size:1.56em;}
.solve p{color:rgba(255,255,255,.92);margin-top:14px;font-size:16px;line-height:1.9;}
/* ===== 3 envs ===== */
.env-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.env-card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;}
/* 写真を上に・POINTバッジを左上に重ねる */
.env-photo{position:relative;width:100%;height:176px;min-height:176px;margin:0;border:0;border-radius:0;overflow:hidden;
background:repeating-linear-gradient(45deg,#E7EAF0,#E7EAF0 12px,#E1E5ED 12px,#E1E5ED 24px);
display:flex;align-items:center;justify-content:center;text-align:center;color:var(--gray-light);font-size:11px;line-height:1.6;padding:18px;}
.env-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;}
.env-no{position:absolute;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;
width:60px;height:60px;border-radius:0 28px 0 0;line-height:1;
background:linear-gradient(135deg,#D6097F 0%,#7C3AED 52%,#1763E9 100%);color:#fff;}
.env-no span,.env-no b{transform:translate(-3px,2px);}
.env-no span{font-family:var(--font-en);font-weight:800;font-size:9px;letter-spacing:.1em;opacity:.95;}
.env-no b{font-family:var(--font-en);font-weight:900;font-size:22px;line-height:1;margin-top:2px;}
.env-body{padding:22px;font-size:16px;color:var(--gray);flex:1;display:flex;flex-direction:column;}
.env-ttl{font-family:var(--font-head);font-size:18px;font-weight:800;color:var(--blue-deep);line-height:1.45;margin-bottom:12px;}
.env-body p{flex:1;}
.env-note{display:flex;align-items:flex-start;gap:8px;margin-top:16px;font-weight:700;color:var(--blue-deep);font-size:14px;background:var(--blue-soft);border-radius:10px;padding:12px 14px;line-height:1.6;}
.env-note::before{content:"";width:2.25em;height:2.25em;flex:none;margin-top:-.1em;
background:url('data:image/svg+xml;utf8,') center/contain no-repeat;}
/* ===== Compare table ===== */
.cmp{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;box-shadow:var(--shadow);border-radius:12px;overflow:hidden;background:#fff;}
.cmp th,.cmp td{padding:16px 14px;text-align:center;vertical-align:middle;border-bottom:1px solid var(--line);}
.cmp thead th{color:#fff;font-weight:800;line-height:1.4;font-size:15px;}
.cmp thead th:nth-child(1){background:var(--navy);}
.cmp thead th:nth-child(2){background:var(--grad-full);}
.cmp thead th:nth-child(3),.cmp thead th:nth-child(4){background:#7C8696;}
.cmp tbody th{text-align:left;font-weight:700;font-size:14px;background:#EEF2F8;white-space:nowrap;}
.cmp tbody td{text-align:left;padding-left:20px;}
.cmp td.ours{background:var(--blue-soft2);color:var(--blue-deep);font-weight:700;}
.cmp .mk-good,.cmp .mk-ok,.cmp .mk-mid,.cmp .mk-bad{
display:inline-block;width:28px;height:28px;font-size:0;vertical-align:middle;margin-right:3px;
background-repeat:no-repeat;background-position:center;background-size:contain;}
.cmp .mk-good{background-image:url('data:image/svg+xml;utf8,');}
.cmp .mk-ok{background-image:url('data:image/svg+xml;utf8,');}
.cmp .mk-mid{background-image:url('data:image/svg+xml;utf8,');}
.cmp .mk-bad{background-image:url('data:image/svg+xml;utf8,');}
.cmp-note{color:var(--gray-light);font-size:12px;margin-top:16px;}
/* ===== CTA band ===== */
.ctaband{position:relative;overflow:hidden;color:#fff;
background:
linear-gradient(135deg, rgba(30,18,90,.42), rgba(23,99,233,.36)),
url('../images/cta_bg.jpg') center/cover no-repeat,
linear-gradient(135deg,#2a1370 0%,#2733a8 45%,#1763E9 100%);}
/* KVと同じブラシ装飾。01=覆い焼き(カラー)左上 / 02=オーバーレイ右下 */
.ctaband::before,.ctaband::after{content:"";position:absolute;z-index:0;pointer-events:none;
background-repeat:no-repeat;background-position:center;background-size:contain;}
.ctaband::before{left:-166px;top:-130px;width:546px;height:546px;
background-image:url('../images/brush01.png');mix-blend-mode:color-dodge;}
.ctaband::after{right:-20px;bottom:-44px;width:396px;height:218px;
background-image:url('../images/brush02.webp');mix-blend-mode:overlay;}
.ctaband .wrap{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;}
/* CTAライン（PC）：ブラシの上に正しい色のライン装飾。line01=左上 / line02=右下 */
.ctaband .wrap::before,.ctaband .wrap::after{content:"";position:absolute;z-index:-1;pointer-events:none;
background-repeat:no-repeat;background-position:center;background-size:contain;}
.ctaband .wrap::before{left:-30px;top:-44px;width:180px;aspect-ratio:278 / 320;background-image:url('../images/kv_line01.svg');}
.ctaband .wrap::after{right:-30px;bottom:-54px;width:300px;aspect-ratio:252 / 132;background-image:url('../images/kv_line02.svg');}
.ctaband .ctaband-pre{font-size:17px;font-weight:600;opacity:.9;}
.ctaband h3{font-family:var(--font-head);font-size:30px;font-weight:900;margin-top:4px;line-height:1.4;}
.ctaband h3 .cta-em{font-size:1.3em;}
/* ===== 5 powers ===== */
/* 写真のはみ出し込みでコンテンツ幅に収める（カードを内側にインセット＋写真を絶対配置） */
.power{position:relative;background:#fff;border-radius:18px;box-shadow:var(--shadow);overflow:visible;
margin-left:100px;width:calc(100% - 100px);min-height:248px;
display:flex;align-items:center;padding:36px 44px 36px 178px;margin-bottom:30px;}
.power.rev{margin-left:0;margin-right:100px;padding:36px 178px 36px 44px;}
.power-photo{position:absolute;top:50%;left:-100px;transform:translateY(-50%);
width:248px;height:248px;border-radius:50%;border:0;background:none;overflow:hidden;}
/* 写真未挿入/未読込時のプレースホルダ（説明テキスト）は表示しない */
.power-photo > span{display:none;}
.power-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;z-index:1;}
.power.rev .power-photo{left:auto;right:-100px;}
.power-body{flex:1;min-width:0;}
/* POINT/01 を写真に載せる丸バッジ（POINT上・01下の縦積み） */
/* POINTバッジはタイトル・キャプションの左に配置 */
.power-head{display:flex;align-items:center;gap:16px;margin-bottom:14px;}
.power-headtext{min-width:0;}
.power-no{flex:none;width:68px;height:68px;border-radius:50%;
display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;
background:linear-gradient(135deg,#D6097F 0%,#7C3AED 52%,#1763E9 100%);color:#fff;}
.power-no span{font-family:var(--font-en);font-weight:800;letter-spacing:.14em;font-size:9px;opacity:.95;}
.power-no b{font-family:var(--font-en);font-weight:900;font-size:25px;line-height:1;margin-top:1px;}
/* POINTバッジ 比較用3パターン */
.power-no.pat1{background:linear-gradient(135deg,#D6097F 0%,#7C3AED 52%,#1763E9 100%);}
.power-no.pat2{background:linear-gradient(135deg,#1763E9,#3D7DEF);}
.power-no.pat2 span,.power-no.pat2 b{background:linear-gradient(135deg,#FFD1EC,#E6D4FF,#CFE0FF);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;opacity:1;}
.power-body h3{font-family:var(--font-head);font-size:25px;font-weight:900;line-height:1.3;}
.power-body .ptag{color:var(--blue);font-size:14px;font-weight:700;margin:0 0 4px;}
.power-body .pdesc{font-size:16px;color:#3a4150;line-height:1.95;}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0;}
.tags > span{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid #CFD6E0;color:#4a5160;border-radius:4px;padding:6px 14px;font-size:14px;font-weight:600;}
.tagic{display:inline-block;width:1.37em;height:1.37em;flex:none;color:var(--cta-icon);}
.tagic svg{width:100%;height:100%;display:block;stroke:var(--blue);stroke-width:2.4;}
/* 暗い背景上のリンク矢印は視認性のため白 */
.hero-link .tic-ui svg{stroke:#fff;}
.power-result{display:flex;align-items:flex-start;gap:8px;background:var(--blue-soft);border-radius:10px;padding:14px 16px;font-weight:700;color:var(--blue-deep);font-size:13.5px;}
.power-result::before{content:"";width:2.25em;height:2.25em;flex:none;margin-top:-.1em;
background:url('data:image/svg+xml;utf8,') center/contain no-repeat;}
/* ===== Diagnosis ===== */
/* コース診断：全セクション中で一番濃い背景にして目立たせる（濃紺グラデ） */
#diagnosis{background:linear-gradient(150deg,#0C1A42 0%,#15296F 50%,#1E50AE 100%);}
#diagnosis .h2{color:#fff;}
#diagnosis .h2 .accent,#diagnosis .h2 .h2-num{color:#7DB4FF;}
#diagnosis .eyebrow{color:#9FC2FF;}
#diagnosis .sec-arch text{fill:url(#archgrad-white);fill-opacity:.85;}
/* 質問は白カード。上部に人物＋Q吹き出し、下半分は薄紫グラデ */
.quiz-box{background:#fff;border-radius:18px;box-shadow:var(--shadow);overflow:hidden;padding:0;position:relative;}
/* コンシェルジュ（白カード上部・左／120%） */
.quiz-concierge{position:absolute;left:48px;top:-10px;width:162px;height:auto;z-index:3;} /* quiz-q内へ移動したぶん上に補正（実効40px） */
/* 結果表示時は白カードを外し、結果カードだけを濃紺背景に乗せる */
.quiz-box.show-result{background:transparent;box-shadow:none;overflow:visible;}
.quiz-box.show-result .quiz-concierge{display:none;}
.quiz-stage{position:relative;}
/* 切替表示：質問カード／結果カードが差し替わる */
.quiz-q{display:none;}
.quiz-q.active{display:block;}
.quiz-q.locked{opacity:.45;}
.q-in{animation:qfade .34s ease both;}
@keyframes qfade{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
.quiz-q.active{position:relative;}
/* Q吹き出し：白カード上部・人物の右に全幅。塗り白＝線だけ／青の実線。三角と線は一体の輪郭 */
.quiz-qhead{position:relative;display:flex;align-items:center;gap:12px;
margin:50px 50px 46px 252px;padding:48px 48px;border-radius:16px;
border:3px solid #2E6FE0;background:#fff;
font-weight:900;font-size:21px;color:var(--ink);line-height:1.6;text-align:left;}
/* 尻尾：外=線色／内=白(カードと同色)で輪郭だけ。線とつながって見える */
.quiz-qhead::before{content:"";position:absolute;left:-18px;top:30px;
border:14px solid transparent;border-right:18px solid #2E6FE0;border-left:0;}
.quiz-qhead::after{content:"";position:absolute;left:-12px;top:33px;
border:11px solid transparent;border-right:15px solid #fff;border-left:0;}
/* 回答：カード下半分・薄紫グラデ（端まで／角丸はカードのoverflowで処理）。選択肢で縦を満たし、やり直すは最下段中央 */
.quiz-opts{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:1fr auto;gap:16px 14px;min-height:280px;
background:linear-gradient(135deg,#F4E6F4 0%,#E9E5F8 48%,#E1EBFB 100%);padding:30px;}
/* Q番号：丸で囲まず、文字をグラデに */
.quiz-qhead .qn{width:auto;height:auto;border-radius:0;background:linear-gradient(135deg,#D6097F 0%,#7C3AED 52%,#1763E9 100%);
-webkit-background-clip:text;background-clip:text;color:transparent;
display:inline;flex:0 0 auto;font-family:var(--font-en);font-weight:900;font-size:34px;line-height:1;letter-spacing:.02em;}
/* Q2・Q3のやり直す：回答エリア最下段の中央（結果カードのやり直すと同デザイン） */
.quiz-redo{grid-column:1/-1;justify-self:center;align-self:end;margin-top:6px;display:inline-flex;align-items:center;gap:6px;
font-size:12.5px;font-weight:700;color:var(--gray);background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 18px;cursor:pointer;}
.quiz-redo:hover{border-color:var(--blue);color:var(--blue);}
.quiz-q.locked .qn{border-color:#B8BFCB;color:#B8BFCB;}
.quiz-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.quiz-opts.two{grid-template-columns:repeat(2,1fr);}
.opt{position:relative;border:1px solid var(--line);border-radius:14px;background:#fff;padding:22px 22px;cursor:pointer;transition:.16s;display:flex;gap:14px;align-items:center;box-shadow:0 4px 14px rgba(67,40,160,.10);}
.opt:hover{background:var(--cta-soft);box-shadow:inset 0 0 0 4px var(--cta),0 8px 22px rgba(229,9,127,.18);transform:translateY(-2px);}
.opt.selected{border:4px solid var(--cta);background:var(--cta-soft);}
.opt .ic{flex:0 0 54px;width:54px;height:54px;border-radius:50%;background:#EEF2F8;display:flex;align-items:center;justify-content:center;font-size:18px;}
.opt .ic .opt-tic{display:inline-block;width:1.65em;height:1.65em;flex:none;}
.opt .ic .opt-tic svg{width:100%;height:100%;display:block;stroke-width:1.9;}
.opt .ot{font-weight:800;font-size:17.5px;}
.opt .od{font-size:14.5px;color:var(--gray);margin-top:4px;line-height:1.6;}
.opt.selected::after{content:"";position:absolute;top:12px;right:14px;width:22px;height:22px;border-radius:50%;
background:var(--cta) url('data:image/svg+xml;utf8,') center/13px no-repeat;}
.quiz-arrow{display:flex;justify-content:center;margin:8px 0 22px;font-size:24px;}
.quiz-arrow i{width:1.5em;height:1.5em;display:block;
background:url('data:image/svg+xml;utf8,') center/contain no-repeat;}
/* 3問すべて回答するまで矢印・結果は非表示 */
.quiz-arrow{display:none;}
.quiz-arrow.is-visible{display:flex;}
#result{display:none;}
#result.is-visible{display:block;}
/* 診断結果カード：コンシェルジュの男性＋おすすめコースを中央に */
.result{position:relative;background:#fff;border:3px solid var(--c-skill);border-radius:20px;box-shadow:0 22px 55px rgba(23,99,233,.22);padding:30px 34px 32px;text-align:left;}
.result.result-beginner{border-color:var(--c-full);}
.result.result-middle{border-color:var(--c-skill);}
.result.result-expert{border-color:var(--c-practice);}
/* 上段：人物（左）＋ 診断結果〜詳細（中）＋ 受講期間ピル（右） */
.result-top{display:flex;align-items:center;gap:28px;margin-bottom:24px;}
.result-concierge{width:269px;height:auto;flex:none;display:block;margin:0;}
.result-head{flex:1 1 0;min-width:0;text-align:left;}
.result .result-label{display:inline-block;vertical-align:middle;font-family:var(--font-en);font-weight:800;letter-spacing:.14em;font-size:13px;color:#fff;background:linear-gradient(135deg,#5B21B6,#1763E9);border-radius:999px;padding:6px 20px;margin:0 12px 0 0;}
.result .result-rec{display:inline-block;vertical-align:middle;font-size:15px;font-weight:800;color:var(--gray);margin:0;}
/* コース名＋詳細（左）と受講期間ピル（右）を横並び */
.result-headrow{display:flex;align-items:center;gap:24px;margin-top:16px;}
.result-headmain{flex:1 1 0;min-width:0;}
.result-headmain .rname{margin-bottom:10px;}
.result-headmain .rlead{margin:0;}
.result .rname{font-family:var(--font-head);font-weight:900;font-size:34px;line-height:1.3;
background:linear-gradient(135deg,#5B21B6,#1763E9);-webkit-background-clip:text;background-clip:text;color:transparent;}
.result .rmeta{flex:none;display:flex;flex-direction:column;gap:8px;color:#fff;background:linear-gradient(135deg,#5B21B6,#1763E9);border-radius:12px;padding:16px 24px;}
.result .rmeta .rrow{display:flex;align-items:baseline;gap:10px;font-size:15.5px;font-weight:700;white-space:nowrap;}
.result .rmeta .rk{opacity:.85;}
.result .rmeta .fig{font-family:var(--font-en);font-weight:900;font-size:23px;color:#fff;}
.result .rlead{font-size:15.5px;line-height:1.9;color:var(--ink);text-align:left;}
.result .rwhy{font-weight:800;font-size:15px;color:var(--ink);margin-top:20px;margin-bottom:12px;}
.reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:24px;}
.reason{background:var(--blue-soft);border-radius:12px;padding:16px;}
.reason .rt{font-weight:800;font-size:14px;display:flex;gap:8px;align-items:center;line-height:1.4;}
.reason .rt::before{content:"";width:1.4em;height:1.4em;flex:none;
background:url('data:image/svg+xml;utf8,') center/contain no-repeat;}
.reason .rd{font-size:14px;color:var(--gray);margin-top:6px;line-height:1.65;}
.result-cta{text-align:center;}
.res-cta-sp{display:none;}
.result-cta .small{font-size:13px;font-weight:700;color:var(--cta);margin-bottom:10px;}
.result-redo{display:inline-block;margin-top:14px;font-size:12.5px;color:var(--gray);border:1px solid var(--line);border-radius:999px;padding:7px 18px;cursor:pointer;background:#fff;}
/* ===== Course cards ===== */
.course-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:28px;align-items:stretch;}
.ccard{cursor:pointer;}
.ccard-acc{display:none;} /* PCでは非表示（PCはタブ式の#cur-detailを使用） */
.acc-ind{display:none;}
.ccard{position:relative;background:#fff;border-radius:16px;padding:28px 24px;box-shadow:var(--shadow);transition:.18s;}
.ccard.active{border:4px solid var(--cta);box-shadow:var(--shadow);}
.ccard.active::before{
content:"おすすめ";position:absolute;top:-14px;left:50%;transform:translateX(-50%);
background:linear-gradient(135deg,var(--cta),var(--cta-dark));color:#fff;
font-weight:900;font-size:12px;letter-spacing:.08em;
padding:5px 18px;border-radius:999px;white-space:nowrap;
box-shadow:0 6px 16px rgba(198,30,120,.35);
}
/* タブ→下のカリキュラムへの接続三角 */
.ccard.active::after{content:"";position:absolute;left:50%;bottom:-26px;transform:translateX(-50%);
border-left:15px solid transparent;border-right:15px solid transparent;border-top:18px solid var(--cta);}
.ccard .lvl{display:inline-block;font-size:12px;font-weight:700;padding:5px 14px;border-radius:4px;margin-bottom:12px;}
/* レベルバッジは各コースの薄い色（フルサポート=紫／スキルアップ=青／実践=ティール） */
.lvl.beginner{background:#F0E4FA;color:#7E27D2;}
.lvl.middle{background:#E4E9FB;color:#3F2BD2;}
.lvl.expert{background:#DBEFF6;color:#0A6BC9;}
.ccard h3{font-family:var(--font-head);font-size:20px;font-weight:900;margin-bottom:12px;}
.ccard .meta{display:flex;align-items:center;justify-content:space-between;font-size:13px;color:var(--gray);border-top:1px dashed var(--line);border-bottom:1px dashed var(--line);padding:12px 0;margin-bottom:14px;}
.ccard .meta .dur{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;}
.cic{display:inline-flex;width:1.05em;height:1.05em;flex:none;color:var(--gray);}
.cic svg{width:100%;height:100%;display:block;}
.ccard .meta .price{color:var(--blue-deep);font-weight:700;}
.ccard .meta .price .fig{font-size:32px;color:var(--blue);}
.ccard.active .meta .price .fig{font-size:36px;color:var(--cta);}
.ccard .cdesc{font-size:14px;color:var(--gray);line-height:1.8;}
.curriculum{background:var(--blue-soft2);border-radius:18px;overflow:hidden;box-shadow:var(--shadow);}
.cur-head{background:var(--grad-full);color:#fff;padding:22px 28px;display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;}
.curriculum.cur-middle .cur-head{background:var(--grad-skill);}
.curriculum.cur-expert .cur-head{background:var(--grad-practice);}
.cur-head .lvl{display:inline-block;font-size:12px;font-weight:700;padding:5px 14px;border-radius:4px;margin-bottom:8px;background:rgba(255,255,255,.22);color:#fff;}
.cur-head .cname{font-family:var(--font-head);font-size:20px;font-weight:900;color:#fff;}
.cur-head .cmeta{font-size:13px;color:#fff;text-align:right;line-height:1.9;}
.cur-head .cmeta .fig{font-size:15px;color:#fff;}
.cur-lead{padding:22px 28px;font-size:14px;color:#3a4150;}
.months{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;padding:0 28px 8px;}
.month{background:#fff;border-radius:12px;padding:0 0 16px;overflow:hidden;border:1px solid var(--line);}
.month .mh{background:var(--grad-full);color:#fff;text-align:center;font-family:var(--font-en);font-weight:800;font-size:14px;letter-spacing:.04em;padding:10px;}
.curriculum.cur-middle .month .mh{background:var(--grad-skill);}
.curriculum.cur-expert .month .mh{background:var(--grad-practice);}
.month .mt{font-weight:800;font-size:14.5px;text-align:center;padding:14px 12px 10px;line-height:1.4;}
.month ul{list-style:none;padding:0 16px;}
.month li{font-size:12.5px;color:var(--gray);padding:5px 0 5px 16px;position:relative;line-height:1.5;}
.month li::before{content:"";position:absolute;left:0;top:11px;width:6px;height:6px;border-radius:50%;background:var(--blue);}
.cur-goal{background:#E2E6EC;margin:18px 28px;border-radius:10px;padding:16px 20px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;font-size:13.5px;}
.cur-goal b{font-weight:800;display:inline-flex;align-items:center;gap:8px;}
.cur-goal b::before{content:"";width:1.4em;height:1.4em;flex:none;
background:url('data:image/svg+xml;utf8,') center/contain no-repeat;}
.cur-goal .g{display:flex;align-items:center;gap:7px;font-weight:600;}
.cur-goal .g::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--blue);}
.cur-foot{padding:0 28px 22px;color:var(--gray-light);font-size:12px;}
/* ===== Price table ===== */
.price{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;background:transparent;filter:drop-shadow(0 14px 26px rgba(67,40,160,.18));}
.price th,.price td{padding:18px 16px;text-align:center;border-bottom:2px solid var(--line);border-right:2px solid var(--line);background:#fff;}
.price tr td:last-child,.price tr th:last-child{border-right:0;}
/* タブ風ヘッダー（左上の空セルは透明＝無し） */
.price thead th{color:#fff;font-weight:800;line-height:1.4;font-size:16px;border:none;border-radius:14px 14px 0 0;padding:15px 12px;}
.price thead th:first-child{background:transparent;border-radius:0;}
.price thead th:nth-child(2){background:var(--grad-full);}
.price thead th:nth-child(3){background:var(--grad-skill);}
.price thead th:nth-child(4){background:var(--grad-practice);}
.price tbody th{background:transparent;font-weight:700;white-space:nowrap;}
.price tbody tr:first-child th,.price tbody tr:first-child td{border-top:2px solid var(--line);}
.price tbody tr:last-child th{border-bottom-left-radius:12px;}
.price tbody tr:last-child td:last-child{border-bottom-right-radius:12px;}
.price td.fee{vertical-align:bottom;}
.price .strike{text-decoration:line-through;color:var(--gray-light);font-size:13px;}
.price .op{display:block;color:var(--cta);font-weight:800;font-size:12px;}
.price .op b{font-weight:900;}
.price .pnum{font-family:var(--font-en);font-weight:900;font-size:38px;line-height:1;letter-spacing:-.02em;color:var(--cta);}
.price .punit{font-family:var(--font-head);font-weight:700;font-size:12px;color:var(--cta);margin-left:1px;}
.price .free{font-weight:900;color:var(--cta);font-size:20px;}
.price td .fig{font-family:var(--font-en);font-weight:800;font-size:17px;color:var(--navy);}
.price-note{color:var(--gray);font-size:12px;margin-top:18px;text-align:center;line-height:1.9;}
/* ===== Voices（カルーセル：1枚メイン＋右に次の人がのぞく）===== */
.voice-carousel{position:relative;}
/* 左右18%の余白で、選択カードが中央に来る（最初の1枚も中央）。上下はシャドウが切れないよう広めに確保 */
.voice-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
padding:22px 13% 52px;scrollbar-width:none;}
.voice-track::-webkit-scrollbar{display:none;}
/* ↓ この64%を変えるとメインカードの幅＝のぞく量を調整できます（小さいほど次が大きく見える） */
.voice{position:relative;flex:0 0 100%;scroll-snap-align:center;background:#fff;border-radius:16px;box-shadow:var(--shadow);overflow:hidden;display:block;}
/* エリカさん（1枚目）の写真を顔中心に拡大 */
.voice:first-child .voice-face img{transform:scale(1.2);object-position:center 22%;}
.vc-btn{position:absolute;top:40%;transform:translateY(-50%);z-index:3;width:46px;height:46px;border-radius:50%;
background:#fff;border:1px solid var(--line);box-shadow:0 6px 18px rgba(67,40,160,.16);
display:flex;align-items:center;justify-content:center;cursor:pointer;}
.vc-btn:hover{background:var(--blue-soft);}
.vc-btn svg{width:22px;height:22px;stroke:var(--blue);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.voice-dots{display:flex;justify-content:center;gap:8px;margin-top:-28px;}
.voice-dots button{width:9px;height:9px;border-radius:50%;border:0;background:var(--line);cursor:pointer;padding:0;transition:width .2s ease,background .2s ease;}
.voice-dots button.active{background:var(--blue);width:24px;border-radius:5px;}
.vc-prev{left:-10px;}
.vc-next{right:-10px;}
/* 名前は一番上 */
.voice-name-row{padding:30px 30px 0;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;}
.voice-name{font-weight:800;font-size:20px;}
.voice-attr{font-size:16px;color:var(--gray);}
.voice-body{padding:16px 30px 30px;}
/* 写真は名前＋悩みの右側にフロートさせ、本文が回り込む */
.voice-firstrow{margin-bottom:14px;}
.voice-firstrow .voice-q{margin-bottom:0;}
.voice-face{float:right;width:200px;height:200px;border-radius:16px;overflow:hidden;background:#E7EAF0;margin:30px 30px 14px 18px;}
.voice-face img{width:100%;height:100%;object-fit:cover;border-radius:16px;}
.voice-before{background:#F5F7FA;border-radius:10px;padding:12px 14px;font-size:14px;color:var(--gray);margin-bottom:12px;}
.voice-before b{display:block;color:var(--navy);font-size:11.5px;margin-bottom:3px;}
.voice-result{display:flex;align-items:center;gap:7px;font-weight:800;color:var(--blue-deep);font-size:13.5px;background:var(--blue-soft);border-radius:8px;padding:9px 12px;margin-bottom:12px;}
.voice-result::before{content:"";width:1.5em;height:1.5em;flex:none;
background:url('data:image/svg+xml;utf8,') center/contain no-repeat;}
.voice-result .fig{font-family:var(--font-en);font-weight:900;font-size:17px;color:var(--cta);}
.voice-text{font-size:16px;color:#3a4150;line-height:1.85;flex:1;}
/* 受講生の声：Q&A項目 */
.voice-q{margin-bottom:14px;}
.voice-q:last-child{margin-bottom:0;}
.voice-q b{display:flex;align-items:center;gap:7px;color:var(--blue);font-size:14.5px;font-weight:800;margin-bottom:6px;}
.voice-q b::before{content:"";width:1.3em;height:1.3em;flex:none;background:center/contain no-repeat;}
/* 受講前の悩み・動機＝ヘルプ */
.q-worry b::before{background-image:url('data:image/svg+xml;utf8,');}
/* 初回の受講体験＝本 */
.q-exp b::before{background-image:url('data:image/svg+xml;utf8,');}
/* 達成したい目標＝ターゲット */
.q-goal b::before{background-image:url('data:image/svg+xml;utf8,');}
/* 検討者へのメッセージ＝吹き出し */
.q-msg b::before{background-image:url('data:image/svg+xml;utf8,');}
.voice-q p{font-size:14.5px;color:#3a4150;line-height:1.8;}
.voice-q.voice-msg{background:var(--blue-soft);border-radius:10px;padding:14px 16px;margin-top:2px;}
.voice-q.voice-msg b{color:var(--blue-deep);}
.voice-link{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:14px;border:1px solid var(--blue);color:var(--blue);font-weight:700;border-radius:999px;padding:11px;font-size:13px;}
.small-note{color:var(--gray-light);font-size:12px;margin-top:20px;text-align:center;}
/* ===== Instructor ===== */
.teacher{background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:34px;}
.teacher-top{display:grid;grid-template-columns:1fr 240px;grid-template-areas:"head photo" "bio photo";column-gap:30px;align-items:start;}
.teacher-photo{grid-area:photo;width:100%;aspect-ratio:3/4;height:auto;object-fit:cover;object-position:center top;border-radius:14px;display:block;}
.teacher-head{grid-area:head;}
.teacher-role{color:var(--gray);font-size:13px;font-weight:600;}
.teacher-name{font-family:var(--font-head);font-size:30px;font-weight:900;margin:4px 0;letter-spacing:.04em;}
.teacher-tag{color:var(--blue);font-weight:700;font-size:13.5px;margin-bottom:16px;}
.teacher-bio{grid-area:bio;font-size:16px;color:#3a4150;line-height:1.95;margin-top:14px;}
.teacher-bio p{margin-bottom:10px;}
.book-h{grid-area:head;text-align:center;font-size:18px;font-weight:800;margin:0 0 18px;}
/* グラデ背景はカード端まで（余白なし）／本・本文はグラデ内で余白あり */
.book{display:grid;grid-template-columns:200px 1fr;grid-template-areas:"head head" "cover title" "cover body";column-gap:28px;align-items:start;background:linear-gradient(135deg,#F4E6F4 0%,#E9E5F8 48%,#E1EBFB 100%);margin:18px -34px -34px;padding:32px 34px;border-radius:0 0 18px 18px;}
.book-cover-link{grid-area:cover;align-self:center;display:block;transition:opacity .15s;}
.book-title{grid-area:title;}
.book-body{grid-area:body;}
.book-cover-link:hover{opacity:.9;}
.book-cover{width:100%;height:auto;display:block;}
.book-title{font-size:18px;font-weight:800;margin-bottom:12px;}
.book-desc{font-size:16px;color:#3a4150;line-height:1.9;}
.book-btn{display:inline-flex;align-items:center;gap:6px;margin-top:16px;border:1.5px solid var(--blue);color:var(--blue);background:#fff;font-weight:800;font-size:13px;border-radius:999px;padding:10px 22px;transition:.18s;}
.book-btn:hover{background:var(--blue-soft);}
.book-btn .tic-ui{width:1em;height:1em;}
.book-btn .tic-ui svg{stroke:var(--blue);stroke-width:2.6;}
/* ===== Flow ===== */
/* Step丸(74px)込みで1080px幅。丸の左端を内容左端に、カードは丸の中央(=37px)からインデント */
.flow-step{position:relative;display:grid;grid-template-columns:1fr 220px;grid-template-areas:"ttl illust" "body illust";gap:6px 24px;align-items:center;
background:#fff;border-radius:16px;box-shadow:var(--shadow);margin:0 0 46px 37px;padding:30px 34px 30px 60px;overflow:visible;}
.flow-ttl{grid-area:ttl;}
.flow-body{grid-area:body;}
.flow-illust{grid-area:illust;}
.flow-step:last-child{margin-bottom:0;}
/* カード間の下向き三角 */
.flow-step:not(:last-child)::after{content:"";position:absolute;left:50%;bottom:-30px;transform:translateX(-50%);
width:34px;height:20px;background:linear-gradient(160deg,#5B21B6 0%,#2536C8 50%,#1763E9 100%);
clip-path:polygon(50% 100%,0 0,100% 0);z-index:1;}
/* グラデの丸い数字（左上にはみ出す） */
.flow-no{position:absolute;top:24px;left:-37px;z-index:2;width:74px;height:74px;border-radius:50%;
background:linear-gradient(160deg,#5B21B6 0%,#2536C8 50%,#1763E9 100%);color:#fff;
display:flex;flex-direction:column;align-items:center;justify-content:center;}
.flow-no small{font-family:var(--font-en);font-size:10px;letter-spacing:.16em;opacity:.85;font-weight:700;}
.flow-no b{font-family:var(--font-en);font-size:30px;font-weight:900;line-height:1;margin-top:1px;}
/* 右側イラスト枠：220×200のjpgを差し込む（未挿入時はプレースホルダー） */
.flow-illust{justify-self:center;width:220px;height:200px;border-radius:10px;overflow:hidden;
background:#E3E7EE;border:1px dashed #C3C9D4;display:flex;align-items:center;justify-content:center;
font-size:12px;font-weight:600;color:var(--gray-light);}
.flow-illust::before{content:"イラスト";}
.flow-illust img{width:100%;height:100%;object-fit:cover;display:block;}
/* flow03は下に余白がある縦長画像。上が切れないよう上基準で表示 */
.flow-illust--top img{object-position:top;}
.flow-illust:has(img)::before{content:none;}
.flow-illust:has(img){border:0;background:none;}
.flow-ttl{font-family:var(--font-head);font-size:18px;font-weight:900;margin:0;}
.flow-body p{font-size:16px;color:#3a4150;line-height:1.9;}
.flow-meta{display:inline-flex;align-items:center;gap:6px;margin-top:12px;background:#fff;border:1px solid #CFD6E0;color:#4a5160;font-size:14px;font-weight:600;border-radius:4px;padding:6px 14px;}
/* ===== FAQ ===== */
/* align-items:start で開閉が各セル独立。閉じた高さは summary の min-height で左右そろえる */
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start;}
.faq{background:#fff;border-radius:12px;overflow:hidden;box-shadow:var(--shadow);}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:94px;
font-weight:800;font-size:18px;color:var(--navy);padding:20px 22px;line-height:1.5;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::before{content:"Q.";font-family:var(--font-en);font-weight:900;font-size:21px;line-height:1.1;color:var(--blue);flex:none;}
.faq summary::after{content:"";margin-left:auto;flex:none;width:1.4em;height:1.4em;align-self:center;transition:transform .25s ease;
background:url('data:image/svg+xml;utf8,') center/contain no-repeat;}
.faq[open] summary::after{transform:rotate(180deg);}
.faq summary .qt{flex:1;}
.faq-a{display:flex;gap:10px;padding:0 22px 20px;}
.faq-a::before{content:"A.";font-family:var(--font-en);font-weight:900;font-size:21px;line-height:1.1;color:var(--cta);flex:none;}
.faq-a p{font-size:16px;color:#3a4150;line-height:1.85;flex:1;}
/* ===== Articles ===== */
.art-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:36px;}
.art-card{display:block;background:transparent;box-shadow:none;border-radius:0;overflow:visible;transition:transform .18s ease;}
.art-card:hover{transform:translateY(-3px);}
.art-thumb{width:100%;height:160px;min-height:160px;object-fit:cover;border-radius:12px;margin-bottom:0;display:block;background:#EEF1F6;box-shadow:var(--shadow);}
.art-card .art-thumb{border-radius:12px;}
.art-card .art-title{padding:12px 2px 0;}
.art-title{font-weight:800;font-size:14px;line-height:1.5;
display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.art-loading{grid-column:1/-1;text-align:center;color:var(--gray-light);font-size:13px;padding:30px 0;}
.center{text-align:center;}
/* footer */
/* Spir 日程調整 */
.spir-box{background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:12px;max-width:760px;margin:0 auto;}
/* 日程予約セクション：なるべく画面内に収まるよう余白を圧縮 */
#form{padding-bottom:48px;}
#form .h2{margin-bottom:6px;}
#form .h2-sub{margin-bottom:16px;}
/* フッター */
footer{background:#000;color:#c3cee0;font-size:13px;}
.footer-main{max-width:1128px;margin:0 auto;padding:48px 24px 28px;display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;}
.footer-logo{height:40px;width:auto;display:block;}
.footer-cols{display:flex;gap:64px;flex-wrap:wrap;}
.footer-col-ttl{color:#fff;font-weight:800;font-size:14px;margin-bottom:14px;}
.footer-col ul{list-style:none;margin:0;padding:0;}
.footer-col li{margin-bottom:10px;}
.footer-col a{color:#c3cee0;transition:color .15s;}
.footer-col a:hover{color:#fff;}
.footer-muted{color:#7e8ba6;}
.footer-company{max-width:1128px;margin:0 auto;padding:24px;border-top:1px solid rgba(255,255,255,.12);line-height:1.9;color:#aab6cd;}
.footer-company-name{color:#fff;font-weight:700;margin-bottom:4px;}
.footer-copy{text-align:center;padding:18px 24px;font-family:var(--font-en);font-size:12px;color:#8a96b0;border-top:1px solid rgba(255,255,255,.12);}
/* sticky mobile cta */
.float-cta{position:fixed;left:0;right:0;bottom:0;z-index:60;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);
border-top:1px solid var(--line);padding:10px 16px;display:none;transform:translateY(120%);transition:transform .3s ease;}
.float-cta.is-visible{transform:translateY(0);}
.float-cta .btn-cta{width:100%;padding:14px;font-size:15px;}
/* ===== Responsive ===== */
@media(max-width:900px){
.hero .wrap{grid-template-columns:minmax(0,1fr);justify-items:stretch;} /* SPは中央・全幅（左寄せ漏れ・はみ出し防止） */
.hero-left{max-width:none;min-width:0;}
.hero h1{font-size:34px;}
.hero-white{display:none;}
/* タブレット/SP：人物は縮小して四隅に配置（テキストの背面に） */
.hero-bg{width:clamp(110px,24vw,210px);}
.hero-bg.l{left:auto;right:0;bottom:0;width:clamp(150px,40vw,220px);}
.hero-bg.r{left:auto;right:0;top:0;}
.hero-form{margin-left:0;margin-right:0;width:auto;}
.hero-left{margin-left:0;}
.env-grid,.course-cards,.reasons{grid-template-columns:1fr;gap:16px;}
.voice{flex:0 0 86%;}
.solve-band{margin-top:-95px;padding:110px 16px 0;}
.solve-inner{min-height:0;}
.solve-ill{display:none;}
.solve{max-width:none;}
.months{grid-template-columns:1fr;}
.teacher-top,.book{grid-template-columns:1fr;}
.power,.power.rev{position:relative;flex-direction:column;align-items:center;gap:18px;margin:0 0 18px;width:auto;min-height:0;padding:26px 22px;}
.power-photo,.power.rev .power-photo{position:relative;transform:none;left:auto;right:auto;margin:0 auto;width:170px;height:170px;}
.power-body{width:100%;}
/* POINTバッジを写真の左上に乗せる */
.power-no{position:absolute;top:14px;left:calc(50% - 96px);z-index:2;}
.art-grid{grid-template-columns:1fr 1fr;}
.logo-marquee__list{height:78px;}
.logo-marquee__item img{max-height:46px;}
.quiz-opts,.quiz-opts.two{grid-template-columns:1fr;}
}
@media(max-width:680px){
.sec{padding:56px 0;}
.hero{padding-top:35px;padding-bottom:125px;} /* 上15詰め / 下は女性の頭が入る余白を確保 */
/* コース診断：SPは人物を上・中央、Q吹き出しはその下（尻尾は上向き） */
.quiz-box{padding:0;}
/* SP：吹き出し(上・下向き矢印)→イラスト→選択肢 の順 */
.quiz-concierge{position:static;width:140px;margin:22px auto 6px;display:block;}
/* 吹き出しは下の選択肢カードと同じ幅（左右マージン0でカード内容幅に） */
.quiz-qhead{display:flex;margin:0 0 22px;min-height:0;padding:14px 16px;font-size:16px;justify-content:center;text-align:center;}
/* 下向き矢印：吹き出し下辺に密着させ、縁線が繋がる輪郭三角に（外=青線／内=白で縁だけ残す） */
.quiz-qhead::before{left:50%;right:auto;top:100%;bottom:auto;transform:translateX(-50%);border:14px solid transparent;border-top:16px solid #2E6FE0;border-bottom:0;margin-top:0;}
.quiz-qhead::after{left:50%;right:auto;top:100%;bottom:auto;transform:translateX(-50%);border:11px solid transparent;border-top:16px solid #fff;border-bottom:0;margin-top:-3px;}
.quiz-qhead .qn{font-size:26px;}
.quiz-opts{padding:16px;margin:0 -16px -24px;} /* 紫背景をカード端まで（左右・下の白余白を打ち消し） */
/* 結果モード：quiz-boxの余白を消し、結果カードを質問カードと同じ幅(24-366)・H2直下に揃える */
.quiz-box.show-result{padding:0;}
.result{padding:24px 18px;text-align:center;}
.result-top{flex-direction:column;align-items:center;gap:10px;margin-bottom:18px;}
.result-head{text-align:center;}
.result-concierge{width:180px;}
.result-headrow{flex-direction:column;align-items:center;gap:14px;}
.result-headmain{text-align:center;}
.result .rname{font-size:27px;}
.result .rmeta{align-items:flex-start;}
.result .rlead{text-align:left;}
.h2{font-size:25px;margin-bottom:0;} /* H2とコンテンツの間を16px詰める(16→0) */
.sec-arch{margin:-2px 0 -50px;} /* アーチ下に20px余白(-70→-50) */
.sec-arch text{font-size:30px;}
/* KV：中央揃え。AI×SEO→改行→ライティングスクール(1行)→英字を右揃えで下に */
.hero-left{text-align:center;}
.hero h1{flex-direction:column;align-items:center;gap:6px;}
.hero h1 .en{font-size:73px;} /* 140% */
.hero h1 .x{font-size:48px;} /* 140% */
.hero h1 .h1-jp{font-size:29px;line-height:1.1;} /* 110% */
.hero h1 .h1-jp br{display:none;} /* ライティングスクールを1行に */
/* 英字筆記体を SEO の下半分に重ねる・110% */
.hero-writing{position:absolute;width:143px;left:auto;right:-12px;top:24px;margin:0;align-self:auto;}
/* キャッチコピー中央 */
.hero-pre{font-size:13px;text-align:center;transform:none;}
.hero-pre-deco{width:231px;margin:-6px auto 0;} /* 110% */
.hero-lead{font-size:15px;line-height:1.8;}
/* 金のマーク：横2＋下1、余白を詰める */
.hero-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 4px;margin-bottom:22px;}
.hero-badges>span{padding:0 16px;font-size:12px;min-height:52px;line-height:1.4;} /* 文字と月桂樹の余白+2px */
.hero-badges>span::before,.hero-badges>span::after{width:20.7px;height:53px;} /* 月桂樹90% */
.hero-badges .bg-em{font-size:16px;}
/* 3個目もflex-basis:100%をやめ、内容幅で2段目中央＝1・2と同じ余白に */
/* hero背景：SPはsp_kv_bg.jpgに切替 */
.hero-bgfull{display:none;}
.hero-bgfull-sp{display:block;}
/* KV女性：頭が収まるよう下げきり、もう少し右へ */
.hero-bg.l{right:-14px;bottom:-20px;width:clamp(150px,42vw,230px);}
/* 注釈は左揃え */
.price-note,.cmp-note,.cur-foot,.small-note{text-align:left;}
.worry-grid,.faq-grid{grid-template-columns:1fr;}
.worry-grid,.faq-grid{gap:16px;}
.faq summary{font-size:16px;padding:16px 18px;min-height:86px;} /* 質問16px・余白を上下左右-4 */
.faq-a{padding:0 18px 16px;} /* 回答の余白も-4 */
.faq-a p{font-size:14px;} /* SP：回答本文を14px */
/* h2の行間+2px（25px×1.48≒37px） */
.h2{line-height:1.48;}
/* power-resultは本文と同じ16px */
.power-result{font-size:16px;}
/* 結果ボタン：SP文言に切替、高さ約2/3、行間-3px */
.res-cta-pc{display:none;}
.res-cta-sp{display:inline;}
#res-cta{padding:12px 22px;line-height:1.3;}
/* 中間CTA：brushを90%＋移動（lineはwrapの疑似要素で別途・ブレンドなし） */
.ctaband::before{width:272px;height:272px;left:-120px;top:-120px;} /* ブラシ1を120% */
.ctaband::after{width:285px;height:157px;right:-90px;bottom:-64px;} /* ブラシ2を80%・右30・下20 */
/* CTAのline（ブラシの上・ブレンドなし＝正しい色）。line01=70%右20下20 / line02=50% */
.ctaband .wrap{position:relative;}
.ctaband .wrap::before,.ctaband .wrap::after{content:"";position:absolute;z-index:-1;pointer-events:none;
background-repeat:no-repeat;background-position:center;background-size:contain;}
.ctaband .wrap::before{left:-40px;top:-44px;width:120px;aspect-ratio:278 / 320;background-image:url('../images/kv_line01.svg');} /* ライン1：下に10 */
.ctaband .wrap::after{right:-36px;bottom:-70px;width:135px;aspect-ratio:252 / 132;background-image:url('../images/kv_line02.svg');} /* ライン2：90%・右20・下20 */
.site-nav{display:none;}
.site .wrap > .btn-cta{display:none;} /* ヘッダー右上CTAは隠す（メニュー内に出す） */
.hb{display:flex;}
.site .wrap{padding:0 16px;height:64px;}
.cmp,.price{font-size:12px;}
.cmp th,.cmp td,.price th,.price td{padding:10px 6px;}
.ctaband .wrap{flex-direction:column;text-align:center;}
.float-cta{display:block;}
/* フロー：見出し左上・イラスト右上・本文は下に全幅 */
.flow-step{grid-template-columns:1fr 116px;grid-template-areas:"ttl illust" "body body";gap:6px 12px;align-items:start;padding:24px 18px 30px 18px;margin-left:0;}
.flow-no{width:54px;height:54px;top:-22px;left:-12px;} /* STEPバッジを10px上へ */
.flow-no b{font-size:22px;}
.flow-ttl{align-self:center;padding-left:0;} /* タイトルを本文と同じ左位置から開始 */
.flow-body p{font-size:14px;} /* 本文16→14 */
.flow-illust{justify-self:end;width:116px;height:auto;aspect-ratio:220 / 200;}
body{padding-bottom:74px;}
.table-scroll{overflow-x:auto;padding-bottom:15px;}
.table-scroll table{min-width:560px;}
/* h2：中央揃え＋左右に余白（端で切れない） */
.h2{padding:0 12px;}
/* 受講生の声：トラックpaddingを縮小しカード幅を確保（名前の縦積み防止） */
/* カルーセルを画面幅いっぱいに（wrapの左右24pxパディングを相殺） */
.voice-carousel{margin-left:-24px;margin-right:-24px;}
.voice-track{padding:8px 16px 44px;gap:0;} /* 上余白を詰めてリード〜カード間を他セクションと揃える */
/* 講師紹介文・本の紹介文の本文を14pt */
.teacher-bio,.book-desc{font-size:14px;}
/* カリキュラムカード：余白を上下左右-4 / ○ヶ月と金額の間に10px */
.ccard{padding:24px 20px;}
.ccard .meta{gap:10px;}
.voice{flex:0 0 100%;}
/* SP：名前(左)＋写真(右)を上段に、悩み等は回り込み */
.voice-face{width:120px;height:120px;margin:18px 16px 8px 14px;}
.voice-name-row{padding:18px 16px 0;}
.voice-body{padding:16px 22px 22px;} /* SPは従来どおり（PCの+8は適用しない） */
.vc-btn{width:32px;height:32px;}
.vc-btn svg{width:18px;height:18px;}
.vc-prev{left:2px;} /* 画面端寄り・カード端にはみ出す */
.vc-next{right:2px;}
/* コース診断カード：左右余白16px */
.quiz-box{padding:24px 16px;}
/* カリキュラム：SPは3コースのアコーディオン（PCのタブパネルは隠す） */
#cur-detail{display:none;}
.course-cards{margin-bottom:0;gap:14px;}
.ccard.active{border:0;}
.ccard.active::before,.ccard.active::after{display:none;}
/* アコーディオン：同じカード内で開く（余白・別カード感なし） */
.ccard{overflow:hidden;}
.ccard-acc{display:block;max-height:0;overflow:hidden;background:transparent;box-shadow:none;border-radius:0;
margin:14px -24px 0;padding:0;transition:max-height .3s ease;}
.ccard-acc.open{max-height:3000px;}
.ccard-acc .cur-head{margin:0;padding:14px 24px;border-radius:0;flex-wrap:wrap;gap:6px;}
.ccard-acc .cur-lead{padding:14px 24px 0;}
.ccard-acc .months{margin:0;padding:14px 24px 0;}
.ccard-acc .cur-goal{margin:14px 24px 0;}
/* OPEN/CLOSE：カード下部・KVのリンク風（テキスト＋シェブロン） */
.acc-ind{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:8px;
font-family:var(--font-en);font-weight:800;letter-spacing:.08em;font-size:13px;color:var(--blue);
border-top:1px solid var(--line);padding-top:14px;}
.acc-ind .acc-chev{width:1.25em;height:1.25em;stroke:var(--blue);stroke-width:2.4;transition:transform .25s ease;}
.ccard.acc-open .acc-ind .acc-chev{transform:rotate(180deg);}
/* 5つの力：写真→POINT+タイトル→テキスト。本文は左揃え */
.power,.power.rev{padding:22px 18px;}
/* タグ：font12・余白カット(左6/右4/上1/下3) */
.tags > span{font-size:12px;padding:5px 10px 3px 8px;}
.power-photo,.power.rev .power-photo{margin:0 auto 4px;}
.power-body{text-align:left;}
.power-head{justify-content:flex-start;}
/* 講師(石田)：写真を小さく、肩書・名前などと左右に並べる */
.teacher{padding:22px 18px;}
.teacher-top{grid-template-columns:104px 1fr;grid-template-areas:"photo head" "bio bio";column-gap:14px;row-gap:0;align-items:start;}
.teacher-photo{width:104px;}
.teacher-name{font-size:22px;}
.teacher-bio{font-size:14px;line-height:1.85;margin-top:12px;}
/* 出版書籍：表紙を小さく */
/* SP本：表紙左＋＜紹介＞とタイトルが右、本文は下で全幅 */
.book{grid-template-columns:104px 1fr;grid-template-areas:"cover head" "cover title" "body body";column-gap:14px;align-items:start;padding:20px 16px;margin:18px -18px -22px;}
.book-h{margin:0 0 8px;text-align:left;font-size:15px;}
.book-title{margin-bottom:0;}
.book-body{margin-top:14px;}
.book-cover{width:100%;margin:0;}
/* H2下のキャッチ：16px・左揃え */
.h2-sub{font-size:16px;text-align:left;line-height:1.7;margin-bottom:32px;}
/* 中間CTAの見出しを小さく */
.ctaband h3{font-size:21px;}
/* KV・中間CTAボタン：375pxで文字が折り返すため左右パディングを縮小（左-8/右-10） */
.hero-cta-row .btn-cta,.ctaband .btn-cta{padding-left:32px;padding-right:30px;}
/* お悩み：行間-3px、上下左右の余白-8px */
.worry{padding:10px 14px;line-height:25.8px;}
/* お悩み下の白余白を除去（.secのpadding一括指定で復活していたものを打ち消し） */
.worries-sec{padding-bottom:0;}
/* 解決：大きい文字を小さく／イラストを下に2個並べる */
.solve h3{font-size:21px;line-height:1.5;}
.solve h3 .accent{font-size:clamp(20px,6.4vw,29px);white-space:nowrap;} /* どのSP幅でも収まるよう自動調整 */
.solve-inner{flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:14px;}
.solve{flex:0 0 100%;order:0;margin-top:40px;} /* テキスト上に40px余白 */
.solve-ill,.solve-ill-l,.solve-ill-r{display:block;position:static;order:1;width:40%;max-width:170px;
right:auto;bottom:auto;transform:none;margin:0;align-self:auto;}
/* === SP限定の追加（PC共通には入れない）=== */
.spbr{display:inline;} /* SPのみ改行 */
.h2{text-wrap:balance;} /* その他h2の改行を整える */
.hw-pc{display:none;} /* 白版はPCのみ */
.hw-sp{display:block;} /* 青版をSP表示 */
/* KV装飾の移動（SP限定）：brush1+40 / brush2+150 / line01+30・80% */
.hero-brush.b1{left:-115px;}
.hero-brush.b2{display:none;} /* SPは右下ブラシ2を非表示 */
.hero-line.l1{left:-145px;width:clamp(228px,calc(16vw + 132px),296px);}
.hero-line.l2{width:clamp(144px,calc(16vw + 19px),183px);}
/* 実績見出しを1行に（フォント縮小＋数字まわりの余白を詰める） */
.logos .ttl{font-size:13px;gap:0 6px;flex-wrap:nowrap;}
.logos .ttl .ttl-lead{flex-basis:auto;}
.logos .ttl .ttl-fig{gap:2px;}
.logos .ttl .fig{font-size:22px;}
.logos .ttl .unit{font-size:13px;}
/* 受講料金の金額を80% */
.price .pnum{font-size:30px;}
/* 関連記事サムネは元画像の比率 */
.art-thumb{aspect-ratio:auto;height:auto;min-height:0;}
/* 比較表：項目名2行・データ中央＋マーク改行 */
.cmp tbody th{white-space:normal;line-height:1.4;}
.cmp tbody td{text-align:center;padding:16px 10px;white-space:nowrap;}
.cmp tbody td [class^="mk-"]{display:block;margin:0 auto 4px;}
}
/* タブレット(681〜900px)：中間CTA(ctaband)の装飾位置調整 */
@media(min-width:681px) and (max-width:900px){
.ctaband::before{width:437px;height:437px;left:-206px;} /* ブラシ01を80%・左に40 */
.ctaband .wrap::before{left:-50px;} /* ライン1：左に20 */
.ctaband .wrap::after{right:0;bottom:-24px;} /* ライン2：左に30・上に30 */
}
/* PC(>900px)：中間CTAの装飾を「右端/左端基準」に（中央=コンテンツ幅基準を解消） */
@media(min-width:901px){
/* ライン1：画面幅に依らず常にセクション左端より外へ-30 */
.ctaband .wrap::before{left:min(-30px, calc(534px - 50vw));}
/* ライン2：80%サイズ・右へ20px・上へ10px（右端基準は維持） */
.ctaband .wrap::after{width:240px;bottom:-44px;right:min(-50px, calc(514px - 50vw));}
/* ブラシ2：右端より外へ-30・120%サイズ */
.ctaband::after{right:-30px;width:475px;height:262px;}
}
/* ===== サンクスページ ===== */
.thx{text-align:center;padding-bottom:0;}
.thx-wrap{max-width:800px;}
.thx-lead{font-family:var(--font-head);font-size:clamp(22px,4vw,28px);font-weight:900;line-height:1.65;color:var(--ink);}
.thx-lead .accent{color:var(--blue);}
.thx-desc{margin-top:20px;font-size:16px;line-height:1.95;color:var(--gray);}
/* (1) ダウンロード資料：水色バンド(800)＋白カード(余白15) */
.thx-dl-band{width:calc(100% - 48px);max-width:1080px;margin:52px auto 0;background:#e6f0ff;border-radius:18px;padding:36px 28px 52px;}
.thx-dl-ttl{font-size:16px;font-weight:700;color:#051a6d;margin-bottom:18px;}
.thx-dl-card{display:block;max-width:534px;margin:0 auto;background:#fff;border-radius:14px;padding:15px;box-shadow:var(--shadow);text-decoration:none;transition:transform .18s ease,box-shadow .18s ease;}
.thx-dl-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);}
.thx-dl-thumb{display:block;width:100%;height:auto;border-radius:8px;}
.thx-dl-btn{display:block;margin-top:15px;background:linear-gradient(180deg,var(--btn-top) 0%,var(--btn) 26%,var(--btn-dark) 100%);color:#fff;font-weight:900;font-size:16px;letter-spacing:.02em;padding:15px;border-radius:999px;-webkit-text-stroke:.3px currentColor;text-shadow:0 1px 1px rgba(150,40,0,.32);}
/* お問い合わせ */
.thx-contact{margin-top:36px;text-align:center;font-style:normal;}
.thx-contact ul{list-style:none;padding:0;margin:0;display:inline-flex;flex-direction:column;gap:6px;}
.thx-contact li{font-size:14px;color:var(--gray);}
.thx-contact a{color:var(--blue);text-decoration:none;font-weight:700;}
/* (2) トップに戻る：LP小ボタン(btn-ghost) */
.thx-back{margin-top:24px;text-align:center;}
/* (3) 青バンド＋2バナー（各カード下に白ピル） */
.thx-banner-band{margin-top:80px;background:var(--blue);padding:48px 24px;}
.thx-links{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;max-width:720px;margin:0 auto;}
.thx-link{display:flex;flex-direction:column;flex:0 1 300px;min-width:240px;max-width:320px;}
.thx-link-card{display:flex;flex-direction:column;align-items:center;background:#fff;border-radius:14px;padding:20px 16px;text-decoration:none;box-shadow:0 8px 22px rgba(0,20,60,.18);transition:transform .18s ease,box-shadow .18s ease;}
.thx-link-card:hover{transform:translateY(-3px);}
.thx-link-text{font-family:var(--font-head);font-weight:900;font-size:15px;line-height:1.5;color:var(--ink);text-align:center;}
.thx-link-img{height:100px;width:auto;object-fit:contain;margin-top:12px;}
.thx-pill{margin-top:14px;width:100%;justify-content:center;padding:12px 20px;font-size:14px;}
@media(max-width:680px){
.thx-desc{font-size:14px;}
.thx-dl-band{margin-top:40px;padding:24px 16px;}
.thx-banner-band{margin-top:60px;padding:28px 16px;}
.thx-links{gap:16px;}
.thx-link{min-width:0;}
}