/* ===================================================================
 * recruit-detail.css — 求人詳細(block/single/recruit.php)
 *
 * 求人の本文: ページヒーローのクリームから地を続け、読み幅 860px の列にタイトル → ひとことの白い箱 → 募集要項の表。
 * 応募・お問い合わせ: クリームの枠線の白い箱。PC は左 = 連絡先 / 右 = ボタンの2列、SP は1列。
 * 表示方法・揃え・幅・在庫と同じ値の余白はマークアップのクラスで指定している。
 * =================================================================== */

/* --- 求人の本文 ---------------------------------------------------- */

.job-article {
  padding-block: 2.5rem var(--space-4xl);
}

.job-article__title {
  font-size: 1.75rem;
}

.job-article__lead {
  padding: var(--space-lg) 2.5rem;
}

/* ひとことはエディタの本文。要素の間はお知らせの記事と同じ 16px、見出しの前だけ広げる */
.job-article__lead > * {
  margin-block: 0;
}

.job-article__lead > * + * {
  margin-top: var(--space-md);
}

.job-article__lead > :first-child {
  margin-top: 0;
}

.job-article__table {
  margin-top: 2.5rem;
}

.job-article__caption {
  font-size: 1.25rem;
}

/* --- 応募・お問い合わせ ------------------------------------------- */

/* 上の余白は .py-project-section のまま。下は戻るボタンへ続けるため詰める */
.job-apply {
  padding-bottom: 2.5rem;
}

.job-apply__box {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2.5rem;
  padding: 2.5rem;
  border: 2px solid var(--project-color-bg-subtle);
}

.job-apply__title {
  font-size: 1.5rem;
}

.job-apply__tel {
  font-size: 1.875rem;
  line-height: 1.3;
}

.job-apply__tel a {
  text-decoration: none;
}

.job-apply__tel a:hover {
  text-decoration: underline;
}

.job-apply__small {
  font-size: 0.9375rem;
}

@media (max-width: 767.98px) {
  .job-article {
    padding-block: var(--space-lg) 2.5rem;
  }

  .job-article__title {
    font-size: 1.375rem;
  }

  .job-article__lead {
    padding: var(--space-lg);
  }

  .job-article__caption {
    font-size: var(--fs-lg);
  }

  .job-apply__box {
    grid-template-columns: minmax(0, 1fr);
    padding: var(--space-lg);
  }

  .job-apply__title {
    font-size: 1.25rem;
  }

  .job-apply__tel {
    font-size: 1.625rem;
  }

  /* タップ領域を 44px 以上にする */
  .job-apply__tel a {
    display: inline-block;
    padding-block: var(--space-sm);
  }
}
