@charset "UTF-8";
body {
  font-family: "peridot-pe-variable", sans-serif;
  font-style: normal;
  color: #251e1c;
}

.cm-fc-green {
  color: #e9ffa7;
}

.flex-img {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.flex-img .img {
  width: 33.3333333333%;
  height: 100%;
}
.flex-img .img img {
  width: 100%;
}
.flex-img .img-link {
  width: 33.3333333333%;
  height: 100%;
}
.flex-img .img-link .img {
  width: unset;
}
.flex-img .img-link .img img {
  width: 100%;
}

.bottom-img {
  width: 43rem;
  margin: 0 auto;
}
@media (max-width: 767px) {
  .bottom-img {
    width: 94.6666666667vw;
  }
}
.bottom-img .img {
  width: 100%;
}
.bottom-img .img img {
  width: 100%;
}

.top-img {
  display: none;
}
@media (max-width: 767px) {
  .top-img {
    display: block;
    width: 100%;
    height: 133.3333333333vw;
  }
}
.top-img .img {
  width: 100%;
}
.top-img .img img {
  width: 100%;
  height: 100%;
}

.cm-mgt {
  margin-top: 15rem;
}
@media (max-width: 767px) {
  .cm-mgt {
    margin-top: 24vw;
  }
}

.bottom-img {
  margin-top: 15rem;
}

.fadein-point {
  transform: translateY(30px);
  opacity: 0;
  visibility: hidden;
  transition: transform 1.5s, opacity 1.5s, visibility 1.5s;
  /* フェードイン時に入るクラス */
}
.fadein-point.js-fadein {
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
}

@media only screen and (min-width: 768px) and (max-width: 1300px) {
  html {
    font-size: 0.7692307692vw;
  }
}
@media screen and (min-width: 1301px) and (max-width: 1399px) {
  html {
    font-size: 62.5%;
  }
}
.credit {
  width: 100%;
  height: 6rem;
  background-color: #e9ffa7;
  padding: 2.8rem 2.8rem 0 3rem;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 9999;
  box-sizing: border-box;
  transition: all 0.5s ease; /* 背景色の変化をアニメーション化 */
  opacity: 0;
  visibility: hidden;
}
@media (max-width: 767px) {
  .credit {
    height: 11.3333333333vw;
    padding: 0.2666666667vw 2.5333333333vw 0 2.5333333333vw;
  }
}
.credit.js-block {
  opacity: 1;
  visibility: visible;
}
.credit .txt-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: absolute;
  left: 0;
  right: 0;
  text-align: right;
  padding: 0 2.8rem 0 3rem;
  opacity: 0; /* 初期状態は非表示 */
  transition: opacity 0.5s ease; /* opacityの変化をアニメーション化 */
}
@media (max-width: 767px) {
  .credit .txt-area {
    padding: 0.2666666667vw 2.5333333333vw 0 2.5333333333vw;
    top: 1.2vw;
  }
}
.credit .txt-area.show {
  opacity: 1; /* 表示時のopacityを1に変更 */
  z-index: 1111;
}
.credit .txt {
  font-size: 1.1rem;
  font-variation-settings: "wght" 500, "wdth" 150, "ital" 0;
  letter-spacing: 0.005em;
  text-align: left;
}
@media (max-width: 767px) {
  .credit .txt {
    font-size: 2vw;
    line-height: 1.4em;
  }
}
.credit .txt .is-sp {
  display: none;
}
@media (max-width: 767px) {
  .credit .txt .is-sp {
    display: inline-block;
  }
}
.credit .txt a {
  display: inline-block;
}
@media (max-width: 767px) {
  .credit .txt .is-pc {
    display: none;
  }
}
.credit .pagination {
  font-size: 1.9rem;
  font-variation-settings: "wght" 300, "wdth" 150, "ital" 0;
  padding-bottom: 0.6rem;
}
@media (max-width: 767px) {
  .credit .pagination {
    font-size: 3.7333333333vw;
    padding-top: 2.9333333333vw;
  }
}

