*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { overflow-x: hidden; }
body {
  font-family: 'YuGothic', 'Yu Gothic', 'Hiragino Kaku Gothic ProN', sans-serif;
  color: #000;
  background: #fff;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
picture { display: contents; }
a { color: inherit; text-decoration: none; }

/* 共通コンテナ（左右174 / 内容1092） */

/* Header */
.site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 85px;
  z-index: 500;
  padding: 22px 46px 22px 41px;
  transition: background 0.4s, box-shadow 0.4s, transform 0.3s;
}
.site-header.is-scrolled {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(8px);
  box-shadow: 0 1px 0 #e0e0e0;
}
.site-header.is-hidden {
  transform: translateY(-100%);
}
/* 下層ページ用：最初から白背景 */
.site-header.is-solid {
  background: #fff;
  box-shadow: 0 1px 0 #e0e0e0;
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header-logo { flex-shrink: 0; margin-top: -5px; }
.header-logo a { display: block; line-height: 0; }
.header-logo img { width: 229px; height: auto; }

.header-nav {
  display: flex;
  align-items: center;
  gap: 35px;
  margin-left: 35px;
}
.header-nav-link {
  font-family: 'Noto Sans JP', 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.36px;
  line-height: 12px;
  color: #000;
  white-space: nowrap;
  transition: opacity 0.3s;
}
.header-nav-link:hover { opacity: 0.6; }

.header-right {
  display: flex;
  align-items: center;
  gap: 25px;
  min-width: 0;
}

/* SNS（Instagram / TikTok の連結ピル） */
.header-sns { display: flex; min-width: 0; }
.header-sns-btn {
  display: flex;
  align-items: center;
  width: 100px;
  min-width: 0;
  height: 40px;
  border: 1px solid #000;
  font-family: 'Inter', 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  color: #000;
  transition: opacity 0.3s;
}
.header-sns-btn:hover { opacity: 0.6; }
.header-sns-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 1;
  min-width: 0;
}
.header-sns-btn--ig {
  padding: 11px 11px 12px 13px;
  border-radius: 5px 0 0 5px;
}
.header-sns-btn--tt {
  padding: 11px 9px 12px 0;
  border-radius: 0 5px 5px 0;
  border-left: none;
  font-size: 13px;
}
.header-sns-btn--tt .header-sns-row > span { flex: 1; text-align: center; }
.header-sns-btn svg { width: 6.683px; height: 10.787px; flex-shrink: 0; }

