@charset "UTF-8";
/* =========================================
   Recruit section shared styles
========================================= */
.rc-mv {
  position: relative;
  height: clamp(80vh, 100vh, 1000px);
  overflow: hidden;
  display: flex;
  align-items: center;
  padding: 0;
  background: #1f2226;
}
.rc-mv .bg {
  position: absolute; inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0.55;
}
.rc-mv::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.65) 100%);
}
.rc-mv .container {
  position: relative;
  z-index: 2;
  color: #fff;
  text-align: left;
  /* 左端に張り付けるため max-width を解除 + 左 padding のみ */
  max-width: none;
  margin: 0;
  padding-left: clamp(40px, 6vw, 112px);
  padding-right: clamp(40px, 6vw, 112px);
}
.rc-mv .container > * { margin-left: 0; margin-right: auto; max-width: 720px; }
.rc-mv .breadcrumb {
  display: flex; align-items: center; gap: 12px;
  font-family: var(--font-en);
  font-size: 12px; letter-spacing: 0.28em;
  color: rgba(255,255,255,0.75);
  margin-bottom: clamp(40px, 5vw, 64px);
}
.rc-mv .breadcrumb a { color: rgba(255,255,255,0.75); }
.rc-mv .breadcrumb span { color: rgba(255,255,255,0.4); }
.rc-mv .small {
  font-family: var(--font-serif-en);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(18px, 1.8vw, 26px);
  display: block;
  color: rgba(255,255,255,0.92);
  margin-bottom: 18px;
  letter-spacing: 0.04em;
}
.rc-mv .big {
  font-family: var(--font-serif-jp);
  font-weight: 500;
  font-size: clamp(28px, 3.6vw, 60px);
  line-height: 1.5;
  color: #fff;
  letter-spacing: 0.1em;
  margin-bottom: clamp(24px, 2.6vw, 32px);
}
.rc-mv h1 {
  font-family: var(--font-en);
  font-size: clamp(12px, 1vw, 14px);
  font-weight: 400;
  letter-spacing: 0.28em;
  color: rgba(255,255,255,0.85);
  margin: clamp(20px, 2.4vw, 32px) 0 0;
}

/* Sub-page hero (smaller) */
.rc-page-hero {
  padding: clamp(160px, 22vw, 280px) 0 clamp(60px, 8vw, 100px);
  background: #ffffff !important;
  border-bottom: 1px solid var(--c-line);
}
.rc-page-hero .breadcrumb {
  display: flex; align-items: center; gap: 12px;
  font-family: var(--font-en);
  font-size: 12px; letter-spacing: 0.2em;
  color: var(--c-sub);
  margin-bottom: 50px;
}
.rc-page-hero .breadcrumb span { color: var(--c-line); }
.rc-page-hero .en-label {
  font-family: var(--font-en);
  font-size: clamp(36px, 4.6vw, 60px);
  font-weight: 400;
  letter-spacing: 0.02em;
  color: var(--c-black);
  line-height: 1.05;
  display: block;
  margin-bottom: 18px;
}
.rc-page-hero h1 {
  font-family: var(--font-serif-jp);
  font-size: clamp(20px, 2.4vw, 28px);
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.08em;
  color: var(--c-black);
  margin-top: 8px;
}
.rc-page-hero .lead {
  margin-top: 28px;
  max-width: 720px;
  font-size: 15px;
  line-height: 2.2;
  color: var(--c-text);
  letter-spacing: 0.06em;
}

/* Section-spanning recruit nav (sticky-ish) */
.rc-tabs {
  background: var(--c-bg-soft);
  border-bottom: 1px solid var(--c-line);
  position: sticky;
  top: 70px;
  z-index: 50;
}
.rc-tabs-inner {
  display: flex;
  flex-wrap: wrap;
  gap: 4px clamp(20px, 3vw, 36px);
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--pad-x);
  overflow-x: auto;
}
.rc-tabs a {
  padding: 18px 0;
  font-size: 12px;
  letter-spacing: 0.12em;
  color: var(--c-sub);
  white-space: nowrap;
  position: relative;
  transition: color .25s ease;
}
.rc-tabs a:hover { color: var(--c-black); opacity: 1; }
.rc-tabs a.is-active {
  color: var(--c-black);
  font-weight: 500;
}
.rc-tabs a.is-active::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  bottom: -1px;
  height: 1px;
  background: var(--c-black);
}

