.ai-future{padding:64px max(24px,calc((100vw - 1200px)/2));background:#f0f6fd;border-block:1px solid #dbe7f5}
.ai-future-inner{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:center}
.ai-future-inner>*{min-width:0}
.ai-future-label{color:#1d5fe9;font-size:.875rem;font-weight:700;margin:0 0 14px}
.ai-future h2{font-size:clamp(1.65rem,2.7vw,2.3rem);line-height:1.45;letter-spacing:-.02em;margin:0 0 22px;word-break:normal;overflow-wrap:anywhere}
.ai-future-copy>p:not(.ai-future-label){font-size:1rem;line-height:1.85;color:#465b74;margin:0 0 14px}
.ai-future-copy .ai-future-closing{font-weight:800;color:#1d5fe9!important;margin-top:22px!important}
.ai-future-media{margin:0}
.ai-future-search{display:block;color:#142844;text-decoration:none;background:#fff;border:1px solid #cadcf1;border-radius:12px;overflow:hidden;box-shadow:0 12px 30px #1d5fe912;transition:transform .2s}
.ai-future-search:hover{transform:translateY(-3px)}
.ai-future-search:focus-visible{outline:3px solid #1d5fe9;outline-offset:5px}
.ai-future-search img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.ai-future-search-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px;font-size:.875rem;font-weight:700;line-height:1.7}
.ai-future-search-caption>span{color:#1d5fe9;font-size:1.3rem}
.ai-future-media figcaption,.ai-future-note{font-size:.75rem;line-height:1.7;color:#697b90;margin:12px 0 0}
@media(max-width:800px){.ai-future{padding:42px 20px}.ai-future-inner{grid-template-columns:minmax(0,1fr);gap:24px}.ai-future h2 br{display:none}.ai-future-search-caption{padding:14px}.ai-future-copy>p:not(.ai-future-label){font-size:1rem}.ai-future h2{font-size:1.65rem}}
@media(prefers-reduced-motion:reduce){.ai-future-search{transition:none}}
.foundation-explained{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:64px;align-items:center;max-width:1120px;margin:auto}
.foundation-explained .foundation-stack{width:100%;margin:0;position:relative}
.foundation-explained .foundation-layer{padding:28px 22px}
.foundation-explained .foundation-layer span{font-size:1rem}
.foundation-explained .layer-core{position:relative}
.foundation-explained .layer-core:after{content:"";position:absolute;left:100%;top:50%;width:64px;height:2px;background:#91b4e6}
.foundation-explained .foundation-points{position:relative;display:grid;grid-template-columns:1fr;gap:0;margin:0;border-left:2px solid #91b4e6;padding:8px 0}
.foundation-explained .foundation-points article{position:relative;padding:20px 0 20px 30px;border:0}
.foundation-explained .foundation-points article:before{content:"";position:absolute;left:0;top:34px;width:18px;height:2px;background:#91b4e6}
.foundation-explained .foundation-points h3{font-size:1.125rem;color:#1d5fe9;margin:0 0 8px}
.foundation-explained .foundation-points p{font-size:1rem;line-height:1.8}
.foundation-clean .section-head>p:last-child{max-width:920px;margin-inline:auto;line-height:1.9;font-size:1rem}
@media(max-width:800px){.foundation-explained{grid-template-columns:minmax(0,1fr);gap:24px}.foundation-explained .layer-core:after,.foundation-explained .foundation-points article:before{display:none}.foundation-explained .foundation-points{border:1px solid #dbe7f5;background:#f7faff;padding:0 20px}.foundation-explained .foundation-points article{padding:20px 0}.foundation-explained .foundation-points article+article{border-top:1px solid #dbe7f5}.foundation-clean .section-head>p:last-child br{display:none}}

/* --- 2026-09-21 updates --- */
.future-steps{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 26px;margin:26px 0 0;padding:0}
.future-step{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:7px;background:#fff;border:1px solid #cadcf1;border-radius:12px;padding:16px 14px}
.future-step+.future-step:before{content:"";position:absolute;left:-19px;top:32px;width:11px;height:11px;border-top:2px solid #91b4e6;border-right:2px solid #91b4e6;transform:rotate(45deg)}
.future-step-icon{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;background:#e7f0fd;color:#1d5fe9}
.future-step-icon svg{width:21px;height:21px}
.future-step-no{font-size:.68rem;font-weight:800;letter-spacing:.08em;color:#1d5fe9}
.future-step-label{font-size:.9rem;font-weight:700;line-height:1.5;color:#142844}
.future-step.is-ahead{background:#f7fbff;border-style:dashed;border-color:#c3d6ee;opacity:.78}
.future-step.is-ahead .future-step-icon{background:#eff4fb;color:#7d9cc9}
.future-step.is-ahead .future-step-no,.future-step.is-ahead .future-step-label{color:#7089a8}
@media(max-width:800px){.future-steps{grid-template-columns:minmax(0,1fr);gap:20px}.future-step+.future-step:before{left:50%;top:-16px;margin-left:-6px;transform:rotate(135deg)}.future-step-label{font-size:1rem}}
.ai-future-inner{grid-template-columns:1.12fr 1fr}
.ai-future h2{font-size:clamp(1.5rem,2.2vw,2.1rem)}
@media(max-width:800px){.ai-future-inner{grid-template-columns:minmax(0,1fr)}.ai-future h2{font-size:1.6rem}}
.layer-sales .layer-riders{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.layer-sales .rider{background:#fff;border:1px solid #cbdefa;border-radius:10px;padding:14px 10px}
.layer-sales .rider strong{font-size:clamp(.95rem,1.15vw,1.1rem)!important;line-height:1.45;color:#17365f}
.layer-sales .rider span{margin-top:6px!important;font-size:.75rem!important;line-height:1.65;color:#4a6285}
.layer-sales .rider-ai{background:#1d5fe9;border-color:#1d5fe9}
.layer-sales .rider-ai strong{color:#fff}
.layer-sales .rider-ai span{color:#dbe8ff}
.layer-sales .layer-note{margin-top:14px!important;font-size:.8rem!important;color:#4a6285}
@media(max-width:800px){.layer-sales .layer-riders{grid-template-columns:minmax(0,1fr);gap:8px}.layer-sales .rider span{font-size:.8rem!important}}
@media(min-width:1000px){.section-head.head-wide{max-width:none}.section-head>p.lead-oneline{max-width:none!important;font-size:clamp(.82rem,1.24vw,1rem)!important}}
.agent-card.manager .ribbon{right:auto;left:25px}
.bridge-copy{display:block}
.more-agents-kicker{font-size:.95rem;line-height:1.7;color:#4a5b70}
@media(min-width:801px){.hero{min-height:86svh}.hero-main{padding-bottom:16px}.overview{min-height:auto;padding-top:46px;padding-bottom:72px}}

/* --- 2026-09-21 agents section revamp (sticky heading / talk bubble / layout) --- */

/* 1. 見出しをスクロール追従にする。header.section-headをdisplay:contentsにして
   h2の包含ブロックをsection.agentsまで広げ、下マージン相当はlead-oneline側に付け替える */
.agents .section-head{display:contents}
.agents .section-head h2{
  position:sticky;
  top:64px;
  z-index:20;
  margin:0;
  padding:14px 0 12px;
  background:var(--tint);
}
.agents .section-head h2::after{
  content:"";
  position:absolute;
  left:0;right:0;top:100%;
  height:14px;
  background:linear-gradient(var(--tint),transparent);
  pointer-events:none;
}
.agents .lead-oneline{margin-bottom:30px}
@media(max-width:720px){
  .agents .section-head h2{top:62px;padding:10px 0}
  .agents .lead-oneline{margin-bottom:24px}
}

/* 2. セリフを吹き出しデザインに変更 */
.agents .conversation{display:flex;align-items:flex-start;gap:12px;background:none;border:0;padding:0}
.talk-avatar{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#1d5fe9;color:#fff}
.talk-avatar svg{width:22px;height:22px}
.agent-card.manager .talk-avatar{background:#17365f}
.talk-body{flex:1;min-width:0}
.talk-body b{display:block;font-size:.72rem;font-weight:800;color:#1d5fe9;letter-spacing:.04em;margin:0 0 6px}
.talk-bubble{position:relative;margin:0;background:#edf4fc;border:1px solid #cfe0f5;border-radius:4px 18px 18px 18px;padding:16px 18px;font-size:.92rem;line-height:1.8;color:#24374f}
.talk-bubble::before{content:"";position:absolute;top:12px;left:-9px;width:0;height:0;border-style:solid;border-width:9px 9px 9px 0;border-color:transparent #cfe0f5 transparent transparent}
.talk-bubble::after{content:"";position:absolute;top:13px;left:-7px;width:0;height:0;border-style:solid;border-width:8px 8px 8px 0;border-color:transparent #edf4fc transparent transparent}
.agent-card.manager .talk-bubble{background:#fff}
.agent-card.manager .talk-bubble::after{border-right-color:#fff}
@media(max-width:720px){
  .talk-avatar{width:34px;height:34px}
  .talk-avatar svg{width:18px;height:18px}
  .talk-bubble{font-size:1rem;line-height:1.85;padding:14px 16px}
}

/* 3. 「できること」を左カラム（h3の直下）へ、吹き出しを右カラムで縦中央に */
.agents .agent-card .agent-abilities{grid-column:1;grid-row:auto;margin-top:4px;padding-top:12px;border-top:1px solid var(--line)}
.agents .agent-card.manager .agent-abilities{grid-column:1;grid-row:auto}
.agents .agent-card .agent-details{grid-column:2;grid-row:1/4;align-content:center;margin-top:0}
.agents .agent-abilities ul{list-style:none;padding:0;margin:9px 0 0}
.agents .agent-abilities li{position:relative;padding-left:22px;margin:4px 0;font-size:.86rem;line-height:1.7;color:#44566d}
.agents .agent-abilities li::before{content:"✓";position:absolute;left:0;top:0;color:#1d5fe9;font-weight:800}
@media(max-width:720px){
  .agents .agent-card,.agents .agent-card.manager{display:flex;flex-direction:column}
  .agents .agent-card h3{order:1}
  .agents .agent-card .agent-details{order:2;margin-top:14px}
  .agents .agent-card .agent-abilities{order:3;margin-top:16px;grid-column:auto}
  .agents .agent-abilities li{font-size:.9375rem}
}

/* 4. セリフのスクロール連動表示 */
.talk-ch{opacity:0}
.talk-ch.on{opacity:1}
.talk-ch.cur{box-shadow:2px 0 0 #1d5fe9}
@media(prefers-reduced-motion:reduce){.talk-ch{opacity:1;transition:none}}
@media(min-width:721px){.talk-bubble{font-size:1rem;line-height:1.85;padding:18px 20px}}
@media(max-width:720px){
  .agents .section-head h2{line-height:1.4;padding:8px 0}
  .agents .conversation{display:grid;grid-template-columns:auto 1fr;gap:10px 10px;align-items:center}
  .agents .talk-body{display:contents}
  .agents .talk-body b{margin:0;font-size:.875rem}
  .agents .talk-bubble{grid-column:1/-1;border-radius:4px 18px 18px 18px}
  .agents .talk-bubble::before{top:-9px;left:10px;border-width:0 8px 9px 8px;border-color:transparent transparent #cfe0f5 transparent}
  .agents .talk-bubble::after{top:-7px;left:11px;border-width:0 7px 8px 7px;border-color:transparent transparent #edf4fc transparent}
  .agents .agent-card.manager .talk-bubble::after{border-color:transparent transparent #fff transparent}
}
#cost-comparison .bar-group:not(:first-child) .cost-bar.elliot{--height:10%!important}
.agents .catch{background:linear-gradient(transparent 58%,#ffe27a 58%) no-repeat 0 0/0% 100%;transition:background-size .6s cubic-bezier(.3,.7,.2,1),color .3s ease;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.agents .catch.catch-on{background-size:100% 100%;color:#1d5fe9}
@media(prefers-reduced-motion:reduce){.agents .catch{transition:none}}
/* 見出しサイズの統一と、foundation / migration の追従見出し */
@media(min-width:721px){
  .section-head h2,.proof-copy h2{font-size:clamp(.9rem,3.2vw,2.35rem)!important;line-height:1.3}
  #foundation .section-head h2,#migration .section-head h2{white-space:nowrap}
}
#foundation .section-head,#migration .section-head{display:contents}
#foundation .section-head h2,#migration .section-head h2{position:sticky;top:64px;z-index:20;margin:0;padding:14px 0 12px;background:#fff}
#foundation .section-head h2::after,#migration .section-head h2::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px;background:linear-gradient(#fff,transparent);pointer-events:none}
#foundation .section-head>p:last-child{margin-bottom:48px}
#migration .section-head h2{margin-bottom:36px}
@media(max-width:720px){
  #foundation .section-head h2,#migration .section-head h2{top:62px;padding:8px 0;line-height:1.4}
  #foundation .section-head>p:last-child{margin-bottom:28px}
  #migration .section-head h2{margin-bottom:22px}
}
/* price / expansion の追従見出し */
#price .section-head,section.expansion .section-head{display:contents}
#price .section-head h2,section.expansion .section-head h2{position:sticky;top:64px;z-index:20;margin:0;padding:14px 0 12px}
#price .section-head h2{background:var(--tint)}
section.expansion .section-head h2{background:#fff}
#price .section-head h2::after,section.expansion .section-head h2::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px;pointer-events:none}
#price .section-head h2::after{background:linear-gradient(var(--tint),transparent)}
section.expansion .section-head h2::after{background:linear-gradient(#fff,transparent)}
#price .section-head>p:last-child{margin-bottom:48px}
section.expansion .section-head>p:last-child{margin-bottom:35px}
@media(max-width:720px){
  #price .section-head h2,section.expansion .section-head h2{top:62px;padding:8px 0;line-height:1.4}
  #price .section-head>p:last-child,section.expansion .section-head>p:last-child{margin-bottom:28px}
}
/* SaaSとの比較表 */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.compare{max-width:1120px;margin:76px auto 0}
.compare-title{font-size:clamp(1.15rem,1.8vw,1.45rem);line-height:1.5;margin:0 0 6px;color:var(--ink)}
.compare-lead{margin:0 0 24px;color:#5e6e83;font-size:.95rem;line-height:1.8}
.compare-table{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;font-size:.92rem;line-height:1.75}
.compare-table .c-axis{width:17%}.compare-table .c-saas{width:37%}
.compare-table th,.compare-table td{padding:16px 20px;text-align:left;vertical-align:top;border-bottom:1px solid #dbe5f1}
.compare-table thead th{font-size:.92rem;font-weight:800;border-bottom:0;padding:14px 20px}
.compare-table .h-saas{background:#e9edf2;color:#4a5b70;border-radius:12px 12px 0 0}
.compare-table .h-elliot{background:#1d5fe9;color:#fff;border-radius:12px 12px 0 0}
.compare-table tbody th{font-size:.86rem;font-weight:800;color:#17365f}
.compare-table td.saas{background:#f8fafc;color:#5d6e83}
.compare-table td.elliot{background:#edf4fc;color:#17365f;font-weight:700;border-left:2px solid #1d5fe9;border-right:2px solid #1d5fe9;border-bottom-color:#cfe0f5}
.compare-table tbody tr:last-child th,.compare-table tbody tr:last-child td.saas{border-bottom:0}
.compare-table tbody tr:last-child td.saas{border-radius:0 0 12px 12px}
.compare-table tbody tr:last-child td.elliot{border-bottom:2px solid #1d5fe9;border-radius:0 0 12px 12px}
.compare-note{font-size:.75rem;line-height:1.7;color:#697b90;margin:14px 0 0}
@media(max-width:720px){
  .compare{margin-top:44px}
  .compare-table,.compare-table tbody,.compare-table tr,.compare-table th,.compare-table td{display:block;width:auto}
  .compare-table colgroup{display:none}
  .compare-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .compare-table tbody tr{border:1px solid #dbe5f1;border-radius:12px;overflow:hidden;background:#fff}
  .compare-table tbody tr+tr{margin-top:14px}
  .compare-table tbody th{padding:12px 16px;border:0;background:#f3f7fc;font-size:.9375rem}
  .compare-table td.saas,.compare-table td.elliot{padding:12px 16px;border:0;border-radius:0!important;font-size:.9375rem}
  .compare-table td.elliot{border-left:3px solid #1d5fe9}
  .compare-table td::before{content:attr(data-label);display:block;font-size:.75rem;font-weight:800;letter-spacing:.04em;margin-bottom:3px;color:#8594a6}
  .compare-table td.elliot::before{color:#1d5fe9}
}
@media(min-width:721px){
  .compare{max-width:1120px}
  .compare-table{font-size:1.05rem}
  .compare-table thead th{text-align:center;font-size:1rem}
  .compare-table tbody th{vertical-align:middle;font-size:.9rem}
  .compare-table td{text-align:center;vertical-align:middle;padding:18px 20px}
  .compare-table .c-axis{width:20%}.compare-table .c-saas{width:40%}
}
.compare-table .cell-note{display:block;margin-top:3px;font-size:.75rem;font-weight:500;color:#5a7396;line-height:1.6}
a.header-cta,a.button{text-decoration:none}a.header-cta{line-height:1.2}a.button{line-height:1.4;text-align:center}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-error{margin:4px 0 0;color:#b3261e;font-size:.85rem;line-height:1.6}
.contact-dialog [data-submit]:disabled{opacity:.6;cursor:progress}
.form-error{grid-column:1/-1}
.contact-dialog label.consent{grid-column:1/-1;display:flex;align-items:flex-start;gap:9px;font-size:.82rem;font-weight:600;line-height:1.6;cursor:pointer}
.contact-dialog label.consent input{width:18px;height:18px;flex:none;display:inline-block;margin:2px 0 0;padding:0;accent-color:#1d5fe9}
.contact-dialog label.consent a{color:#1d5fe9;text-decoration:underline;text-underline-offset:2px}
@media(max-width:720px){.contact-dialog label.consent{font-size:.875rem}.contact-dialog label.consent input{width:20px;height:20px}}
/* 会社概要（当社についての下） */
.company{margin-top:56px;padding-top:34px;border-top:1px solid #4d6b90}
.company-title{margin:0 0 20px;font-size:.8rem;font-weight:800;letter-spacing:.14em;color:#8cbaff}
.company-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 32px;margin:0}
.company-list>div{min-width:0}
.company-list .wide{grid-column:span 2}
.company-list dt{font-size:.72rem;font-weight:700;letter-spacing:.06em;color:#8fa2b9;margin:0 0 4px}
.company-list dd{margin:0;font-size:.95rem;line-height:1.6;color:#fff;font-weight:600}
@media(max-width:900px){.company-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.company{margin-top:36px;padding-top:26px}.company-list{gap:16px 20px}.company-list dt{font-size:.75rem}.company-list dd{font-size:.9375rem}}
/* 冒頭のTOPIC行 */
.hero-topic{display:inline-flex;align-items:center;gap:10px;margin:0 0 18px;padding:6px 14px 6px 6px;border:1px solid #cadcf1;border-radius:999px;background:#fff;font-size:.8rem;line-height:1.5;color:#17365f;font-weight:700;max-width:100%}
.hero-topic-label{flex:none;padding:3px 9px;border-radius:999px;background:#1d5fe9;color:#fff;font-size:.66rem;font-weight:800;letter-spacing:.12em}
.hero-topic-text{min-width:0}
@media(max-width:720px){.hero-topic{align-items:flex-start;border-radius:14px;padding:8px 12px 8px 8px;font-size:.8125rem;margin-bottom:16px}.hero-topic-label{margin-top:2px}}