/* 2026-10-12 training.html・develop.html・roi.html をトップと同じ見た目（style-v4.css）に揃えるための追加分。
   style-v4.css は別の作業と同時に編集されるので触らず、足りない分だけをここに書く。
   3ページで style-v4.css の後に読み込む。文字は画面の実寸で14px以上。 */

.br-sp{display:none}
.nb{white-space:nowrap}

/* ファーストビュー：ai-employee.html と同じ詰め方 */
:is(.page-training,.page-develop) .renew-subpage-hero{min-height:0;padding-bottom:clamp(64px,8vw,110px)}
:is(.page-training,.page-develop,.page-roi) .renew-subpage-hero .renew-subpage-title{margin-top:6px}
:is(.page-training,.page-develop,.page-roi) .renew-subpage-hero .lede{margin-top:26px}
.sp-body{max-width:42em;margin-top:28px}
.sp-body p+p{margin-top:16px}
.sp-body .renew-value__note{margin-bottom:28px;padding:22px 24px;border:var(--line);border-radius:24px;background:var(--paper);box-shadow:5px 5px 0 var(--ink);line-height:1.85}
.sp-body a,.sp-lead a,.sp-note a,.dv-case a{text-decoration:underline;text-underline-offset:4px}
.renew-subpage .lede a{text-decoration:underline;text-underline-offset:5px}

/* 本文の段落 */
.sp-lead{max-width:42em;margin-top:24px}
.sp-h3{margin-top:72px;font-size:clamp(24px,2.6vw,32px);line-height:1.45}
.sp-note{max-width:48em;margin-top:28px;color:var(--muted);font-size:16px;line-height:1.85}
.sp-links{margin-top:14px;font-size:16px;font-weight:700;line-height:2.1}
.sp-links a{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1.5px}
.sp-links a:hover{color:var(--deep)}

/* 研修内容（4つ）：renew-path--many をそのまま使い、上の余白だけ詰める */
.renew-path.sp-path4{margin-top:48px}

/* 番号つきの箱（renew-support を流用）。説明文は読める大きさに */
.renew-support.sp-support2,.renew-support.sp-support4{margin-top:32px}
.renew-support.sp-support2{grid-template-columns:repeat(2,minmax(0,1fr))}
.renew-support.sp-support4{grid-template-columns:repeat(4,minmax(0,1fr))}
:is(.sp-support2,.sp-support4) li{min-height:0;background:var(--white);box-shadow:5px 5px 0 var(--ink)}
:is(.sp-support2,.sp-support4) b{font-size:19px}
:is(.sp-support2,.sp-support4) small{margin-top:10px;font-size:16px;font-weight:500;line-height:1.85}
.page-develop .sp-support4{margin-top:56px}

/* FAQ（faq__q / faq__a の書き方のまま renew-faq に載せる） */
:is(.page-training,.page-roi) .renew-faq__list{margin-top:48px}
:is(.page-training,.page-roi) .faq__q{display:flex;align-items:center}
:is(.page-training,.page-roi) .faq__q i,:is(.page-training,.page-roi) .faq__a i{flex:0 0 auto}
:is(.page-training,.page-roi) .faq__a i{background:var(--aqua)}

/* 章見出し：ai-employee.html と同じ大きさの段 */
:is(.page-training,.page-develop,.page-roi) .renew-section .renew-wrap>h2{font-size:clamp(34px,4.6vw,60px);line-height:1.3}

/* これまでに作ったもの：9枚。PC3列（3×3）、2列になる幅では最後の1枚を横いっぱいに。空きマスを出さない */
.built{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:48px}
.built__i{display:flex;flex-direction:column;min-width:0;padding:26px 24px;border:var(--line);border-radius:28px;background:var(--paper);box-shadow:5px 5px 0 var(--ink);transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s cubic-bezier(.16,1,.3,1),border-radius .45s cubic-bezier(.16,1,.3,1)}
.built__i:hover{transform:translateY(-4px);border-radius:34px;box-shadow:7px 8px 0 var(--ink)}
.built__i--hit{background:var(--blush)}
.built .tagx{align-self:flex-start;padding:1px 12px;border:1.5px solid var(--ink);border-radius:999px;background:var(--salmon);font-size:14px;font-weight:700;letter-spacing:.04em}
.built__i--hit .tagx{background:var(--coral)}
.built__i>b{display:block;margin-top:16px;font-size:21px;line-height:1.5}
.built__i>p{margin-top:10px;font-size:17px;line-height:1.85}
.built__i>p b{display:inline}
.built__io{display:block;margin-top:auto;padding-top:14px;border-top:1px dashed var(--rule);font-size:15px;line-height:1.8;color:var(--muted)}
.built__i>p+.built__io{margin-top:16px}
.built__io i{font-style:normal;color:var(--deep);font-weight:700}

