/* 料金ページ（src/pages/price.html）専用。相談CTA（.t-contact）・ページ先頭ボタン（.t-pagetop）・見出しラベル（.t-label / .t-h2）は top.css を共用し、
   ここでは料金ページだけの値を指定する。値は現行 STUDIO 版（service.remodela.jp/price）を 1440/1280/1024/768/390/375px で測って合わせた。
   ブレークポイントは現行と同じ 1280 / 840 / 540 / 320px。 */
.p-price__hero{padding:60px 100px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fff}
.p-price__label{width:1100px;max-width:100%}
.p-price .p-price__title{margin-bottom:20px !important}
.p-price__lead{text-wrap:wrap;color:#333;font-size:24px;font-weight:400;line-height:1.4;text-align:center}
/* 現行はスマホ幅で「いた／します。」「くださ／い。」と語の途中で折り返すため、文節の切れ目だけで折り返す */
/* shared.css の p{text-wrap:pretty} と inline-block の span・<br> が重なると iPhone の Safari（WebKit）がスマホ幅で落ちるので、ここでは pretty を使わない */
.p-price__lead span{display:inline-block}
/* ページ先頭ボタン: 料金ページの現行は右下 40px（トップは 60px）、矢印は 32px */
.page-price .t-pagetop{right:40px;bottom:40px}
.page-price .t-pagetop svg{width:32px;height:32px}

@media (max-width:1280px){
  .p-price__hero{padding:60px 15px}
}
@media (max-width:840px){
  .p-price__hero{padding:50px 40px}
  .page-price .t-pagetop{right:30px;bottom:30px}
  /* 現行の相談CTAは 541〜840px でもボタン列が幅 90%（top.css は 100% にしているため、料金ページでは現行に合わせる） */
  .p-price .t-contact__pair{width:90%}
}
@media (max-width:540px){
  /* 現行はヘッダーが 60px になっても本文の開始位置が 70px のまま */
  .p-price{padding-top:10px}
  .p-price .t-contact__pair{width:100%}
  .p-price__hero{padding:40px 20px}
  .p-price .p-price__title{margin-bottom:10px !important}
  .page-price .t-pagetop{right:15px}
  .page-price .t-pagetop svg{width:24px;height:24px}
}
@media (max-width:320px){
  .p-price__hero{padding:40px 15px}
}