@charset "UTF-8";
/* ==========================================================================
   DYM NEXT リニューアル（test）
   ブレークポイント
     PC        : 1064px 以上
     タブレット : 768px 〜 1063px（PCレイアウトを幅に合わせて縮小）
     SP        : 767px 以下（390px デザイン基準）
   PC の寸法は 1920px カンプの px 値を calc(値 * var(--u)) で指定する。
   --u は 1440px 以上で 1px、それ未満は画面幅に比例して縮む。
   ========================================================================== */

:root {
  --navy: #1f2b5b;
  --navy-deep: #051544;
  --navy-icon: #2a3860;
  --red: #951a1f;
  --text: #1c1d21;
  --gray: #f4f4f6;
  --line: #e8e9ef;
  --footer-bg: #f4f4f0;
  --white: #fff;
  --heading: #161f3f;
  --blue: #0167b1;
  --red-text: #a53d42;
  --u: min(1px, calc(100vw / 1440));
  --header-h: calc(74 * var(--u));
  --gutter: calc(40 * var(--u));
  --ff-jp: "Noto Sans JP", sans-serif;
  --ff-en: "Montserrat", "Noto Sans JP", sans-serif;
  --ff-btn: "Jost", "Noto Sans JP", sans-serif;
  --ff-num: "Roboto", "Noto Sans JP", sans-serif;
  --ff-nav: "Inter", "Noto Sans JP", sans-serif;
  --ff-fv: "Raleway", "Noto Sans JP", sans-serif;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--ff-jp);
  font-weight: 500;
  color: var(--text);
  background: var(--white);
  line-height: 1.8;
  overflow-x: clip;
}
/* 固定ヘッダーの高さ分の余白。WordPress が出力する global-styles（body { padding: 0 }）に上書きされないよう html body で指定する */
html body { padding-top: var(--header-h); }
h1, h2, h3, h4, p, ul, ol, dl, dd, address, figure { margin: 0; padding: 0; }
ul, ol { list-style: none; }
address { font-style: normal; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }

/* BudouX：文節の区切り（<wbr>）以外では改行しない */
[data-budoux] { word-break: keep-all; overflow-wrap: anywhere; }

/* 画面幅ごとの改行 */
.br-pc, .br-tb, .br-sp { display: none; }
@media (min-width: 1064px) { .br-pc { display: inline; } }
@media (min-width: 768px) and (max-width: 1063px) { .br-tb { display: inline; } }
@media (max-width: 767px) { .br-sp { display: inline; } }

.is-sp { display: none !important; }
@media (max-width: 767px) {
  .is-pc { display: none !important; }
  .is-sp { display: revert !important; }
}

.l-container {
  width: min(calc(1200 * var(--u)), 100% - var(--gutter) * 2);
  margin-inline: auto;
}

/* --------------------------------------------------------------------------
   Components
   -------------------------------------------------------------------------- */
/* 見出し（英字＋日本語） */
.c-heading { padding-left: calc(50 * var(--u)); }
.c-heading__en {
  font-family: var(--ff-en);
  font-weight: 600;
  font-size: calc(80 * var(--u));
  line-height: 1.2;
  letter-spacing: calc(0.8 * var(--u));
  color: var(--text);
}
.c-heading__jp {
  margin-top: calc(16 * var(--u));
  font-size: max(calc(24 * var(--u)), 14px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--navy);
}

/* 矢印アイコン（ボタン右端の丸） */
.c-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  font-family: var(--ff-btn);
  font-weight: 600;
  letter-spacing: calc(0.8 * var(--u));
  transition: opacity .3s;
}
.c-btn::after {
  content: "";
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  border-radius: 50%;
  background: var(--text) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 55% no-repeat;
  transition: translate .3s;
}
.c-btn:hover::after { translate: 4px -50%; }

/* 灰色ボタン（Service カード） */
.c-btn--gray {
  width: calc(200 * var(--u));
  height: calc(48 * var(--u));
  padding-left: calc(20 * var(--u));
  border-radius: 999px;
  background: var(--gray);
  font-size: max(calc(16 * var(--u)), 12px);
  letter-spacing: calc(0.64 * var(--u));
  color: var(--navy);
}
.c-btn--gray::after { right: calc(4 * var(--u)); width: calc(40 * var(--u)); height: calc(40 * var(--u)); }

/* 枠線ボタン（VIEW ALL） */
.c-btn--outline {
  width: calc(252 * var(--u));
  height: calc(62 * var(--u));
  padding-left: calc(37 * var(--u));
  border: 1px solid #222;
  border-radius: 999px;
  background: var(--white);
  font-size: max(calc(20 * var(--u)), 13px);
  color: #222;
}
.c-btn--outline::after { right: calc(6 * var(--u)); width: calc(50 * var(--u)); height: calc(50 * var(--u)); }

/* 透過ボタン（Recruit） */
.c-btn--ghost {
  width: calc(252 * var(--u));
  height: calc(62 * var(--u));
  padding-left: calc(26 * var(--u));
  border: 1px solid var(--white);
  border-radius: 999px;
  font-size: max(calc(20 * var(--u)), 13px);
  color: var(--white);
}
.c-btn--ghost::after { right: calc(6 * var(--u)); width: calc(51 * var(--u)); height: calc(51 * var(--u)); background-color: rgba(177, 177, 177, .3); }
.c-btn--ghost:hover { background: rgba(255, 255, 255, .12); }

/* 丸アイコン */
.c-icon-circle {
  display: inline-grid;
  place-items: center;
  flex-shrink: 0;
  width: calc(66 * var(--u));
  height: calc(66 * var(--u));
  border-radius: 50%;
  background: rgba(255, 255, 255, .2);
}
.c-icon-circle svg { width: 45%; height: 45%; fill: none; stroke: var(--white); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.c-icon-circle--l { width: calc(88 * var(--u)); height: calc(88 * var(--u)); }
.c-icon-circle--navy { width: calc(46 * var(--u)); height: calc(46 * var(--u)); background: var(--navy-icon); }

/* スライダー矢印 */
.c-arrow {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: calc(50 * var(--u));
  height: calc(50 * var(--u));
  min-width: 32px;
  min-height: 32px;
  border-radius: 50%;
  background: var(--navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 50% no-repeat;
  translate: 0 -50%;
  transition: opacity .3s;
}
.c-arrow--prev { left: max(var(--gutter), calc(50% - 790 * var(--u))); rotate: 180deg; }
.c-arrow--next { right: max(var(--gutter), calc(50% - 790 * var(--u))); }
.c-arrow:hover { opacity: .8; }

/* メンバーカード */
.c-member-card { display: flex; flex-direction: column; align-items: center; }
.c-member-card__img {
  width: calc(336 * var(--u));
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: hidden;
}
.c-member-card__img img { width: 100%; height: 100%; object-fit: cover; transition: scale .5s; }
.c-member-card:hover .c-member-card__img img { scale: 1.05; }
.c-member-card__year {
  display: grid;
  place-items: center;
  width: calc(195 * var(--u));
  height: calc(45 * var(--u));
  margin-top: calc(40 * var(--u));
  border-radius: 999px;
  background: var(--navy);
  font-size: max(calc(20 * var(--u)), 12px);
  font-weight: 700;
  color: var(--white);
  line-height: 1;
}
.c-member-card__name {
  display: flex;
  gap: calc(36 * var(--u));
  margin-top: calc(26 * var(--u));
  font-size: max(calc(20 * var(--u)), 12px);
  font-weight: 700;
  line-height: 1.4;
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
.l-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  height: var(--header-h);
  background: var(--navy);
}
.l-header__inner { display: flex; align-items: center; height: 100%; }
.l-header__logo { width: calc(87 * var(--u)); margin-left: calc(62 * var(--u)); }
.l-header__logo img { width: 100%; }
.l-gnav { display: flex; align-items: center; margin-left: auto; margin-right: calc(43 * var(--u)); }
.l-gnav__list { display: flex; }
.l-gnav__item { position: relative; }
.l-gnav__link {
  display: block;
  padding: calc(25 * var(--u)) calc(21 * var(--u));
  font-family: var(--ff-nav);
  font-weight: 700;
  font-size: calc(16 * var(--u));
  line-height: 1.5;
  color: var(--white);
  cursor: pointer;
  transition: opacity .3s;
}
.l-gnav__link:hover { opacity: .7; }
.l-gnav__jp { display: none; }
.l-gnav__sub {
  position: absolute;
  top: 100%;
  left: 50%;
  translate: -50% 0;
  width: max-content;
  min-width: calc(216 * var(--u));
  padding: calc(8 * var(--u)) calc(16 * var(--u));
  background: var(--navy);
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s, visibility .3s;
}
.l-gnav__item.has-sub:hover .l-gnav__sub,
.l-gnav__item.has-sub:focus-within .l-gnav__sub { opacity: 1; visibility: visible; }
.l-gnav__sub li + li { border-top: 1px solid rgba(255, 255, 255, .8); }
.l-gnav__sub a {
  display: block;
  padding: calc(20 * var(--u)) calc(4 * var(--u));
  font-size: calc(16 * var(--u));
  font-weight: 700;
  color: var(--white);
  text-align: center;
  transition: opacity .3s;
}
.l-gnav__sub a:hover { opacity: .7; }
.l-gnav__contact {
  display: grid;
  place-items: center;
  width: calc(200 * var(--u));
  height: calc(48 * var(--u));
  margin-left: calc(62 * var(--u));
  border-radius: 999px;
  background: var(--white);
  font-family: var(--ff-btn);
  font-weight: 600;
  font-size: calc(16 * var(--u));
  letter-spacing: calc(0.64 * var(--u));
  color: var(--navy);
  transition: opacity .3s;
}
.l-gnav__contact:hover { opacity: .85; }
.l-header__toggle { display: none; }

/* --------------------------------------------------------------------------
   Contact band（下層ページ共通）
   -------------------------------------------------------------------------- */
.l-contact-band { display: flex; color: var(--white); }
.l-contact-band__info {
  display: flex;
  align-items: center;
  justify-content: center;
  /* 帯は画面の左右半分ずつなので、余白は画面幅に比例させる。
     中身は中央寄せにし、左に 14px（1920px のとき）足して、カンプの位置（右端から 179px）に合わせる */
  gap: calc(100vw * 67 / 1920);
  width: 50%;
  min-height: calc(291 * var(--u));
  padding-left: calc(100vw * 14 / 1920);
  background: var(--navy-deep);
}
.l-contact-band__en { font-family: var(--ff-en); font-weight: 600; font-size: calc(66 * var(--u)); line-height: 1.2; }
.l-contact-band__jp { margin-top: calc(14 * var(--u)); font-size: calc(22 * var(--u)); font-weight: 700; }
.l-contact-band__tel { display: grid; gap: calc(17 * var(--u)); }
.l-contact-band__tel > div { display: grid; grid-template-columns: auto 1fr; column-gap: calc(17 * var(--u)); align-items: center; }
.l-contact-band__tel dt { display: contents; font-size: calc(16 * var(--u)); font-weight: 700; }
.l-contact-band__tel dt .c-icon-circle { grid-row: span 2; }
.l-contact-band__tel dd { grid-column: 2; white-space: nowrap; font-family: var(--ff-num); font-size: calc(24 * var(--u)); font-weight: 700; line-height: 1.2; }
.l-contact-band__mail {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(20 * var(--u));
  width: 50%;
  background: var(--red);
  font-size: calc(44 * var(--u));
  font-weight: 700;
  transition: background .3s;
}
.l-contact-band__mail:hover { background: #a82329; }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.l-footer { background: var(--footer-bg); color: var(--text); }
.l-footer__inner {
  position: relative;
  width: min(calc(1218 * var(--u)), 100% - var(--gutter) * 2);
  margin-inline: auto;
  padding: calc(14 * var(--u)) 0 calc(18 * var(--u));
}
.l-footer__logo { display: block; width: calc(111 * var(--u)); }
.l-footer__offices { display: grid; gap: calc(22 * var(--u)); margin-top: calc(8 * var(--u)); padding-left: calc(10 * var(--u)); }
.l-footer__offices address { font-size: max(calc(14 * var(--u)), 11px); line-height: 1.5; }
.l-footer__office { display: block; font-weight: 700; margin-bottom: calc(8 * var(--u)); }
.l-footer__nav { position: absolute; top: calc(39 * var(--u)); left: calc(610 * var(--u)); }
.l-footer__nav > ul { display: grid; grid-template-columns: calc(315 * var(--u)) auto; grid-auto-flow: column; grid-template-rows: auto auto auto auto; row-gap: calc(29 * var(--u)); }
/* 採用情報から後ろ（採用情報・お問い合わせ・個人情報保護方針・カスタマーハラスメント）は右の列に縦に並べる */
.l-footer__nav > ul > li:nth-child(n+4) { grid-column: 2; }
.l-footer__nav > ul > li { font-size: max(calc(16 * var(--u)), 12px); font-weight: 700; line-height: 1.4; white-space: nowrap; }
.l-footer__nav > ul > li.l-footer__group { grid-row: span 2; }
.l-footer__sub { margin-top: calc(14 * var(--u)); display: grid; gap: calc(6 * var(--u)); }
.l-footer__sub li { font-size: max(calc(12 * var(--u)), 10px); font-weight: 500; }
.l-footer__nav a { transition: opacity .3s; }
.l-footer__nav a:hover { opacity: .6; }

/* --------------------------------------------------------------------------
   TOP：FV
   -------------------------------------------------------------------------- */
.p-top-fv {
  position: relative;
  height: calc(100vw * 862 / 1920);
  overflow: hidden;
  background: #333;
}
.p-top-fv__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.5s ease;
}
.p-top-fv__slide.is-active { opacity: 1; z-index: 1; }
.p-top-fv__slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, .55) 100%), rgba(98, 96, 96, .12);
}
.p-top-fv__img, .p-top-fv__img img { display: block; width: 100%; height: 100%; }
.p-top-fv__img img { object-fit: cover; scale: 1.1; }
.p-top-fv__slide.is-active .p-top-fv__img img,
.p-top-fv__slide.is-leaving .p-top-fv__img img { scale: 1; transition: scale 7.5s linear; }
.p-top-fv__copy {
  position: absolute;
  left: calc(72 * var(--u));
  bottom: calc(52 * var(--u));
  z-index: 2;
  color: var(--white);
}
.p-top-fv__en { font-family: var(--ff-fv); font-weight: 500; font-size: calc(32 * var(--u)); line-height: 1.3; letter-spacing: calc(0.32 * var(--u)); }
.p-top-fv__jp { margin-top: calc(18 * var(--u)); font-size: calc(68 * var(--u)); font-weight: 700; line-height: 1.4; letter-spacing: calc(1.36 * var(--u)); }
.p-top-fv__en, .p-top-fv__jp { opacity: 0; translate: 0 20px; }
.p-top-fv__slide.is-active .p-top-fv__en,
.p-top-fv__slide.is-active .p-top-fv__jp { opacity: 1; translate: 0 0; transition: opacity 1s ease .6s, translate 1s ease .6s; }
.p-top-fv__slide.is-active .p-top-fv__jp { transition-delay: .8s; }
@media (prefers-reduced-motion: reduce) {
  .p-top-fv__slide, .p-top-fv__img img, .p-top-fv__en, .p-top-fv__jp { transition: none !important; }
  .p-top-fv__img img { scale: 1; }
}