#CE240227ceremony {
  background-position: top center;
  background-size: cover;
}
@media (max-width: 767px) {
  #CE240227ceremony {
    background-image: url(../img/SP.jpg);
    height: auto;
  }
}
@media (max-width: 767px) {
  #CE240227ceremony .sec01 {
    position: relative;
  }
}
#CE240227ceremony .sec01__sp-img {
  display: none;
  width: 100%;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec01__sp-img {
    display: block;
  }
}
#CE240227ceremony .sec01__sp-img img {
  width: 100%;
}
#CE240227ceremony .sec01__sp-img-area {
  display: none;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec01__sp-img-area {
    display: block;
    padding-top: 11.0666666667vw;
  }
}
#CE240227ceremony .sec01__sp-img-area .bg {
  width: 100%;
  height: 138.6666666667vw;
  position: relative;
  z-index: -1;
}
#CE240227ceremony .sec01__sp-img-area .bg img {
  width: 100%;
  height: 100%;
}
#CE240227ceremony .sec01__sp-img-area .img-area {
  padding: 0 2.6666666667vw;
  margin-top: -114.5333333333vw;
}
#CE240227ceremony .sec01__sp-img-area .img-area .img {
  width: 53.3333333333vw;
  margin: 0 0 0 auto;
}
#CE240227ceremony .sec01__sp-img-area .img-area .img:last-of-type {
  margin-top: 2.76vw;
}
#CE240227ceremony .sec01__sp-img-area .img-area .img img {
  width: 100%;
}
#CE240227ceremony .sec01 .flex-img {
  position: relative;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec01 .flex-img.is-pc {
    display: none;
  }
}
#CE240227ceremony .sec01 .ttl {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: 1%;
  left: 49.8%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
