@charset "UTF-8";
/* =========================================================
   エントリー・お問い合わせ（page-entry.php）

   見た目は募集要項ページの部品（p-guideline__*）に任せ、ここには
   フォームを置くのに足りない分だけを書く。新しい装飾は足さない。
   - 札（ピル）や番号つきの手順カードは使わない
   - 影は募集要項の白い面にあるものだけ。色つきのぼかし影は使わない
   - 入力欄は角を小さく、罫と余白で区切る
   ========================================================= */

/* 飾りの大きな英字を、このページ用に差し替える */
.p-entry .p-guideline__hero::before { content: "ENTRY"; }
.p-entry .p-guideline__card::before { content: attr(data-ghost); }

.p-entry__nb { display: inline-block; }

.p-entry__card + .p-entry__card { margin-top: clamp(28px, 3vw, 44px); }
.p-entry__card:focus { outline: none; }
.p-entry__card { scroll-margin-top: 90px; }

/* 見出し下の説明 */
.p-entry__intro {
  position: relative;
  max-width: 680px;
  margin: 0 auto clamp(18px, 2vw, 26px);
  color: #4a5a6e;
  font-size: clamp(13px, 1vw, 15px);
  font-weight: 600;
  line-height: 2;
  text-align: center;
}

/* ---------------------------------------------------------
   エントリーシート：実物の縮小画像と、文字のリンク
   --------------------------------------------------------- */
