:root{
  --text:#222;
  --muted:#666;
  --accent:#1a73e8;
  --badge-red:#d32f2f;
  --badge-width:220px;   /* バッジ幅（全バッジを同一幅に） */
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, Helvetica, Arial, sans-serif;
}

*{box-sizing:border-box}
body{
  margin:0;
  padding:24px;
  color:var(--text);
  line-height:2;
  -webkit-font-smoothing:antialiased;
  background: #fff;
}

.recruit{
  max-width:1400px;
  margin:0 auto;
  padding: 0;
}

/* ヘッダ用のプレーンテキスト（背景・枠なし） */
.intro-box{
  display:flex;
  justify-content:center; /* 横方向中央寄せ */
  margin: 18px 0; /* 上下の余白 */
}

.intro-inner{
  max-width:760px;
  width:100%;
  padding:0;             /* 内側余白を削除 */
  border: none;         /* 枠を削除 */
  border-radius:0;
  background: transparent; /* 背景を透明に */
  box-shadow: none;     /* 影を削除 */
  text-align:left;
  line-height:1.6;
  color:var(--text);
  font-size:15px;
}

/* hero 見出し（中央） */
.hero{
  text-align:center;
  margin-bottom:18px;
}

.job-title{
  margin:0;
  font-size:20px;
  font-weight:700;
  color:#000; /* 見出しを黒に */
}

/* 全体の余白調整（枠・背景なし） */
.card{
  padding:0;
  margin-bottom:18px;
}

.section-title{
  margin:8px 0 12px 0;
  font-size:18px;
  color:#123;
  padding-bottom:0;
}

/* 行レイアウト（ラベル＋本文） */
.row{
  display:flex;
  gap:16px;
  align-items:flex-start;
  padding:8px 0;
}

.col{
  padding:0;
}

/* 左列：親要素で幅を確保。区切り線は無効（なし） */
.col.label{
  width:var(--badge-width);
  min-width:var(--badge-width);
  padding:0;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* バッジ：親の幅に合わせ、文字を中央寄せ */
.label-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  background:var(--badge-red);
  color:#fff;
  padding:6px 12px;
  border-radius:4px;
  font-weight:600;
  line-height:1;
  text-align:center;
  white-space:normal;
}

/* 値側 */
.col.value{
  flex:1;
  padding:0;
  margin-right:10px;
}

.link{
  color:var(--accent);
  text-decoration:underline;
}

.subcard{
  padding:8px 0;
  margin-bottom:8px;
  background:transparent;
  border:none;
}

.sub-title{
  margin:0 0 8px 0;
  font-size:16px;
  color:#0f1724;
}

ul,ol{
  margin:8px 0 0 18px;
  padding:0;
}

.persona > li{margin-bottom:10px}
.benefits li{margin-bottom:6px}
.process li{margin-bottom:12px}

.contact{
  margin-top:8px;
  padding:0;
}

/*区切り線*/
.full-width {
    border: 0;
    height: 1px;
    background: linear-gradient(to right, transparent, #ccc, transparent);
    margin: 0.5rem 0;
    width: 100%;
  }
/* 親要素のパディングを無視して画面端まで伸ばしたい場合 */
.edge-to-edge {
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    width: 100vw;
  }

/* レスポンシブ: 小さい画面ではラベル幅を縮小し、縦並びに */
@media (max-width:700px){
  :root{ --badge-width:160px; } /* 小画面向けに幅を縮小（上書き） */
  .row{flex-direction:column}
  .col.label{width:auto; min-width:0; justify-content:flex-start}
  .label-badge{width:auto}
  .recruit-page{padding:12px}
}