@charset "UTF-8";
/* 
  css設定 @charsetが消されるsass仕様へのハック用コメントです。削除しないでください。新規作成時も必須！
 */
/*==================================================================================
 top
==================================================================================*/
.introduce-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 20000;
}

.introduce-modal .scenes {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 1.5s;
}

.introduce-modal .scenes.on {
  opacity: 1;
}

.introduce-modal .scene01 {
  background: url(../images/top/intro-bg.jpg) center;
  background-size: cover;
  z-index: 2;
}

.introduce-modal .scene01 .text {
  position: absolute;
  top: 50%;
  left: 3%;
  width: 94%;
  text-align: center;
  font-size: 44rem;
  color: #fff;
  transform: translateY(-50%);
}

.introduce-modal .scene01 .text.on .subs {
  margin: 0 3rem;
  opacity: 1;
  transform: scaleX(1);
  filter: blur(0px);
}

.introduce-modal .scene01 .subs {
  display: inline-block;
  margin: 0 3rem;
  filter: blur(0px);
  transform: scaleX(0.7);
  transition: opacity .8s ,filter .8s,margin .8s ,transform .8s;
  opacity: 0;
}

.introduce-modal .scene01 .sub1 {
  transition-delay: 0.06s;
}

.introduce-modal .scene01 .sub2 {
  transition-delay: 0.12s;
}

.introduce-modal .scene01 .sub3 {
  transition-delay: 0.18s;
}

.introduce-modal .scene01 .sub4 {
  transition-delay: 0.24s;
}

.introduce-modal .scene01 .sub5 {
  transition-delay: 0.3s;
}

.introduce-modal .scene01 .sub6 {
  transition-delay: 0.36s;
}

.introduce-modal .scene01 .sub7 {
  transition-delay: 0.42s;
}

.introduce-modal .scene01 .sub8 {
  transition-delay: 0.48s;
}

.introduce-modal .scene01 .sub9 {
  transition-delay: 0.54s;
}

.introduce-modal .scene01 .sub10 {
  transition-delay: 0.6s;
}

.introduce-modal .scene01 .sub11 {
  transition-delay: 0.66s;
}

.introduce-modal .scene01.off {
  opacity: 0;
  transition: opacity 2.3s 1.9s;
}

.introduce-modal .scene01.off .text.on .subs {
  margin: 0 3rem;
  opacity: 0;
  transform: scaleX(0.7);
  filter: blur(15px);
}

