@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Noto+Sans+JP:wght@400;500;700&display=swap");
body, form *, input, textarea, select, button, table *, th, td, fieldset, legend, option {
  font-family: Lato, "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Segoe UI", "游ゴシック", YuGothic, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, sans-serif;
}

html {
  overflow: auto;
}

body {
  background: #ff;
  color: #666;
  font-size: 16px;
  line-height: 1.4;
  overflow: hidden;
}

a {
  text-decoration: none;
}

header {
  width: 100%;
}

header h1 {
  margin: 0 auto;
  width: 1200px;
  position: relative;
}

.top_men {
  position: absolute;
  left: 150px;
  bottom: 54px;
}

.top_wmn {
  position: absolute;
  left: 400px;
  bottom: 54px;
}

@media screen and (max-width: 1250px) {
  .top_men {
    bottom: 9%;
    left: 12%;
    width: 18%;
    height: auto;
  }
  .top_wmn {
    bottom: 9%;
    left: 34%;
    width: 18%;
    height: auto;
  }
}

header h1 img.mv {
  width: 100%;
  height: auto;
}

div#wrapper {
  margin: 0 auto;
  width: 1200px;
}

div#wrapper figure {
  line-height: 0;
  text-align: center;
  width: 100%;
}

@media screen and (max-width: 1250px) {
  div#wrapper,
  header h1 {
    width: 100%;
  }
}

figure.fig1 {
  background: url("/sample2/img/bg01.png") no-repeat;
  -moz-background-size: 100%;
    -o-background-size: 100%;
       background-size: 100%;
}

figure.fig2 {
  background: url("/sample2/img/bg02.png") no-repeat;
  -moz-background-size: 100%;
    -o-background-size: 100%;
       background-size: 100%;
}

figure.fig4 {
  background: url("/sample2/img/bg04.png") no-repeat;
  -moz-background-size: 100%;
    -o-background-size: 100%;
       background-size: 100%;
  position: relative;
}

@media screen and (max-width: 1250px) {
  figure.fig1,
  figure.fig2,
  figure.fig4 {
    background: none;
  }
  figure.fig1 img,
  figure.fig2 img,
  figure.fig3 img,
  figure.fig4 img {
    width: 100%;
    height: auto;
  }
}

figure.fig4 img.btn01 {
  position: absolute;
  bottom: 355px;
  left: 130px;
}

figure.fig4 img.btn02 {
  position: absolute;
  bottom: 135px;
  left: 130px;
}

@media screen and (max-width: 1250px) {
  figure.fig4 img.btn01 {
    bottom: 20%;
    left: 4%;
    width: 90%;
    height: auto;
  }
  figure.fig4 img.btn02 {
    bottom: 8%;
    left: 4%;
    width: 90%;
    height: auto;
  }
}

nav {
  background: #81ccfb;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding: 15px 0;
  margin: 0 auto;
  width: 100%;
}

@media screen and (max-width: 1100px) {
  nav {
    width: 100%;
  }
}

nav ul {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flexbox;
  display: -moz-flexbox;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
     -moz-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

nav ul li {
  font-size: 14px;
  color: #fff;
}

@media screen and (max-width: 640px) {
  nav {
    padding: 5px 10px;
  }
  nav ul li {
    margin: 5px 0;
  }
}

footer {
  background: #004f81;
  padding: 20px 0;
  width: 100%;
}

footer p {
  color: #fff;
  font-size: 10px;
  line-height: 1.8;
  text-align: center;
}

/*# sourceMappingURL=style.css.map */