@charset "UTF-8";

/* A案の原稿整理と、必要な人だけ開ける詳細情報。 */
.concept-a .a-hero h1 { font-size: clamp(48px, 6.2vw, 98px); }
.concept-a .a-lead { max-width: 670px; }
.concept-a main section[id] { scroll-margin-top: 76px; }
.concept-a .content-detail,
.concept-a .case-detail { margin-top: 16px; }
.concept-a .content-detail summary,
.concept-a .case-detail summary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  color: #176d41;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
  border-bottom: 1px solid currentColor;
}
.concept-a .content-detail summary::-webkit-details-marker,
.concept-a .case-detail summary::-webkit-details-marker { display: none; }
.concept-a .content-detail summary::after,
.concept-a .case-detail summary::after { content: "+"; font-size: 19px; font-weight: 400; text-decoration: none; }
.concept-a .content-detail[open] summary::after,
.concept-a .case-detail[open] summary::after { content: "−"; }
.concept-a .content-detail summary:focus-visible,
.concept-a .case-detail summary:focus-visible { outline: 3px solid #1a7a49; outline-offset: 4px; }
.concept-a .content-detail > div { max-width: 780px; margin: 5px 0 8px; padding: 18px 20px; border-left: 2px solid #278452; background: #fff; }
.concept-a .content-detail p + p { margin-top: 9px; }
.concept-a .content-detail strong { color: #163f29; }
.concept-a .case-detail { margin-top: 12px; }
.concept-a .case-detail p { padding: 13px 0 0; border-top: 1px solid #d4e4d7; }
.concept-a .case-service-link { display: inline-flex; align-items: center; align-self: flex-start; min-height: 44px; margin-top: 8px; border-bottom: 1px solid currentColor; color: #176d41; font-size: 12px; font-weight: 700; text-decoration: none; }
.concept-a .case-service-link:hover { color: #0b4929; }
.concept-a .case-service-link:focus-visible { outline: 3px solid #1a7a49; outline-offset: 4px; }
.concept-a .scope-list article { align-items: start; }
.concept-a .scope-list article > span { padding-top: 6px; }
.concept-a .a-ai { background: #fff; }
.concept-a .ai-path { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1px; border: 1px solid #c3d8c8; background: #c3d8c8; }
.concept-a .ai-path article { min-height: 330px; padding: clamp(24px, 3vw, 42px); display: flex; flex-direction: column; background: #f7fbf7; }
.concept-a .ai-path article > span { color: #2b8150; font: 11px ui-monospace, monospace; letter-spacing: .12em; }
.concept-a .ai-path h3 { margin: 35px 0 19px; font-size: clamp(25px, 2.5vw, 36px); line-height: 1.35; letter-spacing: -.06em; }
.concept-a .ai-path p { margin: 0; color: #415748; font-size: 14px; line-height: 1.9; }
.concept-a .ai-detail { margin-top: 16px; }
.concept-a .ai-detail summary { min-height: 40px; display: inline-flex; align-items: center; gap: 8px; color: #176d41; font-size: 12px; font-weight: 700; cursor: pointer; list-style: none; border-bottom: 1px solid currentColor; }
.concept-a .ai-detail summary::-webkit-details-marker { display: none; }
.concept-a .ai-detail summary::after { content: "+"; font-size: 18px; font-weight: 400; }
.concept-a .ai-detail[open] summary::after { content: "−"; }
.concept-a .ai-detail summary:focus-visible { outline: 3px solid #1a7a49; outline-offset: 4px; }
.concept-a .ai-detail ul { margin: 12px 0 0; padding-left: 19px; color: #425b49; font-size: 12px; line-height: 1.8; }
.concept-a .ai-detail li + li { margin-top: 6px; }
.concept-a .ai-path small { margin-top: auto; padding-top: 25px; color: #5f7464; font-size: 11px; line-height: 1.7; }
.concept-a .ai-path-cta { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 25px 0 0; }
.concept-a .ai-path-cta p { max-width: 620px; margin: 0; color: #425a49; font-size: 14px; line-height: 1.9; }
.concept-a .ai-path-cta a { min-height: 44px; display: inline-flex; align-items: center; gap: 30px; color: #176d41; font-size: 13px; font-weight: 700; white-space: nowrap; border-bottom: 1px solid currentColor; }
.concept-a .a-work-cards .case-detail + .case-tags { margin-top: auto; }
.concept-a .a-work-cards .case-service-link + .case-tags { margin-top: auto; }
.scene-ai-demo .ai-demo-head small { max-width: 52%; text-align: right; line-height: 1.4; }

@media (max-width: 1050px) {
  .concept-a .a-hero h1 { font-size: clamp(47px, 6vw, 76px); white-space: normal; }
  .concept-a .desktop-nav { display: none; }
}
@media (max-width: 850px) {
  .concept-a .ai-path { grid-template-columns: 1fr; }
  .concept-a .ai-path article { min-height: 0; }
  .concept-a .ai-path h3 { margin-top: 18px; }
  .concept-a .ai-path small { margin-top: 12px; padding-top: 0; }
}
@media (max-width: 600px) {
  .concept-a .a-hero h1 { font-size: clamp(43px, 10.8vw, 62px); }
  .concept-a .scope-list article { gap: 10px; }
  .concept-a .scope-list h3 { font-size: 25px; }
  .concept-a .ai-path-cta { display: block; }
  .concept-a .ai-path-cta a { margin-top: 16px; }
  .concept-a .content-detail > div { padding: 15px; }
}

/* 2026-09-27: 通常ページの画像、相談導線、読み進められる内容。 */
.concept-a .a-hero-inner { grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr); gap: clamp(30px, 4vw, 70px); }
.concept-a .a-hero h1 { margin-bottom: 16px; line-height: 1.16; }
.concept-a .a-hero-subtitle { margin: 0 0 22px; color: #1d6540; font-size: clamp(15px, 1.42vw, 20px); font-weight: 700; letter-spacing: -.04em; }
.concept-a .a-lead { font-size: clamp(15px, 1.18vw, 18px); line-height: 1.9; }
.concept-a .a-hero-actions { margin-top: 36px; }
.concept-a .a-hero-foot { margin-top: 48px; }
.concept-a .a-hero-visual { position: relative; margin: 0; min-width: 0; transform: translate3d(var(--orbit-x,0px),var(--orbit-y,0px),0); transition: transform .45s ease-out; }
.concept-a .a-hero-photo-wrap { position: relative; overflow: hidden; aspect-ratio: .91; background: #dceae0; border-radius: 2px 42% 2px 2px; box-shadow: 0 28px 80px rgba(21,76,44,.15); }
.concept-a .a-hero-photo-wrap::after { content: ""; position: absolute; inset: 0; border: 1px solid rgba(255,255,255,.4); border-radius: inherit; pointer-events: none; }
.concept-a .a-hero-photo-wrap img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 56% center; transform: scale(1.045); transition: transform 1.1s cubic-bezier(.16,1,.3,1); }
.concept-a .a-hero-visual:hover img { transform: scale(1); }
.concept-a .a-hero-photo-scan { position: absolute; z-index: 1; top: 0; left: 0; width: 1px; height: 100%; background: rgba(255,255,255,.75); box-shadow: 0 0 38px rgba(255,255,255,.7); animation: hero-scan 10s ease-in-out infinite alternate; }
.concept-a .a-hero-visual figcaption { display: flex; justify-content: space-between; gap: 14px; margin-top: 15px; color: #33724e; font: 10px ui-monospace,monospace; letter-spacing: .12em; }
.concept-a .a-hero-visual figcaption small { color: #5d7865; font-size: 10px; letter-spacing: 0; text-align: right; }
.concept-a .a-hero-visual-corner { position: absolute; z-index: 2; left: -22px; bottom: 60px; padding: 10px 16px; color: #fff; background: #176a41; font: 10px ui-monospace,monospace; letter-spacing: .13em; box-shadow: 0 14px 38px rgba(17,87,48,.18); }
@keyframes hero-scan { 0%,25% { transform: translateX(0); opacity: 0; } 38%,70% { opacity: .65; } 100% { transform: translateX(500px); opacity: 0; } }

.concept-a .a-consult { background: #fff; }
.concept-a .consult-layout { display: grid; grid-template-columns: minmax(280px,.86fr) minmax(0,1.14fr); gap: 1px; background: #b6d2bf; border: 1px solid #b6d2bf; box-shadow: 0 26px 60px rgba(24,87,48,.08); }
.concept-a .consult-options { display: grid; background: #e9f4ec; }
.concept-a .consult-option { display: grid; grid-template-columns: 38px 1fr 20px; align-items: center; gap: 13px; min-height: 94px; padding: 22px 26px; border: 0; border-bottom: 1px solid #c3d9c9; background: transparent; color: #1b3926; cursor: pointer; text-align: left; transition: background .3s, padding-left .3s, color .3s; }
.concept-a .consult-option:last-child { border-bottom: 0; }
.concept-a .consult-option:hover { padding-left: 33px; background: #dcefe1; }
.concept-a .consult-option.is-active { background: #176b41; color: #fff; }
.concept-a .consult-option span:first-child { font: 11px ui-monospace,monospace; opacity: .75; }
.concept-a .consult-option strong { font-size: clamp(16px,1.5vw,21px); letter-spacing: -.04em; }
.concept-a .consult-option span:last-child { font-size: 20px; }
.concept-a .consult-panel { min-height: 375px; display: flex; flex-direction: column; padding: clamp(30px,4vw,58px); background: #f9fcf9; }
.concept-a .consult-panel-kicker { margin: 0 0 28px; color: #428458; font: 11px ui-monospace,monospace; letter-spacing: .13em; }
.concept-a .consult-panel h3 { max-width: 610px; margin: 0 0 38px; color: #173a27; font-size: clamp(28px,3vw,43px); line-height: 1.35; letter-spacing: -.07em; }
.concept-a .consult-panel-body { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.concept-a .consult-panel-body > div { padding-top: 17px; border-top: 1px solid #bfd5c5; }
.concept-a .consult-panel-body small { color: #278052; font-size: 11px; font-weight: 700; }
.concept-a .consult-panel-body p { margin: 10px 0 0; color: #45604d; font-size: 14px; line-height: 1.85; }
.concept-a .consult-cta { display: inline-flex; align-items: center; justify-content: space-between; gap: 20px; width: fit-content; min-height: 44px; margin-top: auto; padding-top: 25px; color: #146d41; border-bottom: 1px solid currentColor; font-size: 13px; font-weight: 700; }
.concept-a .consult-panel-note { margin: 16px 0 0; color: #687b6c; font-size: 11px; }
.concept-a .consult-panel.is-changing > :not(.consult-panel-note) { animation: consult-change .52s both; }
@keyframes consult-change { from { opacity: .3; transform: translate3d(0,12px,0); } to { opacity: 1; transform: translate3d(0,0,0); } }

.concept-a .a-process { background: #f0f7f1; }
.concept-a .process-list { border-top: 1px solid #a8c4ae; }
.concept-a .process-list article { display: grid; grid-template-columns: 115px 1fr 32px; gap: 30px; align-items: start; padding: 32px 10px; border-bottom: 1px solid #a8c4ae; }
.concept-a .process-list article > span { padding-top: 8px; color: #358156; font: 11px ui-monospace,monospace; letter-spacing: .12em; }
.concept-a .process-list article h3 { margin: 0 0 11px; color: #193a28; font-size: clamp(26px,2.5vw,36px); letter-spacing: -.065em; }
.concept-a .process-list article p { max-width: 760px; margin: 0; color: #4e6554; font-size: 14px; line-height: 1.85; }
.concept-a .process-list article b { color: #318056; font-size: 26px; font-weight: 400; transition: transform .4s; }
.concept-a .process-list article:hover b { transform: translate(5px,5px); }
.concept-a .process-cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 26px; color: #315f40; font-size: 13px; }
.concept-a .process-cta a { display: inline-flex; align-items: center; gap: 20px; min-height: 44px; color: #146d41; border-bottom: 1px solid; font-weight: 700; }
.concept-a .a-faq { background: #fff; }
.concept-a .faq-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(30px,7vw,120px); }
.concept-a .faq-grid h2 { margin: 24px 0 20px; font-size: clamp(35px,4vw,60px); line-height: 1.3; letter-spacing: -.07em; }
.concept-a .faq-grid > div:first-child > p:last-child { color: #5e7263; line-height: 1.8; }
.concept-a .faq-list { border-top: 1px solid #b3cab9; }
.concept-a .faq-list details { border-bottom: 1px solid #b3cab9; }
.concept-a .faq-list summary { position: relative; padding: 24px 35px 24px 0; color: #1b3c29; font-size: 16px; font-weight: 700; line-height: 1.6; cursor: pointer; list-style: none; }
.concept-a .faq-list summary::-webkit-details-marker { display: none; }
.concept-a .faq-list summary::after { content: "+"; position: absolute; right: 0; top: 21px; color: #25814e; font-size: 23px; font-weight: 400; }
.concept-a .faq-list details[open] summary::after { content: "−"; }
.concept-a .faq-list details p { margin: 0 0 25px; color: #4c6253; font-size: 14px; line-height: 1.9; }
.concept-a .contact-layout { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px,8vw,120px); border-top: 1px solid #688674; padding-top: 32px; }
.concept-a .contact-intro > p:first-child { max-width: 530px; margin: 0 0 28px; color: #dceadf; font-size: 16px; line-height: 2; }
.concept-a .contact-first-note { padding: 22px 24px; border: 1px solid #6a8b74; background: rgba(255,255,255,.05); }
.concept-a .contact-first-note small { display: block; color: #c3e9cd; font-size: 11px; font-weight: 700; }
.concept-a .contact-first-note ol { margin: 14px 0 0; padding-left: 20px; color: #eaf3eb; font-size: 13px; line-height: 2; }
.concept-a .contact-selected { margin: 18px 0 0; color: #b8d9c3; font-size: 12px; }
.concept-a .contact-methods { display: grid; gap: 12px; align-content: start; }
.concept-a .contact-methods a { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 122px; padding: 20px 26px; border: 1px solid #93b39b; transition: transform .3s, background .3s; }
.concept-a .contact-methods a:hover { transform: translateX(5px); }
.concept-a .contact-methods .contact-line { background: #f7fff7; color: #173e27; }
.concept-a .contact-methods .contact-line:hover { background: #e2f6e7; }
.concept-a .contact-methods .contact-email { color: #f1faf1; }
.concept-a .contact-methods .contact-email:hover { background: rgba(255,255,255,.08); }
.concept-a .contact-methods a span { display: grid; gap: 5px; }
.concept-a .contact-methods a small { font: 10px ui-monospace,monospace; letter-spacing: .14em; opacity: .7; }
.concept-a .contact-methods a strong { font-size: 21px; letter-spacing: -.04em; }
.concept-a .contact-methods a em { font-size: 11px; font-style: normal; opacity: .75; }
.concept-a .contact-methods a b { font-size: 25px; font-weight: 400; }
.concept-a .contact-methods > p { margin: 7px 0 0; color: #b8cfbd; font-size: 11px; line-height: 1.8; }

@media (max-width: 1050px) {
  .concept-a .a-hero-inner { grid-template-columns: minmax(0,1fr) minmax(300px,.85fr); }
  .concept-a .a-hero h1 { font-size: clamp(48px,5.8vw,75px); }
}
@media (max-width: 850px) {
  .concept-a .a-hero { justify-content: flex-start; }
  .concept-a .a-hero-inner, .concept-a .consult-layout, .concept-a .faq-grid, .concept-a .contact-layout { grid-template-columns: 1fr; }
  .concept-a .a-hero-inner { padding-bottom: 35px; }
  .concept-a .a-hero-visual { max-width: 650px; width: 100%; margin: 0 auto; }
  .concept-a .a-hero-photo-wrap { aspect-ratio: 1.45; }
  .concept-a .consult-panel { min-height: 335px; }
}
@media (max-width: 600px) {
  .concept-a .a-hero-inner { padding-top: 63px; }
  .concept-a .a-hero h1 { font-size: clamp(49px,11vw,66px); }
  .concept-a .a-hero-subtitle { font-size: 15px; line-height: 1.5; }
  .concept-a .a-hero-visual { margin-top: 20px; }
  .concept-a .a-hero-photo-wrap { aspect-ratio: 1.05; }
  .concept-a .a-hero-visual-corner { left: -8px; bottom: 48px; }
  .concept-a .a-hero-visual figcaption { font-size: 8px; }
  .concept-a .a-hero-visual figcaption small { font-size: 9px; }
  .concept-a .consult-option { min-height: 72px; padding: 16px; }
  .concept-a .consult-panel { padding: 25px 20px; }
  .concept-a .consult-panel h3 { margin-bottom: 25px; }
  .concept-a .consult-panel-body { grid-template-columns: 1fr; gap: 18px; }
  .concept-a .consult-cta { margin-top: 20px; }
  .concept-a .process-list article { grid-template-columns: 72px 1fr; gap: 13px; padding: 27px 0; }
  .concept-a .process-list article b { display: none; }
  .concept-a .process-list article h3 { font-size: 24px; }
  .concept-a .process-cta { display: block; }
  .concept-a .process-cta a { margin-top: 10px; }
  .concept-a .a-contact h2 { font-size: clamp(39px,10vw,54px); }
  .concept-a .contact-layout { gap: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .concept-a .a-hero-photo-scan { animation: none; display: none; }
  .concept-a .a-hero-visual, .concept-a .a-hero-photo-wrap img { transition: none; transform: none; }
.concept-a .consult-panel.is-changing > :not(.consult-panel-note) { animation: none; }
}

/* スクロール位置と、操作に連動する通常ページの動き。 */
.concept-a .site-header::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 100%; height: 2px; background: #2a9357; transform: scaleX(var(--page-progress,0)); transform-origin: left; pointer-events: none; }
.concept-a .a-hero-photo-wrap img { will-change: transform; }
.concept-a .console-display.is-switching h3 { animation: console-copy-in .65s cubic-bezier(.16,1,.3,1) both; }
.concept-a .console-display.is-switching .flow-node { animation: console-flow-in .6s cubic-bezier(.16,1,.3,1) both; }
.concept-a .console-display.is-switching .flow-node:nth-of-type(3) { animation-delay: .12s; }
.concept-a .console-display.is-switching .flow-node:nth-of-type(5) { animation-delay: .24s; }
@keyframes console-copy-in { from { opacity: .25; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes console-flow-in { from { opacity: .3; transform: translateX(-14px); } to { opacity: 1; transform: translateX(0); } }
.concept-a.js-motion .ai-path article:nth-child(2), .concept-a.js-motion .a-work-cards article:nth-child(2) { transition-delay: .08s; }
.concept-a.js-motion .ai-path article:nth-child(3), .concept-a.js-motion .a-work-cards article:nth-child(3) { transition-delay: .16s; }
@media (max-width: 600px) {
  .concept-a .a-contact h2 { font-size: clamp(28px,8.8vw,46px); }
}
@media (prefers-reduced-motion: reduce) {
  .concept-a .console-display.is-switching h3, .concept-a .console-display.is-switching .flow-node { animation: none; }
  .concept-a .a-hero-photo-wrap img { will-change: auto; }
}

/* 中央の項目を拡大し、カーソル・キーボード操作中の項目を最優先にする。 */
@media (prefers-reduced-motion: no-preference) {
  .concept-a [data-proximity-focus],
  .concept-a.js-motion [data-proximity-focus] {
    position: relative;
    scale: 1;
    transform-origin: center center;
    transition:
      scale .52s cubic-bezier(.16,1,.3,1),
      box-shadow .42s ease,
      opacity .8s ease,
      transform .8s cubic-bezier(.16,1,.3,1),
      background-color .3s ease,
      color .3s ease,
      padding-left .3s ease;
  }
  .concept-a [data-focus-kind="text"].is-center-focus { z-index: 2; scale: 1.055; }
  .concept-a [data-focus-kind="text"].is-pointer-focus,
  .concept-a [data-focus-kind="text"].is-keyboard-focus { z-index: 5; scale: 1.1; }
  .concept-a .a-contact h2[data-proximity-focus] { max-width: 90.9%; transform-origin: left center; }
  .concept-a [data-focus-kind="panel"].is-center-focus {
    z-index: 2;
    scale: 1.028;
    box-shadow: 0 17px 44px rgba(20,70,39,.11);
  }
  .concept-a [data-focus-kind="panel"].is-pointer-focus,
  .concept-a [data-focus-kind="panel"].is-keyboard-focus {
    z-index: 5;
    scale: 1.064;
    box-shadow: 0 25px 65px rgba(17,72,39,.2);
  }
  .concept-a .a-hero-visual.is-center-focus { scale: 1.02; }
  .concept-a .a-hero-visual.is-pointer-focus { scale: 1.045; }
  .concept-a .scope-list article.is-center-focus,
  .concept-a .process-list article.is-center-focus,
  .concept-a .faq-list details.is-center-focus { background: rgba(255,255,255,.85); }
  .concept-a .scope-list article.is-pointer-focus,
  .concept-a .process-list article.is-pointer-focus,
  .concept-a .faq-list details.is-pointer-focus { background: #fff; }
}
@media (max-width: 600px) and (prefers-reduced-motion: no-preference) {
  .concept-a [data-focus-kind="text"].is-center-focus { scale: 1.025; }
  .concept-a [data-focus-kind="panel"].is-center-focus { scale: 1.018; }
}
