@charset "UTF-8";

/* =========================================================
   APPLY (HouseHR / Column) - Model-like CSS (Rebuild)
   Scope: body.page-slug-apply  (+ safety fallbacks)
   Target markup: CF7 + your wrapper classes
========================================================= */

/* ---------- Scope fallback ---------- */
body.page-slug-apply,
body.page-id-11391, /* 念のため（applyのIDが違っても害なし） */
body.page-id-556 {  /* モデル側の例にも見えたので保険 */
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ---------- Layout: 1 column + remove sidebar ---------- */
body.page-slug-apply #sidebar,
body.page-slug-apply .l-sidebar,
body.page-slug-apply #secondary,
body.page-slug-apply aside#secondary,
body.page-id-11391 #sidebar,
body.page-id-11391 .l-sidebar,
body.page-id-556 #sidebar,
body.page-id-556 .l-sidebar{
  display:none !important;
}

/* SWELLの2カラムgridを1カラムへ */
body.page-slug-apply #content.l-content,
body.page-id-11391 #content.l-content,
body.page-id-556 #content.l-content{
  grid-template-columns: 1fr !important;
}

/* ---------- Page title (optional, model-like) ---------- */
body.page-slug-apply .c-pageTitle,
body.page-slug-apply .entry-title{
  text-align:center;
  font-weight:900;
  letter-spacing:.02em;
}

/* ---------- Form container ---------- */
body.page-slug-apply .wpcf7,
body.page-id-11391 .wpcf7,
body.page-id-556 .wpcf7{
  max-width: 920px;
  margin: 0 auto;
}

.apply-form-wrapper{
  max-width: 920px;
  margin: 0 auto;
}

/* ---------- Title ---------- */
.form-title{
  text-align:center;
  font-size: clamp(26px, 2.6vw, 34px);
  font-weight: 900;
  letter-spacing: .02em;
  margin: 10px 0 22px;
  color:#0b2a6f;
}

/* ---------- Section cards (model feel) ---------- */
.form-section{
  background:#fff;
  border:1px solid rgba(11,42,111,.10);
  border-radius:16px;
  padding: 22px 22px;
  box-shadow: 0 18px 48px rgba(11,42,111,.10);
  margin: 0 0 18px;
}

.form-section__head{
  margin: 0 0 14px;
}

/* badges */
.badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 34px;
  padding: 0 14px;
  border-radius: 10px;
  font-weight: 900;
  font-size: 13px;
  letter-spacing:.04em;
  color:#fff;
  background:#0b4ea2;
}

