@charset "UTF-8";
section#chapter01::before {
  position: fixed;
  top: 0;
  left: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
}

section#chapter01::before, section#chapter01, section#chapter01 #title-fixed {
  height: 100vh;
  width: 100%;
}

@media screen and (min-width: 768px) and (orientation: landscape) {
  section#chapter01::before, section#chapter01, section#chapter01 #title-fixed {
    height: 60vw;
  }
}

@media screen and (min-width: 768px) and (orientation: portrait) {
  section#chapter01::before, section#chapter01, section#chapter01 #title-fixed {
    height: 60vh;
  }
}

@media screen and (min-width: 992px) {
  section#chapter01::before, section#chapter01, section#chapter01 #title-fixed {
    height: 60vh;
  }
}

/*
 * _variables.css
 *  CSS カスタムプロパティ定義（common.scssに@importする）
 */
:root {
  --blue: #007bff;
  --red: #dc3545;
  --green: #28a745;
  --black: #000000;
  --gray: #343a40;
  --white: #ffffff;
  --font-family-primary: "Roboto", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック体", YuGothic, "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  --font-family-secondary: "Roboto", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック体", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  --font-size-html: 62.5%;
  --font-size-body: calc(1rem + 0.5vw);
  --font-size-h1: 3em;
  --font-size-h2: 1.5em;
  --font-size-h3: 1.2em;
}

section#chapter01 {
  padding: 0;
}

section#chapter01 #title-fixed {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
}

section#chapter01 #canvas-container {
  margin-bottom: -10px;
  position: absolute;
  bottom: 0;
}

section#chapter01 #canvas-container canvas {
  width: 100%;
}

section#chapter02 {
  background-color: var(--white);
}

section#chapter02 > article#content02 table#info {
  margin-bottom: 0;
}

html.ie section#chapter01::before {
  background-image: url(../common/images/gym_0.jpg);
}

html:not(.ie) section#chapter01::before {
  background-image: url(../../common/images/gym_0.jpg);
}

html:not(.ie) section#chapter02::before {
  background-image: var(--white);
}