/* --------------------------------------------------------------------------
   TOP：About
   -------------------------------------------------------------------------- */
.p-top-about { background: var(--gray); padding: calc(94 * var(--u)) 0 calc(93 * var(--u)); }
.p-top-about__inner { display: flex; align-items: center; }
.p-top-about .c-heading { flex: 0 0 calc(487 * var(--u)); }
.p-top-about__text {
  max-width: calc(708 * var(--u));
  padding: calc(4 * var(--u)) 0 calc(4 * var(--u)) calc(64 * var(--u));
  border-left: calc(4 * var(--u)) solid var(--line);
  font-size: max(calc(19 * var(--u)), 13px);
  font-weight: 700;
  line-height: 2;
  letter-spacing: calc(0.38 * var(--u));
}

/* --------------------------------------------------------------------------
   TOP：Mission
   -------------------------------------------------------------------------- */
.p-top-mission { display: flex; min-height: calc(777 * var(--u)); }
.p-top-mission__img { width: 50%; }
.p-top-mission__img img { width: 100%; height: 100%; object-fit: cover; }
.p-top-mission__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 50%;
  padding: calc(120 * var(--u)) calc(60 * var(--u)) calc(120 * var(--u)) calc(140 * var(--u));
}
.p-top-mission__en { font-family: var(--ff-en); font-weight: 600; font-size: calc(32 * var(--u)); line-height: 1.2; color: var(--text); }
.p-top-mission__copy {
  max-width: calc(720 * var(--u));
  margin-top: calc(26 * var(--u));
  font-size: calc(55 * var(--u));
  font-weight: 700;
  line-height: 1.4;
  color: var(--navy);
}
.p-top-mission__text {
  max-width: calc(675 * var(--u));
  margin-top: calc(84 * var(--u));
  font-size: max(calc(16 * var(--u)), 12px);
  font-weight: 700;
  line-height: 2;
  letter-spacing: calc(0.8 * var(--u));
}

/* --------------------------------------------------------------------------
   TOP：写真の帯（流れ続ける）
   -------------------------------------------------------------------------- */
.p-top-strip { overflow: hidden; }
.p-top-strip__track { display: flex; width: max-content; animation: strip-flow 45s linear infinite; }
.p-top-strip__track li { position: relative; width: calc(640 * var(--u)); height: calc(480 * var(--u)); }
.p-top-strip__track li::after { content: ""; position: absolute; inset: 0; background: rgba(244, 244, 246, .39); }
.p-top-strip__track img { width: 100%; height: 100%; object-fit: cover; }
@keyframes strip-flow { to { translate: -50% 0; } }
@media (prefers-reduced-motion: reduce) { .p-top-strip__track { animation: none; } }

/* --------------------------------------------------------------------------
   TOP：Service
   -------------------------------------------------------------------------- */
.p-top-service { background: var(--gray); padding: calc(146 * var(--u)) 0 calc(228 * var(--u)); }
.p-top-service__head { display: flex; align-items: center; }
.p-top-service .c-heading { flex: 0 0 calc(423 * var(--u)); padding-left: calc(56 * var(--u)); }
.p-top-service__lead {
  max-width: calc(778 * var(--u));
  padding: calc(4 * var(--u)) 0 calc(4 * var(--u)) calc(55 * var(--u));
  border-left: calc(4 * var(--u)) solid var(--line);
  font-size: max(calc(19 * var(--u)), 13px);
  font-weight: 700;
  line-height: 2;
  letter-spacing: calc(0.38 * var(--u));
}
.p-top-service__list { display: grid; gap: calc(91 * var(--u)); width: calc(925 * var(--u)); margin: calc(94 * var(--u)) auto 0; }
.p-top-service__card { display: flex; min-height: calc(368 * var(--u)); }
.p-top-service__body {
  position: relative;
  flex: 0 0 calc(383 * var(--u));
  padding: calc(50 * var(--u)) calc(40 * var(--u)) calc(37 * var(--u)) calc(47 * var(--u));
  background: var(--white);
  display: flex;
  flex-direction: column;
}
.p-top-service__num {
  position: absolute;
  top: calc(-34 * var(--u));
  left: calc(37 * var(--u));
  font-family: var(--ff-num);
  font-weight: 700;
  font-size: calc(64 * var(--u));
  line-height: 1;
  color: var(--navy);
}
.p-top-service__title { font-size: max(calc(24 * var(--u)), 14px); font-weight: 700; line-height: 1.5; }
.p-top-service__text {
  margin-top: calc(10 * var(--u));
  font-size: max(calc(18 * var(--u)), 12px);
  line-height: 1.65;
  letter-spacing: calc(1.26 * var(--u));
}
.p-top-service__body .c-btn { margin: auto 0 0 calc(44 * var(--u)); }
.p-top-service__img { position: relative; flex: 1; overflow: hidden; }
.p-top-service__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }

/* --------------------------------------------------------------------------
   TOP：Members
   -------------------------------------------------------------------------- */
/* 見出しは Service との境目にまたがる。flow-root で負のマージンがセクションの外へ相殺されないようにする */
.p-top-members { position: relative; display: flow-root; padding-bottom: calc(46 * var(--u)); background: var(--white); }
.p-top-members__heading { margin-top: calc(-57 * var(--u)); padding-left: calc(43 * var(--u)); }
.p-top-members__slider { position: relative; margin-top: calc(62 * var(--u)); }
.p-top-members__viewport { width: calc(1158 * var(--u)); margin-inline: auto; overflow: hidden; }
.p-top-members__track { display: flex; gap: calc(75 * var(--u)); transition: translate .6s ease; }
.p-top-members__item { flex: 0 0 calc(336 * var(--u)); }
.p-top-members__more { display: flex; margin: calc(74 * var(--u)) auto 0; }