.badge--blue{ background:#0b4ea2; }

/* ---------- Form groups ---------- */
.form-group{ margin: 0 0 14px; }

.form-group label{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight: 900;
  color:#111827;
  margin: 0 0 8px;
  letter-spacing:.02em;
}

/* required mark */
.required{
  color:#d10f0f;
  font-weight:900;
}

/* 2 column layout */
.two-col{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.two-col .col{ min-width:0; }

/* ---------- Inputs (CF7 standard + your .form-control) ---------- */
body.page-slug-apply input[type="text"],
body.page-slug-apply input[type="email"],
body.page-slug-apply input[type="tel"],
body.page-slug-apply input[type="number"],
body.page-slug-apply select,
body.page-slug-apply textarea{
  width:100% !important;
  height: 46px;
  padding: 10px 12px !important;
  border: 1.6px solid rgba(59,130,246,.18) !important;
  border-radius: 10px !important;
  font-size: 15px !important;
  background:#fff !important;
  color:#111827 !important;
  outline:none !important;
  box-shadow:none !important;
}

/* textarea */
body.page-slug-apply textarea{
  height:auto;
  min-height: 120px;
  padding: 12px 12px !important;
  resize: vertical;
}

/* readonly inputs (dynamic text) */
body.page-slug-apply input[readonly]{
  background:#f3f8ff !important;
  border-color: rgba(59,130,246,.18) !important;
}

/* focus */
body.page-slug-apply input:focus,
body.page-slug-apply select:focus,
body.page-slug-apply textarea:focus{
  border-color:#1e5ba8 !important;
  box-shadow: 0 0 0 4px rgba(30,91,168,.15) !important;
}

/* select arrow */
body.page-slug-apply select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%233b82f6' d='M1.41 0L6 4.59L10.59 0L12 1.41l-6 6l-6-6z'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:right 14px center !important;
  background-size:12px 8px !important;
  padding-right:40px !important;
  cursor:pointer;
}

/* ---------- Radio (experience) ---------- */
.exp-radio{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}
.exp-radio .wpcf7-list-item{
  margin:0 !important;
}
.exp-radio label{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  cursor:pointer;
}
.exp-radio input[type="radio"]{
  appearance:auto !important;
}

/* ---------- Validation messages ---------- */
body.page-slug-apply .wpcf7-not-valid-tip{
  color:#dc2626;
  font-weight:800;
  margin-top:6px;
}
body.page-slug-apply .wpcf7-response-output{
  border-radius: 12px;
  font-weight: 800;
}

/* ---------- Submit button (model-like) ---------- */
.submit-area{
  text-align:center;
  margin-top: 18px;
}

body.page-slug-apply .wpcf7-submit,
body.page-slug-apply input[type="submit"]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-width: 420px;
  height: 56px;
  padding: 0 26px;
  border:none !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #2563eb, #1e40af) !important;
  color:#fff !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  letter-spacing: .04em;
  cursor:pointer;
  box-shadow: 0 10px 20px rgba(30,64,175,.26) !important;
}
body.page-slug-apply .wpcf7-submit:hover{
  filter: brightness(1.03);
  transform: translateY(-1px);
}
body.page-slug-apply .wpcf7-submit:active{
  transform: translateY(0);
}

/* spinner (CF7) */
body.page-slug-apply .wpcf7-spinner{
  margin-left: 10px;
}

/* ---------- Job summary card (if you keep it) ---------- */
.apply-jobcard{
  background:#fff;
  border:1px solid rgba(11,42,111,.10);
  border-radius:16px;
  padding:18px 18px 16px;
  box-shadow: 0 18px 48px rgba(11,42,111,.10);
  margin: 0 0 18px;
}
.apply-jobcard__badge{
  display:inline-flex;
  align-items:center;
  height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 12px;
  color:#0b2a6f;
  background: rgba(11,42,111,.08);
  margin-bottom: 10px;
}
.apply-jobcard__title{
  font-weight: 900;
  font-size: 18px;
  color:#0b2a6f;
  margin-bottom: 6px;
}
.apply-jobcard__company{
  font-weight: 800;
  color:#334155;
  margin-bottom: 10px;
}
.apply-jobcard__meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
}
.apply-jobcard__chip{
  display:inline-block;
  font-size:12px;
  font-weight:900;
  color:#111827;
  background:#f3f4f6;
  padding:6px 10px;
  border-radius:999px;
}
.apply-jobcard__link{
  font-weight: 900;
  color:#1e5ba8;
  text-decoration:none !important;
}
.apply-jobcard__link:hover{ text-decoration:underline !important; }

/* ---------- Responsive ---------- */
@media (max-width: 768px){
  .apply-form-wrapper{ padding: 0 14px; }
  body.page-slug-apply .wpcf7{ padding: 0 14px; }
  .two-col{ grid-template-columns: 1fr; }
  body.page-slug-apply .wpcf7-submit{ min-width: 100%; }
}
/* =========================================================
   APPLY PAGE – MODEL DESIGN FIX
   対象：求人応募フォーム（apply）
========================================================= */

/* ページ背景はうっすらグレー or 白 */
body.page-template-page-php {
  background: #f6f8fb;
}

/* フォーム全体：白カードに戻す */
.apply-form-wrapper {
  background: #ffffff !important;
  border-radius: 16px !important;
  padding: 32px 32px 36px !important;
  box-shadow: 0 18px 40px rgba(15, 40, 90, 0.12) !important;
  border: none !important;
}

/* セクションごとのグレー背景を殺す */
.apply-form-wrapper .form-section,
.apply-form-wrapper .applicant-info {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin-bottom: 28px;
}

