@charset "UTF-8";
/* CSS Document */
/*■■■■■■ header sp ■■■■■■*/
/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
header
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */
.pdf a{
background-image: url(../images/icon_pdf.png);
background-repeat: no-repeat;
background-size: 14px 14px;
    background-position: right center;
    padding-right: 20px;
}
html,body {
  overflow-x: hidden;
}
body {
  overflow-x: hidden;
  width: 100%;
}
header {
  width: 100%;
  background-color: #FFF;
  position: fixed;
  z-index: 992;
  top: 0;
}
header h1 {
  height: 50px;
  width: auto;
}
header h1 img {
  height: 50px;
  width: auto;
}
#header {
  display: none;
}

.headersp {
  position: fixed;
  top: 0; z-index: 9999999;
  width: 100%;
  display: none;overflow-x: hidden !important;
}
.headersp .inner {
  position: relative;
}
.headersp .inner::before, .headersp .inner::after {
  content: "";
  clear: both;
  display: block;
}
/* logotype */
/* toggle */
.headersp .togglebtn {
  width: 50px;
  height: 50px;
  position: fixed;
  top: 0;
  right: 0;
  background-image: url("../../assets/images/headersp_togglebtn.png");
  background-position: top center;
  background-size: 50px 50px;
  z-index: 9999999999999999999;
  border-width: 0px;
  border-style: none;
}
.headersp .togglebtn.close {
  background-image: url("../../assets/images/headersp_togglebtnClose.png");
}
/* overlay */
.headersp .overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 99999999999999999999;
  width: 100%;
  height: 100%;
  padding: 0px 0;
  display: none;
}
.headersp .overlay.open {
  display: block;
}
.headersp .overlay.close {
  visibility: hidden;
}
/* global menu */
.headersp .overlay .gbmenu {}
.headersp .overlay .gbmenu .gbmenu-01 {
  padding-top: 50px;
  padding-left: 0;
}
.headersp .overlay .gbmenu .gbmenu-01 li {
  text-align: left;
  padding: 20px;
  width: 100%;
  list-style: none;
  background-color: #45227A;
  border-bottom: 1px solid #FFFFFF;
}
.headersp .overlay .gbmenu .gbmenu-01 li a {
  font-size: 0.9rem;
  color: #FFF;
  text-decoration: none;
}
.headersp .overlay .gbmenu .gbmenu-01 li img {
  width: 100%;
  height: auto;
}
.headersp .overlay .gbmenu .gbmenu-02 {
  padding-top: 0px;
  padding-left: 0vw;
  display: flex;
  flex-wrap: wrap;
}
.headersp .overlay .gbmenu .gbmenu-02 li {
  text-align: left;
  padding: 10px 20px;
  width: 50%;
  list-style: none;
  background-color: #e1dcea;
  border-bottom: 1px solid #FFFFFF;
  border-right: 1px solid #FFFFFF;
}
.headersp .overlay .gbmenu .gbmenu-02 li a {
  font-size: 0.9rem;
  text-decoration: none;
  color: #45227a;
}
.headersp .overlay .gbmenu .gbmenu-02 li img {
  width: 100%;
  height: auto;
}
/* submenu */
.headersp .submenu {
  text-align: center;
  margin-bottom: 20px;
}
.headersp .submenu ul {
  font-size: 0;
  letter-spacing: -1em;
  display: inline-block;
}
.headersp .submenu ul li {
  display: inline-block;
  margin: 0 10px;
}
.headersp .submenu ul li a {
  font-size: 10px;
  line-height: 1.6;
  color: #ffffff;
  font-weight: bold;
}
.headersp .submenu ul li a:hover {
  opacity: 0.8;
}
@media (max-width: 991px) {
  .headersp {
      width: 100%;
    display: block;
  }
}
.headersp-inner {
  width: 100%;
  overflow-x: hidden !important;
}
.pc-only {
  display: none;
}
.fadein {
  opacity: 0;
  transform: translate(0, 50px);
  transition: all 800ms;
}
.fadein.scroll {
  opacity: 1;
  transform: translate(0, 0);
}
.fadeinline {
  opacity: 0;
  transform: translate(0, 50px);
  transition: all 800ms;
}
.fadeinline.scroll {
  opacity: 1;
  transform: translate(0, 0);
}
.appear {
  opacity: 0;
  animation-name: appear;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}
