@keyframes showImg {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes hideImg {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes showTranslate {
  0% {
    transform: translate3d(40px, 0, 0);
  }
  100% {
    transform: translate3d(0px, 0, 0);
  }
}
@keyframes hideTranslate {
  0% {
    transform: translate3d(0px, 0, 0);
  }
  100% {
    transform: translate3d(-40px, 0, 0);
  }
}
#key .slide-fade2 .slide {
  animation-duration: 7s;
  animation-delay: 0s;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
  animation-iteration-count: 1;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  opacity: 0;
}
#key .slide-fade2 .slide:nth-child(1) {
  opacity: 1;
  z-index: 1;
}
#key .slide-fade2 .slide * {
  height: inherit;
}
#key .slide-fade2 .slide .slide-img {
  transform: scale(1.25);
}
#key .slide-fade2 .slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
#key .slide-fade2 .slide.active {
  animation-name: showImg;
  z-index: 2;
}
#key .slide-fade2 .slide.active .slider-inner {
  animation: showTranslate 7s linear forwards;
}
#key .slide-fade2 .slide.prev {
  animation-name: hideImg;
  z-index: 2;
}
#key .slide-fade2 .slide.prev .slider-inner {
  animation: hideTranslate 7s linear forwards;
}
@media only screen and (min-width: 768px) {
  #key .slide-fade2 .slide .slide-img {
    transform: scale(1.15);
  }
}

#rss {
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.8);
  padding: 8vw 6%;
  color: #fff;
  position: absolute;
  top: 0px;
  right: 0px;
  width: 100%;
  z-index: 3;
}
#rss .rss-row {
  align-items: center;
}
#rss h2 {
  font-size: 6vw;
}
#rss .rss-btn a {
  text-decoration: underline;
  text-underline-offset: 4px;
}
#rss #feed {
  margin: 3vw 0px 0px;
}
#rss #feed dl {
  display: flex;
  justify-content: space-between;
  line-height: 1.5;
  letter-spacing: 0;
}
#rss #feed dl dt {
  width: 30%;
  font-size: 3vw;
  color: #9ea29c;
}
#rss #feed dl dd {
  width: 70%;
}
#rss #feed dl dd a:hover {
  text-decoration: underline;
}
@media only screen and (min-width: 768px) {
  #rss {
    width: 460px;
    top: -115px;
    padding: 18px 40px 23px;
  }
  #rss h2 {
    font-size: 24px;
  }
  #rss .rss-btn a {
    font-size: 15px;
  }
  #rss .rss-btn a:hover {
    text-decoration: none;
  }
  #rss #feed {
    margin: 15px 0px 0px;
  }
  #rss #feed dl {
    font-size: 15px;
    line-height: 24px;
  }
  #rss #feed dl dt {
    width: 90px;
    font-size: 13px;
  }
  #rss #feed dl dd {
    width: calc(100% - 90px);
  }
}

#sec1 {
  position: relative;
  background: url("../img/index/sec1_deco1.png") no-repeat top 0% right/50%, url("../img/index/sec1_deco2.png") no-repeat top 46% left/65%, url("../img/index/sec1_bg_sp.jpg") no-repeat bottom center/100%;
  padding: 36vw 0px 82vw;
}
#sec1 .sec1-ttl {
  margin: 0px auto 20vw;
  letter-spacing: 0.15em;
  height: 120vw;
}
#sec1 .sec1-ttl .ttl1 {
  font-size: 6.5vw;
  line-height: 2;
  margin: 0px 3%;
  position: relative;
}
#sec1 .sec1-ttl .ttl1 i {
  display: inline-block;
  margin-top: 36vw;
}
#sec1 .sec1-ttl .ttl1::before {
  content: "";
  position: absolute;
  top: 55%;
  left: 26%;
  width: 1px;
  height: 18vw;
  background: #000;
}
#sec1 .sec1-ttl .ttl2 {
  margin: 28vw 3% 0px;
  font-size: 10vw;
  line-height: 1.6;
}
#sec1 .sec1-ttl .ttl2 span {
  font-size: 7vw;
}
#sec1 .sec1-ttl .ttl2 i {
  display: inline-block;
  margin-top: 16vw;
}
#sec1 .sec1-txt p + p {
  margin: 6vw 0px 0px;
}
@media only screen and (min-width: 768px) {
  #sec1 {
    background-size: auto, auto, 100%;
    background-position: top right, top 455px left, bottom center;
    padding: 184px 0px 681px;
  }
  #sec1 .sec1-ttl {
    margin: 0px auto 114px;
    height: 610px;
  }
  #sec1 .sec1-ttl .ttl1 {
    font-size: 34px;
    line-height: 70px;
    margin: 0px 70px;
  }
  #sec1 .sec1-ttl .ttl1 i {
    margin-top: 190px;
  }
  #sec1 .sec1-ttl .ttl1::before {
    top: 355px;
    left: 36px;
    height: 105px;
  }
  #sec1 .sec1-ttl .ttl2 {
    margin: 138px 25px 0px;
    font-size: 52px;
    line-height: 74px;
  }
  #sec1 .sec1-ttl .ttl2 span {
    font-size: 38px;
  }
  #sec1 .sec1-ttl .ttl2 i {
    margin-top: 98px;
  }
  #sec1 .sec1-txt {
    margin: 0px auto;
    height: 390px;
  }
  #sec1 .sec1-txt p + p {
    margin: 0px 25px;
  }
}