/* 採用CTA（新卒 / 中途 の連結ピル） */
.header-cta { display: flex; min-width: 0; }
.header-cta-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 119px;
  min-width: 0;
  height: 40px;
  border: 1px solid #1c1c29;
  font-family: 'Noto Sans JP', 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 1px;
  line-height: 1;
  padding: 10px 0 12px;
  transition: background 0.3s, color 0.3s;
}
.header-cta-btn--new {
  color: #fff;
  background: #1c1c29;
  border-radius: 5px 0 0 5px;
  border-right: none;
}
.header-cta-btn--new:hover { background: transparent; color: #000; border-right: none; }
.header-cta-btn--career {
  color: #fff;
  background: #1c1c29;
  border-radius: 0 5px 5px 0;
  border-left: 1px solid rgba(255,255,255,0.15);
}
.header-cta-btn--career:hover { background: transparent; color: #000; border-left: 1px solid #1c1c29; }

/* ページ内ナビ（ヘッダーに統合したため非表示） */
.page-nav {
  display: none;
  width: 100%;
  height: 48px;
  padding: 0 90px;
  background: #fff;
  box-shadow: 0 -1px 0 #e8e8e8 inset;
}
.page-nav.is-fixed {
  position: fixed;
  top: 85px;
  left: 0;
  z-index: 499;
  border-top: 1px solid #e0e0e0;
  box-shadow: 0 1px 0 #e0e0e0;
}
.site-header.is-docked {
  box-shadow: none !important;
}
.page-nav-list {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 705px;
  height: 100%;
  list-style: none;
}
.page-nav-list li { flex-shrink: 0; }
.page-nav-list a {
  display: block;
  padding: 17px 0;
  border-bottom: 1px solid transparent;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: clamp(9px, 0.83333vw, 12px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.03em;
  white-space: nowrap;
  color: #000;
  transition: opacity 0.3s;
}
.page-nav-list a:hover { opacity: 0.6; }
.page-nav-list a.is-active {
  border-bottom-color: #000;
}

.about, .interview, .message, .welfare, .data, .flow {
  scroll-margin-top: 85px;
}

/* ファーストビュー */
.fv {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background: #d9d9d9;
}
.fv-inner {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.fv-bg-wrap,
.fv-person-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 115%;
  will-change: transform;
}
.fv-bg-wrap { z-index: 1; }
.fv-person-wrap { z-index: 4; }
.fv-bg {
  position: absolute;
  top: -90px;
  left: 0;
  width: 100%;
  height: calc(100% + 90px);
  object-fit: cover;
  object-position: center calc(20% + 30px);
}
.fv-person {
  display: none;
}

/* 小タイル */
.fv-tile {
  position: absolute;
  object-fit: cover;
}
.fv-tile--1 {
  z-index: 10;
  left: 73.7451vw;
  top: 8.9361vw;
  width: 14.3725vw;
  height: 9.4257vw;
}
.fv-tile--2 {
  z-index: 9;
  left: 83.6007vw;
  top: 13.2306vw;
  width: 13.7994vw;
  height: 9.3736vw;
}
.fv-tile--3 {
  z-index: 2;
  left: 71.8750vw;
  top: 38.6805vw;
  width: 13.9247vw;
  height: 8.5693vw;
}
.fv-tile--4 {
  z-index: 8;
  left: 77.1875vw;
  top: 45.1273vw;
  width: 17.3091vw;
  height: 10.4766vw;
}

/* WORK IS LIFE */
.fv-wil--sp { display: none; }
.fv-wil {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  display: none;
}
.fv-wil--back { z-index: 3; }
.fv-wil--front { z-index: 5; }

/* WORK is LIFE — 新文字組み */
.fv-wil-text {
  position: absolute;
  z-index: 5;
  left: min(2.9167vw, 42px);
  bottom: min(1.5278vw, 22px);
  width: min(38.4722vw, 554px);
  height: min(14.7639vw, 213px);
  pointer-events: none;
}
.fv-wil-work {
  position: absolute;
  left: 0;
  top: 0;
  font-family: 'Cormorant Infant', serif;
  font-size: min(10.6285vw, 153px);
  font-weight: 500;
  line-height: min(8.2667vw, 119px);
  letter-spacing: -0.319vw;
  text-transform: uppercase;
  color: #24e924;
  white-space: nowrap;
  background: linear-gradient(120deg, #24e924 0%, #24e924 30%, rgba(255,255,255,0.6) 38%, rgba(255,255,255,0.85) 44%, rgba(255,255,255,0.6) 50%, #24e924 58%, #24e924 100%);
  background-size: 300% 100%;
  background-position: 150% 0;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: wil-sweep-work 10s linear infinite;
}
.fv-wil-is {
  position: absolute;
  left: min(12.5264vw, 180px);
  top: min(6.4375vw, 93px);
  font-family: 'Meie Script', cursive;
  font-size: min(10.6285vw, 153px);
  font-weight: 400;
  line-height: min(8.2667vw, 119px);
  text-transform: lowercase;
  color: #fff;
  white-space: nowrap;
}
.fv-wil-life {
  position: absolute;
  right: 0;
  top: min(5.7708vw, 83px);
  font-family: 'Cormorant Infant', serif;
  font-size: min(10.6285vw, 153px);
  font-weight: 500;
  line-height: min(8.2667vw, 119px);
  letter-spacing: -0.319vw;
  text-transform: uppercase;
  color: #2af1ff;
  white-space: nowrap;
  background: linear-gradient(120deg, #2af1ff 0%, #2af1ff 30%, rgba(255,255,255,0.6) 38%, rgba(255,255,255,0.85) 44%, rgba(255,255,255,0.6) 50%, #2af1ff 58%, #2af1ff 100%);
  background-size: 300% 100%;
  background-position: 150% 0;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: wil-sweep-life 10s linear infinite;
}
@keyframes wil-sweep-work {
  0%, 68% { background-position: 150% 0; }
  83% { background-position: -50% 0; }
  88%, 100% { background-position: -50% 0; }
}
@keyframes wil-sweep-life {
  0%, 18% { background-position: 150% 0; }
  33% { background-position: -50% 0; }
  38%, 100% { background-position: -50% 0; }
}
@keyframes wil-glow-sweep {
  0%, 30% { transform: translateX(70px); opacity: 1; }
  42%, 72% { transform: translateX(430px); opacity: 1; }
  80% { transform: translateX(430px); opacity: 0; }
  81% { transform: translateX(70px); opacity: 0; }
  100% { transform: translateX(70px); opacity: 1; }
}
.wil-glow-sweep {
  animation: wil-glow-sweep 10s ease-in-out infinite;
}
@keyframes wil-glow-sweep-sp {
  0%, 30% { transform: translateX(53px); opacity: 1; }
  42%, 72% { transform: translateX(243px); opacity: 1; }
  80% { transform: translateX(243px); opacity: 0; }
  81% { transform: translateX(53px); opacity: 0; }
  100% { transform: translateX(53px); opacity: 1; }
}
.wil-glow-sweep-sp {
  animation: wil-glow-sweep-sp 10s ease-in-out infinite;
}
@keyframes tile-work-vis {
  0%, 30% { filter: blur(0px) grayscale(0) saturate(1) contrast(1); opacity: 1; }
  42%, 80% { filter: blur(4px) grayscale(0.2) saturate(0.9) contrast(0.78) brightness(1.3); opacity: 0.65; }
  88%, 100% { filter: blur(0px) grayscale(0) saturate(1) contrast(1); opacity: 1; }
}
@keyframes tile-life-vis {
  0%, 30% { filter: blur(4px) grayscale(0.2) saturate(0.9) contrast(0.78) brightness(1.3); opacity: 0.65; }
  38%, 72% { filter: blur(0px) grayscale(0) saturate(1) contrast(1); opacity: 1; }
  80%, 100% { filter: blur(4px) grayscale(0.2) saturate(0.9) contrast(0.78) brightness(1.3); opacity: 0.65; }
}

/* タイル緑光スキャン */
.fv-tile-shine {
  position: absolute;
  pointer-events: none;
  overflow: hidden;
  z-index: 11;
}
.fv-tile-shine::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent, rgba(108,236,145,0.35), transparent);
  mix-blend-mode: screen;
  transform: translateX(-120%);
  opacity: 0;
  pointer-events: none;
}
.fv-tile-shine--1 {
  left: 73.7451vw; top: 8.9361vw; width: 14.3725vw; height: 9.4257vw;
}
.fv-tile-shine--2 {
  left: 83.6007vw; top: 13.2306vw; width: 13.7994vw; height: 9.3736vw;
}
.fv-tile-shine--3 {
  left: 71.8750vw; top: 38.6805vw; width: 13.9247vw; height: 8.5693vw;
}
.fv-tile-shine--4 {
  left: 77.1875vw; top: 45.1273vw; width: 17.3091vw; height: 10.4766vw;
}
@keyframes sweep-work {
  0%, 79% { transform: translateX(-120%); opacity: 0; }
  80% { transform: translateX(-120%); opacity: 1; }
  92% { transform: translateX(120%); opacity: 1; }
  93% { transform: translateX(120%); opacity: 0; }
  94% { transform: translateX(-120%); opacity: 0; }
  100% { transform: translateX(-120%); opacity: 0; }
}
@keyframes sweep-life {
  0%, 29% { transform: translateX(-120%); opacity: 0; }
  30% { transform: translateX(-120%); opacity: 1; }
  42% { transform: translateX(120%); opacity: 1; }
  43% { transform: translateX(120%); opacity: 0; }
  44% { transform: translateX(-120%); opacity: 0; }
  100% { transform: translateX(-120%); opacity: 0; }
}
.fv-tile-shine--1::after,
.fv-tile-shine--2::after {
  animation: sweep-work 10s cubic-bezier(.2,.8,.2,1) infinite;
}
.fv-tile-shine--3::after,
.fv-tile-shine--4::after {
  background: linear-gradient(100deg, transparent, rgba(42,241,255,0.35), transparent);
  animation: sweep-life 10s cubic-bezier(.2,.8,.2,1) infinite;
}

/* FV エントリーアニメーション */
@keyframes fv-fade-up {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fv-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.fv-bg-wrap,
.fv-person-wrap {
  animation: fv-fade-in 1.2s ease-out 0.2s both;
}
.fv-breadcrumb {
  animation: fv-fade-up 0.8s ease-out 0.8s both;
}
.fv-title {
  opacity: 1;
}
.fv-title-ja {
  animation: fv-fade-up 0.8s ease-out 0.8s both;
}
.fv-lead-heading {
  animation: fv-fade-up 0.8s ease-out 1.0s both;
}
.fv-lead-text {
  animation: fv-fade-up 0.8s ease-out 1.2s both;
}
.fv-wil {
  animation: fv-fade-up 1.0s ease-out 1.0s both;
}
.fv-tile--1, .fv-tile--2 {
  animation: tile-work-vis 10s ease-in-out infinite, fv-fade-in 0.8s ease-out 1.4s both;
}
.fv-tile--3, .fv-tile--4 {
  animation: tile-life-vis 10s ease-in-out infinite, fv-fade-in 0.8s ease-out 1.4s both;
}

/* パンくず */
.fv-breadcrumb {
  position: absolute;
  z-index: 7;
  left: 5.7639vw;
  top: 6.5972vw;
  width: 13.125vw;
  height: 1.4583vw;
  display: flex;
  align-items: center;
  white-space: nowrap;
  font-size: 0.7639vw;
  font-weight: 400;
  line-height: 1.3889vw;
  letter-spacing: 0.0229vw;
  text-transform: uppercase;
  color: #000;
}
.fv-breadcrumb-en { font-family: 'Cormorant Infant', serif; }
.fv-breadcrumb-sep { font-family: 'Zen Old Mincho', serif; }

/* RECRUIT（削除済み・非表示） */
.fv-title {
  display: none;
}
.fv-title-ja {
  display: none;
}

/* リード */
.fv-lead {
  position: absolute;
  z-index: 7;
  left: 6.25vw;
  top: 11.8882vw;
  width: 38.4722vw;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.fv-lead-heading {
  /* 見出しをやめ、リード本文(.fv-lead-text)と同一設定に統一。
     マークアップ上は別要素だが、見た目はひと続きの文章になる */
  width: 100%;
  height: auto;
  margin-bottom: 0;
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(1.1302vw, 16.275px);
  /* YuGothic は 500 だと 400 と同じ見た目になるため 600 を指定 */
  font-weight: 600;
  line-height: 2.3;
  letter-spacing: 0.45px;
  text-indent: 0;
  text-transform: uppercase;
  color: #000;
}
.fv-lead-text {
  width: 100%;
  height: auto;
  /* 明朝 -> ゴシックに変更（サイト内の他の本文と同じ指定） */
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(1.1302vw, 16.275px);
  /* YuGothic は 500 だと 400 と同じ見た目になるため 600 を指定 */
  font-weight: 600;
  line-height: 2.3;
  letter-spacing: 0.45px;
  text-transform: uppercase;
  color: #000;
}

/* セクション見出し（英大文字＋和文） */
.sec-head {
  display: flex;
  align-items: center;
  gap: min(1.0417vw, 15px);
}
.sec-head-en {
  font-family: 'Cormorant Infant', serif;
  font-weight: 400;
  text-transform: uppercase;
  color: #000;
  white-space: nowrap;
}
.sec-head-ja {
  height: min(1.5278vw, 22px);
  display: flex;
  align-items: center;
  font-family: 'Zen Old Mincho', serif;
  font-size: min(0.9028vw, 13px);
  font-weight: 400;
  line-height: min(1.4611vw, 21.04px);
  letter-spacing: min(0.0486vw, 0.7px);
  text-transform: uppercase;
  color: #000;
  white-space: nowrap;
}

/* ABOUT */
.about {
  position: relative;
  width: 100%;
  /* 会社情報ボタン + 本文差し替えの増分を上乗せし、そこから30px詰めた値: 670 -> 800px */
  height: min(55.5556vw, 800px);
  background: #f4f0e8;
  overflow: hidden;
}
.about-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.about-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
}
.about-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(to right, rgba(255,255,255,0.82) 38%, rgba(255,255,255,0) 65%);
}
.about-inner {
  position: relative;
  z-index: 2;
  width: min(75.8333vw, 1092px);
  margin: 0 auto;
  padding-top: min(7.7778vw, 112px);
  padding-bottom: min(7.7778vw, 112px);
}
.about-photo {
  width: min(41.6667vw, 600px);
  height: min(29.3056vw, 422px);
  object-fit: cover;
}
.about-body {
  width: min(30.8333vw, 444px);
  display: flex;
  flex-direction: column;
}
.about-body .sec-head {
  width: min(30.625vw, 441px);
  height: min(7.6389vw, 110px);
}
.about-body .sec-head-en {
  font-size: min(4.6875vw, 67.5px);
  line-height: min(5.5625vw, 80.1px);
}
.about-heading {
  margin-top: 10px;
  height: auto;
  /* 旧・固定高さ(97px)と行内容(76.8px)の差分にあたる余白を明示 */
  margin-bottom: min(1.4vw, 20px);
  font-family: 'Zen Old Mincho', serif;
  font-size: min(1.6667vw, 24px);
  font-weight: 400;
  line-height: min(2.6667vw, 38.4px);
  letter-spacing: min(0.1007vw, 1.45px);
  color: #000;
}
.about-text {
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(1.0417vw, 15px);
  font-weight: 500;
  line-height: min(2.0833vw, 30px);
  letter-spacing: min(0.0347vw, 0.5px);
  text-align: left;
  color: #000;
}

@media (min-width: 1200px) {
  .about-heading { white-space: nowrap; margin-bottom: min(1.875vw, 27px); }
  .about-heading br { display: none; }
}

/* 募集要項・説明会エントリー */
.entry-band {
  position: relative;
  width: 100%;
  height: min(25.625vw, 369px);
  padding: min(5.5556vw, 80px) 0;
  background: linear-gradient(to bottom right, #25DC2B 0%, #27AC44 40%, #229E3D 100%);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: min(3.4722vw, 50px);
  overflow: hidden;
}
.entry-title {
  width: min(43.6111vw, 628px);
  height: min(2.7083vw, 39px);
  text-align: center;
  color: #fff;
  font-family: 'Zen Old Mincho', serif;
  font-size: min(2.0833vw, 30px);
  font-weight: 400;
  line-height: min(2.2917vw, 33px);
}
.entry-cards {
  position: relative;
  display: flex;
  align-items: center;
  gap: min(6.9444vw, 100px);
  height: min(8.75vw, 126px);
}
.entry-sep {
  position: absolute;
  left: min(32.6389vw, 470px);
  top: 0;
  width: min(0.0417vw, 0.6px);
  height: 100%;
  background: #fff;
}
.entry-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: min(8.75vw, 126px);
}
.entry-card--new { width: min(29.1667vw, 420px); }
.entry-card--career { width: min(34.0278vw, 490px); }
.entry-meta {
  height: min(8.75vw, 126px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
}
.entry-card--new .entry-meta { width: min(10.625vw, 153px); }
.entry-card--career .entry-meta { width: min(15.7639vw, 227px); }
.entry-meta-title {
  height: min(2.7083vw, 39px);
  color: #fff;
  font-family: 'Zen Old Mincho', serif;
  font-size: min(1.8056vw, 26px);
  font-weight: 400;
  line-height: min(1.9861vw, 28.6px);
  letter-spacing: min(0.0694vw, 1px);
}
.entry-meta-list {
  height: min(4.3056vw, 62px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #fff;
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 500;
  line-height: min(1.5556vw, 22.4px);
  letter-spacing: min(0.0347vw, 0.5px);
}
.entry-btns {
  width: min(18.0556vw, 260px);
  height: min(8.75vw, 126px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.entry-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(18.0556vw, 260px);
  height: min(3.75vw, 54px);
  background: transparent;
  border: min(0.0694vw, 1px) solid #fff;
  border-radius: min(0.25vw, 3.6px);
  padding: 0 min(0.5943vw, 8.56px) 0 min(1.3194vw, 19px);
  transition: background 0.3s, border-color 0.3s;
}
.entry-btn-text {
  color: #fff;
  font-family: 'Inter', 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 500;
  line-height: min(1.8333vw, 26.4px);
  letter-spacing: min(0.0833vw, 1.2px);
  white-space: nowrap;
  transition: color 0.3s;
}
.entry-btn-icon {
  width: min(2.5083vw, 36.12px);
  height: min(2.5083vw, 36.12px);
  flex-shrink: 0;
  background: #fff;
  border-radius: min(0.25vw, 3.6px);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s;
}
.entry-btn-icon svg {
  width: 100%;
  height: 100%;
}
.entry-btn-icon svg path { stroke: #27AC44; transition: stroke 0.3s; }
.entry-btn:hover { background: #fff; border-color: #fff; }
.entry-btn:hover .entry-btn-text { color: #27AC44; }
.entry-btn:hover .entry-btn-icon { background: #27AC44; }
.entry-btn:hover .entry-btn-icon svg path { stroke: #fff; }

/* Footer */
.site-footer {
  background: #f3f1f1;
  padding: 49px 0 0;
}
.footer-inner { padding: 0 114px; }
.footer-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.footer-left { flex-shrink: 0; }
.footer-logo { display: block; line-height: 0; }
.footer-logo img { width: 283px; height: auto; }
.footer-address {
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #000;
  line-height: 1.8;
  margin-top: 27px;
}
.footer-nav {
  display: flex;
  gap: 80px;
}
.footer-nav-col {
  display: flex;
  flex-direction: column;
}
.footer-nav-col a {
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #000;
  line-height: 2.75;
  transition: opacity 0.3s;
  white-space: nowrap;
}
.footer-nav-col a:hover { opacity: 0.7; }
.footer-divider {
  width: 100%;
  height: 1px;
  background: #000;
  margin-top: 50px;
}
.footer-copy {
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: 11px;
  font-weight: 500;
  color: #000;
  line-height: 1.8;
  padding: 23px 0 30px;
}

/* INTERVIEW */
.interview {
  width: 100%;
  height: min(131.5278vw, 1894px);
  background: #fff url(../images/rec-interview-bg.webp) no-repeat left top / 100% 100%;
  overflow: hidden;
}
.interview-inner {
  width: min(75.8333vw, 1092px);
  margin: 0 auto;
  padding-top: min(7.9167vw, 114px);
  display: flex;
  flex-direction: column;
  gap: min(4.1667vw, 60px);
}
.interview .sec-head-en {
  font-size: min(4.6875vw, 67.5px);
  line-height: min(5.5625vw, 80.1px);
}
.iv-list {
  display: flex;
  flex-direction: column;
  gap: min(4.8611vw, 70px);
}
.iv-card {
  display: flex;
  align-items: flex-start;
  gap: min(2.9167vw, 42px);
  height: min(32.6389vw, 470px);
  background: #f2efec;
}
/* 2件目は写真を右側に配置 */
.iv-card--rev {
  flex-direction: row-reverse;
}
.iv-card > picture {
  flex-shrink: 0;
  width: min(23.75vw, 342px);
  height: min(32.6389vw, 470px);
  display: block;
  line-height: 0;
}
.iv-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.iv-body {
  flex: 1;
  height: min(32.6389vw, 470px);
  padding: min(3.4722vw, 50px) min(3.4722vw, 50px) min(3.4722vw, 50px) 0;
  display: flex;
  flex-direction: column;
  gap: min(1.7361vw, 25px);
}
.iv-card--rev .iv-body {
  padding: min(3.4722vw, 50px) 0 min(3.4722vw, 50px) min(3.4722vw, 50px);
}
.iv-head {
  display: flex;
  flex-direction: column;
  gap: min(0.6944vw, 10px);
}
.iv-catch {
  font-family: 'Zen Old Mincho', serif;
  font-size: min(1.6667vw, 24px);
  font-weight: 400;
  line-height: min(2.6667vw, 38.4px);
  letter-spacing: min(0.1007vw, 1.45px);
  color: #000;
}
.iv-meta {
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 500;
  line-height: min(1.5972vw, 23px);
  color: #000;
}
.iv-meta-name {
  font-size: min(1.0417vw, 15px);
}
.iv-text {
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(1.0417vw, 15px);
  font-weight: 500;
  line-height: min(1.875vw, 27px);
  text-align: left;
  color: #000;
}

/* MESSAGE */
.message {
  width: 100%;
  margin-top: 0;
  padding: min(5.5556vw, 80px) 0;
  background: linear-gradient(to top left, #2AF1FF 0%, #0EC5D2 40%, #0AB8C5 100%);
  overflow: hidden;
}
.message-inner {
  width: min(75.8333vw, 1092px);
  height: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.message-body {
  width: min(34.5833vw, 498px);
  display: flex;
  flex-direction: column;
}
.message-body .sec-head {
  min-height: min(7.6389vw, 110px);
}
.message-body .sec-head-en {
  font-size: min(4.6875vw, 67.5px);
  line-height: min(5.5625vw, 80.1px);
  color: #fff;
}
.message-body .sec-head-ja {
  color: #fff;
}
.message-lead {
  margin-top: 15px;
  width: min(34.5833vw, 498px);
  font-family: 'Zen Old Mincho', serif;
  font-size: min(1.6667vw, 24px);
  font-weight: 400;
  line-height: min(2.6667vw, 38.4px);
  letter-spacing: min(0.1007vw, 1.45px);
  color: #fff;
}
.message-text {
  margin-top: 18px;
  width: min(27.6389vw, 398px);
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(1.0417vw, 15px);
  font-weight: 400;
  line-height: min(1.6667vw, 24px);
  letter-spacing: min(0.0347vw, 0.5px);
  text-align: left;
  color: #fff;
}
.message-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(14.3056vw, 206px);
  height: min(3.125vw, 45px);
  margin-top: min(2.7083vw, 39px);
  padding: 0 min(0.3472vw, 5px) 0 min(1.3889vw, 20px);
  border: min(0.0694vw, 1px) solid rgba(255, 255, 255, 0.7);
  border-radius: min(0.2083vw, 3px);
  transition: background 0.3s, border-color 0.3s;
}
.message-btn-text {
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 500;
  line-height: min(1.5278vw, 22px);
  letter-spacing: min(0.0694vw, 1px);
  color: #fff;
  white-space: nowrap;
  transition: color 0.3s;
}
.message-btn-icon {
  flex-shrink: 0;
  width: min(2.1651vw, 31.18px);
  height: min(2.1651vw, 31.18px);
  background: #fff;
  border-radius: min(0.25vw, 3.6px);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s;
}
.message-btn-icon svg {
  width: 100%;
  height: 100%;
}
.message-btn-icon svg path { stroke: #0AB8C5; transition: stroke 0.3s; }
.message-btn:hover { background: #fff; border-color: #fff; }
.message-btn:hover .message-btn-text { color: #000; }
.message-btn:hover .message-btn-icon { background: #000; }
.message-btn:hover .message-btn-icon svg path { stroke: #fff; }
/* ABOUT のボタン（MESSAGE のボタンと同一デザイン。
   MESSAGE は濃色背景用に白枠・白文字なので、白背景の ABOUT では配色を反転させている） */
.about-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(14.3056vw, 206px);
  height: min(3.125vw, 45px);
  margin-top: min(2.7083vw, 39px);
  padding: 0 min(0.3472vw, 5px) 0 min(1.3889vw, 20px);
  border: min(0.0694vw, 1px) solid rgba(0, 0, 0, 0.7);
  border-radius: min(0.2083vw, 3px);
  transition: background 0.3s, border-color 0.3s;
}
.about-btn-text {
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 500;
  line-height: min(1.5278vw, 22px);
  letter-spacing: min(0.0694vw, 1px);
  color: #000;
  white-space: nowrap;
  transition: color 0.3s;
}
.about-btn-icon {
  flex-shrink: 0;
  width: min(2.1651vw, 31.18px);
  height: min(2.1651vw, 31.18px);
  background: #000;
  border-radius: min(0.25vw, 3.6px);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s;
}
.about-btn-icon svg { width: 100%; height: 100%; }
.about-btn-icon svg path { stroke: #fff; transition: stroke 0.3s; }
.about-btn:hover { background: #000; border-color: #000; }
.about-btn:hover .about-btn-text { color: #fff; }
.about-btn:hover .about-btn-icon { background: #fff; }
.about-btn:hover .about-btn-icon svg path { stroke: #000; }
.message-photo {
  width: min(38.1944vw, 550px);
  height: min(25.9722vw, 374px);
  object-fit: cover;
}

/* WELFARE */
.welfare {
  width: 100%;
  padding-bottom: min(7.6389vw, 110px);
}
.welfare-inner {
  width: min(75.8333vw, 1092px);
  margin: 0 auto;
  padding-top: min(8.8889vw, 128px);
}
.welfare .sec-head {
  height: min(7.6389vw, 110px);
}
.welfare .sec-head-en {
  font-size: min(4.6875vw, 67.5px);
  line-height: min(5.5625vw, 80.1px);
}
.wf-list {
  margin-top: min(1.5972vw, 23px);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 0;
  list-style: none;
}
.wf-card {
  display: flex;
  align-items: center;
  gap: min(3.4722vw, 50px);
  width: min(36.4583vw, 525px);
  height: min(10.4167vw, 150px);
  padding: min(1.6667vw, 24px) 0;
  border-top: 1px solid #d1d1d1;
}
.wf-card:nth-child(5),
.wf-card:nth-child(6) {
  border-bottom: 1px solid #d1d1d1;
}
.wf-icon {
  width: min(4vw, 57.6px);
  height: min(4vw, 57.6px);
  max-width: min(4vw, 57.6px);
  max-height: min(4vw, 57.6px);
  flex-shrink: 0;
  object-fit: contain;
}
.wf-card--2 .wf-icon {
  width: 40px !important;
  height: 40px !important;
  max-width: 40px !important;
  max-height: 40px !important;
  margin-left: 10px;
}
.wf-text {
  display: flex;
  flex-direction: column;
  gap: min(0.8333vw, 12px);
}
.wf-title {
  font-family: 'Zen Old Mincho', serif;
  font-size: min(1.6667vw, 24px);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: min(0.1007vw, 1.45px);
  color: #000;
}
.wf-body {
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(1.0417vw, 15px);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: min(0.0347vw, 0.5px);
  color: #000;
}
.wf-note {
  font-size: 14px;
}

/* DATA */
.data {
  width: 100%;
  height: min(38.4028vw, 553px);
  background: url(../images/rec-data-bg.webp) no-repeat left top / 100% 100%;
}
.data-inner {
  width: min(75.8333vw, 1092px);
  margin: 0 auto;
  padding-top: min(5.5556vw, 80px);
}
.data .sec-head {
  height: min(7.6389vw, 110px);
}
.data .sec-head-en {
  font-size: min(4.6875vw, 67.5px);
  line-height: min(5.5625vw, 80.1px);
}
.data-list {
  margin-top: min(1.3889vw, 20px);
  width: min(75.7639vw, 1091px);
  display: flex;
  justify-content: space-between;
  list-style: none;
}
.data-card {
  position: relative;
  width: min(13.8889vw, 200px);
  height: min(13.1944vw, 190px);
  background: #fff;
  border-radius: min(0.6944vw, 10px);
  overflow: hidden;
}
.data-label {
  position: absolute;
  top: min(1.875vw, 27px);
  text-align: center;
  font-family: 'Zen Old Mincho', serif;
  font-size: min(0.9931vw, 14.3px);
  font-weight: 400;
  letter-spacing: min(0.0764vw, 1.1px);
  color: #c8161d;
}
.data-value {
  position: absolute;
  top: min(3.6111vw, 52px);
  font-family: 'Cormorant Infant', serif;
  font-size: min(6.25vw, 90px);
  font-weight: 600;
  line-height: min(5.5556vw, 80px);
  color: #1f1f1f;
}
.data-unit {
  font-family: 'Zen Old Mincho', serif;
  font-size: min(1.6667vw, 24px);
  font-weight: 400;
  line-height: min(5.5556vw, 80px);
}
.data-card .data-label { left: 0; width: 100%; text-align: center; }
.data-card .data-value { left: 0; width: 100%; text-align: center; }
.data-card-sub {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
  top: min(4.1667vw, 60px);
  font-family: 'Noto Sans JP', 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(0.8333vw, 12px);
  font-weight: 400;
  color: #1f1f1f;
  letter-spacing: 0.05em;
}
.data-ratio {
  position: absolute;
  left: 0;
  top: min(3.3333vw, 48px);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.data-circle {
  border: min(0.0653vw, 0.94px) solid #d9d9d9;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 5px;
  margin-top: 15px;
  font-family: 'Cormorant Infant', serif;
  font-weight: 600;
  color: #1f1f1f;
}
.data-circle--lg {
  width: min(7.1063vw, 102.33px);
  height: min(7.1063vw, 102.33px);
  font-size: min(3.6146vw, 52.05px);
  line-height: min(3.2125vw, 46.26px);
}
.data-circle--lg .data-unit { font-size: min(0.9639vw, 13.88px); line-height: min(3.2125vw, 46.26px); }
.data-circle--sm {
  width: min(5.6854vw, 81.87px);
  height: min(5.6854vw, 81.87px);
  font-size: min(2.8917vw, 41.64px);
  line-height: min(2.5701vw, 37px);
}
.data-circle--sm .data-unit { font-size: min(0.7708vw, 11.1px); line-height: min(2.5701vw, 37px); }
.data-card-note {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
  top: min(10.4861vw, 151px);
  font-family: 'Noto Sans JP', 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(0.7639vw, 11px);
  font-weight: 400;
  color: #666;
}
.data-badge {
  display: inline-block;
  padding: min(0.2778vw, 4px) min(0.9722vw, 14px);
  border: 1px solid #555;
  border-radius: 999px;
  font-size: min(0.7639vw, 11px);
  letter-spacing: 0.05em;
  color: #333;
}
.data-card--5 .data-value { top: min(3.6111vw, 52px); }
.data-note-mark {
  display: inline;
  vertical-align: baseline;
  position: relative;
  top: calc(-0.3em - 12px);
  font-family: 'Noto Sans JP', 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(0.5556vw, 8px);
  font-weight: 400;
  color: #999;
  margin-left: 2px;
}
.data-footnotes {
  margin-top: min(1.3889vw, 20px);
}
.data-footnote {
  font-family: 'Noto Sans JP', 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(0.7639vw, 11px);
  font-weight: 400;
  color: #666;
  line-height: 1.8;
}
.data-note {
  margin-top: min(1.3889vw, 20px);
  font-family: 'Noto Sans JP', 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(0.7639vw, 11px);
  font-weight: 400;
  color: #666;
}

/* データカウンター＋フェードアップ */
/* スクロールフェードイン */
/* タイプライターカーソル */
.tw-cursor {
  display: inline-block;
  width: 2px;
  height: 0.85em;
  background: #000;
  margin-left: 2px;
  vertical-align: baseline;
  opacity: 0;
}
.tw-cursor--blink {
  opacity: 1;
  animation: tw-blink 0.6s steps(2) infinite;
}
@keyframes tw-blink {
  0% { opacity: 1; }
  100% { opacity: 0; }
}
.typewriter.sf {
  opacity: 1;
  transform: none;
}

.sf {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}
.sf.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.data-card,
.data-ratio {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}
.data-card.is-visible,
.data-card.is-visible .data-ratio {
  opacity: 1;
  transform: translateY(0);
}
.data-num {
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
}
.data-digit-col {
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
}
.data-digit-strip {
  display: flex;
  flex-direction: column;
}
.data-digit-strip span {
  display: block;
}
.data-dot {
  display: inline-block;
  vertical-align: bottom;
}

/* FLOW */
.flow {
  width: 100%;
  background: #fff;
  padding-bottom: min(1.7361vw, 25px);
}
.flow-inner {
  width: min(75.8333vw, 1092px);
  margin: 0 auto;
  padding-top: min(6.7361vw, 97px);
}
.flow .sec-head {
  height: min(7.6389vw, 110px);
}
.flow .sec-head-en {
  font-size: min(4.6875vw, 67.5px);
  line-height: min(5.5625vw, 80.1px);
}
.flow-list {
  margin-top: min(1.875vw, 27px);
  padding-bottom: min(5.4167vw, 78px);
  display: flex;
  list-style: none;
}
.flow-step {
  position: relative;
  width: min(15.1668vw, 218.4px);
  height: min(18.6776vw, 268.96px);
  padding: min(3vw, 43.2px) min(1.2vw, 17.28px) 0;
}
.flow-step::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 0;
  width: min(1.966vw, 28.31px);
  height: 100%;
  background: inherit;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.flow-step--1 { background: #15D4E2; border-radius: min(0.6944vw, 10px) 0 0 min(0.6944vw, 10px); z-index: 5; }
.flow-step--2 { background: #6AEAF5; z-index: 4; }
.flow-step--3 { background: #15D4E2; z-index: 3; }
.flow-step--4 { background: #6AEAF5; z-index: 2; }
.flow-step--5 { background: #15D4E2; border-radius: 0 min(0.6944vw, 10px) min(0.6944vw, 10px) 0; z-index: 1; }
.flow-step--5::after { content: none; }
.flow-num {
  display: block;
  font-family: 'Cormorant Infant', serif;
  font-size: min(3.8403vw, 55.3px);
  font-weight: 400;
  line-height: min(4.2vw, 60.48px);
  text-align: center;
  color: #fff;
}
.flow-title {
  margin-top: min(1.8007vw, 25.93px);
  min-height: min(3.1208vw, 44.94px);
  font-family: 'Zen Old Mincho', serif;
  font-size: min(0.9597vw, 13.82px);
  font-weight: 400;
  line-height: min(1.5604vw, 22.47px);
  text-align: center;
  color: #fff;
}
.flow-desc {
  margin-top: min(1.6792vw, 24.18px);
  font-family: 'Noto Sans JP', 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(0.7201vw, 10.37px);
  font-weight: 400;
  line-height: min(1.3201vw, 19px);
  text-align: center;
  color: #fff;
}

/* OPEN POSITIONS */
.op {
  width: 100%;
  background: #fff;
  padding-bottom: min(10.4167vw, 150px);
}
.op-inner {
  width: min(75.8333vw, 1092px);
  margin: 0 auto;
  padding-top: min(0.5556vw, 0px);
  position: relative;
}
.op-head {
  height: min(7.6389vw, 110px);
  display: flex;
  align-items: center;
}
.op-head-en {
  font-family: 'Cormorant Infant', serif;
  font-size: min(5.3125vw, 76.5px);
  font-weight: 400;
  line-height: min(6.25vw, 90px);
  text-transform: uppercase;
  color: #000;
  white-space: nowrap;
}
.op-head-ja {
  margin-left: min(1.0417vw, 15px);
  font-family: 'Zen Old Mincho', serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 400;
  line-height: min(1.4611vw, 21.04px);
  letter-spacing: min(0.0486vw, 0.7px);
  color: #000;
  white-space: nowrap;
}
.op-list {
  margin-top: min(2.1528vw, 31px);
  border-bottom: min(0.0694vw, 1px) solid #d1d1d1;
  list-style: none;
  width: min(31.875vw, 459px);
}
.op-row {
  position: relative;
  height: min(7.6389vw, 110px);
  border-top: min(0.0694vw, 1px) solid #d1d1d1;
}
.op-link {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  color: inherit;
  text-decoration: none;
  transition: background 0.25s;
}
.op-link:hover {
  background: #f5f5f5;
}
.op-tag {
  position: absolute;
  left: 0;
  top: min(2.4306vw, 35px);
  width: min(7.7083vw, 111px);
  height: min(2.2222vw, 32px);
  background: #fff;
  border: min(0.0694vw, 1px) solid #999999;
  border-radius: min(0.1389vw, 2px);
  text-align: center;
  font-family: 'Noto Sans JP', 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: min(0.8333vw, 12px);
  font-weight: 400;
  line-height: min(2.2222vw, 32px);
  color: #4d4d4d;
}
.op-job {
  position: absolute;
  left: min(9.2361vw, 133px);
  top: min(2.6389vw, 38px);
  font-family: 'Zen Old Mincho', serif;
  font-size: min(1.3889vw, 20px);
  font-weight: 400;
  color: #1f1f1f;
}
.op-arrow {
  position: absolute;
  left: min(31.1806vw, 449px);
  top: min(2.7778vw, 40px);
  font-family: 'Cormorant Infant', serif;
  font-size: min(1.25vw, 18px);
  font-weight: 400;
  color: #737373;
}
@media (min-width: 1200px) {
  .op-tag { left: min(0.6944vw, 10px); }
  .op-arrow { left: auto; right: min(0.6944vw, 10px); }
}
.op-visual {
  position: absolute;
  right: 0;
  top: min(9.7917vw, 141px);
  width: min(38.0556vw, 548px);
  height: min(30.5556vw, 440px);
  overflow: hidden;
}
.op-visual picture {
  display: block;
  width: 100%;
  height: 100%;
}
.op-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.op-copy { display: none; }
.op-copy--sp { display: none; }

/* お問い合わせ・ご相談 */
.cta-section {
  position: relative;
  width: 100%;
  background: #020202;
  overflow: hidden;
}
.cta-bg { display: none; }
.cta-logo-pat {
  position: absolute;
  object-fit: cover;
  pointer-events: none;
  filter: brightness(5);
  }
.cta-logo-pat--1 { left: 39px; top: 188px; width: 267px; height: 48px; opacity: 0.15; }
.cta-logo-pat--2 { left: 408px; top: 118px; width: 253px; height: 45px; opacity: 0.15; }
.cta-logo-pat--3 { left: 39px; top: 40px; width: 279px; height: 50px; opacity: 0.15; }
.cta-logo-pat--4 { left: 568px; top: 40px; width: 244px; height: 43px; opacity: 0.15; }
.cta-logo-pat--5 { left: 1099px; top: 192px; width: 253px; height: 45px; opacity: 0.15; }
.cta-logo-pat--6 { left: 1129px; top: 40px; width: 267px; height: 48px; opacity: 0.15; }
.cta-logo-pat--7 { left: 879px; top: 118px; width: 253px; height: 45px; opacity: 0.15; }
.cta-logo-pat--8 { left: 568px; top: 192px; width: 253px; height: 45px; opacity: 0.15; }
.cta-inner {
  position: relative;
  z-index: 2;
  padding: 93px 114px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.cta-label {
  font-family: 'Playfair Display', serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 1.45px;
  color: #fff;
}
.cta-heading {
  margin-top: 8px;
  font-family: 'Zen Old Mincho', serif;
  font-size: 40px;
  font-weight: 400;
  line-height: 1.4;
  color: #fff;
}
.cta-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 206px;
  height: 45px;
  padding: 0 8px 0 16px;
  border: 1px solid rgba(255,255,255,0.7);
  border-radius: 3px;
  font-family: 'YuGothic', 'Yu Gothic Medium', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #fff;
  letter-spacing: 0.07em;
  transition: background 0.3s, color 0.3s, border-color 0.3s;
}
.cta-button:hover { background: #fff; color: #000; border-color: #fff; }
.cta-button:hover .cta-button-icon { background: #000; }
.cta-button:hover .cta-button-icon svg path { stroke: #fff; }
.cta-button-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  background: #fff;
  border-radius: 3px;
  transition: background 0.3s;
}
.cta-button-icon svg { width: 12px; height: 12px; }
.cta-button-icon svg path { transition: stroke 0.3s; }

/* ハンバーガー／ドロワー */
.hamburger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  width: 28px;
  height: 20px;
  position: relative;
  padding: 0;
  z-index: 510;
}
.hamburger span {
  display: block;
  width: 100%;
  height: 2px;
  background: #000;
  position: absolute;
  left: 0;
  transition: transform 0.3s, opacity 0.3s;
}
.hamburger span:nth-child(1) { top: 0; }
.hamburger span:nth-child(2) { top: 9px; }
.hamburger span:nth-child(3) { top: 18px; }
.hamburger.is-open span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.hamburger.is-open span:nth-child(2) { opacity: 0; }
.hamburger.is-open span:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

.sp-menu {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  /* ドロワーは .site-header の内側にある。ヘッダーは is-scrolled のとき backdrop-filter を
     持ち、これが fixed 子要素の containing block になるため、height:100% だと
     ヘッダーの高さ(約60px)基準に潰れる。ビューポート基準の単位で固定する */
  height: 100dvh;
  padding: 97px 0 40px 56px;
  background: #f3f1f1;
  z-index: 490;
  flex-direction: column;
  gap: 40px;
  overflow-y: auto;
}
.sp-menu.is-open { display: flex; }
body.sp-menu-open { overflow: hidden; }
.sp-menu-nav {
  display: flex;
  flex-direction: column;
  width: 260px;
}
.sp-menu-link {
  padding: 23px 0;
  border-bottom: 1px solid #ccc;
  font-family: 'Zen Old Mincho', serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 1.6px;
  color: #000;
}
.sp-menu-link:first-child { padding-top: 0; }
.sp-menu-cta-wrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 1px;
  width: 260px;
}
.sp-menu-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 44px;
  background: #000;
  border-radius: 22px;
  padding-bottom: 2px;
  font-family: 'Zen Old Mincho', serif;
  font-size: 14px;
  color: #fff;
  white-space: nowrap;
}

/* ヘッダー縮小 949px以下 */
.sp-only { display: none; }
/* タブレット専用の改行制御：br-tb はタブレットでのみ改行、br-nontb はタブレットでのみ無効 */
.br-tb { display: none; }

@media (max-width: 949px) {
  .header-logo img { width: 160px; }
  .header-sns-btn { width: 100px; font-size: 12px; }
  .header-cta-btn { width: 100px; font-size: 12px; }
  .page-nav { padding: 0 35px; }
  .page-nav-list a { font-size: 11px; }
}

/* Wide PC 1441px以上 */
@media (min-width: 1441px) {
  .fv-tile--1 {
    top: min(8.9361vw, 129px);
    width: min(14.3725vw, 207px);
    height: min(9.4257vw, 136px);
  }
  .fv-tile--2 {
    top: min(13.2306vw, 191px);
    width: min(13.7994vw, 199px);
    height: min(9.3736vw, 135px);
  }
  .fv-tile--3 {
    top: min(38.6805vw, 557px);
    width: min(13.9247vw, 201px);
    height: min(8.5693vw, 123px);
  }
  .fv-tile--4 {
    top: min(45.1273vw, 650px);
    width: min(17.3091vw, 249px);
    height: min(10.4766vw, 151px);
  }
  .fv-tile-shine--1 {
    top: min(8.9361vw, 129px);
    width: min(14.3725vw, 207px);
    height: min(9.4257vw, 136px);
  }
  .fv-tile-shine--2 {
    top: min(13.2306vw, 191px);
    width: min(13.7994vw, 199px);
    height: min(9.3736vw, 135px);
  }
  .fv-tile-shine--3 {
    top: min(38.6805vw, 557px);
    width: min(13.9247vw, 201px);
    height: min(8.5693vw, 123px);
  }
  .fv-tile-shine--4 {
    top: min(45.1273vw, 650px);
    width: min(17.3091vw, 249px);
    height: min(10.4766vw, 151px);
  }
}

/* フッター中間幅 901-1149px */
@media (min-width: 901px) and (max-width: 1149px) {
  .footer-inner { padding: 0 40px; }
  .footer-nav { gap: 30px; }
  .footer-nav-col a { font-size: 13px; }
}
/* フッター狭幅 768-900px */
@media (min-width: 768px) and (max-width: 900px) {
  .footer-inner { padding: 0 30px; }
  .footer-left { transform: scale(0.9); transform-origin: top left; }
  .footer-nav { gap: 20px; margin-left: auto; transform: scale(0.9); transform-origin: top right; }
  .footer-nav-col a { font-size: 12px; line-height: 2.5; }
  .footer-copy { transform: scale(0.9); transform-origin: left; }
}

/* ===== タブレット横持ち（1024〜1199px） ===== */
@media (min-width: 1024px) and (max-width: 1199px) {
  /* About */
  .about { height: auto; min-height: 420px; padding-bottom: 60px; }
  .about-inner { width: 85%; }
  .about-photo { width: 38%; }
  .about-body { width: 50%; }
  .about-body .sec-head { height: auto; }
  .about-body .sec-head-en { font-size: 65px; line-height: 1.1; }
  .about-heading { height: auto; font-size: 20px; line-height: 1.6; }
  .about-text { width: auto; height: auto; font-size: 14px; line-height: 1.7; }

  /* Entry Band */
  .entry-band { height: auto; padding: 55px 0; }
  .entry-title { width: auto; height: auto; font-size: 24px; }
  .entry-cards { gap: 50px; height: auto; align-items: stretch; }
  /* 左右2枚のカードで、職種名の塊は上揃え・ボタンは下揃え */
  .entry-card { height: auto; align-items: stretch; }
  .entry-card--new { width: 340px; }
  /* 中途は「マーケティング・DX責任者候補」が1行に収まる幅が必要 */
  .entry-card--career { width: 430px; }
  .entry-card--career .entry-meta { width: 200px; }
  .entry-sep { left: 365px; }
  .entry-meta { height: auto; justify-content: flex-start; gap: 10px; }
  .entry-meta-title { height: auto; font-size: 22px; }
  .entry-meta-list { height: auto; font-size: 12px; }
  /* 職種名はタブレットではスラッシュの後で改行する */
  .br-tb { display: inline; }
  .br-nontb { display: none; }

  .entry-btns { width: 220px; height: auto; justify-content: flex-end; flex: 0 0 auto; gap: 10px; }
  .entry-btn { width: 220px; height: 46px; flex: 0 0 46px; padding: 0 7px 0 14px; }
  .entry-btn-text { font-size: 13px; }
  .entry-btn-icon { width: 32px; height: 32px; }

  /* Interview */
  .interview { height: auto; }
  .interview-inner { width: 85%; padding-top: 80px; padding-bottom: 80px; gap: 45px; }
  .interview .sec-head-en { font-size: 65px; line-height: 1.1; }
  .iv-list { gap: 50px; }
  .iv-card { height: auto; min-height: 320px; gap: 25px; }
  .iv-card > picture { width: 28%; height: auto; min-height: 320px; }
  .iv-photo { height: 100%; }
  .iv-body { height: auto; padding: 30px 30px 30px 0; gap: 18px; }
  .iv-card--rev .iv-body { padding: 30px 0 30px 30px; }
  .iv-catch { font-size: 20px; line-height: 1.6; }
  .iv-meta { font-size: 13px; }
  .iv-text { font-size: 14px; line-height: 1.8; }

  /* Message */
  .message { height: auto; min-height: 420px; padding: 70px 0; }
  .message-inner { width: 85%; height: auto; }
  .message-body { width: 45%; }
  .message-body .sec-head { height: auto; }
  .message-body .sec-head-en { font-size: 65px; line-height: 1.1; }
  .message-lead { width: auto; height: auto; font-size: 20px; line-height: 1.6; }
  .message-text { width: auto; height: auto; font-size: 14px; }
  .message-btn { width: 180px; height: 40px; margin-top: -10px; }
  .about-btn { width: 180px; height: 40px; margin-top: 24px; }
  .message-photo { width: 48%; height: auto; aspect-ratio: 550 / 374; }

  /* Welfare */
  .welfare-inner { width: 85%; padding-top: 80px; }
  .welfare .sec-head { height: auto; }
  .welfare .sec-head-en { font-size: 65px; line-height: 1.1; }
  .wf-card { width: 48%; height: auto; min-height: 110px; }
  .wf-photo { height: 100%; }
  .wf-panel { height: 100%; }
  .wf-title { font-size: 20px; }
  .wf-body { font-size: 14px; }

  /* Data */
  .data { height: auto; min-height: 420px; padding-bottom: 50px; }
  .data-inner { width: 85%; }
  .data .sec-head { height: auto; }
  .data .sec-head-en { font-size: 65px; line-height: 1.1; }
  .data-list { width: auto; }
  .data-card { width: 170px; height: 170px; }
  .data-label { font-size: 12px; }
  .data-value { font-size: 70px; line-height: 1; }
  .data-unit { font-size: 20px; }
  .data-circle--lg { width: 85px; height: 85px; font-size: 42px; }
  .data-circle--lg .data-unit { font-size: 12px; }
  .data-circle--sm { width: 68px; height: 68px; font-size: 34px; }
  .data-circle--sm .data-unit { font-size: 10px; }
  .data-card-note { font-size: 10px; }

  /* Flow */
  .flow-inner { width: 85%; padding-top: 70px; }
  .flow .sec-head { height: auto; }
  .flow .sec-head-en { font-size: 65px; line-height: 1.1; }
  .flow-step { width: 18%; height: auto; min-height: 230px; padding: 35px 12px 20px; }
  .flow-step::after { width: 22px; }
  .flow-num { font-size: 46px; line-height: 1.1; }
  .flow-title { font-size: 12px; min-height: auto; line-height: 1.6; }
  .flow-desc { font-size: 9px; line-height: 1.8; }

  /* Open Positions */
  .op { padding-bottom: 80px; }
  .op-inner { width: 85%; }
  .op-head-en { font-size: 65px; line-height: 1.1; }
  .op-list { width: 42%; }
  .op-row { height: auto; min-height: 80px; }
  .op-tag { top: 24px; width: 90px; height: 28px; font-size: 11px; line-height: 28px; }
  .op-job { left: 105px; top: 27px; font-size: 17px; }
  .op-arrow { left: auto; right: 5px; top: 30px; }
  .op-visual { width: 48%; height: auto; aspect-ratio: 548 / 440; top: 110px; }

  /* CTA */
  .cta-inner { padding: 65px 60px; }
  .cta-heading { font-size: 32px; }
  .cta-button { width: 180px; height: 42px; font-size: 13px; }
  .cta-button-icon { width: 26px; height: 26px; }

  /* Header — ハンバーガー表示（大トップ準拠） */
  .header-nav { display: none; }
  .header-right { display: none; }
  .hamburger { display: block; }
  .header-inner { padding: 18px 30px; }
  .sp-menu {
    left: auto; right: 0; width: 340px;
    height: auto; padding: 80px 40px 35px;
    box-shadow: -2px 2px 15px rgba(0,0,0,0.15);
  }
  body.sp-menu-open { overflow: auto; }
  /* ドロワーは header.php で .site-header の内側に置いてある。
     ヘッダー(z:500)の中で「白背景 → パネル(z:490) → X(z:510)」の順に重なるため、
     ヘッダーの背景色には一切触れずにパネルを前面のレイヤーへ出せる。
     ヘッダー全体はページ内ナビ(z:499)より上なので、そちらにも被らない。

     ただし is-scrolled の backdrop-filter は、その要素の外へはみ出す子
     （パネルは 485px、ヘッダーは 65px）があると背景の合成が崩れ、
     ヘッダーの白がまだらに欠けて透けて見える。開いている間はぼかしだけ外す。
     背景色 rgba(255,255,255,0.95) はそのまま＝白いヘッダーは維持される。 */
  body.sp-menu-open .site-header { backdrop-filter: none; }

  /* FV — PCデザイン(1440x875)の比率をそのまま縮小： 875 / 1440 = 60.7639% */
  .fv { height: 60.7639vw; }
  /* 768-1023 と同じ理由で、ベースの +30px を外す。
     FV が小さいこの帯では +30px が効きすぎて画像が下にずれ、
     上端に .fv の地色(#d9d9d9)が帯状に出ていた（1024px:5px / 1199px:1px）。
     ※背景(.fv-bg)と切り抜き(.fv-person)は必ず同じ値にすること */
  .fv-bg,
  .fv-person { object-position: center 20%; }
  /* パンくず・タイトルを +2.1vw 下げる。
     FV内の比率は1440の正確な縮小になっているが、ヘッダーだけは高さが固定(65〜85px)で
     縮小されないため、比率どおりの位置だとパンくずがヘッダーに食い込む。
     内部の間隔（パンくず→タイトル→日本語）は1440と同じまま、上の3つをまとめて下げる。
     ベース値: パンくず 7.7083vw / タイトル 11.1937vw / 日本語 14.7736vw */
  .fv-breadcrumb { top: 9.8083vw; }
  .fv-title { display: none; }
  .fv-title-ja { display: none; }


  /* Footer — 既存の901-1149ブロックで対応済み */
}

/* SP 768px以下 */
@media (max-width: 768px) {
  .sp-only { display: inline; }
  .site-header { height: auto; padding: 0; }
  .header-inner { padding: 16px 20px; }
  .header-logo img { width: 160px; }
  .header-nav { display: none; }
  .header-right { display: none; }
  .hamburger { display: block; }

  .sec-head-ja { height: auto; font-size: 13px; line-height: 21.04px; letter-spacing: 0.7px; }

  .cta-bg { display: none; }
  .cta-logo-pat--1 { left: 0; top: 20px; width: 155px; height: 28px; opacity: 0.15; }
  .cta-logo-pat--2 { left: 215px; top: 20px; width: 155px; height: 28px; opacity: 0.15; }
  .cta-logo-pat--3 { left: 100px; top: 68px; width: 155px; height: 28px; opacity: 0.15; }
  .cta-logo-pat--4 { left: 0; top: 118px; width: 155px; height: 28px; opacity: 0.15; }
  .cta-logo-pat--5 { left: 215px; top: 118px; width: 155px; height: 28px; opacity: 0.15; }
  .cta-logo-pat--6 { left: 100px; top: 168px; width: 155px; height: 28px; opacity: 0.15; }
  .cta-logo-pat--7 { left: 0; top: 218px; width: 155px; height: 28px; opacity: 0.15; }
  .cta-logo-pat--8 { left: 215px; top: 218px; width: 155px; height: 28px; opacity: 0.15; }
  .cta-inner { flex-direction: column; align-items: flex-start; padding: 54px 30px 70px; gap: 40px; }
  .cta-heading { font-size: 27px; }

  /* 福利厚生 */
  .welfare { padding-bottom: 110px; }
  .welfare-inner { width: min(315px, 100% - 60px); padding-top: 85px; }
  .welfare .sec-head { flex-direction: column-reverse; align-items: flex-start; gap: 6px; height: auto; }
  .welfare .sec-head-en { font-size: 48px; line-height: 1; }
  .wf-list { margin-top: 36px; row-gap: 0; column-gap: 0; }
  .wf-card {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
    width: 100%;
    height: auto;
    padding: 20px 0;
    border-top: 1px solid #d1d1d1;
    border-bottom: none;
  }
  .wf-card:last-child {
    border-bottom: 1px solid #d1d1d1;
  }
  .wf-card .wf-photo { display: none; }
  .wf-card .wf-panel { display: none; }
  .wf-icon {
    width: 41px !important;
    height: 41px !important;
    max-width: 41px !important;
    max-height: 41px !important;
    flex-shrink: 0;
    object-fit: contain;
  }
  .wf-card--2 .wf-icon {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
    margin-left: 5.5px !important;
    margin-right: 5.5px;
  }
  .wf-card .wf-text {
    width: auto;
    padding: 0;
    background: none;
  }
  .wf-card .wf-title { font-size: 20px; line-height: 1.6; letter-spacing: 1.45px; }
  .wf-card .wf-body { width: auto; margin-top: 8px; font-size: 15px; line-height: 1.6; letter-spacing: 0.5px; }
  .wf-note { font-size: 14px; }

  /* データで見るアデプト */
  .data {
    height: auto;
    padding-bottom: 105px;
    background-image: url(../images/rec-data-bg-sp.webp);
  }
  .data-inner { width: min(313px, 100% - 60px); padding-top: 87px; }
  .data .sec-head { flex-direction: column-reverse; align-items: flex-start; gap: 6px; height: auto; }
  .data .sec-head-en { font-size: 48px; line-height: 1; letter-spacing: 6.24px; }
  .data-list { width: 100%; margin-top: 40px; flex-wrap: wrap; row-gap: 40px; column-gap: 30px; }
  .data-card { width: 100%; height: 190px; border-radius: 10px; }
  .data-note { margin-top: 20px; font-size: 14px !important; text-align: center; }
  .data-footnotes { margin-top: 16px; }
  .data-footnote { font-size: 12px !important; line-height: 1.8; }
  .data-card-note { font-size: 12px; top: 145px; }
  .data-badge {
    display: inline-block;
    padding: 4px 14px;
    border: 1px solid #333;
    border-radius: 999px;
    font-size: 11px;
    letter-spacing: 0.5px;
    color: #333;
  }

  .data-card .data-label {
    left: 0;
    width: 100%;
    top: 12px;
    font-size: 14.3px;
    letter-spacing: 1.1px;
    text-align: center;
  }
  .data-card .data-value {
    left: 0;
    width: 100%;
    top: 67px;
    font-size: 90px;
    line-height: 80px;
    text-align: center;
  }
  .data-card .data-unit { font-size: 24px; line-height: 80px; }
  .data-card .data-ratio { left: 0; width: 100%; top: 47px; justify-content: center; }
  .data-circle { border-width: 0.94px; }
  .data-circle--lg { width: 102.33px; height: 102.33px; font-size: 52.05px; line-height: 46.26px; }
  .data-circle--lg .data-unit { font-size: 13.88px; line-height: 46.26px; }
  .data-circle--sm { width: 81.87px; height: 81.87px; font-size: 41.64px; line-height: 37.01px; }
  .data-circle--sm .data-unit { font-size: 11.1px; line-height: 37.01px; }
  .data-card-sub { top: 60px; font-size: 12px; }
  .data-card--5 .data-value { top: 38px; }

  /* 募集要項・説明会エントリー */
  .entry-band {
    height: auto;
    padding: 99px 0 110.5px;
    justify-content: flex-start;
    gap: 44.6px;
  }
  .entry-title {
    width: min(315px, 100% - 60px);
    height: auto;
    font-size: 26.4px;
    line-height: 1.5;
  }
  .entry-cards {
    width: min(315px, 100% - 60px);
    height: auto;
    flex-direction: column;
    align-items: center;
    gap: 50px;
  }
  .entry-sep {
    position: static;
    order: 2;
    width: 100%;
    height: 1px;
  }
  .entry-card { order: 1; flex-direction: column; align-items: stretch; height: auto; gap: 20px; }
  .entry-card--new { width: 100%; }
  .entry-card--career { width: 100%; order: 3; gap: 18px; }
  .entry-meta { width: 100%; height: auto; align-items: flex-start; gap: 12px; }
  .entry-card--new .entry-meta { width: 100%; }
  .entry-card--career .entry-meta { width: 100%; height: auto; }
  .entry-meta-title {
    height: auto;
    font-size: 22px;
    line-height: 24.2px;
    letter-spacing: 1px;
    text-align: left;
  }
  .entry-meta-list {
    height: auto;
    min-height: 62px;
    font-size: 14px;
    line-height: 22.4px;
    letter-spacing: 0.5px;
    text-align: left;
  }
  .entry-btns { width: 100%; height: auto; gap: 18px; }
  .entry-btn { width: 100%; height: 54px; border-width: 1px; border-radius: 3.6px; padding: 0 7.88px 0 19px; }
  .entry-btn-text { font-size: 14px; line-height: 26.4px; letter-spacing: 1.2px; }
  .entry-btn-icon {
    width: 36.12px;
    height: 36.12px;
    border-radius: 3.6px;
  }

  /* 私たちについて */
  .about {
    height: auto;
    padding-bottom: 80px;
  }
  .about-overlay {
    background: linear-gradient(to bottom, rgba(255,255,255,0.85) 50%, rgba(255,255,255,0.4) 100%);
  }
  .about-inner {
    position: relative; z-index: 2;
    display: flex;
    transform: none;
    width: 100%;
    padding-top: 101px;
    flex-direction: column;
    align-items: center;
  }
  .about-body { width: min(314px, 100% - 62px); gap: 20px; }
  .about-body .sec-head {
    width: 100%;
    height: auto;
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 6px;
  }
  .about-body .sec-head-en { font-size: 48px; line-height: 1; }
  .about-heading { height: auto; font-size: 27px; line-height: 43.2px; letter-spacing: 1.45px; }
  .about-text { width: 100%; height: auto; font-size: 15px; line-height: 24px; letter-spacing: 0.5px; }


  /* ファーストビュー */
  .page-nav { display: none; }
  .fv {
    --u: clamp(0.8px, 100vw / 375, 1.3333px);
    height: 100dvh;
  }
  .fv-inner {
    left: calc(50% - 187.5 * var(--u));
    width: calc(375 * var(--u));
  }
  .fv-bg,
  .fv-person {
    top: 0;
    height: 100dvh;
    object-position: center top;
  }
  .fv-bg-wrap::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, transparent 40%, rgba(0,0,0,0.5) 100%);
    pointer-events: none;
    z-index: 1;
  }
  .fv-wil--sp { display: none; }
  .fv-wil--back:not(.fv-wil--sp),
  .fv-wil--front:not(.fv-wil--sp) { display: none; }
  .fv-wil-text {
    left: 50%;
    right: auto;
    transform: translateX(calc(-50% - 5 * var(--u))) scale(1.254);
    transform-origin: center bottom;
    bottom: calc(18 * var(--u));
    width: calc(240 * var(--u));
    height: calc(100 * var(--u));
  }
  .fv-wil-work {
    font-size: calc(72 * var(--u));
    line-height: calc(56 * var(--u));
    letter-spacing: -0.02em;
  }
  .fv-wil-is {
    left: calc(59 * var(--u));
    top: calc(44 * var(--u));
    font-size: calc(72 * var(--u));
    line-height: calc(56 * var(--u));
  }
  .fv-wil-life {
    font-size: calc(72 * var(--u));
    line-height: calc(56 * var(--u));
    top: calc(40 * var(--u));
    letter-spacing: -0.02em;
  }
  .fv-breadcrumb { display: none; }
  .fv-tile--4 { display: none; }
  .fv-tile--1 { z-index: 9;  left: calc(251.3 * var(--u)); top: calc(39 * var(--u)); width: calc(74.7 * var(--u)); height: calc(103.5 * var(--u)); }
  .fv-tile--2 { z-index: 10; left: calc(300.3 * var(--u)); top: calc(108.3 * var(--u)); width: calc(74.7 * var(--u)); height: calc(100.8 * var(--u)); }
  .fv-tile--3 { z-index: 8;  left: 0;                    top: calc(107 * var(--u)); width: calc(113 * var(--u)); height: calc(69.54 * var(--u)); }
  .fv-tile-shine--4 { display: none; }
  .fv-tile-shine--1 { left: calc(251.3 * var(--u)); top: calc(39 * var(--u)); width: calc(74.7 * var(--u)); height: calc(103.5 * var(--u)); }
  .fv-tile-shine--2 { left: calc(300.3 * var(--u)); top: calc(108.3 * var(--u)); width: calc(74.7 * var(--u)); height: calc(100.8 * var(--u)); }
  .fv-tile-shine--3 { left: 0;                    top: calc(107 * var(--u)); width: calc(113 * var(--u)); height: calc(69.54 * var(--u)); }
  .fv-title { display: none; }
  .fv-title-ja { display: none; }
  .fv-lead {
    left: calc(20 * var(--u));
    top: auto;
    bottom: calc(159.4 * var(--u));
    width: calc(316 * var(--u));
    gap: 0;
  }
  .fv-lead-heading {
    width: 100%;
    height: auto;
    font-size: calc(13.5 * var(--u));
    line-height: calc(22.95 * var(--u));
    letter-spacing: calc(0.42 * var(--u));
    color: #fff;
    filter: drop-shadow(0 0 calc(8 * var(--u)) rgba(0, 0, 0, 0.39));
  }
  .fv-lead-text {
    width: 100%;
    height: auto;
    font-size: calc(13.5 * var(--u));
    line-height: calc(22.95 * var(--u));
    letter-spacing: calc(0.42 * var(--u));
    color: #fff;
    filter: drop-shadow(0 0 calc(8 * var(--u)) rgba(0, 0, 0, 0.39));
  }

  /* 募集職種 */
  .op {
    --u: clamp(0.8px, 100vw / 375, 1px);
    padding-bottom: calc(88 * var(--u));
  }
  .op-inner { width: calc(318 * var(--u)); padding-top: calc(10 * var(--u)); }
  .op-head { height: auto; flex-direction: column-reverse; align-items: flex-start; gap: calc(10 * var(--u)); }
  .op-head-en {
    font-size: calc(48 * var(--u));
    line-height: calc(56.4 * var(--u));
    letter-spacing: calc(6.24 * var(--u));
    white-space: normal;
  }
  .op-head-ja {
    margin-left: 0;
    font-size: calc(14 * var(--u));
    line-height: calc(21.04 * var(--u));
    letter-spacing: calc(0.7 * var(--u));
  }
  .op-list { margin-top: calc(40 * var(--u)); border-bottom-width: calc(1 * var(--u)); width: auto; }
  .op-row {
    position: relative;
    height: auto;
    padding: calc(16 * var(--u)) 0;
    border-top-width: calc(1 * var(--u));
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    align-content: center;
  }
  .op-link {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    padding-right: calc(40 * var(--u));
  }
  .op-tag {
    position: static;
    width: auto;
    padding: 0 calc(12 * var(--u));
    height: calc(28 * var(--u));
    border-width: calc(1 * var(--u));
    border-radius: calc(2 * var(--u));
    font-size: calc(11 * var(--u));
    line-height: calc(28 * var(--u));
  }
  .op-job { position: static; margin-left: calc(10 * var(--u)); font-size: calc(18 * var(--u)); }
  .op-row--1 .op-job, .op-row--2 .op-job,
  .op-row--3 .op-job, .op-row--4 .op-job { top: auto; }
  .op-arrow { position: absolute; right: 0; left: auto; top: 50%; transform: translateY(-50%); font-size: calc(18 * var(--u)); }
  .op-visual {
    position: static;
    width: calc(318 * var(--u));
    height: calc(210 * var(--u));
    display: grid;
    grid-template-rows: calc(210 * var(--u));
    margin-top: calc(40 * var(--u));
    overflow: visible;
  }
  .op-visual > *,
  .op-visual > picture > img {
    grid-area: 1 / 1;
  }
  .op-copy--pc { display: none; }
  .op-copy--sp {
    display: none;
    align-self: start;
    width: calc(315 * var(--u));
    margin-top: calc(130 * var(--u));
    padding: 0;
    font-size: calc(42 * var(--u));
    line-height: calc(110.25 * var(--u));
    text-align: center;
    white-space: nowrap;
    filter: drop-shadow(0 calc(4 * var(--u)) calc(4 * var(--u)) rgba(0, 0, 0, 0.25));
  }

  /* 選考フロー */
  .flow { padding-bottom: 80px; }
  .flow-inner { width: min(315px, 100% - 60px); padding-top: 80px; }
  .flow .sec-head {
    height: auto;
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 6px;
  }
  .flow .sec-head-en { font-size: 48px; line-height: 1; letter-spacing: 6.24px; }
  .flow-list { width: 100%; margin-top: 40px; padding-bottom: 0; flex-direction: column; }
  .flow-step { width: 100%; height: 218px; padding: 0; }
  .flow-step::after {
    left: 0;
    top: 100%;
    width: 100%;
    height: 28px;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
  }
  .flow-step--1 { border-radius: 10px 10px 0 0; }
  .flow-step--5 { border-radius: 0 0 10px 10px; }
  .flow-num,
  .flow-title,
  .flow-desc {
    position: absolute;
    left: 0;
    width: 100%;
    margin-top: 0;
    min-height: 0;
    text-align: center;
  }
  .flow-num { font-size: 55.3px; line-height: 60.48px; }
  .flow-title { font-size: 13.82px; line-height: 22.47px; }
  .flow-desc { font-size: 10.37px; line-height: 19.01px; }
  .flow-step--1 .flow-num { top: 24.0px; }
  .flow-step--1 .flow-title { top: 91.93px; }
  .flow-step--1 .flow-desc { top: 151.48px; }
  .flow-step--2 .flow-num { top: 37.99px; }
  .flow-step--2 .flow-title { top: 108.93px; }
  .flow-step--2 .flow-desc { top: 164.01px; }
  .flow-step--3 .flow-num { top: 39.19px; }
  .flow-step--3 .flow-title { top: 109.2px; }
  .flow-step--3 .flow-desc { top: 159.19px; }
  .flow-step--4 .flow-num { top: 41.99px; }
  .flow-step--4 .flow-title { top: 120.02px; }
  .flow-step--4 .flow-desc { top: 167.02px; }
  .flow-step--5 .flow-num { top: 39.96px; }
  .flow-step--5 .flow-title { top: 102.03px; }
  .flow-step--5 .flow-desc { top: 136.01px; }

  /* 代表メッセージ */
  .message {
    height: auto;
    min-height: 0;
    margin-top: -10px;
    padding-bottom: 101.56px;
    overflow: visible;
  }
  .message-inner {
    width: min(315px, 100% - 60px);
    margin: 0 auto;
    padding-top: 57px;
    flex-direction: column;
    align-items: stretch;
  }
  .message-body { width: 100%; display: contents; }
  .message-body .sec-head {
    height: auto;
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 6px;
    order: 1;
  }
  .message-body .sec-head-en { font-size: 48px; line-height: 1; letter-spacing: 4.8px; }
  .message-lead { width: 100%; height: auto; margin-top: 30px; font-size: 22px; line-height: 35.2px; letter-spacing: 1.45px; order: 3; }
  .message-text { width: 100%; height: auto; margin-top: 20px; font-size: 16px; line-height: 25.6px; letter-spacing: 0.5px; order: 4; }
  .message-btn {
    width: 206px;
    height: 45px;
    margin-top: 33px;
    padding: 0 5px 0 20px;
    border-width: 1px;
    border-radius: 3px;
    order: 5;
  }
  .message-btn-text { font-size: 14px; line-height: 22px; letter-spacing: 1px; }
  .message-btn-icon { width: 31.18px; height: 31.18px; border-radius: 3.6px; }
  .about-btn {
    width: 206px; height: 45px; margin-top: 28px;
    padding: 0 5px 0 20px; border-width: 1px; border-radius: 3px;
  }
  .about-btn-text { font-size: 14px; line-height: 22px; letter-spacing: 1px; }
  .about-btn-icon { width: 31.18px; height: 31.18px; border-radius: 3.6px; }
  .message-photo {
    width: 100%;
    height: auto;
    aspect-ratio: 315 / 214;
    margin-top: 30px;
    order: 2;
  }

  /* インタビュー */
  .interview { height: auto; padding-bottom: 106px; }
  .interview-inner { width: 100%; padding-top: 0; gap: 30px; }
  .interview .sec-head {
    width: min(315px, 100% - 60px);
    margin: 0 auto;
    padding-top: 80px;
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 6px;
    height: auto;
  }
  .interview .sec-head-en { font-size: 48px; line-height: 1; }
  .iv-list { gap: 30px; }
  .iv-card,
  .iv-card--rev {
    flex-direction: column;
    align-items: center;
    gap: 0;
    width: calc(100% - 40px);
    margin: 0 auto;
    height: auto;
    padding-top: 50px;
  }
  .iv-card > picture {
    width: calc((100% - 56px) * 0.8);
    height: auto;
    flex-shrink: 0;
  }
  .iv-photo {
    width: 100%;
    height: auto;
    aspect-ratio: 315 / 421;
  }
  .iv-body,
  .iv-card--rev .iv-body {
    width: 100%;
    height: auto;
    padding: 40px 20px;
    gap: 25px;
  }
  .iv-head { gap: 12px; }
  .iv-catch { font-size: 18px; line-height: 30px; letter-spacing: 1.2px; }
  .iv-meta { font-size: 14px; line-height: 23px; }
  .iv-meta-name { font-size: 15px; }
  .iv-text { font-size: 15px; line-height: 180%; }

  /* Footer SP は max-width:767px の独立ブロックへ分離（このファイル末尾）。
     大トップ（top.css）と同じ境界にすることで、768px ではタブレット（PC縮小版）の
     フッターが出る。767px 以下の値は変更していない */
}

/* ===== Footer SP（767px以下） — 大トップ top.css と同じ境界。値は従来どおり ===== */
@media (max-width: 767px) {
  .site-footer { padding: 50px 0 0; }
  .footer-inner { padding: 0 30px; }
  .footer-top { flex-direction: column; }
  .footer-logo img { width: 220px; }
  .footer-address { margin-top: 25px; font-size: 13px; }
  .footer-nav { flex-wrap: wrap; gap: 0; margin-top: 35px; }
  .footer-nav-col { width: 50%; }
  .footer-nav-col a { font-size: 14px; line-height: 2.75; }
  .footer-divider { margin-top: 35px; }
  .footer-copy { padding: 20px 0 30px; font-size: 10px; }
}

/* 福利厚生 2列 600px以上 */
@media (min-width: 600px) and (max-width: 768px) {
  .welfare-inner { width: min(660px, 100% - 60px); }
  .wf-card { width: calc(50% - 15px); }
  .data-inner { width: min(656px, 100% - 60px); }
  .data-card { width: calc(50% - 15px); }

  .entry-cards { width: min(600px, 100% - 60px); flex-direction: row; align-items: stretch; gap: 30px; }
  .entry-sep { width: 1px; height: auto; align-self: stretch; }
  .entry-card { flex: 1; }
}

/* ===== タブレット縦持ち（768〜1023px） — SPブロック後に配置して768px精度担保 ===== */
@media (min-width: 768px) and (max-width: 1023px) {

  /* Header — タブレット（大トップ準拠） */
  .sp-only { display: none; }
  .header-inner { padding: 18px 30px; }
  .header-nav { display: none; }
  .header-right { display: none; }
  .hamburger { display: block; }
  .sp-menu {
    left: auto; right: 0; width: 340px;
    height: auto; padding: 80px 40px 35px;
    box-shadow: -2px 2px 15px rgba(0,0,0,0.15);
  }
  body.sp-menu-open { overflow: auto; }
  /* ドロワーは header.php で .site-header の内側に置いてある。
     ヘッダー(z:500)の中で「白背景 → パネル(z:490) → X(z:510)」の順に重なるため、
     ヘッダーの背景色には一切触れずにパネルを前面のレイヤーへ出せる。
     ヘッダー全体はページ内ナビ(z:499)より上なので、そちらにも被らない。

     ただし is-scrolled の backdrop-filter は、その要素の外へはみ出す子
     （パネルは 485px、ヘッダーは 65px）があると背景の合成が崩れ、
     ヘッダーの白がまだらに欠けて透けて見える。開いている間はぼかしだけ外す。
     背景色 rgba(255,255,255,0.95) はそのまま＝白いヘッダーは維持される。 */
  body.sp-menu-open .site-header { backdrop-filter: none; }
  .page-nav { display: none; }

  /* FV — PCデザイン(1440x875)の比率をそのまま縮小： 875 / 1440 = 60.7639%
     ※以前の 57.3vw は大トップ(1440x825)からの流用で、リクルートFVの比率ではなかった */
  .fv { height: 60.7639vw; }
  .fv-inner { left: 0; width: 100%; }
  /* FV の高さがタブレットでは小さいため、+30px が相対的に効きすぎて画像が下にずれ、
     上端に .fv の地色(#d9d9d9)が 12px ほど帯状に出ていた。
     （768px: 20%分 -18.1px に対し +30px → 差し引き +11.9px 下へ）
     +30px を外して 20% のみにすると 768〜1023px の全幅で上端まで画像が覆う。
     ※背景(.fv-bg)と切り抜き(.fv-person)は必ず同じ値にすること。片方だけ動かすとズレる */
  .fv-bg,
  .fv-person { object-position: center 20%; }
  .fv-bg-wrap::after { content: none; }
  .fv-wil--sp { display: none; }
  .fv-wil--back:not(.fv-wil--sp),
  .fv-wil--front:not(.fv-wil--sp) { display: block; }
  .fv-breadcrumb { display: flex; }
  /* パンくず・タイトルを +2.1vw 下げる。
     FV内の比率は1440の正確な縮小になっているが、ヘッダーだけは高さが固定(65〜85px)で
     縮小されないため、比率どおりの位置だとパンくずがヘッダーに食い込む。
     内部の間隔（パンくず→タイトル→日本語）は1440と同じまま、上の3つをまとめて下げる。
     ベース値: パンくず 7.7083vw / タイトル 11.1937vw / 日本語 14.7736vw */
  .fv-breadcrumb { top: 9.8083vw; }
  .fv-title { top: 13.2937vw; }
  .fv-title-ja { top: 16.8736vw; }

  .fv-tile--4 { display: block; }
  .fv-tile--1 { z-index: 10; left: 73.7451vw; top: 8.9361vw; width: 11.2868vw; height: 7.4021vw; }
  .fv-tile--2 { z-index: 9;  left: 83.6007vw; top: 13.2306vw; width: 10.8368vw; height: 7.3611vw; }
  .fv-tile--3 { z-index: 2;  left: 71.8750vw; top: 40.0694vw; width: 11.4819vw; height: 7.0660vw; }
  .fv-tile--4 { z-index: 8;  left: 77.1875vw; top: 46.5162vw; width: 14.2726vw; height: 8.6387vw; }
  .fv-title { display: none; }
  .fv-title-ja { display: none; }
  .fv-lead {
    left: 6.25vw; top: 11.1937vw;
    width: 38.4722vw; gap: 0;
  }
  .fv-lead-heading {
    width: 100%; height: auto;
    font-size: 1.1111vw; line-height: 2vw;
    letter-spacing: 0.0333vw;
    color: #000; filter: none;
  }
  .fv-lead-text {
    width: 100%; height: auto;
    font-size: 1.1111vw; line-height: 2vw;
    letter-spacing: 0.0333vw;
    color: #000; filter: none;
  }

  /* ============================================================
     以下、全セクション「PCレイアウトを維持したままサイズのみ縮小」。
     flex-direction の縦積み変更は一切行わない。
     768px ちょうどでSPブロックが漏れるため、構造プロパティは明示的にPC値へ戻す。
     ============================================================ */

  /* 見出し共通 */
  .sec-head-ja { height: auto; font-size: 11px; line-height: 1.6; letter-spacing: 0.6px; }

  /* ---------- About（PC同様：テキスト左・写真右の横並び） ---------- */
  /* PCは高さ固定＋中身を絶対配置だが、タブレットでは中身の高さが幅によって変わり
     上下の余白がズレる。通常の流し込みに戻し padding で上下を同じ75pxに揃える */
  .about {
    height: auto; min-height: 0; padding: 75px 0;
    background-image: url(../images/rec-about-bg.webp);
  }
  .about-inner {
    position: relative; left: auto; transform: none; top: auto;
    width: 88%; margin: 0 auto; padding-top: 0;
    flex-direction: row; justify-content: space-between; align-items: flex-start;
  }
  /* PC(1440px)の比率をそのまま再現：写真54.95% / テキスト40.66%（コンテナ内）
     ※以前は写真40%/テキスト52%と逆転していた */
  .about-photo {
    width: 55%; height: auto; aspect-ratio: 600 / 374;
    margin-top: 0; object-fit: cover;
  }
  .about-body { width: 41%; gap: 0; }
  .about-body .sec-head {
    width: 100%; height: auto;
    flex-direction: row; align-items: center; gap: 10px;
  }
  .about-body .sec-head-en { font-size: 48px; line-height: 1.1; }
  /* PCは .about-heading に固定高さがあり見出しと本文の間に余白ができる。
     タブレットは height:auto のため margin-bottom で同じ間隔を作る */
  .about-heading { margin-top: 6px; margin-bottom: 12px; height: auto; font-size: 15px; line-height: 1.65; letter-spacing: 0.8px; }
  /* 文字サイズは改行位置から逆算。11.5pxだと「通じ/て、」「していま/す。」と語中で割れる。
     10.5px/字間0.2pxで1文目が読点で終わり、2文目が1行に収まる */
  .about-text { width: auto; height: auto; font-size: 10.5px; line-height: 1.85; letter-spacing: 0.2px; }

  /* ---------- Entry Band（PC同様：カード2枚を横並び＋中央仕切り線） ---------- */
  .entry-band {
    height: auto; padding: 50px 0;
    justify-content: center; align-items: center; gap: 28px;
  }
  .entry-title { width: auto; height: auto; font-size: 20px; line-height: 1.45; }
  .entry-cards {
    position: relative; width: auto; height: auto;
    flex-direction: row; align-items: stretch; gap: 28px;
  }
  .entry-sep {
    position: absolute; order: 0; left: 304px; top: 0;
    width: 1px; height: 100%; display: block;
  }
  /* 左右2枚のカードで、職種名の塊は上揃え・ボタンは下揃え */
  .entry-card {
    order: 0; flex-direction: row;
    justify-content: space-between; align-items: stretch;
    height: auto; gap: 0;
  }
  .entry-card--new { width: 290px; flex: 0 0 290px; }
  /* 中途は職種名が長い。PCと同じ3行（営業職〜／事務系〜マーケティング・／DX責任者候補）に
     収まるよう職種欄を178pxまで広げる。134pxでは職種の途中で割れていた */
  .entry-card--career { width: 358px; flex: 0 0 358px; }
  .entry-meta { height: auto; align-items: flex-start; justify-content: flex-start; gap: 8px; }
  .entry-card--new .entry-meta { width: 96px; height: auto; }
  .entry-card--career .entry-meta { width: 165px; height: auto; }
  /* 職種名はタブレットではスラッシュの後で改行する */
  .br-tb { display: inline; }
  .br-nontb { display: none; }

  .entry-meta-title { height: auto; font-size: 18px; line-height: 1.25; letter-spacing: 0.8px; text-align: left; }
  .entry-meta-list { height: auto; min-height: 0; font-size: 10px; line-height: 1.6; letter-spacing: 0.35px; text-align: left; }
  .entry-btns { width: 190px; height: auto; justify-content: flex-end; flex: 0 0 auto; gap: 8px; }
  .entry-btn { width: 190px; height: 40px; flex: 0 0 40px; border-width: 1px; border-radius: 3px; padding: 0 6px 0 14px; }
  .entry-btn-text { font-size: 10px; line-height: 1.5; letter-spacing: 0.5px; }
  .entry-btn-icon {
    width: 28px; height: 28px; border-radius: 3px;
  }

  /* ---------- Interview（PC同様：写真と本文の横並び／2枚目は左右反転） ---------- */
  .interview { height: auto; padding-bottom: 60px; }
  .interview-inner { width: 88%; margin: 0 auto; padding-top: 60px; gap: 30px; }
  .interview .sec-head {
    width: auto; margin: 0; padding-top: 0; height: auto;
    flex-direction: row; align-items: center; gap: 10px;
  }
  .interview .sec-head-en { font-size: 48px; line-height: 1.1; }
  .iv-list { gap: 35px; }
  .iv-card {
    flex-direction: row; align-items: flex-start; gap: 20px;
    width: 100%; margin: 0; height: auto; min-height: 260px; padding-top: 0;
  }
  .iv-card--rev {
    flex-direction: row-reverse; align-items: flex-start; gap: 20px;
    width: 100%; margin: 0; height: auto; min-height: 260px; padding-top: 0;
  }
  .iv-card > picture { width: 30%; height: auto; min-height: 260px; align-self: stretch; flex-shrink: 0; }
  .iv-photo { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; }
  .iv-body { width: auto; flex: 1; height: auto; padding: 24px 24px 24px 0; gap: 14px; }
  .iv-card--rev .iv-body { width: auto; height: auto; padding: 24px 0 24px 24px; gap: 14px; }
  .iv-head { gap: 10px; }
  .iv-catch { font-size: 16px; line-height: 1.65; letter-spacing: 0.9px; }
  .iv-meta { font-size: 11px; line-height: 1.6; }
  .iv-meta-name { font-size: 12px; }
  .iv-text { font-size: 12px; line-height: 1.8; }

  /* ---------- Message（PC同様：テキスト左・写真右の横並び） ---------- */
  .message {
    height: auto; min-height: 340px; padding: 55px 0;
    background-image: url(../images/rec-message-bg.webp);
  }
  .message-inner {
    width: 88%; margin: 0 auto; height: auto; padding-top: 0;
    flex-direction: row; justify-content: space-between; align-items: center;
  }
  .message-body { width: 46%; display: flex; flex-direction: column; }
  .message-body .sec-head {
    height: auto; order: 0;
    flex-direction: row; align-items: center; gap: 10px;
  }
  .message-body .sec-head-en { font-size: 48px; line-height: 1.1; letter-spacing: normal; }
  .message-lead { width: auto; height: auto; margin-top: 6px; font-size: 16px; line-height: 1.65; letter-spacing: 0.9px; order: 0; }
  .message-text { width: auto; height: auto; margin-top: 14px; font-size: 12px; line-height: 1.8; letter-spacing: 0.4px; order: 0; }
  .message-btn {
    width: 165px; height: 38px; margin-top: 20px; padding: 0 5px 0 14px;
    border-width: 1px; border-radius: 3px; order: 0;
  }
  .message-btn-text { font-size: 12px; line-height: 1.5; letter-spacing: 0.8px; }
  .message-btn-icon { width: 26px; height: 26px; border-radius: 3px; }
  .about-btn {
    width: 165px; height: 38px; margin-top: 20px; padding: 0 5px 0 14px;
    border-width: 1px; border-radius: 3px;
  }
  .about-btn-text { font-size: 12px; line-height: 1.5; letter-spacing: 0.8px; }
  .about-btn-icon { width: 26px; height: 26px; border-radius: 3px; }
  .message-photo {
    width: 48%; height: auto; aspect-ratio: 550 / 374;
    margin-top: 0; order: 0; object-fit: cover;
  }

  /* ---------- Welfare（PC同様：2カラム／写真＋斜めパネル重ね） ---------- */
  .welfare { padding-bottom: 55px; }
  .welfare-inner { width: 88%; padding-top: 55px; }
  .welfare .sec-head { height: auto; flex-direction: row; align-items: center; gap: 10px; }
  .welfare .sec-head-en { font-size: 48px; line-height: 1.1; }
  .wf-list { margin-top: 18px; flex-direction: row; flex-wrap: wrap; justify-content: space-between; row-gap: 18px; column-gap: 0; }
  .wf-card { display: grid; width: 48.5%; height: auto; min-height: 118px; }
  .wf-card .wf-photo { justify-self: start; height: 100%; object-fit: cover; }
  .wf-card .wf-panel { display: block; justify-self: end; height: 100%; }
  .wf-card { min-height: 120px; }
  .wf-card .wf-text { width: auto; background: none; padding: 0; }
  /* 写真幅・パネル幅・テキスト位置はPC(1440px)のカード幅526pxに対する比率をそのまま%で再現。
     vw指定のままだとタブレットではカード幅との比率が崩れ、見出しが写真側にはみ出すため。 */
  .wf-card .wf-panel { width: 69.96%; }
  .wf-card--6 .wf-panel { width: 71.88%; }
  .wf-card--1 .wf-photo { width: 48.43%; }
  .wf-card--2 .wf-photo { width: 46.09%; }
  .wf-card--3 .wf-photo { width: 44.20%; }
  .wf-card--4 .wf-photo { width: 59.57%; }
  .wf-card--5 .wf-photo { width: 42.89%; }
  .wf-card--6 .wf-photo { width: 48.05%; }
  .wf-card--1 .wf-text { padding-left: 43.46%; padding-top: 13px; }
  .wf-card--2 .wf-text { padding-left: 43.31%; padding-top: 17px; }
  .wf-card--3 .wf-text { padding-left: 42.34%; padding-top: 19px; }
  .wf-card--4 .wf-text { padding-left: 43.61%; padding-top: 15px; }
  .wf-card--5 .wf-text { padding-left: 44.81%; padding-top: 21px; }
  .wf-card--6 .wf-text { padding-left: 43.65%; padding-top: 21px; }
  .wf-card .wf-title { font-size: 15px; line-height: 1.6; letter-spacing: 0.9px; }
  .wf-card--5 .wf-title { font-size: 15px; line-height: 1.6; }
  .wf-card .wf-body { width: auto; margin-top: 7px; font-size: 11px; line-height: 1.65; letter-spacing: 0.35px; }
  .wf-card--1 .wf-body { width: 89.2%; }
  .wf-card--6 .wf-body { font-size: 10.5px; line-height: 1.6; }
  .wf-note { font-size: 11px; }

  /* ---------- Data（PC同様：カード5枚を1列横並び） ---------- */
  .data {
    height: auto; min-height: 330px; padding-bottom: 45px;
    background-image: url(../images/rec-data-bg.webp);
  }
  .data-inner { width: 90%; padding-top: 55px; }
  .data .sec-head { height: auto; flex-direction: row; align-items: center; gap: 10px; }
  .data .sec-head-en { font-size: 48px; line-height: 1.1; letter-spacing: normal; }
  .data-list {
    width: auto; margin-top: 16px;
    flex-wrap: nowrap; justify-content: space-between; row-gap: 0; column-gap: 0;
  }
  .data-card { width: 18.6%; height: 118px; border-radius: 8px; }
  .data-card .data-label { left: 0; width: 100%; top: 13px; font-size: 11px; letter-spacing: 0.7px; text-align: center; }
  .data-card .data-value { left: 0; width: 100%; top: 30px; font-size: 52px; line-height: 46px; text-align: center; }
  .data-card .data-unit { font-size: 14px; line-height: 46px; }
  .data-card--5 .data-value { top: 30px; }
  .data-card-sub { top: 36px; font-size: 9.5px; }
  .data-card .data-ratio { left: 0; width: 100%; top: 26px; justify-content: center; }
  .data-circle { border-width: 1px; }
  .data-circle--lg { width: 62px; height: 62px; font-size: 31px; line-height: 1; }
  .data-circle--lg .data-unit { font-size: 9px; line-height: 1; }
  .data-circle--sm { width: 50px; height: 50px; font-size: 25px; line-height: 1; }
  .data-circle--sm .data-unit { font-size: 8px; line-height: 1; }
  .data-card-note { top: auto; bottom: 6px; font-size: 9px; }
  .data-badge {
    padding: 3.6px 12.6px;
    font-size: 9.9px;
    letter-spacing: 0.45px;
  }
  .data-note { margin-top: 14px; font-size: 14px; text-align: left; }

  /* ---------- Flow（PC同様：5ステップを矢羽根で横並び） ---------- */
  .flow { padding-bottom: 15px; }
  .flow-inner { width: 90%; padding-top: 55px; }
  .flow .sec-head { height: auto; flex-direction: row; align-items: center; gap: 10px; }
  .flow .sec-head-en { font-size: 48px; line-height: 1.1; letter-spacing: normal; }
  .flow-list { width: auto; margin-top: 16px; padding-bottom: 36px; flex-direction: row; }
  .flow-step { width: 19%; height: auto; min-height: 210px; padding: 24px 9px 14px; }
  .flow-step::after {
    left: 100%; top: 0; width: 14px; height: 100%;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
  }
  .flow-step--1 { border-radius: 8px 0 0 8px; }
  .flow-step--5 { border-radius: 0 8px 8px 0; }
  .flow-num,
  .flow-title,
  .flow-desc { position: static; left: auto; top: auto; width: auto; text-align: center; }
  .flow-num { font-size: 34px; line-height: 1.15; margin-top: 0; }
  .flow-title { font-size: 11px; line-height: 1.6; margin-top: 14px; min-height: 0; }
  .flow-desc { font-size: 8.5px; line-height: 1.75; margin-top: 12px; }

  /* ---------- Open Positions（PC同様：左に一覧・右に写真の横並び） ---------- */
  .op { padding-bottom: 55px; }
  .op-inner { width: 88%; padding-top: 0; position: relative; }
  .op-head { height: auto; flex-direction: row; align-items: center; gap: 10px; }
  .op-head-en { font-size: 48px; line-height: 1.1; letter-spacing: normal; white-space: nowrap; }
  .op-head-ja { margin-left: 10px; font-size: 11px; line-height: 1.6; letter-spacing: 0.5px; }
  .op-list { width: 44%; margin-top: 18px; border-bottom-width: 1px; }
  .op-row {
    position: relative; display: block;
    height: 62px; min-height: 0;
    align-content: normal; align-items: normal; flex-wrap: nowrap;
    padding: 0; border-top-width: 1px;
  }
  .op-link { display: block; position: relative; width: 100%; height: 100%; padding-right: 0; }
  .op-tag {
    position: absolute; left: 0; top: 18px;
    width: 78px; height: 24px; padding: 0;
    border-width: 1px; border-radius: 2px;
    font-size: 10px; line-height: 24px;
  }
  .op-job { position: absolute; left: 90px; top: 20px; margin-left: 0; font-size: 14px; }
  .op-row--1 .op-job, .op-row--2 .op-job,
  .op-row--3 .op-job, .op-row--4 .op-job { top: 20px; }
  .op-arrow { position: absolute; left: auto; right: 4px; top: 50%; transform: translateY(-50%); font-size: 14px; }
  .op-visual {
    position: absolute; right: 0; top: 76px;
    width: 48%; height: auto; aspect-ratio: 548 / 440;
    display: block; grid-template-rows: none;
    margin-top: 0; overflow: hidden;
  }
  .op-copy--pc, .op-copy--sp { display: none; }

  /* ---------- CTA（PC同様：見出し左・ボタン右の横並び） ---------- */
  .cta-inner {
    flex-direction: row; align-items: center; justify-content: space-between;
    padding: 55px 45px; gap: 0;
  }
  .cta-logo-pat--1 { left: 39px; top: 188px; width: 267px; height: 48px; }
  .cta-logo-pat--2 { left: 408px; top: 118px; width: 253px; height: 45px; }
  .cta-logo-pat--3 { left: 39px; top: 40px; width: 279px; height: 50px; }
  .cta-logo-pat--4 { left: 568px; top: 40px; width: 244px; height: 43px; }
  .cta-logo-pat--5 { left: 1099px; top: 192px; width: 253px; height: 45px; }
  .cta-logo-pat--6 { left: 1129px; top: 40px; width: 267px; height: 48px; }
  .cta-logo-pat--7 { left: 879px; top: 118px; width: 253px; height: 45px; }
  .cta-logo-pat--8 { left: 568px; top: 192px; width: 253px; height: 45px; }
  .cta-label { font-size: 12px; }
  .cta-heading { margin-top: 6px; font-size: 26px; line-height: 1.4; }
  .cta-button { width: 175px; height: 40px; padding: 0 6px 0 14px; font-size: 12px; }
  .cta-button-icon { width: 26px; height: 26px; }

  /* Footer — 既存の768-900 / 901-1149ブロックで対応済み */
}

/* ABOUT のテキストを天地センターに（PC のみ。
   1199px 以下は .about が height:auto で別指定があるため対象外） */
@media (min-width: 1200px) {
  .about-inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: 0;
    padding-bottom: 0;
  }
  /* 9.25変更依頼: 本文を約3分の2の行数に収めるため横幅を拡大し、透かしも右へ広げる */
  .about-body { width: min(46.25vw, 666px); }
  .about-overlay { background: linear-gradient(to right, rgba(255,255,255,0.82) 55%, rgba(255,255,255,0) 82%); }
}

/* ボタン文言は、ボタン左端〜矢印左端の中央に置く（全ブレイクポイント共通のため末尾に置く） */
.message-btn, .about-btn { padding-left: 0; }
.message-btn-text, .about-btn-text { flex: 1; text-align: center; }

/* 募集職種一覧：件数が4件を超えたら、4件分の高さに収まるよう1行の高さを詰める。
   ボックス・職種名・矢印は行の上下中央。職種名は矢印の手前で折り返す */
@media (min-width: 1200px) {
  .op-list { --op-scale: calc(4 / max(4, var(--op-count, 4))); width: min(33.6111vw, 484px); }
  .op-row { height: calc(min(7.6389vw, 110px) * var(--op-scale)); }
  /* 区分の囲みは文字幅ぴったり、職種名はその右に続けて並べる */
  .op-link {
    display: flex; align-items: center;
    gap: min(1.5278vw, 22px);
    padding: 0 min(2.0833vw, 30px) 0 min(0.6944vw, 10px);
  }
  .op-tag {
    position: static; flex-shrink: 0;
    width: auto; padding: 0 min(0.6944vw, 10px);
  }
  .op-job { position: static; font-size: min(1.25vw, 18px); line-height: 1.4; }
  .op-arrow { top: 50%; transform: translateY(-50%); }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .op-list { --op-scale: calc(4 / max(4, var(--op-count, 4))); }
  .op-row { height: calc(62px * var(--op-scale)); }
  .op-tag, .op-row .op-job { top: 50%; transform: translateY(-50%); }
  .op-job { right: 24px; line-height: 1.35; }
}
/* SPのABOUT本文は段落の改行をなくし、ひと続きの文章にする */
@media (max-width: 767px) {
  .about-text br { display: none; }
}

/* SPの代表メッセージ見出しは、かぎかっこを表示しない */
@media (max-width: 767px) {
  .msg-bracket { display: none; }
}

/* SPの募集職種一覧：区分の囲みを上、職種名を下に縦に並べる */
@media (max-width: 767px) {
  .op-link {
    width: 100%;
    flex-direction: column; align-items: flex-start;
    gap: calc(8 * var(--u));
    padding-right: calc(30 * var(--u));
  }
  .op-tag { flex-shrink: 0; white-space: nowrap; }
  .op-job { margin-left: 0; font-size: calc(15 * var(--u)); }
}

/* 採用ページのパンくずリンク（コーポレートの .page-head-crumb a に合わせる） */
.ts-breadcrumb a, .fv-breadcrumb a { color: inherit; text-decoration: none; transition: opacity 0.3s; }
.ts-breadcrumb a:hover, .fv-breadcrumb a:hover { opacity: 0.6; }

/* ===== 新卒・中途 サブヘッダー（募集要項＋エントリーフォーム）— 会社情報ページの .page-nav と同じ体裁 ===== */
.jsn-wrap { position: relative; z-index: 400; }
.jsn {
  background: #fff;
  box-shadow: inset 0 1px 0 #e8e8e8, inset 0 -1px 0 #e8e8e8;
}
.jsn.is-fixed {
  position: fixed;
  top: var(--jsn-top, 85px);
  left: 0;
  width: 100%;
  z-index: 400;
}
.jsn ul {
  display: flex;
  gap: 44.75px;
  margin: 0;
  padding: 0 0 0 max(30px, 6.25%);
  list-style: none;
}
.jsn a {
  display: block;
  padding: 18px 0 17px;
  border-bottom: 1px solid transparent;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: clamp(9px, 0.83333vw, 12px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.03em;
  color: #000;
  text-decoration: none;
  white-space: nowrap;
  transition: opacity 0.3s;
}
.jsn a:hover { opacity: 0.6; }
.jsn a.is-active { border-bottom-color: #000; }
@media (max-width: 767px) {
  .jsn ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 1fr;
    gap: 0;
    padding: 0;
  }
  .jsn li:nth-child(n+3) { border-top: 1px solid #e8e8e8; }
  .jsn li:nth-child(odd) { border-right: 1px solid #e8e8e8; }
  .jsn li:nth-child(odd):last-child { border-right: 0; grid-column: 1 / -1; }
  .jsn a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 12px 10px;
    font-size: 10px;
    line-height: 1.5;
    text-align: center;
    white-space: normal;
  }
  .jsn .jsn-entry a { word-break: keep-all; }
  .jsn.jsn--3col ul { grid-template-columns: repeat(3, 1fr); }
  .jsn.jsn--3col li { border-top: 0; border-right: 1px solid #e8e8e8; }
  .jsn.jsn--3col li:nth-child(n+4) { border-top: 1px solid #e8e8e8; }
  .jsn.jsn--3col li:nth-child(3n),
  .jsn.jsn--3col li:last-child { border-right: 0; grid-column: auto; }
}

/* 採用ヘッダー：1440pxを基準にPCの狭い画面で比例縮小 */
@media (min-width: 1200px) and (max-width: 1439px) {
  #site-header { padding-left: calc(41 * 100vw / 1440); padding-right: calc(46 * 100vw / 1440); }
  #site-header > .header-inner {
    width: 1353px;
    transform: scale(calc(100vw / 1440px));
    transform-origin: left center;
  }
}

/* DATA: PCのみ、大きな数値の単位を少し下げて間隔を確保。 */
@media (min-width: 1024px) {
  .data-value .data-unit {
    position: relative;
    top: 6px;
    margin-left: 4px;
  }
}

/* PCの有給休暇日数：小数点の左右だけを少し詰める。数値は管理画面に追従。 */
@media (min-width: 1024px) {
  .data-card--4 .data-dot {
    margin-inline: -2px;
  }
}

/* 採用TOP・福利厚生: SPでは本文を画面幅に合わせて自然に折り返す */
@media (max-width: 767px) {
  #welfare .wf-body { white-space: normal; }
  #welfare .wf-body br { display: none; }
}

/* SP福利厚生: 5・6項目目の下罫線と次項目の上罫線の重複を解消 */
@media (max-width: 767px) {
  #welfare .wf-card:nth-child(5),
  #welfare .wf-card:nth-child(6) { border-bottom: 0; }
}

/* 募集要項: 全画面幅で現在の職種を明示 */
#job-subnav a.is-active {
  opacity: 1;
  background-color: #000;
  color: #fff;
  border-bottom-color: #000;
  text-decoration: none;
  transition: none;
}
@media (min-width: 768px) {
  #job-subnav a { padding-left: 14px; padding-right: 14px; }
  #job-subnav ul { gap: 16.75px; }
}

/* 募集要項ナビ: 2行でも従来の1行ボタンの高さに揃える */
@media (min-width: 768px) {
  #job-subnav ul { height: calc(36px + clamp(9px, 0.83333vw, 12px)); }
  #job-subnav li { height: 100%; }
  #job-subnav a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    box-sizing: border-box;
    padding-top: 0;
    padding-bottom: 0;
    text-align: center;
  }
}

/* PC募集要項ナビ: 高さを維持して2行時の行間を確保 */
@media (min-width: 768px) {
  #job-subnav a { line-height: 1.5; }
}

/* 職種数にかかわらずナビ全体を中央配置し、左右余白を均等にする */
@media (min-width: 768px) {
  #job-subnav ul {
    padding-left: 24px;
    padding-right: 24px;
    justify-content: center;
    gap: clamp(4px, 1.16vw, 16.75px);
    box-sizing: border-box;
  }
  #job-subnav li { min-width: 0; flex: 0 1 auto; }
  #job-subnav a { white-space: normal; }
}

/* 管理画面で指定した職種ボタンの改行はPCだけに適用 */
#job-subnav .jsn-pc-break { display: none; }
#job-subnav .jsn-label { min-width: 0; }
@media (min-width: 1200px) {
  #job-subnav .jsn-pc-break { display: inline; }
}
@media (max-width: 767px) {
  #job-subnav wbr { display: none; }
  #job-subnav .jsn-entry a { word-break: normal; }
}

/* Recruitment CMS copy: regular breaks on PC, explicit sp-only breaks on SP. */
@media (min-width:768px) {
  body br.sp-only { display:none !important; }
}
@media (max-width:767px) {
  body :is(.fv-lead-text,.about-heading,.about-text,.iv-catch,.iv-text,.message-lead,.message-text,.wf-title,.wf-body,.flow-title,.flow-desc) { white-space:normal; }
  body :is(.fv-lead-text,.about-heading,.about-text,.iv-catch,.iv-text,.message-lead,.message-text,.wf-title,.wf-body,.flow-title,.flow-desc) br:not(.sp-only) { display:none !important; }
  body br.sp-only { display:inline !important; }
}

/* PC: raise only the step 04 description by half its line height. */
@media (min-width: 768px) {
  .flow-step--4 .flow-desc { transform: translateY(-0.5lh); }
}