/* 配色変数。このファイルを読み込むページならどこでも共通ヘッダー／フッターを
   正しい色で挿入できるよう、ここに集約している */
:root {
  --color-yellow: #ffda15;
  --color-yellow-hover: #ffed4e;
  --color-black: #0d1528;
  --color-white: #fff;
  --color-gray: #888;

  /*--header-height: clamp(64px, 6vw, 88px);	header.php の updateHeaderHeight() で動的にヘッダ高さで変数値を更新する */
  --hero-space: clamp(4rem, 7vw, 6.5rem);   /* 64～104px */

  /* LPのpricingセクション移植に伴い追加した変数 */
  --color-whitegray: #e0e0e0;
  --radius-1: 6px;
  --radius-s: 4px;
  --ab-kikori: "ab-kikori", sans-serif;
  --fontsize: clamp(1.125rem, 1.034rem + 0.45vw, 1.375rem);

  /* LPのFAQセクション／FAQページ移植に伴い追加した変数 */
  --color-blue: #9f9beb;
  --ta-nasubi: "ta-nasubi", sans-serif;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: "Noto Sans JP", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background: var(--color-black);
  color: var(--color-white);
  line-height: 1.6;
}

/* タブレット・スマホでのみ改行する（LPのpricingセクション移植に伴い追加） */
.sp-only {
  display: none;
}

@media (max-width: 640px) {
  .sp-only {
    display: inline;
  }
}