#sec2 {
  position: relative;
  padding: 32vw 0px 0px;
}
#sec2 h2 {
  font-size: 7vw;
  margin: 0px auto 12vw;
  height: 60vw;
}
#sec2 .sec2-img1 {
  width: 65%;
  margin: 0px 0px 0px -5%;
}
#sec2 .sec2-img2 {
  width: 30%;
  margin: -24vw 0px 10vw auto;
}
#sec2 .sec2-box1 {
  width: 85%;
  margin: 0px auto;
}
#sec2 .sec2-box1 h3 {
  font-size: 6vw;
  text-align: center;
  margin: 0px 0px 4vw;
}
#sec2 .sec2-img3 {
  width: 85%;
  margin: 16vw auto 10vw;
}
#sec2::before {
  content: "";
  position: absolute;
  top: 15%;
  right: 0px;
  width: 75%;
  height: 60%;
  background: url("../img/shared/bg3.png") repeat top left;
}
@media only screen and (min-width: 768px) {
  #sec2 {
    padding: 195px 0px 124px;
  }
  #sec2::before {
    top: 415px;
    height: 580px;
    width: 50%;
  }
  #sec2 h2 {
    font-size: 40px;
    line-height: 74px;
    height: 370px;
    margin: 0px 18px 0px 0px;
  }
  #sec2 .sec2-row1 {
    flex-direction: row-reverse;
    justify-content: flex-start;
  }
  #sec2 .sec2-img1 {
    width: 487px;
    margin: 105px 174px 0px 0px;
  }
  #sec2 .sec2-img2 {
    margin: 0px;
    position: absolute;
    top: 638px;
    right: -140px;
    width: 352px;
  }
  #sec2 .sec2-box1 {
    width: 320px;
    flex-direction: row-reverse;
    margin: 172px 0px 0px 25px;
  }
  #sec2 .sec2-box1 h3 {
    font-size: 30px;
    text-align: left;
    margin: -16px 0px 0px 20px;
  }
  #sec2 .sec2-txt1 {
    height: 285px;
  }
  #sec2 .sec2-img3 {
    width: 676px;
    margin: 113px 0px 0px -151px;
  }
  #sec2 .sec2-txt2 {
    height: 260px;
  }
  #sec2 .sec2-box2 {
    width: 220px;
    margin: -85px 92px 0px auto;
  }
}

#sec3 {
  position: relative;
  color: #fff;
  overflow: hidden;
  height: 300vh;
}
#sec3 .sec3-scroll {
  position: relative;
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}
#sec3 .sec3-scroll .sec3-zoom {
  overflow: hidden;
  transform-origin: center center;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 70%;
  height: 70%;
  position: relative;
}
#sec3 .sec3-scroll .sec3-zoom .sec3-bg {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}
#sec3 .sec3-scroll .sec3-zoom .sec3-bg.sec3-bg1 {
  background: url("../img/index/sec3_bg_sp.jpg") center/cover;
}
#sec3 .sec3-scroll .sec3-zoom .sec3-bg.sec3-bg2 {
  background: url("../img/index/sec3_bg2_sp.jpg") center/cover;
}
#sec3 .sec3-content {
  padding: 0px 0px 24vw;
}
#sec3 .sec3-content h2 {
  font-size: 7vw;
  margin: 0px 6% 0px auto;
  height: 60vw;
}
#sec3 .sec3-content .sec3-img1 {
  width: 50%;
  margin: -20vw 0px 10vw;
}
#sec3 .sec3-content .sec3-txt1 {
  width: 90%;
  margin: 0px auto;
}
#sec3 .sec3-content .sec3-txt2 {
  width: 90%;
  margin: 4vw auto 12vw;
}
#sec3 .sec3-content .sec3-img2 {
  margin: 0px -5% 0px auto;
  width: 90%;
}
@media only screen and (min-width: 768px) {
  #sec3 .sec3-scroll .sec3-zoom {
    width: 75%;
    height: 77%;
  }
  #sec3 .sec3-scroll .sec3-zoom .sec3-bg.sec3-bg1 {
    background-image: url("../img/index/sec3_bg.jpg");
  }
  #sec3 .sec3-scroll .sec3-zoom .sec3-bg.sec3-bg2 {
    background-image: url("../img/index/sec3_bg2.jpg");
  }
  #sec3 .sec3-content {
    padding: 0px 0px 190px;
  }
  #sec3 .sec3-content h2 {
    font-size: 40px;
    line-height: 74px;
    margin: 0px 45px 0px auto;
    height: 340px;
  }
  #sec3 .sec3-content .sec3-img1 {
    width: 442px;
    margin: -220px 0px 0px -60px;
  }
  #sec3 .sec3-content .sec3-txt1 {
    height: 300px;
    margin: -125px 285px 0px auto;
    width: auto;
  }
  #sec3 .sec3-content .sec3-txt2 {
    width: auto;
    height: 340px;
    margin: 75px 0px 0px;
  }
  #sec3 .sec3-content .sec3-img2 {
    width: 667px;
    margin: -270px 44px 0px auto;
  }
}