/* 実績（130万円） */
.dv-case{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:clamp(36px,6vw,90px);align-items:start;margin-top:48px}
.dv-case__num{padding:30px 28px;border:var(--line);border-radius:32px;background:var(--paper);box-shadow:5px 5px 0 var(--ink)}
.dv-case .case__num{color:var(--deep);font-size:clamp(76px,10vw,140px);font-weight:700;line-height:1;letter-spacing:-.05em}
.dv-case .case__num small{margin-left:8px;color:var(--ink);font-size:22px;letter-spacing:0}
.dv-case .case__cap{margin-top:18px;padding-top:14px;border-top:1px solid var(--rule);font-size:16px;font-weight:700;line-height:1.7}
.dv-case__b p+p{margin-top:18px}
.dv-case__b em{font-style:normal;font-weight:700;background:linear-gradient(transparent 62%,rgba(250,172,162,.7) 62%)}

/* 投資対効果 */
.page-roi .roi-hd{display:flex;flex-direction:column;align-items:flex-start}
.page-roi .roi-hd h2{font-size:clamp(34px,4.6vw,60px);line-height:1.3}
.page-roi .roi-hd h2 em{color:var(--deep);font-style:normal}
.page-roi .roi-pill{margin:22px 0 0}
.page-roi .roi-lead{margin-top:26px}
.page-roi .roi-hl{background:linear-gradient(transparent 62%,rgba(250,172,162,.75) 62%)}
.page-roi .roi-lead .thin{font-weight:500}
.page-roi .roi-cite{max-width:48em;margin-top:18px;color:var(--muted);font-size:16px;line-height:1.85}
.page-roi .roi-cite b{color:var(--ink)}
.page-roi .roi-cite .renew-text-link{margin-top:0;color:var(--ink)}
.page-roi .roi-actions{display:flex;flex-wrap:wrap;gap:14px 18px;margin-top:30px}
.page-roi .roi-btn{font-family:inherit;line-height:1.5;cursor:pointer}
.page-roi .roi-btn--g{color:var(--ink)}

