@charset "UTF-8";
/* ============================================================
   JOBOLE 下層ページ共通スタイル v3.0
   style.min.css の上に読み込み、ヘッダー・フッター・タイポグラフィを
   新デザインシステムに統一する（本文レイアウトは旧CSSを維持）
   ============================================================ */

/* --- フォント --- */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700&family=Inter:wght@500;600;700;800&display=swap');

/* --- トークン ---
   design-system.css から --blue-*, --slate-*, --accent-*, --r-*, --shadow-*,
   --font-body, --font-num, --warm-bg を継承。
   このファイルでは var(--<token>) を直接参照する。
   ------------------------------------------------------------ */

/* ============================================================
   ヘッダー上書き
   ============================================================ */
.l-header,
.l-header--not-top.l-header {
  position: fixed !important;
  top: 12px !important;
  left: 12px !important;
  right: 12px !important;
  z-index: 100 !important;
  background: rgba(255,255,255,0.85) !important;
  backdrop-filter: blur(16px) saturate(1.3) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.3) !important;
  border: 1px solid rgba(255,255,255,0.5) !important;
  border-radius: var(--r-2xl, 28px) !important;
  box-shadow: var(--shadow-lg) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  padding: 0 !important;
  height: auto !important;
}

.l-header--not-top.l-header {
  background: rgba(255,255,255,0.92) !important;
}

.l-header__inner {
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  height: 60px !important;
  display: flex !important;
  align-items: center !important;
}

.l-header__logo {
  margin: 0 !important;
}

.l-header__logo img,
.l-header__logo .c-logo {
  height: 26px !important;
  width: auto !important;
}

/* 下層ページの白ロゴを非表示（背景がダークでなくなるため） */
.l-header--not-top .c-logo--white {
  display: none !important;
}

.l-header--not-top .c-logo--scrolled {
  display: block !important;
}

/* ナビリンク */
.c-nav__items .c-nav__item .c-nav__link {
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--slate-600, #475569) !important;
  letter-spacing: 0.02em !important;
  padding: 6px 12px !important;
  border-radius: 10px !important;
  transition: all 0.15s !important;
}

