@charset "utf-8";
/* =========================================================
   /partner/ 専用のスタイル
   ---------------------------------------------------------
   共有の style.css は触らない。このページだけで使う分を足す。
   トークン（--navy など）は style.css の :root を引き継ぐ。
   ========================================================= */

/* ---------- ページ冒頭 ---------- */
.phero{
  padding:calc(var(--header-h) + clamp(46px,7vw,86px)) 0 clamp(50px,7vw,80px);
  background:var(--paper-2);border-bottom:1px solid var(--line);
}
.phero__inner{width:min(100% - var(--gut)*2,900px);margin-inline:auto}
.phero__label{
  font-family:var(--en);font-size:12px;letter-spacing:.28em;
  color:var(--accent);margin-bottom:clamp(18px,2.4vw,26px);
}
.phero__title{
  font-family:var(--serif);font-weight:600;
  font-size:clamp(27px,4.6vw,46px);line-height:1.55;letter-spacing:.07em;
}
.phero__sub{
  margin-top:1.3em;font-size:clamp(15px,1.8vw,17px);
  line-height:2.15;color:var(--navy-70);
}
.phero__pledge{
  margin-top:clamp(26px,3.4vw,38px);padding:clamp(18px,2.4vw,24px) clamp(20px,2.8vw,30px);
  background:var(--accent-soft);border-left:3px solid var(--accent);border-radius:2px;
  font-family:var(--serif);font-weight:500;
  font-size:clamp(16px,2.1vw,20px);line-height:1.95;letter-spacing:.07em;
}
.phero__actions{
  margin-top:clamp(28px,3.6vw,40px);
  display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center;
}
.phero__back{font-size:13.5px;color:var(--navy-45);border-bottom:1px solid var(--navy-12)}
.phero__back:hover{color:var(--accent)}

/* ---------- 「こんなとき」＝3列に（style.css は4列） ---------- */
.field__grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}

/* ---------- ご依頼から精算までの流れ（縦並び） ---------- */
.pflow{display:grid;gap:0;counter-reset:pf}
.pflow li{
  display:grid;grid-template-columns:auto 1fr;gap:0 clamp(18px,3vw,34px);
  align-items:start;padding:clamp(22px,2.8vw,30px) 0;border-bottom:1px solid var(--line);
}
.pflow li:first-child{border-top:1px solid var(--line)}
.pflow__num{
  grid-row:1/span 2;font-family:var(--en);font-weight:300;
  font-size:clamp(22px,3vw,32px);line-height:1.2;color:var(--accent);
}
.pflow h3{
  grid-column:2;font-family:var(--serif);font-weight:600;
  font-size:clamp(16px,2vw,19px);letter-spacing:.07em;line-height:1.8;
}
.pflow p{grid-column:2;margin-top:.6em;font-size:14.5px;line-height:2.15;color:var(--navy-70)}
.pflow__who{
  display:inline-block;margin-left:.8em;padding:.15em .9em;border-radius:999px;
  background:var(--paper-3);color:var(--navy-70);
  font-family:var(--sans);font-size:11.5px;font-weight:400;letter-spacing:.12em;
  vertical-align:.18em;white-space:nowrap;
}

/* ---------- 診断士の先生へ（囲み） ---------- */
.pbox{
  margin-top:clamp(52px,7vw,86px);
  padding:clamp(28px,3.6vw,44px) clamp(24px,3.4vw,46px);
  background:var(--paper-2);border:1px solid var(--line);border-radius:2px;
}
.pbox h3{
  font-family:var(--serif);font-weight:600;
  font-size:clamp(17px,2.1vw,21px);letter-spacing:.09em;line-height:1.75;
}
.pbox p{margin-top:1.1em;font-size:14.5px;line-height:2.2;color:var(--navy-70)}
.pbox ul{margin-top:1.4em;display:grid;gap:.7em}
.pbox li{position:relative;padding-left:1.3em;font-size:14.5px;line-height:2.05}
.pbox li::before{
  content:"";position:absolute;left:.1em;top:.92em;
  width:6px;height:1px;background:var(--accent);
}

/* ---------- 費用のおぎない ---------- */
.pfee__note{
  margin-top:clamp(26px,3.2vw,36px);font-size:14px;line-height:2.2;color:var(--navy-70);
}
.pfee__note b{color:var(--navy)}

/* ---------- 根拠リンク ---------- */
.pcite{margin-top:1.1em;font-size:13px;line-height:2;color:var(--navy-45)}
.pcite a{border-bottom:1px solid var(--navy-12)}
.pcite a:hover{color:var(--accent)}

@media (max-width:1080px){
  .field__grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .field__grid--3{grid-template-columns:1fr}
  .pflow li{grid-template-columns:1fr;gap:.4em}
  .pflow__num{grid-row:auto}
  .pflow h3,.pflow p{grid-column:1}
  .pflow__who{margin-left:0;margin-top:.5em}
}