@charset "utf-8";


/*  l-mv
--------------------------------------------------*/
.l-mv {
  position: relative;
  margin: auto;
  padding: 0;
  overflow: clip;
}
.l-mv::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  margin-top: calc(95 / 1920 * 100%);
  margin-left: calc(-24 / 1920 * 100%);
  pointer-events: none;
  width: min(1082px,calc(1082 / 1920 * 100%));
  aspect-ratio: 1082 / 476;
  pointer-events: none;
  background: url(../img/home/img_mv_catch_bg.webp) no-repeat center center/cover;
  mix-blend-mode: multiply;
  opacity: var(--mv-catch-bg, 0);
  z-index: 2;
}
.mv-gallery {
  position: relative;
  /* 横1920px × 縦1330px */
  --s: calc(min(100vw, 1920px) / 1920);
  --row1: 443; /* 1段目 */
  --row2: 444; /* 2段目 */
  --row3: 443; /* 3段目 */
  display: grid;
  width: 100%;
  /* 6列レイアウト：480px ｜ 480px ｜ 320px ｜ 160px ｜ 160px ｜ 320px
     1段目 480｜960｜480 / 2段目 480｜480｜960 / 3段目 480｜480｜320｜320｜320 */
  grid-template-columns: minmax(0, 480fr) minmax(0, 480fr) minmax(0, 320fr) minmax(0, 160fr) minmax(0, 160fr) minmax(0, 320fr);
  grid-template-rows:
    calc(var(--row1) * var(--s))
    calc(var(--row2) * var(--s))
    calc(var(--row3) * var(--s));
  grid-template-areas:
    "i1 i2 i2 i2 i3 i3"
    "i4 i4 i5 i5 i5 i5"
    "i6 i7 i8 i9 i9 i10";
}
/* .mv-gallery::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  width: 100%;
  height: 100%;
  background: url(../img/home/img_mv_photo_overlay.webp) no-repeat center center/cover;
  mix-blend-mode: multiply;
  opacity: var(--mv-overlay, 0);
  z-index: 1;
} */
.mv-gallery__item {
  position: relative;
  min-width: 0;
  min-height: 0;
  overflow: clip;
  visibility: hidden;
}
.mv-gallery__item[data-num="item4"] {
  text-align: center;
  background: #0d0000; 
}
.mv-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}
.mv-gallery__item[data-num="item4"] img {
  width: auto;
  height: 100%;
}
.mv-gallery__item[data-num="item1"]  { grid-area: i1; }
.mv-gallery__item[data-num="item2"]  { grid-area: i2; }
.mv-gallery__item[data-num="item3"]  { grid-area: i3; }
.mv-gallery__item[data-num="item4"]  { grid-area: i4; } 
.mv-gallery__item[data-num="item5"]  { grid-area: i5; }
.mv-gallery__item[data-num="item6"]  { grid-area: i6; }
.mv-gallery__item[data-num="item7"]  { grid-area: i7; }
.mv-gallery__item[data-num="item8"]  { grid-area: i8; }
.mv-gallery__item[data-num="item9"]  { grid-area: i9; }
.mv-gallery__item[data-num="item10"] { grid-area: i10; }
.mv-gallery__item[data-num="item11"] { grid-area: i11; }
.mv-heading {
  position: absolute;
  top: 0;
  left: 0;
  margin-top: calc(205 / 1920 * 100%);
  margin-left: calc(256 / 1920 * 100%);
  pointer-events: none;
  width: min(481px,calc(481 / 1920 * 100%));
  visibility: hidden;
  z-index: 3;
}
.mv-catch {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  margin-inline: auto;
  transform: translateY(-50%);
  font-size: 3.2rem;
  line-height: 2;
  letter-spacing: .25em;
  color: var(--white);
  text-shadow: 0 0 10px rgba(var(--black-rgb), .2),0 0 10px rgba(var(--black-rgb), .2),0 0 10px rgba(var(--black-rgb), .2),0 0 10px rgba(var(--black-rgb), .2),0 0 10px rgba(var(--black-rgb), .2),0 0 10px rgba(var(--black-rgb), .2);
  text-align: center;
  pointer-events: none;
  visibility: hidden;
  z-index: 3;
}
.mv-fix {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  z-index: 1;
}
.mv-fix__photo {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: clip;
}
.mv-fix__photo img {
  object-fit: cover;
  object-position: right top;
  width: 100%;
  height: 100%;
}
.mv-fix__desc {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .l-mv::after {
    content: none;
  }
  .mv-gallery {
    /* 横380px × 縦500px */
    --s: calc(100vw / 380);
    --row1: 150;
    --row2: 200;
    --row3: 70;
    --row4: 80;
    /* 4列レイアウト：120px ｜ 60px ｜ 100px ｜ 100px */
    grid-template-columns: minmax(0, 120fr) minmax(0, 60fr) minmax(0, 100fr) minmax(0, 100fr);
    grid-template-rows:
      calc(var(--row1) * var(--s))
      calc(var(--row2) * var(--s))
      calc(var(--row3) * var(--s))
      calc(var(--row4) * var(--s));
    grid-template-areas:
      "i5 i5 i2 i2"
      "i4 i4 i4 i4"
      "i1 i1 i3 i3"
      "i10 i8 i8 i9";
  }
  /* .mv-gallery::before {
    background: url(../img/home/img_mv_photo_overlay-sp.webp) no-repeat center center/cover;
  } */
  /* .mv-gallery__item[data-num="item1"], */
  /* .mv-gallery__item[data-num="item2"], */
  /* .mv-gallery__item[data-num="item3"], */
  /* .mv-gallery__item[data-num="item4"], */
  /* .mv-gallery__item[data-num="item5"], */
  .mv-gallery__item[data-num="item6"],
  .mv-gallery__item[data-num="item7"]
  /* .mv-gallery__item[data-num="item8"], */
  /* .mv-gallery__item[data-num="item9"], */
  /* .mv-gallery__item[data-num="item10"] */
  {
    display: none;
  }
  .mv-heading {
    right: 0;
    margin-top: calc(105 / 380 * 100%);
    margin-inline: auto;
    padding-left: calc(10 / 380 * 100%);
    width: calc(220 / 380 * 100%);
  }
  .mv-catch {
    top: 0;
    transform: translateY(0);
    margin-top: calc(460 / 380 * 100%);
    font-size: 2.4rem;
    line-height: 1.75;
    letter-spacing: .15em;
    text-shadow: 0 0 10px rgba(var(--black-rgb), .1),0 0 10px rgba(var(--black-rgb), .1),0 0 10px rgba(var(--black-rgb), .1),0 0 10px rgba(var(--black-rgb), .1),0 0 10px rgba(var(--black-rgb), .1),0 0 10px rgba(var(--black-rgb), .1);
  }
}