/* セクション見出し（青バッジ）は維持 */
.apply-form-wrapper .form-section__head .badge {
  background: #1e5ba8 !important;
  color: #fff !important;
  font-weight: 800;
  border-radius: 6px;
}

/* 入力欄：白・角丸・薄枠 */
.apply-form-wrapper .form-control,
.apply-form-wrapper select,
.apply-form-wrapper textarea {
  background: #fff !important;
  border: 1px solid #dbe2ea !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  font-size: 15px;
}

/* フォーカス時 */
.apply-form-wrapper .form-control:focus,
.apply-form-wrapper select:focus,
.apply-form-wrapper textarea:focus {
  border-color: #1e5ba8 !important;
  box-shadow: 0 0 0 4px rgba(30, 91, 168, 0.15) !important;
  outline: none;
}

/* ===== CTA ボタン（最重要）===== */
.apply-form-wrapper .submit-area .btn,
.apply-form-wrapper .wpcf7-submit {
  background: #1e5ba8 !important;      /* ← モデルの青 */
  color: #ffffff !important;
  border: none !important;
  border-radius: 10px !important;
  height: 56px;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.04em;
  box-shadow: 0 10px 22px rgba(30, 91, 168, 0.35) !important;
  transition: all .25s ease;
}

/* CTA hover */
.apply-form-wrapper .submit-area .btn:hover,
.apply-form-wrapper .wpcf7-submit:hover {
  background: #174a8f !important;
  box-shadow: 0 14px 30px rgba(30, 91, 168, 0.45) !important;
  transform: translateY(-1px);
}

/* SP調整 */
@media (max-width: 767px) {
  .apply-form-wrapper {
    padding: 24px 18px 28px !important;
    border-radius: 14px !important;
  }
}
/* apply：サイドバー完全OFF（SWELL/other両対応） */
body.page-slug-apply #sidebar,
body.page-slug-apply .l-sidebar,
body.page-slug-apply #secondary,
body.page-slug-apply .widget-area,
body.page-id-11391 #sidebar,
body.page-id-11391 .l-sidebar,
body.page-id-11391 #secondary,
body.page-id-11391 .widget-area,
body.page-id-556 #sidebar,
body.page-id-556 .l-sidebar,
body.page-id-556 #secondary,
body.page-id-556 .widget-area {
  display: none !important;
}

/* 2カラム→1カラム（SWELLのgrid対策） */
body.page-slug-apply #content.l-content,
body.page-id-11391 #content.l-content,
body.page-id-556 #content.l-content {
  grid-template-columns: 1fr !important;
}
/* apply：フォーム全体を中央＆左右余白均等に（切れ対策） */
body.page-slug-apply .wpcf7,
body.page-slug-apply .apply-form-wrapper,
body.page-id-11391 .wpcf7,
body.page-id-11391 .apply-form-wrapper,
body.page-id-556 .wpcf7,
body.page-id-556 .apply-form-wrapper{
  max-width: 920px;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  box-sizing: border-box;
}
/* apply：ページ側のタイトル/見出しを消す（フォーム内の青帯だけ残す） */
body.page-slug-apply .c-pageTitle,
body.page-slug-apply .entry-header,
body.page-slug-apply h1.entry-title,
body.page-id-11391 .c-pageTitle,
body.page-id-11391 .entry-header,
body.page-id-11391 h1.entry-title,
body.page-id-556 .c-pageTitle,
body.page-id-556 .entry-header,
body.page-id-556 h1.entry-title{
  display:none !important;
}
/* =========================================================
   APPLYページだけ：サイドバー削除＋タイトル1つに（確実版）
   目印：.apply-form-wrapper（あなたのフォームに必ずある）
========================================================= */

/* 1) サイドバーを完全に消す（SWELL/Widget両方） */
#content:has(.apply-form-wrapper) #sidebar,
#content:has(.apply-form-wrapper) .l-sidebar,
#content:has(.apply-form-wrapper) #secondary,
#content:has(.apply-form-wrapper) .widget-area,
#content:has(.apply-form-wrapper) aside#secondary{
  display:none !important;
}

