@charset "utf-8";

/* CSS Document */

/* ==============================================
   定数セクション - CSS Variables (Custom Properties)
   ============================================== */

:root {
  /* レイアウト定数 */
  --max-content-width: 1024px;
  --pc-content-padding: 30px;
  --sp-content-padding: 15px;

  /* カラーパレット */
  --color-black: #1e1f1f;
  --color-primary: #2e57a4;
  --color-white: #fff;
  --color-gray-light: #f4f4f4;

  /* フォントファミリー */
  --font-family: "Figtree", "Meiryo", sans-serif;

  /* フォントウェイト */
  --font-weight-regular: 400;
  --font-weight-bold: 700;

  /* フォントサイズ（PC） */
  --font-size-pc-base: 20px;
  --font-size-pc-note: 16px;

  /* フォントサイズ（SP） */
  --font-size-sp-base: 16px;
  --font-size-sp-note: 14px;
}

/* ==============================================
   ベーススタイル - 共通の初期設定
   ============================================== */

body {
  font-family: var(--font-family);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-sp-base);
  color: var(--color-black);
  background-color: var(--color-gray-light);
  margin: 0;
  padding: 0;
  width: 100%;
}

.privacy__section-signature {
  text-align: right;
  margin-top: -40px;
  margin-bottom: 40px;
}

.policy__section-title {
  margin-top: 40px;
  font-size: var(--font-size-pc-large);
  font-weight: var(--font-weight-bold);
  color: var(--color-primary);
  line-height: 1.5;
}

.policy__section-text {
  margin-top: -10px;
}

ul {
  list-style: none;
  padding-left: 0;
}

ol {
  padding-left: 20px;
}

/* ==============================================
   メディアクエリ - 画面幅ごとのスタイル
   ============================================== */

/* ~360px以下 */
@media (width < 360px) {
  .pc-only {
    display: none;
  }

  main {
    width: 100%;
    padding: 60px var(--sp-content-padding);
  }
}

/* 360 ~ */
@media (360px <= width) {
  .pc-only {
    display: none;
  }

  main {
    padding: 60px var(--sp-content-padding);
  }
}

/* 768 ~ */
@media (768px <= width) {
  .sp-only {
    display: none;
  }

  .pc-only {
    display: block;
  }

  body {
    font-size: var(--font-size-pc-base);
  }

  main {
    padding: 80px var(--pc-content-padding);
  }
}

/* 1024 ~ */
@media (1024px <= width) {
  /* 本来は不要な定義だが、空のブロックは stylelint でエラーになるため、ダミーとして残す。開発時に不要な定義を削除する。 */
  main {
    padding: 80px var(--pc-content-padding);
  }
}

/* 1280 */
@media (1280px <= width) {
  main {
    max-width: var(--max-content-width);
    margin: 0 auto;
  }
}

/* 1440 ~ */
@media (1440px <= width) {
  /* 本来は不要な定義だが、空のブロックは stylelint でエラーになるため、ダミーとして残す。開発時に不要な定義を削除する。 */
  main {
    max-width: var(--max-content-width);
  }
}
