/* ランキングLP（design-b：ピンク×水色・780px 1カラム・PCで大きく書いてSPで落とす）
   部品の出典: adaf-board/skills/lp-design/design-b.skill.md §11
   文字サイズ・行間・色・角丸・影は typography-and-color.md（verify-layout.cjs の規則）を優先する:
   - 文字サイズは 10/11/12/13/14/16/18/20/24/28/32/40/48/56 のみ（design-b の 22/26/30/34px は使わない）
   - 白文字を載せる地は WCAG 4.5 を満たす濃い色（ピンク #FF83B0・水色 #77BFDD・緑 #35A37B の地に白は不合格）
   - 角丸は 100px / 10px / 4px / 上だけ10px の4種、影は ボタン・カードの2種
   余白は spacing-scale.md の 4/8/12/16/20/24/32/40/48/64px のみ */
:root{
  --pink:#FF83B0; --pink-ink:#C2185B; --blue:#77BFDD; --blue-ink:#1F6E91;
  --lime:#1F7A58; --lime-dark:#145C41;
  --text:#4F4F4F; --ink:#2B2B2B; --gray:#666666; --line:#D9D9D9; --gray-bg:#F5F5F5;
  --pink-bg:#FFEDF3; --pink-bg2:#FFF1F1; --baloon:#FFEBEB;
  --blue-bg:#E5F6FE; --cream:#FFFDF0; --cream2:#FFFDF2;
  --shadow-card:0 4px 4px 0 rgba(0,0,0,.25);
}
*{margin:0;padding:0;border:0;outline:0;box-sizing:border-box}
table{border-collapse:collapse}
html{-webkit-text-size-adjust:100%}
body{
  color:var(--text); font-size:16px; line-height:1.8; word-wrap:break-word; background:#F6F7F9;
  font-family:"游ゴシック体","Yu Gothic",YuGothic,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","Hiragino Sans","メイリオ",Meiryo,sans-serif;
  font-feature-settings:"palt";
}
img{display:block;max-width:100%;height:auto}
a{transition:.4s;color:var(--blue-ink)}
h1,h2,h3{line-height:1.35;word-break:keep-all;overflow-wrap:anywhere}
p,li,dd,dt,td,th{word-break:keep-all;overflow-wrap:anywhere}
ul,ol{list-style:none}
button{font-family:inherit}
.num{font-family:"Poppins","Hiragino Sans",sans-serif;font-weight:800}
.sp-only{display:none}
.nw{white-space:nowrap}
.mainContents{width:100%;max-width:780px;margin:0 auto;background:#fff}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media screen and (max-width:768px){.sp-only{display:inline}}

/* ヘッダー */
.siteHead{display:flex;align-items:center;justify-content:space-between;padding:12px 24px;border-bottom:1px solid var(--line)}
.siteHead a{display:flex;align-items:center;min-height:44px}
.siteHead img{width:220px;height:auto}
.siteHead .updated{font-size:16px;line-height:1.4;color:var(--gray)}
@media screen and (max-width:768px){
  .siteHead{padding:4px 12px}
  .siteHead img{width:132px}
  .siteHead .updated{font-size:12px}
}

/* 11-1 FV */
.fv{position:relative;width:100%;line-height:0;overflow:hidden}
.fv-img{width:100%;height:auto;display:block}
.fv-copy{position:absolute;left:40px;top:40px;line-height:1.3}
.fv-year{display:inline-block;background:var(--pink-ink);color:#fff;border-radius:100px;padding:8px 24px;font-size:20px;line-height:1;margin-bottom:16px;font-weight:700}
.fv-copy h1{font-size:48px;line-height:1.3;font-weight:800;color:var(--ink);text-shadow:0 0 16px #fff,0 0 8px #fff,0 0 4px #fff}
.fv-copy h1 .accent{color:var(--pink-ink)}
.fv-sub{display:inline-block;margin-top:16px;background:rgba(255,255,255,.94);border-radius:10px;padding:8px 16px;font-size:20px;line-height:1.4;color:var(--ink)}
.pr{position:absolute;right:12px;bottom:8px;font-size:16px;color:#4F4F4F;line-height:1;
  text-shadow:1px 1px 0 #fff,-1px 1px 0 #fff,1px -1px 0 #fff,-1px -1px 0 #fff}
@media screen and (max-width:768px){
  .fv-copy{left:16px;top:16px}
  .fv-year{font-size:12px;padding:4px 12px;margin-bottom:8px}
  .fv-copy h1{font-size:28px}
  .fv-sub{font-size:12px;margin-top:8px;padding:4px 8px}
  .pr{font-size:10px;right:8px;bottom:4px}
}

/* セクション見出し */
.secTitle{text-align:center;font-size:32px;line-height:1.35;color:var(--ink);margin:0 0 24px;font-weight:800}
.secTitle .accent{color:var(--pink-ink)}
@media screen and (max-width:768px){.secTitle{font-size:24px;margin-bottom:16px}}
.contents{padding:40px 0}
@media screen and (max-width:768px){.contents{padding:24px 0}}

/* 11-2 タブ（白文字は濃い水色の地に） */
.compareContent{padding-top:24px}
.compareTab{display:flex;align-items:flex-end;justify-content:space-between;padding:0 12px;list-style:none}
.compareTab li{cursor:pointer;width:calc(100%/2);background:var(--line);color:var(--text);border-radius:10px 10px 0 0;text-align:center;font-size:24px;padding:12px 0;line-height:1;font-weight:700;min-height:48px;display:flex;align-items:center;justify-content:center}
.compareTab li.active{background:var(--blue-ink);color:#fff;font-size:28px;padding:16px 0 12px}
@media screen and (max-width:768px){
  .compareContent{padding-top:12px}
  .compareTab{padding:0 8px}
  .compareTab li{font-size:14px;padding:12px 0;min-height:44px}
  .compareTab li.active{font-size:16px;padding:16px 0 12px}
}

/* 11-3 比較表（罫線は1色・1種類） */
.compareTableWrap{display:none;margin:0 12px}
.compareTableWrap.show{display:block}
.comparison_table{width:100%;background:#fff;table-layout:fixed;border:2px solid var(--blue-ink)}
.comparison_table th,.comparison_table td{padding:16px 8px;border:2px solid var(--blue);text-align:center;vertical-align:middle;line-height:1.4}
.comparison_table th{font-size:20px;color:var(--ink);background:var(--blue-bg)}
.comparison_table td{font-size:20px;color:var(--ink)}
.comparison_table td strong{color:var(--pink-ink);font-size:28px}
.comparison_table sup{font-size:12px;color:var(--gray)}
.comparison_table col.c-name{width:22%}.comparison_table col.c-link{width:26%}.comparison_table col.c-co{width:30%}
.comparison_table .lic{display:inline-block;margin-top:4px;font-size:16px;color:var(--gray)}
.siteName .rankLabel{display:block;margin:0 auto 8px;width:72px}
.siteName .svc{display:block;font-weight:800;color:var(--ink);font-size:20px;line-height:1.3}
.siteName a.more{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;font-size:16px;color:var(--blue-ink);text-decoration:underline}
@media screen and (max-width:768px){
  .compareTableWrap{margin:0 8px}
  .comparison_table{border-width:1px}
  .comparison_table th,.comparison_table td{padding:8px 4px;border-width:1px}
  .comparison_table th{font-size:11px;padding:12px 4px 8px}
  .comparison_table td{font-size:11px}
  .comparison_table td strong{font-size:14px}
  .comparison_table sup{font-size:10px}
  .comparison_table .lic{font-size:10px}
  .siteName .rankLabel{width:36px;margin-bottom:4px}
  .siteName .svc{font-size:12px}
  .siteName a.more{font-size:10px}
}

/* 11-7 CTA（緑・pill・4px影・右矢印・光沢）白文字が読める濃さの緑にしている */
.btnWrap{display:flex;align-items:center;justify-content:center;padding-bottom:4px}
.btnWrap a{
  display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;
  width:100%;min-height:64px;padding:12px 48px 12px 24px;background:var(--lime);color:#fff;text-decoration:none;font-weight:800;
  font-size:24px;line-height:1.3;border-radius:100px;box-shadow:0 4px 0 var(--lime-dark);transition:.4s;text-align:center
}
.btnWrap a:hover{transform:translateY(4px);box-shadow:none}
.btnWrap a::after{content:"";position:absolute;top:50%;right:16px;margin-top:-12px;width:24px;height:24px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M8 4l9 8-9 8' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat center/contain}
.btnWrap a::before{content:"";display:block;position:absolute;top:-180px;left:0;width:20px;height:100%;background:#FFF;opacity:0;transform:rotate(45deg);animation:reflect 2s ease-in-out infinite}
@keyframes reflect{0%{opacity:0;transform:scale(0) rotate(45deg)}80%{opacity:.5;transform:scale(4) rotate(45deg)}81%{opacity:0;transform:scale(50) rotate(45deg)}100%{opacity:0}}
.siteLink .btnWrap{flex-direction:column}
.siteLink .btnWrap a{font-size:18px;min-height:56px;padding:8px 32px 8px 12px}
.siteLink .btnWrap a::after{right:12px}
.btnCatch{font-size:14px;line-height:1.4;display:flex;align-items:center;justify-content:center;margin-bottom:8px;color:var(--ink);font-weight:700}
.btnCatch::before,.btnCatch::after{background-color:var(--pink-ink);content:"";height:2px;width:12px;display:block;flex:0 0 12px}
.btnCatch::before{margin-right:4px;transform:rotate(70deg)}
.btnCatch::after{margin-left:4px;transform:rotate(-70deg)}
@media screen and (max-width:768px){
  .btnWrap a{font-size:16px;min-height:52px;padding:8px 32px 8px 16px}
  .btnWrap a::after{width:12px;height:12px;right:12px;margin-top:-6px}
  .siteLink .btnWrap a{font-size:11px;min-height:44px;padding:4px 16px 4px 4px}
  .siteLink .btnWrap a::after{width:8px;height:8px;right:4px;margin-top:-4px}
  .btnCatch{font-size:10px;margin-bottom:4px}
  .btnCatch::before,.btnCatch::after{display:none}
}

/* 11-8 吹き出し */
.btnBaloon{margin-top:24px;margin-bottom:16px;position:relative;width:100%;background:var(--baloon);color:#222;font-size:20px;line-height:1.4;padding:8px 12px;text-align:center;border-radius:4px;font-weight:700}
.btnBaloon::after{content:'';position:absolute;bottom:-16px;left:50%;transform:translateX(-50%);border-width:16px 8px 0 8px;border-style:solid;border-color:var(--baloon) transparent transparent transparent}
@media screen and (max-width:768px){
  .btnBaloon{margin-top:12px;margin-bottom:12px;font-size:12px;line-height:1.5;padding:4px 8px}
  .btnBaloon::after{bottom:-8px;border-width:8px 4px 0 4px}
}

/* 11-17 注記 */
.notice{font-size:14px;color:var(--gray);line-height:1.7}
.compareContent .notice{padding:16px 16px 0}
@media screen and (max-width:768px){.notice{font-size:12px;line-height:1.6}.compareContent .notice{padding:8px 12px 0}}

/* 複数登録のすすめ（水色地で区切る） */
.multi{background:var(--blue-bg);padding:40px 32px}
.multi .lead{font-size:18px;line-height:1.8;margin-bottom:24px}
.multi .photo{border-radius:10px;overflow:hidden;margin-bottom:24px}
.multi ul{display:flex;flex-direction:column;gap:16px}
.multi li{background:#fff;border-radius:10px;padding:24px;box-shadow:var(--shadow-card)}
.multi li h3{font-size:24px;line-height:1.4;color:var(--pink-ink);margin-bottom:8px}
.multi li p{font-size:18px;line-height:1.8}
@media screen and (max-width:768px){
  .multi{padding:24px 16px}
  .multi .lead{font-size:16px;margin-bottom:16px}
  .multi .photo{margin-bottom:16px}
  .multi ul{gap:12px}
  .multi li{padding:16px}
  .multi li h3{font-size:16px;line-height:1.6;margin-bottom:4px}
  .multi li p{font-size:14px}
}

/* 診断 */
.quiz{padding:40px 32px}
.quizBox{border:2px solid var(--blue);border-radius:10px;padding:24px}
.quizStep .q{font-size:24px;line-height:1.4;font-weight:700;color:var(--ink);margin-bottom:16px}
.quizStep .q .num{color:var(--blue-ink);margin-right:8px}
.quizBtns{display:flex;gap:16px}
.quizBtns button{flex:1;min-height:64px;border-radius:10px;background:var(--pink-bg);border:2px solid var(--pink);color:var(--pink-ink);font-size:24px;line-height:1.3;font-weight:800;cursor:pointer}
.quizStep[hidden],.quizResult[hidden]{display:none}
.quizResult h3{font-size:28px;line-height:1.4;color:var(--ink);margin-bottom:8px}
.quizResult .res-label{font-size:16px;line-height:1.6;color:var(--pink-ink);font-weight:700;margin-bottom:4px}
.quizResult p{font-size:18px;line-height:1.8;margin-bottom:16px}
.quizResult .btnWrap + .btnWrap{margin-top:16px}
.quizRetry{margin-top:16px;background:none;color:var(--blue-ink);text-decoration:underline;font-size:16px;line-height:1.4;cursor:pointer;min-height:44px}
@media screen and (max-width:768px){
  .quiz{padding:24px 16px}
  .quizBox{padding:16px}
  .quizStep .q{font-size:16px;line-height:1.7;margin-bottom:12px}
  .quizBtns{gap:8px}
  .quizBtns button{min-height:48px;font-size:16px}
  .quizResult h3{font-size:18px;line-height:1.6}
  .quizResult .res-label{font-size:12px}
  .quizResult p{font-size:14px;margin-bottom:12px}
  .quizResult .btnWrap + .btnWrap{margin-top:12px}
  .quizRetry{font-size:12px;margin-top:12px}
}

/* 11-13 保育士の求人の状況 */
.month{padding:0 32px;margin:40px auto}
.month_box{border-radius:10px;background:var(--pink-bg2);padding-bottom:24px}
.month_h2{background:var(--pink-ink);color:#fff;text-align:center;font-size:28px;line-height:1.35;border-radius:10px 10px 0 0;padding:16px 12px}
.statRow{display:flex;justify-content:center;gap:24px;padding:24px 24px 8px}
.statItem{flex:1;background:#fff;border-radius:10px;text-align:center;padding:16px}
.statItem .v{font-size:56px;color:var(--pink-ink);line-height:1}
.statItem .v small{font-size:24px;color:var(--text);margin-left:4px;font-family:inherit;font-weight:700}
.statItem.b .v{color:var(--blue-ink)}
.statItem .l{font-size:18px;line-height:1.4;font-weight:700;margin-top:8px}
.month_description{font-size:18px;line-height:1.8;padding:16px 24px 0}
.month .notice{padding:8px 24px 0}
@media screen and (max-width:768px){
  .month{padding:0 16px;margin:24px auto}
  .month_box{padding-bottom:12px}
  .month_h2{font-size:18px;line-height:1.6;padding:8px}
  .statRow{gap:12px;padding:12px 12px 4px}
  .statItem{padding:8px}
  .statItem .v{font-size:40px}
  .statItem .v small{font-size:14px}
  .statItem .l{font-size:12px;margin-top:4px}
  .month_description{font-size:14px;padding:8px 12px 0}
  .month .notice{padding:4px 12px 0}
}

/* 11-9 ランキング詳細カード（3社とも同じ部品・同じ大きさ） */
.rankingContentsWrap{background:var(--pink-bg2);padding:16px 0}
.rankingContents{background:#fff;border-radius:10px;margin:32px 12px 20px;padding:24px 32px}
.rankingContents h2{display:flex;align-items:center;justify-content:flex-start;font-size:40px;line-height:1.3;margin-bottom:8px;color:var(--ink);font-weight:800}
.rankingContents h2::before{content:"";display:block;flex:0 0 110px;width:110px;height:110px;margin-right:16px;background-repeat:no-repeat;background-position:center;background-size:contain}
.rankingContents h2.rank01::before{background-image:url(medal-01-l.png)}
.rankingContents h2.rank02::before{background-image:url(medal-02-l.png)}
.rankingContents h2.rank03::before{background-image:url(medal-03-l.png)}
.rankingContents .company{font-size:16px;line-height:1.6;color:var(--gray);margin-bottom:16px}
/* 広告主のバナー素材は提携承認後に差し替える。それまでは文字の札で出す */
.rankingContents .banner{background:linear-gradient(135deg,var(--pink-bg),var(--blue-bg));border-radius:10px;text-align:center;padding:24px 16px;margin-bottom:24px}
.rankingContents .banner .catch{display:block;font-size:24px;line-height:1.4;color:var(--pink-ink);font-weight:800}
@media screen and (max-width:768px){
  .rankingContents{margin:20px 12px;padding:12px 12px 20px}
  .rankingContents h2{font-size:20px;margin-bottom:4px}
  .rankingContents h2::before{flex-basis:56px;width:56px;height:56px;margin-right:8px}
  .rankingContents .company{font-size:12px;margin-bottom:12px}
  .rankingContents .banner{padding:12px 8px;margin-bottom:12px}
  .rankingContents .banner .catch{font-size:14px;line-height:1.6}
}

/* 11-10 おすすめポイント */
.rankingContents_points h3{text-align:center;margin:0 auto 16px;color:var(--pink-ink);font-size:24px;line-height:1.4}
.rankingContents_points ul{padding:24px 32px 20px;background:var(--cream);border-radius:4px;display:flex;flex-direction:column;gap:12px}
.rankingContents_points li{display:flex;gap:8px;align-items:flex-start;font-size:18px;line-height:1.8}
.rankingContents_points li::before{content:"";flex:0 0 20px;height:20px;margin-top:8px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M2 8.5l4 4 8-9' fill='none' stroke='%23C2185B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat center/contain}
.rankingContents_points li span{flex:1}
@media screen and (max-width:768px){
  .rankingContents_points h3{font-size:16px;margin-bottom:8px}
  .rankingContents_points ul{padding:12px;gap:8px}
  .rankingContents_points li{font-size:14px}
  .rankingContents_points li::before{flex-basis:14px;height:14px;margin-top:5px}
}

/* 11-11 定義リスト */
.rankingContents_terms{display:flex;flex-wrap:wrap;margin:24px 0 8px}
.rankingContents_terms dl{width:calc(100%/2);text-align:center;padding:0 8px;display:flex;flex-direction:column;margin-bottom:16px}
.rankingContents_terms dl.full{width:100%}
.rankingContents_terms dt{font-size:16px;line-height:1.6;margin-bottom:8px;background:var(--gray-bg);border-radius:4px;padding:4px 0;font-weight:700;color:var(--ink)}
.rankingContents_terms dd{display:flex;justify-content:center;align-items:center;font-size:20px;line-height:1.4;flex:1;color:var(--ink)}
.rankingContents_terms dd strong{font-size:32px;color:var(--pink-ink)}
.rankingContents_terms dd sup{font-size:12px;color:var(--gray)}
.placeList{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.placeList li{border:1px solid var(--pink-ink);color:var(--pink-ink);border-radius:100px;padding:4px 16px;font-size:16px;line-height:1.6;background:#fff}
@media screen and (max-width:768px){
  .rankingContents_terms{margin:12px 0 4px}
  .rankingContents_terms dl{padding:0 4px;margin-bottom:12px}
  .rankingContents_terms dt{font-size:12px;margin-bottom:4px}
  .rankingContents_terms dd{font-size:14px}
  .rankingContents_terms dd strong{font-size:20px}
  .rankingContents_terms dd sup{font-size:10px}
  .placeList{gap:4px}
  .placeList li{font-size:12px;padding:4px 8px}
}
.rankingContents_notice{font-size:14px;line-height:1.7;color:var(--gray);margin:16px 0 0}
@media screen and (max-width:768px){.rankingContents_notice{font-size:11px;line-height:1.6;margin-top:12px}}

/* 選び方・順位の考え方・Q&A */
.guide{padding:40px 32px}
.guide + .guide{padding-top:0}
.guideItem{margin-bottom:24px}
.guideItem h3{font-size:24px;line-height:1.4;color:var(--ink);margin-bottom:8px;padding-left:16px;border-left:4px solid var(--pink-ink)}
.guideItem p,.guide > p{font-size:18px;line-height:1.8}
.criteriaList{counter-reset:c;margin-top:16px;display:flex;flex-direction:column;gap:12px}
.criteriaList li{counter-increment:c;display:flex;gap:12px;font-size:18px;line-height:1.8;background:var(--gray-bg);border-radius:10px;padding:16px}
.criteriaList li::before{content:counter(c);flex:0 0 32px;height:32px;margin-top:0;border-radius:100px;background:var(--blue-ink);color:#fff;font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center;font-family:"Poppins",sans-serif;font-weight:800}
.faq dl{border-bottom:1px solid var(--line);padding:16px 0}
.faq dt{font-size:20px;line-height:1.4;font-weight:700;color:var(--ink);display:flex;gap:12px;margin-bottom:8px}
.faq dd{font-size:18px;line-height:1.8;display:flex;gap:12px}
.faq dt::before,.faq dd::before{flex:0 0 32px;height:32px;border-radius:100px;display:flex;align-items:center;justify-content:center;font-family:"Poppins",sans-serif;font-weight:800;font-size:16px;color:#fff;line-height:1}
.faq dt::before{content:"Q";background:var(--pink-ink)}
.faq dd::before{content:"A";background:var(--blue-ink)}
@media screen and (max-width:768px){
  .guide{padding:24px 16px}
  .guideItem{margin-bottom:16px}
  .guideItem h3{font-size:16px;line-height:1.6;padding-left:8px;margin-bottom:4px}
  .guideItem p,.guide > p{font-size:14px}
  .criteriaList{gap:8px;margin-top:12px}
  .criteriaList li{font-size:14px;padding:8px;gap:8px}
  .criteriaList li::before{flex-basis:24px;height:24px;font-size:12px}
  .faq dl{padding:12px 0}
  .faq dt{font-size:16px;line-height:1.7;gap:8px;margin-bottom:4px}
  .faq dd{font-size:14px;gap:8px}
  .faq dt::before,.faq dd::before{flex-basis:24px;height:24px;font-size:12px}
}

/* 再掲（最終CTA） */
.again{background:var(--pink-bg2);padding:40px 32px}
.againCard{background:#fff;border-radius:10px;padding:24px;margin-bottom:16px;box-shadow:var(--shadow-card)}
.againCard .head{display:flex;align-items:center;gap:16px}
.againCard .head img{width:72px;height:72px}
.againCard .head .svc{font-size:32px;line-height:1.3;font-weight:800;color:var(--ink)}
.againCard .head .catch{font-size:18px;line-height:1.6;color:var(--pink-ink);font-weight:700}
@media screen and (max-width:768px){
  .again{padding:24px 12px}
  .againCard{padding:12px;margin-bottom:12px}
  .againCard .head{gap:8px}
  .againCard .head img{width:40px;height:40px}
  .againCard .head .svc{font-size:18px}
  .againCard .head .catch{font-size:12px}
}

/* フッター */
.ft{text-align:center;padding:32px 16px 16px;border-top:1px solid var(--line)}
.ft ul{display:flex;justify-content:center;gap:24px;margin-bottom:16px}
.ft a{font-size:16px;line-height:1.4;display:inline-flex;align-items:center;min-height:44px}
.ft .copy{font-size:14px;line-height:1.4;color:var(--gray);margin-top:8px}
@media screen and (max-width:768px){.ft a{font-size:13px}.ft .copy{font-size:11px}}

/* 11-15 フローティングバナー */
.floatBanner{position:fixed;bottom:12px;left:50%;transform:translateX(-50%);width:90%;max-width:480px;background:var(--cream2);padding:8px 12px;border-radius:10px;box-shadow:var(--shadow-card);z-index:80}
.floatBanner.is-hidden,.floatBanner.is-wait{display:none}
.floatBanner_inner{display:flex;gap:12px;align-items:center}
.floatBanner_inner img{width:44px;height:44px;flex:0 0 44px}
.floatBanner_inner dl{flex:1;min-width:0}
.floatBanner_inner dt{font-size:14px;line-height:1.4;font-weight:800;color:var(--ink)}
.floatBanner_inner dd a{font-size:13px;line-height:1.4;color:#B3261E;text-decoration:underline;display:inline-flex;align-items:center;min-height:44px}
.floatBanner .ad-label{position:absolute;right:8px;bottom:8px;border:1px solid #888;border-radius:4px;color:#4F4F4F;background:#fff;font-size:10px;font-weight:700;padding:2px 4px;line-height:1.2}
.bn_closeBtn{position:absolute;top:-24px;right:-8px;width:44px;height:44px;cursor:pointer;background:none}
.bn_closeBtn::before{content:"";display:block;width:32px;height:32px;margin:8px 4px 4px 8px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><circle cx='15' cy='15' r='14' fill='%23111'/><path d='M10 10l10 10M20 10L10 20' stroke='%23fff' stroke-width='2.5' stroke-linecap='round'/></svg>") no-repeat center/contain}

/* 順番に登録 */
.stepper{margin:24px 0 0;background:#fff;border-radius:10px;padding:16px;box-shadow:var(--shadow-card)}
.stepperHead{text-align:center;font-size:14px;font-weight:700;color:var(--ink);margin-bottom:12px}
.stepperCount b{font-size:24px;color:#1F7A58;margin-right:2px}
.stepper ol{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.step a{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"no name" "label label";gap:4px 8px;align-items:center;text-decoration:none;border:2px solid #D9D9D9;border-radius:10px;padding:12px 16px;min-height:64px;background:#fff;color:var(--ink)}
.stepNo{grid-area:no;font-size:12px;font-weight:700;background:#F5F5F5;border-radius:4px;padding:2px 8px}
.stepName{grid-area:name;font-size:16px;font-weight:800}
.stepLabel{grid-area:label;display:none;font-size:14px;font-weight:700}
.step .stepLabel--todo{display:block;color:#1F7A58}
.step.is-next a{border-color:#1F7A58;background:#1F7A58;color:#fff;box-shadow:0 4px 0 #14563E}
.step.is-next .stepNo{background:#14563E;color:#fff}
.step.is-next .stepLabel--todo{display:none}.step.is-next .stepLabel--next{display:block;color:#fff}
.step.is-done a{background:#F5F5F5;border-color:#E0E0E0}
.step.is-done .stepLabel--todo,.step.is-done .stepLabel--next{display:none}.step.is-done .stepLabel--done{display:block;color:#5C5C5C}
.stepperNote{font-size:12px;line-height:1.6;color:#5C5C5C;margin-top:12px}
/* フッター（小さく・このページ内に収める） */
.ft .legal{max-width:720px;margin:0 auto 4px;text-align:left}
.ft .legal summary{cursor:pointer;font-size:11px;line-height:1.6;color:#767676;display:flex;align-items:center;min-height:44px;list-style:none}.ft .legal summary::-webkit-details-marker{display:none}.ft .legal summary:before{content:'＋';margin-right:4px}.ft .legal[open] summary:before{content:'－'}
.ft .legalBody{font-size:11px;line-height:1.7;color:#6B6B6B;padding:4px 0 12px}
.ft .legalBody h1,.ft .legalBody h2{font-size:11px;font-weight:700;margin:8px 0 2px;color:#6B6B6B}
.ft .legalBody p,.ft .legalBody li,.ft .legalBody dt,.ft .legalBody dd{font-size:11px;line-height:1.7}
.ft .legalBody ul{padding-left:16px;list-style:disc}.ft .legalBody dl div{display:flex;gap:8px}
.ft .copy{font-size:11px;color:#767676}

.multi .stepper li{background:none;box-shadow:none;padding:0;margin:0;border-radius:0}
.step.is-next.is-first .stepLabel--next{display:none}.step.is-next.is-first .stepLabel--todo{display:block;color:#fff}
/* 追従バナー（下から12px＋高さ約60px）に最下部の文字が隠れない分だけ。バナーの無いページには付けない */
.ft.ft--float{padding-bottom:88px}

.stepperLead{text-align:center;font-size:18px;line-height:1.6;font-weight:800;color:var(--ink);margin-bottom:8px}
.stepperWhy{text-align:center;font-size:14px;line-height:1.6;color:#4F4F4F;margin-bottom:16px}
.gauge{height:12px;border-radius:100px;background:#E6EFEA;overflow:hidden;margin-bottom:8px}
.gaugeBar{display:block;height:100%;width:0;border-radius:100px;background:linear-gradient(90deg,#2E9C6F,#1F7A58);transition:width .5s ease}
.stepperComplete{text-align:center;font-size:14px;line-height:1.6;font-weight:700;color:#14563E;background:#E6EFEA;border-radius:10px;padding:8px 12px;margin-bottom:12px}
@media screen and (max-width:768px){.stepperLead{font-size:16px}}

.stepperTitle{text-align:center;font-size:18px;line-height:1.6;font-weight:800;color:var(--ink);margin-bottom:12px}
@media screen and (max-width:768px){.stepperTitle{font-size:16px}}

/* 運営者情報・プライバシーポリシー（正本 skills/lp-design/legal/）の表と項目 */
.table-wrap{overflow-x:auto}
table.ext{border-collapse:collapse;width:100%;min-width:560px}
table.ext th,table.ext td{border:1px solid #D9D9D9;padding:8px;text-align:left;vertical-align:top}
.doc table.ext th,.doc table.ext td{font-size:14px;line-height:1.6}
.ft .legalBody table.ext th,.ft .legalBody table.ext td{font-size:11px;line-height:1.6;color:#6B6B6B}
.ft .legalBody a{color:#6B6B6B}
.doc .meta{margin-top:32px;color:#6B6B6B}