@charset "UTF-8";
* {
  list-style: none;
  margin: 0px;
  padding: 0px;
  font-family: 'YuGothic','Yu Gothic','Hiragino Sans','Hiragino Kaku Gothic ProN','Meiryo',sans-serif;
  font-weight: 500; }

@media screen\0 {
  .iefont {
    font-family: 'Meiryo','メイリオ','ＭＳ Ｐゴシック',sans-serif; } }

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small,
strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label,
legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside,
canvas, details, figcaption, figure, footer, header, hgroup, menu, nav,
section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  background: transparent; }

article, aside, details, figcaption, figure, footer, header, hgroup,
menu, nav, section {
  display: block; }

body {
  background: #000; }

.wrapper {
  background: #fff;
  overflow: hidden; }
  .wrapper::after {
    position: fixed;
    content: '';
    z-index: 5;
    width: 100%;
    height: 100vh;
    left: 0;
    top: 0;
    background: #000;
    transition: 1s ease-out; }
  .wrapper.fadein::after {
    opacity: 0; }

.bg {
  position: fixed;
  width: 100%;
  height: 100vh;
  left: 0;
  top: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover; }
  .bg.bg1 {
    z-index: 3;
    background-image: url(../images/bg-1.jpg); }
  .bg.bg2 {
    z-index: 2;
    background-image: url(../images/bg-2.jpg); }
  .bg.bg3 {
    z-index: 1;
    background-image: url(../images/bg-3.jpg); }

.header {
  position: relative;
  z-index: 10;
  min-height: 100vh;
  padding-top: 40vh;
  box-sizing: border-box; }
  .header .pr {
    position: absolute;
    right: 3%;
    top: 10px;
    font-size: 12px;
    font-weight: bold;
    color: #fff; }
  .header h1 {
    width: 90%;
    max-width: 530px;
    margin: 0 auto 10vh;
    transform: translateY(-50%); }
    .header h1 img {
      position: relative;
      z-index: 10;
      display: block;
      width: 100%; }
    .header h1::before {
      position: absolute;
      z-index: 9;
      content: '';
      width: 100%;
      height: 24.5%;
      left: 0;
      top: 16.5%;
      background: rgba(0, 90, 160, 0.8); }
  .header p {
    width: 85%;
    margin: 0 auto;
    font-size: 14px;
    line-height: 1.8;
    color: #fff;
    font-weight: bold; }
    .header p br {
      display: none; }
  .header.fade h1 img {
    transition: 0.8s ease-in;
    opacity: 0; }
    .header.fade h1 img:nth-of-type(1) {
      transition-delay: 0.2s; }
    .header.fade h1 img:nth-of-type(2) {
      transition-delay: 0.9s; }
  .header.fade h1::before {
    transition: 0.4s 0.2s ease-out;
    transform: scaleX(0); }
  .header.fade p {
    transition: 0.8s 1.8s ease-in;
    opacity: 0; }
  .header.fadein h1 img {
    opacity: 1; }
  .header.fadein h1::before {
    transform: scaleX(1); }
  .header.fadein p {
    opacity: 1; }

.contents {
  position: relative;
  z-index: 10;
  box-sizing: border-box; }
  .contents h2 {
    margin-bottom: 10vh;
    text-align: center;
    font-size: 0; }
    .contents h2 img {
      display: inline-block;
      height: 8.6vw;
      max-height: 50px;
      margin-bottom: 2vw; }
    .contents h2.fade {
      transition: 0.8s ease-in;
      opacity: 0; }
    .contents h2.fadein {
      opacity: 1; }
  .contents .section {
    width: 80%;
    max-width: 670px;
    padding: 40px 5% 20px;
    margin: 0 auto 100px; }
    .contents .section h3 {
      position: relative;
      font-size: 0;
      margin-bottom: 30px; }
      .contents .section h3 img {
        display: inline-block;
        height: 6vw;
        max-height: 32px;
        margin-bottom: 2vw; }
      .contents .section h3::before {
        position: absolute;
        content: '';
        width: 8vw;
        height: 4px;
        left: -10vw;
        top: calc(3vw - 2px);
        background: #fff; }
    .contents .section p {
      margin: 0 auto 20px;
      font-size: 15px;
      line-height: 1.8;
      color: #fff;
      letter-spacing: -0.025em; }
    .contents .section .photo {
      width: 90%;
      margin: 40px auto; }
      .contents .section .photo img {
        display: block;
        width: 100%; }
      .contents .section .photo .caption {
        margin: 5px 0 0;
        font-size: 12px;
        line-height: 1.5; }
        .contents .section .photo .caption span {
          display: block;
          margin-top: 5px; }
          .contents .section .photo .caption span strong {
            font-size: 130%;
            font-weight: bold; }
      .contents .section .photo .caption + img {
        margin-top: 30px; }
    .contents .section.fade {
      transition: 0.5s ease-in;
      transform: translateY(30px);
      opacity: 0; }
    .contents .section.fadein {
      opacity: 1;
      transform: translateY(0); }
  .contents.contents-a {
    padding-top: 80vh; }
    .contents.contents-a .section {
      background-color: rgba(0, 90, 160, 0.9); }
  .contents.contents-b {
    padding-top: 40vh; }
    .contents.contents-b .section {
      margin-bottom: 0px;
      background-color: rgba(255, 255, 255, 0.8); }
      .contents.contents-b .section h3::before {
        background: #0071ba; }
      .contents.contents-b .section p {
        color: #333; }
  .contents.movie {
    padding-top: 40vh; }
    .contents.movie .section {
      position: relative;
      width: 90%;
      height: 0;
      padding: 50.625% 0 0; }
      .contents.movie .section iframe {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%; }

.information {
  position: relative;
  z-index: 10;
  background: #f5f5f5;
  padding: 60px 0;
  margin: 40px 0 0; }
  .information li {
    width: 90%;
    margin: 0 auto; }
    .information li img {
      display: block;
      width: 100%; }
    .information li p {
      margin-top: 10px;
      font-size: 12px;
      line-height: 1.5;
      color: #333; }
    .information li a {
      display: block;
      width: 85%;
      margin: 20px auto 0;
      padding: 15px 0;
      text-align: center;
      font-size: 16px;
      line-height: 1;
      font-weight: bold;
      color: #fff;
      background: #0071ba;
      border-radius: 10px;
      text-decoration: none;
      transition: 0.5s; }
      .information li a:active {
        background: #003e65; }
  .information li + li {
    margin-top: 60px; }

.bottomBanner {
  position: relative;
  z-index: 10;
  margin: 0 auto;
  padding: 40px 0 20px;
  background: #fff; }
  .bottomBanner a {
    display: block;
    width: 90%;
    max-width: 600px;
    margin: 0 auto; }
    .bottomBanner a img {
      display: block;
      width: 100%; }
      .bottomBanner a img.pc {
        display: none; }

.inquery {
  position: relative;
  z-index: 10;
  margin: 0 auto;
  padding: 40px 10% 0;
  background: #fff; }
  .inquery h2 {
    margin-bottom: 30px;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    color: #333; }
  .inquery h3 {
    text-align: center;
    line-height: 1.5; }
    .inquery h3 span {
      display: inline-block;
      font-size: 16px;
      font-weight: bold;
      color: #333; }
  .inquery a {
    display: block;
    width: 80%;
    margin: 20px auto;
    padding: 15px 0;
    text-align: center;
    font-size: 16px;
    line-height: 1;
    font-weight: bold;
    color: #fff;
    background: #0071ba;
    border-radius: 10px;
    text-decoration: none;
    transition: 0.5s; }
    .inquery a:active {
      background: #003e65; }
  .inquery p {
    text-align: center;
    font-size: 15px;
    line-height: 1.6;
    color: #333; }
    .inquery p span {
      font-size: 12px; }

footer {
  position: relative;
  z-index: 10;
  width: 100%;
  margin: 50px auto 0;
  padding: 20px 0;
  text-align: center;
  background: #000; }
  footer a {
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    text-decoration: none; }
  footer p {
    margin-top: 12px;
    font-size: 12px;
    color: #ccc; }
    footer p span {
      display: inline-block; }
    footer p span + span {
      margin-left: 0.5em; }

.fixedBanner {
  position: fixed;
  z-index: 20;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 18.6vw;
  background: #000;
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.5);
  opacity: 0;
  pointer-events: none;
  transition: 0.8s;
  transform: translateY(100%); }
  .fixedBanner.show {
    opacity: 1;
    pointer-events: auto;
    transform: none; }
  .fixedBanner img {
    display: block;
    width: 100%; }
    .fixedBanner img.pc {
      display: none; }

@media all and (min-width: 641px) {
  body, .bg {
    min-width: 1024px; }
  .header {
    padding-top: 40vh; }
    .header .pr {
      font-size: 14px; }
    .header h1 {
      margin: 0 auto 10vh; }
    .header p {
      text-align: center;
      font-size: 15px; }
      .header p br {
        display: inline; }
  .contents h2 img {
    margin-bottom: 10px; }
  .contents .section {
    position: relative;
    padding: 45px 65px 30px;
    margin: 0 auto 100px auto; }
    .contents .section h3 {
      margin-bottom: 30px; }
      .contents .section h3 img {
        margin-bottom: 10px; }
      .contents .section h3::before {
        width: 55px;
        left: -75px;
        top: 14px; }
    .contents .section p {
      margin: 0 auto 20px;
      font-size: 15px;
      line-height: 1.8;
      color: #fff;
      letter-spacing: -0.025em; }
    .contents .section .photo {
      position: absolute;
      margin: 0; }
      .contents .section .photo .caption span strong {
        font-size: 150%; }
    .contents .section.section1 {
      min-height: 580px; }
      .contents .section.section1 > p {
        padding-left: 288px; }
      .contents .section.section1 .photo {
        width: 240px;
        left: 65px;
        top: 163px; }
    .contents .section.section2 {
      min-height: 858px; }
      .contents .section.section2 > p {
        padding-right: 357px; }
      .contents .section.section2 .photo {
        width: 300px;
        right: 65px;
        top: 121px; }
    .contents .section.section3 {
      min-height: 612px; }
      .contents .section.section3 > p {
        padding-left: 288px; }
      .contents .section.section3 .photo {
        width: 240px;
        left: 65px;
        top: 121px; }
    .contents .section.section4 {
      min-height: 490px; }
      .contents .section.section4 > p {
        padding-right: 288px; }
      .contents .section.section4 .photo {
        width: 240px;
        right: 65px;
        top: 121px; }
    .contents .section.section5 {
      min-height: 558px; }
      .contents .section.section5 > p {
        padding-left: 377px; }
        .contents .section.section5 > p.w100 {
          padding: 0; }
      .contents .section.section5 .photo {
        width: 337px;
        left: 65px;
        top: 121px; }
  .contents.movie .section {
    width: 800px;
    max-width: 800px;
    height: 360px;
    padding: 0; }
    .contents.movie .section iframe {
      width: 640px;
      left: 80px; }
  .information {
    padding: 40px 0;
    margin: 40px 0 0; }
    .information ul {
      display: flex;
      justify-content: space-between;
      width: 880px;
      margin: 0 auto; }
    .information li {
      position: relative;
      width: 400px;
      margin: 0;
      padding-bottom: 70px; }
      .information li p {
        font-size: 13px; }
      .information li a {
        position: absolute;
        left: 75px;
        bottom: 0;
        width: 250px; }
        .information li a:hover {
          background: #003e65; }
    .information li + li {
      margin-top: 0; }
  .bottomBanner {
    padding: 60px 0 0; }
    .bottomBanner a {
      transition: 0.5s; }
      .bottomBanner a img.sp {
        display: none; }
      .bottomBanner a img.pc {
        display: block; }
      .bottomBanner a:hover {
        opacity: 0.7; }
  .inquery {
    padding: 60px 0; }
    .inquery h2 {
      font-size: 20px; }
    .inquery h3 span {
      font-size: 18px; }
    .inquery h3 span + span {
      margin-left: 0.5em; }
    .inquery a {
      width: 250px; }
      .inquery a:hover {
        background: #003e65; }
    .inquery p br:nth-of-type(1) {
      display: none; }
    .inquery p span {
      font-size: 13px; }
  footer {
    margin: 0 auto; }
  .fixedBanner {
    left: auto;
    right: 20px;
    bottom: 40px;
    width: 180px;
    height: 412px;
    background: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    border-radius: 15px;
    overflow: hidden;
    transform: none; }
    .fixedBanner:hover {
      box-shadow: 0 0 15px white; }
      .fixedBanner:hover img {
        opacity: 0.8; }
    .fixedBanner img {
      transition: 0.5s; }
      .fixedBanner img.sp {
        display: none; }
      .fixedBanner img.pc {
        display: block; } }

@media all and (min-width: 1168px) {
  .contents .section {
    margin: 0 auto 100px auto; } }

@media all and (min-width: 1300px) {
  .fixedBanner {
    right: calc(50% - 630px); } }

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