@keyframes appear {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fadeUpstop {
  animation-name: fadeUpAnimeStop;
  opacity: 0;
  animation: fadeUpAnimeStop 0.5s ease-in-out forwards;
}
@keyframes fadeUpAnimeStop {
  0% {
    opacity: 0;
    transform: scale(2);
  }
  50% {
    transform: scale(0.8);
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
.fadeUpstop2 {
  animation-name: fadeUpAnimeStop2;
  opacity: 0;
  animation: fadeUpAnimeStop2 0.5s ease-in-out forwards;
}
@keyframes fadeUpAnimeStop2 {
  0% {
    opacity: 0;
    transform: scale(1);
  }
  50% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
.delay-time02 {
  animation-delay: 0.2s;
}
.delay-time04 {
  animation-delay: 0.4s;
}
.delay-time06 {
  animation-delay: 0.6s;
}
.delay-time08 {
  animation-delay: 0.8s;
}
.delay-time10 {
  animation-delay: 2s;
}
.delay-time12 {
  animation-delay: 3s;
}
.delay-time14 {
  animation-delay: 3.2s;
}
.delay-time16 {
  animation-delay: 3.4s;
}
.delay-time18 {
  animation-delay: 3.6s;
}
.delay-time20 {
  animation-delay: 3.8s;
}
.delay-time21 {
  animation-delay: 5s;
}
.delay-time22 {
  animation-delay: 5.5s;
}
.delay-time23 {
  animation-delay: 2.5s;
}

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
body
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */
article {
  background-color: #eafbfe;
}
.main-visual {
  position: absolute;
  background-image: url(../images/bg-sp.png);
  background-repeat: repeat-y;
  background-position: center top;
  background-size: cover;
  width: 100vw;
  height: 100%;
}
.flare {
  background-image: url("../images/flare-sp.png");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  width: 100vw;
  height: 100vh;
  position: absolute;
  top: 0px;
  left: -0vw;
  z-index: 1;
}
.chara {
  width: 90%;
  margin: 0 auto;
  position: relative;
  z-index: 3;
  padding-top: 190px;
}
.chara img {
  width: 100%;
  height: auto;
}
.contents {
  height: 90%;
}
.contents h1 {
  position: relative;
  width: 90%;
  margin: 0 auto 0 auto;
  z-index: 2;
  padding-top: 60px;
}
.contents h1 img {
  width: 100%;
  height: auto;
}
.contents .day {
  position: relative;
  max-width: 70%;
  z-index: 4;
  margin: 0 auto;
  padding-top: 190px;
}
.contents .day img {
  width: 100%;
  height: auto;
}
.top-navi {
  position: relative;
  z-index: 5;
}
.top-navi ul {}
.top-navi ul li {
  list-style: none;
}
.top-navi ul li .place {
  position: relative;
  max-width: 70%;
  z-index: 4;
  margin: 0 auto;
  padding-top: 10px;
}
.top-navi ul li .place img {
  width: 100%;
  height: auto;
}
.top-navi ul li .limit {
  position: relative;
  max-width: 70%;
  z-index: 4;
  margin: 0 auto;
  padding-top: 10px;
}
.top-navi ul li .limit img {
  width: 100%;
  height: auto;
}
.top-sp-gnavi {
  width: 90%;
  margin: 0 auto;
}
.top-sp-gnavi ul:after {
  content: "";
  display: block;
  clear: both;
}
.top-sp-gnavi ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.top-sp-gnavi ul li {
  width: 46%;
  margin: 2%;
}
.top-sp-gnavi ul li img {
  width: 100%;
  height: auto;
}
.text-animation {
  position: relative;
}
.nav-contents {
  width: 90%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  position: relative;
  z-index: 10;
}
.nav-contents .movie {
  width: 45%;
}
.nav-contents .movie img {
  width: 100%;
  height: auto;
}
.nav-contents .form {
  width: 45%;
}
.nav-contents .form img {
  width: 100%;
  height: auto;
}
.sch {display: none;}
.about {
  position: relative;
  z-index: 25;
}
.about .text-animation {
  top: 0px;
  zoom: 0.8;
}
.about-inner {}
.about-inner h2 {
  display: none;
}
.about-inner .detail {
  width: 60%;
  margin: 0 auto;
  padding-top: 30px;
}
.about-inner .detail img {
  width: 100%;
  height: auto;
}
.about-bg-001 {
  background-image: url(../images/about-bg-sp-001.png);
  background-repeat: no-repeat;
  background-position: center 20px;
  width: 100%;
  height: 50px;
  background-size: contain;
}
@media screen and (min-width: 560px) {.about-bg-001 {
  background-image: url(../images/about-bg-sp-001.png);
  background-repeat: no-repeat;
  background-position: center 20px;
  width: 100%;
  height: 50px;
  background-size: cover;
}}
.about-bg-002 {
  background-image: url(../images/about-bg-sp-002.png);
  background-repeat: repeat-y;
  background-position: center top;
  width: 100%;
  height: auto;
  background-size: contain;
}
.about-bg-003 {
  background-image: url(../images/about-bg-sp-003.png);
  background-repeat: no-repeat;
  background-position: center top;
  width: 100%;
  height: 80px;
  background-size: contain;
}
.about-inner .icon {
  width: 80px;
  position: absolute;
  bottom: 60px;
  margin: 0 auto 0px auto;
  top: 60px;
  left: 0px;
}
.about-inner .icon img {
  width: 100%;
  height: auto;
}
.about-inner .link {
  width: 150px;
  margin: 0px auto 0px auto;
  padding-top: 15px;
}
.about-inner .link img {
  width: 100%;
  height: auto;
}
.lab {
  position: relative;
  z-index: 25;
}
.lab .text-animation {
  top: 0px;
  zoom: 0.8;
}
.lab-inner {}
.lab-inner h2 {
  display: none;
}
.lab-inner .detail {
  width: 60%;
  margin: 0 auto;
  padding-top: 30px;
}
.lab-inner .detail img {
  width: 100%;
  height: auto;
}
.lab-bg-001 {
  background-image: url(../images/about-bg-sp-001.png);
  background-repeat: no-repeat;
  background-position: center 20px;
  width: 100%;
  height: 50px;
  background-size: contain;
}
.lab-bg-002 {
  background-image: url(../images/about-bg-sp-002.png);
  background-repeat: repeat-y;
  background-position: center top;
  width: 100%;
  height: auto;
  background-size: contain;
}
.lab-bg-003 {
  background-image: url(../images/about-bg-sp-003.png);
  background-repeat: no-repeat;
  background-position: center top;
  width: 100%;
  height: 80px;
  background-size: contain;
}
.lab-inner .icon {
  width: 80px;
  position: absolute;
  bottom: 60px;
  margin: 0 auto 0px auto;
  top: 60px;
  left: 0px;
}
.lab-inner .icon img {
  width: 100%;
  height: auto;
}
.lab-inner .link {
  width: 150px;
  margin: 0px auto 0px auto;
  padding-top: 15px;
}
.lab-inner .link img {
  width: 100%;
  height: auto;
}
.sns {
  position: relative;
  z-index: 25;
}
.sns-inner h2 {
  display: none;
}
.sns-inner {
  width: 100%;
  margin: 0 auto;
  background-color: #FFFFFF;
  padding: 15px 0;
}
.sns-block {
  width: 70%;
  margin: 0 auto;
  background-color: #FFFFFF;
  padding: 15px 0;
}
.sns-inner .detail {
  width: 100%;
}
.sns-inner .detail img {
  width: 100%;
  height: auto;
}

.sns-block .sns-instagram {width: 225px;display: block;margin: 20px auto;}
.sns-block .sns-instagram a:hover {opacity: 0.7;}
.sns-block .sns-instagram img {width: 100%;height: auto;}
.sns-block .sns-twitter {width: 225px;display: block;margin: 20px auto;}
.sns-block .sns-twitter img {width: 100%;height: auto;}
.contact {
  position: relative;
  z-index: 25;
  left: 0vw;
  padding: 20px 0;
}
.contact-inner {}
.contact-inner h2 {
  display: none;
}
.contact-inner .detail {
  width: 90%;
  position: relative;
  margin: 30px auto 0px auto;
  font-size: 0.9rem;
  line-height: 2rem;
  text-align: center;
}
.contact-inner .detail img {
  width: 100%;
  height: auto;
}
.contact-inner .icon {
  width: 150px;
  position: relative;
  bottom: 60px;
  margin: 0 auto -60px auto;
}
.contact-inner .icon img {
  width: 100%;
  height: auto;
}
.contact-inner .link {
  width: 150px;
  position: relative;
  margin: 20px auto 0px auto;
}
.contact-inner .link img {
  width: 100%;
  height: auto;
}
footer {
  width: 100%;
  height: 220px;
  position: relative;
  background-image: url(../images/foot_bg-sp.png);
  background-repeat: repeat-x;
  background-position: center bottom;
}
.footer-inner ul {
    width: 96%;
  text-align: center;
  margin: 0 auto;
  font-size: 0.8rem;
  position: relative;
  top: 150px;
}
.footer-inner ul li {
  display: inline-block;
  border-right: 1px solid #FFFFFF;
  padding: 0 15px
}
.footer-inner ul li a {
  color: #FFF;
  text-decoration: none;
}
.footer-inner ul li:first-child {
  border-left: 1px solid #FFFFFF;
}
.fadeIn {
  transition: 1s;
  opacity: 0;
}
.fadeIn.animated {
  opacity: 1;
}
.fadeIn-sp {
  transition: 0.5s;
  opacity: 0;
  transform: scale(1);
}
.fadeIn-sp.animated {
  opacity: 1;
  transform: scale(0.8);
}

/*----------------------------
scroll_up ｜下から上へ出現
----------------------------*/
.scroll_up {
  transition: 0.3s ease-in-out;
  transform: translateY(30px);
  opacity: 0;
  transform: scale(2);
}
.scroll_up.on {
  transform: translateY(0);
  opacity: 1.0;
  transform: scale(1);
}
/*----------------------------
scroll_left ｜左から出現
----------------------------*/
.scroll_left {
  -webkit-transition: 0.8s ease-in-out;
  -moz-transition: 0.8s ease-in-out;
  -o-transition: 0.8s ease-in-out;
  transition: 0.8s ease-in-out;
  transform: translateX(-30px);
  opacity: 0;
  filter: alpha(opacity=0);
  -moz-opacity: 0;
}
.scroll_left.on {
  opacity: 1.0;
  filter: alpha(opacity=100);
  -moz-opacity: 1.0;
  transform: translateX(0);
}
/*----------------------------
scroll_right ｜右から出現
----------------------------*/
.scroll_right {
  -webkit-transition: 0.8s ease-in-out;
  -moz-transition: 0.8s ease-in-out;
  -o-transition: 0.8s ease-in-out;
  transition: 0.8s ease-in-out;
  transform: translateX(30px);
  opacity: 0;
  filter: alpha(opacity=0);
  -moz-opacity: 0;
}
.scroll_right.on {
  opacity: 1.0;
  filter: alpha(opacity=100);
  -moz-opacity: 1.0;
  transform: translateX(0);
}