/* ------------------------------------------------------------------
   Webで書ける履歴書（/recruit-resume/）の紙面
   紙面は実寸（mm）で組み、画面では assets/resume.js が枠の幅に合わせて縮小する。
   PDF は html2canvas で紙面を画像にして jsPDF で A4 に貼る。印刷は @media print で紙面だけを出す。
   様式は厚生労働省の履歴書様式例（令和3年）に合わせる（性別は任意記載、通勤時間・扶養家族・配偶者の欄は無し）
------------------------------------------------------------------ */

.rs-viewport { position: relative; overflow: hidden; }
.rs-stack { transform-origin: top left; }
.rs-stack > .rs-page + .rs-page { margin-top: 8mm; }

.rs-page {
  position: relative;
  box-sizing: border-box;
  width: 210mm;
  height: 297mm;
  padding: 14mm 14mm 12mm;
  background: #fff;
  color: #111;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 3.4mm;
  line-height: 1.4;
  /* サイト全体の字詰め（palt）は外す。html2canvas が字詰めした文字の幅を測り違え、文字が重なるため */
  font-feature-settings: normal;
  letter-spacing: 0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}
.rs-page * { box-sizing: border-box; }

/* 表（罫線は 0.25mm） */
.rs-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.rs-table td, .rs-table th {
  border: 0.25mm solid #111;
  padding: 0 2.2mm;
  vertical-align: middle;
  font-weight: 400;
  overflow: hidden;
}
.rs-table th { height: 8.2mm; font-size: 3mm; line-height: 1; text-align: center; overflow: visible; }
.rs-label { font-size: 2.6mm; color: #333; }
.rs-kana { height: 7mm; font-size: 2.9mm; border-bottom-style: dashed !important; }
.rs-name { font-size: 7mm; letter-spacing: 0.08em; }
.rs-addr { height: 15mm; font-size: 3.6mm; }
.rs-sub { height: 7.5mm; font-size: 3mm; }
.rs-line td { height: 8.2mm; font-size: 3.4mm; line-height: 1.2; white-space: nowrap; text-overflow: ellipsis; }
.rs-line td.rs-y, .rs-line td.rs-m { text-align: center; padding: 0 0.5mm; }
.rs-center { text-align: center; }
.rs-right { text-align: right; }

/* 1ページ目の上部（タイトル・日付、氏名の欄と写真） */
.rs-head { display: flex; align-items: baseline; height: 14mm; }
.rs-title { font-size: 8mm; letter-spacing: 0.6em; font-weight: 700; }
.rs-date { font-size: 3.2mm; margin-left: auto; margin-right: 34mm; }
.rs-top { display: flex; align-items: flex-start; gap: 4mm; }
.rs-top .rs-table { flex: 1; }
.rs-name { height: 24mm; }
.rs-birth { height: 9mm; font-size: 3.2mm; }
.rs-photo {
  flex: none;
  width: 30mm;
  height: 40mm;
  border: 0.25mm dashed #555;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 2.4mm;
  line-height: 1.6;
  color: #555;
  overflow: hidden;
}
.rs-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rs-photo.has-photo { border-style: solid; border-color: #111; }

/* 自由記入の枠 */
.rs-box { border: 0.25mm solid #111; margin-top: 5mm; }
.rs-box-label { border-bottom: 0.25mm solid #111; padding: 1.4mm 2.2mm; font-size: 2.8mm; }
.rs-box-body { padding: 2.2mm; white-space: pre-wrap; word-break: break-all; overflow: hidden; font-size: 3.4mm; line-height: 1.75; }
.rs-box-body.is-over { background: #fff4f4; }

.rs-note { position: absolute; left: 14mm; bottom: 6mm; font-size: 2.4mm; color: #555; }

/* 枠からあふれた欄の警告（画面だけ） */
.rs-warn { display: none; }
.rs-warn.is-on { display: block; }

/* 入力欄の行（学歴・職歴・資格） */
.rs-row { display: grid; grid-template-columns: 5.5rem 4rem 1fr 2.5rem; gap: 0.5rem; align-items: center; }
@media (max-width: 480px) {
  .rs-row { grid-template-columns: 4.8rem 3.6rem 1fr 2.25rem; gap: 0.375rem; }
}

/* 印刷：紙面だけを A4 で出す */
#rs-print { display: none; }
@media print {
  @page { size: A4; margin: 0; }
  body > *:not(#rs-print) { display: none !important; }
  #rs-print { display: block !important; }
  #rs-print .rs-page { box-shadow: none; margin: 0; page-break-after: always; break-after: page; }
  #rs-print .rs-page:last-child { page-break-after: auto; break-after: auto; }
  #rs-print .rs-box-body.is-over { background: none; }
}