/* --------------------------------------------------------------------------
   TOP：Recruit
   -------------------------------------------------------------------------- */
.p-top-recruit { background: var(--gray); padding: calc(160 * var(--u)) 0 calc(156 * var(--u)); }
.p-top-recruit__card {
  position: relative;
  min-height: calc(536 * var(--u));
  border-radius: calc(20 * var(--u));
  overflow: hidden;
  color: var(--white);
}
.p-top-recruit__card::after { content: ""; position: absolute; inset: 0; background: rgba(21, 31, 63, .2); }
.p-top-recruit__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.p-top-recruit__body { position: relative; z-index: 1; padding: calc(22 * var(--u)) calc(50 * var(--u)) calc(74 * var(--u)); }
.p-top-recruit__en { font-family: var(--ff-en); font-weight: 600; font-size: calc(91.4 * var(--u)); line-height: 1.2; }
.p-top-recruit__jp { margin-top: calc(8 * var(--u)); font-size: max(calc(22.9 * var(--u)), 13px); font-weight: 700; }
.p-top-recruit__text { margin-top: calc(32 * var(--u)); font-size: max(calc(22.9 * var(--u)), 13px); font-weight: 700; line-height: 2; }
.p-top-recruit__btns { display: flex; gap: calc(47 * var(--u)); margin-top: calc(100 * var(--u)); }

/* --------------------------------------------------------------------------
   TOP：Contact
   -------------------------------------------------------------------------- */
.p-top-contact { background: var(--navy); color: var(--white); padding: calc(103 * var(--u)) 0; }
.p-top-contact__inner { display: flex; align-items: center; }
.p-top-contact__en { flex: 0 0 calc(659 * var(--u)); padding-left: calc(5 * var(--u)); font-family: var(--ff-en); font-weight: 600; font-size: calc(91.4 * var(--u)); line-height: 1.2; }
.p-top-contact__btns { display: grid; gap: calc(48 * var(--u)); }
.p-top-contact__btn {
  display: flex;
  align-items: center;
  width: calc(360 * var(--u));
  height: calc(96 * var(--u));
  padding: 0 calc(25 * var(--u)) 0 calc(40 * var(--u));
  border-radius: 999px;
  background: var(--white);
  color: var(--navy);
  transition: opacity .3s;
}
.p-top-contact__btn:hover { opacity: .9; }
.p-top-contact__label { flex: 1; display: flex; flex-direction: column; align-items: center; font-size: calc(22.9 * var(--u)); font-weight: 700; line-height: 1.3; }
.p-top-contact__tel { font-family: var(--ff-num); font-size: calc(27.4 * var(--u)); letter-spacing: calc(0.55 * var(--u)); }
.p-top-contact__hours { margin-top: calc(4 * var(--u)); font-size: max(calc(13.4 * var(--u)), 10px); }

/* ==========================================================================
   タブレット以下（1063px 以下）：ハンバーガーメニュー
   ========================================================================== */
@media (max-width: 1063px) {
  :root { --header-h: 64px; }
  .l-header__logo { width: 64px; margin-left: 8px; }
  .l-header__toggle {
    position: relative;
    display: block;
    width: 64px;
    height: 64px;
    margin-left: auto;
  }
  .l-header__toggle span {
    position: absolute;
    left: 20px;
    width: 24px;
    height: 2px;
    border-radius: 2px;
    background: var(--white);
    transition: translate .3s, rotate .3s, opacity .3s;
  }
  .l-header__toggle span:nth-child(1) { top: 25px; }
  .l-header__toggle span:nth-child(2) { top: 31px; }
  .l-header__toggle span:nth-child(3) { top: 37px; }
  .is-menu-open .l-header__toggle span:nth-child(1) { translate: 0 6px; rotate: 45deg; }
  .is-menu-open .l-header__toggle span:nth-child(2) { opacity: 0; }
  .is-menu-open .l-header__toggle span:nth-child(3) { translate: 0 -6px; rotate: -45deg; }

  .l-gnav {
    position: fixed;
    inset: 64px 0 0;
    flex-direction: column;
    align-items: stretch;
    margin: 0;
    padding: 24px 32px 48px;
    background: var(--navy);
    overflow-y: auto;
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s, visibility .3s;
  }
  .is-menu-open .l-gnav { opacity: 1; visibility: visible; }
  .is-menu-open { overflow: hidden; }
  .l-gnav__list { flex-direction: column; }
  .l-gnav__item { border-bottom: 1px solid rgba(255, 255, 255, .25); }
  .l-gnav__link { display: flex; align-items: baseline; gap: 16px; padding: 20px 4px; font-size: 18px; cursor: default; }
  a.l-gnav__link { cursor: pointer; }
  .l-gnav__jp { display: inline; font-family: var(--ff-jp); font-size: 12px; font-weight: 500; opacity: .8; }
  .l-gnav__sub {
    position: static;
    translate: none;
    width: auto;
    min-width: 0;
    padding: 0 0 12px 16px;
    opacity: 1;
    visibility: visible;
  }
  .l-gnav__sub li + li { border-top: 0; }
  .l-gnav__sub a { padding: 8px 4px; font-size: 14px; font-weight: 500; text-align: left; }
  .l-gnav__sub a::before { content: "- "; }
  .l-gnav__contact { width: 100%; max-width: 320px; height: 56px; margin: 32px auto 0; font-size: 16px; letter-spacing: 0.64px; }
}

/* ==========================================================================
   SP（767px 以下）：390px デザイン基準
   ========================================================================== */
@media (max-width: 767px) {
  :root { --gutter: 20px; }

  .l-container { width: calc(100% - 40px); }

  .c-heading { padding-left: 0; }
  .c-heading__en { font-size: 56px; letter-spacing: 0.56px; }
  .c-heading__jp { margin-top: 8px; font-size: 20px; }

  .c-btn::after { right: 8px; }
  .c-btn--gray { width: 100%; max-width: 270px; height: 48px; padding-left: 34px; font-size: 14px; letter-spacing: 0.56px; }
  .c-btn--gray::after { right: 8px; width: 34px; height: 34px; }
  .c-btn--outline { width: 270px; height: 48px; padding-left: 41px; font-size: 14px; letter-spacing: 0.56px; }
  .c-btn--outline::after { right: 9px; width: 34px; height: 34px; background-color: var(--text); }
  .c-btn--ghost { width: 100%; max-width: 270px; height: 65px; padding-left: 27px; font-size: 21.5px; letter-spacing: 0.86px; }
  .c-btn--ghost::after { right: 7px; width: 52px; height: 52px; }

  .c-icon-circle { width: 44px; height: 44px; }
  .c-icon-circle--l { width: 56px; height: 56px; }
  .c-icon-circle--navy { width: 34px; height: 34px; }

  .c-arrow { width: 33px; height: 33px; }
  .c-arrow--prev { left: 4px; }
  .c-arrow--next { right: 4px; }

  .c-member-card__img { width: min(281px, 72vw); }
  .c-member-card__year { width: 162px; height: 37px; margin-top: 32px; font-size: 16.7px; }
  .c-member-card__name { gap: 30px; margin-top: 22px; font-size: 16.7px; }

  /* Contact band */
  .l-contact-band { flex-direction: column; }
  .l-contact-band__info { width: auto; flex-direction: column; align-items: flex-start; justify-content: center; gap: 24px; min-height: 0; padding: 40px 20px; }
  .l-contact-band__en { font-size: 40px; }
  .l-contact-band__jp { margin-top: 6px; font-size: 16px; }
  .l-contact-band__tel { gap: 12px; }
  .l-contact-band__tel > div { column-gap: 12px; }
  .l-contact-band__tel dt { font-size: 13px; }
  .l-contact-band__tel dd { font-size: 20px; }
  .l-contact-band__mail { width: auto; gap: 14px; padding: 32px 20px; font-size: 22px; }

  /* Footer */
  .l-footer__inner { width: 100%; padding: 0 0 51px; }
  .l-footer__nav { position: static; padding: 30px 0 32px; border-bottom: 2px solid rgba(33, 33, 33, .2); }
  .l-footer__nav > ul { display: block; width: 221px; margin-inline: auto; }
  .l-footer__nav > ul > li { font-size: 14px; }
  .l-footer__nav > ul > li + li { margin-top: 15px; }
  .l-footer__nav > ul > li > a,
  .l-footer__group > span { display: flex; justify-content: space-between; align-items: center; }
  .l-footer__nav > ul > li > a::after {
    content: "";
    width: 15px;
    height: 6px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 6' fill='none' stroke='%23212121' stroke-width='1'%3E%3Cpath d='M0 5.5h14L9 .5'/%3E%3C/svg%3E") center / contain no-repeat;
  }
  .l-footer__sub { margin-top: 6px; gap: 2px; padding-left: 10px; }
  .l-footer__sub li { font-size: 12px; }
  .l-footer__sub a::before { content: "- "; }
  .l-footer__company { text-align: center; }
  .l-footer__logo { width: 89px; margin: 10px auto 0; }
  .l-footer__offices { gap: 20px; margin-top: 4px; padding-left: 0; }
  .l-footer__offices address { font-size: 12px; line-height: 1.65; }
  .l-footer__office { margin-bottom: 3px; }

  /* FV */
  /* FV の高さは PC と同じ比率（1920×862）に 66px 足す（About の上の余白を詰めた分、写真を下に伸ばす） */
  .p-top-fv { height: calc(100vw * 862 / 1920 + 66px); }
  /* 縦に伸ばすと左右が切れるので、人物が入るように写真ごとに切り抜く位置を変える */
  .p-top-fv__slide:nth-child(1) .p-top-fv__img img { object-position: 75% 50%; }
  .p-top-fv__slide:nth-child(2) .p-top-fv__img img { object-position: 55% 50%; }
  .p-top-fv__copy { left: 16px; right: 16px; bottom: 14px; }
  .p-top-fv__en { font-size: 10px; letter-spacing: 0.1px; }
  .p-top-fv__jp { margin-top: 4px; font-size: 18px; letter-spacing: 0.36px; }
  /* SP用の縦長画像に切り替える場合は、上の3行の代わりに下を有効にする（page-top-new.php の source もあわせて有効にする）
  .p-top-fv { height: calc(100svh - var(--header-h)); min-height: 480px; }
  .p-top-fv__copy { left: 20px; right: 20px; bottom: 48px; }
  .p-top-fv__en { font-size: 13px; letter-spacing: 0.13px; }
  .p-top-fv__jp { margin-top: 10px; font-size: 26px; letter-spacing: 0.52px; }
  */

  /* About */
  .p-top-about { padding: 32px 0 93px; }
  .p-top-about__inner { display: block; }
  .p-top-about__text { max-width: none; margin-top: 24px; padding: 45px 0 0; border-left: 0; border-top: 4px solid var(--line); font-size: 16px; line-height: 1.98; letter-spacing: 0.32px; }

  /* Mission */
  .p-top-mission { display: block; min-height: 0; }
  .p-top-mission__img { width: 100%; aspect-ratio: 390 / 293; }
  .p-top-mission__body { width: auto; padding: 65px 20px 74px; }
  .p-top-mission__en { font-size: 16px; }
  .p-top-mission__copy { max-width: none; margin-top: 20px; font-size: 32px; line-height: 1.5; }
  .p-top-mission__text { max-width: none; margin-top: 56px; font-size: 14px; line-height: 2; letter-spacing: 0.7px; }

  /* Strip */
  .p-top-strip__track li { width: 267px; height: 200px; }

  /* Service */
  .p-top-service { padding: 110px 0 100px; }
  .p-top-service__head { display: block; }
  .p-top-service .c-heading { padding-left: 0; }
  .p-top-service__lead { max-width: none; margin-top: 50px; padding: 45px 0 0; border-left: 0; border-top: 4px solid var(--line); font-size: 16px; line-height: 2; letter-spacing: 0.32px; }
  .p-top-service__list { width: auto; gap: 44px; margin-top: 112px; }
  .p-top-service__card { flex-direction: column; min-height: 0; }
  .p-top-service__body { flex: none; padding: 41px 28px 12px; }
  .p-top-service__num { top: -17px; left: 33px; font-size: 36px; }
  .p-top-service__title { font-size: 20px; }
  .p-top-service__text { margin-top: 12px; font-size: 16px; line-height: 1.7; letter-spacing: 0.8px; }
  .p-top-service__body .c-btn { margin: 40px auto 0; }
  .p-top-service__img { aspect-ratio: 350 / 224; }

  /* Members */
  .p-top-members { padding-bottom: 51px; }
  .p-top-members__heading { margin-top: -27px; padding-left: 3px; }
  .p-top-members__slider { margin-top: 48px; }
  .p-top-members__viewport { width: min(281px, 72vw); }
  .p-top-members__track { gap: 40px; }
  .p-top-members__item { flex-basis: min(281px, 72vw); }
  .p-top-members__more { margin-top: 64px; }

  /* Recruit */
  .p-top-recruit { padding: 70px 0 79px; }
  .p-top-recruit__card { min-height: 450px; border-radius: 10px; }
  .p-top-recruit__body { padding: 26px 22px 30px; }
  .p-top-recruit__en { font-size: 48px; }
  .p-top-recruit__jp { margin-top: 4px; font-size: 20px; }
  .p-top-recruit__text { margin-top: 12px; font-size: 14px; line-height: 1.75; }
  .p-top-recruit__btns { flex-direction: column; align-items: center; gap: 30px; margin-top: 70px; }

  /* Contact */
  .p-top-contact { padding: 30px 0 50px; }
  .p-top-contact__inner { display: block; }
  .p-top-contact__en { padding-left: 0; font-size: 32px; }
  .p-top-contact__btns { gap: 20px; margin-top: 30px; justify-items: center; }
  .p-top-contact__btn { width: 269px; height: 72px; padding: 0 19px 0 24px; }
  .p-top-contact__label { font-size: 17.1px; }
  .p-top-contact__tel { font-size: 20.5px; letter-spacing: 0.41px; }
  .p-top-contact__hours { margin-top: 2px; font-size: 10px; }
}