.introduce-modal .scene02 {
  z-index: 1;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.introduce-modal .scene02 .introuce-logos {
  display: block;
  margin: 12% auto 0;
  width: 22%;
}

.introduce-modal .scene02 .introuce-logos img {
  width: 100%;
}

.introduce-modal .scene02 .cond01 {
  padding-bottom: 125rem;
}

.introduce-modal .scene02 .cond02 {
  margin: 0 auto;
  width: 82%;
}

.introduce-modal .scene02.hide .introuce-logos {
  display: none;
}

.rolldown-subs {
  position: relative;
  overflow: hidden;
}

.rolldown-subs .subs {
  display: inline-block;
  transition: transform 1.5s;
  transform: translateY(-100%);
}

.rolldown-subs .sub1 {
  transition-delay: 0.04s;
}

.rolldown-subs .sub2 {
  transition-delay: 0.08s;
}

.rolldown-subs .sub3 {
  transition-delay: 0.12s;
}

.rolldown-subs .sub4 {
  transition-delay: 0.16s;
}

.rolldown-subs .sub5 {
  transition-delay: 0.2s;
}

.rolldown-subs .sub6 {
  transition-delay: 0.24s;
}

.rolldown-subs .sub7 {
  transition-delay: 0.28s;
}

.rolldown-subs .sub8 {
  transition-delay: 0.32s;
}

.rolldown-subs .sub9 {
  transition-delay: 0.36s;
}

.rolldown-subs .sub10 {
  transition-delay: 0.4s;
}

.rolldown-subs .sub11 {
  transition-delay: 0.44s;
}

.rolldown-subs .sub12 {
  transition-delay: 0.48s;
}

.rolldown-subs .sub13 {
  transition-delay: 0.52s;
}

.rolldown-subs .sub14 {
  transition-delay: 0.56s;
}

.rolldown-subs .sub15 {
  transition-delay: 0.6s;
}

.rolldown-subs .sub16 {
  transition-delay: 0.64s;
}

.rolldown-subs .sub17 {
  transition-delay: 0.68s;
}

.rolldown-subs .sub18 {
  transition-delay: 0.72s;
}

.rolldown-subs .sub19 {
  transition-delay: 0.76s;
}

.rolldown-subs .sub20 {
  transition-delay: 0.8s;
}

.rolldown-subs .sub21 {
  transition-delay: 0.84s;
}

.rolldown-subs .sub22 {
  transition-delay: 0.88s;
}

.rolldown-subs .sub23 {
  transition-delay: 0.92s;
}

.rolldown-subs .sub24 {
  transition-delay: 0.96s;
}

.rolldown-subs .sub25 {
  transition-delay: 1s;
}

.rolldown-subs .sub26 {
  transition-delay: 1.04s;
}

.rolldown-subs .sub27 {
  transition-delay: 1.08s;
}

.rolldown-subs .sub28 {
  transition-delay: 1.12s;
}

.rolldown-subs .sub29 {
  transition-delay: 1.16s;
}

.rolldown-subs .sub30 {
  transition-delay: 1.2s;
}

.rolldown-subs.on .subs {
  transform: translateY(0%);
}

#top .site-footer,
#top .pageAnnotationArea {
  position: relative;
  z-index: 2;
}

#top .main-visual {
  position: relative;
  overflow: hidden;
  height: 100vh;
  background: url(../images/top/mv01-bg.jpg) no-repeat center;
  background-size: cover;
}

#top .main-visual .mvs, #top .main-visual .mvs li {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#top .main-visual .mvs li {
  opacity: 0;
  transition: opacity 1.5s;
}

#top .main-visual .mvs li.on {
  opacity: 1;
}

#top .main-visual .mv01 {
  background: url(../images/top/mv01-bg.jpg) no-repeat center;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
}

#top .main-visual .mv01 .text {
  width: 60%;
}

#top .main-visual .mv02 {
  background: url(../images/top/mv02-01.jpg) no-repeat center;
  background-size: cover;
}

#top .main-visual .mv03 {
  background: url(../images/top/mv03-01.jpg) no-repeat center;
  background-size: cover;
}

#top .main-visual .mv03 .imgs {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../images/top/mv03-02.jpg) no-repeat center;
  background-size: cover;
  opacity: 0;
  transition: opacity 1.2s 2.3s;
}

#top .main-visual .mv03 .imgs img {
  opacity: 0;
}

#top .main-visual .mv03 .texts {
  position: absolute;
  opacity: 0;
}

#top .main-visual .mv03 .text01 {
  top: 49.2%;
  left: 44.7%;
  width: 4.1%;
  transition: opacity 1.2s 1.5s;
}

#top .main-visual .mv03 .text02 {
  top: 62.3%;
  transform: translateY(-50%);
  left: 33.3%;
  width: 22.3%;
  transition: opacity 1.2s 3.1s;
}

#top .main-visual .mv03.on .imgs {
  opacity: 1;
}

#top .main-visual .mv03.on .texts {
  opacity: 1;
}

#top .main-visual .mv04 {
  background: url(../images/top/mv04-01.jpg) no-repeat center bottom;
  background-size: cover;
}

#top .main-visual .mv04 .texts {
  position: absolute;
  bottom: 7%;
  right: 6%;
}

#top .main-visual .mv04 .text01 {
  display: flex;
  justify-content: left;
  align-items: end;
  padding-bottom: 18rem;
  opacity: 0;
}