/* Editorial body for recruit */
.rc-editorial { background: #ffffff; padding: clamp(50px, 7vw, 90px) 0; }
.rc-editorial-head { max-width: 920px; margin: 0 auto clamp(24px, 3vw, 40px); text-align: center; }
.rc-editorial-head .label {
  font-family: var(--font-en);
  font-size: 12px;
  letter-spacing: 0.32em;
  color: var(--c-sub);
  margin-bottom: 24px;
  display: inline-flex;
  align-items: center;
  gap: 14px;
}
.rc-editorial-head .label::before, .rc-editorial-head .label::after {
  content: '';
  width: 32px; height: 1px;
  background: var(--c-sub);
}
.rc-editorial-head h2 {
  font-family: var(--font-serif-jp);
  font-size: clamp(22px, 3vw, 36px);
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.1em;
  color: var(--c-black);
}
.rc-editorial-body {
  max-width: 820px;
  margin: 0 auto;
  text-align: center;
}
.rc-editorial-body p {
  font-size: 15px;
  line-height: 2.4;
  margin-bottom: 20px;
  color: var(--c-text);
  letter-spacing: 0.06em;
}

/* Photo band (same idea as about page) */
.rc-photo-band {
  position: relative;
  overflow: hidden;
  background: var(--c-bg-soft);
}
.rc-photo-band img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rc-photo-band.aspect-21x9 { aspect-ratio: 21 / 9; }
.rc-photo-band.aspect-16x9 { aspect-ratio: 24 / 9; }

/* パララックス帯：JS が <img> に translate3d を適用するため、
   コンテナは overflow:hidden を維持しつつ、内側の img は scale(1.12) で
   上下にはみ出る分を確保する（CSS だけでは scale を適用できないので JS 側で同時に処理） */
[data-parallax-band] { overflow: hidden; }
[data-parallax-band] img {
  /* JS が transform を上書きするまで、初期描画でもある程度の余白を持たせる */
  transform: scale(1.12);
}

/* Card grid */
/* /recruit/ TOP の 3 値カード — company-related-grid と同じ「写真+黒オーバーレイ+白文字」型 */
.rc-card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(20px, 2.4vw, 32px);
  max-width: 1200px;
  margin: 0 auto;
  border: 0;
}
.rc-card-grid .card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  min-height: clamp(360px, 38vw, 480px);
  overflow: hidden;
  background: var(--c-black);
  border: 0;
  padding: clamp(32px, 3.6vw, 48px);
  isolation: isolate;
  color: #ffffff;
}
.rc-card-grid .card::before {
  content: '';
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  z-index: 1;
  transition: transform 1.2s cubic-bezier(.2, .8, .2, 1);
}
.rc-card-grid .card:nth-child(1)::before { background-image: url('/wp-content/themes/apricot-2026/assets/photos/concept-1.jpg'); }
.rc-card-grid .card:nth-child(2)::before { background-image: url('/wp-content/themes/apricot-2026/assets/photos/meeting/meeting-01.jpg'); }
.rc-card-grid .card:nth-child(3)::before { background-image: url('/wp-content/themes/apricot-2026/assets/photos/branding/branding-01.jpg'); }
.rc-card-grid .card:nth-child(4)::before { background-image: url('/wp-content/themes/apricot-2026/assets/photos/company/company-04.jpg'); }
.rc-card-grid .card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(31, 34, 38, 0.62);
  z-index: 2;
  transition: background .35s ease;
}
.rc-card-grid .card:hover::before { transform: scale(1.06); }
.rc-card-grid .card:hover::after  { background: rgba(31, 34, 38, 0.5); }

.rc-card-grid .card .num,
.rc-card-grid .card .en,
.rc-card-grid .card h3,
.rc-card-grid .card p {
  position: relative;
  z-index: 3;
  color: #ffffff;
  background: transparent;
}
.rc-card-grid .card .num {
  display: block;
  font-family: var(--font-en);
  font-size: 12px;
  letter-spacing: 0.28em;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: clamp(28px, 3vw, 40px);
}
.rc-card-grid .card .en {
  display: block;
  font-family: var(--font-serif-en);
  font-style: italic;
  font-size: clamp(22px, 2.4vw, 28px);
  color: rgba(255, 255, 255, 0.78);
  margin-bottom: 14px;
}
.rc-card-grid .card h3 {
  font-family: var(--font-serif-jp);
  font-size: clamp(18px, 2vw, 22px);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.08em;
  color: #ffffff;
  margin: 0 0 18px;
  padding: 0;
  border: 0;
}
.rc-card-grid .card p {
  font-size: clamp(12px, 1vw, 14px);
  line-height: 2;
  letter-spacing: 0.04em;
  color: rgba(255, 255, 255, 0.78);
  margin: 0;
}
@media (max-width: 800px) {
  .rc-card-grid { grid-template-columns: 1fr; }
  .rc-card-grid .card { min-height: 320px; }
}

/* Recruit sub-pages list — service-list（home の SERVICE 6 カード）と同じ見せ方
   大きい透過 italic 番号 / Performance 風 EN ラベル / 中央寄せ本文 / MORE + 64px 円形矢印 */
