.tkt-footer-services[data-astro-cid-7hxtcuph]{display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px;padding-bottom:22px;margin-bottom:24px;border-bottom:1px solid var(--tkt-dark-card-border)}.tkt-footer-services-label[data-astro-cid-7hxtcuph]{font-size:12px;font-weight:700;letter-spacing:0.08em;color:var(--tkt-on-dark-faint);white-space:nowrap}.tkt-footer-services-list[data-astro-cid-7hxtcuph]{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px;font-size:13px}.tkt-footer-services-list[data-astro-cid-7hxtcuph] a[data-astro-cid-7hxtcuph]{display:inline-flex;align-items:center;gap:6px;color:var(--tkt-on-dark);text-decoration:none;transition:color 0.2s}.tkt-footer-services-list[data-astro-cid-7hxtcuph] a[data-astro-cid-7hxtcuph]:hover{color:#fff}/* とことんシリーズLP共通スタイル。LpTokotonLayout からのみ読み込む(サイト全体には適用しない) */

.lp-tokoton {
  /* デザイントークン(構成はとことん労務 LP デザインデータ由来。
     プライマリーはサイト共通の緑 #168372 を基準に、各トーンを緑系へ再調整) */
  --tkt-primary: #168372;
  --tkt-primary-dark: #0f6858;
  --tkt-primary-shadow: #0b4d41;
  --tkt-ink: #173b36; /* 見出し・ダークセクション背景 */
  --tkt-ink-deep: #102925; /* フッター背景 */
  --tkt-accent: #c7623c; /* テラコッタ */
  --tkt-accent-dark: #b35633;
  --tkt-accent-shadow: #9c4a2b;
  --tkt-accent-soft: #e0a182; /* ダーク背景上のアクセント文字 */
  --tkt-bg: #f7f6f1;
  --tkt-bg-alt: #efeee8;
  --tkt-surface: #ffffff;
  --tkt-surface-soft: #e8f3f0; /* アイコンタイルなど淡いグリーン面 */
  --tkt-text: #24332f;
  --tkt-text-sub: #41554e;
  --tkt-text-mid: #4a5f58;
  --tkt-text-muted: #6b7d76;
  --tkt-text-faint: #8b9c96;
  --tkt-on-dark: #aecfc6; /* ダーク背景上の本文 */
  --tkt-on-dark-faint: #8fb5ab;
  --tkt-border: #dce3e0;
  --tkt-border-strong: #c9d2ce;
  --tkt-dark-card: #1f4c44; /* ダークセクション内のカード */
  --tkt-dark-card-border: #2e6156;
  --tkt-font: "Noto Sans JP", sans-serif;

  font-family: var(--tkt-font);
  background: var(--tkt-bg);
  color: var(--tkt-text);
  font-size: 16px;
  line-height: 1.9;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* 汎用リンク色。ボタン(.tkt-btn)には適用しない(バリアント側の color を優先させる) */
.lp-tokoton a:not(.tkt-btn) {
  color: var(--tkt-primary);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.lp-tokoton a:not(.tkt-btn):hover {
  color: var(--tkt-accent-dark);
}

/* ページ内アンカー(#cta)へのスクロールを滑らかにする。このCSSはとことんLPのページでのみ読み込まれる */
@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

/* レイアウト共通 */
.tkt-container {
  max-width: 1120px;
  margin-inline: auto;
  padding-inline: 24px;
}

.tkt-section {
  padding-block: 88px;
}

/* セクション見出し */
.tkt-eyebrow {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.2em;
  color: var(--tkt-text-faint);
}

.tkt-eyebrow--on-dark {
  color: var(--tkt-on-dark-faint);
}

.tkt-title {
  font-size: clamp(24px, 3.4vw, 34px);
  font-weight: 900;
  line-height: 1.6;
  letter-spacing: 0.02em;
  color: var(--tkt-ink);
  margin: 14px 0 0;
}

.tkt-title--on-dark {
  color: #fff;
}

/* ボタン */
.tkt-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: inherit;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1.6;
  border: none;
  border-radius: 10px;
  text-decoration: none;
  cursor: pointer;
  transition:
    background 0.2s,
    color 0.2s;
}

.tkt-btn:focus-visible {
  outline: 3px solid var(--tkt-accent);
  outline-offset: 3px;
}

/* サイズ */
.tkt-btn--sm {
  font-size: 14px;
  padding: 10px 20px;
  border-radius: 8px;
  letter-spacing: 0.04em;
  box-shadow: none;
}

.tkt-btn--md {
  font-size: 16px;
  padding: 15px 32px;
}

.tkt-btn--lg {
  font-size: 17px;
  padding: 16px 34px;
}

.tkt-btn--xl {
  font-size: 18px;
  padding: 18px 44px;
}

/* SPでは横パディング由来の折り返しを防ぐため、サイズを落として幅いっぱいの縦積みにする */
@media (max-width: 480px) {
  .tkt-btn--xl {
    font-size: 16px;
    padding: 16px 24px;
    width: 100%;
    max-width: 320px;
  }
}

/* バリアント */
.tkt-btn--primary {
  background: var(--tkt-primary);
  color: #fff;
  box-shadow: 0 2px 0 var(--tkt-primary-shadow);
}

.tkt-btn--primary:hover {
  background: var(--tkt-primary-dark);
  color: #fff;
}

.tkt-btn--primary-outline {
  background: var(--tkt-surface);
  color: var(--tkt-primary);
  border: 2px solid var(--tkt-primary);
}

.tkt-btn--primary-outline:hover {
  background: var(--tkt-surface-soft);
  color: var(--tkt-primary);
}

.tkt-btn--white {
  background: var(--tkt-surface);
  color: var(--tkt-primary);
}

.tkt-btn--white:hover {
  background: #e4efeb;
  color: var(--tkt-primary);
}

.tkt-btn--ghost-light {
  background: transparent;
  color: #fff;
  border: 2px solid var(--tkt-on-dark-faint);
}

.tkt-btn--ghost-light:hover {
  background: var(--tkt-dark-card);
  color: #fff;
}

.tkt-btn--accent {
  background: var(--tkt-accent);
  color: #fff;
  box-shadow: 0 2px 0 var(--tkt-accent-shadow);
}

.tkt-btn--accent:hover {
  background: var(--tkt-accent-dark);
  color: #fff;
}