*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;color:#252e54;background:#fff;font-family:"Noto Sans JP","Yu Gothic",sans-serif;font-size:15px;line-height:1.95}a{color:inherit;text-decoration:none}button,select,textarea{font:inherit}a,button,summary{touch-action:manipulation}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #b88b37;outline-offset:5px}.wrap{max-width:1180px;margin:auto;padding-left:32px;padding-right:32px}header{height:88px;display:flex;align-items:center;gap:32px;padding:0 4%;border-bottom:1px solid #e3e7eb;background:#fff;position:sticky;top:0;z-index:10}header img{display:block}nav{display:flex;gap:25px;margin-left:auto;font-size:13px}header>.button{margin-left:auto}h1,h2{font-family:"Noto Serif JP","Yu Mincho",serif;font-weight:600;line-height:1.55;letter-spacing:.03em}h1{font-size:clamp(35px,4vw,56px);margin:14px 0 22px}h1 em{font-style:normal;color:#07888c}h2{font-size:clamp(27px,3vw,39px);margin:10px 0 28px}h3{line-height:1.65;margin:0 0 12px}p{margin:0 0 18px;color:#637087}.eyebrow{font-size:11px;letter-spacing:.18em;font-weight:700;color:#9a772e;margin-bottom:16px}.label{color:#00878b;font-weight:700;font-size:16px;margin-bottom:8px}.crumb{font-size:11px;color:#7b8396;padding-top:22px}.hero{display:grid;grid-template-columns:1.25fr 1fr;gap:45px;padding-top:58px;padding-bottom:78px;align-items:center}.lead{font-size:16px;line-height:2}.actions{display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin-top:28px}.button{display:inline-flex;align-items:center;justify-content:center;background:#07878b;color:#fff;padding:17px 23px;border:0;cursor:pointer;font-weight:700;font-size:13px}.button:hover{background:#086d76}.small{padding:12px 20px}.textlink{font-weight:700;color:#087e85;font-size:13px}.fine{font-size:11px;margin-top:18px;line-height:1.8}.journey{min-height:410px;background:#f3f6f8;position:relative;padding:28px 38px;text-align:center;border-top:2px solid #b28a3d}.journey-top{font-size:9px;letter-spacing:.17em;color:#8c96a8}.idea,.operate{display:flex;justify-content:center;gap:16px;align-items:center;color:#252e54;margin-top:20px;font-size:18px;font-weight:700}.idea span,.operate span{font-size:9px;letter-spacing:.12em;color:#8b95a9}.line{height:23px;border-left:1px solid #b18a3b;width:1px;margin:auto}.route{background:#252e54;max-width:280px;margin:auto;padding:23px;border-radius:2px}.route img{width:160px}.route p{color:#e3e8f0;font-size:14px;margin:12px 0 0}.operate{margin-top:0}.tags{display:flex;justify-content:center;gap:9px;margin-top:20px}.tags span{background:white;border:1px solid #d8e1e4;padding:4px 12px;font-size:11px}.journey small{display:block;margin-top:18px;font-size:11px;color:#637087}.section-nav{display:flex;justify-content:center;gap:45px;padding:22px;border-top:1px solid #e2e7eb;border-bottom:1px solid #e2e7eb;font-size:13px;font-weight:700}.section{padding-top:85px;padding-bottom:85px}.pale{background:#f5f7f9}.issues{display:grid;grid-template-columns:repeat(3,1fr);gap:26px 35px;margin-top:40px}.issues article{padding:22px 0 10px 31px;border-top:1px solid #d8dfe7;position:relative}.issues h3{font-size:17px}.issues p{font-size:13px}.check{position:absolute;left:0;color:#0d8b8e}.closing{text-align:center;margin:40px 0 0;color:#252e54}.intro{margin-bottom:45px}.support-list article{display:grid;grid-template-columns:80px 1fr .85fr;gap:30px;padding:40px 0;border-top:1px solid #dce2e9}.step-no{font-size:43px;font-family:Georgia,serif;color:#ae8740;line-height:1.2}.step-no small{font-family:Arial,sans-serif;font-size:8px;display:block;letter-spacing:.1em;margin-top:10px}.support-list h3{font-size:22px}.support-list p{font-size:14px;margin-bottom:0}.support-list ul{list-style:none;padding:22px;margin:0;background:#f4f7f8;font-size:12px;align-self:center}.support-list li{padding:5px 0}.support-list li:before{content:'＋';color:#00878b;margin-right:10px}.glossary{background:#f5f7f9;padding:20px 25px;margin-top:20px;display:flex;gap:25px;font-size:12px}.glossary b{white-space:nowrap}.glossary p{margin:0}.navy{background:#252e54;color:white}.navy .eyebrow{color:#cfb471}.values{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:40px}.values article{border-top:1px solid #566080;padding-top:25px}.values span{font-size:10px;color:#c7b17d;letter-spacing:.12em}.values h3{font-size:20px;margin-top:17px}.navy p{color:#cbd3e3}.values p{font-size:14px}.audiences{display:grid;grid-template-columns:1fr 1fr;gap:0 50px}.audiences article{padding:25px 0;border-bottom:1px solid #dce2e9}.audiences h3{font-size:18px}.audiences p{font-size:14px;margin:0}.flow{display:grid;grid-template-columns:repeat(5,1fr);padding:0;list-style:none;counter-reset:step;gap:23px;margin-top:45px}.flow li{counter-increment:step;border-top:2px solid #07878b;padding-top:16px}.flow li:before{content:'0' counter(step);color:#a07d33;font-family:Georgia,serif;font-size:25px}.flow h3{font-size:16px;margin-top:12px}.flow p{font-size:12px}.faq{max-width:950px}.faq details{border-bottom:1px solid #dce2e9;padding:21px 0}.faq summary{font-weight:700;cursor:pointer;list-style:none;padding:0 30px 0 32px;position:relative}.faq summary:before{content:'Q';position:absolute;left:0;color:#07878b}.faq summary:after{content:'＋';position:absolute;right:0;color:#07878b}.faq details[open] summary:after{content:'−'}.faq details p{padding:20px 32px 0;margin:0;font-size:14px}.consult{background:#edf4f4}.consult .section{max-width:950px}.consult-box{background:white;padding:32px 40px;margin-top:30px;border-top:3px solid #07878b}.consult-box h3{font-size:20px}.consult-box>p{font-size:13px}label{display:block;font-size:12px;font-weight:700;margin:18px 0 6px}select,textarea{width:100%;border:1px solid #c9d4dc;padding:12px;color:#252e54;background:#fff;border-radius:0}textarea{resize:vertical}footer{display:flex;gap:35px;align-items:center;background:#19213e;color:#d2d7e2;padding:35px 5%;font-size:12px}footer>a:nth-child(2){margin-left:auto}footer small{color:#8b97ae}@media(max-width:960px){.site-header nav{display:none}.hero{gap:24px}.wrap{padding-left:24px;padding-right:24px}.hero .actions{align-items:flex-start;flex-direction:column}.section-nav{gap:22px}.support-list article{grid-template-columns:55px 1fr;gap:20px}.support-list ul{grid-column:2}.flow{grid-template-columns:1fr 1fr}.flow li:last-child{grid-column:1/-1}.values{gap:24px}}@media(max-width:640px){header{height:70px;padding:0 18px;gap:10px}header img{width:135px}.small{font-size:11px;padding:10px 13px}.crumb{font-size:9px}.hero{grid-template-columns:1fr;padding-top:30px;padding-bottom:45px}.hero h1{font-size:36px}.lead{font-size:14px}.journey{min-height:0;padding:22px}.section-nav{justify-content:flex-start;overflow:auto;white-space:nowrap;font-size:11px;padding:17px 24px;gap:25px}.section{padding-top:55px;padding-bottom:55px}.issues{grid-template-columns:1fr;gap:12px}.issues article{padding-top:17px}.issues p{margin-bottom:6px}.closing{text-align:left;font-size:14px}.support-list article{gap:15px;padding:30px 0;grid-template-columns:40px 1fr}.step-no{font-size:32px}.support-list h3{font-size:19px}.support-list .label{font-size:13px}.support-list ul{padding:15px;font-size:11px}.glossary{display:block;padding:20px}.glossary p{margin-top:10px}.values,.audiences{grid-template-columns:1fr}.values{gap:20px}.flow{grid-template-columns:1fr;gap:15px}.flow li{padding:12px 0 0 45px;position:relative}.flow li:before{position:absolute;left:0;top:8px}.flow h3{margin:0 0 8px}.faq summary{font-size:13px}.faq details p{font-size:13px}.consult-box{padding:25px 20px}.consult .actions{align-items:stretch;flex-direction:column}.consult>div>p{font-size:14px}footer{flex-wrap:wrap}footer img{width:140px}footer small{width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Single-column hero */
.hero{display:block;max-width:1180px;padding-top:65px;padding-bottom:70px;text-align:center}.hero>div{max-width:870px;margin:0 auto}.hero h1{font-size:clamp(36px,4.4vw,60px);line-height:1.6}.hero .lead{font-size:17px}.hero .actions{justify-content:center;flex-direction:row;align-items:center}.hero .fine{margin-bottom:0}@media(max-width:640px){.hero{padding-top:38px;padding-bottom:45px;text-align:left}.hero h1{font-size:36px}.hero .lead{font-size:14px}.hero .actions{align-items:flex-start;flex-direction:column;gap:18px}.hero .button{width:100%}}

