@charset "UTF-8";
/* ==========================================================================
 * hire.css — ハイヤーサービス（hire.php）固有スタイル
 * ========================================================================== */

/* ============ INTRO ============ */
.hr-intro{ background:#fefefe; padding:64px 24px 72px; }
.hr-intro__inner{ max-width:1080px; margin:0 auto; display:grid; grid-template-columns:1.1fr .9fr; gap:52px; align-items:center; }
.hr-intro__pill{ display:inline-block; background:var(--mtx-gold-grad); color:#fff; font-family:"Zen Kaku Gothic New",sans-serif; font-weight:900; font-size:16px; padding:10px 26px; border-radius:30px; margin-bottom:22px; box-shadow:0 6px 16px rgba(160,128,40,.28); }
.hr-intro__title{ font-family:"Zen Kaku Gothic New",sans-serif; font-weight:900; font-size:28px; line-height:1.5; color:var(--mtx-blue); margin:0 0 18px; }
.hr-intro__text{ font-size:16px; line-height:2; color:#3a3f5a; margin:0 0 30px; }
.hr-intro__btns{ display:flex; gap:14px; flex-wrap:wrap; }
.hr-intro__btns--2col{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.hr-intro__btns--2col .mtx-btn,
.hr-intro__btns--2col .hr-intro__btn-tel{ width:100%; }
.hr-intro__img{ position:relative; aspect-ratio:4/3; border-radius:20px; overflow:hidden; box-shadow:0 14px 34px rgba(19,26,134,.14); background:#eef1f5; }
.hr-intro__img img{ width:100%; height:100%; object-fit:cover; }
@media(max-width:860px){ .hr-intro__inner{ grid-template-columns:1fr; gap:30px; } }
.hr-intro__btn-tel{ display:inline-flex; align-items:center; gap:9px; background:#fff; border:2px solid rgba(19,26,134,.16); color:var(--mtx-blue); font-family:"Zen Kaku Gothic New",sans-serif; font-weight:700; font-size:16px; padding:14px 24px; border-radius:14px; text-decoration:none; transition:border-color .25s ease; }
.hr-intro__btn-tel:hover{ border-color:var(--mtx-gold); }

/* ============ VALUE ============ */
.hr-value{ background:#f4f5f7; padding:88px 24px; }
.hr-value__inner{ max-width:1120px; margin:0 auto; }
.hr-value__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; align-items:start; }
.hr-value__card{ position:relative; background:#fff; border:1px solid rgba(19,26,134,.08); border-radius:20px; padding:44px 28px 34px; box-shadow:0 8px 22px rgba(19,26,134,.06); text-align:center; margin-top:28px; }
.hr-value__num{ position:absolute; top:-28px; left:50%; transform:translateX(-50%); display:flex; align-items:center; justify-content:center; width:64px; height:64px; border-radius:50%; background:linear-gradient(140deg,#D9C05F,#C6A63C); box-shadow:0 8px 18px rgba(160,128,40,.3); border:4px solid #f4f5f7; font-family:"Barlow",sans-serif; font-weight:800; font-size:26px; color:#fff; line-height:1; margin:0; }
.hr-value__ctitle{ font-family:"Zen Kaku Gothic New",sans-serif; font-weight:900; font-size:19px; color:var(--mtx-blue); margin:20px 0 12px; line-height:1.6; }
.hr-value__ctext{ font-size:14px; line-height:1.9; color:#4a4f66; margin:0; text-align:left; }
@media(max-width:860px){ .hr-value__grid{ grid-template-columns:1fr; gap:44px; } }

/* ============ 選ばれるシーン ============ */
.hr-scene{ background:#fefefe; padding:88px 24px; }
.hr-scene__inner{ max-width:1120px; margin:0 auto; }
.hr-scene__grid{ display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.hr-scene__card{ border-radius:22px; padding:36px 34px; box-shadow:0 12px 30px rgba(15,21,96,.2); }
.hr-scene__card--dark{ background:#002E78; }
.hr-scene__card--light{ background:#f4f5f7; border:2px solid var(--mtx-blue); box-shadow:0 8px 22px rgba(19,26,134,.06); }
.hr-scene__badge{ display:inline-flex; align-items:center; gap:10px; padding:9px 20px; border-radius:30px; margin-bottom:26px; }
.hr-scene__badge--dark{ background:rgba(255,255,255,.1); border:1px solid rgba(198,166,60,.4); color:#fff; }
.hr-scene__badge--gold{ background:var(--mtx-gold-grad); color:#fff; }
.hr-scene__car{ font-family:"Zen Kaku Gothic New",sans-serif; font-weight:900; font-size:16px; }
.hr-scene__use{ font-size:12.5px; color:#F2DE8C; }
.hr-scene__use--white{ color:#fff; }
.hr-scene__items{ display:flex; flex-direction:column; gap:22px; }
.hr-scene__item{ display:flex; gap:14px; align-items:flex-start; }
.hr-scene__check{ flex:none; width:34px; height:34px; border-radius:10px; display:flex; align-items:center; justify-content:center; color:#fff; font-size:15px; }
.hr-scene__check--gold{ background:linear-gradient(140deg,#D9C05F,#C6A63C); }
.hr-scene__check--blue{ background:var(--mtx-blue); }
.hr-scene__ititle{ font-family:"Zen Kaku Gothic New",sans-serif; font-weight:900; font-size:16px; color:#fff; margin:0 0 7px; line-height:1.5; }
.hr-scene__ititle--blue{ color:var(--mtx-blue); }
.hr-scene__itext{ font-size:13px; line-height:1.85; color:rgba(255,255,255,.82); margin:0; }
.hr-scene__itext--dark{ color:#4a4f66; }
@media(max-width:860px){ .hr-scene__grid{ grid-template-columns:1fr; } }

/* ============ 車両スペック ============ */
.hr-spec{ background:#fefefe; padding:88px 24px; }
.hr-spec__inner{ max-width:1000px; margin:0 auto; }
.hr-spec__grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.hr-spec__card{ border-radius:20px; overflow:hidden; box-shadow:0 10px 28px rgba(19,26,134,.1); border:1px solid rgba(19,26,134,.08); background:#fff; }
.hr-spec__img{ position:relative; height:255px; background:#eef1f5; }
.hr-spec__img img{ width:100%; height:100%; object-fit:cover; }
.hr-spec__body{ padding:26px 28px; }
.hr-spec__name{ display:flex; align-items:baseline; gap:10px; margin-bottom:12px; flex-wrap:wrap; }
.hr-spec__name h3{ font-family:"Zen Kaku Gothic New",sans-serif; font-weight:900; font-size:20px; color:var(--mtx-blue); margin:0; }
.hr-spec__name span{ font-family:"Barlow",sans-serif; font-weight:700; font-size:14px; color:var(--mtx-gold-text); }
.hr-spec__text{ font-size:13.5px; line-height:1.9; color:#4a4f66; margin:0; }
@media(max-width:860px){ .hr-spec__grid{ grid-template-columns:1fr; } }

/* ============ FLOW ============ */
.hr-flow{ background:#f4f5f7; padding:88px 24px; }
.hr-flow__inner{ max-width:1080px; margin:0 auto; }
.hr-flow__cta{ text-align:center; margin-top:44px; }

/* ============ スマホ文字サイズ調整 ============ */
@media(max-width:640px){
  .hr-intro__title{ font-size:22px; }
  .hr-intro__text{ font-size:15px; }
  .hr-intro__pill{ font-size:14px; padding:8px 20px; }
  .hr-value__ctitle{ font-size:17px; }
  .hr-value__ctext{ font-size:13.5px; }
  .hr-scene__card{ padding:28px 22px; }
  .hr-scene__badge{ flex-wrap:wrap; gap:2px 8px; padding:8px 16px; }
  .hr-scene__ititle{ font-size:15px; }
  .hr-scene__car{ font-size:14px; }
  .hr-scene__use{ font-size:11.5px; }
  .hr-spec__name h3{ font-size:18px; }
  .hr-spec__text{ font-size:13.5px; }
}