@charset "UTF-8";

:root {
  /* Colors
  ================================================ */

  /** 文字色 */
  --color-text-lightest: #fff;
  --color-text-lighter: #f6f7fa;
  --color-text: #152a6d;
  --color-text-gray: #bcbcbc;
  --color-text-dark: #000;
  --color-text-hd: #fff;
  --color-text-rc: #f61a3c;
  --color-text-sa: #00f2fe;

  /** 背景色（共通） */
  --color-contrast-white: #fff;
  --color-contrast-dark: #000;

  /** 背景色（Holdings） */
  --color-hd-contrast-lightest: #0f74b3;
  --color-hd-contrast-lighter: #115495;
  --color-hd-contrast-light: #143b7e;
  --color-hd-contrast-dark: #152a6e;
  --color-hd-contrast-darker: #161f64;
  --color-hd-contrast-darkest: #171c61;

  /** 背景色（Recruitment） */
  --color-rc-contrast-light: #f61a3c;
  --color-rc-contrast-dark: #152a6d;

  /** 背景色（Sales） */
  --color-sa-contrast-light: #00f2fe;
  --color-sa-contrast-dark: #152a6d;

  /** 背景色（faq） */
  --color-faq-contrast: #f6f7fa;

  /** 背景色（front） */
  --color-front-sub-contrast: #f6f7fa;

  /** 背景色（about） */
  --color-about-contrast-light: #0d76a3;
  --color-about-contrast-dark: #171f63;

  /* Typography
  ================================================ */

  /* ベース設定 */
  --font-family-primary: "dnp-shuei-gothic-gin-std", sans-serif;
  --font-family-en: "din-2014", sans-serif;
  --line-height-base: 1.5em;
  --font-size-base: 1rem; /* 16px */

  /* 文字サイズ */
  --font-size-60: 60px;
  --font-size-36: 36px;
  --font-size-35: 35px;
  --font-size-32: 32px;
  --font-size-28: 28px;
  --font-size-25: 25px;
  --font-size-26: 26px;
  --font-size-24: 24px;
  --font-size-22: 22px;
  --font-size-20: 20px;
  --font-size-18: 18px;
  --font-size-16: 16px;
  --font-size-14: 14px;

  /** 行間 */
  --line-height-1: 1;
  --line-height-81: 81px;

  /** 太さ */
  --font-weight-700: 700;
  --font-weight-600: 600;

  /* Spacing
  ================================================ */
  --spacing-unit: 8px;
  --spacing-xs: calc(var(--spacing-unit) * 0.5); /* 4px */
  --spacing-sm: var(--spacing-unit); /* 8px */
  --spacing-md: calc(var(--spacing-unit) * 2); /* 16px */
  --spacing-lg: calc(var(--spacing-unit) * 4); /* 32px */
  --spacing-xl: calc(var(--spacing-unit) * 8); /* 64px */

  /* Layout / Components
  ================================================ */

  /* ブレークポイントの幅 */
  --breakpoint-sp: 599px;
  --breakpoint-tab: 1024px;

  /* ブレークポイントの閾値 */
  --media-sp-max: (max-width: 599px);
  --media-tab-min: (min-width: 600px);
  --media-pc-min: (min-width: 1025px);

  /* 角丸 */
  --border-radius-base: 10px;

  /* ボーダー */
  --border-width-base: 1px;

  /* Animation
  ================================================ */

  /* トランジション速度 */
  --transition-duration-base: 0.3s;
  --transition-duration-fast: 0.15s;

  /* 影の設定 */
  --shadow-light: 0 0.5rem 1rem rgb(0 0 0 / 10%);
}