@charset "UTF-8";

/*
  Settings
---------------------------------------------- */
:root {
  --color-text-main: #000;
  --color-text-link: #3276d3;
  --color-text-light: #fff;
  --color-text-lightGray: #a8a8a8;
  --color-text-gray: #b4b4b4;
  --color-text-darkGray: #747474;
  --color-text-darkestGray: #656565;
  --color-bg-base: #fff;
  --color-bg-main: #f5f2ed;
  --color-bg-gray: #7b7b7b;
  --color-bg-offWhite: #fafafa;
  --color-bg-off: #eaeaea;
  --color-bg-red: #ff0000;
  --color-bg-darkOrange: #9b490f;
  --color-bg-footer: #f3ebd3;
  --color-ranking-1: #edab52;
  --color-ranking-2: #bcbcbc;
  --color-ranking-3: #b14c4c;
  --color-ranking-4: #beb19f;
  --color-ranking-5: #a09688;
  --color-accent-lightGreen: #6dba75;
  --color-accent-green: #159136;
  --color-accent-lightOrange: #ea9f6a;
  --color-accent-orange: #f67921;
  --color-accent-orange-rgb: 245, 88, 27;
  --color-accent-lightSalmon: #e8906d;
  --color-accent-salmon: #ed4f0f;
  --color-accent-blue: #84ccc9;
  --color-border-black: #000;
  --color-border-white: #fff;
  --color-border-lightGray: #ebebeb;
  --color-border-gray: #ccc;
}

/*
  Base
---------------------------------------------- */
html {
  box-sizing: border-box;
  height: 100%;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

body {
  height: 100%;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--color-text-main);
  background-color: var(--color-bg-base);
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

a {
  color: inherit;
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
strong {
  font-weight: bold;
}

input,
textarea {
  max-width: 100%;
  font-family: inherit;
  font-size: 100%;
}