.sec3-2 {
  position: relative;
  background: url("../img/index/sec3_deco1.png") no-repeat top right -35%/70%, url("../img/index/sec3_deco2.png") no-repeat bottom 1% left -186%/95%;
  padding: 36vw 0px 30vw;
  box-sizing: border-box;
}
.sec3-2::before {
  content: "";
  position: absolute;
  top: -16vw;
  left: 50%;
  transform: translateX(-50%);
  width: 3vw;
  height: 40vw;
  background: url("../img/index/sec3_line.png") center/cover;
  z-index: 1;
}
.sec3-2 h3 {
  height: 55vw;
  margin: 0px auto 8vw;
  font-size: 6.5vw;
  line-height: 2;
}
.sec3-2 .sec3-img3 {
  width: 90%;
  margin: 0px auto;
}
@media only screen and (min-width: 768px) {
  .sec3-2 {
    background-size: auto, auto;
    background-position: top right 6%, bottom left 5%;
    padding: 315px 0px 294px;
  }
  .sec3-2::before {
    width: 21px;
    height: 316px;
    top: -93px;
  }
  .sec3-2 h3 {
    font-size: 40px;
    line-height: 90px;
    height: 310px;
    margin: 0px auto 76px;
  }
  .sec3-2 .sec3-img3 {
    width: 678px;
  }
}

#sec4 {
  background: url("../img/shared/bg2.jpg") repeat top left;
  color: #fff;
  padding: 24vw 0px 16vw;
}
#sec4 h2 {
  font-size: 7vw;
  margin: 0px 4% 30vw;
  height: 50vw;
  position: relative;
  line-height: 1.4;
}
#sec4 h2::before {
  content: "";
  top: -24vw;
  right: 20%;
  position: absolute;
  height: 18vw;
  width: 1px;
  background: #fff;
}
#sec4 h2 span {
  display: inline-block;
  margin-top: 12vw;
  font-size: 10vw;
}
#sec4 h2 small {
  font-size: 6.5vw;
}
#sec4 .sec4-txt {
  width: 90%;
  margin: 0px auto;
}
#sec4 .sec4-img {
  width: 65%;
  position: absolute;
  top: -10vw;
  right: -4%;
}
#sec4 .sec4-btn a {
  border: 1px solid #fff;
  margin: 10vw auto 0px;
  line-height: 3.5;
  padding-right: 8%;
}
#sec4 .sec4-btn a::before {
  right: 6%;
}
@media only screen and (min-width: 768px) {
  #sec4 {
    padding: 110px 0px 168px;
  }
  #sec4 h2 {
    font-size: 40px;
    line-height: 51px;
    height: 250px;
    margin: 0px 244px 30px auto;
  }
  #sec4 h2 span {
    font-size: 52px;
    margin-top: 64px;
  }
  #sec4 h2 small {
    font-size: 30px;
  }
  #sec4 h2::before {
    top: 104px;
    left: 150px;
    width: 40vw;
    height: 1px;
    right: auto;
  }
  #sec4 .sec4-img {
    right: auto;
    left: -125px;
    top: -10px;
    width: 650px;
  }
  #sec4 .sec4-txt {
    width: 430px;
    margin: 0px -40px 0px auto;
  }
  #sec4 .sec4-btn a {
    width: 380px;
    margin: 69px 0px 0px auto;
    line-height: 80px;
  }
}