#top .main-visual .mv04 .text01 span {
  display: inline-block;
  margin: 0 13em;
  transition: transform 0.8s, opacity 0.8s;
  opacity: 0;
}

#top .main-visual .mv04 .text01 .cond01 {
  width: 32rem;
  margin: 0 13em 0 0;
  transform: translateX(100%);
  transition: transform 0.8s 2.4s, opacity 0.8s 2.4s;
}

#top .main-visual .mv04 .text01 .cond02 {
  width: 47rem;
  transform: translateX(100%);
  transition: transform 0.8s 1.95s, opacity 0.8s 1.95s;
}

#top .main-visual .mv04 .text01 .cond03 {
  width: 47rem;
  transition: transform 0.8s 1.5s, opacity 0.8s 1.5s;
}

#top .main-visual .mv04 .text01 .cond04 {
  width: 24rem;
  transform: translateX(-100%);
  transition: transform 0.8s 1.95s, opacity 0.8s 1.95s;
}

#top .main-visual .mv04 .text01 .cond05 {
  width: 17rem;
  transform: translateX(-100%);
  transition: transform 0.8s 2.4s, opacity 0.8s 2.4s;
}

#top .main-visual .mv04 .text01 .cond06 {
  width: 20rem;
  transform: translateX(-100%);
  transition: transform 0.8s 2.85s, opacity 0.8s 2.85s;
}

#top .main-visual .mv04 .text02 {
  width: 440rem;
  opacity: 0;
  transition: transform 1.4s 3.2s,opacity 1.4s 3.2s;
}

#top .main-visual .mv04.on .text01 {
  opacity: 1;
}

#top .main-visual .mv04.on .text01 span {
  opacity: 1;
  transform: translateX(0%) !important;
}

#top .main-visual .mv04.on .text02 {
  opacity: 1;
}

#top .apeal {
  background: url(../images/top/apeal-bg.jpg) no-repeat center;
  background-size: cover;
  padding: 55rem 0 50rem;
}

#top .apeal .apeal01 {
  margin: 0 auto;
  max-width: 730rem;
  padding-bottom: 30rem;
}

#top .apeal .apeal02 {
  display: flex;
  justify-content: space-between;
}

#top .apeal .apeal02 li {
  width: 23.5%;
  background-color: #666666;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14rem;
  padding: 10rem 0;
}

#top .apeal .apeal02 li p {
  text-align: center;
  line-height: 1.8;
}

#top .information {
  padding: 160rem 0 160rem;
  background-color: #666666;
}

#top .information .wrap {
  box-sizing: border-box;
  padding: 40rem 50rem;
  background-color: #F1F2EE;
}

#top .information .info-box {
  display: flex;
  justify-content: space-between;
}

#top .information .header {
  color: #333333;
  width: calc(100% - 190rem);
}

#top .information .header .title {
  font-size: 12rem;
  line-height: 1.5;
  padding: 0 20rem 17rem;
}

#top .information .header .lead {
  font-size: 22rem;
  line-height: 1.5;
  padding: 0 20rem 17rem;
  border-bottom: 1px solid #333333;
  margin-bottom: 20rem;
}

#top .information .header .text {
  padding: 0 20rem;
  font-size: 14rem;
  line-height: 2.2;
}

#top .information .buttons {
  width: 160rem;
}

#top .information .buttons li + li {
  margin-top: 20rem;
}

#top .information .buttons a {
  display: block;
  padding: 30rem;
  background-color: #B43C00;
  color: #fff;
  text-align: center;
}

#top .information .buttons.button02 a {
  background-color: #363847;
}

#top .information .buttons .text01 {
  font-size: 16rem;
  line-height: 1.4;
  padding-bottom: 12rem;
  position: relative;
}

#top .information .buttons .text01::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 20rem;
  height: 1px;
  background-color: #fff;
  transition: width .5s;
  transform: translateX(-50%);
}

#top .information .buttons a:hover:after {
  width: 50rem;
}