/* ── FVを他の下層ページにそろえる（2026-10-24）──
   この .hero を使っているのは 課題から探す／活用シーン／IoT導入・運用支援 の3ページ
   （＋確認用の case-00-index）。ここだけ白地・中央そろえで、
   ほかの下層ページ（紺地・左そろえ）と印象が違っていた。 */
.hero{background:#252e54;color:#fff;display:block;text-align:left;
      max-width:none;margin:0;padding:62px 0 70px}
.hero>.wrap{max-width:1180px;margin:0 auto}
.hero>.wrap>div{max-width:780px;margin:0}
.hero .eyebrow{color:#cfb67e}
.hero .label{color:#a5d6d1}
.hero h1{color:#fff;font-size:clamp(30px,4vw,52px);line-height:1.6}
.hero h1 em{font-style:normal;color:#fff}
.hero .lead{color:#d9e2ef;font-size:15px}
.hero .fine{color:#aab6c9}
.hero .actions{justify-content:flex-start;align-items:center}
.hero .button{background:#fff;color:#252e54}
.hero .textlink,.hero .hero-link{color:#a5d6d1}
@media(max-width:780px){
  .hero{padding:40px 0 48px}
  .hero h1{font-size:clamp(26px,6.4vw,40px)}
  .hero .lead{font-size:14px}
}

/* ── IoT導入・運用支援のFVに画像を敷く（2026-10-24）──
   support.css は 課題から探す／活用シーン とも共有しているので、
   印（.hero--photo）の付いたページだけに効かせている。 */
.hero--photo{position:relative;isolation:isolate;overflow:hidden;
  min-height:600px;display:flex;align-items:center;padding:0}
.hero--photo>.wrap{position:relative;z-index:1;width:100%}
.hero--photo img.hero-photo{position:absolute;inset:0;display:block;width:100%;height:100%;
  max-width:none;object-fit:cover;object-position:center center;z-index:-2}
/* 暗くする処理は画像側に焼き込み済み。ここは文字を読みやすくする分だけ */
.hero--photo::after{content:"";position:absolute;inset:0;z-index:-1;background:
  linear-gradient(0deg,rgba(18,26,48,.58) 0%,rgba(18,26,48,.28) 14%,rgba(18,26,48,0) 32%),
  linear-gradient(90deg,rgba(18,26,48,.7) 0%,rgba(18,26,48,.64) 28%,rgba(18,26,48,.4) 46%,
  rgba(18,26,48,.12) 60%,rgba(18,26,48,0) 74%)}
.hero--photo>.wrap>div{max-width:700px}
@media(max-width:860px){
  .hero--photo{min-height:500px}
  .hero--photo img.hero-photo{object-position:62% center}
  .hero--photo::after{background:
    linear-gradient(180deg,rgba(18,26,48,.76) 0%,rgba(18,26,48,.68) 45%,rgba(18,26,48,.62) 100%)}
  .hero--photo>.wrap>div{max-width:none}
}


/* ── 2026-10-26　パンくずをFVの下に出す ───────────────────────────────
   紺のヘッダーと紺のFVのあいだに、白い帯が38pxだけ挟まって見えていたため、
   HTMLでパンくずをFVの直後へ移した。CSSは余白を整えるだけ。
   お問い合わせ4ページと個人情報保護方針は、紺のFVが無いのでそのまま。 */
.hero + .crumb, .list-hero + .crumb, .detail-hero + .crumb, .article-hero + .crumb,
.services-hero + .crumb, .price-hero + .crumb, .caseprice-hero + .crumb,
.option-hero + .crumb, .proto-hero + .crumb, .design-hero + .crumb,
.concept-hero + .crumb, .manager-hero + .crumb, .spare-hero + .crumb{
  padding-top:17px; padding-bottom:0;
}