/* 取引の流れ（page-process-flow.php）— 手順の行を 60° の斜面に沿ってずらす */
.rn-process__steps { position: relative; margin-top: 44px; border-bottom: 1px solid var(--rn-line-light); }
.rn-process__steps::before { content: ""; position: absolute; left: -18px; top: 0; width: 1.5px; height: 100%; background: var(--rn-gold); transform-origin: top left; transform: skewX(30deg); }
.rn-process__step { --row: 104px; display: flex; align-items: center; gap: 30px; min-height: var(--row); margin-left: calc(var(--i) * var(--row) * 0.57735); border-top: 1px solid var(--rn-line-light); }
.rn-process__num { width: 64px; flex-shrink: 0; font-size: 48px; font-weight: 500; line-height: 1; }
.rn-process__icon { display: flex; align-items: center; justify-content: center; width: 72px; height: 72px; flex-shrink: 0; background: var(--rn-paper); color: var(--rn-ink); }
.rn-process__name { width: 250px; flex-shrink: 0; }
.rn-process__name span { display: block; font-size: 10.5px; color: rgba(17, 18, 20, 0.6); }
.rn-process__name h3 { font-size: 23px; line-height: 1.4; }
.rn-process__desc { flex: 1; min-width: 0; font-size: 14.5px; line-height: 1.9; color: var(--rn-sub-light); }
.rn-process__support { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 36px; margin-top: 44px; }
.rn-process__support li { padding-top: 26px; border-top: 1px solid var(--rn-gold); }
.rn-process__support span { display: block; font-size: 10.5px; color: var(--rn-gold-on-dark); }
.rn-process__support h3 { margin-top: 6px; font-size: 21px; color: #fff; }
.rn-process__support p { margin-top: 8px; font-size: 14px; line-height: 1.9; color: var(--rn-sub-dark); }
.rn-process__lead { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 44px; }
.rn-process__card { --rn-tombo: var(--rn-ink); padding: 34px 36px 36px; background: #fff; }
.rn-process__card > span { display: block; font-size: 11px; color: rgba(17, 18, 20, 0.6); }
.rn-process__card h3 { margin-top: 4px; font-size: 22px; }
.rn-process__value { margin-top: 18px; font-size: 34px; line-height: 1.3; }
.rn-process__note { margin-top: 6px; font-size: 13.5px; color: var(--rn-sub-light); }

@media (max-width: 1100px) {
  .rn-process__step { margin-left: calc(var(--i) * 28px); }
  .rn-process__steps::before { display: none; }
  .rn-process__support { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .rn-process__step { flex-wrap: wrap; gap: 10px 16px; margin-left: calc(var(--i) * 10px); padding: 20px 0; }
  .rn-process__num { width: auto; font-size: 34px; }
  .rn-process__icon { width: 56px; height: 56px; }
  .rn-process__icon svg { width: 40px; height: 40px; }
  .rn-process__name { width: auto; flex: 1; }
  .rn-process__name h3 { font-size: 19px; }
  .rn-process__desc { flex-basis: 100%; font-size: 13.5px; }
  .rn-process__support { grid-template-columns: 1fr; gap: 24px; }
  .rn-process__lead { grid-template-columns: 1fr; }
  .rn-process__card { padding: 26px 24px; }
  .rn-process__value { font-size: 28px; }
}