.page-roi .roi-tblwrap{max-width:100%;margin-top:28px;overflow-x:auto;border:var(--line);border-radius:24px;background:var(--white);box-shadow:5px 5px 0 var(--ink)}
.page-roi .roi-tbl{width:100%;border-collapse:collapse;font-size:16px}
.page-roi .roi-tbl th{padding:14px 16px;background:var(--blush);font-size:15px;font-weight:700;line-height:1.6;text-align:left;border-bottom:var(--line)}
.page-roi .roi-tbl th+th,.page-roi .roi-tbl td+td{border-left:1px solid var(--rule)}
.page-roi .roi-tbl th.r{text-align:right}
.page-roi .roi-tbl td{padding:10px 16px;border-top:1px solid var(--rule);line-height:1.6;vertical-align:middle}
.page-roi .roi-tbl td.r,.page-roi .roi-tbl td.auto{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.page-roi .roi-tbl td.auto{background:rgba(225,240,240,.6);font-weight:700}
.page-roi .roi-tbl td.auto i,.page-roi .roi-tbl tr.sum i{font-style:normal}
.page-roi .roi-tbl input{width:100%;min-width:0;padding:6px 4px;border:0;border-bottom:1.5px dashed rgba(63,55,51,.35);background:transparent;color:var(--ink);font:inherit;outline:none}
.page-roi .roi-tbl input:focus{border-bottom-color:var(--deep);background:rgba(250,172,162,.18)}
.page-roi .roi-tbl input::placeholder{color:#7d716b;opacity:1}
.page-roi .roi-tbl input.num,.page-roi .roi-tbl input.days{width:72px;text-align:right;font-weight:700;color:var(--deep);font-variant-numeric:tabular-nums}
.page-roi .roi-tbl input.days{width:56px;text-align:center}
.page-roi .roi-tbl input[type=number]{-moz-appearance:textfield}
.page-roi .roi-tbl input::-webkit-outer-spin-button,.page-roi .roi-tbl input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.page-roi .roi-tbl tr.sum td{border-top:var(--line);background:rgba(250,172,162,.35);font-weight:700}
.page-roi .roi-tbl tr.sum td.auto{color:var(--deep);font-size:18px}

.page-roi .roi-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:32px}
.page-roi .roi-facts--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.page-roi .roi-fact{padding:26px 26px 24px;border:var(--line);border-radius:28px;background:var(--paper);box-shadow:5px 5px 0 var(--ink)}
.page-roi .roi-facts .roi-fact:nth-child(1){background:#f2d7e1}
.page-roi .roi-facts .roi-fact:nth-child(2){background:var(--white)}
.page-roi .roi-facts .roi-fact:nth-child(3){background:#cee5e9}
.page-roi .roi-fact .n{display:block;color:var(--ink);font-size:clamp(40px,4.4vw,58px);font-weight:700;line-height:1.1;letter-spacing:-.04em;font-variant-numeric:lining-nums tabular-nums}
.page-roi .roi-fact .n i{font-style:normal}
.page-roi .roi-fact .n small{margin-left:6px;color:var(--deep);font-size:18px;letter-spacing:0}
.page-roi .roi-fact p{margin-top:10px;font-size:16px;line-height:1.8}

.page-roi .roi-note{margin-top:28px;padding:24px 28px;border:var(--line);border-radius:24px;background:var(--white);box-shadow:5px 5px 0 var(--ink)}
.page-roi .roi-note .t{font-size:20px;font-weight:700;line-height:1.6}
.page-roi .roi-note p+p{margin-top:6px;font-size:17px}
.page-roi .roi-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 14px;margin-top:40px;padding-top:14px;border-top:1px solid var(--rule);color:var(--muted);font-size:14px}
.page-roi .roi-foot .wm{color:var(--ink);font-family:"Arial Rounded MT Bold","Arial Black",sans-serif;font-weight:700;letter-spacing:.04em}

@media(max-width:1023px){
  .built{grid-template-columns:repeat(2,minmax(0,1fr))}
  .built__i:last-child:nth-child(odd){grid-column:1/-1}
  .renew-support.sp-support4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-roi .roi-facts--3{grid-template-columns:1fr}
  .dv-case{grid-template-columns:1fr}
}
@media(max-width:767px){
  .br-sp{display:inline}
  :is(.page-training,.page-develop,.page-roi) .renew-section .renew-wrap>h2,.page-roi .roi-hd h2{font-size:clamp(28px,8.2vw,38px);line-height:1.35}
  .built,.renew-support.sp-support2,.renew-support.sp-support4,.page-roi .roi-facts{grid-template-columns:1fr}
  .built__i:last-child:nth-child(odd){grid-column:auto}
  .built__i>b{font-size:19px}
  .built__i>p{font-size:16px}
  .sp-h3{margin-top:56px}
  .sp-links{line-height:1.9}
  .sp-links a{display:inline}
  .dv-case__num{padding:24px 20px}
  .page-roi .roi-btn{flex:1 1 100%}

  /* 表はスマホで1行ずつのカードに組み替える（横に切れない）。欄の見出しは th と同じ語を data-label から出す */
  .page-roi .roi-tblwrap{overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none}
  .page-roi .roi-tbl,.page-roi .roi-tbl tbody,.page-roi .roi-tbl tr,.page-roi .roi-tbl td{display:block;width:100%}
  .page-roi .roi-tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .page-roi .roi-tbl tr{margin-bottom:16px;padding:6px 16px 10px;border:var(--line);border-radius:20px;background:var(--white);box-shadow:4px 4px 0 var(--ink)}
  .page-roi .roi-tbl td,.page-roi .roi-tbl td+td{padding:8px 0;border:0;border-top:1px dashed var(--rule);text-align:left!important;white-space:normal;background:transparent}
  .page-roi .roi-tbl td:first-child{border-top:0}
  .page-roi .roi-tbl td[data-label]::before{content:attr(data-label);display:block;margin-bottom:2px;color:var(--muted);font-size:14px;font-weight:700;line-height:1.5}
  .page-roi .roi-tbl td.auto{background:transparent}
  .page-roi .roi-tbl tr.sum{background:#fbe3dd}
  .page-roi .roi-tbl tr.sum td{border-top:1px dashed rgba(63,55,51,.25);background:transparent}
  .page-roi .roi-tbl tr.sum td:first-child{border-top:0}
}

/* 2026-10-12 撮影して直した分 */
.page-develop #case{background:var(--paper)}
.dv-case .case__num{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.dv-case .case__num small{margin-left:0;white-space:nowrap}
:is(.page-training,.page-roi) .faq__q i,:is(.page-training,.page-roi) .faq__a i{line-height:1}
@media(max-width:767px){.page-roi .roi-tbl input.num{text-align:left}}
/* 狭いカードの本文で、全体指定の word-break:auto-phrase（style-v4.css:1013）が文節ごとにしか折らず、
   太字の語句だけが1行に孤立していた（例「公開から1ヶ月で月額130万円」）。カード・注記の本文だけ普通の折り返しに戻す。見出しは触らない */
body.home-renewal :is(.built__i>p,.built__io,.sp-support2 small,.sp-support4 small,.roi-fact p,.page-roi .roi-cite,.sp-note,.dv-case__b p,.sp-body p){word-break:normal;text-wrap:wrap}