/* 2) 2カラム→1カラム（SWELLのgrid対策） */
#content:has(.apply-form-wrapper).l-content{
  grid-template-columns: 1fr !important;
}

/* 3) 左が切れる/余白がズレるのを防ぐ（全体を中央に） */
#content:has(.apply-form-wrapper).l-content,
#content:has(.apply-form-wrapper) .l-main,
#content:has(.apply-form-wrapper) .l-main__inner{
  width:100% !important;
  max-width:none !important;
}

/* 4) “ページ側タイトル”を消して、フォーム内（青帯）だけ残す */
#content:has(.apply-form-wrapper) .c-pageTitle,
#content:has(.apply-form-wrapper) .entry-header,
#content:has(.apply-form-wrapper) h1.entry-title{
  display:none !important;
}

/* 5) フォーム全体の幅を揃える（切れ防止） */
#content:has(.apply-form-wrapper) .apply-form-wrapper{
  max-width: 920px;
  margin: 0 auto !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  box-sizing: border-box;
}
/* =========================================================
   APPLY：フォーム全体を中央寄せ＆2カラムを中央に揃える
   目印：.apply-form-wrapper
========================================================= */

/* 1) 外側（フォームカード）をページ中央に */
#content:has(.apply-form-wrapper) .apply-form-wrapper{
  max-width: 920px;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 2) セクション内の“中ボックス”も中央寄せ */
#content:has(.apply-form-wrapper) .form-section{
  max-width: 920px;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 3) two-col（2カラム）を「中央寄せ」＆カラム幅をバランス良く */
#content:has(.apply-form-wrapper) .two-col{
  display: grid !important;
  grid-template-columns: minmax(260px, 1fr) minmax(260px, 1fr) !important;
  justify-content: center !important;   /* 全体を中央に */
  align-items: start !important;
  column-gap: 18px !important;
  row-gap: 14px !important;
  max-width: 780px;                    /* 中の2カラム幅を締める（中央に寄る） */
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 4) 1カラムの項目（都道府県など）も中央に合わせたい場合 */
#content:has(.apply-form-wrapper) .form-group:not(.two-col){
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
}

/* SPは1カラムに戻す */
@media (max-width: 767px){
  #content:has(.apply-form-wrapper) .two-col{
    grid-template-columns: 1fr !important;
    max-width: 100% !important;
  }
  #content:has(.apply-form-wrapper) .form-group:not(.two-col){
    max-width: 100% !important;
  }
}
/* =========================================================
   APPLY: 右の空き（2カラムの残骸）を消して中央寄せ（確実版）
   目印：.apply-form-wrapper
========================================================= */

/* 1) content（SWELLの2カラムレイアウト）を強制1カラム化 */
#content.l-content:has(.apply-form-wrapper){
  display: block !important;          /* ← grid/flexを潰す */
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
}

/* 2) サイドバー領域は確実に消す（念押し） */
#content.l-content:has(.apply-form-wrapper) #sidebar,
#content.l-content:has(.apply-form-wrapper) .l-sidebar,
#content.l-content:has(.apply-form-wrapper) #secondary,
#content.l-content:has(.apply-form-wrapper) .widget-area{
  display: none !important;
}

/* 3) メインを100%幅に */
#content.l-content:has(.apply-form-wrapper) .l-main,
#content.l-content:has(.apply-form-wrapper) .l-main__inner{
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 4) フォーム（カード）をページ中央に */
#content.l-content:has(.apply-form-wrapper) .apply-form-wrapper{
  max-width: 920px !important;
  margin: 0 auto !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  box-sizing: border-box;
}
body.page-slug-apply #content.l-content{
  display:block !important;
}
/* =========================================================
   APPLY: SWELLの #content が l-container を持っている版の解除
   DOM: <div id="content" class="l-content l-container" ...>
========================================================= */

/* 1) #content の max-width / padding を解除して全幅化 */
#content.l-content.l-container:has(.apply-form-wrapper){
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;

  /* gridを潰す（空カラム残り対策） */
  display: block !important;
}