/* ==========================================================================
   下層ページ共通
   ========================================================================== */
/* ページ上部（写真＋ページ名＋パンくず） */
.c-page-hero { position: relative; height: calc(494 * var(--u)); overflow: hidden; }
.c-page-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.c-page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(255, 255, 255, .86);
  clip-path: polygon(0 0, 63.4% 0, 56.5% 100%, 0 100%);
}
.c-page-hero__inner { position: relative; z-index: 2; height: 100%; padding-top: calc(138 * var(--u)); }
.c-page-hero__en { font-family: var(--ff-fv); font-weight: 600; font-size: max(calc(20 * var(--u)), 11px); line-height: 1.5; color: var(--heading); }
.c-page-hero__title { margin-top: calc(4 * var(--u)); font-size: calc(40 * var(--u)); font-weight: 700; line-height: 1.4; color: var(--heading); }
.c-breadcrumb { position: absolute; bottom: calc(10 * var(--u)); display: flex; font-size: max(calc(13 * var(--u)), 10px); line-height: 1.5; color: #222; }
.c-breadcrumb li + li::before { content: "＞"; margin: 0 calc(4 * var(--u)); }
.c-breadcrumb a { transition: opacity .3s; }
.c-breadcrumb a:hover { opacity: .6; }

/* セクション見出し（中央寄せ：英字＋日本語） */
.c-sec-title { text-align: center; color: var(--heading); }
.c-sec-title__en { font-family: var(--ff-fv); font-weight: 600; font-size: max(calc(20 * var(--u)), 12px); line-height: 1.5; }
.c-sec-title__jp { margin-top: calc(8 * var(--u)); font-size: calc(32 * var(--u)); font-weight: 700; line-height: 1.5; }

/* よくある質問（details 要素で開閉） */
.c-faq__item { border-top: 2px solid var(--line); }
.c-faq__item:last-child { border-bottom: 2px solid var(--line); }
.c-faq__q {
  display: flex;
  align-items: center;
  gap: calc(48 * var(--u));
  padding: calc(31 * var(--u)) 0;
  list-style: none;
  cursor: pointer;
}
.c-faq__q::-webkit-details-marker { display: none; }
.c-faq__mark {
  flex: 0 0 calc(60 * var(--u));
  font-family: var(--ff-en);
  font-weight: 600;
  font-size: calc(64 * var(--u));
  line-height: .83;
  color: var(--navy);
}
.c-faq__mark--a { color: var(--red-text); }
.c-faq__q-text { flex: 1; font-size: max(calc(20 * var(--u)), 13px); font-weight: 700; line-height: 1.6; color: #000; }
.c-faq__toggle { position: relative; flex: 0 0 calc(28 * var(--u)); height: 2px; margin-right: calc(12 * var(--u)); background: #333; }
.c-faq__toggle::after { content: ""; position: absolute; inset: 0; background: inherit; rotate: 90deg; transition: rotate .3s; }
.c-faq__item[open] .c-faq__toggle::after { rotate: 0deg; }
/* 回答の右端は、質問の文章と同じ位置（開閉マークの手前）で折り返す */
.c-faq__a { display: flex; gap: calc(48 * var(--u)); padding: 0 calc(88 * var(--u)) calc(19 * var(--u)) 0; }
.c-faq__a-text { flex: 1; margin-top: calc(-6 * var(--u)); font-size: max(calc(20 * var(--u)), 13px); line-height: 2; color: #000; }

/* ==========================================================================
   事業紹介（コールセンター事業・カスタマーサクセス事業）
   ========================================================================== */
.p-service__gray { background: var(--gray); }

/* 〇〇事業とは */
.p-service-intro { padding-top: calc(68 * var(--u)); }
.p-service-intro__card {
  display: flex;
  gap: calc(83 * var(--u));
  margin-top: calc(55 * var(--u));
  padding: calc(67 * var(--u)) calc(84 * var(--u)) calc(67 * var(--u)) calc(40 * var(--u));
  background: var(--white);
}
.p-service-intro__img { flex: 0 0 calc(507 * var(--u)); }
/* 写真版（カスタマーサクセス事業）：写真は上下中央、文章は上揃え */
.p-service-intro__card--photo { gap: calc(81 * var(--u)); min-height: calc(567 * var(--u)); padding-right: calc(68 * var(--u)); padding-left: calc(25 * var(--u)); }
.p-service-intro__card--photo .p-service-intro__img { flex-basis: calc(540 * var(--u)); align-self: center; }
.p-service-intro__title { margin-top: calc(-9 * var(--u)); font-size: calc(36 * var(--u)); font-weight: 700; line-height: 1.36; color: var(--heading); }
.p-service-intro__text {
  margin-top: calc(19 * var(--u));
  font-size: max(calc(18 * var(--u)), 13px);
  font-weight: 700;
  line-height: 2.04;
  letter-spacing: calc(1.4 * var(--u));
  text-align: justify;
  color: var(--heading);
}

/* お悩み */
.p-service-concern { padding: calc(101 * var(--u)) 0 calc(100 * var(--u)); }
.p-service-concern__list { display: flex; justify-content: center; gap: calc(52 * var(--u)); margin-top: calc(90 * var(--u)); }
.p-service-concern__item { width: calc(360 * var(--u)); text-align: center; }
.p-service-concern__label { font-size: max(calc(22 * var(--u)), 14px); font-weight: 700; line-height: 1.5; color: var(--navy); }
.p-service-concern__img {
  width: calc(298 * var(--u));
  aspect-ratio: 1;
  margin: calc(44 * var(--u)) auto 0;
  border-radius: 50%;
  overflow: hidden;
  background: var(--white);
  box-shadow: 0 0 calc(20 * var(--u)) rgba(0, 0, 0, .08);
}
.p-service-concern__img img { width: 100%; height: 100%; }
.p-service-concern__text { margin-top: calc(36 * var(--u)); font-size: max(calc(19 * var(--u)), 13px); font-weight: 500; line-height: 1.68; color: #000; }

/* そのお悩みを DYM NEXT が解決します！ */
.p-service-solve { margin-top: calc(92 * var(--u)); text-align: center; color: var(--heading); }
.p-service-solve__arrow { display: block; width: calc(37 * var(--u)); height: calc(66 * var(--u)); margin: 0 auto; fill: var(--blue); }
.p-service-solve__text { margin-top: calc(40 * var(--u)); font-size: calc(44 * var(--u)); font-weight: 700; line-height: 1.4; }
.p-service-solve__small { display: block; font-size: calc(29 * var(--u)); }

/* DYM NEXT の強み */
.p-service-strength { padding: calc(95 * var(--u)) 0 calc(100 * var(--u)); }
.p-service-strength__inner { display: flex; }
.p-service-strength__head { flex: 0 0 calc(426 * var(--u)); color: var(--heading); }
.p-service-strength__en { font-family: var(--ff-fv); font-weight: 600; font-size: max(calc(20 * var(--u)), 12px); line-height: 1.5; }
.p-service-strength__jp { margin-top: calc(10 * var(--u)); font-size: calc(30 * var(--u)); font-weight: 700; line-height: 1.5; }
.p-service-strength__list { flex: 1; }
.p-service-strength__item { display: flex; min-height: calc(296 * var(--u)); }
.p-service-strength__item:last-child { min-height: 0; }
.p-service-strength__icon { position: relative; flex: 0 0 calc(155 * var(--u)); }
.p-service-strength__icon img {
  width: calc(110 * var(--u));
  height: calc(110 * var(--u));
  margin-left: calc(14 * var(--u));
  border-radius: 50%;
  background: var(--white);
  box-shadow: 0 0 calc(16 * var(--u)) rgba(0, 0, 0, .08);
}
.p-service-strength__num {
  position: absolute;
  top: calc(3 * var(--u));
  left: 0;
  z-index: 1;
  font-family: var(--ff-num);
  font-weight: 700;
  font-size: calc(26 * var(--u));
  line-height: 1;
  color: var(--heading);
}
.p-service-strength__body { flex: 1; color: var(--heading); }
.p-service-strength__title { font-size: max(calc(26 * var(--u)), 15px); font-weight: 700; line-height: 1.69; }
.p-service-strength__title small { font-size: max(calc(14 * var(--u)), 10px); font-weight: 700; }
.p-service-strength__text { margin-top: calc(12 * var(--u)); font-size: max(calc(18 * var(--u)), 13px); font-weight: 500; line-height: 2.06; letter-spacing: calc(1.2 * var(--u)); }

/* サポートフロー */
.p-service-flow { padding: calc(96 * var(--u)) 0 calc(87 * var(--u)); background: var(--gray); }
.p-service-flow__list { margin-top: calc(106 * var(--u)); }
.p-service-flow__item { position: relative; display: flex; min-height: calc(122 * var(--u)); padding-left: calc(70 * var(--u)); }
.p-service-flow__item::before {
  content: "";
  position: absolute;
  top: calc(3 * var(--u));
  left: calc(23 * var(--u));
  z-index: 1;
  width: calc(10 * var(--u));
  height: calc(10 * var(--u));
  min-width: 8px;
  min-height: 8px;
  border-radius: 50%;
  background: #168eff;
  box-shadow: 0 0 0 calc(3 * var(--u)) rgba(22, 142, 255, .2);
}
.p-service-flow__item::after {
  content: "";
  position: absolute;
  top: calc(16 * var(--u));
  bottom: 0;
  left: calc(28 * var(--u));
  border-left: 1px dashed #d1d4db;
}
.p-service-flow__item:last-child { min-height: 0; padding-bottom: calc(18 * var(--u)); }
.p-service-flow__head { flex: 0 0 calc(234 * var(--u)); }
.p-service-flow__step {
  display: inline-block;
  padding: calc(5 * var(--u)) calc(14 * var(--u));
  background: var(--white);
  font-family: var(--ff-en);
  font-weight: 600;
  font-size: max(calc(12 * var(--u)), 10px);
  line-height: 1.4;
  letter-spacing: calc(1 * var(--u));
  color: var(--heading);
}
.p-service-flow__title { margin-top: calc(9 * var(--u)); font-size: max(calc(20 * var(--u)), 14px); font-weight: 700; line-height: 1.5; color: #131a3f; }
.p-service-flow__text { flex: 1; font-size: max(calc(16 * var(--u)), 12px); font-weight: 500; line-height: 1.6; color: #333338; }

/* よくある質問 */
.p-service-faq { padding: calc(87 * var(--u)) 0 calc(98 * var(--u)); }
.p-service-faq .c-faq { margin-top: calc(58 * var(--u)); }

/* --------------------------------------------------------------------------
   下層ページ・事業紹介：SP（767px 以下）
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .c-page-hero { height: 212px; }
  .c-page-hero::before { clip-path: polygon(0 0, 66% 0, 50% 100%, 0 100%); }
  .c-page-hero__inner { padding-top: 54px; }
  .c-page-hero__en { font-size: 11px; }
  .c-page-hero__title { margin-top: 2px; font-size: 22px; }
  .c-breadcrumb { bottom: 10px; font-size: 10px; }
  .c-breadcrumb li + li::before { margin: 0 3px; }

  .c-sec-title__en { font-size: 14px; }
  .c-sec-title__jp { margin-top: 2px; font-size: 22px; }

  .c-faq__q { gap: 12px; padding: 18px 0; align-items: flex-start; }
  .c-faq__mark { flex-basis: 36px; font-size: 36px; }
  .c-faq__q-text { font-size: 15px; line-height: 1.75; }
  .c-faq__toggle { flex-basis: 20px; margin: 14px 0 0; }
  .c-faq__a { gap: 12px; padding: 0 0 20px; }
  .c-faq__a-text { margin-top: 2px; font-size: 14px; line-height: 2; }

  .p-service-intro { padding-top: 44px; }
  .p-service-intro__card { flex-direction: column; gap: 22px; margin-top: 30px; padding: 20px 16px 28px; }
  .p-service-intro__img { flex: none; }
  .p-service-intro__card--photo { min-height: 0; }
  .p-service-intro__card--photo .p-service-intro__img { flex: none; }
  .p-service-intro__title { margin-top: 0; font-size: 21px; line-height: 1.5; }
  .p-service-intro__text { margin-top: 14px; font-size: 14px; line-height: 2; letter-spacing: 0.7px; }

  .p-service-concern { padding: 64px 0 60px; }
  .p-service-concern__list { flex-direction: column; align-items: center; gap: 44px; margin-top: 32px; }
  .p-service-concern__item { width: 100%; }
  .p-service-concern__label { font-size: 18px; }
  .p-service-concern__img { width: 200px; margin-top: 18px; box-shadow: 0 0 14px rgba(0, 0, 0, .08); }
  .p-service-concern__text { margin-top: 18px; font-size: 14px; }

  .p-service-solve { margin-top: 52px; }
  .p-service-solve__arrow { width: 28px; height: 50px; }
  .p-service-solve__text { margin-top: 24px; font-size: 26px; }
  .p-service-solve__small { font-size: 18px; }

  .p-service-strength { padding: 60px 0; }
  .p-service-strength__inner { display: block; }
  .p-service-strength__head { text-align: center; }
  .p-service-strength__en { font-size: 14px; }
  .p-service-strength__jp { margin-top: 2px; font-size: 22px; }
  .p-service-strength__list { margin-top: 36px; }
  .p-service-strength__item { min-height: 0; }
  .p-service-strength__item + .p-service-strength__item { margin-top: 40px; }
  .p-service-strength__icon { flex-basis: 70px; }
  .p-service-strength__icon img { width: 56px; height: 56px; margin-left: 8px; box-shadow: 0 0 10px rgba(0, 0, 0, .08); }
  .p-service-strength__num { top: -2px; font-size: 15px; }
  .p-service-strength__title { font-size: 18px; line-height: 1.55; }
  .p-service-strength__title small { font-size: 10px; }
  .p-service-strength__text { margin-top: 10px; font-size: 14px; line-height: 1.95; letter-spacing: 0.7px; }

  .p-service-flow { padding: 60px 0; }
  .p-service-flow__list { margin-top: 36px; }
  .p-service-flow__item { display: block; min-height: 0; padding: 0 0 32px 34px; }
  .p-service-flow__item::before { top: 4px; left: 4px; width: 9px; height: 9px; box-shadow: 0 0 0 3px rgba(22, 142, 255, .2); }
  .p-service-flow__item::after { top: 16px; left: 8px; }
  .p-service-flow__item:last-child { padding-bottom: 8px; }
  .p-service-flow__step { padding: 3px 9px; font-size: 10px; letter-spacing: 1px; }
  .p-service-flow__title { margin-top: 6px; font-size: 18px; }
  .p-service-flow__text { margin-top: 8px; font-size: 14px; line-height: 1.8; }

  .p-service-faq { padding: 60px 0 64px; }
  .p-service-faq .c-faq { margin-top: 36px; }
}

/* ==========================================================================
   会社概要
   ========================================================================== */
/* 小見出し（左寄せ：英字＋日本語） */
.c-sub-title { color: var(--heading); }
.c-sub-title__en { font-family: var(--ff-fv); font-weight: 600; font-size: max(calc(17 * var(--u)), 12px); line-height: 1.4; letter-spacing: calc(1 * var(--u)); }
.c-sub-title__jp { font-size: calc(26 * var(--u)); font-weight: 700; line-height: 1.4; }

.p-company__inner { width: min(calc(1000 * var(--u)), 100% - var(--gutter) * 2); margin-inline: auto; }
.p-company__gray { background: var(--gray); }

/* 会社概要（2列の表） */
.p-company-profile { padding: calc(63 * var(--u)) 0 calc(84 * var(--u)); }
.p-company-profile__cols { display: grid; grid-template-columns: 1fr 1fr; gap: calc(20 * var(--u)); margin-top: calc(22 * var(--u)); }
.p-company-profile__list { display: flex; flex-direction: column; }
/* 項目名と内容のまとまりを行の上下中央に置き、項目名は内容の1行目にそろえる */
.p-company-profile__row {
  display: grid;
  grid-template-columns: calc(120 * var(--u)) 1fr;
  align-content: center;
  align-items: start;
  padding: calc(17 * var(--u)) 0 calc(17 * var(--u)) calc(16 * var(--u));
  border-bottom: 1px solid var(--line);
  font-size: max(calc(16 * var(--u)), 12px);
  line-height: 1.9;
  color: var(--heading);
}
.p-company-profile__row--sub { padding-bottom: 0; border-bottom: 0; }
/* 左右の列の最後の線をそろえる：短い方の列は、各行を均等に伸ばす */
.p-company-profile__row:not(.p-company-profile__row--sub) { flex-grow: 1; }
.p-company-profile__row dt, .p-company-profile__row dd { font-weight: 700; }
.p-company-profile__row a { text-decoration: underline; transition: opacity .3s; }
.p-company-profile__row a:hover { opacity: .6; }

/* Vision */
.p-company-vision { padding-top: calc(73 * var(--u)); }
.p-company-vision__card {
  display: flex;
  align-items: center;
  gap: calc(40 * var(--u));
  width: min(calc(1040 * var(--u)), 100% - var(--gutter) * 2);
  margin-inline: auto;
  padding: calc(42 * var(--u)) calc(40 * var(--u));
  background: var(--white);
}
.p-company-vision__img { flex: 0 0 calc(455 * var(--u)); }
/* 文章はカンプどおり、写真の上下中央よりやや上に置く */
.p-company-vision__body { align-self: flex-start; margin-top: calc(49 * var(--u)); color: var(--heading); }
.p-company-vision__en { font-family: var(--ff-en); font-weight: 600; font-size: max(calc(20 * var(--u)), 13px); line-height: 1.4; }
.p-company-vision__title { margin-top: calc(14 * var(--u)); font-size: max(calc(25 * var(--u)), 16px); font-weight: 700; line-height: 1.5; color: var(--navy); }
.p-company-vision__text { margin-top: calc(6 * var(--u)); font-size: max(calc(16 * var(--u)), 12px); font-weight: 700; line-height: 1.97; }

/* 沿革 */
.p-company-history { padding: calc(124 * var(--u)) 0 calc(153 * var(--u)); }
.p-company-history__list { margin-top: calc(40 * var(--u)); color: var(--heading); }
.p-company-history__year { display: flex; padding: calc(16 * var(--u)) 0 calc(32 * var(--u)); border-bottom: 1px solid var(--line); }
.p-company-history__year:first-child { padding-top: 0; }
.p-company-history__year dt { flex: 0 0 calc(140 * var(--u)); font-family: var(--ff-num); font-weight: 700; font-size: max(calc(20 * var(--u)), 15px); line-height: 1.6; }
.p-company-history__year ul { display: grid; row-gap: calc(16 * var(--u)); }
.p-company-history__year li { display: flex; font-size: max(calc(16 * var(--u)), 12px); font-weight: 700; line-height: 1.6; }
.p-company-history__month { flex: 0 0 calc(84 * var(--u)); font-size: max(calc(14 * var(--u)), 11px); }

/* --------------------------------------------------------------------------
   会社概要：SP（767px 以下）
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .c-sub-title__en { font-size: 14px; letter-spacing: 1px; }
  .c-sub-title__jp { font-size: 22px; }

  .p-company__inner { width: calc(100% - 40px); }

  .p-company-profile { padding: 32px 0 50px; }
  .p-company-profile__cols { grid-template-columns: 1fr; gap: 0; margin-top: 24px; }
  .p-company-profile__row { padding: 14px 0; font-size: 13px; line-height: 1.85; }
  .p-company-profile__row--sub { padding-bottom: 0; }
  .p-company-profile__row { grid-template-columns: 100px 1fr; }

  .p-company-vision { padding-top: 40px; }
  .p-company-vision__card { flex-direction: column-reverse; align-items: stretch; gap: 20px; width: calc(100% - 40px); padding: 36px 20px 24px; }
  .p-company-vision__img { flex: none; }
  .p-company-vision__body { margin-top: 0; }
  .p-company-vision__en { font-size: 14px; }
  .p-company-vision__title { margin-top: 6px; font-size: 18px; }
  .p-company-vision__text { margin-top: 6px; font-size: 13px; line-height: 1.9; }

  .p-company-history { padding: 50px 0 60px; }
  .p-company-history__list { margin-top: 24px; }
  .p-company-history__year { display: block; padding: 18px 0 20px; }
  .p-company-history__year dt { font-size: 18px; }
  .p-company-history__year ul { margin-top: 10px; row-gap: 10px; }
  .p-company-history__year li { font-size: 13px; }
  .p-company-history__month { flex-basis: 60px; font-size: 12px; }
}

/* ==========================================================================
   採用情報
   ========================================================================== */
/* ページ上部：採用情報は高さが低く、白い帯の斜めの位置も違う */
.c-page-hero--recruit { height: calc(351 * var(--u)); }
.c-page-hero--recruit::before { clip-path: polygon(0 0, 44.3% 0, 39.5% 100%, 0 100%); }
.c-page-hero--recruit .c-breadcrumb { bottom: calc(22 * var(--u)); }

/* セクション見出しの左寄せ版 */
.c-sec-title--left { text-align: left; }

/* スライダー矢印：見出しの横などに並べる版（位置指定なし） */
.c-arrow--inline { position: static; translate: none; }

.p-recruit__gray { background: var(--gray); }

/* 働く環境（写真のスライダー：見出しの左端から並べ、右は画面の端まで見せる） */
.p-recruit-env { padding-top: calc(117 * var(--u)); }
.p-recruit-env__arrows { display: flex; justify-content: flex-end; gap: calc(25 * var(--u)); margin-top: calc(15 * var(--u)); }
/* 左右の余白は .l-container の端と同じ位置にする（余白の部分にも前後の写真が見える） */
.p-recruit-env__viewport { margin-top: calc(46 * var(--u)); padding-inline: calc((100% - min(calc(1200 * var(--u)), 100% - var(--gutter) * 2)) / 2); overflow: hidden; }
.p-recruit-env__track { display: flex; gap: calc(15 * var(--u)); transition: translate .6s ease; }
.p-recruit-env__item { position: relative; flex: 0 0 calc(454 * var(--u)); }
.p-recruit-env__item img { width: 100%; aspect-ratio: 454 / 310; object-fit: cover; }
.p-recruit-env__label {
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 0 calc(25 * var(--u));
  background: var(--navy);
  font-family: var(--ff-fv);
  font-weight: 500;
  font-size: max(calc(18 * var(--u)), 11px);
  line-height: calc(35 * var(--u));
  letter-spacing: calc(2 * var(--u));
  color: var(--white);
}

/* メンバー紹介（スライダーは TOP と同じ部品） */
.p-recruit-members { padding: calc(119 * var(--u)) 0 calc(156 * var(--u)); }
.p-recruit-members .p-top-members__slider { margin-top: calc(96 * var(--u)); }

/* 応募の案内 */
.p-recruit-entry { padding: calc(119 * var(--u)) 0 calc(136 * var(--u)); }
.p-recruit-entry__text { font-size: max(calc(20 * var(--u)), 13px); font-weight: 500; line-height: 1.6; text-align: center; color: #333; }
.p-recruit-entry__text p + p { margin-top: calc(32 * var(--u)); }
.p-recruit-entry__text a { color: #3464bf; text-decoration: underline; text-underline-offset: calc(4 * var(--u)); transition: opacity .3s; }
.p-recruit-entry__text a:hover { opacity: .7; }
.p-recruit-entry__btn {
  /* 文字はボタンの中央よりやや左、矢印は右端寄せ（カンプどおり） */
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-right: calc(24 * var(--u));
  width: calc(686 * var(--u));
  height: calc(161 * var(--u));
  margin: calc(107 * var(--u)) auto 0;
  border-radius: 4px;
  background: var(--navy);
  color: var(--white);
  transition: opacity .3s;
}
.p-recruit-entry__btn:hover { opacity: .9; }
.p-recruit-entry__btn-text { font-size: max(calc(26 * var(--u)), 14px); font-weight: 700; line-height: 1.7; letter-spacing: calc(6 * var(--u)); text-align: center; }
.p-recruit-entry__btn-icon {
  position: absolute;
  top: 50%;
  right: calc(105 * var(--u));
  width: calc(32 * var(--u));
  height: calc(32 * var(--u));
  margin-top: calc(-16 * var(--u));
  border-radius: 50%;
  background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f2b5b' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 60% no-repeat;
  transition: translate .3s;
}
.p-recruit-entry__btn:hover .p-recruit-entry__btn-icon { translate: 4px 0; }

/* --------------------------------------------------------------------------
   採用情報：SP（767px 以下）
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .c-page-hero--recruit { height: 212px; }
  .c-page-hero--recruit::before { clip-path: polygon(0 0, 66% 0, 50% 100%, 0 100%); }
  .c-page-hero--recruit .c-breadcrumb { bottom: 10px; }

  /* 働く環境：見出しの右に矢印、写真は見出しの左端にそろえ、次の写真を少し見せる */
  .p-recruit-env { padding-top: 44px; }
  .p-recruit-env__head { display: flex; justify-content: space-between; align-items: flex-end; }
  .p-recruit-env__arrows { gap: 10px; margin-top: 0; }
  .p-recruit-env__viewport { margin-top: 24px; padding-inline: 20px; }
  .p-recruit-env__track { gap: 10px; }
  .p-recruit-env__item { flex-basis: min(310px, 100vw - 80px); }
  .p-recruit-env__label { padding: 0 14px; font-size: 12px; line-height: 24px; letter-spacing: 1px; }

  .p-recruit-members { padding: 70px 0 60px; }
  .p-recruit-members .p-top-members__slider { margin-top: 40px; }

  .p-recruit-entry { padding: 56px 0 64px; }
  .p-recruit-entry__text { font-size: 14px; line-height: 1.9; }
  .p-recruit-entry__text p + p { margin-top: 27px; }
  .p-recruit-entry__btn { width: 100%; max-width: 335px; height: 104px; margin-top: 40px; padding-right: 30px; }
  .p-recruit-entry__btn-text { font-size: 16px; line-height: 1.8; letter-spacing: 3px; }
  .p-recruit-entry__btn-icon { right: 20px; width: 26px; height: 26px; margin-top: -13px; }
}

/* ==========================================================================
   メンバー一覧（社員インタビュー）
   ========================================================================== */
.p-member-list__body { padding: calc(161 * var(--u)) 0 calc(169 * var(--u)); background: var(--gray); }
/* カードは TOP のメンバー紹介と同じ部品（.c-member-card）。3列で並べる */
.p-member-list__grid {
  display: grid;
  grid-template-columns: repeat(3, calc(336 * var(--u)));
  justify-content: center;
  column-gap: calc(75 * var(--u));
  row-gap: calc(122 * var(--u));
}

/* --------------------------------------------------------------------------
   メンバー一覧：SP（767px 以下）
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .p-member-list__body { padding: 44px 0 60px; }
  .p-member-list__grid { grid-template-columns: 1fr; row-gap: 48px; }
}

/* ==========================================================================
   メンバー詳細（社員インタビュー）
   ========================================================================== */
/* パンくず（上部の帯の上、白い帯の中に置く版） */
.c-breadcrumb--static { position: static; }
.p-member__crumb { display: flex; align-items: center; height: calc(38 * var(--u)); background: var(--white); }

/* 上部：紺の帯＋大きな英字＋入社年・イニシャル・事業部＋縦長写真（写真は帯の下にはみ出す） */
.p-member-hero { position: relative; height: calc(668 * var(--u)); background: #3e4872; color: var(--white); }
.p-member-hero__bg {
  position: absolute;
  top: calc(-37 * var(--u));
  left: calc(240 * var(--u));
  font-family: var(--ff-nav);
  font-weight: 700;
  font-size: calc(262 * var(--u));
  line-height: 1.18;
  letter-spacing: calc(-3 * var(--u));
  color: rgba(255, 255, 255, .07);
  white-space: nowrap;
  pointer-events: none;
}
/* 入社年などと写真は、本文と同じ 960px の幅の両端にそろえる */
.p-member-hero__inner { position: relative; display: flex; justify-content: space-between; width: min(calc(960 * var(--u)), 100% - var(--gutter) * 2); height: 100%; margin: 0 auto; }
.p-member-hero__info { padding-top: calc(283 * var(--u)); }
.p-member-hero__year { font-size: max(calc(18 * var(--u)), 12px); font-weight: 700; line-height: 1.5; }
.p-member-hero__name { margin-top: calc(10 * var(--u)); font-family: var(--ff-en); font-size: calc(36 * var(--u)); font-weight: 600; line-height: 1.2; }
.p-member-hero__division { margin-top: calc(10 * var(--u)); font-size: max(calc(16 * var(--u)), 12px); font-weight: 500; line-height: 1.5; }
.p-member-hero__img {
  flex: 0 0 calc(440 * var(--u));
  align-self: flex-start;
  margin-top: calc(185 * var(--u));
  border-radius: calc(20 * var(--u));
  overflow: hidden;
}
.p-member-hero__img img { width: 100%; aspect-ratio: 880 / 1156; object-fit: cover; }

/* 本文の幅（960px） */
.p-member__body { width: min(calc(960 * var(--u)), 100% - var(--gutter) * 2); margin: 0 auto; padding: calc(136 * var(--u)) 0 calc(100 * var(--u)); }

/* 目次（ページ内リンク） */
.p-member-toc ul { display: flex; flex-wrap: wrap; }
.p-member-toc li { display: flex; align-items: center; }
.p-member-toc li::after { content: ""; width: 1px; height: calc(18 * var(--u)); margin: 0 calc(20 * var(--u)); background: #d3d5de; }
.p-member-toc a { display: flex; align-items: center; gap: calc(12 * var(--u)); font-size: max(calc(16 * var(--u)), 12px); font-weight: 500; line-height: 1.5; color: var(--navy); transition: opacity .3s; }
.p-member-toc a::after {
  content: "";
  width: calc(10 * var(--u));
  height: calc(6 * var(--u));
  min-width: 8px;
  min-height: 5px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6' fill='none' stroke='%231f2b5b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1l4 4 4-4'/%3E%3C/svg%3E") center / contain no-repeat;
}
.p-member-toc a:hover { opacity: .6; }

/* 質問と答え */
.p-member-qa { margin-top: calc(80 * var(--u)); scroll-margin-top: calc(var(--header-h) + 20px); }
.p-member-qa__label {
  display: inline-block;
  padding: 0 calc(16 * var(--u)) calc(4 * var(--u)) 0;
  border-bottom: 2px solid var(--navy);
  font-size: max(calc(18 * var(--u)), 13px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--navy);
}
.p-member-qa__title { margin-top: calc(10 * var(--u)); font-size: max(calc(28 * var(--u)), 18px); font-weight: 700; line-height: 1.6; color: #333; }
.p-member-qa__text { margin-top: calc(14 * var(--u)); font-size: max(calc(16 * var(--u)), 13px); font-weight: 500; line-height: 1.75; letter-spacing: calc(-0.3 * var(--u)); color: #333; text-align: justify; }
.p-member-qa__text + .p-member-qa__text { margin-top: calc(18 * var(--u)); }

/* 本文の下の写真 */
.p-member__photo { margin-top: calc(60 * var(--u)); border-radius: calc(20 * var(--u)); overflow: hidden; }
.p-member__photo img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }

/* 他のメンバー（スライダー・VIEW ALL は TOP と同じ部品） */
.p-member-others { padding: calc(97 * var(--u)) 0 calc(52 * var(--u)); background: var(--gray); }
.p-member-others .p-top-members__slider { margin-top: calc(80 * var(--u)); }
.p-member-others .p-top-members__more { margin-top: calc(80 * var(--u)); }

/* 応募ボタン（ボタンは採用情報と同じ部品） */
.p-member-entry { padding: calc(100 * var(--u)) 0; }
.p-member-entry .p-recruit-entry__btn { margin-top: 0; }

/* --------------------------------------------------------------------------
   メンバー詳細：SP（767px 以下）
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .p-member__crumb { height: 34px; }

  /* 上部：写真を上、入社年・イニシャル・事業部をその下に置く */
  .p-member-hero { height: auto; padding: 24px 0 32px; }
  .p-member-hero__bg { top: -8px; left: 8px; font-size: 96px; letter-spacing: -1px; }
  .p-member-hero__inner { flex-direction: column-reverse; gap: 20px; }
  .p-member-hero__inner { width: calc(100% - 40px); }
  .p-member-hero__info { padding: 0; }
  .p-member-hero__year { font-size: 14px; }
  .p-member-hero__name { margin-top: 4px; font-size: 30px; }
  .p-member-hero__division { margin-top: 6px; font-size: 13px; }
  .p-member-hero__img { flex: none; align-self: stretch; margin-top: 0; border-radius: 12px; }
  .p-member-hero__img img { aspect-ratio: 4 / 5; object-position: 50% 20%; }

  .p-member__body { width: calc(100% - 40px); padding: 32px 0 60px; }
  /* 目次：縦に並べる */
  .p-member-toc ul { flex-direction: column; gap: 10px; }
  .p-member-toc li::after { display: none; }
  .p-member-toc a { gap: 8px; font-size: 14px; }

  .p-member-qa { margin-top: 48px; }
  .p-member-qa__label { padding: 0 10px 3px 0; font-size: 14px; }
  .p-member-qa__title { margin-top: 8px; font-size: 20px; line-height: 1.5; }
  .p-member-qa__text { margin-top: 12px; font-size: 14px; line-height: 1.85; }
  .p-member-qa__text + .p-member-qa__text { margin-top: 14px; }
  .p-member__photo { margin-top: 32px; border-radius: 12px; }

  .p-member-others { padding: 56px 0 48px; }
  .p-member-others .p-top-members__slider { margin-top: 32px; }
  .p-member-others .p-top-members__more { margin-top: 40px; }
  .p-member-entry { padding: 48px 0; }
}

/* ==========================================================================
   お問い合わせ
   ========================================================================== */
.p-contact__body { padding: calc(100 * var(--u)) 0 calc(140 * var(--u)); background: var(--gray); }
/* PC：左に案内文と電話・FAX、右にフォーム */
.p-contact__inner {
  display: grid;
  grid-template-columns: 1fr calc(700 * var(--u));
  grid-template-rows: auto 1fr;
  column-gap: calc(80 * var(--u));
  align-items: start;
  color: var(--heading);
}
.p-contact__text { grid-column: 1; font-size: max(calc(16 * var(--u)), 13px); font-weight: 700; line-height: 2.2; }

/* 電話・FAX */
.p-contact-tel { grid-column: 1; margin-top: calc(40 * var(--u)); padding-top: calc(40 * var(--u)); border-top: 1px solid #cdd0da; }
.p-contact-tel__head { font-size: max(calc(20 * var(--u)), 15px); font-weight: 700; line-height: 1.5; }
.p-contact-tel__time { margin-top: calc(10 * var(--u)); font-size: max(calc(14 * var(--u)), 12px); font-weight: 500; }
.p-contact-tel dt { margin-top: calc(32 * var(--u)); font-size: max(calc(16 * var(--u)), 13px); font-weight: 700; }
.p-contact-tel dd { margin-top: calc(12 * var(--u)); }
.p-contact-tel__btn {
  display: inline-flex;
  align-items: center;
  gap: calc(20 * var(--u));
  min-width: calc(330 * var(--u));
  padding: calc(14 * var(--u)) calc(32 * var(--u)) calc(14 * var(--u)) calc(14 * var(--u));
  border-radius: 999px;
  background: var(--white);
  font-family: var(--ff-num);
  font-size: max(calc(26 * var(--u)), 18px);
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}
.p-contact-tel__btn .c-icon-circle { width: calc(56 * var(--u)); height: calc(56 * var(--u)); }
a.p-contact-tel__btn { transition: opacity .3s; }
a.p-contact-tel__btn:hover { opacity: .7; }

/* フォーム（Contact Form 7 の HTML に合わせて指定する） */
.p-contact-form {
  grid-column: 2;
  grid-row: 1 / span 2;
  padding: calc(56 * var(--u)) calc(64 * var(--u)) calc(64 * var(--u));
  border-radius: calc(20 * var(--u));
  background: var(--white);
  box-shadow: 0 calc(10 * var(--u)) calc(30 * var(--u)) rgba(22, 31, 63, .06);
}
.p-contact-form .wpcf7-form > p:first-of-type { margin: 0; }
.p-contact-form .flow { display: block; width: calc(390 * var(--u)); min-width: 260px; margin: 0 auto calc(16 * var(--u)); }
.p-contact-form dl { margin-top: calc(36 * var(--u)); }
.p-contact-form dt { display: flex; flex-wrap: wrap; align-items: baseline; gap: calc(8 * var(--u)); margin-bottom: calc(12 * var(--u)); font-size: max(calc(16 * var(--u)), 14px); font-weight: 700; line-height: 1.5; }
.p-contact-form .required,
.p-contact-form .unrequired { font-size: max(calc(14 * var(--u)), 12px); font-weight: 700; white-space: nowrap; }
.p-contact-form .required { color: var(--red); }
.p-contact-form .unrequired { color: #8a8fa3; }
.p-contact-form dd { min-width: 0; }
.p-contact-form .input50 dd { display: flex; gap: calc(16 * var(--u)); }
.p-contact-form .input50 .wpcf7-form-control-wrap { flex: 1; }
.p-contact-form .wpcf7-form-control-wrap { display: block; }
.p-contact-form [data-name^="tel-"] { width: 50%; }
.p-contact-form input[type="text"],
.p-contact-form input[type="tel"],
.p-contact-form input[type="email"],
.p-contact-form select,
.p-contact-form textarea {
  width: 100%;
  padding: calc(14 * var(--u)) calc(16 * var(--u));
  border: 1px solid #cdd0da;
  border-radius: calc(4 * var(--u));
  background: var(--white);
  font: inherit;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.6;
  color: var(--text);
  transition: border-color .3s, box-shadow .3s;
}
.p-contact-form ::placeholder { color: #a5a9b8; }
.p-contact-form input:focus,
.p-contact-form select:focus,
.p-contact-form textarea:focus { outline: none; border-color: var(--navy); box-shadow: 0 0 0 3px rgba(31, 43, 91, .12); }
.p-contact-form select {
  appearance: none;
  padding-right: calc(44 * var(--u));
  background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6' fill='none' stroke='%231f2b5b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1l4 4 4-4'/%3E%3C/svg%3E") right calc(16 * var(--u)) center / 12px auto no-repeat;
  cursor: pointer;
}
.p-contact-form textarea { height: calc(300 * var(--u)); min-height: 200px; resize: vertical; }

/* 運営規約・個人情報の取扱い（長いので枠の中でスクロール） */
.p-contact-form .text {
  max-height: calc(290 * var(--u));
  min-height: 180px;
  padding: calc(20 * var(--u));
  border: 1px solid #cdd0da;
  border-radius: calc(4 * var(--u));
  overflow-y: auto;
  font-size: max(calc(14 * var(--u)), 12px);
  font-weight: 500;
  line-height: 2;
}
.p-contact-form .text + p { margin-top: calc(28 * var(--u)); text-align: center; }
.p-contact-form .wpcf7-acceptance label { display: inline-flex; align-items: center; gap: calc(10 * var(--u)); font-size: max(calc(16 * var(--u)), 13px); font-weight: 700; cursor: pointer; }
.p-contact-form .wpcf7-acceptance input { width: 20px; height: 20px; margin: 0; accent-color: var(--navy); cursor: pointer; }

/* 送信ボタン（同意にチェックが入るまでは灰色） */
.p-contact-form .submit_wrapper { position: relative; width: max-content; margin: calc(40 * var(--u)) auto 0; }
.p-contact-form .submit_btn {
  width: calc(320 * var(--u));
  min-width: 260px;
  height: calc(72 * var(--u));
  min-height: 56px;
  border: 0;
  border-radius: 999px;
  background: var(--navy);
  font: inherit;
  font-size: max(calc(18 * var(--u)), 15px);
  font-weight: 700;
  letter-spacing: calc(2 * var(--u));
  color: var(--white);
  cursor: pointer;
  transition: opacity .3s, background-color .3s;
}
.p-contact-form .submit_wrapper::after {
  content: "";
  position: absolute;
  top: 50%;
  right: calc(12 * var(--u));
  width: max(calc(44 * var(--u)), 36px);
  aspect-ratio: 1;
  translate: 0 -50%;
  border-radius: 50%;
  background: rgba(255, 255, 255, .2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 50% no-repeat;
  pointer-events: none;
}
.p-contact-form .submit_btn:hover { opacity: .85; }
.p-contact-form .submit_btn:disabled { background: #cdd0da; opacity: 1; cursor: not-allowed; }
.p-contact-form .wpcf7-spinner { position: absolute; top: 50%; left: 100%; margin: -12px 0 0 12px; }

/* 入力エラー・送信結果のメッセージ */
.p-contact-form .wpcf7-not-valid-tip { display: block; margin-top: calc(6 * var(--u)); font-size: max(calc(13 * var(--u)), 12px); font-weight: 700; color: #c8102e; }
.p-contact-form .wpcf7-not-valid { border-color: #c8102e; }
.p-contact-form .wpcf7-response-output { margin: calc(24 * var(--u)) 0 0; padding: calc(12 * var(--u)) calc(16 * var(--u)); border-radius: calc(6 * var(--u)); font-size: max(calc(14 * var(--u)), 13px); text-align: center; }

/* --------------------------------------------------------------------------
   お問い合わせ：タブレット（768〜1063px）は1カラム
   -------------------------------------------------------------------------- */
@media (max-width: 1063px) {
  .p-contact__inner { grid-template-columns: 1fr; grid-template-rows: none; }
  .p-contact__text,
  .p-contact-tel,
  .p-contact-form { grid-column: 1; grid-row: auto; }
  .p-contact-form { order: 1; margin-top: 40px; }
  .p-contact-tel { order: 2; }
}

/* --------------------------------------------------------------------------
   お問い合わせ：SP（767px 以下）
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .p-contact__body { padding: 40px 0 60px; }
  .p-contact__text { font-size: 14px; line-height: 1.9; }
  .p-contact-form { margin-top: 28px; padding: 24px 16px 36px; border-radius: 12px; }
  .p-contact-form .flow { min-width: 0; width: 100%; max-width: 300px; margin-bottom: 4px; }
  .p-contact-form dl { margin-top: 24px; }
  .p-contact-form dt { margin-bottom: 8px; font-size: 14px; }
  .p-contact-form .input50 dd { gap: 10px; }
  .p-contact-form [data-name^="tel-"] { width: 100%; }
  .p-contact-form input[type="text"],
  .p-contact-form input[type="tel"],
  .p-contact-form input[type="email"],
  .p-contact-form select,
  .p-contact-form textarea { padding: 10px 12px; border-radius: 4px; }
  .p-contact-form select { padding-right: 36px; background-position: right 12px center; }
  .p-contact-form .text { max-height: 220px; padding: 12px 14px; }
  .p-contact-form .text + p { margin-top: 20px; }
  .p-contact-form .wpcf7-acceptance label { gap: 8px; font-size: 13px; text-align: left; }
  .p-contact-form .submit_wrapper { margin-top: 28px; }
  .p-contact-form .submit_wrapper::after { right: 10px; }
  .p-contact-tel { margin-top: 40px; padding-top: 32px; }
  .p-contact-tel dt { margin-top: 24px; font-size: 14px; }
  .p-contact-tel dd { margin-top: 10px; }
  .p-contact-tel__btn { gap: 14px; min-width: 260px; padding: 10px 24px 10px 10px; }
  .p-contact-tel__btn .c-icon-circle { width: 44px; height: 44px; }
}

/* --------------------------------------------------------------------------
   お問い合わせ：確認画面（入力内容を項目名と並べて表示）
   -------------------------------------------------------------------------- */
.p-contact-form--confirm dl {
  display: grid;
  grid-template-columns: calc(190 * var(--u)) 1fr;
  gap: calc(24 * var(--u));
  margin: 0;
  padding: calc(22 * var(--u)) 0;
  border-bottom: 1px solid var(--line);
}
.p-contact-form--confirm .flow + dl,
.p-contact-form--confirm p:has(.flow) + dl { border-top: 1px solid var(--line); }
.p-contact-form--confirm dt { margin: 0; font-size: max(calc(15 * var(--u)), 13px); }
.p-contact-form--confirm dd { font-size: max(calc(16 * var(--u)), 14px); font-weight: 500; line-height: 1.8; color: var(--text); overflow-wrap: anywhere; }
.p-contact-form--confirm .input50 dd { display: block; }

/* 戻る（枠線の丸いボタン） */
.p-contact-form .back {
  display: grid;
  place-items: center;
  width: calc(320 * var(--u));
  min-width: 260px;
  height: calc(56 * var(--u));
  min-height: 48px;
  margin: calc(16 * var(--u)) auto 0;
  border: 1px solid var(--navy);
  border-radius: 999px;
  font-size: max(calc(16 * var(--u)), 14px);
  font-weight: 700;
  color: var(--navy);
  transition: opacity .3s;
}
.p-contact-form .back:hover { opacity: .7; }

/* --------------------------------------------------------------------------
   お問い合わせ：完了画面
   -------------------------------------------------------------------------- */
.p-contact-done { text-align: center; }
.p-contact-done__title { margin-top: calc(48 * var(--u)); font-size: max(calc(24 * var(--u)), 18px); font-weight: 700; line-height: 1.6; color: var(--heading); }
.p-contact-done__text { margin-top: calc(24 * var(--u)); font-size: max(calc(16 * var(--u)), 14px); font-weight: 500; line-height: 2; }
.p-contact-done__btn {
  position: relative;
  display: grid;
  place-items: center;
  width: calc(320 * var(--u));
  min-width: 260px;
  height: calc(72 * var(--u));
  min-height: 56px;
  margin: calc(48 * var(--u)) auto 0;
  border-radius: 999px;
  background: var(--navy);
  font-size: max(calc(18 * var(--u)), 15px);
  font-weight: 700;
  letter-spacing: calc(2 * var(--u));
  color: var(--white);
  transition: opacity .3s;
}
.p-contact-done__btn::after {
  content: "";
  position: absolute;
  top: 50%;
  right: calc(12 * var(--u));
  width: max(calc(44 * var(--u)), 36px);
  aspect-ratio: 1;
  translate: 0 -50%;
  border-radius: 50%;
  background: rgba(255, 255, 255, .2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 50% no-repeat;
}
.p-contact-done__btn:hover { opacity: .85; }

@media (max-width: 767px) {
  .p-contact-form--confirm dl { grid-template-columns: 1fr; gap: 4px; padding: 16px 0; }
  .p-contact-form--confirm dt { font-size: 13px; }
  .p-contact-form--confirm dd { font-size: 15px; }
  .p-contact-form .back { margin-top: 12px; }
  .p-contact-done { padding-bottom: 40px; }
  .p-contact-done__title { margin-top: 28px; font-size: 18px; }
  .p-contact-done__text { margin-top: 16px; font-size: 14px; text-align: left; }
  .p-contact-done__btn { margin-top: 32px; }
  .p-contact-done__btn::after { right: 10px; }
}

/* ==========================================================================
   個人情報保護方針
   ========================================================================== */
/* 旧ページと同じく、薄いグレーの背景に白いカードを置き、項目ごとにグレーの細い線で区切る */
.p-privacy__body { padding: calc(80 * var(--u)) 0 calc(140 * var(--u)); background: var(--gray); }
.p-privacy__card { padding: calc(64 * var(--u)) calc(80 * var(--u)); background: var(--white); }
.p-privacy__text--lead,
.p-privacy__section { padding-bottom: calc(24 * var(--u)); border-bottom: 1px solid #bcc0ce; }
.p-privacy__section { margin-top: calc(24 * var(--u)); }
.p-privacy__section:last-child { padding-bottom: 0; border-bottom: 0; }
.p-privacy__title { font-size: max(calc(16 * var(--u)), 13px); font-weight: 700; line-height: 1.9; color: var(--heading); }
.p-privacy__text { margin-top: calc(10 * var(--u)); font-size: max(calc(16 * var(--u)), 13px); line-height: 2; color: var(--heading); }
.p-privacy__text--lead { margin-top: 0; }

@media (max-width: 767px) {
  .p-privacy__body { padding: 40px 0 70px; }
  .p-privacy__card { padding: 28px 20px; }
  .p-privacy__text--lead,
  .p-privacy__section { padding-bottom: 20px; }
  .p-privacy__section { margin-top: 20px; }
  .p-privacy__title { font-size: 14px; }
  .p-privacy__text { margin-top: 8px; font-size: 14px; line-height: 1.9; }
}