@charset "utf-8";


:root {
  --infoBox: 40px;
}
@media screen and (min-width: 768px) {
  .newsGroup .newsDetail__desc {
    -webkit-line-clamp: unset;
    line-clamp: unset;
    line-height: 1.5;
    overflow: visible;
  }
}




/*  firstView
--------------------------------------------------*/
.firstView {
  position: relative;
  background-color: var(--black);
  grid-template-columns: minmax(0, 1fr);
  z-index: 1;
}
.firstView-photo {
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  /* max-height: 100svh; */
  height: 100svh;
  overflow: clip;
  aspect-ratio: 1920 / 923;
  grid-area: 1 / 1;
  place-self: start;
  pointer-events: none;
  z-index: 0;
}
.firstView-photo__item {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}
:root .mainVisual {
  width: 100%;
  /* max-height: 100svh; */
  height: 100svh;
  aspect-ratio: 1920 / 923;
  grid-area: 1 / 1;
  place-self: start;
  z-index: 1;
}
.firstViewContents {
  position: relative;
  width: 100%;
  grid-area: 1 / 1;
  place-self: start;
  pointer-events: none;
  z-index: 2;
}
.firstViewContainer {
  position: relative;
}
.firstView-catch {
  width: 100%;
  /* max-height: 100svh; */
  height: 100svh;
  aspect-ratio: 1920 / 923;
  position: sticky;
  top: 0;
  left: 0;
}
.firstView-catch__item {
  position: relative;
  width: max(70px,9.5rem);
}
.firstView-catch__item img {
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 30%, transparent 70%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 0%, #000 30%, transparent 70%, transparent 100%);
  -webkit-mask-size: 100% 330%;
  mask-size: 100% 330%;  
  -webkit-mask-position: 0 100%;
  mask-position: 0 100%;
  will-change: mask-position, -webkit-mask-position;
}
.firstView-catch__item .firstView-catch__item__txt2 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media screen and (min-width: 769px) {
  .firstView-photo__item img {
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
    opacity: 0;
    filter: blur(15px);
    transform: scale(1.12);
    transform-origin: center center;
    will-change: opacity, filter, transform;
  }
}
@media screen and (max-width: 768px) {
  .firstView-photo {
    height: 100lvh;
    max-height: 100lvh;
    aspect-ratio: auto;
    /* --mask-height: 200lvh; */
  }
  .firstView-photo::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: max(calc(100lvh - 59.0rem + 8.0rem), 8.0rem);
    background: linear-gradient(180deg, 
    var(--black) 0%, 
    var(--black) calc(100% - 8.0rem), 
    rgba(var(--black-rgb), 0.8) calc(100% - 4.0rem),
    rgba(var(--black-rgb), 0.4) calc(100% - 2.0rem),
    rgba(var(--black-rgb), 0.1) calc(100% - 0.8rem),
    rgba(var(--black-rgb), 0) 100%
    );
    z-index: 1;
  }
  .firstView-photo__item {
    width: 100%;
    max-height: 59.0rem;
    aspect-ratio: 380 / 629;
  }
  .firstView-photo__item img {
    object-fit: cover;
    object-position: left bottom;
    max-width: none;
    width: 100%;
    height: 100%;
    opacity: 0;
    filter: blur(15px);
    transform: scale(1.12);
    transform-origin: center center;
    will-change: opacity, filter, transform;
  }
  :root .mainVisual {
    height: 100lvh;
    max-height: 100lvh;
    aspect-ratio: auto;
    display: flex;
    align-items: flex-end;
  }
  .firstView-catch {
    height: 100lvh;
    max-height: 100lvh;
    align-items: flex-start !important;
  }
  .firstView-catch__item {
    width: 6.0rem;
    /* transform: translateY(calc(50vh - 110px - 50%)); */
    top: 11.0rem;
  }
}
@media screen and (max-width: 375px) {
  .firstView-photo::before {
    height: max(calc(100lvh - 54.0rem + 8.0rem), 8.0rem);
  }
  .firstView-photo__item {
    max-height: 54.0rem;
  }
}