.c-nav__items .c-nav__item .c-nav__link:hover {
  color: var(--blue-700, #0369A1) !important;
  background: var(--blue-50, #F0F9FF) !important;
}

/* ヘッダー CTA ボタン */
.c-nav__items .ci_ctc a,
.c-nav__toggle .ci_ctc a {
  background: linear-gradient(160deg, var(--accent-500, #F97316), var(--accent-600, #EA580C)) !important;
  color: #fff !important;
  border-radius: var(--r-lg, 16px) !important;
  padding: 8px 18px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  border: none !important;
  box-shadow: 0 4px 12px rgba(234,88,12,0.15) !important;
}

.c-nav__items .ci_acc a,
.c-nav__toggle .ci_acc a {
  background: #fff !important;
  color: var(--blue-700, #0369A1) !important;
  border: 1.5px solid var(--blue-500, #0EA5E9) !important;
  border-radius: var(--r-lg, 16px) !important;
  padding: 8px 18px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  background-image: none !important;
}

/* main のパディング（フローティングヘッダー分） */
.l-main {
  padding-top: 84px !important;
}

/* ============================================================
   ページタイトル上書き
   ============================================================ */
.c-pagetitle {
  background: linear-gradient(135deg, var(--blue-900, #0C4A6E), var(--blue-950, #082F49)) !important;
  border-radius: var(--r-xl, 20px) !important;
  margin: 0 12px !important;
  padding: 64px 32px 48px !important;
  text-align: center !important;
}

.c-pagetitle__eng {
  font-family: var(--font-num) !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.45) !important;
  margin-bottom: 6px !important;
}

.c-pagetitle__title {
  font-family: var(--font-body) !important;
  font-size: 2.6rem !important;
  font-weight: 700 !important;
  color: #fff !important;
  letter-spacing: 0.02em !important;
  line-height: 1.35 !important;
}

/* パンくず */
.c-breadcrumbs {
  margin-top: 16px !important;
}

.c-breadcrumbs__item a,
.c-breadcrumbs__item span {
  font-size: 12px !important;
  color: rgba(255,255,255,0.5) !important;
}

.c-breadcrumbs__item a:hover {
  color: rgba(255,255,255,0.8) !important;
}

/* ============================================================
   タイポグラフィ上書き — 全下層ページ共通
   ============================================================ */
body.l-body {
  font-family: var(--font-body) !important;
  font-size: 1.5rem !important;
  line-height: 1.75 !important;
  color: var(--slate-700, #334155) !important;
  font-feature-settings: "palt" 1 !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
  letter-spacing: 0.02em !important;
}

/* 見出し h2 */
.c-heading--h3,
.c-heading--center {
  font-family: var(--font-body) !important;
  font-size: 2.2rem !important;
  font-weight: 700 !important;
  color: var(--slate-900, #0F172A) !important;
  letter-spacing: 0.02em !important;
  line-height: 1.4 !important;
}

/* h1, p, th/td, li, a, button は body.l-body から
   font-family / letter-spacing を継承するため個別指定不要 */

/* ============================================================
   フッター上書き
   ============================================================ */
footer,
.l-footer {
  background: var(--slate-950, #020617) !important;
  color: rgba(255,255,255,0.6) !important;
  border-top: none !important;
}

footer .footer_inner,
.l-footer__inner {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

footer .footer_nav {
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  padding: 32px 16px !important;
}

footer .footer_nav ul {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 24px !important;
}

footer .footer_nav ul li {
  padding: 0 !important;
}

footer .footer_nav ul li::before,
footer .footer_nav ul li::after {
  display: none !important;
}

footer .footer_nav ul li a {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: rgba(255,255,255,0.65) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

footer .footer_nav ul li a:hover {
  color: #fff !important;
}

footer .footer_links {
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  padding: 24px 16px !important;
}

footer .footer_links .title {
  color: rgba(255,255,255,0.4) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
}

footer .footer_links .site_links {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
}

footer .footer_links .site_links li {
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  color: rgba(255,255,255,0.55) !important;
  width: 48% !important;
  border: none !important;
  padding: 0 0 16px !important;
  margin: 0 0 16px !important;
  line-height: 1.65 !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

footer .footer_links .site_links li:nth-last-of-type(-n+2) {
  border-bottom: none !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

footer .footer_links .site_links li br {
  display: block !important;
}

footer .footer_links .site_links li a {
  color: rgba(255,255,255,0.7) !important;
  padding-right: 0 !important;
  text-decoration: none !important;
}

footer .footer_links .site_links li a::after {
  display: none !important;
}

footer .footer_links .site_links li a:hover {
  color: #fff !important;
}

footer .footer_cont {
  padding: 24px 16px !important;
}

footer .corp {
  padding-left: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

footer .corp > a {
  position: static !important;
}
footer .corp > a img,
footer .corp .c-logo {
  height: 24px !important;
  width: auto !important;
}

footer .corp .corp_list li {
  color: rgba(255,255,255,0.55) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

footer .corp .corp_list li.tel a {
  color: rgba(255,255,255,0.55) !important;
}

footer .p-badge img {
  opacity: 1 !important;
}

/* ロゴ・Pマークエリア背景 */
footer .footer_cont {
  background: rgba(255,255,255,0.08) !important;
  border-radius: 8px !important;
  padding: 20px 24px !important;
}

.l-footer__copyright {
  background: rgba(0,0,0,0.2) !important;
  text-align: center !important;
  padding: 16px 0 !important;
  color: rgba(255,255,255,0.35) !important;
  font-size: 12px !important;
}

/* ============================================================
   CTA ボタン統一
   ============================================================ */
.c-btn,
.p-btn--l {
  font-family: var(--font-body) !important;
  border-radius: var(--r-lg, 16px) !important;
  letter-spacing: 0.02em !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* フローティングフッター */
.float_footer {
  background: rgba(255,255,255,0.9) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-top: 1px solid rgba(255,255,255,0.5) !important;
  box-shadow: 0 -4px 20px rgba(0,0,0,0.06) !important;
}

/* ============================================================
   料金カード改善
   ============================================================ */
.p-plancard {
  border-radius: var(--r-xl, 20px) !important;
  border: 1px solid var(--slate-200, #E2E8F0) !important;
  box-shadow: var(--shadow-lg) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  overflow: hidden !important;
}

.p-plancard:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 4px 8px rgba(12,74,110,0.03), 0 20px 40px -8px rgba(12,74,110,0.12) !important;
}

.p-plancard__heading {
  font-family: var(--font-body) !important;
  font-size: 1.8rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
}

.p-plancard__price {
  font-family: var(--font-body) !important;
}

.p-plancard__price--number {
  font-family: var(--font-num) !important;
  letter-spacing: -0.02em !important;
}

.p-plancard__table th,
.p-plancard__table td {
  font-family: var(--font-body) !important;
  font-size: 1.4rem !important;
  letter-spacing: 0.02em !important;
}

.p-plancard__annotation {
  font-family: var(--font-body) !important;
  font-size: 1.2rem !important;
  letter-spacing: 0.02em !important;
}

.p-plancard__btn {
  font-family: var(--font-body) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
}

/* ============================================================
   FAQ改善
   ============================================================ */
.c-faq__q {
  font-family: var(--font-body) !important;
  font-size: 1.45rem !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  letter-spacing: 0.02em !important;
  color: var(--slate-800, #1E293B) !important;
  cursor: pointer !important;
  transition: background 0.15s !important;
  border-radius: 8px !important;
  padding: 16px 20px !important;
}

.c-faq__q:hover {
  background: var(--slate-50, #FAFAF8) !important;
}

.c-faq__a {
  font-family: var(--font-body) !important;
  font-size: 1.4rem !important;
  line-height: 1.85 !important;
  letter-spacing: 0.025em !important;
  color: var(--slate-600, #475569) !important;
  padding: 0 20px 16px 44px !important;
}

.c-faq__item {
  border: 1px solid var(--slate-200, #E2E8F0) !important;
  border-radius: 12px !important;
  margin-bottom: 8px !important;
  overflow: hidden !important;
}

/* FAQ内のリスト */
.c-faq__listTitle {
  font-family: var(--font-body) !important;
  font-size: 1.4rem !important;
  font-weight: 600 !important;
  color: var(--slate-800, #1E293B) !important;
}

.c-faq__listItem {
  font-family: var(--font-body) !important;
  font-size: 1.35rem !important;
  color: var(--slate-600, #475569) !important;
  line-height: 1.7 !important;
}

/* ============================================================
   フォーム改善
   ============================================================ */
.c-form__iframe {
  border-radius: var(--r-lg, 16px) !important;
}

/* ============================================================
   導入事例カード改善
   ============================================================ */
.p-card {
  border-radius: var(--r-xl, 20px) !important;
  border: 1px solid var(--slate-200, #E2E8F0) !important;
  overflow: hidden !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.p-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--shadow-lg) !important;
}

.p-card__img img {
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.p-card:hover .p-card__img img {
  transform: scale(1.04) !important;
}

/* ============================================================
   コンテンツエリア品質向上（全下層ページ共通）
   ============================================================ */

/* セクション背景の交互色 */
.l-container--gray {
  background: var(--warm-bg, #FFFBF5) !important;
}

/* コンテンツ内リンク */
.l-main a:not([class]) {
  color: var(--blue-600, #0284C7) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  transition: color 0.15s !important;
}

.l-main a:not([class]):hover {
  color: var(--blue-700, #0369A1) !important;
}

/* セクション見出し */
.c-heading--h3 {
  font-size: 24px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  color: var(--slate-900, #0F172A) !important;
}

.c-heading--eng {
  font-family: var(--font-num) !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--blue-500, #0EA5E9) !important;
}

.c-heading--light {
  font-weight: 400 !important;
  color: var(--slate-500, #64748B) !important;
}

/* テーブル */
.l-main table {
  border-radius: 8px !important;
  overflow: hidden !important;
}

.l-main table th {
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
}

/* ============================================================
   導入事例 記事ページ品質向上
   ============================================================ */

/* 記事カード */
.c-thumb__link {
  border-radius: var(--r-xl, 20px) !important;
  border: 1px solid var(--slate-200, #E2E8F0) !important;
  padding: 16px !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 2px 4px rgba(12,74,110,0.02) !important;
}

.c-thumb__link:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--shadow-lg) !important;
  border-color: var(--blue-500, #0EA5E9) !important;
  opacity: 1 !important;
}

.c-thumb__hdg {
  color: var(--blue-700, #0369A1) !important;
  font-weight: 700 !important;
}

.c-thumb__industry--label {
  background: var(--blue-600, #0284C7) !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  padding: 3px 8px !important;
}

/* 記事本文 */
.p-article {
  max-width: 800px !important;
  margin: 0 auto !important;
}

.p-article__logo-img {
  border-radius: 8px !important;
  border: 1px solid var(--slate-200, #E2E8F0) !important;
}

/* 記事内の見出し */
.p-article h2,
.p-case__wrapper h2 {
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
  color: var(--slate-900, #0F172A) !important;
  border-bottom: 2px solid var(--blue-500, #0EA5E9) !important;
  padding-bottom: 8px !important;
  margin-bottom: 20px !important;
}

.p-article h3,
.p-case__wrapper h3 {
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
  color: var(--slate-800, #1E293B) !important;
}

/* 記事内の画像 */
.p-article img:not(.p-article__logo-img) {
  border-radius: var(--r-lg, 16px) !important;
  box-shadow: 0 2px 8px rgba(12,74,110,0.06) !important;
}

/* ============================================================
   ニュースページ品質向上
   ============================================================ */

/* ニュース本文 */
.l-main .l-container__inner p {
  font-family: var(--font-body) !important;
  font-size: 1.45rem !important;
  line-height: 1.85 !important;
  letter-spacing: 0.025em !important;
  color: var(--slate-700, #334155) !important;
}

.l-main .l-container__inner h2 {
  font-family: var(--font-body) !important;
  font-size: 2.0rem !important;
  font-weight: 700 !important;
  color: var(--slate-900, #0F172A) !important;
  letter-spacing: 0.02em !important;
  line-height: 1.4 !important;
  margin-bottom: 20px !important;
}

/* column クラスのテキスト */
.l-main .column {
  font-family: var(--font-body) !important;
  font-size: 1.45rem !important;
  line-height: 1.85 !important;
  letter-spacing: 0.025em !important;
  color: var(--slate-700, #334155) !important;
}

/* ============================================================
   お問い合わせセクション（各ページ下部に配置されているもの）
   ============================================================ */
.l-container .columns.is-multiline .c-heading--h3 {
  font-family: var(--font-body) !important;
  font-size: 2.0rem !important;
  font-weight: 700 !important;
  color: var(--slate-900, #0F172A) !important;
  letter-spacing: 0.02em !important;
}

.l-container .columns.is-multiline .c-heading--eng {
  font-family: var(--font-num) !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  color: var(--blue-500, #0EA5E9) !important;
}

.l-container .columns.is-multiline p {
  font-family: var(--font-body) !important;
  font-size: 1.4rem !important;
  line-height: 1.7 !important;
  color: var(--slate-600, #475569) !important;
}

.p-btn--l.p-btn--block {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(160deg, var(--accent-500, #F97316), var(--accent-600, #EA580C)) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  padding: 16px 40px !important;
  border-radius: var(--r-xl, 20px) !important;
  box-shadow: 0 4px 12px rgba(234,88,12,0.15), 0 12px 32px rgba(234,88,12,0.1) !important;
  text-decoration: none !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  border: none !important;
}

.p-btn--l.p-btn--block:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 16px rgba(234,88,12,0.2), 0 16px 40px rgba(234,88,12,0.18) !important;
  filter: brightness(1.04) !important;
}

/* ============================================================
   プライバシーポリシー品質向上
   ============================================================ */
.l-main .l-container__inner ol {
  counter-reset: item !important;
  padding-left: 0 !important;
}

.l-main .l-container__inner ol li {
  line-height: 1.8 !important;
  margin-bottom: 8px !important;
}

/* ============================================================
   サービス・派遣向けページ品質向上
   ============================================================ */
.l-section {
  padding: 64px 0 !important;
}

/* ============================================================
   新ヘッダー対応（site-header使用ページ）
   旧ヘッダーCSS を新ヘッダーにも適用
   ============================================================ */
.site-header {
  position: fixed !important;
  top: 12px !important;
  left: 12px !important;
  right: 12px !important;
  z-index: 100 !important;
  background: rgba(255,255,255,0.85) !important;
  backdrop-filter: blur(16px) saturate(1.3) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.3) !important;
  border: 1px solid rgba(255,255,255,0.5) !important;
  border-radius: var(--r-2xl, 28px) !important;
  box-shadow: var(--shadow-lg) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  padding: 0 !important;
}

.site-header.is-scrolled {
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  border-radius: 0 0 var(--r-xl, 20px) var(--r-xl, 20px) !important;
  border-color: rgba(255,255,255,0.3) !important;
  box-shadow: 0 4px 8px rgba(12,74,110,0.03), 0 16px 32px -6px rgba(12,74,110,0.1) !important;
  background: rgba(255,255,255,0.92) !important;
}

.site-header__inner {
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  height: 60px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.site-header__logo img { height: 26px !important; width: auto !important; }

.site-nav { display: flex !important; align-items: center !important; gap: 32px !important; }
.site-nav__list { display: flex !important; align-items: center !important; gap: 2px !important; list-style: none !important; margin: 0 !important; padding: 0 !important; }
.site-nav__link { display: block !important; padding: 6px 14px !important; font-size: 13px !important; font-weight: 500 !important; color: var(--slate-600, #475569) !important; border-radius: 10px !important; transition: all 0.15s !important; text-decoration: none !important; }
.site-nav__link:hover { color: var(--blue-700, #0369A1) !important; background: var(--blue-50, #F0F9FF) !important; }

.site-header__actions { display: flex !important; align-items: center !important; gap: 12px !important; }
.site-header__hamburger { display: none !important; }

/* site-footer（新ヘッダーページ用） */
.site-footer {
  background: var(--slate-950, #020617) !important;
  color: rgba(255,255,255,0.6) !important;
  padding-bottom: 0 !important;
}

.site-footer__top { padding: 48px 0 24px !important; border-bottom: 1px solid rgba(255,255,255,0.08) !important; }
.site-footer__nav ul { display: flex !important; flex-wrap: wrap !important; gap: 24px !important; list-style: none !important; padding: 0 !important; margin: 0 !important; }
.site-footer__nav a { font-size: 14px !important; color: rgba(255,255,255,0.65) !important; text-decoration: none !important; transition: color 0.15s !important; }
.site-footer__nav a:hover { color: #fff !important; }

.site-footer__services { padding: 24px 16px !important; background: #fff !important; border-radius: 8px 8px 0 0 !important; border-bottom: none !important; color: #334155 !important; }
.site-footer__services-title { display: block !important; font-size: 14px !important; font-weight: 700 !important; color: #334155 !important; margin-bottom: 12px !important; }
.site-footer__services-list { display: flex !important; flex-wrap: wrap !important; justify-content: space-between !important; list-style: none !important; padding: 0 !important; margin: 0 !important; }
.site-footer__services-list li { width: 48% !important; font-size: 13px !important; color: #475569 !important; line-height: 1.6 !important; margin-bottom: 16px !important; padding-bottom: 16px !important; border-bottom: 1px solid #E2E8F0 !important; }
.site-footer__services-list li:nth-last-child(-n+2) { border-bottom: none !important; margin-bottom: 0 !important; padding-bottom: 0 !important; }
.site-footer__services-list a { font-size: 13px !important; color: #0369A1 !important; text-decoration: none !important; word-break: break-all !important; overflow-wrap: anywhere !important; }
.site-footer__services-list a:hover { color: #075985 !important; }

.site-footer__bottom { display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 24px 16px !important; background: #fff !important; border-radius: 0 0 8px 8px !important; border-top: 1px solid #E2E8F0 !important; }
.site-footer__corp { display: flex !important; align-items: center !important; gap: 16px !important; }
.site-footer__corp img { height: 28px !important; width: auto !important; position: relative !important; }
.site-footer__corp > a { position: relative !important; }
.site-footer__corp p { font-size: 13px !important; color: #334155 !important; line-height: 1.6 !important; }
.site-footer__badges { position: relative !important; }
.site-footer__badges::before { content: "" !important; position: absolute !important; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; width: 180% !important; height: 200% !important; background: radial-gradient(ellipse, rgba(255,255,255,0.1) 0%, transparent 70%) !important; border-radius: 50% !important; pointer-events: none !important; }
.site-footer__badges img { width: 48px !important; height: 48px !important; position: relative !important; }

.site-footer__copyright { text-align: center !important; padding: 16px 0 !important; background: rgba(0,0,0,0.2) !important; }
.site-footer__copyright small { font-size: 13px !important; color: rgba(255,255,255,0.4) !important; }

/* sub-hero（新デザインページタイトル） */
.sub-hero {
  padding: 120px 0 48px !important;
  background: linear-gradient(135deg, var(--blue-900, #0C4A6E), var(--blue-950, #082F49)) !important;
  text-align: center !important;
}

.sub-hero__breadcrumb { font-size: 12px !important; color: rgba(255,255,255,0.4) !important; margin-bottom: 16px !important; }
.sub-hero__breadcrumb a { color: rgba(255,255,255,0.5) !important; text-decoration: none !important; }
.sub-hero__breadcrumb a:hover { color: rgba(255,255,255,0.8) !important; }
.sub-hero__breadcrumb span { margin: 0 6px !important; }

.sub-hero__eng { font-family: var(--font-num) !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: 0.15em !important; text-transform: uppercase !important; color: rgba(255,255,255,0.35) !important; margin-bottom: 8px !important; }
.sub-hero__title { font-family: var(--font-body) !important; font-size: 32px !important; font-weight: 700 !important; color: #fff !important; margin-bottom: 16px !important; }
.sub-hero__lead { font-size: 15px !important; color: rgba(255,255,255,0.6) !important; line-height: 1.8 !important; }

/* ============================================================
   レスポンシブ
   ============================================================ */
@media (max-width: 1024px) {
  .site-nav__list { display: none !important; }
  .site-header__hamburger { display: block !important; width: 40px !important; height: 40px !important; background: none !important; border: none !important; cursor: pointer !important; }
  .site-header__hamburger span { display: block !important; width: 20px !important; height: 2px !important; background: var(--slate-700, #334155) !important; margin: 0 auto !important; transition: all 0.25s !important; }
  .site-header__hamburger span:nth-child(1) { transform: translateY(-5px) !important; }
  .site-header__hamburger span:nth-child(3) { transform: translateY(5px) !important; }
  .site-header__hamburger.is-open span:nth-child(1) { transform: rotate(45deg) !important; }
  .site-header__hamburger.is-open span:nth-child(2) { opacity: 0 !important; }
  .site-header__hamburger.is-open span:nth-child(3) { transform: rotate(-45deg) !important; }

  .site-nav {
    position: fixed !important; top: 0 !important; right: -100% !important;
    width: 300px !important; height: 100vh !important; background: #fff !important;
    flex-direction: column !important; padding: 80px 24px 24px !important;
    box-shadow: -8px 0 32px rgba(0,0,0,0.1) !important; z-index: 100 !important;
    transition: right 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
    align-items: stretch !important;
  }
  .site-nav.is-open { right: 0 !important; }
  .site-nav.is-open .site-nav__list { display: flex !important; flex-direction: column !important; }
  .site-nav__link { font-size: 16px !important; padding: 12px 16px !important; border-bottom: 1px solid var(--slate-100, #F5F3F0) !important; border-radius: 0 !important; }
  .site-header__actions { flex-direction: column !important; width: 100% !important; }
}

@media (max-width: 768px) {
  .l-header,
  .l-header--not-top.l-header {
    top: 8px !important;
    left: 8px !important;
    right: 8px !important;
    border-radius: var(--r-xl, 20px) !important;
  }

  .l-header__inner {
    height: 52px !important;
    padding: 0 16px !important;
  }

  .site-header {
    top: 8px !important;
    left: 8px !important;
    right: 8px !important;
    border-radius: var(--r-xl, 20px) !important;
  }

  .site-header__inner {
    height: 52px !important;
    padding: 0 16px !important;
  }

  .l-main {
    padding-top: 68px !important;
  }

  .c-pagetitle {
    margin: 0 8px !important;
    padding: 48px 20px 36px !important;
  }

  .c-pagetitle__title {
    font-size: 22px !important;
  }

  .sub-hero {
    padding: 88px 0 36px !important;
  }

  .sub-hero__title {
    font-size: 24px !important;
  }

  footer .footer_nav ul {
    flex-direction: column !important;
    gap: 12px !important;
    text-align: center !important;
  }

  footer .footer_links .site_links {
    flex-direction: column !important;
    gap: 8px !important;
  }

  footer .footer_links .site_links li {
    width: 100% !important;
  }

  footer .footer_cont {
    flex-direction: column !important;
    text-align: center !important;
  }

  footer .corp {
    flex-direction: column !important;
  }

  .site-footer__nav ul { flex-direction: column !important; gap: 12px !important; }
  .site-footer__services-list { flex-direction: column !important; gap: 8px !important; }
  .site-footer__bottom { flex-direction: column !important; gap: 16px !important; text-align: center !important; }
  .site-footer__corp { flex-direction: column !important; }
}