@charset "UTF-8";
/* Scss Document */
#mainvisual {
  height: 978px;
  background-color: unset;
  background-image: unset;
}

.mainvisual_wrap {
  height: 978px;
}

#mainvisual .inner {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
}

/* キャッチフレーズ */
.mainvisual_catch {
  position: absolute;
  top: 302px;
  right: 142px;
  max-height: 383px;
  height: 100%;
}

.mainvisual_catch p {
  display: block;
  color: #000;
  font-family: var(--Ser);
  font-weight: 400;
  font-size: 29px;
  letter-spacing: 0.1em;
  line-height: 2.58;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  -webkit-filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff);
  filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff);
}

.mainvisual_catch span {
  position: relative;
  display: inline-block;
}
.mainvisual_catch span i {
  font-style: normal;
  letter-spacing: -0.5em;
}
.mainvisual_catch span::before {
  content: "";
  position: absolute;
  top: 0;
  right: 12px;
  width: 1px;
  height: 100%;
  background: #000;
}

.mainvisual_btn {
  position: absolute;
  z-index: 1;
  right: 63px;
  bottom: 90px;
  width: 335px;
  height: 244px;
}
.mainvisual_btn li {
  position: absolute;
}
.mainvisual_btn li a {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  transition: background 0.2s ease;
}
.mainvisual_btn li a:hover {
  background: rgba(255, 255, 255, 0.3);
}
.mainvisual_btn li:first-of-type {
  top: 0;
  left: 0;
}
.mainvisual_btn li:first-of-type img {
  width: 100%;
  max-width: 187px;
}
.mainvisual_btn li:last-of-type {
  right: 0;
  bottom: 0;
}
.mainvisual_btn li:last-of-type img {
  width: 100%;
  max-width: 166px;
}

/* メインスライド */
#slick_fade {
  width: 100%;
  height: 978px;
}

#slick_fade .slide_item img {
  width: 100%;
  height: 978px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

@media screen and (max-width: 640px) {
  #wrapper, html, body {
    min-height: 500px;
  }
  #mainvisual {
    height: 450px;
  }
  .mainvisual_wrap {
    height: 450px;
  }
  /* トップページキャッチフレーズ */
  .mainvisual_catch {
	position: static;
    max-height: 300px;
  }
  .mainvisual_catch h2 {
    margin-bottom: 10px;
    font-size: 22px;
  }
  .mainvisual_catch p {
    font-size: 20px;
    -webkit-filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff);
            filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff);
	margin: 30px 20px 0 auto;
  }
  .mainvisual_catch span::before {
    right: 7px;
  }
  .mainvisual_open {
    right: 10px;
    bottom: 10px;
    width: 150px;
  }
  /* メインスライド */
  #slick_fade {
    height: 450px;
  }
  #slick_fade .slide_item img {
    height: 450px;
  }
  .mainvisual_btn {
    right: 10px;
    bottom: 10px;
    width: 250px;
    height: 182px;
    -webkit-filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff);
            filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff);
  }
  .mainvisual_btn li:first-of-type img {
    width: 100%;
    max-width: 140px;
  }
  .mainvisual_btn li:last-of-type img {
    width: 100%;
    max-width: 124px;
  }
}