.aboutSection {
  position: relative;
}
@media screen and (min-width: 768px) {
  .aboutSection {
    padding: 14rem 0;
  }
}
@media screen and (max-width: 768px) {
  .aboutSection {
    padding: 10rem 0;
  }
}
.aboutSection.is-active .aboutSection__copy > .aboutSection__txt,
.aboutSection.is-active .aboutSection__visual {
  filter: blur(10px);
  opacity: 0;
  transition-delay: 0s;
}
.aboutSection.is-active .aboutSection__modal {
  filter: blur(0);
  opacity: 1;
  transition-delay: 0.4s;
  visibility: visible;
}
.aboutSection__head {
  text-align: center;
}
@media screen and (min-width: 768px) {
  .aboutSection__head + .aboutSection__cont {
    margin-top: 8rem;
  }
}
@media screen and (max-width: 768px) {
  .aboutSection__head + .aboutSection__cont {
    margin-top: 5.6rem;
  }
}
.aboutSection__copy {
  position: relative;
}
.aboutSection__txt {
  line-height: 2.2;
}
.aboutSection__txt::before {
  content: "";
  margin-top: calc((1 - 2.2) * 0.5em);
}
.aboutSection__txt::after {
  margin-bottom: calc((1 - 2.2) * 0.5em);
}
.aboutSection__txt::before, .aboutSection__txt::after {
  content: "";
  display: block;
  height: 0;
  width: 0;
}
.aboutSection__txt {
  color: rgba(238, 238, 238, 0.8);
  letter-spacing: 0.05em;
  text-align: center;
  transition: 1s ease 0.4s;
  transition-property: opacity, filter;
}
@media screen and (min-width: 768px) {
  .aboutSection__txt {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 768px) {
  .aboutSection__txt {
    font-size: 1.4rem;
  }
}
.aboutSection__cont {
  display: flex;
  flex-direction: column;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .aboutSection__cont {
    gap: 8rem;
    margin: 0 auto;
    width: 55rem;
  }
}
@media screen and (max-width: 768px) {
  .aboutSection__cont {
    gap: 5.6rem;
    margin: 0 -1.2rem;
  }
}
.aboutSection__visual {
  transition: 1s ease 0.4s;
  transition-property: opacity, filter;
}
.aboutSection__readMore {
  align-items: center;
  color: #EEE;
  cursor: pointer;
  display: flex;
  font-size: 1.4rem;
  gap: 1rem;
  letter-spacing: 0.1em;
  line-height: 0.7;
  margin: 0 auto;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (min-width: 768px) {
  .aboutSection__readMore {
    margin-top: 4rem;
  }
}
@media screen and (max-width: 768px) {
  .aboutSection__readMore {
    margin-top: 5.6rem;
  }
}
@media screen and (min-width: 768px) {
  .aboutSection__readMore:hover .icon {
    background-color: rgba(255, 255, 255, 0.2);
    transform: rotate(90deg);
  }
}
@media (hover: hover) and (pointer: fine) {
  .aboutSection__readMore:hover .icon {
    background-color: rgba(255, 255, 255, 0.2);
    transform: rotate(90deg);
  }
}
.aboutSection__readMore .icon {
  align-items: center;
  aspect-ratio: 1/1;
  background-color: rgba(217, 217, 217, 0.15);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  transition: 0.6s ease;
  transition-property: background-color, transform;
}
@media screen and (min-width: 768px) {
  .aboutSection__readMore .icon {
    width: 3.3rem;
  }
}
@media screen and (max-width: 768px) {
  .aboutSection__readMore .icon {
    width: 3.3rem;
  }
}
.aboutSection__readMore .icon .plusIcon {
  aspect-ratio: 1/1;
  height: auto;
  width: 1.4rem;
}
.aboutSection__modal {
  align-items: center;
  display: flex;
  filter: blur(10px);
  flex-direction: column;
  height: auto;
  left: 0;
  min-height: 100%;
  opacity: 0;
  position: absolute;
  top: 0;
  transition: 1s ease;
  transition-property: opacity, filter, visibility;
  visibility: hidden;
  width: 100%;
  z-index: 10;
}
@media screen and (min-width: 768px) {
  .aboutSection__modal {
    gap: 4rem;
  }
}
@media screen and (max-width: 768px) {
  .aboutSection__modal {
    gap: 5.6rem;
  }
}
.aboutSection__close {
  align-items: center;
  color: #EEE;
  cursor: pointer;
  display: flex;
  font-size: 1.4rem;
  gap: 1rem;
  letter-spacing: 0.1em;
  line-height: 0.7;
  margin: 0 auto;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (min-width: 768px) {
  .aboutSection__close:hover .icon {
    background-color: rgba(255, 255, 255, 0.2);
    transform: rotate(90deg);
  }
}
@media (hover: hover) and (pointer: fine) {
  .aboutSection__close:hover .icon {
    background-color: rgba(255, 255, 255, 0.2);
    transform: rotate(90deg);
  }
}
.aboutSection__close .icon {
  align-items: center;
  aspect-ratio: 1/1;
  background-color: rgba(217, 217, 217, 0.15);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  transition: 0.6s ease;
  transition-property: background-color, transform;
}
@media screen and (min-width: 768px) {
  .aboutSection__close .icon {
    width: 3.3rem;
  }
}
@media screen and (max-width: 768px) {
  .aboutSection__close .icon {
    width: 3.3rem;
  }
}
.aboutSection__close .closeIcon {
  aspect-ratio: 1/1;
  height: auto;
  width: 1.4rem;
}
.aboutSection__scrollGuide {
  background-color: #555;
  display: block;
  position: relative;
  width: 1px;
}
@media screen and (min-width: 768px) {
  .aboutSection__scrollGuide {
    height: 13.1rem;
    margin-top: 4rem;
  }
}
@media screen and (max-width: 768px) {
  .aboutSection__scrollGuide {
    height: 12rem;
    margin-top: 2.4rem;
  }
}
.aboutSection__scrollGuide .current {
  animation: scroll-indicator 4s cubic-bezier(0.9, -0.01, 0.31, 1.01) 0.8s infinite forwards running;
  background-color: #EEE;
  filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transform-origin: top;
  width: 1px;
}
.aboutSection .decorationTitle__inner {
  color: #999;
}
.aboutSection .decorationTitle__inner:after {
  background-color: #555;
}

@keyframes scroll-indicator {
  0% {
    transform: scaleY(0);
    transform-origin: top;
  }
  50% {
    transform: scaleY(1);
    transform-origin: top;
  }
  51% {
    transform: scaleY(1);
    transform-origin: bottom;
  }
  100% {
    transform: scaleY(0);
    transform-origin: bottom;
  }
}
.contentsGroup {
  position: relative;
}
.contentsGroup .decorationTitle {
  color: rgba(224, 202, 172, 0.9);
}
.contentsGroup .decorationTitle__inner:after {
  background-color: rgba(224, 202, 172, 0.3);
}

.contentsSection {
  position: relative;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .contentsSection {
    margin: 0 auto;
    padding: 14rem 0 25.6rem;
  }
}
@media screen and (max-width: 768px) {
  .contentsSection {
    padding-bottom: 10rem;
  }
}
.contentsSection:after {
  background: no-repeat 50% 0/cover;
  content: "";
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  z-index: -1;
}
@media screen and (min-width: 768px) {
  .contentsSection:after {
    aspect-ratio: 1440/394;
    background-image: url("../imgs/pc/bg-contents@2x.png");
    margin-left: -12rem;
    margin-right: -12rem;
  }
}
@media screen and (max-width: 768px) {
  .contentsSection:after {
    aspect-ratio: 390/232;
    background-image: url("../imgs/sp/bg-contents.png");
    margin-left: -3.2rem;
    margin-right: -3.2rem;
  }
}
@media screen and (max-width: 768px) {
  .contentsSection__head {
    padding: 5.6rem 0 12rem;
    position: relative;
  }
}
@media screen and (min-width: 768px) {
  .contentsSection__head + .contentsSection__cont {
    margin-top: 20rem;
  }
}
@media screen and (min-width: 768px) {
  .contentsSection__head + .contentsSection__cont + .contentsSection__bottom {
    margin-top: 15.1rem;
  }
}
@media screen and (max-width: 768px) {
  .contentsSection__head + .contentsSection__cont + .contentsSection__bottom {
    margin-top: 8rem;
  }
}
@media screen and (min-width: 768px) {
  .contentsSection__head .txt {
    font-size: 1.8rem;
  }
}
.contentsSection__cont {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 768px) {
  .contentsSection__cont {
    gap: 12rem;
  }
}
@media screen and (max-width: 768px) {
  .contentsSection__cont {
    gap: 8rem;
  }
}
.contentsSection__bottom {
  border: 1px solid rgba(224, 202, 172, 0.3);
  color: rgba(238, 238, 238, 0.8);
}
@media screen and (min-width: 768px) {
  .contentsSection__bottom {
    margin: 11.8rem auto 0;
    padding: 5.6rem 1.6rem;
    text-align: center;
    width: 86.7rem;
  }
}
@media screen and (max-width: 768px) {
  .contentsSection__bottom {
    margin-top: 3.2rem;
    padding: 2.4rem 1.6rem;
  }
}
@media screen and (min-width: 768px) {
  .contentsSection__bottom .txt {
    font-size: 1.8rem;
  }
}

@media screen and (min-width: 768px) {
  .contentsCard {
    align-items: flex-start;
    display: flex;
    justify-content: center;
  }
}
@media screen and (min-width: 768px) {
  .contentsCard:nth-child(odd) {
    flex-direction: row-reverse;
    gap: 11.2rem;
  }
}
@media screen and (min-width: 768px) {
  .contentsCard:nth-child(even) {
    gap: 12.6rem;
  }
}
@media screen and (min-width: 768px) {
  .contentsCard:nth-child(2) .contentsCard__visual .photo:nth-child(1) {
    width: 44.5rem;
  }
}
@media screen and (max-width: 768px) {
  .contentsCard:nth-child(2) .contentsCard__visual .photo:nth-child(1) {
    width: 28rem;
  }
}
.contentsCard:nth-child(2) .contentsCard__visual .photo:nth-child(1) .photo__capIn {
  left: 0;
  right: auto;
}
@media screen and (min-width: 768px) {
  .contentsCard:nth-child(2) .contentsCard__visual .photo:nth-child(2) {
    margin: -7.7rem 0 0 auto;
    width: 20rem;
  }
}
@media screen and (max-width: 768px) {
  .contentsCard:nth-child(2) .contentsCard__visual .photo:nth-child(2) {
    margin: -2.3rem 0 0 auto;
    width: 15.1rem;
  }
}
@media screen and (min-width: 768px) {
  .contentsCard__visual {
    width: 52.8rem;
  }
}
@media screen and (max-width: 768px) {
  .contentsCard__visual + .contentsCard__description {
    margin-top: 2.4rem;
  }
}
@media screen and (min-width: 768px) {
  .contentsCard__description {
    width: 30.6rem;
  }
}

.presentationSection__head {
  position: relative;
  z-index: 2;
}
@media screen and (min-width: 768px) {
  .presentationSection__head {
    margin: 0 -12rem;
    width: 144rem;
  }
}
@media screen and (max-width: 768px) {
  .presentationSection__head {
    margin: 0 -3.2rem;
  }
}
@media screen and (max-width: 768px) {
  .presentationSection__head .parallaxPhoto {
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  .presentationSection .subSect {
    display: flex;
    flex-wrap: wrap;
    gap: 5.6rem 16rem;
    justify-content: center;
    padding: 5.6rem 0 12rem;
  }
}
@media screen and (max-width: 768px) {
  .presentationSection .subSect {
    padding: 4rem 0 8rem;
  }
}
.presentationSection .subSect__head {
  align-items: flex-start;
  display: flex;
}
@media screen and (min-width: 768px) {
  .presentationSection .subSect__head {
    order: 2;
    width: 59.2rem;
  }
}
@media screen and (max-width: 768px) {
  .presentationSection .subSect__head {
    flex-wrap: wrap;
    gap: 1.6rem;
    justify-content: center;
  }
}
@media screen and (max-width: 768px) {
  .presentationSection .subSect__head + .subSect__cont {
    margin-top: 4rem;
  }
}
@media screen and (max-width: 768px) {
  .presentationSection .subSect__head .photo {
    width: 15.5rem;
  }
}
@media screen and (min-width: 768px) {
  .presentationSection .subSect__head .photo:nth-child(1) {
    margin: 20.4rem -16rem 0 auto;
    width: 29.7rem;
    z-index: 1;
  }
}
@media screen and (min-width: 768px) {
  .presentationSection .subSect__head .photo:nth-child(2) {
    width: 45.5rem;
  }
}
@media screen and (min-width: 768px) {
  .presentationSection .subSect__cont {
    width: 34rem;
  }
}
@media screen and (min-width: 768px) {
  .presentationSection .subSect__cont .heading {
    font-size: 2.2rem;
  }
}
@media screen and (max-width: 768px) {
  .presentationSection .subSect__cont .heading {
    font-size: 2rem;
  }
}

.cornerSection {
  position: relative;
}
@media screen and (min-width: 768px) {
  .cornerSection {
    padding: 16rem 0;
  }
}
@media screen and (max-width: 768px) {
  .cornerSection {
    padding: 10rem 0;
  }
}
.cornerSection__body {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 768px) {
  .cornerSection__body {
    gap: 12rem;
  }
}
@media screen and (max-width: 768px) {
  .cornerSection__body {
    gap: 8rem;
  }
}
.cornerSection__item {
  display: flex;
}
@media screen and (min-width: 768px) {
  .cornerSection__item {
    justify-content: center;
  }
}
@media screen and (min-width: 768px) {
  .cornerSection__item:nth-child(1) {
    gap: 4rem;
  }
}
@media screen and (max-width: 768px) {
  .cornerSection__item:nth-child(1) {
    flex-direction: column;
    gap: 3.2rem;
  }
}
.cornerSection__item:nth-child(2) {
  flex-direction: row-reverse;
}
@media screen and (min-width: 768px) {
  .cornerSection__item:nth-child(2) {
    gap: 15.2rem;
  }
}
@media screen and (max-width: 768px) {
  .cornerSection__item:nth-child(2) {
    gap: 2.6rem;
  }
}
@media screen and (max-width: 768px) {
  .cornerSection__item:nth-child(2) .cornerSection__visual {
    width: 13rem;
  }
}
@media screen and (max-width: 768px) {
  .cornerSection__item:nth-child(2) .cornerSection__description {
    width: 17rem;
  }
}
@media screen and (min-width: 768px) {
  .cornerSection__visual {
    width: 53.1rem;
  }
}
@media screen and (min-width: 768px) {
  .cornerSection__description {
    width: 30.6rem;
  }
}

.conceptSection {
  color: #111;
}
@media screen and (min-width: 768px) {
  .conceptSection {
    padding: 5.6rem 0;
  }
}
@media screen and (max-width: 768px) {
  .conceptSection {
    padding: 8rem 0;
  }
}
.conceptSection__head {
  align-items: center;
  display: flex;
  flex-direction: column;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .conceptSection__head {
    gap: 6rem;
  }
}
@media screen and (max-width: 768px) {
  .conceptSection__head {
    gap: 5.6rem;
    margin: 0 -3.2rem;
  }
}
@media screen and (min-width: 768px) {
  .conceptSection__head + .conceptSection__cont {
    margin-top: 6rem;
  }
}
@media screen and (max-width: 768px) {
  .conceptSection__head + .conceptSection__cont {
    margin-top: 8rem;
  }
}
@media screen and (min-width: 768px) {
  .conceptSection__head .photo {
    width: 20rem;
  }
}
@media screen and (max-width: 768px) {
  .conceptSection__head .photo {
    width: 15.5rem;
  }
}
@media screen and (min-width: 768px) {
  .conceptSection__head .heading {
    font-size: 2.2rem;
  }
}
.conceptSection__head .txt {
  line-height: 2.2;
}
.conceptSection__head .txt::before {
  content: "";
  margin-top: calc((1 - 2.2) * 0.5em);
}
.conceptSection__head .txt::after {
  margin-bottom: calc((1 - 2.2) * 0.5em);
}
.conceptSection__head .txt::before, .conceptSection__head .txt::after {
  content: "";
  display: block;
  height: 0;
  width: 0;
}

.resultSection {
  position: relative;
}
@media screen and (min-width: 768px) {
  .resultSection {
    padding: 12rem 0;
  }
}
@media screen and (max-width: 768px) {
  .resultSection {
    padding: 10rem 0 4rem;
  }
}
.resultSection__head {
  display: flex;
  flex-direction: column;
  position: relative;
}
@media screen and (min-width: 768px) {
  .resultSection__head {
    gap: 4rem;
  }
}
@media screen and (max-width: 768px) {
  .resultSection__head {
    gap: 1.6rem;
  }
}
.resultSection__head:before, .resultSection__head:after {
  border-bottom: 0.1rem solid rgba(224, 202, 172, 0.5);
  border-top: 0.2rem solid rgba(224, 202, 172, 0.3);
  content: "";
  height: 0.6rem;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .resultSection__head + .resultSection__cont {
    margin-top: 12.8rem;
  }
}
@media screen and (max-width: 768px) {
  .resultSection__head + .resultSection__cont {
    margin-top: 8rem;
  }
}
.resultSection__cont {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 3;
}
@media screen and (min-width: 768px) {
  .resultSection__cont {
    gap: 9.2rem;
  }
}
@media screen and (max-width: 768px) {
  .resultSection__cont {
    gap: 8rem;
  }
}
.resultSection .decorationTitle {
  color: rgba(224, 202, 172, 0.9);
}
.resultSection .decorationTitle__inner:after {
  background-color: rgba(224, 202, 172, 0.3);
}

.mainVisual {
  overflow: hidden;
  position: relative;
}
.mainVisual__desc {
  align-items: flex-end;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
  display: flex;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .mainVisual__desc {
    padding: 10rem 8rem 8.3333333333vh;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__desc {
    padding: 5.6rem 2rem;
  }
}
.mainVisual__title {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 768px) {
  .mainVisual__title {
    gap: 5.6rem;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__title {
    gap: 3.2rem;
  }
}
.mainVisual__title .ja {
  color: #EEE;
  letter-spacing: 0.08em;
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.6);
}
@media screen and (min-width: 768px) {
  .mainVisual__title .ja {
    line-height: 1.5;
  }
  .mainVisual__title .ja::before {
    content: "";
    margin-top: calc((1 - 1.5) * 0.5em);
  }
  .mainVisual__title .ja::after {
    margin-bottom: calc((1 - 1.5) * 0.5em);
  }
  .mainVisual__title .ja::before, .mainVisual__title .ja::after {
    content: "";
    display: block;
    height: 0;
    width: 0;
  }
  .mainVisual__title .ja {
    font-size: 3.6rem;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__title .ja {
    line-height: 1.8;
  }
  .mainVisual__title .ja::before {
    content: "";
    margin-top: calc((1 - 1.8) * 0.5em);
  }
  .mainVisual__title .ja::after {
    margin-bottom: calc((1 - 1.8) * 0.5em);
  }
  .mainVisual__title .ja::before, .mainVisual__title .ja::after {
    content: "";
    display: block;
    height: 0;
    width: 0;
  }
  .mainVisual__title .ja {
    font-size: 2.4rem;
  }
}
.mainVisual__title .en {
  color: rgba(238, 238, 238, 0.5);
  font-family: "EB Garamond", serif;
  letter-spacing: 0.11em;
  line-height: 0.7;
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.6);
}
@media screen and (min-width: 768px) {
  .mainVisual__title .en {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__title .en {
    font-size: 1.6rem;
  }
}
.mainVisual__bg {
  height: 100dvh;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.mainVisual__slider {
  height: 100%;
  position: relative;
  width: 100%;
}
.mainVisual__card {
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  overflow: hidden;
  position: absolute;
}
.mainVisual__card:first-child {
  opacity: 1;
  position: static;
}
.mainVisual__card .photo__image {
  -o-object-position: center;
     object-position: center;
  will-change: transform;
}
.mainVisual__pauseBtn {
  align-items: center;
  background: none;
  border: none;
  color: #B0ACA2;
  cursor: pointer;
  display: flex;
  justify-content: center;
  position: absolute;
  z-index: 10;
}
@media screen and (min-width: 768px) {
  .mainVisual__pauseBtn {
    bottom: 4rem;
    height: 4rem;
    right: 3.2rem;
    width: 4rem;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__pauseBtn {
    bottom: 3.6rem;
    height: 3.2rem;
    right: 2.4rem;
    width: 3.2rem;
  }
}
.mainVisual__pauseBtn:focus {
  outline: 2px solid #4D90FE;
  outline-offset: 2px;
}
.mainVisual__icon {
  display: inline-block;
  width: auto;
}
@media screen and (min-width: 768px) {
  .mainVisual__icon {
    height: 2.8rem;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__icon {
    height: 2.2rem;
  }
}
.mainVisual__icon svg {
  display: block;
  height: 100%;
  width: auto;
}
.mainVisual__icon--play {
  display: none;
}
.mainVisual__icon--pause {
  display: inline-block;
}
.mainVisual__pagination {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: absolute;
  top: 50%;
  transform: translate(-50%, 0);
  z-index: 10;
}
@media screen and (min-width: 768px) {
  .mainVisual__pagination {
    gap: 1.7rem;
    right: 4.8rem;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__pagination {
    gap: 1.7rem;
    right: 2.2rem;
  }
}
.mainVisual__paginationBullet {
  background-color: rgba(238, 238, 238, 0.5);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  height: 0.8rem;
  padding: 0;
  transition: background-color 0.3s ease, transform 0.3s ease;
  width: 0.8rem;
}
@media screen and (min-width: 768px) {
  .mainVisual__paginationBullet:hover {
    background-color: rgba(255, 255, 255, 0.5);
  }
}
@media (hover: hover) and (pointer: fine) {
  .mainVisual__paginationBullet:hover {
    background-color: rgba(255, 255, 255, 0.5);
  }
}
.mainVisual__paginationBullet:focus {
  outline: 2px solid #4D90FE;
  outline-offset: 2px;
}
.mainVisual__paginationBullet--active {
  background-color: #eee;
  pointer-events: none;
}

.historyTree {
  position: relative;
}
.historyTree__body {
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media screen and (min-width: 768px) {
  .historyTree__body {
    margin: 0 auto;
    row-gap: 3.3rem;
    width: 115.7rem;
  }
}
@media screen and (max-width: 768px) {
  .historyTree__body {
    row-gap: 5.6rem;
  }
}
.historyTree__year {
  color: rgba(255, 255, 255, 0.4);
  font-family: "Cinzel", serif;
  letter-spacing: 0.05em;
  line-height: 0.9;
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.5);
}
@media screen and (min-width: 768px) {
  .historyTree__year {
    border-bottom: 1px solid rgba(224, 202, 172, 0.3);
    font-size: 3.2rem;
    padding-bottom: 0.5rem;
    width: 25%;
  }
}
@media screen and (max-width: 768px) {
  .historyTree__year {
    font-size: 2.4rem;
  }
}
@media screen and (min-width: 768px) {
  .historyTree__description {
    order: 9;
    width: 25%;
  }
}
@media screen and (max-width: 768px) {
  .historyTree__description {
    width: 24rem;
  }
}
.historyTree__list {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 768px) {
  .historyTree__list {
    gap: 5.6rem;
  }
}
@media screen and (max-width: 768px) {
  .historyTree__list {
    gap: 3.2rem;
  }
}
@media screen and (min-width: 768px) {
  .historyTree__list + .caption {
    margin-top: 3.2rem;
  }
}
@media screen and (max-width: 768px) {
  .historyTree__list + .caption {
    margin: 8rem auto 0 -8.6rem;
  }
}
.historyTree__item {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 768px) {
  .historyTree__item {
    gap: 1.4rem;
  }
}
@media screen and (max-width: 768px) {
  .historyTree__item {
    gap: 1rem;
  }
}
.historyTree__item .name {
  line-height: 1.5;
}
.historyTree__item .name::before {
  content: "";
  margin-top: calc((1 - 1.5) * 0.5em);
}
.historyTree__item .name::after {
  margin-bottom: calc((1 - 1.5) * 0.5em);
}
.historyTree__item .name::before, .historyTree__item .name::after {
  content: "";
  display: block;
  height: 0;
  width: 0;
}
.historyTree__item .name {
  color: #FFF;
  letter-spacing: 0.05em;
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.5);
}
@media screen and (min-width: 768px) {
  .historyTree__item .name {
    font-size: 1.4rem;
  }
}
@media screen and (max-width: 768px) {
  .historyTree__item .name {
    font-size: 1.2rem;
  }
}
.historyTree__item .caption {
  font-family: "YakuHanMP", "Shippori Mincho", "Noto Serif JP", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}
@media screen and (min-width: 768px) {
  .historyTree__item .caption {
    font-size: 1.2rem;
  }
}
.historyTree__item .caption[data-color=label] {
  background-color: #111;
}
@media screen and (min-width: 768px) {
  .historyTree__item .caption[data-color=label] {
    font-size: 1.4rem;
  }
}

.resultGallery {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 768px) {
  .resultGallery {
    gap: 3.3rem;
  }
}
@media screen and (max-width: 768px) {
  .resultGallery {
    gap: 5.6rem;
  }
}

.resultCard {
  position: relative;
}
@media screen and (min-width: 768px) {
  .resultCard {
    display: flex;
  }
}
@media screen and (max-width: 768px) {
  .resultCard {
    margin: 0 -1.2rem;
  }
}
.resultCard__year {
  -webkit-background-clip: text;
          background-clip: text;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.2) 100%);
  font-family: "Cinzel", serif;
  letter-spacing: 0.05em;
  line-height: 0.9;
  position: relative;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.5);
}
@media screen and (min-width: 768px) {
  .resultCard__year {
    align-items: center;
    display: flex;
    flex-direction: column;
    font-size: 6.2rem;
    gap: 2.9rem;
    width: 15.6rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard__year {
    font-size: 7rem;
    left: 0;
    left: -1.6rem;
    position: absolute;
    top: 0;
    writing-mode: vertical-rl;
    z-index: 1;
  }
}
.resultCard__year:after {
  background-color: rgba(224, 202, 172, 0.3);
  content: "";
  height: 100%;
  width: 0.2rem;
}
@media screen and (min-width: 768px) {
  .resultCard__visual {
    display: flex;
    flex-wrap: wrap;
    width: calc(100% - 15.6rem);
  }
}
@media screen and (max-width: 768px) {
  .resultCard__visual {
    padding-left: 5.6rem;
  }
}
.resultCard__visualItem {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  position: relative;
}
@media screen and (min-width: 768px) {
  .resultCard__visualItem {
    gap: 1.6rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard__visualItem {
    gap: 0.8rem;
  }
}
.resultCard__visualItem .caption {
  font-family: "YakuHanMP", "Shippori Mincho", "Noto Serif JP", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}
.resultCard__visualItem .caption[data-color=label] {
  background-color: #111;
  font-size: 1rem;
}
@media screen and (min-width: 768px) {
  .resultCard--2022 {
    gap: 13.7rem;
  }
}
@media screen and (min-width: 768px) {
  .resultCard--2022 .resultCard__visual {
    gap: 2rem;
    padding-bottom: 13.7rem;
  }
}
@media screen and (min-width: 768px) {
  .resultCard--2022 .resultCard__visualItem:nth-child(1) {
    width: 48rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard--2022 .resultCard__visualItem:nth-child(1) {
    width: 20.3rem;
  }
}
@media screen and (min-width: 768px) {
  .resultCard--2022 .resultCard__visualItem:nth-child(2) {
    margin-top: 13.2rem;
    width: 28.3rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard--2022 .resultCard__visualItem:nth-child(2) {
    margin: -11.8rem 0 0 auto;
    width: 11.5rem;
  }
}
@media screen and (min-width: 768px) {
  .resultCard--2023 .resultCard__visualItem:nth-child(1) {
    margin-left: 45rem;
    width: 53.7rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard--2023 .resultCard__visualItem:nth-child(1) {
    margin: 0 -2rem 0 auto;
    width: 28.9rem;
  }
}
@media screen and (min-width: 768px) {
  .resultCard--2023 .resultCard__visualItem:nth-child(2) {
    margin: 37rem -6rem 0 -22.4rem;
    width: 33.6rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard--2023 .resultCard__visualItem:nth-child(2) {
    margin-top: 2.4rem;
    width: 19.2rem;
  }
}
@media screen and (min-width: 768px) {
  .resultCard--2023 .resultCard__visualItem:nth-child(3) {
    margin-top: -15.7rem;
    order: 3;
    width: 18.3rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard--2023 .resultCard__visualItem:nth-child(3) {
    margin: 2.3rem -0.4rem 0 auto;
    width: 11.5rem;
  }
}
.resultCard--2023 .resultCard__visualItem:nth-child(3) .caption {
  margin-left: auto;
  text-align: right;
}
@media screen and (min-width: 768px) {
  .resultCard--2023 .resultCard__visualItem:nth-child(4) {
    margin: -37rem 3.1rem 0 -2.2rem;
    width: 27.6rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard--2023 .resultCard__visualItem:nth-child(4) {
    margin-top: -17.4rem;
    width: 15.7rem;
  }
}
@media screen and (min-width: 768px) {
  .resultCard--2024 .resultCard__visual {
    padding-bottom: 11.8rem;
  }
}
@media screen and (min-width: 768px) {
  .resultCard--2024 .resultCard__visualItem:nth-child(1) {
    margin: 12.4rem 0 0 -18.3rem;
    width: 63.9rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard--2024 .resultCard__visualItem:nth-child(1) {
    width: 27.4rem;
  }
}
.resultCard--2024 .resultCard__visualItem:nth-child(2) {
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .resultCard--2024 .resultCard__visualItem:nth-child(2) {
    margin: 12.4rem 0 0 auto;
    width: 38.8rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard--2024 .resultCard__visualItem:nth-child(2) {
    margin: 1.2rem 0 0 auto;
    width: 16.8rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard--2024 .resultCard__visualItem:nth-child(2) .caption {
    margin-left: auto;
    text-align: right;
  }
}
@media screen and (min-width: 768px) {
  .resultCard--2024 .resultCard__visualItem:nth-child(3) {
    margin: -10rem 0 0 27.5rem;
    width: 41.2rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard--2024 .resultCard__visualItem:nth-child(3) {
    margin-top: -6.7rem;
    width: 16.8rem;
    z-index: 2;
  }
}
@media screen and (min-width: 768px) {
  .resultCard--2025 .resultCard__visual {
    align-items: flex-end;
    flex-direction: row-reverse;
    gap: 3rem;
    padding-bottom: 5rem;
  }
}
@media screen and (min-width: 768px) {
  .resultCard--2025 .resultCard__visualItem:nth-child(1) {
    margin: 0 -7rem 2.9rem 0;
    width: 63.9rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard--2025 .resultCard__visualItem:nth-child(1) {
    margin: 0 -2rem 0 auto;
    width: 28.9rem;
  }
}
@media screen and (min-width: 768px) {
  .resultCard--2025 .resultCard__visualItem:nth-child(2) {
    width: 44.5rem;
  }
}
@media screen and (max-width: 768px) {
  .resultCard--2025 .resultCard__visualItem:nth-child(2) {
    margin-top: 2.7rem;
    width: 19rem;
  }
}
/*# sourceMappingURL=style.css.map */