:root {
 --enFont: "Playfair Display", serif;
 --jpFont: "Zen Old Mincho", serif;
 --circleSize: 725px;
 --circleRightPosition: 15px;
 --circleBottomPosition: 0;
}
@media screen and (max-width: 1440px) {
 :root {
  --circleSize: 50dvw;
  /* --circleBottomPosition : 5dvw; */
 }
}
html, body {
 font-family: var(--jpFont);
 font-size: 18px;
}
body {
 display: flow-root;
 overflow-x: clip;
}
.c-section {
 width: 100%;
}

.c-section__inner {
 max-width: 1366px;
 width: 100%;
 margin: auto;
 padding: 100px 0;
}
.loading {
 position: fixed;
 top: 0;
 z-index: 3;
 height: 100dvh;
 width: 100dvw;
 background-color: #201B17;
}
.loading__image {
 max-width: 375px;
 width: 75%;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 -webkit-transform: translate(-50%, -50%);
 -ms-transform: translate(-50%, -50%);
 list-style: none;
 margin: 0;
 padding: 0;
}
.loading__item {
 margin: 0;
}
.loading__item > img {
 width: 100%;
 margin: auto;
}
/**
 * Hero
 ***/
.mainVisual {
 opacity: 1;
 height: 100dvh;
 background-color: rgb(32, 27, 23)
}
.mainVisual__wrapper {
 height: auto;
 width: 100vw;
 display: block;
}
.mainVisual__sitename {
 position: fixed;
 top: 45px;
 left: 45px;
 color: #FFFCF9;
 z-index: 1;
 font-size: 18px;
 font-weight: 600;
}
@media screen and (max-width: 640px) {
 .mainVisual__sitename {
  top: 45px;
  left: 15px;
  font-size: 17px;
 }
}
.mainVisual__catchcopy {
 position: fixed;
 top: 50%;
 left: 3%;
 transform: translateY(-50%);
 -webkit-transform: translateY(-50%);
 -ms-transform: translateY(-50%);
 color: #FFFCF9;
 z-index: 1;
 font-size: 50px;
 line-height: 1.5;
 font-weight: bold;
}
.mainVisual__catchcopySP {
 position: absolute;
 color: #ffffff;
 font-size: 30px;
 line-height: 1.5;
 font-weight: bold;
 bottom: -200px;
 left: 50%;
 transform: translateX(-50%);
 -webkit-transform: translateX(-50%);
 -ms-transform: translateX(-50%);
 width: max-content;
}
@media screen and (max-width: 1440px) {
 .mainVisual__catchcopy {
  font-size: 3dvw;
 }
}
@media screen and (max-width: 640px) {
 .mainVisual__catchcopy {
  display: none;
 }
}
.mainVisual__fixed {
 position: sticky;
 position: -webkit-sticky;
 top: 0;
}
.mainVisual__sliderWrapper {
 position: fixed;
 left: 0;
 width: 66.7%;
 overflow-y: clip;
}
@media screen and (max-width: 640px) {
 .mainVisual__sliderWrapper {
  width: 100%;
 }
}
.mainVisual__sliders {
 display: flex;
 transform: scale(1.25) rotate(-17deg);
 justify-content: flex-end;
}
.mainVisual__sliderColumn {
 position: relative;
 width: calc(100% / 3);
 height: 100vh;
 vertical-align: middle;
 background-color: none;
 padding: 0;
}
.mainVisual__slider {
 position: absolute;
 display: flex;
 list-style: none;
 padding: 0 5px;
 opacity: 1;
}
.mainVisual__slider-up {
 flex-direction: column;
 animation: 35s linear infinite sliderAnimationTop;
}
@keyframes sliderAnimationTop {
 100% {
  transform: translateY(calc((-300px * 5) + 100px));
 }
}
.mainVisual__slider-down {
 top: calc(-275px * 5);
 flex-direction: column-reverse;
 animation: 35s linear infinite sliderAnimationBottom;
}
@keyframes sliderAnimationBottom {
 100% {
  transform: translateY(calc((300px * 5) - 100px));
 }
}
.mainVisual__slide {
 width: 100%;
 height: 250px;
 text-align: center;
 padding: 15px 0;
 opacity: 3;
}
.mainVisual__img {
 width: 100%;
 height: 100%;
 object-fit: cover;
}
.mainVisual__overlay {
 position: fixed;
 width: 100dvw;
 height: 100%;
 background-color: rgba(32, 27, 23, 0.7)
}
.mainVisual__circleWrapper {
 /* --circleRightPosition : -8vw!important;
    --circleBottomPosition : -115px; */
 position: fixed;
 width: var(--circleSize);
 height: var(--circleSize);
 right: var(--circleRightPosition);
 top: 50%;
 /* left: 0%; */
 transform: translateY(-50%);
 -webkit-transform: translateY(-50%);
 -ms-transform: translateY(-50%);
}
.mainVisual__circleSP {
 display: none;
}
@media screen and (max-width: 640px) {
 .mainVisual__circleWrapper {
  display: none;
 }
 .mainVisual__circleSP {
  position: fixed;
  width: 65dvw;
  height: 65dvw;
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  display: block;
 }
 .mainVisual__circleSP > img {
  width: 100%;
 }
}
.mainVisual__circle {
 position: fixed;
 width: var(--circleSize);
 height: var(--circleSize);
 border-radius: 50%;
 display: flex;
 justify-content: center;
 align-items: center;
 right: var(--circleRightPosition);
 bottom: var(--circleBottomPosition);
}
@keyframes anim {
 0% {
  transform: rotate(0deg);
 }
 100% {
  transform: rotate(-360deg);
 }
}
.mainVisual__text {
 width: 100%;
 height: 100%;
 position: absolute;
 animation: anim 30s linear infinite;
 /* font-family: var(--enFont); */
}
@keyframes anim {
 0% {
  transform: rotate(0deg);
 }
 100% {
  transform: rotate(-360deg);
 }
}
.mainVisual__text span {
 position: absolute;
 left: 50%;
 font-size: 55px;
 transform-origin: 0 calc(var(--circleSize) / 2);
 color: #ede5da;
}
@media screen and (max-width: 1440px) {
 .mainVisual__text span {
  font-size: 5dvw;
 }
}
.mainVisual__yamato {
 position: absolute;
 width: 100%;
 height: 100%;
 overflow: hidden;
 animation: rotate_anime 15s linear infinite;
 background-color: #fffcf9;
 border-radius: 50%;
}
@keyframes rotate_anime {
 0% {
  transform: rotate(0deg);
 }
 100% {
  transform: rotate(-360deg);
 }
}
.mainVisual__yamato > img {
 width: 100%;
 height: 100%;
}
.mainVisual__75th {
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 -webkit-transform: translate(-50%, -50%);
 -ms-transform: translate(-50%, -50%);
 width: calc(var(--circleSize) - 50%);
 height: calc(var(--circleSize) - 50%);
}
.mainVisual__75th > img {
 width: 100%;
 height: 100%;
}
/**
 * Message
 ***/
