/**
 * business.css — XiADEN 法人・施設向けページCSS
 * 対象テンプレート: page-business.php
 */

/* Business Hero */
.s-biz-hero { background:var(--n); min-height:440px; position:relative; overflow:hidden; }
.biz-hero-inner {
  max-width:var(--max-w); margin:0 auto; padding:0 var(--sp48);
  min-height:440px; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:var(--sp48);
  position:relative; z-index:2;
}
.biz-hero-content { padding:var(--sp64) 0; }
.biz-hero-eyebrow { display:block; font-size:var(--f-xs); font-weight:700; letter-spacing:.18em; color:rgba(255,255,255,.56); margin-bottom:var(--sp12); }
.biz-hero-h1 { font-size:clamp(24px,3.5vw,38px); font-weight:900; color:var(--w); line-height:1.3; margin-bottom:var(--sp16); }
.biz-hero-desc { font-size:var(--f-body); color:rgba(255,255,255,.72); line-height:1.85; margin-bottom:var(--sp32); }
.biz-hero-btns { display:flex; gap:var(--sp12); flex-wrap:wrap; }
.biz-hero-btns .btn-outline { border-color:rgba(255,255,255,.4); color:rgba(255,255,255,.88); }
.biz-hero-btns .btn-outline:hover { background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.6); color:var(--w); }
.biz-hero-visual { position:relative; height:300px; border-radius:var(--r4); overflow:hidden; }
.biz-hero-visual img { width:100%; height:100%; object-fit:cover; display:block; }
.biz-hero-visual-overlay { position:absolute; inset:0; background:linear-gradient(135deg,rgba(29,58,90,.2) 0%,transparent 60%); }

/* Cases */
.s-biz-cases { background:var(--bs); border-top:1px solid var(--div); }
.biz-cases-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp16); }
.biz-case-card {
  background:var(--w); border:1px solid var(--bm); border-radius:var(--r2);
  padding:var(--sp20) var(--sp24); display:flex; align-items:flex-start; gap:var(--sp12);
  transition:box-shadow .18s, transform .18s;
}
.biz-case-card:hover { box-shadow:var(--s2); transform:translateY(-2px); }
.biz-case-icon {
  width:40px; height:40px; background:var(--b); border:1px solid var(--bm);
  border-radius:var(--r2); display:flex; align-items:center; justify-content:center;
  color:var(--n); flex-shrink:0;
}
.biz-case-txt { font-size:14px; color:var(--txm); line-height:1.65; }

/* Services grid */
.s-biz-svc { background:var(--w); border-top:1px solid var(--div); }
.biz-svc-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:var(--sp12); }
.biz-svc-item {
  background:var(--bs); border:1px solid var(--bm); border-radius:var(--r2);
  padding:var(--sp20) var(--sp16); display:flex; flex-direction:column; align-items:center; gap:var(--sp8);
  text-align:center; transition:box-shadow .18s, transform .18s;
}
.biz-svc-item:hover { box-shadow:var(--s2); transform:translateY(-2px); }
.biz-svc-icon {
  width:40px; height:40px; background:var(--w); border:1px solid var(--bm);
  border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--n);
}
.biz-svc-name { font-size:13px; font-weight:700; color:var(--n); line-height:1.4; }
.biz-svc-note { font-size:11px; color:var(--txl); line-height:1.5; }

/* Difference */
.s-biz-diff { background:var(--bs); border-top:1px solid var(--div); }
.biz-diff-layout { display:grid; grid-template-columns:1fr 1fr; gap:var(--sp48); align-items:center; }
.biz-diff-photo { height:400px; border-radius:var(--r4); overflow:hidden; }
.biz-diff-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.biz-diff-points { display:flex; flex-direction:column; gap:var(--sp24); }
.biz-diff-point { display:flex; align-items:flex-start; gap:var(--sp16); }
.biz-diff-num {
  font-size:28px; font-weight:900; color:var(--bm); line-height:1;
  flex-shrink:0; width:48px;
}
.biz-diff-name { font-size:16px; font-weight:700; color:var(--n); margin-bottom:var(--sp8); }
.biz-diff-desc { font-size:var(--f-sm); color:var(--txm); line-height:1.72; }

/* Flow */
.s-biz-flow { background:var(--w); border-top:1px solid var(--div); }
.biz-flow-list { display:flex; flex-direction:column; gap:0; max-width:760px; margin:0 auto; }
.biz-flow-item {
  display:flex; align-items:flex-start; gap:var(--sp24);
  padding:var(--sp24) 0; border-bottom:1px solid var(--div);
  position:relative;
}
.biz-flow-item:last-child { border-bottom:none; }
.biz-flow-step-num {
  font-size:28px; font-weight:900; color:var(--or); line-height:1;
  flex-shrink:0; width:60px;
}
.biz-flow-step-title { font-size:16px; font-weight:700; color:var(--n); margin-bottom:var(--sp8); }
.biz-flow-step-desc  { font-size:var(--f-sm); color:var(--txm); line-height:1.78; }

/* Ongoing */
.s-biz-ongoing { background:var(--bs); border-top:1px solid var(--div); }
.biz-ongoing-card {
  background:linear-gradient(135deg,var(--n) 0%,var(--nm) 100%);
  border-radius:var(--r4); padding:var(--sp64) var(--sp64);
  text-align:center; display:flex; flex-direction:column; align-items:center; gap:var(--sp16);
}
.biz-ongoing-badge {
  display:inline-block; background:rgba(232,120,12,.2); border:1px solid rgba(232,120,12,.4);
  color:var(--or); font-size:10px; font-weight:700; letter-spacing:.16em;
  padding:5px 18px; border-radius:var(--rf);
}
.biz-ongoing-h2   { font-size:clamp(22px,3vw,30px); font-weight:900; color:var(--w); line-height:1.38; }
.biz-ongoing-desc { font-size:var(--f-body); color:rgba(255,255,255,.72); line-height:1.85; max-width:560px; }

/* Notes */
.s-biz-notes { background:var(--w); border-top:1px solid var(--div); }
.biz-notes-card {
  background:var(--bs); border:1px solid var(--bm); border-left:4px solid var(--bm);
  border-radius:var(--r2); padding:var(--sp24) var(--sp32);
  max-width:760px; margin:0 auto;
}
.biz-notes-title { font-size:14px; font-weight:700; color:var(--n); margin-bottom:var(--sp16); }
.biz-notes-list { display:flex; flex-direction:column; gap:var(--sp8); }
.biz-notes-list li { font-size:var(--f-sm); color:var(--txm); line-height:1.75; padding-left:1.2em; position:relative; }
.biz-notes-list li::before { content:'・'; position:absolute; left:0; }

/* Responsive */
@media (max-width:1024px) {
  .biz-cases-grid { grid-template-columns:repeat(2,1fr); }
  .biz-svc-grid   { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:768px) {
  .biz-hero-inner   { grid-template-columns:1fr; padding:0 20px; }
  .biz-hero-visual  { height:200px; }
  .biz-cases-grid   { grid-template-columns:1fr 1fr; }
  .biz-svc-grid     { grid-template-columns:repeat(2,1fr); }
  .biz-diff-layout  { grid-template-columns:1fr; }
  .biz-diff-photo   { height:220px; }
  .biz-ongoing-card { padding:var(--sp48) var(--sp24); }
}
@media (max-width:480px) {
  .biz-cases-grid { grid-template-columns:1fr; }
}