/* ===== 採用ページの案内（カスタムPAGE の部品 recruit-intro・2026-10-01） ===== */
.rc_intro{background:#fff; border-radius:6px; padding:1.6rem 1.5rem .4rem;}
.rc_intro .re_h3{margin:0 0 .8rem;}
.rc_intro_body p{line-height:1.9; margin:0 0 .9em;}
.rc_intro .m6_btn{margin:.4rem auto 0; padding:.8rem 0 1.4rem;}

/* ===== 部品で作るページの本文の場所（テンプレート「ROOTS HD カスタムPAGE」・2026-10-01） ===== */
.rhp-page{background:#f6f6f6; padding:3rem 0 4rem;}
.rhp-page .rc_intro{margin:0 auto 1.6rem; max-width:960px;}

/* ===== 求人一覧（開閉式）（カスタムPAGE の部品 recruit-list・2026-10-01）。形は区分の帯＋職種カード、色は ROOTS ===== */
.rhp-joblist{display:flex; flex-direction:column; gap:1rem; max-width:960px; margin:0 auto;}
.rhp-joblist__head{font-size:1.3rem; font-weight:bold; margin:0 0 .4rem; color:#231815;}
.rhp-job-group{background:#fff; border-radius:12px;}
.rhp-job-group__head{list-style:none; cursor:pointer; position:relative; display:block; background:#231815; color:#fff; border-radius:12px; padding:1.3rem 4.2rem 1.3rem 1.6rem; line-height:1.5;}
.rhp-job-group__head::-webkit-details-marker{display:none;}
.rhp-job-group[open] > .rhp-job-group__head{border-radius:12px 12px 0 0;}
.rhp-job-group__label{display:block; font-size:.9rem; opacity:.9;}
.rhp-job-group__name{display:block; font-size:1.3rem; font-weight:bold;}
.rhp-job-group__icon{position:absolute; right:1.6rem; top:50%; width:18px; height:18px; transform:translateY(-50%);}
.rhp-job-group__icon::before,.rhp-job-group__icon::after{content:""; position:absolute; left:0; top:50%; width:18px; height:2px; background:#fff; transform:translateY(-50%); transition:transform .2s;}
.rhp-job-group__icon::after{transform:translateY(-50%) rotate(90deg);}
.rhp-job-group[open] .rhp-job-group__icon::after{transform:translateY(-50%) rotate(0deg);}
.rhp-job-cards{list-style:none; margin:0; padding:1.2rem; display:flex; flex-direction:column; gap:1rem;}
.rhp-job-card{background:#eeeeee; border-radius:12px; padding:1.5rem 1.6rem;}
.rhp-job-card__title{margin:0; padding-left:.8rem; border-left:5px solid #f4a927; font-size:1.3rem; font-weight:bold; color:#231815; line-height:1.4;}
.rhp-job-card__desc{margin:.8rem 0 0; line-height:1.8; color:#231815;}
.rhp-job-card__tags{margin:.8rem 0 0; display:flex; flex-wrap:wrap; gap:.4rem;}
.rhp-tag{display:inline-block; font-size:.85rem; padding:.15rem .8rem; border:1px solid #231815; border-radius:100vh; background:#fff; color:#231815;}
.rhp-job-card__btn{margin-top:1rem; display:flex; align-items:center; justify-content:space-between; background:#fff; border:2px solid #231815; border-radius:10px; padding:.9rem 1.2rem; font-weight:bold; color:#231815; text-decoration:none; max-width:420px;}
.rhp-job-card__btn i{width:22px; height:22px; border-radius:50%; background:#f4a927; position:relative; flex:0 0 22px;}
.rhp-job-card__btn i::after{content:""; position:absolute; left:7px; top:7px; width:6px; height:6px; border-top:2px solid #fff; border-right:2px solid #fff; transform:rotate(45deg);}
.rhp-job-card__btn:hover{opacity:.85;}
@media (max-width:767px){
  .rhp-page{padding:2rem 0 3rem;}
  .rhp-job-group__head{padding:1.1rem 3.4rem 1.1rem 1.2rem;}
  .rhp-job-group__name{font-size:1.1rem;}
  .rhp-job-group__icon{right:1.2rem;}
  .rhp-job-cards{padding:.8rem;}
  .rhp-job-card{padding:1.2rem;}
  .rhp-job-card__title{font-size:1.1rem;}
}

/* ===== 求人1件のページ（募集要項）・2026-10-01 0.2.1 =====
   色の元＝「サイト基本情報」の「カラー：メイン」（--rhp-main）。空なら #f4a927（今のオレンジ） */
.ol_div1-2{white-space:pre-line;}   /* 欄に書いた改行をそのまま出す */
.entry_box{background:#fbf3e4; background:color-mix(in srgb, var(--rhp-main, #f4a927) 12%, #fff); border-top:4px solid var(--rhp-main, #f4a927);}
.entry_box .wpcf7{max-width:720px; margin:0 auto; background:#fff; border:3px solid var(--rhp-main, #f4a927); border-radius:12px; padding:2rem 1.8rem 1.4rem; box-shadow:0 2px 14px rgba(35,24,21,.08);}   /* 幅を狭め、太い枠でフォームと分かるように（宗峰さん「もっと幅狭で」「枠をつけてあきらかにフォームとわかるように」） */
.entry_box .entry_p{font-weight:700; margin-bottom:1.6rem; max-width:720px; margin-left:auto; margin-right:auto;}
.entry_box .wpcf7 input[type=text],.entry_box .wpcf7 input[type=email],.entry_box .wpcf7 input[type=tel],.entry_box .wpcf7 input[type=date],.entry_box .wpcf7 input[type=number],.entry_box .wpcf7 select,.entry_box .wpcf7 textarea{background:#fff; border:1px solid #d8cdbb; border-radius:6px;}
.entry_box .wpcf7 input:focus,.entry_box .wpcf7 select:focus,.entry_box .wpcf7 textarea:focus{outline:none; border-color:var(--rhp-main, #f4a927); box-shadow:0 0 0 3px rgba(244,169,39,.25);}
@media (max-width:767px){ .entry_box .wpcf7{padding:1.4rem 1rem 1rem; border-radius:10px;} }

/* ===== 採用の種類の見出し（中途採用・第二新卒など）・2026-10-02 0.3.2 ===== */
.rhp-job-kind{display:flex; align-items:center; gap:.7rem; margin:2rem 0 .2rem; font-size:1.7rem; font-weight:bold; color:#231815; line-height:1.3;}
.rhp-job-kind::before{content:""; flex:0 0 8px; height:1.5em; background:var(--rhp-main, #f4a927); border-radius:4px;}
.rhp-joblist > .rhp-job-kind:first-of-type{margin-top:.6rem;}
@media (max-width:767px){ .rhp-job-kind{font-size:1.35rem; margin-top:1.6rem;} }

/* ===== 開閉の帯の色とスライド・2026-10-02 0.3.2 =====
   閉じている＝濃い色の帯（今まで）。開いている＝メインカラーの帯（--rhp-main・空なら #f4a927）。宗峰さん「閉じてるときは黒、＋を押したらスライド、黒かったところはサイトに合わせて色を変える」 */
.rhp-job-group[open]:not(.is-closing) > .rhp-job-group__head{background:var(--rhp-main, #f4a927); color:#231815;}
.rhp-job-group[open]:not(.is-closing) .rhp-job-group__icon::before,.rhp-job-group[open]:not(.is-closing) .rhp-job-group__icon::after{background:#231815;}
.rhp-job-group__head{transition:background-color .3s, color .3s;}
.rhp-job-cards{overflow:hidden;}