.rc-next-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(16px, 1.6vw, 24px);
  border: 0;
  margin-top: clamp(24px, 3vw, 40px);
}
.rc-next {
  position: relative;
  background: #ffffff;
  border: 0;
  border-radius: 14px;
  box-shadow: 0 12px 30px -16px rgba(0, 0, 0, 0.18), 0 2px 6px -3px rgba(0, 0, 0, 0.08);
  padding: clamp(40px, 4vw, 56px);
  display: flex;
  flex-direction: column;
  text-align: center;
  transition: box-shadow .3s ease, transform .35s cubic-bezier(.2,.8,.2,1);
  overflow: hidden;
}
.rc-next:hover {
  box-shadow: 0 18px 36px -14px rgba(0, 0, 0, 0.22), 0 3px 8px -2px rgba(0, 0, 0, 0.1);
  transform: translateY(-4px);
  opacity: 1;
}
.rc-next .num {
  font-family: var(--font-en);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(36px, 3.6vw, 56px);
  line-height: 1;
  letter-spacing: 0.02em;
  color: rgba(0, 0, 0, 0.18);
  display: block;
  margin: 0 0 10px;
}
.rc-next .en {
  font-family: var(--font-en);
  font-size: 12px;
  letter-spacing: 0.2em;
  color: rgba(0, 0, 0, 0.5);
  font-weight: 400;
  text-transform: uppercase;
  margin-bottom: 14px;
  display: block;
}
.rc-next .jp {
  font-size: clamp(15px, 1.4vw, 17px);
  font-weight: 500;
  color: var(--c-black);
  letter-spacing: 0.06em;
  line-height: 1.6;
  display: block;
  margin-bottom: clamp(20px, 2.4vw, 32px);
}
.rc-next .arr {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-family: var(--font-en);
  font-size: 12px;
  letter-spacing: 0.2em;
  color: rgba(0, 0, 0, 0.6);
  align-self: center;
}
.rc-next .arr::after {
  content: '';
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--c-black) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='none' stroke='white' stroke-width='1.2'><path d='M5 11h12M13 6l5 5-5 5'/></svg>") center/16px no-repeat;
  transition: background-color .3s ease, transform .3s ease;
  flex-shrink: 0;
}
.rc-next:hover .arr::after {
  background-color: #1f1a16;
  transform: translateX(3px);
}
@media (max-width: 900px) {
  .rc-next-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .rc-next-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .rc-next-grid { grid-template-columns: 1fr; }
  .rc-next { border-right: none !important; }
}

/* =====================================================
 * RECRUIT 2-カラムレイアウト（左追従サイドナビ + 右コンテンツ）
 * fieldcorp.jp/about/ を参考に、recruit 配下のすべてのページに共通適用。
 * ===================================================== */
.rc-page {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 0;
  background: var(--c-bg);
  padding-top: 80px; /* fixed header の下に余白 */
}
.rc-sidebar {
  position: sticky;
  top: 80px;
  align-self: start;
  height: calc(100vh - 80px);
  border-right: 1px solid var(--c-line);
  background: var(--c-bg-soft);
  padding: clamp(40px, 5vw, 60px) 28px clamp(24px, 4vw, 40px);
  display: flex;
  flex-direction: column;
}
.rc-sidebar-inner {
  display: flex;
  flex-direction: column;
  gap: 32px;
  height: 100%;
}
.rc-sidebar-head .en-label {
  font-family: var(--font-en);
  font-size: 22px;
  letter-spacing: 0.16em;
  color: var(--c-black);
  display: block;
  margin-bottom: 6px;
}
.rc-sidebar-head .jp {
  font-size: 12px;
  letter-spacing: 0.18em;
  color: var(--c-sub);
  margin: 0;
}
.rc-sidebar-nav {
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid var(--c-line);
  flex: 1;
  overflow-y: auto;
}
.rc-sidebar-nav li {
  border-bottom: 1px solid var(--c-line);
}
.rc-sidebar-nav li a {
  display: block;
  padding: 14px 8px 14px 16px;
  position: relative;
  text-decoration: none;
  transition: padding .25s ease, color .25s ease;
}
.rc-sidebar-nav li a::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 1px;
  background: var(--c-black);
  transition: width .35s ease;
}
.rc-sidebar-nav li a:hover { color: var(--c-black); }
.rc-sidebar-nav li a:hover::before { width: 12px; }
.rc-sidebar-nav li a:hover { padding-left: 24px; }
.rc-sidebar-nav li.is-current a {
  padding-left: 24px;
  color: var(--c-black);
}
.rc-sidebar-nav li.is-current a::before {
  width: 16px;
}
.rc-sidebar-nav li.is-current a .en {
  color: var(--c-black);
  font-weight: 500;
}
.rc-sidebar-nav .en {
  display: block;
  font-family: var(--font-en);
  font-size: 12px;
  letter-spacing: 0.16em;
  color: var(--c-sub);
  line-height: 1.4;
  margin-bottom: 3px;
}
.rc-sidebar-nav .jp {
  display: block;
  font-size: 13px;
  letter-spacing: 0.06em;
  color: var(--c-text);
  line-height: 1.5;
}
.rc-sidebar-cta {
  border-top: 1px solid var(--c-line);
  padding-top: 24px;
}
.rc-sidebar-cta .btn-pill {
  display: inline-flex;
  align-items: center;
  width: 100%;
  justify-content: center;
  padding: 12px 18px;
  background: var(--c-black);
  color: #fff;
  border-radius: 999px;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-decoration: none;
  transition: opacity .25s ease;
}
.rc-sidebar-cta .btn-pill:hover { opacity: 0.85; }

