@charset "UTF-8";
/* ==========================================================================
   採用ページ用スタイル  recruit.css
   花沢建材工業株式会社 / 2026-09-10 作成
   ・全ルールに .rec_ 接頭辞を付け、テーマCSSと衝突しないようにしています
   ・色は既存の CSS変数 --green (#209146) を参照します
   ・設置場所 /wp/wp-content/themes/hana-ken240618/assets/css/recruit.css
   ========================================================================== */

/* --- 募集状況・最終更新日 ------------------------------------------------ */
.rec_state{text-align:center;margin-top:26px}
.rec_state .rec_badge{display:inline-block;background:var(--green);color:#fff;font-size:13px;
  font-weight:500;letter-spacing:.15em;padding:5px 20px}
.rec_state .rec_date{display:inline-block;font-size:12px;color:#555;margin-left:12px;letter-spacing:.1em}
.rec_state_link{margin-top:14px}
.rec_state_link a{font-size:14px;color:var(--green);letter-spacing:.1em;
  border-bottom:1px solid var(--green);padding-bottom:2px}

/* --- リード文・メイン写真 ------------------------------------------------ */
.rec_lead{max-width:808px;margin:50px auto 0}
.rec_lead p{line-height:2.2;letter-spacing:.14em;text-align:justify;text-indent:1em;margin-bottom:16px}
.rec_mv{max-width:808px;margin:50px auto 0}

/* --- ページ内ナビ（テーマの .polygonNav を流用。字間ぶんの中心ずれだけ補正） -- */
.rec_anchor .polygonNav__inner{text-indent:.2em}

/* --- 数字の帯 ------------------------------------------------------------ */
.rec_num{display:flex;flex-wrap:wrap;justify-content:space-between;max-width:808px;margin:0 auto;
  background:#fff;padding:34px 30px}
.rec_num div{text-align:center;padding:6px 10px}
.rec_num b{display:block;font-size:38px;font-weight:300;color:var(--green);letter-spacing:.08em;line-height:1.3}
.rec_num span{font-size:12px;letter-spacing:.08em}

/* --- 仕事内容 ------------------------------------------------------------ */
.rec_job{border-top:1px dashed #0A9747;padding:24px 0}
.rec_job:last-of-type{border-bottom:1px dashed #0A9747}
.rec_job h4{font-size:18px;font-weight:500;letter-spacing:.15em;margin-bottom:6px}
.rec_job p{line-height:2;letter-spacing:.1em;text-align:justify}
.rec_note{font-size:14px;color:#444;line-height:1.9;letter-spacing:.1em;margin-top:18px}
.rec_white{background:#fff;padding:34px 36px;margin-top:40px}
.rec_white h4{font-size:18px;font-weight:500;letter-spacing:.15em;color:var(--green);margin-bottom:10px}
.rec_white p{line-height:2.1;letter-spacing:.12em;text-align:justify}
.rec_2col{display:flex;flex-wrap:wrap;gap:40px;margin-top:40px}
.rec_2col>div{flex:1 1 340px}
.rec_2col h4{font-size:16px;font-weight:500;letter-spacing:.15em;margin-bottom:10px;
  border-bottom:1px solid var(--green);padding-bottom:6px}
.rec_2col li{line-height:2;letter-spacing:.1em;padding-left:1em;text-indent:-1em}
.rec_2col li::before{content:"・"}

/* --- 入社後の流れ -------------------------------------------------------- */
.rec_flow{border-left:1px solid #C9D5CC;margin-left:8px}
.rec_flow li{position:relative;padding:0 0 34px 30px}
.rec_flow li::before{content:"";position:absolute;left:-7px;top:10px;width:13px;height:13px;
  border-radius:50%;background:var(--green)}
.rec_flow .rec_when{color:var(--green);font-size:17px;font-weight:500;letter-spacing:.15em;margin-bottom:4px}
.rec_flow p{line-height:2;letter-spacing:.1em;text-align:justify}

/* --- 求める人物像 -------------------------------------------------------- */
.rec_must{border:1px solid var(--green);padding:18px 24px;margin-bottom:34px;text-align:center;
  letter-spacing:.15em;font-weight:500}
.rec_must b{color:var(--green);font-weight:500}
.rec_fit{display:flex;flex-wrap:wrap;gap:30px}
.rec_fit>div{flex:1 1 330px;background:#fff;padding:26px 28px}
.rec_fit h4{font-size:17px;font-weight:500;color:var(--green);letter-spacing:.15em;margin-bottom:12px}
.rec_fit .rec_no h4{color:#666}
.rec_fit li{line-height:1.9;letter-spacing:.08em;margin-bottom:10px;padding-left:1em;text-indent:-1em}
.rec_fit li::before{content:"・"}

/* --- 働く環境 ------------------------------------------------------------ */
.rec_env{display:flex;flex-wrap:wrap;gap:36px}
.rec_env>div{flex:1 1 220px}
.rec_env h4{font-size:16px;font-weight:500;letter-spacing:.15em;color:var(--green);
  border-bottom:1px dashed #0A9747;padding-bottom:8px;margin-bottom:12px}
.rec_env li{font-size:15px;line-height:1.9;letter-spacing:.06em;margin-bottom:8px;padding-left:1em;text-indent:-1em}
.rec_env li::before{content:"・"}

/* --- 募集要項テーブル（会社概要と同じ組み。theme の .company_col は使わない） -- */
.rec_spec{width:100%}
.rec_spec tr{margin-bottom:30px;display:block;letter-spacing:.1em}
.rec_spec th{width:180px;text-align:left;font-weight:400;vertical-align:top}
.rec_spec td{font-weight:400;line-height:1.9}
.rec_kome{font-size:13px;color:#555;line-height:1.9;letter-spacing:.08em;margin-top:20px}

/* --- 応募ブロック -------------------------------------------------------- */
.rec_apply{background:#fff;padding:40px;text-align:center;margin-top:20px}
.rec_apply_ttl{font-size:19px;font-weight:500;color:var(--green);letter-spacing:.15em;margin-bottom:14px}
.rec_apply p{line-height:2;letter-spacing:.1em}
.rec_apply .m_btn{margin:26px 0 10px}
/* テーマの .m_btn.s_bd はCSSキーワードの green(#008000) を使っているため、
   このページだけブランド色 #209146 に揃える */
.rec_apply .m_btn.s_bd>.txt{color:var(--green);border-color:var(--green)}
.rec_apply .m_btn.s_bd>.txt:hover{background:var(--green);color:#fff}
.rec_reply{margin-top:20px;font-size:14px;letter-spacing:.1em;color:#333}

/* --- よくあるご質問 ------------------------------------------------------ */
.rec_faq details{border-bottom:1px dashed #0A9747;padding:16px 4px}
.rec_faq details:first-of-type{border-top:1px dashed #0A9747}
.rec_faq summary{cursor:pointer;list-style:none;font-weight:500;letter-spacing:.1em;line-height:1.8}
.rec_faq summary::-webkit-details-marker{display:none}
.rec_faq summary::before{content:"Q　";color:var(--green)}
.rec_faq p{margin-top:12px;line-height:2;letter-spacing:.1em;text-align:justify}
.rec_faq p::before{content:"A　";color:#888}

/* --- スマートフォン ------------------------------------------------------ */
@media screen and (max-width:767px){
  .rec_lead{margin-top:30px}
  .rec_lead p{line-height:1.9;font-size:14px;letter-spacing:.1em}
  .rec_mv{margin-top:30px}
  .rec_num{padding:20px 10px}
  .rec_num div{width:33%;padding:8px 2px}
  .rec_num b{font-size:26px}
  .rec_num span{font-size:11px}
  .rec_job h4{font-size:16px}
  .rec_job p,.rec_white p,.rec_flow p,.rec_2col li{font-size:14px;line-height:1.9}
  .rec_white{padding:22px 20px}
  .rec_2col{gap:24px;margin-top:26px}
  .rec_fit>div{padding:20px 18px}
  .rec_env{gap:24px}
  .rec_spec th{width:110px;font-size:14px}
  .rec_spec td{font-size:14px}
  .rec_spec tr{margin-bottom:20px}
  .rec_apply{padding:26px 18px}
  .rec_apply_ttl{font-size:16px}
  .rec_faq summary{font-size:15px}
  .rec_faq p{font-size:14px}
}