/* 2) サイドバー領域は確実に殺す */
#content.l-content.l-container:has(.apply-form-wrapper) #sidebar,
#content.l-content.l-container:has(.apply-form-wrapper) .l-sidebar{
  display:none !important;
}

/* 3) メインも全幅に */
#content.l-content.l-container:has(.apply-form-wrapper) .l-mainContent,
#content.l-content.l-container:has(.apply-form-wrapper) .l-mainContent__inner,
#content.l-content.l-container:has(.apply-form-wrapper) .l-main,
#content.l-content.l-container:has(.apply-form-wrapper) .l-main__inner{
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 4) フォーム本体を中央に */
#content.l-content.l-container:has(.apply-form-wrapper) .apply-form-wrapper{
  max-width: 920px !important;
  margin: 0 auto !important;
  padding: 0 16px !important;
  box-sizing: border-box;
}
/* 求人応募フォーム専用スタイル */
.wpcf7-form {
    max-width: 100%;
}

/* 入力済み項目（グレー背景で読み取り専用風） */
.job-info-readonly {
    background: #f5f5f5;
    padding: 12px 16px;
    border-radius: 6px;
    margin-bottom: 8px;
    border: 1px solid #e0e0e0;
    color: #666;
    font-size: 15px;
}

/* 入力フィールド（白背景でアクティブ感） */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="number"],
.wpcf7-form select,
.wpcf7-form textarea {
    background: #ffffff;
    border: 2px solid #0066cc;
    border-radius: 6px;
    padding: 12px 16px;
    width: 100%;
    font-size: 15px;
    transition: all 0.3s ease;
}

.wpcf7-form input:focus,
.wpcf7-form select:focus,
.wpcf7-form textarea:focus {
    border-color: #0052a3;
    box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.1);
    outline: none;
}

/* セクション見出し */
.form-section-title {
    background: #0066cc;
    color: white;
    padding: 12px 20px;
    border-radius: 6px;
    font-size: 16px;
    font-weight: bold;
    margin: 30px 0 20px 0;
}

/* ラジオボタンのスタイリング */
.exp-radio-wrapper {
    display: flex;
    gap: 24px;
    margin-top: 10px;
}

.exp-radio {
    display: flex;
    align-items: center;
    gap: 8px;
}

.exp-radio input[type="radio"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
    accent-color: #0066cc;
}

.exp-radio .wpcf7-list-item-label {
    font-size: 15px;
    cursor: pointer;
    user-select: none;
}

/* フィールドラベル */
.wpcf7-form label {
    display: block;
    font-weight: 600;
    margin-bottom: 8px;
    color: #333;
    font-size: 15px;
}

/* 必須マーク */
.required-mark {
    color: #dc3545;
    font-size: 13px;
    margin-left: 4px;
}

/* 2カラムレイアウト（氏名・年齢など） */
.form-row-2col {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}

@media (max-width: 768px) {
    .form-row-2col {
        grid-template-columns: 1fr;
        gap: 15px;
    }
}

/* テキストエリア */
.wpcf7-form textarea {
    min-height: 150px;
    resize: vertical;
}

/* 送信ボタン */
.wpcf7-form .wpcf7-submit {
    background: #0066cc;
    color: white;
    padding: 16px 48px;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.3s ease;
    display: block;
    margin: 30px auto;
}

.wpcf7-form .wpcf7-submit:hover {
    background: #0052a3;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 102, 204, 0.3);
}
/* =========================================================
   APPLY: サイドバーが復活しても絶対に殺す（最終上書き）
   ※必ずCSSの一番下に置く
========================================================= */

/* 対象ページスコープ（slug/idどれで来ても当たるように） */
body.page-slug-apply,
body.page-id-11391,
body.page-id-556 {}

/* 1) #content の2カラム構造を強制解除（grid/flexを潰す） */
body.page-slug-apply #content.l-content,
body.page-slug-apply #content.l-content.l-container,
body.page-id-11391 #content.l-content,
body.page-id-11391 #content.l-content.l-container,
body.page-id-556 #content.l-content,
body.page-id-556 #content.l-content.l-container{
  display:block !important;                 /* ← これが効く */
  grid-template-columns: 1fr !important;    /* 念押し */
  column-gap: 0 !important;
  max-width:none !important;
  width:100% !important;
}