#top .information .buttons .text02 {
  padding-top: 12rem;
  font-size: 12rem;
  line-height: 1.5;
}

#top .information .holiday {
  text-align: left;
  font-size: 14px;
  line-height: 2;
  color: #333;
  border: 1px solid;
  padding: 20px 14px;
  margin-top: 50px;
  margin-left: 20px;
}

#top .information .holiday span {
  font-weight: bold;
}

@media (max-width: 768px) {
  #top .information .holiday {
    margin-left: auto;
  }
}

#top .panels-wrap {
  position: relative;
  background: url(../images/common/navi-bg.jpg) top;
  background-size: 100% 100vh;
  height: 600vh;
  padding-bottom: 100vh;
}

#top .panels-wrap.on .panels {
  position: fixed;
}

#top .panels-wrap .panels {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  transform: translateY(110%);
}

#top .panels-wrap .panels .image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: url(../images/top/panel-position.jpg) no-repeat center bottom;
  background-size: cover;
  transition: transform 1.9s .9s ,opacity 1s .5s;
  opacity: 0;
}

@media (min-width: 1025px) {
  #top .panels-wrap .panels .image {
    transform: none !important;
  }
}

#top .panels-wrap .panels .text {
  position: absolute;
  top: 10%;
  left: 50%;
  font-size: 32rem;
  line-height: 1.8;
  text-align: center;
  text-shadow: 0px 0px 16rem #000,0px 0px 16rem #000;
  opacity: 0;
  transition: opacity 1.4s 1.5s;
}

#top .panels-wrap .panels .link {
  position: absolute;
  left: 50%;
  bottom: 5%;
  transform: translateX(-50%);
  width: 90%;
  max-width: 230rem;
  opacity: 0;
  transition: opacity 1.4s 1.7s;
}

#top .panels-wrap .panels .link a {
  position: relative;
  line-height: 1;
  padding-bottom: 25rem;
}

#top .panels-wrap .panels .link a::after, #top .panels-wrap .panels .link a::before {
  content: "";
  position: absolute;
  top: 0rem;
  right: 20rem;
  width: 12rem;
  height: 12rem;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: translateX(0) rotate(45deg);
  animation: arrows 1.9s infinite;
}

#top .panels-wrap .panels .link a::before {
  right: 40rem;
}

@keyframes arrows {
  0% {
    transform: translateX(0) rotate(45deg);
  }
  50% {
    transform: translateX(20rem) rotate(45deg);
  }
  100% {
    transform: translateX(20rem) rotate(45deg);
  }
}

#top .panels-wrap .panels .link .lines {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.6);
  overflow: hidden;
}

@keyframes lines {
  0% {
    transform: translateX(-100%);
  }
  40% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(100%);
  }
}

#top .panels-wrap .panels .link .lines:after {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 1px;
  background-color: #fff;
  top: 0;
  left: 0;
  animation: lines 1.9s linear infinite;
}

#top .panels-wrap .panels .link .line01:after {
  animation-delay: .05s;
}

#top .panels-wrap .panels .link .line02 {
  margin-bottom: 2rem;
}

#top .panels-wrap .panels.on {
  transform: translateY(0);
}

#top .panels-wrap .panels.on .image {
  opacity: 1;
}

#top .panels-wrap .panels.on .link {
  opacity: 1;
}

#top .panels-wrap .panels.on .title {
  opacity: 1;
}

#top .panels-wrap .panels.on .title .subs img {
  opacity: 1;
  transform: translateY(0);
}

#top .panels-wrap .panels.on .title .sub01 img {
  transition: transform .3s,opacity .15s;
}

#top .panels-wrap .panels.on .title .sub02 img {
  transition: transform .3s .15s,opacity .15s .15s;
}

#top .panels-wrap .panels.on .title .sub03 img {
  transition: transform .3s .3s,opacity .15s .3s;
}

