
:root{--ink:#152f3b;--deep:#153742;--teal:#287e77;--aqua:#4d9f91;--soft:#e9f3ef;--cream:#f9faf8;--mist:#f2f6f2;--muted:#52646b;--line:#dae4df;--max:1260px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:94px}body{margin:0;color:var(--ink);font-family:"Noto Sans CJK JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;font-weight:400;background:#fff;line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden}body.nav-open{overflow:hidden}a{color:inherit;text-decoration:none}button{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid #8ed0bf;outline-offset:4px}svg{display:block}::selection{background:#b9e1d7;color:#153743}.container{width:min(calc(100% - 104px),var(--max));margin:auto}
.header{height:88px;display:flex;align-items:center;background:rgba(249,250,248,.96);border-bottom:1px solid rgba(27,67,69,.075);position:sticky;top:0;z-index:50;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.header-inner{width:min(calc(100% - 104px),1360px);margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:13px;min-width:0}.brand-symbol{height:43px;width:43px;flex:none}.brand-copy{min-width:0}.brand-ja{font-size:17px;font-weight:800;letter-spacing:.038em;white-space:nowrap;line-height:1.5}.brand-en{font:700 8px/1.6 Arial,sans-serif;letter-spacing:.21em;color:#52686b;margin-top:2px}.nav{display:flex;gap:clamp(18px,2.7vw,39px);align-items:center}.nav a{font-size:12px;font-weight:700;white-space:nowrap;letter-spacing:.045em;position:relative}.nav a:not(.nav-contact):after{content:"";position:absolute;bottom:-8px;left:0;width:100%;height:1px;background:var(--teal);transform:scaleX(0);transform-origin:left;transition:transform .3s}.nav a:not(.nav-contact):hover:after{transform:scaleX(1)}.nav-contact{background:var(--deep);color:white;padding:13px 20px;display:flex;gap:18px;align-items:center;transition:background .3s}.nav-contact:hover{background:var(--teal)}.arrow-north{font-family:Arial,sans-serif;font-size:18px;font-weight:400}.menu-button{display:none;border:0;background:none;width:46px;height:46px;position:relative;cursor:pointer}.menu-button i{display:block;position:absolute;left:12px;width:22px;height:1.5px;background:var(--ink);transition:transform .3s,top .3s}.menu-button i:first-child{top:19px}.menu-button i:last-child{top:27px}.menu-button[aria-expanded="true"] i:first-child{top:23px;transform:rotate(45deg)}.menu-button[aria-expanded="true"] i:last-child{top:23px;transform:rotate(-45deg)}
.hero{position:relative;background:var(--cream);overflow:hidden;isolation:isolate}.hero:before{content:"";position:absolute;inset:auto auto -410px -230px;width:660px;height:660px;border-radius:50%;border:1px solid rgba(45,116,110,.05);box-shadow:0 0 0 95px rgba(45,116,110,.022),0 0 0 190px rgba(45,116,110,.014);pointer-events:none}.hero-main{width:min(calc(100% - 104px),1360px);margin:auto;min-height:690px;display:grid;grid-template-columns:49% 51%;align-items:center;position:relative}.hero-copy{z-index:2;padding:66px 0 106px;position:relative}.eyebrow{display:flex;gap:14px;align-items:center;font:700 10px/1.5 Arial,sans-serif;letter-spacing:.22em;color:var(--teal);margin:0 0 27px}.eyebrow .rule{display:inline-block;width:38px;height:1px;background:currentColor;opacity:.65}.hero h1{font-size:clamp(45px,4.55vw,70px);line-height:1.54;letter-spacing:.04em;font-weight:800;margin:0 0 26px;white-space:nowrap}.hero h1 span{display:block}.hero h1 .accent{color:var(--teal);position:relative;display:inline-block}.hero h1 .accent:after{content:"";position:absolute;left:0;bottom:.08em;width:100%;height:0.22em;background:rgba(77,159,145,.18);border-radius:999px;z-index:-1;transform:scaleX(0);transform-origin:left;animation:accent-line 1.1s cubic-bezier(.2,.8,.2,1) 1s forwards}.hero-subcopy{font-size:20px;line-height:1.9;letter-spacing:.045em;font-weight:700;margin:0 0 18px;color:#23454f}.hero-intro{font-size:15px;line-height:2.2;letter-spacing:.065em;margin:0 0 36px;color:#3f5961;font-weight:500}.hero-intro b{color:var(--ink);font-weight:800}.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.primary-btn,.text-btn{min-height:54px;display:inline-flex;align-items:center;gap:35px;font-size:12px;font-weight:800;letter-spacing:.06em}.primary-btn{background:var(--deep);color:#fff;padding:0 22px 0 26px;transition:background .3s,transform .3s}.primary-btn:hover{background:var(--teal);transform:translateY(-2px)}.btn-arrow{font-size:22px;font-weight:300;line-height:1}.text-btn{padding:0 10px;gap:12px;transition:color .2s}.text-btn:hover{color:var(--teal)}.hero-side-label{position:absolute;z-index:3;right:-4px;bottom:33px;color:#526a6d;font:700 9px Arial,sans-serif;letter-spacing:.24em;writing-mode:vertical-rl;display:flex;gap:14px;align-items:center}.hero-side-label:after{content:"";width:1px;height:43px;background:#9db9b0}.hero-foot{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(41,98,95,.1);height:63px;z-index:3;font-size:10px;letter-spacing:.1em;color:#526a6d}.hero-foot strong{color:var(--teal);font-size:10px;letter-spacing:.15em}.hero-foot .scroll-mark{display:flex;align-items:center;gap:14px;font:700 9px Arial,sans-serif;letter-spacing:.18em}.hero-foot .scroll-mark:after{content:"";height:1px;width:43px;background:#b6c9c3}
.hero-art{width:100%;align-self:center;position:relative;padding-bottom:54px;z-index:1}.art-surface{position:relative;aspect-ratio:760 / 610;width:100%;max-width:780px;margin:auto}.hero-svg{width:100%;height:100%;overflow:visible}.factory-bg{opacity:.54}.factory-line{fill:none;stroke:#cfe0d8;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.factory-fine{fill:none;stroke:#dbe9e3;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.route-shadow{fill:none;stroke:#dbeae4;stroke-width:8;stroke-linejoin:round;stroke-linecap:round;opacity:.52}.route-main{fill:none;stroke:#4e9a8c;stroke-width:2.8;stroke-linejoin:round;stroke-linecap:round;opacity:.96}.inner-fill{fill:#fbfdfc;opacity:.96}.inner-border{fill:none;stroke:#adc9c0;stroke-width:1.5}.inner-detail{fill:none;stroke:#e5efeb;stroke-width:1}.wheel-text{font-size:28px;font-weight:700;fill:#163c47;letter-spacing:.1em}.small-dot{fill:#71b2a4;stroke:#fbfdfc;stroke-width:2;filter:drop-shadow(0 1px 3px rgba(15,96,81,.13))}.small-dot.muted{fill:#90c3b6}.main-glow{fill:#328f7e;opacity:.19;filter:url(#soft-glow)}.main-dot-circle{fill:#176f66;stroke:#f8faf8;stroke-width:2.8;filter:drop-shadow(0 2px 4px rgba(24,112,100,.25))}.hero-art-caption{position:absolute;left:0;right:0;bottom:0;text-align:center;color:#526a6d;font:700 10px/1.6 Arial,sans-serif;letter-spacing:.18em}.hero-art-caption span{display:inline-block;padding:0 16px;position:relative}.hero-art-caption span:before,.hero-art-caption span:after{content:"";position:absolute;top:50%;width:88px;height:1px;background:#c9d8d2}.hero-art-caption span:before{right:100%;margin-right:14px}.hero-art-caption span:after{left:100%;margin-left:14px}
.section{padding:126px 0}.kicker{display:flex;align-items:center;gap:15px;color:var(--teal);font:700 11px Arial,sans-serif;letter-spacing:.17em}.kicker:before{content:"";height:1px;width:30px;background:var(--teal)}.section h2{font-size:clamp(30px,3.8vw,48px);line-height:1.6;letter-spacing:.06em;font-weight:800;margin:24px 0 19px}.section-lead{color:#4d6269;font-size:14px;line-height:2.2;letter-spacing:.025em;max-width:600px;margin:0}.section-split{display:grid;grid-template-columns: .9fr 1.1fr;gap:100px;align-items:start}.section-intro{padding-top:17px}.label-en{font:800 clamp(72px,10vw,144px)/1 Arial,sans-serif;letter-spacing:-.06em;color:#dbe7e1;opacity:.58;margin:0 0 -25px}.problem{background:#fff}.problem-list{border-top:1px solid var(--line);margin-top:11px}.problem-item{display:grid;grid-template-columns:65px 1fr 20px;gap:24px;align-items:center;padding:28px 6px 29px 0;border-bottom:1px solid var(--line)}.problem-no{font-size:12px;font-weight:700;color:var(--teal);letter-spacing:.1em;white-space:nowrap}.problem-title{font-size:clamp(17px,1.7vw,21px);font-weight:800;letter-spacing:.04em}.problem-note{font-size:12px;color:#50666d;margin-top:3px}.problem-dot{width:20px;height:20px;display:grid;place-items:center;color:#88ac9f;font:400 23px/1 Arial,sans-serif}.point-band{background:#eaf2ed;border-top:1px solid rgba(41,119,103,.07);border-bottom:1px solid rgba(41,119,103,.07)}.point-inner{display:grid;grid-template-columns:1fr 1fr;min-height:290px;align-items:center;gap:85px}.point-statement{font-size:clamp(26px,3vw,39px);line-height:1.65;font-weight:800;letter-spacing:.03em;margin:0}.point-statement em{font-style:normal;color:#247f73}.point-text{font-size:14px;line-height:2.3;letter-spacing:.04em;color:#465f65;margin:0;padding-left:45px;border-left:1px solid #bbd4ca}.services{background:#fbfcfa}.services-head{display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:63px}.services-head h2{margin-bottom:0}.services-head .section-lead{max-width:380px;padding-bottom:13px}.service-list{border-top:1px solid #cbdad2}.service-item{display:grid;grid-template-columns:78px 1.1fr 1.2fr 42px;gap:30px;align-items:center;padding:35px 8px 35px 0;border-bottom:1px solid #cbdad2;transition:padding .3s, background .3s}.service-item:hover{padding-left:16px;background:#eef5f0}.service-index{font:700 14px Arial,sans-serif;color:var(--teal)}.service-title{font-size:clamp(18px,1.8vw,24px);line-height:1.7;font-weight:800;letter-spacing:.04em}.service-title small{display:block;font:700 9px/1.5 Arial,sans-serif;color:#516967;letter-spacing:.16em;margin-bottom:6px}.service-descr{font-size:13px;line-height:2;color:#4d666b}.service-arrow{font-size:24px;color:#84a999;justify-self:end}.service-details{padding:0 0 0 108px;max-height:0;overflow:hidden;transition:max-height .45s ease,padding-top .45s ease,padding-bottom .45s ease,color .25s;color:#4b6268;font-size:13px;line-height:2.05}.service-details.is-open{max-height:200px;padding:0 0 28px 108px}.process{background:#fff}.process-inner{display:grid;grid-template-columns:.95fr 1.05fr;gap:95px;align-items:start}.process-head p{font-size:14px;line-height:2.1;color:#4d646a;margin:25px 0 0}.timeline{display:grid;gap:20px;padding-top:16px}.timeline-step{position:relative;padding:23px 24px 23px 76px;border:1px solid #d8e4de;background:#fcfdfc;min-height:102px}.timeline-step:before{content:"";position:absolute;left:28px;top:25px;bottom:25px;width:1px;background:#b7cbc2}.timeline-step:after{content:"";position:absolute;left:24px;top:31px;width:9px;height:9px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 6px #eef5f1}.timeline-step small{display:block;font:700 9px/1.6 Arial,sans-serif;letter-spacing:.18em;color:#8aa09b;margin-bottom:5px}.timeline-step b{display:block;font-size:18px;letter-spacing:.04em;margin-bottom:4px}.timeline-step span{font-size:12px;color:#4d666b}.process-note{margin-top:28px;padding-left:76px;color:#435d63;font-size:13px;line-height:2}.profile{background:#fbfcfa}.profile-inner{display:grid;grid-template-columns: .9fr 1.1fr;gap:110px;align-items:center}.profile-art{background:#fff;border:1px solid #dbe7e1;padding:42px;position:relative}.profile-art svg{width:100%;height:auto}.profile-photo-note{position:absolute;left:32px;bottom:20px;font-size:11px;color:#52676a}.profile-title{margin-top:20px}.profile-text{font-size:14px;line-height:2.3;color:#475e66}.profile-credit{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-top:33px}.profile-credit strong{font-size:16px}.profile-credit span{color:#4f6468;font-size:12px}.contact{background:#153742;color:#fff;padding:120px 0}.contact-inner{display:flex;justify-content:space-between;gap:60px;align-items:end}.contact h2{font-size:clamp(31px,4vw,52px);line-height:1.6;letter-spacing:.05em;margin:24px 0 16px}.contact p{margin:0;font-size:14px;line-height:2.15;color:#d5e4df}.contact .primary-btn{background:#fff;color:#153742}.contact .primary-btn:hover{background:#ecf4f0}.contact-disclaimer{font-size:11px;color:#c2d6cf;margin-top:14px}.footer{background:#0f2a32;color:#dbe8e2;padding:24px 0}.footer-inner{display:flex;justify-content:space-between;gap:24px;align-items:center;font-size:12px}.footer b{font-size:14px}.footnote{font-size:10px;letter-spacing:.16em;color:#b6ccc7;margin-top:4px}.to-top{display:flex;align-items:center;gap:10px;color:#cde0da}
.reveal{opacity:0;transform:translateY(34px)}.reveal.is-visible{opacity:1;transform:none;transition:opacity .8s,transform .8s}.nav.is-open{display:flex}
@keyframes accent-line{to{transform:scaleX(1)}}
@media (max-width:1200px){.hero-main{grid-template-columns:1fr}.hero-copy{padding-bottom:34px}.hero-art{padding-bottom:92px;max-width:860px}.hero-side-label{display:none}.hero-foot{position:relative;height:64px;margin-top:-12px;background:rgba(249,250,248,.94)}.section-split,.process-inner,.profile-inner,.contact-inner{grid-template-columns:1fr;display:grid}.services-head{display:block}.point-inner{grid-template-columns:1fr;gap:35px;padding:70px 0}.point-text{padding-left:0;border-left:none}}
@media (max-width:800px){.container,.header-inner,.hero-main{width:min(calc(100% - 42px),100%)}.nav{display:none;position:fixed;inset:88px 0 auto 0;background:rgba(249,250,248,.98);padding:30px 22px 24px;flex-direction:column;align-items:flex-start;border-bottom:1px solid rgba(27,67,69,.08)}.menu-button{display:block}.hero h1{white-space:normal}.hero-main{min-height:auto}.hero-copy{padding:44px 0 18px}.hero-art{width:100%;padding-bottom:70px}.art-surface{max-width:none}.hero-foot{font-size:9px}.section{padding:84px 0}.label-en{margin-bottom:-10px}.services-head .section-lead{padding-top:18px}.service-item{grid-template-columns:56px 1fr 24px;gap:18px;padding:26px 0}.service-descr{grid-column:2 / span 2;padding-right:10px}.service-details,.service-details.is-open{padding-left:56px;padding-right:0}.service-details.is-open{padding-bottom:22px}.contact{padding:90px 0}.footer-inner{display:grid;justify-content:stretch}.profile-art{padding:24px}}
@media (max-width:560px){.brand-ja{font-size:15px}.brand-en{font-size:7px}.nav-contact{width:100%;justify-content:space-between}.hero h1{font-size:34px;line-height:1.6}.hero-subcopy{font-size:17px;line-height:1.8}.hero-intro{font-size:13px;line-height:2}.actions{display:grid}.primary-btn,.text-btn{width:100%;justify-content:space-between}.hero-foot{display:none}.eyebrow{font-size:9px;margin-bottom:18px}.hero-art-caption span:before,.hero-art-caption span:after{width:44px}.problem-item{grid-template-columns:42px minmax(0,1fr);gap:12px;padding:22px 0}.problem-dot{display:none}.point-statement{font-size:25px}.section h2{font-size:27px}.profile-credit{display:grid;align-items:start}.wheel-text{font-size:30px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero h1 .accent:after{animation:none;transform:scaleX(1)}.reveal{opacity:1;transform:none;transition:none}}

/* UI Refinement: non-clickable insight and process items respond softly to pointer hover. */
@media (hover:hover) and (pointer:fine){
  .problem-item{transition:background-color .33s ease,padding-left .33s ease,box-shadow .33s ease}
  .problem-item:hover{background:#edf5fa;padding-left:16px;box-shadow:inset 3px 0 0 #5f92aa}
  .problem-title,.problem-no,.problem-note,.problem-dot{transition:color .3s ease,transform .3s ease}
  .problem-item:hover .problem-title{color:#265d7e}
  .problem-item:hover .problem-no{color:#447e9c}
  .problem-item:hover .problem-note{color:#557e91}
  .problem-item:hover .problem-dot{color:#447e9c;transform:translate(2px,-2px)}
  .timeline-step{transition:background-color .3s ease,border-color .3s ease,box-shadow .3s ease,transform .3s ease}
  .timeline-step:hover{background:#eef5fa;border-color:#b8d0dd;box-shadow:0 8px 22px rgba(38,85,115,.065);transform:translateX(5px)}
  .timeline-step:hover b{color:#265d7e}
  .timeline-step:hover::after{background:#447e9c;box-shadow:0 0 0 6px #e1edf5}
  .timeline-step:hover::before{background:linear-gradient(to bottom,#447e9c 0%,#447e9c var(--progress-fill),#cbdedb var(--progress-fill),#cbdedb 100%)}
}
/* Progression along the full rail: exactly 0, 25, 50, 75, 100% between its endpoints. */
.timeline-step{min-height:112px;--marker-pos:18px;--progress-fill:0%}
.timeline-step:nth-child(1){--marker-pos:18px;--progress-fill:0%}
.timeline-step:nth-child(2){--marker-pos:calc(25% + 9px);--progress-fill:25%}
.timeline-step:nth-child(3){--marker-pos:50%;--progress-fill:50%}
.timeline-step:nth-child(4){--marker-pos:calc(75% - 9px);--progress-fill:75%}
.timeline-step:nth-child(5){--marker-pos:calc(100% - 18px);--progress-fill:100%}
.timeline-step::before{top:18px;bottom:18px;background:linear-gradient(to bottom,#4f8199 0%,#4f8199 var(--progress-fill),#cbdedb var(--progress-fill),#cbdedb 100%)}
.timeline-step::after{top:var(--marker-pos);transform:translateY(-50%);transition:background-color .3s ease,box-shadow .3s ease}
@media (prefers-reduced-motion: reduce){
  .problem-item,.problem-title,.problem-no,.problem-note,.problem-dot,.timeline-step,.timeline-step::after{transition:none!important}
  .hero h1 .accent::after{animation:none!important;transform:scaleX(1)}
}

/* Refinement v3: distinguish challenge order from service categories with icons. */
.service-icon{display:flex;width:56px;height:56px;align-items:center;justify-content:center;border-radius:50%;background:#edf5f2;color:#2a746f;transition:background-color .3s ease,color .3s ease,transform .3s ease}
.service-icon svg{display:block;width:30px;height:30px;overflow:visible}
.service-item:hover .service-icon,.service-item:focus-visible .service-icon{background:#dcefe9;color:#155a59;transform:translateY(-2px)}
.problem-no{font:700 12px/1.5 Arial,sans-serif;letter-spacing:.14em}
/* Readable muted typography: preserve cool grey but improve contrast on pale surfaces. */
.section-lead,.problem-note,.service-descr,.service-details,.process-head p,.timeline-step span,.profile-text,.point-text,.process-note,.profile-credit span,.hero-intro{color:#455d64}
.service-title small,.timeline-step small,.profile-photo-note,.brand-en,.hero-art-caption,.hero-side-label,.hero-foot{color:#52676c}
.footnote{color:#b4cbc5}
.contact-disclaimer{color:#c2d6cf}
@media(max-width:800px){.service-icon{width:48px;height:48px}.service-icon svg{width:26px;height:26px}}
@media(prefers-reduced-motion:reduce){.service-icon{transition:none!important}}

/* Refinement v4 — increase BODY copy contrast deliberately, not decorative headings. */
:root{--body-readable:#303d43;--body-muted:#37454b}
.hero-intro,.section-lead,.point-text,.service-descr,.service-details,.process-head p,.profile-text,.process-note{color:var(--body-readable)}
.problem-note,.timeline-step span,.profile-credit span,.contact-disclaimer{color:var(--body-muted)}
.problem-item:hover .problem-note{color:#244f68}
.service-item:hover .service-descr,.service-item:focus-visible .service-descr{color:#253c42}
/* A larger, distinct tie-and-briefcase pictogram, without a second trend arrow. */
.service-icon--sales{width:62px;height:62px}
.service-icon--sales svg{width:48px;height:48px}
@media(max-width:800px){.service-icon--sales{width:54px;height:54px}.service-icon--sales svg{width:42px;height:42px}}

/* Typography refinement — Vext-inspired visual hierarchy. Descriptive copy only. */
:root { --body-readable:#1b2838; }
.hero-intro,
.section-lead,
.problem-note,
.point-text,
.service-descr,
.service-details,
.process-head p,
.timeline-step span,
.process-note,
.profile-text,
.profile-credit span {
  color:var(--body-readable);
  font-size:16px;
  line-height:1.95;
  letter-spacing:.015em;
  font-weight:400;
}
.hero-intro { line-height:2.05; }
.problem-note { margin-top:7px; }
.service-descr { line-height:1.85; }
.service-details { line-height:1.95; }
.profile-credit span { font-size:15px; }
.profile-photo-note { color:var(--body-readable); font-size:13px; }
.contact p { font-size:16px; line-height:1.95; color:#ecf4f1; }
.contact-disclaimer { font-size:13px; line-height:1.8; color:#e0ece8; }
@media (max-width:800px) {
  .hero-intro,
  .section-lead,
  .problem-note,
  .point-text,
  .service-descr,
  .service-details,
  .process-head p,
  .timeline-step span,
  .process-note,
  .profile-text,
  .contact p { font-size:16px; line-height:1.9; }
  .hero-intro {line-height:1.95;}
}
@media (max-width:560px) {
  .hero-intro,
  .section-lead,
  .problem-note,
  .point-text,
  .service-descr,
  .service-details,
  .process-head p,
  .timeline-step span,
  .process-note,
  .profile-text,
  .contact p { font-size:16px; }
}


/* SHIROCON Ver.7.1 shared layout and typography */
:root{--body-color:#1B2838}
body{font-size:16px;color:var(--body-color)}
.brand-symbol.brand-logo{object-fit:cover;border-radius:12px;width:46px;height:46px;display:block}
.hero-intro,.section-lead,.problem-note,.service-descr,.point-text,.process-head p,.timeline-step span,.profile-text,.contact p,.service-details{color:#1B2838!important;font-size:16px!important;line-height:1.95!important}
.hero-intro{max-width:660px}
.service-list .service-item{cursor:pointer}
.service-list .service-item:hover .service-arrow{transform:translate(4px,-3px);color:#1c7872}
.service-arrow{transition:transform .3s,color .3s}
.profile-art{padding:0;overflow:hidden;min-height:400px;background:#f2f4f1}
.profile-photo{width:100%;display:block;object-fit:cover;object-position:center 20%;aspect-ratio:4/4.25;height:auto}
.contact-address{margin:10px 0 0;font-size:16px!important;color:white!important;letter-spacing:.04em}
.contact-disclaimer{font-size:12px;color:#d7e6df}
/* Detail pages */
.detail-hero{background:#f8faf8;padding:100px 0 90px;border-bottom:1px solid #dce8e2}
.detail-hero-inner{max-width:930px}
.detail-kicker{color:var(--teal);font-size:12px;font-weight:800;letter-spacing:.15em;margin:0 0 15px}
.detail-hero h1{font-size:clamp(36px,4.5vw,58px);font-weight:800;line-height:1.5;margin:0 0 20px;color:#153742;letter-spacing:.035em}
.detail-hero .lead{font-size:18px;line-height:2;max-width:780px;margin:0;color:#30444d}
.detail-body{padding:84px 0 104px}
.detail-content{display:grid;grid-template-columns:minmax(0, 1fr) 260px;gap:90px;align-items:start}
.detail-main{min-width:0}
.detail-block{margin:0 0 78px}
.detail-block h2{font-size:clamp(24px,3vw,34px);margin:0 0 20px;line-height:1.5;color:#143b45}
.detail-block h3{font-size:20px;margin:30px 0 9px;color:#1c454b}
.detail-block p,.detail-block li{font-size:16px;line-height:2;color:#1B2838;margin:0 0 13px}
.detail-block ul{margin:12px 0 0;padding:0 0 0 1.5em}
.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:30px}
.detail-tile{border:1px solid #d9e6df;padding:25px;background:#fafcfb}
.detail-tile h3{margin:0 0 8px;font-size:18px}
.detail-tile p{margin:0;font-size:15px;line-height:1.85}
.detail-steps{border-top:1px solid #ccdcd4;margin-top:28px}
.detail-step{display:grid;grid-template-columns:56px 1fr;gap:12px;padding:22px 0;border-bottom:1px solid #ccdcd4}
.detail-step .step-num{font:700 12px Arial,sans-serif;letter-spacing:.12em;color:var(--teal);padding-top:5px}
.detail-step h3{margin:0 0 5px;font-size:18px}
.detail-step p{margin:0}
.detail-aside{position:sticky;top:120px;border:1px solid #d8e6df;background:#f6faf7;padding:26px}
.detail-aside h3{font-size:17px;margin:0 0 13px}
.detail-aside p{font-size:14px;line-height:1.9;margin:0 0 20px;color:#30444d}
.detail-link{font-weight:750;font-size:14px;color:#236f69;border-bottom:1px solid #73a69b;padding-bottom:4px}
.detail-other{border-top:1px solid #d9e7e0;padding-top:22px;margin-top:30px}
.detail-other a{display:block;margin:13px 0;font-size:13px;color:#274c53}
.detail-photo{max-width:330px;width:100%;border:1px solid #dbe7df;object-fit:cover}
.page-breadcrumb{font-size:13px;font-weight:600;color:#43646a;letter-spacing:.02em;margin:0 0 20px}
.page-breadcrumb a{color:#24766d;text-decoration:underline;text-underline-offset:4px}
@media(max-width:1100px){.detail-content{grid-template-columns:1fr;gap:30px}.detail-aside{position:static}.detail-hero{padding:70px 0}}
@media(max-width:650px){.detail-hero{padding:54px 0 55px}.detail-body{padding:56px 0 75px}.detail-grid{grid-template-columns:1fr}.detail-hero h1{font-size:33px}.profile-art{min-height:0}.profile-photo{max-height:520px;object-fit:cover;aspect-ratio:4/4}}

@media (max-width:560px){.hero-intro,.section-lead,.problem-note,.service-descr,.timeline-step span,.profile-text,.detail-block p,.detail-block li{font-size:16px!important;line-height:1.9!important}}
/* Ver.7.1 legibility fix on dark footer/contact: light copy on dark surface */
.contact p:not(.contact-address){color:#d5e4df!important}
.contact .contact-disclaimer{color:#bdd5cf!important;font-size:12px!important}
.contact p.contact-address{color:white!important}
/* Ver.7.1 mobile service navigation: keep arrow with the title, not on its own row */
@media(max-width:800px){
 .service-list .service-item{grid-template-columns:56px minmax(0,1fr) 24px;align-items:center}
 .service-list .service-icon{grid-column:1;grid-row:1 / span 2}
 .service-list .service-title{grid-column:2;grid-row:1}
 .service-list .service-arrow{grid-column:3;grid-row:1;justify-self:end}
 .service-list .service-descr{grid-column:2 / span 2;grid-row:2;padding-top:8px}
}


/* Shirocon Ver.7.2: direct-page navigation, strong visual identities */
:root{--body-readable:#1B2838;--body-color:#1B2838}
.nav{gap:clamp(11px,1.65vw,27px)}
.nav a{font-size:12px}
.nav a.nav-active:not(.nav-contact){color:#176e66;font-weight:850}
.nav a.nav-active:not(.nav-contact)::after{height:3px;bottom:-15px;background:#198b79;transform:scaleX(1)}
.nav a.nav-contact.nav-active{background:#267b71;box-shadow:inset 0 -4px 0 #a2d8c6}
.page-breadcrumb{margin-bottom:34px;line-height:1.8}
.page-breadcrumb a{text-decoration:none;border-bottom:1px solid #8eb8ac}
.page-breadcrumb span[aria-current]{font-weight:800;color:#1b4b51}
.bc-sep{margin:0 9px;color:#91aaa2}
.detail-hero--visual{padding:54px 0 68px;position:relative;overflow:hidden}
.detail-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0, .9fr);align-items:center;gap:60px;min-height:310px}
.detail-hero--visual .detail-hero-inner{min-width:0}
.detail-hero--visual h1{font-size:clamp(33px,3.8vw,51px);line-height:1.55}
.detail-hero--visual .lead{max-width:600px;font-size:17px;line-height:2.0;color:#1B2838}
.detail-visual{background:#eff6f2;overflow:hidden;border-radius:18px;box-shadow:0 18px 50px rgba(18,66,65,.07);aspect-ratio:660/480;min-height:200px}
.detail-visual img{display:block;width:100%;height:100%;object-fit:cover}
.detail-visual .hero-person{object-fit:cover;object-position:50% 22%;background:#ebf1ed}
.detail-hero--visual.sales-tone{background:#f5f9f7}
.detail-hero--visual.field-tone{background:#f4f8f6}
.detail-hero--visual.management-tone{background:#f4f7f9}
.detail-hero--visual.profile-tone{background:#f7f9f5}
.detail-hero--visual.challenge-tone{background:#f5f9f7}
.detail-hero--visual.services-tone{background:#f4f8f5}
.detail-hero--visual.approach-tone{background:#f5f9f7}
.detail-hero--visual.contact-tone{background:#f1f7f4}
.detail-jump{background:#f5f9f7;padding:20px 24px;display:flex;flex-wrap:wrap;gap:12px 20px;margin:0 0 48px;align-items:center}
.detail-jump span{font-weight:800;font-size:13px;color:#23685f;margin-right:6px}
.detail-jump a{color:#1B2838;font-size:14px;font-weight:700;padding:4px 0;border-bottom:1px solid #96b9ad}
.detail-jump a:hover{color:#167568}
.detail-block[id],.roadmap-item[id],.issue-row[id],.hub-section[id]{scroll-margin-top:118px}
.detail-other a{font-size:14px}
.detail-block h3{color:#1f474b}
.hub-section{padding:96px 0 120px}
.hub-title{font-size:clamp(29px,3.4vw,43px);line-height:1.55;letter-spacing:.025em;margin:20px 0 17px;color:#153742}
.hub-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:46px}
.hub-card{background:white;border:1px solid #d8e5de;transition:transform .3s,box-shadow .3s,border-color .3s;overflow:hidden;display:flex;flex-direction:column}
.hub-card:hover{transform:translateY(-5px);border-color:#9ac6b6;box-shadow:0 17px 40px rgba(26,76,69,.1)}
.hub-card-visual{aspect-ratio:660/480;background:#f4f8f5;overflow:hidden}
.hub-card-visual img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.hub-card:hover .hub-card-visual img{transform:scale(1.035)}
.hub-card-body{padding:25px 27px 29px;display:flex;flex-direction:column;flex:1}
.hub-tag{font:700 11px Arial,sans-serif;letter-spacing:.14em;color:#20786b}
.hub-card h3{font-size:22px;line-height:1.5;color:#183942;margin:12px 0}
.hub-card p{font-size:16px;line-height:1.95;margin:0 0 24px;color:#1B2838}
.hub-card-link{margin-top:auto;border-top:1px solid #dbe8e1;padding-top:17px;display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:800;color:#207c71}
.issue-list{margin-top:42px;border-top:1px solid #d9e5e0}
.issue-row{display:grid;grid-template-columns:120px minmax(0,1fr) 190px;gap:34px;align-items:center;padding:34px 10px;border-bottom:1px solid #d9e5e0;transition:background .2s,transform .2s}
.issue-row:hover{background:#f0f7f9;transform:translateX(3px)}
.issue-index{font:700 13px Arial,sans-serif;letter-spacing:.05em;color:#237c71}
.issue-row h3{font-size:21px;margin:0 0 8px;color:#173b45}
.issue-row p{font-size:16px;line-height:1.9;margin:0;color:#1B2838}
.issue-link{justify-self:end;font-size:14px;font-weight:800;color:#1d746d;border-bottom:1px solid #6baba0;padding-bottom:4px;white-space:nowrap}
.roadmap{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:50px}
.roadmap-item{background:#f8fbf8;border:1px solid #d8e6de;border-top:4px solid #4e9f91;padding:29px 22px;min-height:310px;transition:transform .25s,box-shadow .25s}
.roadmap-item:hover{transform:translateY(-5px);box-shadow:0 12px 32px rgba(23,66,71,.08);background:#eef7f9}
.roadmap-num{font:800 33px Arial,sans-serif;color:#2b8579;letter-spacing:-.04em;margin-bottom:36px}
.roadmap-item h3{font-size:22px;margin:0 0 9px;line-height:1.4;color:#123d46}
.roadmap-item strong{font-size:14px;line-height:1.8;display:block;color:#2e756a;margin-bottom:10px}
.roadmap-item p{font-size:15px;line-height:1.85;margin:0;color:#1B2838}
.roadmap-note{font-size:15px;margin:24px 0 0;color:#1B2838}
.contact-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:90px;align-items:start}
.contact-info{margin-top:45px;padding:30px;background:#f2f8f4;border-left:4px solid #277c70;display:flex;align-items:flex-start;flex-direction:column;gap:14px}
.contact-info span{font-size:13px;color:#466269;font-weight:800}
.contact-info strong{font-size:clamp(21px,2.6vw,27px);letter-spacing:.015em;color:#153c45;overflow-wrap:anywhere}
.contact-info .primary-btn{margin-top:14px}
.preview-warning{font-size:13px;line-height:1.8;color:#455961;margin:0}
.consult-card{padding:36px;background:#f7faf8;border:1px solid #dce9e0}
.consult-card h3{margin:0 0 22px;font-size:24px;color:#153c45}
.consult-card ol{margin:0;padding-left:24px}
.consult-card li{font-size:16px;line-height:1.8;padding:12px 0;border-bottom:1px solid #dbe5df;color:#1B2838}
.consult-card p{font-size:14px;line-height:1.9;color:#435b60;margin:22px 0 0}
.section-more{padding:26px 2px 0}
.section-more .text-btn{min-height:40px;color:#236f68;border-bottom:1px solid #82ad9f}
@media(max-width:1100px){.detail-hero-grid{gap:35px}.roadmap{grid-template-columns:repeat(3,1fr)}}
@media(max-width:1020px){.nav{display:none;position:fixed;top:88px;left:0;right:0;background:#f8faf8;padding:26px 22px;flex-direction:column;gap:10px;align-items:stretch;border-bottom:1px solid #d5e5dc;z-index:100;box-shadow:0 14px 24px rgba(26,78,72,.06)}.nav.is-open{display:flex}.nav a{font-size:16px;display:block;padding:11px 14px}.nav a.nav-active:not(.nav-contact){background:#e9f4ee;border-left:4px solid #24857a}.nav a.nav-active:not(.nav-contact)::after{display:none}.nav-contact{width:100%;margin-top:8px}.menu-button{display:block}}
@media(max-width:800px){.detail-hero-grid{grid-template-columns:1fr;gap:20px}.detail-hero--visual{padding:45px 0 55px}.detail-visual{width:100%;max-width:580px}.hub-cards{grid-template-columns:1fr;max-width:620px}.issue-row{grid-template-columns:1fr;gap:10px;padding:27px 13px}.issue-link{justify-self:start;margin-top:5px}.roadmap{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-layout{grid-template-columns:1fr;gap:32px}.hub-section{padding:66px 0 80px}}
@media(max-width:560px){.detail-hero--visual h1{font-size:clamp(30px,8vw,38px)}.page-breadcrumb{font-size:12px;margin-bottom:24px}.detail-jump{display:grid;padding:18px}.roadmap{grid-template-columns:1fr}.roadmap-item{min-height:auto}.roadmap-num{margin-bottom:18px}.hub-card-body{padding:22px}.detail-hero--visual .lead{font-size:16px}}


/* -----------------------------------------------
   SHIROCON VER. 7.3 / NAVIGATION + CHALLENGE PAGE
   ----------------------------------------------- */
:root{--text-deep:#1B2838;--accent:#236f68}
/* Clearly visible, boxed current location. Keep nav width stable when switching pages. */
.header .nav{gap:clamp(4px,.65vw,14px)}
.header .nav a:not(.nav-contact){display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:9px 13px;border:2px solid transparent;border-radius:4px;transition:background .22s,color .22s,border .22s,box-shadow .22s}
.header .nav a:not(.nav-contact):hover{background:#e9f3ef;color:#155d55}
.header .nav a.nav-active:not(.nav-contact){color:#fff!important;background:#225c5c!important;border-color:#225c5c!important;box-shadow:0 3px 0 rgba(20,55,59,.16);font-weight:800}
.header .nav a.nav-active:not(.nav-contact):hover{background:#184f4e!important}
.header .nav a:not(.nav-contact):after,.header .nav a.nav-active:not(.nav-contact):after{display:none!important}
.header .nav a.nav-contact.nav-active{background:#215e5a;outline:2px solid #b8d9cc;outline-offset:2px}
/* Dedicated compact right-hand illustration, not a large stacked poster */
.challenge-hero{padding:42px 0 72px;background:#f4f8f5;border-bottom:1px solid #dce8e0}
.challenge-hero .page-breadcrumb{margin-bottom:40px}
.challenge-hero-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,345px);grid-template-areas:'copy art' 'lead art';grid-template-rows:auto auto;align-items:center;gap:8px clamp(30px,5vw,95px);min-height:300px}
.challenge-hero-copy{grid-area:copy;align-self:end}
.challenge-hero .detail-kicker{margin:0 0 15px;color:#257b70;font-weight:700;letter-spacing:.16em}
.challenge-hero .detail-kicker span{padding:0 7px;color:#a8bcb2}
.challenge-hero h1{margin:0;font-size:clamp(36px,3.7vw,53px);line-height:1.5;letter-spacing:.015em;font-weight:800;color:#183641}
.challenge-hero-lead{grid-area:lead;align-self:start;margin:16px 0 0;font-size:17px;line-height:2;color:#1B2838;letter-spacing:.025em}
.challenge-hero-art{grid-area:art;width:100%;max-width:345px;justify-self:end;align-self:center;border:1px solid #dce9e2;background:#f9fcfa;border-radius:14px;padding:6px;box-shadow:0 12px 30px rgba(31,69,69,.06)}
.challenge-hero-art img{display:block;width:100%;height:auto;aspect-ratio:660/480;object-fit:contain}
.challenge-body{padding:104px 0 116px;background:#fff}
.challenge-intro{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:40px}
.challenge-intro h2{font-size:clamp(30px,3.2vw,45px);line-height:1.6;letter-spacing:.02em;margin:20px 0 0;color:#183b42}
.challenge-intro>p{font-size:16px;line-height:2;color:#1B2838;margin:0 0 5px;max-width:335px}
.concern-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
.concern-card{border:1px solid #dce7df;background:#fff;position:relative;display:flex;flex-direction:column;min-width:0;overflow:hidden;box-shadow:0 7px 30px rgba(31,64,56,.035);transition:transform .25s,box-shadow .25s,border-color .25s}
.concern-card:hover{transform:translateY(-4px);border-color:#94beb0;box-shadow:0 18px 38px rgba(26,67,60,.10)}
.concern-card:before{content:"";height:5px;background:#408e82;position:absolute;top:0;left:0;right:0}
.concern-profit:before{background:#527a9b}.concern-advice:before{background:#b09166}
.concern-card-head{padding:28px 28px 19px;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:181px;background:#f2f8f5}
.concern-profit .concern-card-head{background:#f1f5f8}.concern-advice .concern-card-head{background:#f8f6f1}
.concern-num{font:800 31px/1 Arial,sans-serif;color:#287e77;display:block;letter-spacing:-.01em;margin-bottom:15px}
.concern-profit .concern-num{color:#527a9b}.concern-advice .concern-num{color:#92734f}
.concern-num span{font:700 12px/1.3 'Noto Sans CJK JP','Yu Gothic',sans-serif;color:#52716e;letter-spacing:.03em;margin-left:8px}
.concern-card h3{margin:0;font-size:clamp(21px,1.85vw,25px);font-weight:800;line-height:1.58;letter-spacing:.01em;color:#1B3441}
.concern-icon{height:70px;width:70px;border-radius:50%;background:rgba(255,255,255,.84);color:#287e77;display:grid;place-items:center;flex:none;border:1px solid #d7e5dc}
.concern-icon svg{width:43px;height:43px}.concern-profit .concern-icon{color:#527a9b}.concern-advice .concern-icon{color:#92734f}
.concern-description{padding:21px 28px 0;margin:0;font-size:14px;line-height:1.8;color:#465960;font-weight:700}
.concern-examples{list-style:none;margin:12px 0 20px;padding:0 28px;flex:1}
.concern-examples li{font-size:16px;color:#1B2838;line-height:1.65;border-bottom:1px solid #e4ece7;padding:12px 0 12px 22px;position:relative}
.concern-examples li:last-child{border-bottom:0}
.concern-examples li:before{content:"";position:absolute;top:21px;left:1px;border-radius:50%;width:7px;height:7px;background:#5d9e8f}
.concern-profit .concern-examples li:before{background:#7da3bd}.concern-advice .concern-examples li:before{background:#bba17a}
.concern-cta{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:75px;padding:15px 22px 15px 28px;margin-top:auto;background:#205f60;color:#fff;font-size:15px;font-weight:800;line-height:1.45;transition:background .2s}
.concern-cta:hover{background:#124c4c}
.concern-profit .concern-cta{background:#345e80}.concern-profit .concern-cta:hover{background:#234b6c}
.concern-advice .concern-cta{background:#816d55}.concern-advice .concern-cta:hover{background:#6c5842}
.concern-cta-arrow{display:inline-grid;place-items:center;font-size:21px;flex:0 0 34px;width:34px;height:34px;border:1px solid rgba(255,255,255,.45);border-radius:50%;font-weight:400}
.challenge-bottom-note{margin-top:40px;padding:35px 40px;display:flex;justify-content:space-between;align-items:center;gap:30px;background:#eef5f1;border-left:4px solid #3b8d7a}
.challenge-bottom-note strong{font-size:22px;color:#17414b}.challenge-bottom-note p{font-size:16px;line-height:1.9;color:#1B2838;margin:8px 0 0}
.outlined-link{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;padding:14px 21px;border:2px solid #236c64;min-height:54px;white-space:nowrap;color:#215f59;font-weight:800;font-size:15px;background:#fff;transition:background .2s,color .2s}
.outlined-link:hover{background:#236c64;color:#fff}
#consultations,#consultation{scroll-margin-top:118px}
@media(max-width:1080px){.concern-grid{grid-template-columns:1fr;gap:21px;max-width:780px;margin:auto}.concern-card{display:grid;grid-template-columns:1fr 1.25fr;grid-template-rows:auto auto;align-items:stretch}.concern-card-head{grid-row:1/3;grid-column:1;align-items:flex-start;flex-direction:column;padding:35px 30px;justify-content:center}.concern-card-head h3{font-size:25px}.concern-description{grid-column:2;grid-row:1}.concern-examples{grid-column:2;grid-row:2}.concern-cta{grid-column:1/-1;grid-row:3}.challenge-intro{align-items:flex-start}}
@media(max-width:1020px){.header .nav{gap:8px}.header .nav a:not(.nav-contact){width:100%;justify-content:flex-start;min-height:50px;font-size:16px}.header .nav a.nav-active:not(.nav-contact){border-left:5px solid #7cbbab}.header .nav a.nav-contact{width:100%}}
@media(max-width:800px){.challenge-hero{padding:34px 0 50px}.challenge-hero .page-breadcrumb{margin-bottom:27px}.challenge-hero-layout{grid-template-columns:minmax(0,1fr) minmax(150px,30%);gap:4px 25px}.challenge-hero h1{font-size:clamp(30px,4.6vw,40px)}.challenge-hero-art{max-width:230px}.challenge-body{padding:70px 0 88px}.challenge-intro{display:block}.challenge-intro>p{margin-top:22px}}
@media(max-width:570px){.challenge-hero-layout{grid-template-columns:minmax(0,1fr) 108px;grid-template-areas:'copy art' 'lead lead';gap:12px 7px;align-items:center}.challenge-hero h1{font-size:clamp(23px,6.0vw,29px);line-height:1.55}.challenge-hero .detail-kicker{font-size:10px;margin-bottom:10px;letter-spacing:.08em}.challenge-hero-art{padding:2px;border-radius:8px;max-width:108px;box-shadow:0 7px 18px rgba(31,69,69,.04)}.challenge-hero-lead{margin:8px 0 0;font-size:16px;line-height:1.9}.desktop-only{display:none}.challenge-intro h2{font-size:29px}.challenge-intro>p{font-size:15px}.concern-card{display:flex;flex-direction:column}.concern-card-head{min-height:160px;flex-direction:row;align-items:center;justify-content:space-between;padding:25px}.concern-card-head h3{font-size:24px}.concern-icon{width:65px;height:65px}.concern-description{padding:19px 23px 0}.concern-examples{padding:0 23px;margin:8px 0 19px}.concern-examples li{font-size:16px}.concern-cta{padding:15px 23px}.challenge-bottom-note{display:block;padding:27px 24px}.challenge-bottom-note .outlined-link{margin-top:21px;width:100%}}
@media(prefers-reduced-motion:reduce){.concern-card,.concern-cta,.outlined-link{transition:none}}