.p-entry__sheet { display: flex; align-items: flex-start; gap: clamp(18px, 2.4vw, 32px); }
.p-entry__thumb { flex: 0 0 auto; display: block; transition: translate .24s steps(3, jump-none); }
.p-entry__thumb img { display: block; width: 120px; height: auto; border: 1px solid #d3d9e1; background: #fff; }
.p-entry__thumb:hover { translate: 0 -4px; }
.p-entry__links { margin: 0 0 6px; line-height: 2.1; }
.p-entry__links a {
  color: var(--guideline-blue);
  font-weight: 800;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}
.p-entry__links a:hover { text-decoration-thickness: 2px; }
.p-entry__links span { margin-left: 4px; color: #7a8696; font-size: .86em; font-weight: 600; }

/* ---------------------------------------------------------
   フォーム：募集要項と同じ表組みの右側に入力欄を置く
   --------------------------------------------------------- */
.p-entry__fields .p-guideline__row { align-items: start; }
.p-entry__fields dt { padding-top: 10px; }
.p-entry__fields dt label { cursor: pointer; }

/* 必須・任意は札にせず、項目名に添える小さな文字にする */
.p-entry__req,
.p-entry__opt {
  display: inline-block;
  margin-left: 10px;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .04em;
  vertical-align: 1px;
}
.p-entry__req { color: #c4332b; }
.p-entry__opt { color: #8a95a3; }

.p-entry__input {
  display: block;
  width: 100%;
  max-width: 540px;
  padding: 12px 14px;
  border: 1px solid #c5cbd3;
  border-radius: 6px;
  color: var(--guideline-ink);
  background: #fff;
  font: inherit;
  font-size: 16px; /* iOS で入力時に拡大されない大きさ */
  font-weight: 500;
  line-height: 1.6;
}
#entry_tel { max-width: 300px; }
textarea.p-entry__input { max-width: none; min-height: 160px; resize: vertical; }
.p-entry__input:focus { border-color: var(--guideline-blue); outline: 2px solid var(--guideline-blue); outline-offset: -1px; }
.p-entry__input[aria-invalid="true"] { border-color: #c4332b; background: #fff7f6; }

/* ご用件：ふつうのラジオボタンを縦に並べる */
.p-entry__choices { display: grid; gap: 12px; padding-top: 8px; }
.p-entry__choices label { display: flex; align-items: center; gap: 10px; width: fit-content; font-weight: 700; cursor: pointer; }
.p-entry__choices input { width: 18px; height: 18px; margin: 0; accent-color: var(--guideline-blue); cursor: pointer; }

/* 添付：ブラウザ標準の欄を生かし、ボタンだけ整える */
/* ファイル欄はブラウザ標準の最小幅を持つため、幅を明示しないと狭い画面で列を押し広げる */
.p-entry__fields dd { min-width: 0; }
.p-entry__file { width: 100%; min-width: 0; max-width: 100%; padding-top: 4px; color: #4a5a6e; font: inherit; font-size: 14px; }
.p-entry__file::file-selector-button {
  margin-right: 14px;
  padding: 8px 18px;
  border: 1px solid var(--guideline-navy);
  border-radius: 4px;
  color: var(--guideline-navy);
  background: #fff;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  transition: background-color .2s steps(2, jump-none), color .2s steps(2, jump-none);
}
.p-entry__file::file-selector-button:hover { color: #fff; background: var(--guideline-navy); }
.p-entry__file:focus-visible { outline: 2px solid var(--guideline-blue); outline-offset: 3px; }
.p-entry__file[aria-invalid="true"]::file-selector-button { border-color: #c4332b; color: #c4332b; }

.p-entry__error { margin: 8px 0 0; color: #b3261e; font-size: 13px; font-weight: 800; line-height: 1.6; }

.p-entry__note { margin: 4px 0 0; color: #6b7787; font-size: 12.5px; font-weight: 600; }

/* 同意と送信 */
.p-entry__consent { margin-top: 24px; padding-top: 24px; border-top: 1px dashed #c5cbd3; text-align: center; }
.p-entry__check { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; cursor: pointer; }
.p-entry__check input { width: 20px; height: 20px; margin: 0; accent-color: var(--guideline-blue); cursor: pointer; }
.p-entry__check a { color: var(--guideline-blue); text-decoration: underline; text-underline-offset: 4px; }
.p-entry__consent .p-entry__error { text-align: center; }

.p-entry__button {
  margin: 26px auto 0;
  font: inherit;
  font-size: 14px;
  cursor: pointer;
  transition: background-color .24s steps(3, jump-none), translate .24s steps(3, jump-none);
}
button.p-entry__button { font-weight: 900; }
.p-entry__button:hover { background: #ffd24a; translate: 0 -3px; }
.p-entry__button:focus-visible { outline: 2px solid var(--guideline-navy); outline-offset: 4px; }
.p-entry__button[disabled] { background: #e9ddb4; cursor: wait; translate: none; }

.p-entry__alt { margin: 22px 0 0; color: #6b7787; font-size: 12.5px; font-weight: 600; text-align: center; }
.p-entry__alt a { color: var(--guideline-blue); text-decoration: underline; text-underline-offset: 3px; }

/* ボット対策の欄は画面の外へ（人には見えず、読み上げもしない） */
.p-entry__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* 送信できなかったときのまとめ */
.p-entry__summary {
  max-width: 680px;
  margin: 0 auto 8px;
  padding: 18px 22px;
  border: 1px solid #e6b3ae;
  border-radius: 8px;
  color: #b3261e;
  background: #fff7f6;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.8;
}
.p-entry__summary p { margin: 0; }
.p-entry__summary ul { margin: 6px 0 0; padding-left: 1.2em; list-style: disc; }
.p-entry__summary a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.p-entry__summary-note { margin-top: 6px !important; color: #7a3a35; font-weight: 700; }

/* 送信完了 */
.p-entry__thanks { position: relative; padding: 8px 0 12px; color: #4a5a6e; font-size: 15px; font-weight: 600; line-height: 2.1; text-align: center; }
.p-entry__thanks p { margin: 0; }
.p-entry__thanks-title { margin-bottom: 12px !important; color: var(--guideline-ink); font-size: clamp(20px, 2vw, 26px); font-weight: 900; letter-spacing: .05em; }

@media (max-width: 47.99rem) {
  /* 9文字の見出し（エントリーフォーム）が途中で折れない大きさ。375px幅で1行に収まる */
  .p-entry .p-guideline__card-heading h2 { font-size: 24px; letter-spacing: .04em; }
  .p-entry__intro { text-align: left; }
  .p-entry__fields dt { padding-top: 0; }
  .p-entry__input,
  #entry_tel { max-width: none; }
  .p-entry__thumb img { width: 84px; }
  .p-entry__sheet { gap: 16px; }
  .p-entry__links span { display: block; margin-left: 0; line-height: 1.4; }
  .p-entry__check { align-items: flex-start; text-align: left; }
  /* 「選択されていません」が省略されずに収まるよう、ボタンの余白を詰める */
  .p-entry__file { font-size: 13px; }
  .p-entry__file::file-selector-button { margin-right: 10px; padding: 8px 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .p-entry__thumb,
  .p-entry__button,
  .p-entry__file::file-selector-button { transition: none; }
  .p-entry__thumb:hover,
  .p-entry__button:hover { translate: none; }
}