#top .panels-wrap .panels.on .title .sub04 img {
  transition: transform .3s .45s,opacity .15s .45s;
}

#top .panels-wrap .panels.on .title .sub05 img {
  transition: transform .3s .6s,opacity .15s .6s;
}

#top .panels-wrap .panels.on .title .sub06 img {
  transition: transform .3s .75s,opacity .15s .75s;
}

#top .panels-wrap .panels.on .title .sub07 img {
  transition: transform .3s .9s,opacity .15s .9s;
}

#top .panels-wrap .panels.on .title .sub08 img {
  transition: transform .3s 1.05s,opacity .15s 1.05s;
}

#top .panels-wrap .panels.on .text {
  opacity: 1;
}

#top .panels-wrap .panels.up-out, #top .panels-wrap .panels.down-out {
  z-index: 2;
  opacity: 0;
  transition: transform 1.2s , opacity .8s;
}

#top .panels-wrap .panels.up-out {
  transform: translateY(100%);
}

#top .panels-wrap .panels.down-out {
  transform: translateY(-100%);
}

#top .panels-wrap .panels .title {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  opacity: 0;
  transition: opacity 1.4s;
}

#top .panels-wrap .panels .title span {
  display: block;
  margin: 20rem 0;
}

#top .panels-wrap .panels .title .subs img {
  opacity: 0;
  transition: transform 1s;
  transition-timing-function: linear !important;
  transform: translateY(-30rem);
}

#top .panels-wrap .panels .title .sub01 img {
  transform: translateY(-40rem);
}

#top .panels-wrap .panels .title .sub02 img {
  transform: translateY(-40rem);
}

#top .panels-wrap .panels .title .sub03 img {
  transform: translateY(-40rem);
}

#top .panels-wrap .panels .title .sub04 img {
  transform: translateY(-40rem);
}

#top .panels-wrap .panels .title .sub05 img {
  transform: translateY(-40rem);
}

#top .panels-wrap .panels .title .sub06 img {
  transform: translateY(-40rem);
}

#top .panels-wrap .panels .title .sub07 img {
  transform: translateY(-40rem);
}

#top .panels-wrap .panels .title .sub08 img {
  transform: translateY(-40rem);
}

#top .panels-wrap .panels .title .a {
  width: 38rem;
}

#top .panels-wrap .panels .title .c {
  width: 40rem;
}

#top .panels-wrap .panels .title .e {
  width: 42rem;
}

#top .panels-wrap .panels .title .i {
  width: 63rem;
}

#top .panels-wrap .panels .title .l {
  width: 69rem;
}

#top .panels-wrap .panels .title .n {
  width: 38rem;
}

#top .panels-wrap .panels .title .s {
  width: 38rem;
}

#top .panels-wrap .panels .title .r {
  width: 38rem;
}

#top .panels-wrap .panels .title .o {
  width: 38rem;
}

#top .panels-wrap .panels .title .t {
  width: 44rem;
}

#top .panels-wrap .panels.residence .text {
  top: 10%;
  left: 67%;
}

#top .panels-wrap .panels.residence .image {
  background-image: url(../images/top/panel-residence.jpg);
}

#top .panels-wrap .panels.location .text {
  top: 19%;
  transform: translateX(-50%);
}

#top .panels-wrap .panels.location .image {
  background-image: url(../images/top/panel-location.jpg);
}

#top .panels-wrap .panels.plan .text {
  top: 19%;
  transform: translateX(-50%);
}

#top .panels-wrap .panels.plan .image {
  background-image: url(../images/top/panel-plan.jpg);
}

#top .panels-wrap .panels.access .text {
  top: 19%;
  transform: translateX(-50%);
}

#top .panels-wrap .panels.access .image {
  background-image: url(../images/top/panel-access.jpg);
}

#top .panels-wrap .panels.brand .text {
  top: 19%;
  transform: translateX(-50%);
}

#top .panels-wrap .panels.brand .image {
  background-image: url(../images/top/panel-brand.jpg);
}

