/* =========================================================
   flow.html — ご依頼の流れ
   ========================================================= */
.flow-step { margin-top: 95px; }
.flow-step .body-text { margin-top: 28px; }
.flow-step .body-text + .body-text { margin-top: 12px; }

/* step.1 の CTA ボタン群 */
.flow-btns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 60px;
  margin-top: 44px;
}
.flow-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  height: 46px;
  color: #fff;
  font-family: var(--serif);
  font-weight: 600;
  font-size: 19px;
  letter-spacing: .06em;
  transition: opacity .25s;
}
.flow-btn:hover { opacity: .85; }
.flow-btn svg { width: 20px; height: 20px; fill: #fff; flex: none; }
.flow-btn--tel { background: var(--teal); }
.flow-btn--mail { background: var(--gold); }
.flow-btn--line { background: var(--green); }

/* 米注記ボックス */
.note-box {
  margin-top: 44px;
  background: var(--cream);
  border: 1px solid var(--gold);
  padding: 26px 28px;
  font-size: 15px;
  line-height: 1.9;
}
.note-box__item + .note-box__item { margin-top: 22px; }
.note-box__item b { font-weight: 700; }

/* SP カンプのみの項目 */
.note-box__item--sp { display: none; }

/* 締めの赤字 */
.flow-close {
  margin-top: 95px;
  color: var(--red);
  font-weight: 700;
  font-size: 16px;
  line-height: 2;
}

@media (max-width: 768px) {
  .flow-step { margin-top: 56px; }
  .flow-btns { grid-template-columns: 1fr; gap: 12px; margin-top: 28px; }
  .flow-btn { font-size: 17px; }
  .note-box { margin-top: 28px; padding: 20px 16px; font-size: 14px; }
  .note-box__item + .note-box__item { margin-top: 16px; }
  .note-box__item--sp { display: block; }
  .flow-close { margin-top: 56px; font-size: 15px; }
}