.message {
 position: relative;
 height: 100dvh;
 background-image: url('../images/message_bg.jpg');
 background-attachment: fixed;
 background-size: cover;
 background-position: 0 0;
 background-repeat: no-repeat;
 /* opacity: 0.8; */
}
@media screen and (max-width: 640px) {
 .message {
  background-attachment: unset;
  background-position: right bottom;
 }
}
.message__wrapper {
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 -webkit-transform: translate(-50%, -50%);
 -ms-transform: translate(-50%, -50%);
 text-align: center;
}
.message__text {
 font-size: 17px;
 margin: 35px 0;
 line-height: 3;
 opacity: 0;
 filter:blur(50px);
}
@media screen and (max-width: 768px) {
 .message__wrapper {
  width: 85%;
 }
 .message__text {
  font-size: 16px;
  margin: 35px 0;
  line-height: 2.5;
  opacity: 0;
 }
}
@media screen and (min-width: 1921px) {
.message__text {
 font-size: 24px;
}
}
/**
 * History
 ***/
.history {
 background-color: #fffcf9;
}
.history__wrapper {
 /*text-align: center;*/
}
.history__title {
 font-size: 143px;
 color: #201B17;
 font-weight: 400;
 text-align: center;
 margin: initial;
 margin-top: 35px;
 margin-bottom: .7em;
 opacity: 0;
filter: blur(45px);
}
.history__caption{
  opacity: 0;
}
.history__label {
 font-size: 20px;
 color: #201b17;
 margin-right: 1em
}
.history__name {
 font-size: 31px;
 color: #201b17;
}
.history__txt {
 font-size: 15px;
 color: #201b17;
 text-align: left;
 margin: 35px auto;
 line-height: 2.7;
 opacity: 0;
}
.history__movie{
  opacity: 0;
  filter: blur(100px);
  scale: 1.1;
}
.c-section.history {
 background: #EDE5DA;
}
.history__body {
 max-width: 970px;
 margin: 150px auto 0 auto;
}
@media screen and (min-width: 1921px) {
.history__txt {
 font-size: 24px;
}
}
/**
 * YOUTUBE
 ***/
.youtube-thumb {
 width: 770px;
 height: auto;
}
.youtube-thumb-history {
 width: 970px;
 height: auto;
}
.youtube-thumb-thank {
 width: 970px;
 height: auto;
}
/**
 * INTERVIEW
 ***/
.interview {
 background-color: #201B17;
}
.interview__wrapper {
 text-align: center;
 color: #ffffff;
}
.interview__title {
 font-size: 143px;
 font-weight: 400;
 color: #EDE5DA;
 text-align: left;
 margin: initial;
 margin-bottom: .7em;
  opacity: 0;
filter: blur(45px);
}
.interview__list__icon{
  opacity: 0;
filter: blur(45px);
}
/**
 * CENTENNIAL
 ***/
