@charset "utf-8";
/* このファイルはUTF-8のBOMなし(UTF-8N)で保存しています */

/**
 * SCSS Information
 * ===============================================================
 *
 * File name: _variables.scss
 * Summary:   変数定義用ファイル
 * Author:    CrEa Inc.
 *
 * -----------------------------------
*/

/* =01
// ========================================
// breakpoints
// ========================================
*/
/* $mq-breakpoints: (
  "xnarrow": 320px,
  "narrow": 640px,
  "medium": 768px,
  "tablet": 1024px,
  "wide": 1440px,
  "xwide": 1440px,
); */
:root {
  --width-narrow: 640px;
  --width-medium: 768px;
  --width-tablet: 1024px;
  --width-wide: 1280px;
  --width-xwide: 1440px;
}

/* =02
// ========================================
// width
// ========================================
*/
:root {
  --width-inner: 1280px;
}

/* =03
// ========================================
// color
// ========================================
*/
:root {
  --color-main: #345d27;
  --color-main-deep: #003c10;
  --color-sub: #00aad4;
  --color-sub-deep: #036eb8;
  --color-accent: #eb6100;
  --color-accent-deep: #bf1321;
  --color-accent-sub: #fff100;
  --color-text: #000;
  --color-text-light: #b3b3b3;
  --color-text-pale: #f5f5f5;
  --color-text-bright: #fff;
  --color-base: var(--color-main);
  --color-base-pale: #f5f5f5;
  --color-base-bright: #fff;
  --color-border: var(--color-main);
  --color-border-pale: #b3b3b3;
  --color-error: #e60012;

  --color-course1: #8b2559;
  --color-course1-light: #cc6882;
  --color-course2: #005f51;
  --color-course2-light: #00a3a3;
  --color-course3: #604c3f;
  --color-course3-light: #7a6a56;
  --color-course4: #004669;
  --color-course4-light: #60879f;
}

/* =04
// ========================================
// typography
// ========================================
*/
:root {
  --sans-serif-ja:
    "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo,
    sans-serif;
  --sans-serif-en: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
  --serif-ja:
    "Hiragino Mincho ProN", "Hiragino Mincho Pro", "YuMincho", "Yu Mincho",
    "MS PMincho", serif;
  --serif-en: "Times New Roman", serif;
}

/* =05
// ========================================
// layout
// ========================================
*/
:root {
  --col-max: 12; /* 何分割するか */
  --col-gap: 16px; /* カラム間のgapをpxにするか */
  --col-gap-narrow: 8px; /* カラム間のgap（狭） */
  --col-gap-wide: 40px; /* カラム間のgap（広） */
}

/* =06
// ========================================
// opacity
// ========================================
*/
:root {
  --opacity-hover: 0.5;
  --opacity-disabled: 0.3;
}

/* =07
// ========================================
// border-radius
// ========================================
*/
:root {
  --border-radius: 4px;
  --border-radius-small: 2px;
  --border-radius-large: 8px;
  --border-radius-round: 100vmax;
}

/* =07
// ========================================
// easing-function
// 参考: https://easings.net/ja
// ========================================
*/
:root {
  --easing-out-cubic: cubic-bezier(0.33, 1, 0.68, 1);
  --easing-out-back: cubic-bezier(0.34, 1.56, 0.64, 1);
}