.rc-main {
  min-width: 0;
  background: transparent;
}
.rc-main > section { padding: clamp(48px, 6vw, 80px) 0; }
.rc-main > section:first-child { padding-top: clamp(40px, 5vw, 64px); }

/* サイドバーがあるので、流し込み済み HTML 内の旧水平ナビは非表示にする
   （rc-tabs / rc-link-nav は sidebar と重複） */
.rc-page .rc-tabs,
.rc-page .rc-link-nav,
.rc-page .rc-meta-nav,
.rc-page .rc-page-hero .rc-tabs { display: none !important; }
.rc-page .rc-page-hero { padding-top: clamp(40px, 4vw, 80px); padding-bottom: clamp(40px, 4vw, 80px); border-bottom: 0; }
.rc-page .rc-page-hero .lead { display: none; }

/* ===== エントリーフォーム（rc-page 配下） =====
   ページ本文に埋め込まれた旧 <style> ブロック（.entry-form { display: grid; grid-template-columns: 220px 1fr; ... }）と
   .field { display: contents } が衝突するので、ここで強く上書きする */
.rc-page .entry-form,
.rc-page .entry-form.entry-form {
  display: block !important;
  grid-template-columns: none !important;
  max-width: 760px;
  margin: 0 auto;
  padding: clamp(24px, 3vw, 40px) clamp(16px, 3vw, 32px);
  border-top: none;
}
.rc-page .entry-form .field {
  display: grid !important;
  grid-template-columns: 200px 1fr !important;
  gap: clamp(16px, 3vw, 32px) !important;
  align-items: start !important;
  padding: 22px 0 !important;
  border-bottom: 1px solid var(--c-line) !important;
  border-top: none !important;
}
.rc-page .entry-form .field:first-child { border-top: 1px solid var(--c-line) !important; }
.rc-page .entry-form .submit-row {
  display: block !important;
  grid-column: auto !important;
  text-align: center;
  padding: clamp(24px, 4vw, 40px) 0 0 !important;
  margin-top: 0 !important;
  border-bottom: none !important;
}
.rc-page .entry-form .field > label {
  font-size: 15px;
  font-weight: 500;
  color: var(--c-black);
  letter-spacing: 0.06em;
  padding-top: 18px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  line-height: 1.5;
}
.rc-page .entry-form .field > label .req,
.rc-page .entry-form .field > label .opt {
  font-size: 12px;
  color: #fff;
  background: var(--c-black);
  letter-spacing: 0.06em;
  padding: 3px 8px;
  border-radius: 3px;
  font-weight: 400;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  margin-top: 4px;
}
.rc-page .entry-form .field .input { min-width: 0; }
.rc-page .entry-form .field input[type="text"],
.rc-page .entry-form .field input[type="email"],
.rc-page .entry-form .field input[type="tel"],
.rc-page .entry-form .field select,
.rc-page .entry-form .field textarea {
  width: 100%;
  padding: 16px 18px;
  background: #fafafa;
  border: 1px solid var(--c-line);
  border-radius: 4px;
  font: inherit;
  font-size: 16px;
  color: var(--c-text);
  letter-spacing: 0.04em;
  box-sizing: border-box;
  transition: background .15s ease, border-color .15s ease;
}
.rc-page .entry-form .field input:hover,
.rc-page .entry-form .field select:hover,
.rc-page .entry-form .field textarea:hover { background: #f4f4f4; }
.rc-page .entry-form .field input:focus,
.rc-page .entry-form .field select:focus,
.rc-page .entry-form .field textarea:focus {
  outline: none;
  background: #ffffff;
  border-color: var(--c-black);
}
.rc-page .entry-form .field input::placeholder,
.rc-page .entry-form .field textarea::placeholder { color: #a0a0a0; }
.rc-page .entry-form .field textarea { min-height: 160px; resize: vertical; line-height: 1.9; }
.rc-page .entry-form .field .check-row {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-start;
}
.rc-page .entry-form .field .check-row label.option {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  cursor: pointer;
  letter-spacing: 0.04em;
  color: var(--c-text);
  white-space: nowrap;
  width: auto;
  text-align: left;
}
.rc-page .entry-form .field .check-row input[type="radio"],
.rc-page .entry-form .field .check-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0;
  flex-shrink: 0;
  accent-color: var(--c-black);
}
.rc-page .entry-form .submit-row {
  text-align: center;
  padding: clamp(24px, 4vw, 40px) 0 0;
}
.rc-page .entry-form .submit-row button,
.rc-page .entry-form button[type="submit"] {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 14px 36px;
  background: var(--c-black);
  color: #fff;
  border: none;
  border-radius: 999px;
  font: inherit;
  font-size: 13px;
  letter-spacing: 0.16em;
  cursor: pointer;
  transition: opacity .25s ease;
}
.rc-page .entry-form .submit-row button:hover { opacity: 0.85; }
@media (max-width: 700px) {
  .rc-page .entry-form .field {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 18px 0;
  }
  .rc-page .entry-form .field > label { padding-top: 0; }
}

@media (max-width: 1000px) {
  .rc-page { grid-template-columns: minmax(0, 1fr); }
  .rc-sidebar {
    position: static;
    height: auto;
    border-right: none;
    border-bottom: 0px solid var(--c-line);
    padding: 50px 0 16px;
  }
  .rc-sidebar-inner { gap: 8px; }
  .rc-sidebar-head { display: none; }
  .rc-sidebar-nav {
    display: flex;
    flex-wrap: nowrap;
    gap: 0;
    border-top: 1px solid var(--c-line);
    border-bottom: 1px solid var(--c-line);
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    padding: 0 clamp(20px, 5vw, 40px);
  }
  .rc-sidebar-nav::-webkit-scrollbar { display: none; }
  .rc-sidebar-nav li {
    border-bottom: none;
    flex-shrink: 0;
  }
  .rc-sidebar-nav li a {
    padding: 14px 16px 14px 0;
    white-space: nowrap;
  }
  .rc-sidebar-nav li a::before { display: none; }
  .rc-sidebar-nav .en { display: none; }
  .rc-sidebar-nav .jp { display: inline; font-size: 13px; }
  .rc-sidebar-nav li.is-current a {
    padding-left: 0;
    border-bottom: 1px solid var(--c-black);
  }
  .rc-sidebar-cta { display: none; }
}

/* =====================================================
 * INTERVIEW 詳細ページ
 * ===================================================== */
.iv-mv {
  padding: clamp(40px, 5vw, 64px) 0 clamp(24px, 3vw, 40px);
  background: #ffffff;
}
.iv-mv .breadcrumb { margin-bottom: 28px; }
.iv-meta-top {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 20px;
  font-family: var(--font-en);
  font-size: 12px;
  letter-spacing: 0.18em;
  color: var(--c-sub);
}
.iv-meta-top .iv-dept,
.iv-meta-top .iv-role {
  padding: 5px 12px;
  border: 1px solid var(--c-line);
  background: var(--c-bg-soft);
}
.iv-title {
  font-family: var(--font-serif-jp);
  font-size: clamp(26px, 3.5vw, 40px);
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: 0.04em;
  color: var(--c-black);
  margin: 0 0 24px;
}
.iv-author {
  font-size: 14px;
  letter-spacing: 0.06em;
  color: var(--c-text);
}
.iv-author .iv-nick {
  color: var(--c-sub);
  font-size: 12px;
}

section.iv-hero { padding-top: 0 !important; padding-bottom: clamp(40px, 5vw, 64px); background: #ffffff; }
.iv-hero-frame {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--c-bg-soft);
}
.iv-hero-frame img,
.iv-hero-frame .wp-post-image { width: 100%; height: 100%; object-fit: cover; display: block; }

.iv-body { padding: 0 0 clamp(60px, 7vw, 100px); background: #ffffff; }
.iv-prose {
  max-width: 760px;
  margin: 0 auto;
  font-size: 15px;
  line-height: 2.1;
  letter-spacing: 0.06em;
  color: var(--c-text);
}

/* RECRUIT 簡易ページ（フルレイアウト未設定時のフォールバック）（旧 recruit.php インライン style から集約） */
.page-hero.rc-simple { padding: clamp(40px, 5vw, 80px) 0; }
.page-hero.rc-simple h1 {
  font-family: var(--font-serif-jp);
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 500;
  line-height: 1.5;
  margin: 16px 0 0;
}
.rc-simple-body { padding: clamp(20px, 3vw, 40px) 0 clamp(60px, 7vw, 100px); }
.iv-prose p { margin-bottom: 1.6em; }
.iv-prose .iv-h2,
.iv-prose h2 {
  font-family: var(--font-serif-jp);
  font-size: clamp(18px, 2.2vw, 22px);
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.06em;
  color: var(--c-black);
  margin: 2.5em 0 1em;
  padding-bottom: 0.6em;
  border-bottom: 1px solid var(--c-line);
}

.iv-others {
  background: var(--c-bg-soft);
  padding: clamp(60px, 7vw, 100px) 0;
}
.iv-others-grid {
  list-style: none;
  padding: 0;
  margin: clamp(32px, 4vw, 48px) 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: clamp(24px, 3vw, 36px);
}
.iv-others-grid li a {
  display: block;
  text-decoration: none;
  color: inherit;
}
.iv-others-grid .iv-thumb {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--c-bg);
  margin-bottom: 14px;
}
.iv-others-grid .iv-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.2,.8,.2,1); }
.iv-others-grid li a:hover .iv-thumb img { transform: scale(1.04); }
/* #1799 部署・役職を横1行(折返し)ではなく2段（縦積み）で表示 */
.iv-others-grid .iv-thumb-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-family: var(--font-en);
  font-size: 12px;
  letter-spacing: 0.18em;
  color: var(--c-sub);
  margin-bottom: 6px;
}
.iv-others-grid .iv-thumb-title {
  font-family: var(--font-serif-jp);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.6;
  margin: 0 0 6px;
  color: var(--c-black);
}
.iv-others-grid .iv-thumb-name {
  font-size: 12px;
  color: var(--c-sub);
  letter-spacing: 0.04em;
}

