@charset "UTF-8";
/* recruit-form.css — 応募フォーム（entry）ダーク・ミニマル */

/* contact本来の自動2カラム（item 47.14%）を活かし、全幅にしたい項目だけ広げる。
   style.css の .l-contact__item:not(:last-child) が同じ詳細度（0,2,0）で
   47.1429% を指定しており、読み込み順で style.css が後に来るため負ける。
   親を1つ足して詳細度を上げる。最後の項目だけ全幅になっていたのはこのため。 */
@media only screen and (min-width: 768px) {
  .l-contact__list .l-contact__item.l-entry__full { width: 100%; }
}

/* 求人へ戻るヘッダー */
.l-entry__head { margin-bottom: 3rem; }
.l-entry__hero {
  aspect-ratio: 2 / 1;
  overflow: hidden;
  margin-bottom: 2rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.l-entry__hero img { width: 100%; height: 100%; object-fit: cover; display: block; }
.l-entry__back {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  letter-spacing: 0.04em;
  opacity: 0.55;
  margin-bottom: 1.75rem;
  transition: opacity 0.3s ease;
}
.l-entry__back:hover { opacity: 1; }
.l-entry__back-ico { width: 1.15rem; height: 1.15rem; flex-shrink: 0; }
.l-entry__subinfo {
  display: flex;
  align-items: center;
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  opacity: 0.6;
  margin-top: 1rem;
}
.l-entry__pin {
  width: 0.95em;
  height: 0.95em;
  opacity: 0.7;
  margin-right: 0.4em;
  vertical-align: -0.12em;
}

/* 職種名を見出しに差し込む場合（和文向けフォント） */
.l-contact__ttl--ja {
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", YuGothic, "Noto Sans JP", Meiryo, sans-serif;
  font-weight: 500;
  letter-spacing: 0.03em;
  line-height: 1.35;
}

/* 応募職種（自動表示） */
.l-contact__position {
  font-size: 1.05rem;
  font-weight: 500;
  letter-spacing: 0.03em;
  margin-top: 0.75rem;
}
.l-contact__position:empty { display: none; }

.l-entry {
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", YuGothic, "Noto Sans JP", Meiryo, sans-serif;
  font-size: 16px;
  padding: 8.5rem 0 7rem;
}
.l-entry__inner {
  max-width: 42rem;
  margin: 0 auto;
  padding: 0 1.5rem;
}
.l-entry__ttl {
  font-family: "aviano-sans", sans-serif;
  font-size: 2rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-bottom: 0.6rem;
}
.l-entry__lead {
  font-size: 0.95rem;
  opacity: 0.7;
  margin-bottom: 3rem;
}

.l-entry__item { margin-bottom: 2.25rem; }
.l-entry__label {
  display: block;
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  margin-bottom: 0.65rem;
}
.l-entry__req { font-size: 0.7rem; opacity: 0.6; margin-left: 0.5em; letter-spacing: 0.06em; }
.l-entry__note {
  font-size: 0.8rem;
  line-height: 1.75;
  opacity: 0.55;
  margin-top: 0.55rem;
}

.l-entry__input,
.l-entry__textarea {
  width: 100%;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 3px;
  color: #fff;
  font-family: inherit;
  font-size: 1rem;
  padding: 0.9rem 1rem;
  transition: border-color 0.3s ease;
}
.l-entry__input:focus,
.l-entry__textarea:focus { outline: none; border-color: rgba(255, 255, 255, 0.6); }
.l-entry__textarea { min-height: 9rem; resize: vertical; line-height: 1.7; }
.l-entry ::placeholder { color: rgba(255, 255, 255, 0.32); }

/* ファイルアップロード */
.l-entry__files-note { font-size: 0.8rem; line-height: 1.8; opacity: 0.55; margin-bottom: 1.25rem; }
.l-entry__drop {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.7rem;
  text-align: center;
  border: 1px dashed rgba(255, 255, 255, 0.3);
  border-radius: 0;
  padding: 2rem 1rem;
  cursor: pointer;
  transition: border-color 0.3s ease, background 0.3s ease;
}
.l-entry__drop:hover { border-color: rgba(255, 255, 255, 0.6); background: rgba(255, 255, 255, 0.02); }
.l-entry__drop.is-dragover { border-color: #fff; background: rgba(255, 255, 255, 0.05); }
.l-entry__drop { margin-top: 0.35rem; }

/* 備考欄の高さを約2/3に */
.l-entry-page .l-contact__textarea { min-height: 10.5rem; margin-top: 0; }
.l-entry__drop-btn {
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 999px;
  padding: 0.5rem 1.5rem;
  font-size: 0.85rem;
  letter-spacing: 0.04em;
}
.l-entry__drop-sub { font-size: 0.85rem; opacity: 0.6; }
.l-entry__drop-name { font-size: 0.8rem; opacity: 0.5; order: -1; display: none; }
.l-entry__drop input { display: none; }

.l-entry__submit { margin-top: 3rem; }
.l-entry__submit-btn {
  width: 100%;
  background: #fff;
  color: #111;
  border: none;
  border-radius: 999px;
  font-family: inherit;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  padding: 1.15rem;
  cursor: pointer;
  transition: opacity 0.3s ease;
}
.l-entry__submit-btn:hover { opacity: 0.85; }

/* ファイル選択後、案内文を薄く */
.l-entry__drop.has-file .l-entry__drop-sub,
.l-entry__drop.has-file .l-entry__drop-btn { opacity: 0.35; }
.l-entry__drop.has-file .l-entry__drop-name { display: block; opacity: 1; color: #fff; font-size: 0.9rem; margin-bottom: 0.2rem; }

/* 同意文言の文字サイズを下げる */
.l-entry-page .l-contact__privacy { font-size: 0.875rem; }
.l-entry-page .l-contact__privacy-txt { font-size: 0.875rem; line-height: 1.5; }
.l-entry-page .mwform-checkbox-field-text { font-size: 0.9rem; }

/* エントリーボタン上辺を同意文の上辺に合わせる */
.l-entry-page .l-contact__bottom { align-items: flex-start; }

/* 卒業見込み年月 セレクト */
.l-entry__ym { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.l-entry__select {
  background-color: transparent;
  color: rgba(255, 255, 255, 0.95);
  border: none;
  border-bottom: 1px solid #707070;
  border-radius: 0;
  font-family: inherit;
  font-size: 1rem;
  padding: 0.35rem 1.4rem 0.35rem 0.2rem;
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23999' stroke-width='1.3'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.35rem center;
  cursor: pointer;
  transition: border-color 0.3s ease;
}
.l-entry__select:focus { outline: none; border-bottom-color: #fff; }
.l-entry__select option { color: #111; }
.l-entry__ym-unit { font-size: 0.9rem; opacity: 0.7; }

/* 年収（万円）入力 */
.l-entry__amount { display: flex; align-items: baseline; gap: 0.5rem; }
.l-entry__amount .l-contact__input-txt { flex: 1 1 auto; min-width: 0; }
.l-entry__amount-unit { font-size: 0.9rem; opacity: 0.7; white-space: nowrap; }

/* 3カラム（現年収・希望年収・希望転職時期） */
@media only screen and (min-width: 768px) {
  .l-entry-page .l-contact__item.l-entry__third { width: 31%; }
  .l-entry-page .l-contact__item.l-entry__salary { width: 22%; }
}

/* 3項目を左寄せでまとめる（間隔を詰める） */
@media only screen and (min-width: 768px) {
  .l-entry-page .l-entry__row3 { width: 100%; display: flex; gap: 1.5rem; align-items: flex-start; flex-wrap: wrap; }
  .l-entry-page .l-entry__row3 .l-contact__item { margin-bottom: 0; }
}

/* 現年収+希望年収=左半分、希望転職時期=右半分（右カラムに左端を合わせる） */
@media only screen and (min-width: 768px) {
  .l-entry-page .l-entry__row3 { justify-content: space-between; margin-bottom: 3.25rem; }
  .l-entry-page .l-entry__pair { width: 47.14286%; display: flex; gap: 1.25rem; }
  .l-entry-page .l-entry__pair .l-contact__item { flex: 1 1 0; min-width: 0; width: auto; margin-bottom: 0; }
  .l-entry-page .l-entry__row3 > .l-entry__timing { width: 47.14286%; margin-bottom: 0; }
  .l-entry-page .l-entry__timing .l-entry__select { width: 35%; box-sizing: border-box; }
}

/* 項目名と入力の間隔を広げる */
.l-entry-page .l-contact__item-ttl { margin-bottom: 0.65rem; }

/* 志望動機（最終項目）の下を履歴書の下(2.5rem)に揃える（SP） */
@media only screen and (max-width: 767px) {
  .l-entry-page .l-contact__list { margin-bottom: 2.25rem; }
}

/* SP：ドロップ表記と「または」を非表示 */
@media only screen and (max-width: 767px) {
  .l-entry-page .l-entry__drop-sub,
  .l-entry-page .l-entry__drop-or { display: none; }   /* ドロップ表記をSP非表示 */
}

/* チェックボックス内「プライバシーポリシー」リンクに下線 */
.l-entry-page .mwform-checkbox-field-text a { text-decoration: underline; text-underline-offset: 0.15em; }

/* SP：現年収・希望年収を横並び */
@media only screen and (max-width: 767px) {
  .l-entry-page .l-entry__pair { display: flex; gap: 2rem; margin-bottom: 2.5rem; }
  .l-entry-page .l-entry__row3 { margin-bottom: 2.5rem; }
  .l-entry-page .l-entry__pair .l-contact__item { flex: 1 1 0; min-width: 0; width: auto; margin-bottom: 0; }
  .l-entry-page .l-entry__pair .l-entry__amount { display: block; position: relative; min-width: 0; }
  .l-entry-page .l-entry__pair .l-entry__amount .l-contact__input-txt { width: 100%; box-sizing: border-box; padding-right: 2.8em; min-width: 0; }   /* 入力欄は列いっぱい、右に万円の余地 */
  .l-entry-page .l-entry__pair .l-entry__amount-unit { position: absolute; right: 0; bottom: 0.35em; }   /* 万円を各列の右端に */
  .l-entry-page .l-entry__timing .l-entry__select { width: calc((100% - 2rem) / 2); box-sizing: border-box; }   /* 希望転職時期＝現年収カラムと同じ幅 */
}

/* ------------------------------------------------------------------
   MW WP Form との噛み合わせ（実装時に追加）

   支給CSSは静的HTML前提で `.l-entry__drop input { display: none }` により
   ネイティブのファイル選択UIを隠している。しかし MW WP Form のプラグインCSS
   （mw-wp-form/css/style.css）に

       .mw_wp_form input[type="file"] { display: inline-block; }

   があり、こちらの詳細度が高いため負けて「ファイルを選択／選択されていません」が
   ドロップゾーンの上に露出する。同等以上の詳細度で打ち消す。

   あわせて、MW WP Form が出力する削除ボタン（×）も支給デザインには無いため、
   ファイル未選択のうちは隠し、選択後だけ出す。
------------------------------------------------------------------ */
.mw_wp_form .l-entry__drop input[type="file"] { display: none; }

.l-entry__drop .mwform-file-delete { display: none; }
.l-entry__drop.has-file .mwform-file-delete {
  display: inline-block;
  /* プラグイン既定が visibility: hidden（確認画面を通ったときだけ出す作り）。
     こちらは確認画面を使わないので、添付があるときは常に出す。 */
  visibility: visible;
  order: -1;
  margin-left: 0.4em;
  cursor: pointer;
  opacity: 0.5;
  font-size: 1rem;
  line-height: 1;
}
.l-entry__drop.has-file .mwform-file-delete:hover { opacity: 1; }

/* ------------------------------------------------------------------
   添付ファイルの先行アップロード（js/entry-form.js・inc/careers-upload.php）

   ファイルを選んだ時点でアップロードするため、進捗と状態を出す。
   支給デザインには無い要素なので、既存の .l-entry__drop の中に収まる形で足す。
------------------------------------------------------------------ */
.l-entry__drop.is-uploading { border-style: solid; border-color: rgba(255, 255, 255, 0.45); }
.l-entry__drop.is-uploaded  { border-style: solid; border-color: rgba(255, 255, 255, 0.35); }
.l-entry__drop.is-error     { border-color: rgba(255, 120, 120, 0.8); }

/* 進捗バー。アップロード中だけ見せる */
.l-entry__drop-bar {
  display: none;
  width: 100%;
  height: 2px;
  margin-top: 0.7rem;
  background: rgba(255, 255, 255, 0.15);
  overflow: hidden;
}
.l-entry__drop.is-uploading .l-entry__drop-bar { display: block; }
.l-entry__drop-bar-fill {
  display: block;
  width: 0;
  height: 100%;
  background: #fff;
  transition: width 0.2s linear;
}

/* 状態メッセージ（アップロード中の%・添付済み・エラー） */
.l-entry__drop-msg {
  display: block;
  width: 100%;
  margin-top: 0.5rem;
  font-size: 0.8125rem;
  line-height: 1.7;
  opacity: 0.6;
}
.l-entry__drop.is-error .l-entry__drop-msg { color: #ff9c9c; opacity: 1; }
.l-entry__drop.is-uploaded .l-entry__drop-msg { opacity: 0.45; }
.l-entry__drop-msg:empty { display: none; }

/* アップロード中は「ファイルを選択」を押させない */
.l-entry__drop.is-uploading { pointer-events: none; }

/* 送信をブロックしたときの通知 */
.l-entry__notice {
  margin-top: 1rem;
  padding: 0.7rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.35);
  font-size: 0.875rem;
  line-height: 1.7;
}

/* ------------------------------------------------------------------
   スパム対策ウィジェット（Cloudflare Turnstile）
   支給デザインには無い要素。送信ボタンの手前に控えめに置く。
------------------------------------------------------------------ */
.l-entry__turnstile {
  margin: 1.5rem 0 0;
}
.l-entry__turnstile-error {
  display: block;
  margin-top: 0.6rem;
  font-size: 0.8125rem;
  line-height: 1.7;
  color: #ff9c9c;
}
@media screen and (max-width: 767px) {
  .l-entry__turnstile { margin-top: 1.2rem; }
}

/* ------------------------------------------------------------------
   送信に失敗したときの案内（inc/careers-mail.php ete_careers_mail_send_error_content）
   支給デザインには無い画面。プラグイン既定の一行表示では見落とされるため、
   添付エラー（.l-entry__drop.is-error）と同じ赤で枠を付けて目立たせる。
------------------------------------------------------------------ */
.l-entry__send-error {
  margin-top: 1.5rem;
  padding: 1.75rem 1.5rem;
  border: 1px solid rgba(255, 120, 120, 0.8);
  background: rgba(255, 120, 120, 0.08);
}
.l-entry__send-error-ttl {
  margin: 0 0 0.75rem;
  font-size: 1.125rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: #ff9c9c;
}
.l-entry__send-error-txt {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.9;
}
.l-entry__send-error-note {
  margin: 0.75rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.8;
  opacity: 0.7;
}
.l-entry__send-error-btn {
  display: block;
  width: 100%;
  margin-top: 1.5rem;
  padding: 1.15rem;
  box-sizing: border-box;
  background: #fff;
  color: #111;
  border-radius: 999px;
  text-align: center;
  text-decoration: none;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  transition: opacity 0.3s ease;
}
.l-entry__send-error-btn:hover { opacity: 0.85; }
@media screen and (max-width: 767px) {
  .l-entry__send-error { padding: 1.4rem 1.1rem; }
}