/*  l-lower
--------------------------------------------------*/
.l-lower {
  position: relative;
}
.lower-nav {
  position: sticky;
  top: 0;
  width: 1.0rem;
  height: 100lvh;
  margin: 0 0 -100lvh 5%;
  z-index: 3;
  opacity: 0;
  pointer-events: none;
}
.lower-nav__pagenation {
  gap: 2.0rem 0;
}
.lower-nav__pagenation__item {
  position: relative;
  width: 1.0rem;
  height: 1.0rem;
  border-radius: 50%;
  background-color: rgba(var(--white-rgb), 0.4);
  transition: background-color .5s ease, transform .5s ease;
}
.lower-nav__pagenation__item::after {
  content: '';
  position: absolute;
  inset: -1.0rem;
}
.lower-nav__pagenation__item.active {
  background-color: rgba(var(--white-rgb), 0.9);
  transform: scale(1.4);
}
.lowerSection {
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  height: 100lvh;
}
.lowerSection + .lowerSection {
  box-shadow: 0 -2.4rem 6.0rem rgba(0, 0, 0, .35);
}
.lowerSection-box {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
}
.lowerSection::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(var(--black-rgb, 0, 0, 0), 1);
  opacity: var(--dim, 0);
  pointer-events: none;
  z-index: 2;
}
.lowerSection-photo {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: clip;
  background: var(--black);
}
.lowerSection-photo::after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: min(100%,1270px);
  height: 100%;
  background: linear-gradient(90deg, rgba(62, 58, 57, 0) 0%, rgba(62, 58, 57, 0.4) 77.5%);
  pointer-events: none;
  z-index: 1;
}
.lowerSection-photo img {
  object-fit: cover;
  object-position: center center;
  width: 100%;
  height: 100%;
  transform-origin: center center;
  will-change: transform;
}
[data-name="l-location"] .lowerSection-photo img {
  object-position: top center;
}
.lowerSection-detail {
  position: absolute;
  right: 10.0rem;
  bottom: 10.0rem;
  text-align: right;
  z-index: 1;
}
.lowerSection-detail__heading,
.lowerSection-detail__more {
  opacity: 0;
}
.lowerSection-detail__heading {
  font-size: 6.0rem;
  letter-spacing: .2em;
  color: rgba(var(--white-rgb), 0.7);
  margin-right: -0.25em;
}
.lowerSection-detail__more {
  font-size: 1.6rem;
  letter-spacing: .15rem;
  color: rgba(var(--white-rgb), 0.8);
  margin-top: 5.0rem;
}
.lowerSection-detail__more i {
  font-family: YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif !important;
  font-weight: 400 !important;
  font-style: normal !important;
  padding-left: 0.7em;
}
@media (any-hover: hover){
  .lowerSection-detail__more i {
    transition: padding-left .3s linear,opacity .3s linear;
  }
  .lowerSection-detail__more:hover i {
    padding-left: 0;
    opacity: 0;
  }
}
@media screen and (max-width: 768px) {
  .lowerSection-photo::after {
    width: calc(200 / 320 * 100%);
    background: linear-gradient(90deg, rgba(62, 58, 57, 0) 0%, rgba(62, 58, 57, 0.4) 77.5%);
  }
  [data-name="l-location"] .lowerSection-photo img {
    object-position: center right;
  }
  .lowerSection-detail {
    right: 3.5rem;
    bottom: 50%;
    transform: translateY(50%);
    filter: drop-shadow(0 0 20px rgba(var(--black-rgb), 0.8));
  }
  .lowerSection-detail__heading {
    font-size: 3.6rem; 
    color: rgba(var(--white-rgb), 0.9);
  }
  .lowerSection-detail__more {
    font-size: 1.3rem;
    margin-top: 2.4rem; 
    color: rgba(var(--white-rgb), 0.9);
  }
}