/* =====================================================
 * /recruit/people/ 一覧（インタビューカードグリッド）
 * ===================================================== */
.iv-list-mv {
  padding: clamp(48px, 6vw, 80px) 0 clamp(24px, 3vw, 40px);
  background: #ffffff;
}
.iv-list-mv .en-label {
  font-family: var(--font-en);
  font-size: clamp(28px, 4vw, 44px);
  letter-spacing: 0.12em;
  color: var(--c-black);
  display: block;
  margin-bottom: 12px;
}
.iv-list-mv h1 {
  font-family: var(--font-serif-jp);
  font-size: clamp(20px, 2.4vw, 26px);
  font-weight: 500;
  letter-spacing: 0.06em;
  color: var(--c-black);
  margin: 0 0 18px;
}
.iv-list-mv .lead {
  font-size: 14px;
  line-height: 2.0;
  color: var(--c-text);
  letter-spacing: 0.06em;
  max-width: 640px;
}

.iv-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  gap: clamp(24px, 3vw, 40px);
}
.iv-list li a {
  display: block;
  text-decoration: none;
  color: inherit;
}
.iv-list .iv-list-thumb {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--c-bg-soft);
  margin-bottom: 14px;
}
.iv-list .iv-list-thumb img,
.iv-list .iv-list-thumb .wp-post-image {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 1s cubic-bezier(.2,.8,.2,1);
}
.iv-list li a:hover .iv-list-thumb img { transform: scale(1.05); }
.iv-list .iv-list-meta {
  display: flex;
  gap: 4px 12px;
  font-family: var(--font-en);
  font-size: 12px;
  letter-spacing: 0.2em;
  color: var(--c-sub);
  margin-bottom: 6px;
  flex-wrap: wrap;
}
.iv-list .iv-list-meta > span {
  flex-shrink: 0;
  white-space: nowrap;
}
.iv-list .iv-list-title {
  font-family: var(--font-serif-jp);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.65;
  margin: 0 0 6px;
  color: var(--c-black);
  letter-spacing: 0.04em;
}
.iv-list .iv-list-name {
  font-size: 12px;
  color: var(--c-sub);
  letter-spacing: 0.04em;
}

