@import url("https://use.typekit.net/drn2oss.css");
.anime-blur {
  opacity: 0;
  filter: blur(10px);
  transition: ease opacity 0.6s;
  transition-property: opacity, filter;
}

.anime-blur.is-active {
  opacity: 1;
  filter: blur(0);
}

.anime-areaup {
  overflow: hidden;
  position: relative;
}

.anime-slideTop {
  display: block;
  transform: translate3d(0, 100%, 0) skewY(14deg);
  transform-origin: left;
  transition: ease transform 0.4s 0.3s;
}

.anime-slideTop.is-active {
  transform: translate3d(0, 0, 0) skewY(0) !important;
}

.anime-slideRight {
  overflow: hidden;
  width: 0;
  position: absolute;
  display: block;
  white-space: nowrap;
  text-align: left;
}

.anime-slideRight.is-active {
  animation: flowing-anim-01 1s forwards;
  animation-timing-function: cubic-bezier(0.38, 0.45, 0.795, 0.1);
}

@keyframes flowing-anim-01 {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}

.anime-fade {
  backface-visibility: hidden;
  transform: translate(1.875rem, 0);
  opacity: 0;
}

.anime-fade.is-active {
  transition: opacity 1s cubic-bezier(0.3, 0.05, 0.05, 1), -webkit-transform 1s cubic-bezier(0.3, 0.05, 0.05, 1);
  transition: transform 1s cubic-bezier(0.3, 0.05, 0.05, 1), opacity 1s cubic-bezier(0.3, 0.05, 0.05, 1);
  transform: translate(0rem, 0);
  opacity: 1;
}

body {
  overflow-x: hidden;
}

.pc-header {
  overflow: hidden;
}

.area-header {
  max-width: 100%;
}

.breadcrumbs {
  max-width: 100%;
}

.feature-snslist {
  overflow: hidden;
}

.l-footer {
  overflow: hidden;
}

.l-container {
  width: 100%;
}

.l-container #feature {
  font-family: "hiragino-kaku-gothic-pron", sans-serif;
  font-weight: 600;
  font-style: normal;
  color: #FFFFFF;
  margin: -10px auto -90px;
  font-feature-settings: "palt";
  display: block;
  text-align: center;
  overflow: hidden;
}

.l-container #feature .default-img {
  width: 100%;
  height: auto;
  display: block;
  user-select: none;
}

.l-container #feature * {
  box-sizing: border-box;
}

.l-container #feature *::after {
  box-sizing: border-box;
}

.l-container #feature *::before {
  box-sizing: border-box;
}

.l-container #feature a {
  color: inherit;
  display: block;
  text-decoration: none;
  position: relative;
  transition: 0.3s;
}

.l-container #feature a:hover {
  cursor: pointer;
  opacity: 0.7;
}

.l-container #feature .mv {
  position: relative;
}

.l-container #feature .mv__image {
  margin: 0 auto;
  width: 100%;
}

.l-container #feature .mv__title--main {
  color: #FFFFFF;
  position: absolute;
  font-family: "nimbus-sans", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: calc(50 * (100vw / 1400));
  letter-spacing: 0.025em;
  top: calc(480 * (100vw / 1400));
  left: calc(596 * (100vw / 1400));
}

.l-container #feature .mv__title--main .anime-slideTop {
  transform: translate3d(0, 76%, 0) skewY(12deg);
}

.l-container #feature .mv__title--sub {
  color: #FFFFFF;
  position: absolute;
  font-family: "nimbus-sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: calc(45 * (100vw / 1400));
  letter-spacing: 0.25em;
  top: calc(532 * (100vw / 1400));
  left: calc(626 * (100vw / 1400));
}

.l-container #feature .mv__title--sub .anime-slideTop {
  transform: translate3d(0, 76%, 0) skewY(12deg);
}

.l-container #feature .mv__text {
  color: #FFFFFF;
  font-size: calc(14 * (100vw / 1400));
  letter-spacing: 0.08em;
  line-height: 2;
  position: absolute;
  top: calc(609 * (100vw / 1400));
  left: calc(527 * (100vw / 1400));
}

.l-container #feature .contents__inner {
  background-color: #000000;
  padding: calc(257 * (100vw / 1400)) 0 calc(173 * (100vw / 1400));
}

.l-container #feature .contents__lead {
  color: #000000;
  position: relative;
  z-index: 2;
}

.l-container #feature .contents__lead p {
  color: #FFFFFF;
  height: calc(30 * (100vw / 1400));
  font-size: calc(14 * (100vw / 1400));
  letter-spacing: 0.07em;
  display: flex;
  align-items: center;
  margin-top: calc(3 * (100vw / 1400));
  padding-left: calc(11 * (100vw / 1400));
}

.l-container #feature .contents__lead01 {
  margin: 0 0 0 calc(350 * (100vw / 1400));
}

.l-container #feature .contents__lead02 {
  margin: calc(222 * (100vw / 1400)) 0 0 calc(625 * (100vw / 1400));
}

.l-container #feature .modelBox {
  position: relative;
}

.l-container #feature .modelBox__figure {
  position: relative;
}

.l-container #feature .modelBox__desc {
  font-family: "hiragino-kaku-gothic-pron", sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: calc(13 * (100vw / 1400));
  letter-spacing: 0.065em;
  line-height: 2.1;
  text-align: justify;
}

.l-container #feature .modelBox__desc01 {
  margin: calc(36 * (100vw / 1400)) auto 0;
  width: calc(650 * (100vw / 1400));
}

.l-container #feature .modelBox__desc02 {
  position: absolute;
  top: calc(109 * (100vw / 1400));
  left: calc(-374 * (100vw / 1400));
  width: calc(443 * (100vw / 1400));
}

.l-container #feature .modelBox01 {
  margin: calc(-18 * (100vw / 1400)) auto 0;
  width: calc(700 * (100vw / 1400));
}

.l-container #feature .modelBox02 {
  margin: calc(225 * (100vw / 1400)) auto 0;
  width: calc(700 * (100vw / 1400));
}

.l-container #feature .modelBox03 {
  margin: calc(178 * (100vw / 1400)) 0 0 auto;
  width: calc(800 * (100vw / 1400));
}

.l-container #feature .modelBox04 {
  margin: calc(-83 * (100vw / 1400)) 0 0 calc(226 * (100vw / 1400));
  width: calc(600 * (100vw / 1400));
}

.l-container #feature .modelBox05 {
  margin: calc(-59 * (100vw / 1400)) 0 0 calc(303 * (100vw / 1400));
  width: calc(550 * (100vw / 1400));
}

.l-container #feature .checkBtn {
  margin: calc(163 * (100vw / 1400)) auto 0;
  position: relative;
  z-index: 2;
}

.l-container #feature .checkBtn a {
  font-family: "nimbus-sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: calc(18 * (100vw / 1400));
  letter-spacing: 0.03em;
  margin: 0 auto;
  position: relative;
  border-bottom: 1px solid #FFFFFF;
  transform: translateX(calc(-8 * (100vw / 1400)));
  width: calc(90 * (100vw / 1400));
}