/* 2) サイドバーを “表示+幅” 両方で完全に殺す（復活対策） */
body.page-slug-apply #sidebar,
body.page-slug-apply .l-sidebar,
body.page-slug-apply #secondary,
body.page-slug-apply aside#secondary,
body.page-slug-apply .widget-area,
body.page-id-11391 #sidebar,
body.page-id-11391 .l-sidebar,
body.page-id-11391 #secondary,
body.page-id-11391 aside#secondary,
body.page-id-11391 .widget-area,
body.page-id-556 #sidebar,
body.page-id-556 .l-sidebar,
body.page-id-556 #secondary,
body.page-id-556 aside#secondary,
body.page-id-556 .widget-area{
  display:none !important;
  width:0 !important;
  max-width:0 !important;
  flex: 0 0 0 !important;
}

/* 3) メイン側を100%に固定（右の空き残り対策） */
body.page-slug-apply .l-main,
body.page-slug-apply .l-main__inner,
body.page-slug-apply .l-mainContent,
body.page-slug-apply .l-mainContent__inner,
body.page-id-11391 .l-main,
body.page-id-11391 .l-main__inner,
body.page-id-11391 .l-mainContent,
body.page-id-11391 .l-mainContent__inner,
body.page-id-556 .l-main,
body.page-id-556 .l-main__inner,
body.page-id-556 .l-mainContent,
body.page-id-556 .l-mainContent__inner{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
}

/* 4) まだ残る場合の最終手段：サイドバー用カラムをDOM上から無効化 */
body.page-slug-apply .l-content > .l-sidebar,
body.page-id-11391 .l-content > .l-sidebar,
body.page-id-556 .l-content > .l-sidebar{
  display:none !important;
}
/* ある/なし をボックス化 */
.exp-radio-wrapper .wpcf7-radio{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.exp-radio-wrapper .wpcf7-list-item{
  margin:0 !important;
}

.exp-radio-wrapper input[type="radio"]{
  position:absolute;
  opacity:0;
}

.exp-radio-wrapper label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width: 140px;
  padding: 12px 16px;
  border-radius: 10px;
  border: 2px solid #1e5ba8;
  background:#fff;
  color:#1e5ba8;
  font-weight: 900;
  cursor:pointer;
}

.exp-radio-wrapper label:has(input:checked){
  background:#1e5ba8;
  color:#fff;
}
/* =========================================================
   APPLY：経験(ある/なし)を “ボックス2択” にする（確実版）
   DOM: .wpcf7-form-control-wrap.experience > .wpcf7-list-item > label > input + .wpcf7-list-item-label
========================================================= */

/* ラップ全体を横並び */
#content:has(.apply-form-wrapper) .wpcf7-form-control-wrap.experience{
  display:flex !important;
  gap:12px !important;
  flex-wrap:wrap;
}

/* list-itemの余白を消す */
#content:has(.apply-form-wrapper) .wpcf7-form-control-wrap.experience .wpcf7-list-item{
  margin:0 !important;
}

/* input（丸）を隠す */
#content:has(.apply-form-wrapper) .wpcf7-form-control-wrap.experience input[type="radio"]{
  position:absolute !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* label を “箱” にする */
#content:has(.apply-form-wrapper) .wpcf7-form-control-wrap.experience label{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width: 160px;
  height: 46px;
  padding: 0 18px !important;
  border-radius: 10px !important;
  border: 2px solid #1e5ba8 !important;
  background:#fff !important;
  color:#1e5ba8 !important;
  font-weight:900 !important;
  cursor:pointer !important;
  box-shadow: 0 6px 16px rgba(30,91,168,.10);
  transition: all .2s ease;
  position:relative !important;
}

/* 文字も中央 */
#content:has(.apply-form-wrapper) .wpcf7-form-control-wrap.experience .wpcf7-list-item-label{
  margin:0 !important;
  padding:0 !important;
}