@media (max-width: 767px) {
  #CE240227ceremony .sec01 .ttl {
    left: 50%;
  }
}
#CE240227ceremony .sec01 .ttl .img {
  width: 51.86rem;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec01 .ttl .img {
    width: 94.2666666667vw;
  }
}
#CE240227ceremony .sec01 .ttl .img img {
  width: 100%;
}
#CE240227ceremony .sec01 .ttl.is-sp {
  display: none;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec01 .ttl.is-sp {
    display: flex;
    top: 18.9333333333vw;
    bottom: unset;
    left: 50.8%;
  }
}
#CE240227ceremony .sec01 .ttl .campaign {
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: 0;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec01 .ttl .campaign {
    font-size: 2.5333333333vw;
    letter-spacing: -0.02em;
  }
}
#CE240227ceremony .sec01 .ttl .main-lead {
  font-size: 2.9rem;
  font-weight: 700;
  margin-top: 1rem;
  letter-spacing: 0.1em;
  white-space: nowrap;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec01 .ttl .main-lead {
    font-size: 5.2vw;
    letter-spacing: 0.075em;
    margin-top: 1.6vw;
  }
}
#CE240227ceremony .sec01 .ttl .txt {
  font-size: 1.11rem;
  font-weight: 500;
  margin-top: 1.4rem;
  letter-spacing: 0;
  text-align: center;
  line-height: 1.2em;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec01 .ttl .txt {
    font-size: 2.1333333333vw;
    letter-spacing: -0.02em;
    margin-top: 2vw;
  }
}
#CE240227ceremony .sec01 .bottom-img {
  margin-top: 20.9rem;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec01 .bottom-img {
    margin-top: 21.3333333333vw;
  }
}
@media (max-width: 767px) {
  #CE240227ceremony .sec02 .flex-img {
    flex-direction: column;
  }
  #CE240227ceremony .sec02 .flex-img .img-link.__01 {
    order: 2;
    width: 57.6vw;
    margin: -21.3333333333vw 0 0 auto;
  }
  #CE240227ceremony .sec02 .flex-img .img-link.__02 {
    order: 3;
    width: 94.6666666667vw;
    margin-top: 21.4666666667vw;
  }
  #CE240227ceremony .sec02 .flex-img .img-link.__03 {
    order: 1;
    width: 45.7333333333vw;
    margin: 21.2vw auto 0 2.6666666667vw;
  }
}
#CE240227ceremony .sec02 .top-img {
  display: none;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec02 .top-img {
    display: block;
    width: 100%;
  }
}
@media (max-width: 767px) {
  #CE240227ceremony .sec02 .bottom-img {
    display: none;
  }
}
@media (max-width: 767px) {
  #CE240227ceremony .sec03 .flex-img {
    flex-direction: column;
  }
  #CE240227ceremony .sec03 .flex-img::after {
    content: "";
    width: 100vw;
    height: 107.7333333333vw;
    background-color: #e9ffa7;
    position: absolute;
    bottom: 51.7333333333vw;
    left: 0;
    z-index: -1;
  }
  #CE240227ceremony .sec03 .flex-img .img-link.__01 {
    order: 2;
    width: 53.3333333333vw;
    margin: 10.6666666667vw 2.6666666667vw 0 auto;
    position: relative;
  }
  #CE240227ceremony .sec03 .flex-img .img-link.__02 {
    order: 1;
    width: 100%;
  }
  #CE240227ceremony .sec03 .flex-img .img-link.__03 {
    order: 3;
    width: 53.3333333333vw;
    margin: 2.6666666667vw 2.6666666667vw 0 auto;
    position: relative;
  }
  #CE240227ceremony .sec03 .bottom-img {
    margin-top: 21.4666666667vw;
  }
}
@media (max-width: 767px) {
  #CE240227ceremony .sec04 .flex-img {
    flex-direction: column;
  }
  #CE240227ceremony .sec04 .flex-img .img-link.__01 {
    order: 3;
    width: 70.1333333333vw;
    margin: 13.2vw auto 0;
  }
  #CE240227ceremony .sec04 .flex-img .img-link.__02 {
    order: 1;
    width: 100vw;
  }
  #CE240227ceremony .sec04 .flex-img .img-link.__03 {
    order: 2;
    width: 45.7333333333vw;
    margin: 21.3333333333vw 2.6666666667vw 0 auto;
  }
}
@media (max-width: 767px) {
  #CE240227ceremony .sec04 .bottom-img {
    margin-top: 24vw;
  }
}
#CE240227ceremony .sec05 {
  padding: 6.7rem 0 14.5rem;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec05 {
    padding-top: 7.0666666667vw;
  }
}
#CE240227ceremony .sec05 .closing {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec05 .closing {
    padding-right: 0.8533333333vw;
  }
}
#CE240227ceremony .sec05 .closing .img {
  width: 34.47rem;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec05 .closing .img {
    width: 94.1733333333vw;
  }
}
#CE240227ceremony .sec05 .closing .img img {
  width: 100%;
}
#CE240227ceremony .sec05 .closing .campaign {
  font-size: 1rem;
  font-weight: 500;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec05 .closing .campaign {
    font-size: 2.5466666667vw;
  }
}
#CE240227ceremony .sec05 .closing .main-lead {
  font-size: 2rem;
  font-weight: 700;
  margin-top: 0.7rem;
  letter-spacing: 0.057em;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec05 .closing .main-lead {
    font-size: 5.0666666667vw;
    letter-spacing: 0.13em;
    margin-top: 1.8666666667vw;
    white-space: nowrap;
  }
}
#CE240227ceremony .sec05 .closing .txt {
  font-size: 0.73rem;
  font-weight: 500;
  margin-top: 0.9rem;
  text-align: center;
  line-height: 1.3;
}
@media (max-width: 767px) {
  #CE240227ceremony .sec05 .closing .txt {
    font-size: 2.16vw;
    line-height: 1.2;
    margin-top: 1.7333333333vw;
  }
}

.mv {
  opacity: 0;
  visibility: hidden;
  transition: opacity 2s, visibility 2s;
}
.mv.scroll-in {
  opacity: 1;
  visibility: visible;
}

.mv-ttl {
  opacity: 0;
  visibility: hidden;
  transition: opacity 2s, visibility 2s;
}
.mv-ttl.js-block {
  opacity: 1;
  visibility: visible;
}

.credit-area02 {
  display: none;
}/*# sourceMappingURL=style.css.map */