#top .pageAnnotationArea {
  z-index: 11;
}

#top .site-footer {
  z-index: 11;
}

@media (max-width: 768px) {
  #top {
    padding-bottom: 0;
  }
  #top .main-visual {
    background-image: url(../images/top/mv01-bg-sp.jpg);
    overflow: hidden;
  }
  #top .main-visual .mv01 {
    background-image: url(../images/top/mv01-bg-sp.jpg);
  }
  #top .main-visual .mv01 .text {
    width: 80%;
  }
  #top .main-visual .mv02 {
    background-image: url(../images/top/mv02-01-sp.jpg);
  }
  #top .main-visual .mv03 {
    background-position-x: left 57%;
  }
  #top .main-visual .mv03 .img01 {
    background-position-x: left 57%;
  }
  #top .main-visual .mv03 .text01 {
    top: 51.2%;
    left: 14.7%;
    width: 13.6%;
  }
  #top .main-visual .mv03 .text02 {
    top: 62%;
    transform: translateY(-50%);
    left: 4.3%;
    width: 43.3%;
  }
  #top .main-visual .mv04 .imgs {
    position: absolute;
    top: 0;
    right: 0;
    width: 270vw;
    height: 100%;
    background: url(../images/top/mv04-01.jpg) no-repeat center bottom;
    background-size: cover;
    transition: transform 3.5s 1.5s;
    transform: translateX(0vw);
    background-position-x: right 40%;
  }
  #top .main-visual .mv04 .texts {
    bottom: auto;
    top: 12%;
    right: 9%;
  }
  #top .main-visual .mv04 .text01 .cond01 {
    width: 19.2rem;
    margin: 0 11em 0 0;
    transform: translateX(100%);
    transition: transform 0.8s 5.95s, opacity 0.8s 6.4s;
  }
  #top .main-visual .mv04 .text01 .cond02 {
    width: 28.2rem;
    transform: translateX(100%);
    transition: transform 0.8s 5.95s, opacity 0.8s 5.95s;
  }
  #top .main-visual .mv04 .text01 .cond03 {
    width: 28.2rem;
    transition: transform 0.8s 5.5s, opacity 0.8s 5.5s;
  }
  #top .main-visual .mv04 .text01 .cond04 {
    width: 14.4rem;
    transform: translateX(-100%);
    transition: transform 0.8s 5.95s, opacity 0.8s 5.95s;
  }
  #top .main-visual .mv04 .text01 .cond05 {
    width: 10.2rem;
    transform: translateX(-100%);
    transition: transform 0.8s 6.4s, opacity 0.8s 6.4s;
  }
  #top .main-visual .mv04 .text01 .cond06 {
    width: 12rem;
    transform: translateX(-100%);
    transition: transform 0.8s 6.85s, opacity 0.8s 6.85s;
  }
  #top .main-visual .mv04 .text02 {
    width: 300rem;
    transition-delay: 7.3s;
    filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.8));
  }
  #top .main-visual .mv04.on .imgs {
    transform: translateX(148vw);
  }
  #top .apeal {
    background-image: url(../images/top/apeal-bg-sp.jpg);
    padding: 45rem 0 30rem;
  }
  #top .apeal .apeal01 {
    padding-bottom: 25rem;
  }
  #top .apeal .apeal02 {
    display: block;
  }
  #top .apeal .apeal02 li {
    width: auto;
    font-size: 16rem;
    padding: 10rem 5%;
    margin-bottom: 10rem;
    min-height: 40rem;
  }
  #top .information {
    padding: 60rem 0 60rem;
  }
  #top .information .wrap {
    padding: 70rem 20rem 40rem;
    display: block;
  }
  #top .information .info-box {
    display: block;
  }
  #top .information .header {
    width: auto;
    text-align: center;
    padding-bottom: 40rem;
  }
  #top .information .header .title {
    font-size: 18rem;
    padding: 0 20rem 37rem;
  }
  #top .information .header .lead {
    padding: 0 20rem 17rem;
    border-bottom: 1px solid #333333;
    margin-bottom: 20rem;
  }
  #top .information .header .text {
    padding: 0 20rem;
    font-size: 14rem;
    line-height: 2.2;
  }
  #top .information .buttons {
    width: auto;
  }
  #top .information .buttons a {
    padding: 20rem;
  }
  #top .information .buttons .text01 {
    font-size: 16rem;
    padding-bottom: 12rem;
  }
  #top .information .buttons .text02 {
    padding-top: 12rem;
    font-size: 12rem;
    line-height: 1.5;
  }
  #top .information .buttons .text02 br {
    display: none;
  }
  #top .panels-wrap {
    background-image: url(../images/common/navi-bg-sp.jpg);
    background-size: 100% auto;
    background-repeat: repeat;
    height: 9900vh;
    height: 1500vh;
  }
  #top .panels-wrap .panels .image {
    transition: transform 2.6s ,opacity 1s .5s;
    transition: opacity 1s .5s;
    background-position: right bottom;
    background-image: url(../images/top/panels-position-sp.jpg);
    height: 100vh;
  }
  #top .panels-wrap .panels .image {
    width: 140vw;
  }
  #top .panels-wrap .panels .image .caption {
    bottom: 44px;
  }
  #top .panels-wrap .panels .text {
    font-size: 22rem;
    transform: none;
    left: 80rem;
  }
  #top .panels-wrap .panels .link {
    bottom: 135rem;
    width: 40%;
  }
  #top .panels-wrap .panels .title span {
    display: block;
  }
  #top .panels-wrap .panels.position .caption {
    right: 154rem;
  }
  #top .panels-wrap .panels.residence .text {
    top: 10%;
    left: 80rem;
  }
  #top .panels-wrap .panels.residence .image {
    width: 300vw;
  }
  #top .panels-wrap .panels.residence .caption {
    right: 425rem;
  }
  #top .panels-wrap .panels.location .text {
    top: 10%;
    transform: translateX(0%);
  }
  #top .panels-wrap .panels.location .image {
    background-image: url(../images/top/panel-location-sp.jpg);
    width: 100vw;
  }
  #top .panels-wrap .panels.location.on .image {
    transform: translateX(-100vw);
    transform: translateX(0vw);
  }
  #top .panels-wrap .panels.plan .text {
    top: 10%;
    transform: translateX(0%);
  }
  #top .panels-wrap .panels.plan .image {
    width: 200vw;
  }
  #top .panels-wrap .panels.plan .caption {
    right: 160rem;
  }
  #top .panels-wrap .panels.access .text {
    top: 10%;
    transform: translateX(0%);
  }
  #top .panels-wrap .panels.access .image {
    background-image: url(../images/top/panel-access-sp.jpg);
    width: 100vw;
  }
  #top .panels-wrap .panels.access.on .image {
    transform: translateX(-90vw);
    transform: translateX(0vw);
  }
  #top .panels-wrap .panels.brand .text {
    top: 10%;
    transform: translateX(0%);
  }
  #top .panels-wrap .panels.brand .image {
    width: 300vw;
  }
  #top .panels-wrap .panels.brand .caption {
    right: 420rem;
  }
}

/*==================================================================================
 top-sp
==================================================================================*/
@media (max-width: 768px) {
  .introduce-modal .scene01 {
    background-image: url(../images/top/intro-bg-sp.jpg);
  }
  .introduce-modal .scene01 .text {
    font-size: 23rem;
    line-height: 1.5;
  }
  .introduce-modal .scene02 {
    z-index: 1;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .introduce-modal .scene02 .introuce-logos {
    display: block;
    margin-top: 29%;
    width: 60%;
  }
  .introduce-modal .scene02 .introuce-logos li.cond01 {
    padding-bottom: 100rem;
  }
  .introduce-modal .scene02 .introuce-logos img {
    width: 100%;
  }
}

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