.centennial {}
.centennial__wrapper {}
.centennial__title {
 font-family: var(--enFont);
 font-size: 100px;
}
.interview__label {
 font-size: 17px;
 color: #EDE5DA;
 display: block;
 margin-bottom: .5em;
}
.interview__name {
 font-size: 30px;
 color: #EDE5DA;
}
.interview__list {
 list-style: none;
 display: flex;
 text-align: left;
 position: relative;
}
.interview__list:not(:last-child) {
 margin-bottom: 100px
}
.interview__list__icon img {
 width: 178px;
 display: block
}
.interview__list__textarea {
 margin-right: 65px;
 margin-top: 150px;
   opacity: 0;
filter: blur(45px);
}
.interview__txt {
 font-size: 15px;
 color: #EDE5DA;
 text-align: left;
 margin: 45px auto 0;
 line-height: 2.3;
 width: 180px
}

.interview__list__movie {
 max-width: 770px;
 margin-top: 150px;
    opacity: 0;
filter: blur(45px);
}
.interview__list__movie img {
 width: 100%;
 height: auto;
 display: block;
}
/*２番目の要素だけ*/
.interview__list:nth-of-type(2) {
 flex-direction: row-reverse;
 margin-right: 120px
}
.interview__list:nth-of-type(2) .interview__list__textarea {
 margin-right: 0px;
 margin-left: 65px;
}
.interview__list:nth-of-type(2) .interview__label {
 white-space: nowrap;
}
.centennial {
 display: none;
}
.centennial__title {
 font-family: var(--enFont);
 font-size: 100px;
}

.copyright {
 font-display: 12px;
 color: #EDE5DA;
 text-align: center
}

/*style2 union*/
.interview__list {
 padding: initial
}
.interview__list__icon_sp {
 display: none!important
}
@media screen and (max-width: 1440px) {
 #history .c-section__inner {
  margin: auto;
  width: 94%;
 }
#thank .c-section__inner {
  margin: auto;
  width: 94%;
 }
#final .c-section__inner {
  margin: auto;
  width: 94%;
  padding:initial
 }
   #gallery-sec .c-section__inner {
  margin: auto;
  width: 94%;
  padding:initial
 }
 #interview .c-section__inner {
  margin: auto;
  width: 94%;
 }
}
@media screen and (max-width: 1280px) {
 .interview__label {
  font-size: 17px;
  display: block;
  margin-bottom: .5em;
 }
 .interview__name {
  font-size: 30px;
 }
 .interview__list {
  flex-direction: column;
  align-items: center;
  max-width: 768px;
  margin: auto
 }
 .interview__list:not(:last-child) {
  margin-bottom: 100px
 }
 .interview__list__textarea {
  margin-right: 0;
  margin-top: 0;
  padding-left: 10em
 }
 .interview__txt {
  font-size: 15px;
  margin: 20px auto 0;
  width: 100%;
 }
 .interview__list__movie {
  max-width: 770px;
  margin-top: 50px
 }
 .interview__list__movie img {
  width: 100%;
  height: auto;
  display: block;
 }
 .interview__list:nth-of-type(2) {
  margin-right: 0;
  flex-direction: column;
  align-items: center;
  max-width: 768px;
  margin-left: 0;
  margin: auto;
 }
 .interview__list:nth-of-type(2) .interview__list__textarea {
  margin-left: 0;
 }
 .interview__list:not(:last-child) {
  margin-bottom: 100px
 }
 .interview__list__icon {
  width: 178px;
  margin-right: auto;
 }
 .interview__list__icon img {
  max-width: 100%;
  height: auto
 }
 .interview__list__icon_pc {
  display: none!important
 }
 .interview__list__icon_sp {
  display: block!important
 }
}
@media screen and (max-width: 1200px) {
 .youtube-thumb-history {
  max-width: 100%;
  height: auto;
  display: block
 }
    .youtube-thumb-thank {
       width: 100%;
  max-width: 970px;
   height: auto; 
 }
}
@media screen and (max-width: 960px) {
 .mfp-iframe-holder .mfp-content {
  width: 90%;
 }
}
@media screen and (max-width: 768px) {
 .history__body {
  max-width: 970px;
  margin: 100px auto 0 auto;
 }
 .interview__title,.history__title {
  font-size: 58px;
  font-size: clamp(3.625rem, -3.063rem + 25vw, 8.938rem);
  min-height: 0vw
 }
  #interview .c-section__inner {
 padding-bottom: 60px
}
}
@media screen and (max-width: 428px) {
 .interview__title,.history__title {
  font-size: 58px;
 }
 .history__label {
  font-size: 16px;
  margin-right: 1em
 }
 .history__name {
  font-size: 25px;
 }
 .history__txt {
  margin: 1.8em auto;
 }
 .interview__list__textarea {
  padding-left: 3em
 }
 .interview__list__icon {
  width: 100px;
 }
 .interview__list:not(:last-child) {
  margin-bottom: 60px
 }
 .interview__label {
  font-size: 13px;
  margin-bottom: .5em;
 }
 .interview__name {
  font-size: 25px;
 }
 .interview__list__movie {
  margin-top: 20px
 }
}
@media screen and (min-width: 1921px) {
.interview__txt {
  font-size: 22px
 }
}