/*  l-entry
--------------------------------------------------*/
.l-entry {
  position: relative;
  width: 100%;
  padding-block: 15.0rem;
  background: var(--white);
}
.entry-inner {
  max-width: 1440px;
}
.entry-head {
  margin-bottom: 10.0rem;
}
.entry-head__heading {
  font-size: 4.2rem;
  letter-spacing: .15em;
  color: var(--color-medium);
  text-align: center;
}
.entry-head__desc {
  font-size: 1.8rem;
  line-height: 1.75;
  letter-spacing: .1em;
  text-align: center;
  margin-top: 3.0rem;
}
.entry-flow {
  width: min(100%,1360px);
  margin-inline: auto 0;
}
.entry-flow__item {
  position: relative;
}
.entry-flow__item[data-num="item1"] {
  width: calc(400 / 1360 * 100%);
  padding-right: calc(80 / 1360 * 100%);
}
.entry-flow__item[data-num="item2"] {
  width: calc(480 / 1360 * 100%);
  padding-left: calc(80 / 1360 * 100%);
}
.entry-flow__item[data-num="item3"] {
  width: calc(480 / 1360 * 100%);
  padding-left: calc(80 / 1360 * 100%);
}
.entry-flow__item + .entry-flow__item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 1px;
  height: 100%;
  background: #ccc;
}
.entry-flow__item + .entry-flow__item::after {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 15px solid var(--color-medium);
}
.entry-flow__item__detail {
  width: 100%;
  flex: 1;
}
.entry-flow__item__detail__step {
  position: relative;
  font-size: 1.4rem;
  color: var(--color-light);
  letter-spacing: .1em;
  padding-left: 3.0rem;
}
.entry-flow__item__detail__step::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  top: 50%;
  width: 1.6rem;
  height: 1px;
  background: currentColor;
}
.entry-flow__item__detail__heading {
  font-size: 2.4rem;
  line-height: 1.91666667;
  color: var(--color-deep);
  letter-spacing: .1em;
  margin-top: 2.0rem;
}
.entry-flow__item__detail__desc {
  font-size: 1.4rem;
  line-height: 2.28571429;
  letter-spacing: .1em;
  margin-top: 2.5rem;
}
.entry-flow__item__detail__desc i {
  font-size: .5em;
  vertical-align: .3em;
}
:root .entry-flow__item__btn {
  width: min(100%,320px);
  height: 7.0rem;
  margin-inline: 0 auto;
  display: flex;
  align-items: center;
  font-size: 1.4rem;
  line-height: 1.25;
  letter-spacing: .05em;
  color: var(--white);
  margin-top: 3.5rem;
  padding-bottom: .2em;
}
.entry-flow__item__btn[data-type="request"] {
  background: #baa68c;
  gap: 0 1.3rem;
}
.entry-flow__item__btn[data-type="request"]::before {
  content: '';
  width: 2.4rem;
  height: 2.4rem;
  background: url(../img/icon-req-white.svg) no-repeat center center/cover;
  margin-top: .2rem;
}
.entry-flow__item__btn[data-type="branz"] {
  border: solid 1px #919a9e;
  padding-bottom: 0;
}
.entry-flow__item__btn[data-type="branz"] span {
  display: inline-block;
  width: 15.0rem;
}
@media screen and (min-width: 1001px){
  :root .entry-flow__item[data-num="item2"] .entry-flow__item__btn {
    width: calc(320 / 400 * 100%);
  }
}
@media screen and (max-width: 1000px){
  .entry-flow {
    width: min(100%,560px);
    margin-inline: auto;
  }
  .entry-flow__item[data-num="item1"] {
    width: 100%;
    padding-inline: 10%;
  }
  .entry-flow__item[data-num="item2"] {
    width: 100%;
    padding-inline: 10%;
  }
  .entry-flow__item[data-num="item3"] {
    width: 100%;
    padding-inline: 10%;
  }
  .entry-flow__item + .entry-flow__item {
    margin-top: 8.0rem;
    padding-top: 8.0rem;
  }
  .entry-flow__item + .entry-flow__item::before {
    width: 100%;
    height: 1px;
  }
  .entry-flow__item + .entry-flow__item::after {
    left: 50%;
    top: 0;
    transform: translate(-50%,0);
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: none;
    border-top: 15px solid var(--color-medium);
  }
}
@media screen and (max-width: 767px){
  .l-entry {
    padding-block: 7.0rem;
  }
  .entry-inner {
    max-width: 560px;
  }
  .entry-head {
    margin-bottom: 5.0rem;
  }
  .entry-head__heading {
    font-size: 2.6rem;
  }
  .entry-head__desc {
    font-size: 1.6rem;
    margin-top: 2.0rem;
  }
  .entry-flow__item[data-num="item1"] {
    padding-inline: 0;
  }
  .entry-flow__item[data-num="item2"] {
    padding-inline: 0;
  }
  .entry-flow__item[data-num="item3"] {
    padding-inline: 0;
  }
  .entry-flow__item + .entry-flow__item {
    margin-top: 5.0rem;
    padding-top: 5.0rem;
  }
  .entry-flow__item__detail__heading {
    font-size: 2.0rem;
    margin-top: 1.5rem;
  }
  .entry-flow__item__detail__desc {
    margin-top: 1.0rem;
  }
  :root .entry-flow__item__btn {
    width: 100%;
    height: 6.0rem;
    margin-top: 2.5rem;
  }
}