@charset "utf-8";
/******************************************************
 base.scss
 *****************************************************/
/*==========================================
 全体
==========================================*/
:root {
  /* Common Colors */
  --black: #3c2f2f;
  --white: #fff;
  --red: #c21724;
  --red_hover: #af1520;
  --co_red: #dd0011;
  --gold: #a8864e;
  --gold_dark: #866b3e;
  --base: #fffdf4;
  --base_yellow: #fffae6;

  /* font */
  --font_mincho_family: "Zen Old Mincho", "ヒラギノ明朝 Pro",
    "Hiragino Mincho Pro", "游明朝体", "Yu Mincho", YuMincho, serif;
  --font_mincho_weight: 600;
  --font_mincho_style: normal;

  --font_gothic_family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3",
    "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium",
    "游ゴシック", "Yu Gothic", メイリオ, Meiryo, sans-serif;
}

html {
  height: 100%;
}

body {
  background-color: var(--base);
  color: var(--black);
  font-size: 1rem;
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "游ゴシック体",
    YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic",
    メイリオ, Meiryo, sans-serif;
  letter-spacing: 0.05rem;
  min-height: 100%;
  margin: 0;
}
@media screen and (min-width: 48rem) {
  body {
    font-size: 1rem;
  }
}

a {
  color: var(--red);
}
a:hover {
  color: var(--red_light);
}
a img {
  transition: 0.3s;
}
a img:hover {
  opacity: 0.7;
}

::-ms-reveal {
  display: none;
}

/*==========================================
 フォント関係
==========================================*/
/* font family */
.font_gothic {
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "游ゴシック体",
    YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic",
    メイリオ, Meiryo, sans-serif;
}

.font_mincho {
  font-family: var(--font_mincho_family);
  font-weight: var(--font_mincho_weight);
  font-style: var(--font_mincho_style);
}

/* font size */
.fs_12 {
  font-size: 0.75rem !important;
}
.fs_14 {
  font-size: 0.875rem !important;
}
.fs_16 {
  font-size: 1rem !important;
}
.fs_20 {
  font-size: 1.25rem !important;
}
.fs_24 {
  font-size: 1.5rem !important;
}
.fs_32 {
  font-size: 2rem !important;
}
.fs_40 {
  font-size: 2.5rem !important;
}
.fs_48 {
  font-size: 3rem !important;
}

@media screen and (min-width: 768px) {
  .fs_12--md {
    font-size: 0.75rem !important;
  }
  .fs_14--md {
    font-size: 0.875rem !important;
  }
  .fs_16--md {
    font-size: 1rem !important;
  }
  .fs_20--md {
    font-size: 1.25rem !important;
  }
  .fs_24--md {
    font-size: 1.5rem !important;
  }
  .fs_32--md {
    font-size: 2rem !important;
  }
  .fs_40--md {
    font-size: 2.5rem !important;
  }
  .fs_48--md {
    font-size: 3rem !important;
  }
}

@media screen and (min-width: 992px) {
  .fs_12--lg {
    font-size: 0.75rem !important;
  }
  .fs_14--lg {
    font-size: 0.875rem !important;
  }
  .fs_16--lg {
    font-size: 1rem !important;
  }
  .fs_20--lg {
    font-size: 1.25rem !important;
  }
  .fs_24--lg {
    font-size: 1.5rem !important;
  }
  .fs_32--lg {
    font-size: 2rem !important;
  }
  .fs_40--lg {
    font-size: 2.5rem !important;
  }
  .fs_48--lg {
    font-size: 3rem !important;
  }
}

/*==========================================
 背景
==========================================*/
.bc_base {
  background-color: var(--base);
}
.bc_base_yellow {
  background-color: var(--base_yellow);
}
.bc_red {
  background-color: var(--red);
}
.bc_white {
  background-color: #fff;
}

/*==========================================
 文字
==========================================*/
.text_center {
  text-align: center;
}

.text_red {
  color: var(--red);
}
.text_gold {
  color: var(--gold);
}