/* ============================================================
   2026-05-10: /recruit/ 配下の post_content にあったインライン
   style="..." をクラス化（レイアウト系の繰り返しパターン）
============================================================ */
/* 背景 + 上下 padding のラッパー */
.rc-band         { background: #ffffff;      padding: 1px 0 clamp(80px, 10vw, 140px); }
.rc-band-soft    { background: var(--c-bg-soft); padding: clamp(50px, 7vw, 90px) 0 clamp(90px, 12vw, 160px); }
.rc-band-md      { background: #ffffff !important; padding: clamp(80px, 10vw, 120px) 0; }
.rc-band-md-soft { background: var(--c-bg-soft); padding: clamp(80px, 10vw, 140px) 0; }
.rc-band-sm      { background: var(--c-bg);      padding: clamp(60px, 8vw, 100px) 0; }
.rc-band-sm.rc-band--center { background: #ffffff; border-top: 0; padding-top: 0; }
section.rc-band-bottom { background: #ffffff; padding-top: 0 !important; padding-bottom: clamp(60px, 8vw, 120px); }
.rc-band--center { text-align: center; }
.rc-band--white  { background: #ffffff; }
section.rc-band--bg { background: #ffffff; padding-top: 1px !important; }
.rc-band--no-border-top { border-top: none !important; }

/* 共通テキスト */
.rc-feature-text {
  font-family: var(--font-serif-jp);
  font-size: clamp(20px, 2.4vw, 28px);
  line-height: 2;
  letter-spacing: 0.1em;
  color: var(--c-black);
  margin-bottom: 48px;
}
.rc-feature-text--small {
  font-family: var(--font-serif-jp);
  font-size: clamp(18px, 2vw, 24px);
  line-height: 2;
  letter-spacing: 0.1em;
  color: var(--c-black);
  margin-bottom: 32px;
}
.rc-fs-md { font-size: clamp(20px, 2.4vw, 28px); }

/* 区切り線つきリンク */
.rc-link-underline { border-bottom: 1px solid var(--c-black); }

/* ユーティリティ系 */
.rc-mb-72  { margin-bottom: clamp(72px, 9vw, 120px); }
.rc-mb-40  { margin-bottom: clamp(40px, 6vw, 72px); }
.rc-mt-60  { margin-top: 60px; }
.rc-text-white { color: #ffff; }

/* /recruit/ TOP のおすすめカード（黒背景・白文字、グリッド span 2） */
.rc-card-grid .rc-card.is-feature {
  grid-column: span 2;
  background: var(--c-black);
  color: #ffffff;
}
.rc-card.is-feature * { color: #ffffff; }

/* /recruit/faq/ の末尾 “問い合わせどうぞ” */
.rc-faq-foot {
  text-align: center;
  padding-top: clamp(40px, 5vw, 60px);
}

/* /recruit/entry/ の小さな注釈 */
.rc-entry-note {
  font-size: 14px;
  line-height: 2.2;
  color: var(--c-sub);
  letter-spacing: 0.06em;
}

/* =========================================
   SP overflow safety net（2026-05-26）
   .rc-page 配下のすべての要素が viewport を超えないようにする防御策
========================================= */
.rc-page { max-width: 100vw; overflow-x: clip; }
.rc-page * { min-width: 0; }
.rc-page img,
.rc-page video,
.rc-page iframe { max-width: 100%; height: auto; }
.rc-page table { max-width: 100%; }
.rc-page pre,
.rc-page code { white-space: pre-wrap; word-break: break-word; }
@media (max-width: 1000px) {
  /* mobile では sidebar が水平スクロール bar 化するので、それ以外を狭く保つ */
  .rc-page { padding-top: 0; }
  .rc-main > section { padding-left: 0; padding-right: 0; }
}
@media (max-width: 600px) {
  /* clamp で残っていた左右パディングを viewport に合わせて圧縮 */
  .rc-mv .container { padding-left: 20px !important; padding-right: 20px !important; }
  .rc-page-hero { padding-left: 0 !important; padding-right: 0 !important; }
  .rc-page-hero > .container { padding-left: 20px; padding-right: 20px; }

  /* (1) .rc-editorial の左右に余白 */
  .rc-editorial { padding-left: 20px; padding-right: 20px; }

  /* (2) .section-head.center の上に余白（/recruit/ 内の RECRUIT もっと知る 等） */
  .rc-page .section-head.center { margin-top: clamp(40px, 8vw, 64px); }

  /* 2026-06-13 #1612 SP: /recruit/ ランディングの rc-mv container を width 350 + margin 0 30 に */
  body.page-id-11988 .rc-mv > .container {
    width: 350px;
    max-width: 350px;
    box-sizing: border-box;
    margin: 0 30px;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* (3) .rc-next カードの高さを約 1/2 にする：内側 padding と要素マージン・フォントを圧縮 */
  .rc-next { padding: clamp(20px, 4vw, 28px) clamp(20px, 4vw, 28px); }
  .rc-next .num { font-size: clamp(24px, 5vw, 32px); margin-bottom: 4px; }
  .rc-next .en { margin-bottom: 6px; }
  .rc-next .jp { font-size: 14px; margin-bottom: clamp(10px, 2vw, 16px); }
  .rc-next .arr { font-size: 12px; gap: 10px; }
  .rc-next .arr::after { width: 32px; height: 32px; }

  /* (4) .rc-card-grid（3 つの考え方）のテキストを中央寄せ */
  .rc-card-grid .card { align-items: center; text-align: center; }
  .rc-card-grid .card .arr { align-self: center; }

  /* (5) .rc-next-grid を SP で 2 列に */
  .rc-next-grid { grid-template-columns: repeat(2, 1fr) !important; }
  /* (6) 08 ENTRY のカードは SP で 1 列幅いっぱいに広げる */
  .rc-next-grid .rc-next[href$="/entry/"] { grid-column: 1 / -1; }

  /* (9) インタビュー詳細 .iv-body の上下 padding は SP では 0 */
  .iv-body { padding-top: 0; padding-bottom: 0; }

  /* (10) /recruit/entry/ フォームラッパーの SP 上 padding は 0 */
  .contact-form-wrap.entry-cf7-wrap { padding-top: 0; }
  .rc-main > .contact-form-wrap.entry-cf7-wrap { padding-top: 0; }

  /* (11) /recruit/people/ インタビュー一覧の gap は SP では 40px 固定 */
  .iv-list { gap: clamp(40px, 3vw, 40px); }

  /* (8) 本文系の 15px を SP で 14px に揃える（body default 14px に合わせる） */
  .rc-page .rc-page-hero .lead,
  .rc-editorial-body p,
  .rc-editorial-body { font-size: 14px; }
}

/* 2026-06-13 #1611: /recruit/ ランディング section:nth-of-type(4)（RECRUIT もっと知る）
   の section-head のみ margin-top 100px（PC/SP 共通、他の section-head には影響なし） */
body.page-id-11988 .rc-band > .container > .section-head.center {
  margin-top: 100px;
  margin-bottom: 64px;
}

/* ============================================================
   2026-06-13 / interview / entry / people の重みづけ・整形
   page-extras.css は限定ページのみ enqueue されるため、recruit.css に集約
============================================================ */

/* #1734 /recruit/people/ インタビュー一覧タイトル */
body.page-id-16681 .iv-list .iv-list-title { font-weight: 700; }

/* #1793 single-interview の main.rc-main 背景を白に */
body.single-interview .rc-main { background-color: #ffffff; }

/* #1736-#1739 single-interview の見出し */
body.single-interview .iv-title { font-weight: 700; }
body.single-interview .iv-prose .iv-h2 { font-weight: 700; }
body.single-interview .iv-others-grid .iv-thumb-title { font-weight: 700; }

/* #1737 iv-body 上 padding 0 (single-interview) */
body.single-interview .iv-body { padding-top: 0; }

/* #1735 SP: インタビュー詳細 sidebar nav を 1行横スクロール */
@media (max-width: 1000px) {
  body.single-interview .rc-sidebar-nav {
    display: flex !important;
    flex-direction: row;
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: none;
    gap: 16px;
  }
  body.single-interview .rc-sidebar-nav::-webkit-scrollbar { display: none; }
  body.single-interview .rc-sidebar-nav li { flex: 0 0 auto; }
  body.single-interview .rc-sidebar-nav .en { display: inline; }
}

/* #1788 /recruit/entry/ h1 はテンプレ側で要素ごと削除済み（旧 .post-hero h1 hide は不一致で無効だったため撤去） */
/* #1789 /recruit/entry/ aside.rc-sidebar 下パディング 40 → 100 */
body.page-id-16677 .rc-sidebar { padding-bottom: 100px; }

/* /recruit/entry/ SP form 調整 #1760-#1762 */
@media (max-width: 700px) {
  body.page-id-16677 .wpcf7-form .cf7-field label,
  body.page-id-16677 .wpcf7-form > div > label {
    font-size: 16px;   /* #3678 18->16（全ページ化はcommon.css） */
  }
  /* #3679(SP gap15) は2026-06-27社長直接指示で全SPフォーム40px統一に変更→common.css 3693。個別上書きは撤去 */
  body.page-id-16677 .wpcf7-form > div:nth-of-type(10) > label {
    gap: 15px;
    padding-bottom: 0;
  }
}

/* 2026-06-26 websupport #3594-#3597 — /recruit/（page-id-11988）SP。rc-band系は他recruitページでも使うためpage-idスコープ。 */
@media (max-width: 900px) {
  body.page-id-11988 section.rc-editorial { margin-bottom: 0; padding-bottom: 100px; }   /* #3594->#3673 mb80->0 / pb0->100 */
  body.page-id-11988 section.rc-band-soft { padding-bottom: 100px; }                     /* #3595 下90->100 */
  body.page-id-11988 section.rc-band { margin-bottom: 100px; padding-bottom: 0; }        /* #3597 mb->100 / pb80->0 */
  body.page-id-11988 section.rc-band .section-head { margin: 60px 0 30px; }              /* #3596 100/64 -> 60/30 */
}

/* 2026-06-27 websupport #3614-#3623 — recruit/message(16680) people(16681) interview(single-interview) SP */
@media (max-width: 900px) {
  body.page-id-16680 section.rc-band-soft { margin-bottom: 100px; padding-bottom: 0; }    /* #3614 */
  .iv-list .iv-list-title { font-size: 18px; line-height: 32px; }                          /* #3615 16->18/lh32 */
  body.page-id-16681 section.rc-band-bottom { margin-bottom: 100px; padding-bottom: 0; }   /* #3616 */
  .rc-sidebar { padding-top: 120px; }                                                      /* #3617 50->120 */
  .iv-title { font-size: 24px; }                                                           /* #3618 26->24 */
  .iv-prose .iv-h2 { padding-bottom: 15px; }                                               /* #3619 10.8->15 */
  .iv-prose p { font-size: 14px; line-height: 28px; }                                      /* #3620 15->14/lh28 */
  .iv-others .section-head .en-label { font-size: 30px; line-height: 46px; }               /* #3621 40->30/lh46（iv-others限定） */
  .iv-others-grid .iv-thumb-title { font-size: 18px; line-height: 32px; }                  /* #3622 15->18/lh32 */
  .iv-others-grid { gap: 60px; }                                                           /* #3623 24->60 */
}

/* 2026-06-27 websupport #3673-#3680 — /recruit/(11988) /recruit/entry/(16677) SP */
@media (max-width: 900px) {
  body.page-id-11988 main.rc-main { padding-bottom: 100px; }   /* #3674 pb0->100 */
  body.page-id-16677 .rc-sidebar { padding-bottom: 0; }        /* #3677 pb100->0（#1789をSPで上書き） */
}