#sec5 {
  position: relative;
  padding: 0px 0px 10vw;
}
#sec5::before {
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 70%;
  height: calc(100% + 16vw);
  background: url("../img/shared/bg3.png") repeat top left;
}
#sec5 h2 {
  margin: 12vw 0px 8vw;
  text-align: center;
  font-size: 7vw;
}
#sec5 .sec5-map {
  width: 80%;
  margin: 12vw auto;
}
#sec5 .sec5-img {
  width: 55%;
  margin: 0px;
}
@media only screen and (min-width: 768px) {
  #sec5 {
    padding: 366px 0px 140px;
  }
  #sec5::before {
    width: 50%;
    height: calc(100% + 190px - 373px);
    top: 373px;
  }
  #sec5 .sec5-bg {
    position: absolute;
    top: 210px;
    left: 50%;
    width: 100%;
    max-width: 1270px;
    transform: translateX(-50%);
  }
  #sec5 h2 {
    color: #fff;
    text-align: left;
    font-size: 40px;
    height: 290px;
    margin: 0px 64px 0px auto;
  }
  #sec5 .sec5-txt {
    width: 450px;
    margin: 234px 0px 0px 12px;
  }
  #sec5 .sec5-map {
    position: absolute;
    margin: 0px;
    top: 500px;
    right: -80px;
    width: 433px;
  }
  #sec5 .sec5-img {
    width: 708px;
    margin: 96px 0px 0px -139px;
  }
}

#sec6 {
  padding: 0px 0px 16vw;
}
#sec6 .sec6-img {
  width: 76%;
  margin: 0px 0px 0px auto;
}
#sec6 h2 {
  font-size: 7vw;
  position: relative;
  margin: 3vw 2% 0px;
  height: 40vw;
}
#sec6 h2::before {
  content: "";
  position: absolute;
  top: -34vw;
  left: 50%;
  transform: translateX(-50%);
  height: 28vw;
  width: 1px;
  background: #000;
}
#sec6 .sec6-logo {
  width: 30%;
  margin: -18vw auto 8vw;
}
#sec6 .sec6-btn1 a {
  margin: 0px auto;
}
#sec6 .sec6-tel {
  text-align: center;
  font-size: 8vw;
  margin: 6vw 0px;
}
#sec6 .sec6-tel span {
  font-size: 6vw;
}
#sec6 .sec6-btn2 a {
  margin: 0px auto;
}
#sec6 .sec6-list {
  margin: 12vw 0px 0px;
}
#sec6 .sec6-list dl {
  margin: 0px 0px 5vw;
  line-height: 1.6;
}
#sec6 .sec6-list dl dt {
  width: 25%;
}
#sec6 .sec6-list dl dd {
  width: 75%;
}
@media only screen and (min-width: 768px) {
  #sec6 {
    padding: 0px 0px 77px;
  }
  #sec6 .sec6-img {
    width: 917px;
    margin: 0px -177px 0px auto;
  }
  #sec6 h2 {
    font-size: 40px;
    margin: -106px 0px 58px 74px;
    height: 195px;
  }
  #sec6 h2::before {
    top: -285px;
    height: 235px;
  }
  #sec6 .sec6-box {
    width: 325px;
    margin: 0px 0px 0px -40px;
  }
  #sec6 .sec6-list {
    width: 620px;
    margin: 0px -4px 0px 0px;
  }
  #sec6 .sec6-list dl {
    margin: 0px 0px 35px;
    line-height: 35px;
  }
  #sec6 .sec6-list dl dt {
    width: 150px;
  }
  #sec6 .sec6-list dl dd {
    width: calc(100% - 150px);
  }
  #sec6 .sec6-logo {
    width: 149px;
    margin: 0px auto 63px;
  }
  #sec6 .sec6-tel {
    font-size: 32px;
    margin: 37px 0px 26px;
  }
  #sec6 .sec6-tel span {
    font-size: 22px;
  }
}

#sec7 {
  padding: 0px 0px 16vw;
}
#sec7 #map {
  width: 100%;
  height: 480px;
  filter: grayscale(1);
}
#sec7 #map iframe {
  width: 100%;
  height: 100%;
}
#sec7 .sec7-listbtn .sec7-btn1 a {
  margin: 8vw auto 0px;
}
@media only screen and (min-width: 768px) {
  #sec7 {
    padding: 0px 0px 150px;
    margin: 0px auto;
    width: 100%;
    max-width: 1140px;
  }
  #sec7 #map {
    height: 460px;
  }
  #sec7 .sec7-listbtn {
    width: 730px;
    margin: 67px auto 0px;
  }
  #sec7 .sec7-listbtn .sec7-btn1 a {
    margin: 0px;
  }
  #sec7 .sec7-listbtn .sec7-btn2 a {
    font-family: "Noto Serif JP";
  }
}/*# sourceMappingURL=index.css.map */