@charset "UTF-8";
/*
 * イイバイト 応募フォーム（入力）リデザイン（2026）
 * - job_entry/entry.html だけが読み込む。スマホ・PC 共通（PC は幅 600px の1列で中央寄せ）
 * - 土台の job_entry/base.html は Bootstrap と MDB を読むので、body.ib2026e の中で必要な値を明示して上書きする
 * - 確認画面・完了画面（confirm.html / finish.html）には効かない
 * - 色はスマホ版の sp2026.css と同じ：文字 #1E2A33 / 補助 #4B5761 / 罫線 #DCE3E8 / 入力枠 #C5CFD6 / 地 #F4F7F9
 *   入口の青 #0B7AB2 / 応募のオレンジ #BF5300
 */

/* ---------- 土台 ---------- */
body.ib2026e {
	margin: 0;
	padding: 0;
	min-width: 0;
	background: #F4F7F9;
	color: #1E2A33;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic", sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
}
body.ib2026e .ib-entry *,
body.ib2026e .ib-entry *::before,
body.ib2026e .ib-entry *::after { box-sizing: border-box; }
body.ib2026e .ib-entry a:focus-visible,
body.ib2026e .ib-entry button:focus-visible,
body.ib2026e .ib-entry input:focus-visible,
body.ib2026e .ib-entry select:focus-visible { outline: 3px solid #0B7AB2; outline-offset: 2px; }

/* ---------- ヘッダー（ロゴだけ。応募の途中で離れないようリンクは付けない） ---------- */
body.ib2026e .ib-entry__header { height: 56px; background: #FFFFFF; border-bottom: 1px solid #DCE3E8; }
body.ib2026e .ib-entry__header-inner {
	max-width: 600px; height: 100%; margin: 0 auto; padding: 0 16px;
	display: flex; align-items: center;
}
body.ib2026e .ib-entry__header img { display: block; width: 80px; height: 30px; object-fit: contain; }

/* ---------- 本文（白い面を 8px 空けて重ねる） ---------- */
body.ib2026e .ib-entry__main { margin: 0 auto; display: flex; flex-direction: column; gap: 8px; padding-bottom: 8px; }
body.ib2026e .ib-entry__sec { margin: 0; background: #FFFFFF; }
@media (min-width: 640px) {
	body.ib2026e .ib-entry__main { max-width: 600px; padding: 16px 0 32px; }
	body.ib2026e .ib-entry__sec { border: 1px solid #DCE3E8; border-radius: 12px; }
}

/* 見出しと応募の流れ */
body.ib2026e .ib-entry__intro { padding: 20px 16px; display: flex; flex-direction: column; gap: 16px; }
body.ib2026e .ib-entry__title { margin: 0; font-size: 22px; line-height: 1.45; font-weight: 700; color: #1E2A33; }
body.ib2026e .ib-steps { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
body.ib2026e .ib-steps__item { display: flex; flex-direction: column; gap: 6px; }
body.ib2026e .ib-steps__bar { display: block; height: 4px; border-radius: 2px; background: #DCE3E8; }
body.ib2026e .ib-steps__label { font-size: 14px; line-height: 1.5; color: #5E6A74; }
body.ib2026e .ib-steps__item.is-current .ib-steps__bar { background: #0B7AB2; }
body.ib2026e .ib-steps__item.is-current .ib-steps__label { font-weight: 700; color: #0B7AB2; }

/* 応募する求人 */
body.ib2026e .ib-entry__job { padding: 16px; }
body.ib2026e .ib-job { display: flex; flex-direction: column; gap: 12px; color: #1E2A33; text-decoration: none; }
body.ib2026e .ib-job:hover { color: #1E2A33; text-decoration: none; }
body.ib2026e .ib-job p { margin: 0; overflow-wrap: anywhere; }
body.ib2026e .ib-job__head { display: flex; gap: 12px; align-items: flex-start; }
body.ib2026e .ib-job__thumb { width: 80px; height: 60px; flex-shrink: 0; object-fit: cover; border-radius: 8px; background: #EEF2F5; }
body.ib2026e .ib-job__title { min-width: 0; font-size: 15px; line-height: 1.55; font-weight: 700; color: #1E2A33; }
body.ib2026e .ib-job__desc { font-size: 14px; line-height: 1.7; color: #4B5761; }
body.ib2026e .ib-job__office { font-size: 13px; line-height: 1.6; color: #5E6A74; }
body.ib2026e .ib-job__pay { padding: 10px 12px; border-radius: 8px; background: #F4F7F9; font-size: 14px; line-height: 1.7; color: #1E2A33; }
body.ib2026e .ib-job__pay strong { font-weight: 700; }

/* ---------- 入力フォーム ---------- */
body.ib2026e .ib-form { padding: 20px 16px 28px; display: flex; flex-direction: column; gap: 24px; }
body.ib2026e .ib-form__pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
body.ib2026e .ib-field { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
body.ib2026e .ib-fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
body.ib2026e .ib-field__label {
	margin: 0; padding: 0; font-size: 16px; line-height: 1.5; font-weight: 700; color: #1E2A33;
	/* MDB の label の位置指定（浮かせるラベル）を受けないように */
	position: static; transform: none; float: none; width: auto;
}
body.ib2026e legend.ib-field__label { margin-bottom: 10px; }
body.ib2026e .ib-req {
	display: inline-block; margin-left: 6px; padding: 2px 8px; border-radius: 4px;
	background: #BF5300; color: #FFFFFF; font-size: 13px; line-height: 1.5; font-weight: 700; vertical-align: 2px;
}

/* 文字の入力欄と生年月日のプルダウン */
body.ib2026e .ib-input,
body.ib2026e .ib-birth select {
	display: block; width: 100%; height: 52px; margin: 0; padding: 0 14px;
	border: 1.5px solid #C5CFD6; border-radius: 10px; background: #FFFFFF; box-shadow: none;
	color: #1E2A33; font-family: inherit; font-size: 16px; line-height: 1.4;
	-webkit-appearance: none; appearance: none;
}
body.ib2026e .ib-input::placeholder { color: #8A96A0; opacity: 1; }
body.ib2026e .ib-input--num { font-variant-numeric: tabular-nums; }
body.ib2026e .ib-entry .ib-input:focus,
body.ib2026e .ib-entry .ib-birth select:focus { outline: none; border-color: #0B7AB2; box-shadow: 0 0 0 3px rgba(11, 122, 178, .2); }

/* 性別（ラジオを大きな枠で押しやすく） */
body.ib2026e .ib-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
body.ib2026e .ib-choice {
	height: 52px; margin: 0; padding: 0 14px; display: flex; align-items: center; gap: 10px;
	border: 1.5px solid #C5CFD6; border-radius: 10px; background: #FFFFFF;
	font-size: 16px; line-height: 1.4; font-weight: 400; color: #1E2A33; cursor: pointer;
}
body.ib2026e .ib-choice input {
	position: static; opacity: 1; pointer-events: auto; visibility: visible;
	width: 20px; height: 20px; margin: 0; flex-shrink: 0; accent-color: #0B7AB2;
}
body.ib2026e .ib-choice:has(input:checked) { border-color: #0B7AB2; background: #EAF6FC; font-weight: 700; }
body.ib2026e .ib-choice:has(input:focus-visible) { outline: 3px solid #0B7AB2; outline-offset: 2px; }

/* 生年月日（年は少し広く） */
body.ib2026e .ib-birth { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 8px; }
body.ib2026e .ib-birth__item { display: flex; align-items: center; gap: 6px; min-width: 0; }
body.ib2026e .ib-birth select {
	flex: 1; min-width: 0; padding: 0 28px 0 10px;
	background: #FFFFFF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235E6A74' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;
	font-variant-numeric: tabular-nums;
}
body.ib2026e .ib-birth__item label {
	margin: 0; flex-shrink: 0; font-size: 15px; line-height: 1.4; font-weight: 400; color: #1E2A33;
	position: static; transform: none;
}

/* 送信 */
body.ib2026e .ib-form__submit { display: flex; flex-direction: column; padding-top: 4px; }
body.ib2026e .ib-submit {
	height: 56px; margin: 0; padding: 0 16px; border: 0; border-radius: 10px;
	background: #BF5300; color: #FFFFFF; box-shadow: none;
	font-family: inherit; font-size: 18px; line-height: 1.2; font-weight: 700; letter-spacing: 0; text-transform: none;
	cursor: pointer;
}
body.ib2026e .ib-submit:hover { background: #A84900; }
body.ib2026e .ib-entry .ib-submit:focus:not(:focus-visible) { outline: none; }

/* ---------- 幅 360px 未満（320px 端末など） ---------- */
@media (max-width: 359px) {
	/* 応募の流れの文字が1字だけ折り返さないように */
	body.ib2026e .ib-steps__label { font-size: 12px; }
	/* 月・日の2桁が欠けないように、年の列を少し狭め、プルダウンの余白と矢印を詰める */
	body.ib2026e .ib-birth { grid-template-columns: 1.25fr 1fr 1fr; }
	body.ib2026e .ib-birth__item { gap: 4px; }
	body.ib2026e .ib-birth select { padding: 0 20px 0 8px; background-position: right 6px center; }
}