/*  l-intro
--------------------------------------------------*/
.l-intro {
  position: relative;
  padding-block: 40.0rem 23.0rem;
  background: linear-gradient(180deg, rgba(var(--black-rgb),0) 0%, var(--black) 39.05%, var(--black) 100%);
  pointer-events: auto;
  z-index: 1;
}
.intro-inner {
  position: relative;
}
.intro-head {
  margin-bottom: 35.0rem;
}
.intro-head__heading {
  font-size: 2.0rem;
  letter-spacing: .08em;
  font-weight: 500;
  color: var(--color-gold);
  text-align: center;
  margin-bottom: 9.0rem;
}
.intro-head__desc {
  font-size: max(15px,1.8rem);
  line-height: 3.72;
  letter-spacing: .13em;
  color: var(--white);
  text-align: center;
}
.intro-head__desc__txt {
  width: fit-content;
  margin-inline: auto;
  mask-image: linear-gradient(to right, rgba(var(--black-rgb),1) 33.33%, rgba(var(--black-rgb),0) 66.66%);
  mask-size: 300% 100%;
  mask-position: 100% 0%;  
  -webkit-mask-image: linear-gradient(to right, rgba(var(--black-rgb),1) 33.33%, rgba(var(--black-rgb),0) 66.66%);
  -webkit-mask-size: 300% 100%;
  -webkit-mask-position: 100% 0%;
}
.intro-content {
  position: relative;
}
.intro-content__inner {
  width: min(calc(1856 / 1920 * 100%),1856px);
  margin-inline: auto;
  border: 1px solid rgba(var(--white-rgb), 0.3);
}
.intro-content__item {
  position: relative;
  height: 82.8rem;
  flex: 1;
}
.intro-content__item + .intro-content__item::after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 100%;
  background-color: rgba(var(--white-rgb), 0.3);
  pointer-events: none;
  z-index: 1;
}
.intro-content__item__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  overflow: clip;
}
.intro-content__item__bg::after {
  content: '';
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: rgba(var(--black-rgb), 0.4);
  z-index: 1;
}
.intro-content__item__bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}
.intro-content__item__bg video[data-position="left"] {
  object-position: left center;
}
.intro-content__item__bg video[data-position="right"] {
  object-position: right center;
}
.intro-content__item__detail {
  position: relative;
  width: 80%;
  margin-inline: auto;
  text-align: center;
  z-index: 1;
}
.intro-content__item__heading {
  width: 3.2rem;
  margin-inline: auto;
}
.intro-content__item__desc {
  font-size: max(12px,1.8rem);
  line-height: 1.87;
  font-weight: 500;
  letter-spacing: .1em;
  text-align: center;
  color: var(--white);
  margin-top: 5.0rem;
}
.intro-content__item__more {
  width: min(80%,200px);
  margin-top: 5.5rem;
}
@media (any-hover: hover){
  .intro-content__item {
    transition: flex 1.2s cubic-bezier(0.25, 1, 0.5, 1);
  }
  .intro-content__item:hover {
    flex: 2;
  }
  .intro-content__item__bg::after {
    transition: opacity 1.2s cubic-bezier(0.25, 1, 0.5, 1);
}
  .intro-content__item:hover .intro-content__item__bg::after {
    opacity: 0;
  }
  .intro-content__item:hover .intro-content__item__more {
    color: rgba(18, 18, 18, 0.7);
    background-color: var(--color-gold);
  }
  .intro-content__item:hover .intro-content__item__more::after {
    background-color: rgba(18, 18, 18, 0.7);
  }
}
@media screen and (max-width: 768px) {
  .l-intro {
    /* padding-block: 10.0rem 16.0rem; */
    padding-block: 100lvh 16.0rem;
    background: linear-gradient(180deg, rgba(var(--black-rgb),0) 0%, var(--black) 50%, var(--black) 100%);
  }
  .intro-inner {
    position: relative;
  }
  .intro-head {
    margin-bottom: 9.0rem;
  }
  .intro-head__heading {
    margin-bottom: 7.5rem;
  }
  .intro-head__desc {
    font-size: 1.5rem;
    line-height: 3;
    letter-spacing: .074em;
  }
  .intro-content__inner {
    width: 100%;
  }
  .intro-content__item {
    height: 49.0rem;
    flex: 100%;
  }
  .intro-content__item + .intro-content__item::after {
    width: 100%;
    height: 1px;
  }
  .intro-content__item__bg::after {
    background: rgba(var(--black-rgb), 0.5);
  }
  .intro-content__item__detail {
    width: 100%;
  }
  .intro-content__item__heading {
    width: 3.0rem;
  }
  .intro-content__item__desc {
    font-size: 1.1rem;
    line-height: 1.5;
    margin-top: 2.0rem;
  }
  .intro-content__item__more {
    width: calc(144 / 380 * 100%);
    margin-top: 3.0rem;
  }
}