/* 選択中（checked）を “塗りつぶし” に */
#content:has(.apply-form-wrapper) .wpcf7-form-control-wrap.experience label:has(input:checked){
  background:#1e5ba8 !important;
  color:#fff !important;
  box-shadow: 0 10px 24px rgba(30,91,168,.25);
  transform: translateY(-1px);
}

/* hover */
@media (hover:hover) and (pointer:fine){
  #content:has(.apply-form-wrapper) .wpcf7-form-control-wrap.experience label:hover{
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(30,91,168,.18);
  }
}

/* SPでは2つをちょうど半分 */
@media (max-width: 767px){
  #content:has(.apply-form-wrapper) .wpcf7-form-control-wrap.experience{
    gap:10px !important;
  }
  #content:has(.apply-form-wrapper) .wpcf7-form-control-wrap.experience label{
    min-width: calc(50% - 5px);
  }
}
#content:has(.apply-form-wrapper) .wpcf7-form-control-wrap.experience input[type="radio"]{
  appearance:none !important;
  -webkit-appearance:none !important;
}
/* =========================================================
   APPLY：応募求人（dynamictext）を「入力済み」っぽく見せる
   ※ .apply-jobcard は input ではなくテキストなのでここを直接装飾する
========================================================= */

.apply-jobcard{
  background: linear-gradient(180deg, #f6f9ff 0%, #ffffff 60%) !important;
  border: 1px solid rgba(11,42,111,.14) !important;
  border-radius: 16px !important;
  padding: 18px 18px 16px !important;
  box-shadow: 0 18px 48px rgba(11,42,111,.10) !important;
}

/* 「応募求人（自動入力）」バッジは強めに */
.apply-jobcard__badge{
  display:inline-flex;
  align-items:center;
  height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 12px;
  color:#0b2a6f;
  background: rgba(11,42,111,.10);
  margin-bottom: 12px;
}

/* 動的テキスト（求人名・会社名）を “入力済み” 風に */
.apply-jobcard__title,
.apply-jobcard__company{
  position: relative;
  display:block;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid rgba(30,91,168,.28);
  font-weight: 900;
  color: #0b2a6f;
  background:
    repeating-linear-gradient(
      -45deg,
      rgba(30,91,168,.07) 0,
      rgba(30,91,168,.07) 8px,
      rgba(30,91,168,.03) 8px,
      rgba(30,91,168,.03) 16px
    );
}

/* 2行目（会社名）は少し落ち着かせる */
.apply-jobcard__company{
  margin-top: 10px;
  font-weight: 800;
  color:#334155;
}

/* メタ（求人ID / URL） */
.apply-jobcard__meta{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  margin-top: 12px;
}

/* 求人IDチップ */
.apply-jobcard__chip{
  display:inline-flex;
  align-items:center;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 900;
  color:#0b2a6f;
  background: rgba(11,42,111,.08);
  border: 1px solid rgba(11,42,111,.12);
}

/* URLは長いので省略しつつ “入力済み” ブロック化 */
.apply-jobcard__url{
  display:block;
  max-width: 52%;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(30,91,168,.20);
  background: rgba(30,91,168,.06);
  color:#1e5ba8;
  font-weight: 900;
  font-size: 12px;
  overflow:hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
/* =========================================================
  応募フォーム：自動入力（求人情報）を強調
========================================================= */

/* 応募求人（自動入力）ブロック全体 */
.apply-jobcard,
.apply-jobcard *{
  font-weight: 700 !important;
}

/* CF7 readonly input / text */
.apply-jobcard input[readonly],
.apply-jobcard textarea[readonly]{
  font-weight: 700 !important;
  color: #003a8f; /* 少し濃い青（任意） */
}

/* dynamictext が div で出ている場合 */
.apply-jobcard__title,
.apply-jobcard__company,
.apply-jobcard__meta,
.job-info-readonly{
  font-weight: 700 !important;
}
.apply-jobcard{
  background: linear-gradient(135deg, #f5f9ff, #ffffff);
  border-left: 4px solid #0b63ce;
}

.apply-jobcard__badge{
  font-weight: 800;
  letter-spacing: .05em;
}