/*  l-lower
--------------------------------------------------*/
.l-lower {
  position: relative;
}
.lower-nav {
  position: sticky;
  top: 0;
  left: 0;
  width: 8.0rem;
  height: 100svh;
  grid-template-rows: 1fr 1fr;
  border-right: 1px solid rgba(var(--white-rgb), 0.2);
  z-index: 2;
}
.lower-nav__box {
  width: 100%;
  padding-block: 3.0rem;
}
.lower-nav__box + .lower-nav__box {
  border-top: solid 1px rgba(var(--white-rgb), 0.2);
}
.lower-nav__caption {
  position: relative;
  width: 100%;
  height: 100%;
}
.lower-nav__caption__item {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  /* right: 0; */
  margin-inline: auto;
  width: 100%;
  height: 100%;
  font-size: 1.4rem;
  line-height: 1.45;
  letter-spacing: .2em;
  color: rgba(var(--white-rgb), 0.6);
  text-align: center;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 1s ease;
  will-change: opacity;
}
.lower-nav__caption__item.active {
  opacity: 1;
}
/* .lower-nav__caption__item span {
  display: inline-block;
  word-break: keep-all;
  white-space: nowrap;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  transform: rotate(90deg) translateX(50%);
  transform-origin: center center;
} */
.lower-nav__pagename {
  position: relative;
  width: 100%;
}
.lower-nav__pagename__item {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin-inline: auto;
  opacity: 0;
  pointer-events: none;
  transition: opacity 1s ease;
  will-change: opacity;
}
.lower-nav__pagename__item.active {
  opacity: 1;
}
.lower-nav__pagename__item__num {
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-align: center;
  color: var(--white);
  margin-bottom: 2.0rem;
}
.lower-nav__pagename__item__ttl {
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: .1em;
  color: var(--white);
  writing-mode: vertical-lr;
  -webkit-text-orientation: sideways;
  text-orientation: sideways;
}
.lower-nav__pagenation {
  width: 100%;
  gap: 1.4rem;
}
.lower-nav__pagenation__item {
  display: block;
  width: 1.0rem;
  height: 1.0rem;
  border-radius: 50%;
  background-color: rgba(var(--white-rgb), 0.3);
  transition: background-color 1s ease;
  will-change: background-color;
  outline: none;
}
.lower-nav__pagenation__item:focus {
  outline: none;
}
.lower-nav__pagenation__item:focus-visible {
  outline: auto;
}
.lower-nav__pagenation__item.active {
  background-color: var(--color-gold);
}
.lower-contents {
  position: relative;
  padding-top: 50svh;
}
.lower-contents + .lower-contents {
  padding-top: 150svh;
}
.lower-contents:last-child {
  padding-bottom: 10.0rem;
}
.lower-contents__bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: clip;
  pointer-events: none;
  opacity: 0;
  transition: opacity 1s ease;
  z-index: 0;
}
.lower-contents__bg.active {
  opacity: 1;
}
.lower-contents__bg::after {
  content: '';
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: rgba(var(--black-rgb), 0.5);
  opacity: 0;
  transition: opacity 1s ease;
}
.lower-contents__bg.dark::after {
  opacity: 1;
}
.lower-contents__bg__photo {
  position: relative;
  width: 100%;
  height: 100%;
  will-change: filter; 
}
.lower-contents__bg__photo img {
  object-fit: cover;
  object-position: center center;
  width: 100%;
  height: 100%;
  transform: scale(1.1) translateX(-5%);
  transform-origin: center center;
  will-change: transform; 
}
.lower-contents[data-name="l-location"] .lower-contents__bg__photo img {
  object-position: center bottom;
}
.lower-contents__detail {
  position: relative;
  height: 150svh;
  box-sizing: content-box;
  z-index: 1;
}
.lower-contents__detail__content {
  width: min(calc(1700 / 1920 * 100%),1700px);
  padding-left: 8.0rem;
  margin-inline: auto;
  gap: 6.0rem;
}
.lower-contents__detail__head {
  position: relative;
  gap: 3.0rem 9.0rem;
  margin-top: -1.6rem;
}
.lower-contents__detail__head__num {  
  font-size: 6.7rem;
  font-weight: 300;
  letter-spacing: .04em;
  line-height: 1.2;
  color: var(--white); 
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline; 
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  background-image: linear-gradient(90deg, rgba(var(--white-rgb), 0.6) 0%, rgba(var(--white-rgb), 0.7) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 10%, transparent 90%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 0%, #000 10%, transparent 90%, transparent 100%);
  -webkit-mask-size: 100% 500%;
  mask-size: 100% 500%;
  -webkit-mask-position: 0 100%;
  mask-position: 0 100%;
  will-change: mask-position, -webkit-mask-position;
}
.lower-contents__detail__head__ttl {
  font-size: 12.4rem;
  font-weight: 300;
  letter-spacing: .06em;
  line-height: 1.2;
  color: var(--white); 
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline; 
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  background-image: linear-gradient(90deg, rgba(var(--white-rgb), 0.6) 0%, rgba(var(--white-rgb), 0) 133.08%);
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 10%, transparent 90%, transparent 100%);
  mask-image: linear-gradient(90deg, #000 0%, #000 10%, transparent 90%, transparent 100%);
  -webkit-mask-size: 500% 100%;
  mask-size: 500% 100%;
  -webkit-mask-position: 100% 0;
  mask-position: 100% 0;
  will-change: mask-position, -webkit-mask-position;
  margin-top: -.7rem;
}
.lower-contents__detail__main {
  width: 52.0rem;
  opacity: 0;
}
.lower-contents__detail__main__heading {
  font-size: 3.0rem;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: .1em;
  color: var(--white);
}
.lower-contents__detail__main__desc {
  font-size: 1.6rem;
  line-height: 2.38;
  letter-spacing: .1em;
  color: var(--white);
  margin-top: 4.0rem;
}
.lower-contents__detail__main__desc small {
  font-size: max(1.1rem,10px);
  line-height: 1.81818182;
  letter-spacing: .1em;
}
.lower-contents__detail__main__desc sup {
  vertical-align: middle;
}
.lower-contents__detail__main__more {
  width: min(100%,220px);
  margin-inline: 0 auto;
  margin-top: 4.5rem;
}
@media screen and (min-width: 769px) {
  :root .lower-contents__detail {
    align-items: flex-start;
    padding-top: 50svh;
  }
  :root .lower-contents__detail__content {
    position: sticky;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
  }
}
@media screen and (max-width: 1700px) and (min-width: 769px) {
  :root .lower-contents__detail__content {
    gap: 6.0rem 4.0rem;
  }
  :root .lower-contents__detail__head {
    gap: 3.0rem 5.0rem;
  }
  :root .lower-contents__detail__head__ttl {
    font-size: 10.4rem;
  }
}
@media screen and (max-width: 1300px) and (min-width: 769px) {
  :root .lower-contents__detail__content {
    width: min(calc(1200 / 1920 * 100%), 1700px);
    flex-direction: column;
  }
  :root .lower-contents__detail__head {
    flex-direction: column;
  }
  :root .lower-contents__detail__main {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .lower-nav {
    width: 4.8rem;
    height: 100lvh;
  }
  .lower-nav__box {
    padding-block: 5.0rem 2.0rem;
  }
  .lower-nav__box + .lower-nav__box {
    padding-block: 2.0rem calc(4.0rem + 46px);
  }
  .lower-nav__caption__item {
    font-size: 1.0rem;
  }
  .lower-nav__pagename__item__num {
    font-size: 1.2rem;
    margin-bottom: 1.2rem;
  }
  .lower-nav__pagename__item__ttl {
    font-size: 1.2rem;
  }
  .lower-nav__pagenation {
    width: 100%;
    gap: 1.0rem;
  }
  .lower-nav__pagenation__item {
    width: .8rem;
    height: .8rem;
  }
  .lower-contents {
    padding-top: 0;
    padding-bottom: 12.0rem;
  }
  .lower-contents + .lower-contents {
    padding-top: 100lvh;
  }
  .lower-contents:last-child {
    padding-bottom: 12.0rem;
  }
  .lower-contents__detail {
    height: 100lvh;
  }
  .lower-contents__detail__content {
    width: calc(290 / 380 * 100%);
    padding-left: 4.8rem;
    gap: 8.0rem 0;
  }
  .lower-contents__detail__head {
    width: 100%;
    gap: .5rem 0;
    margin-top: 0;
    flex-direction: column !important;
  }
  .lower-contents__detail__head__num {  
    font-size: 2.2rem;
    background-image: linear-gradient(90deg, rgba(var(--white-rgb), 0.7) 0%, rgba(var(--white-rgb), 0.7) 100%);
  }
  .lower-contents__detail__head__ttl {
    font-size: 4.2rem;
    background-image: linear-gradient(90deg, rgba(var(--white-rgb), 0.8) 0%, rgba(var(--white-rgb), 0.5) 100%);
    margin-top: 0;
  }
  .lower-contents__detail__main {
    width: 100%;
  }
  .lower-contents__detail__main__heading {
    font-size: 1.8rem;
  }
  .lower-contents__detail__main__desc {
    font-size: 1.2rem;
    line-height: 1.93;
    margin-top: 2.2rem;
  }
  .lower-contents__detail__main__desc small {
    font-size: 1.0rem;
  }
  .lower-contents__detail__main__more {
    width: calc(140 / 284 * 100%);
    margin-top: 3.0rem;
  }
}




/*  l-flow
--------------------------------------------------*/
.l-flow {
  position: relative;
  padding-block: 16.0rem;
}
.flow-inner {
  max-width: 1704px;
  z-index: 1;
}
.flow-enTtl {
  font-size: max(10px,1.4rem);
  letter-spacing: .1em;
  font-weight: 500;
  color: rgba(13, 11, 2, 0.5);
  text-align: center;
  margin-bottom: 1.2rem;
}
.flow-jpTtl {
  font-size: 2.4rem;
  line-height: 1.6;
  letter-spacing: .1em;
  color: var(--base-color);
  text-align: center;
}
.flow-contents {
  position: relative;
  width: 100%;
  margin-top: 8.0rem;
}
.flow-item {
  position: relative;
  width: calc(520 / 1704 * 100%);
  padding: calc(40 / 1704 * 100%) calc(40 / 1704 * 100%) calc(40 / 1704 * 100%);
  background: rgba(var(--white-rgb), 0.3);
}
.flow-item + .flow-item::before {
  content: '';
  position: absolute;
  left: calc(-50 / 520 * 100%);
  top: 50%;
  transform: translate(0,-50%) rotate(45deg) skew(5deg, 5deg);
  width: 20px;
  height: 20px;
  border-top: 1px solid var(--base-color);
  border-right: 1px solid var(--base-color);
}
.flow-item__head {
  width: 100%;
  gap: 0 3.0rem;
}
.flow-item__head__num {
  width: 3.2rem;
}
.flow-item__head__heading {
  flex: 1;
  font-size: clamp(1.6rem, 0.7304rem + 0.8696vw, 2.4rem);
  line-height: 1.45;
  letter-spacing: 0;
  color: var(--base-color);
}
.flow-item__box {
  width: 100%;
}
.flow-item__box__desc {
  font-size: 1.8rem;
  line-height: 1.6;
  letter-spacing: .05em;
  color: var(--base-color);
  padding-top: 2.5rem;
  margin-top: 2.5rem;
  border-top: solid 1px rgba(var(--base-color-rgb),0.3);
}
.flow-item__box__list {
  margin-top: 1.2rem;
}
.flow-item__box__list__desc {
  font-size: 1.8rem;
  line-height: 2;
  color: var(--base-color);
  letter-spacing: .05em;
}
.flow-item__box__list__desc span {
  font-weight: 700;
  color: #9D783C;
}
.flow-item__btn {
  position: relative;
  width: 100%;
  height: 8.0rem;
  font-size: clamp(1.6rem, 1.1652rem + 0.4348vw, 2rem);
  line-height: 1;
  text-align: center;
  letter-spacing: 0;
  margin-top: auto;
  color: var(--base-color);
  background-color: var(--color-gold);
}
.flow-item__btn[data-name="flow"] {
  color: #FFFFFF;
  background-color: rgba(var(--black-rgb), 0.8);
}
.flow-item__btn[data-blank="blank-black"] {
  padding-right: 3.0rem;
}
.flow-item__btn[data-blank="blank-black"]::after {
  content: '';
  position: absolute;
  right: 1.8rem;
  top: 50%;
  transform: translateY(-50%);
  width: 2.0rem;
  aspect-ratio: 1 / 1;
  background: url(../imgs/common/icon_blank_black.svg) no-repeat center center/cover;
}
.flow-item__btn[data-blank="blank-white"]::after {
  content: '';
  position: absolute;
  right: 1.8rem;
  top: 50%;
  transform: translateY(-50%);
  width: 2.0rem;
  aspect-ratio: 1 / 1;
  background: url(../imgs/common/icon_blank_white.svg) no-repeat center center/cover;
}
.flow-outro {
  margin-top: 6.0rem;
}
.flow-outro__desc {
  font-size: 2.0rem;
  line-height: 2;
  text-align: center;
  letter-spacing: 0;
  color: var(--black);
  margin-bottom: 3.0rem;
}
.flow-outro__btn {
  width: min(100%,440px);
  margin-inline: auto;
}
@media screen and (min-width: 769px) {
  [data-num="item1"] .flow-item__head ,
  [data-num="item3"] .flow-item__head {
    margin-top: 1.8rem;
  }
}
@media screen and (max-width: 768px) {
  .l-flow {
    padding-block: 10.0rem;
  }
  .flow-inner {
    max-width: 560px;
  }
  .flow-enTtl {
    font-size: 1.3rem;
  }
  .flow-jpTtl {
    font-size: 1.9rem;
    letter-spacing: .05em;
  }
  .flow-contents {
    margin-top: 5.0rem;
    gap: 4.0rem 0;
  }
  .flow-item {
    width: 100%;
    margin-inline: auto;
    padding: calc(30 / 340 * 100%) calc(20 / 340 * 100%) calc(30 / 340 * 100%);
  }
  .flow-item + .flow-item::before {
    left: 50%;
    top: 0;
    margin-top: -3.1rem;
    transform: translate(-50%,0) rotate(135deg) skew(5deg, 5deg);
    width: 1.4rem;
    height: 1.4rem;
  }
  .flow-item__head {
    gap: 0 2.0rem;
  }
  .flow-item__head__num {
    width: 2.7rem;
  }
  .flow-item__head__heading {
    font-size: 2.0rem;
    line-height: 1.6;
  }
  [data-num="item2"] .flow-item__head__heading {
    font-size: 1.7rem;
  }
  .flow-item__box__desc {
    font-size: 1.4rem;
    line-height: 1.6;
    padding-top: 1.5rem;
    margin-top: 1.5rem;
  }
  .flow-item__box__list__desc {
    font-size: 1.6rem;
  }
  .flow-item__btn {
    width: calc(260 / 300 * 100%);
    height: auto;
    padding-block: 1.9rem 2.0rem;
    margin-inline: auto;
    font-size: 1.6rem;
    line-height: 1.25;
    margin-top: 2.0rem;
  }
  .flow-item__btn[data-blank="blank-gold"] ,
  .flow-item__btn[data-blank="blank-black"] ,
  .flow-item__btn[data-blank="blank-white"] {
    letter-spacing: -.1em;
    padding-right: 1.0em;
  }
  .flow-item__btn[data-blank="blank-gold"]::after ,
  .flow-item__btn[data-blank="blank-black"]::after ,
  .flow-item__btn[data-blank="blank-white"]::after {
    width: 1.2rem;
  }
  .flow-outro {
    margin-top: 4.0rem;
  }
  .flow-outro__desc {
    font-size: 1.6rem;
    text-align: left;
  }
  .flow-outro__btn {
    width: 100%;
  }
}