@charset "UTF-8";
html {
  font-size: 0.4133333333vw;
}

@media screen and (min-width: 1400px) {
  html {
    font-size: 5.7866666667px;
  }
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6, p, a {
  font-size: 100%;
  line-height: 1;
  transform: rotate(0.03deg);
  -moz-transform: rotate(0.03deg);
  -ms-transform: rotate(0.03deg);
  -o-transform: rotate(0.03deg);
  -webkit-transform: rotate(0.03deg);
}

.feature {
  box-sizing: border-box;
  width: 100%;
  margin: 0 auto;
  overflow: clip;
  position: relative;
  font-feature-settings: "palt" 1;
  font-family: "Yu Gothic", "游ゴシック", "YuGothic", "游ゴシック体", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #333333;
}

.feature a {
  transition: 0.3s;
  display: block;
  color: #333333;
  text-decoration: none;
  will-change: opacity;
}
.feature a:hover {
  opacity: 0.7;
  text-decoration: none;
}

.feature .hover-wt {
  background: #fff;
  position: relative;
}
.feature .hover-wt a:hover {
  opacity: 1;
  text-decoration: none;
}
.feature .hover-wt img {
  transition: 0.3s;
}
.feature .hover-wt img:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
  transition: 0.3s;
}

.feature img, svg, video {
  width: 100%;
  height: auto;
  display: block;
  vertical-align: bottom;
}

.l-container {
  width: 100%;
  overflow: clip;
}

.l-footer {
  padding: 0;
}

.pc-footer {
  margin: 0;
}

* {
  box-sizing: border-box;
}

.js-fade {
  opacity: 0;
  visibility: hidden;
  transition: opacity 1.2s ease;
}

.js-fade.is-show {
  opacity: 1;
  visibility: visible;
}

.js-fade-tobtm {
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4rem);
  transition: opacity 1.2s ease, transform 1.2s ease;
}

.js-fade-tobtm.is-show {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.js-fade-tor {
  opacity: 0;
  visibility: hidden;
  transform: translateX(-4rem);
  transition: opacity 1.2s ease, transform 1.2s ease;
}

.js-fade-tor.is-show {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.js-fade-tol {
  opacity: 0;
  visibility: hidden;
  transform: translateX(4rem);
  transition: opacity 1.2s ease, transform 1.2s ease;
}

.js-fade-tol.is-show {
  opacity: 1;
  visibility: visible;
  transform: none;
}

section {
  scroll-margin-top: 100px;
}

.feature {
  display: flex;
  justify-content: center;
  background: rgba(255, 212, 212, 0.2);
}

.feature:has(.main-visual.on) .pc-all {
  opacity: 1;
  pointer-events: initial;
  transition: opacity 0.5s ease;
}

.feature:has(.outro-all.on) .pc-all {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.5s ease;
}

.pc-left {
  position: sticky;
  top: 80px;
  height: calc(100vh - 80px);
  order: 1;
  width: 100%;
}
.pc-left .pc-ttl {
  width: 22.4178571429vw;
  margin-top: 3.5714285714vw;
  margin-left: 3.5714285714vw;
}
@media screen and (min-width: 1400px) {
  .pc-left .pc-ttl {
    width: 313.85px;
  }
}

.pc-right {
  position: sticky;
  top: 80px;
  height: calc(100vh - 80px);
  order: 3;
  width: 100%;
}
.pc-right .pc-all {
  width: 9.2857142857vw;
  position: absolute;
  bottom: 2.1428571429vw;
  right: 2.1428571429vw;
  opacity: 0;
  pointer-events: none;
  z-index: 10;
  transition: opacity 0.5s ease;
}
@media screen and (min-width: 1400px) {
  .pc-right .pc-all {
    width: 130px;
  }
}

.pc-center {
  order: 2;
}

.js-position {
  position: sticky;
}

.feature__inner {
  width: 75rem;
  margin: 0 auto;
  position: relative;
  overflow: clip;
}

.main-area {
  background: #b2c9d8;
  padding-top: 3rem;
  padding-bottom: 14rem;
}
.main-area .main-visual {
  width: 69rem;
  margin: 0 auto;
}
.main-area .main-ttl {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #fff;
  margin-top: 4.5rem;
  margin-bottom: 10rem;
}
.main-area .main-ttl .main-ttl-txt1 {
  width: 31.39rem;
}
.main-area .main-ttl .main-ttl-txt2 {
  width: 56.81rem;
  margin-top: 3.6rem;
}
.main-area .main-ttl .main-ttl-txt3 {
  width: 27.73rem;
  margin: 0 auto;
  margin-top: 4.5rem;
  display: flex;
}
.main-area .main-ttl .main-ttl-txt3.is-show .chara {
  opacity: 1;
}
.main-area .main-ttl .main-ttl-txt3 .chara {
  opacity: 0;
  transition: 0.1s ease;
}
.main-area .main-ttl .main-ttl-txt3 .main-ttl-txt3-1 {
  width: 3.324rem;
}
.main-area .main-ttl .main-ttl-txt3 .main-ttl-txt3-2 {
  width: 1.9316rem;
  margin-top: 1.2rem;
  transition-delay: 0.1s;
}
.main-area .main-ttl .main-ttl-txt3 .main-ttl-txt3-3 {
  width: 2.0596rem;
  margin-top: 1.2rem;
  margin-left: 0.4rem;
  transition-delay: 0.2s;
}
.main-area .main-ttl .main-ttl-txt3 .main-ttl-txt3-4 {
  width: 2.1781rem;
  margin-top: 1.2rem;
  transition-delay: 0.3s;
}
.main-area .main-ttl .main-ttl-txt3 .main-ttl-txt3-5 {
  width: 1.664rem;
  margin-top: 1.3rem;
  margin-left: 0.3rem;
  transition-delay: 0.4s;
}
.main-area .main-ttl .main-ttl-txt3 .main-ttl-txt3-6 {
  width: 2.1899rem;
  margin-left: 1.4rem;
  margin-top: 0.1rem;
  transition-delay: 0.5s;
}
.main-area .main-ttl .main-ttl-txt3 .main-ttl-txt3-7 {
  width: 1.664rem;
  margin-top: 1.3rem;
  margin-left: 0.3rem;
  transition-delay: 0.6s;
}
.main-area .main-ttl .main-ttl-txt3 .main-ttl-txt3-8 {
  width: 2.4033rem;
  margin-left: 1.5rem;
  margin-top: 0.1rem;
  transition-delay: 0.7s;
}
.main-area .main-ttl .main-ttl-txt3 .main-ttl-txt3-9 {
  width: 1.9316rem;
  margin-top: 1.3rem;
  margin-left: 0.2rem;
  transition-delay: 0.8s;
}
.main-area .main-ttl .main-ttl-txt3 .main-ttl-txt3-10 {
  width: 1.5273rem;
  margin-top: 1.2rem;
  margin-left: 0.1rem;
  transition-delay: 0.9s;
}
.main-area .main-ttl .main-ttl-txt3 .main-ttl-txt3-11 {
  width: 0.9053rem;
  margin-top: 0.2rem;
  margin-left: 0.2rem;
  transition-delay: 1s;
}
.main-area .main-ttl .main-ttl-txt3 .main-ttl-txt3-12 {
  width: 1.1949rem;
  margin-top: 1.2rem;
  margin-left: 0.2rem;
  transition-delay: 1.1s;
}
.main-area .main-ttl .main-ttl-txt4 {
  width: 21.6rem;
  margin-top: 4.3rem;
}
.main-area .main-lead {
  position: relative;
  margin-top: 10rem;
}
.main-area .main-lead .main-lead-ph {
  width: 48rem;
  margin: 0 auto;
}
.main-area .main-lead .main-lead-deco {
  width: 13.5rem;
  position: absolute;
  top: 0;
}
.main-area .main-lead .main-lead-deco.main-lead-deco1 {
  left: 0;
}
.main-area .main-lead .main-lead-deco.main-lead-deco2 {
  right: 0;
}
.main-area .campaign-area {
  width: 69rem;
  position: relative;
  margin: 0 auto;
  margin-top: 10.1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding-top: 7rem;
  padding-bottom: 6.3rem;
}
.main-area .campaign-area .campaign-bg {
  width: 69rem;
  position: absolute;
  top: 0;
  left: 0;
}
.main-area .campaign-area span {
  position: relative;
}
.main-area .campaign-area .campaign-txt1 {
  color: #8ab6ce;
  font-family: "acumin-pro", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.8rem;
  line-height: 1;
  letter-spacing: 0.03em;
}
.main-area .campaign-area .campaign-txt2 {
  width: 59.217rem;
  margin-top: 2.8rem;
}
.main-area .campaign-area .campaign-txt3 {
  color: #333333;
  font-family: "yu-gothic-pr6n", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.4rem;
  line-height: 1.75;
  letter-spacing: 0.03em;
  margin-top: 3.3rem;
}
.main-area .campaign-area .campaign-txt4 {
  color: #727272;
  font-family: "yu-gothic-pr6n", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2rem;
  line-height: 1.75;
  letter-spacing: 0.02em;
  margin-top: 2.3rem;
}

@keyframes anim_loopY {
  0% {
    transform: translateY(0%);
  }
  100% {
    transform: translateY(100%);
  }
}
@keyframes anim_loopY2 {
  0% {
    transform: translateY(-100%);
  }
  100% {
    transform: translateY(0%);
  }
}
@keyframes anim_loopX {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
@keyframes anim_loopX2 {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(0%);
  }
}
.section .ph-box {
  position: relative;
}
.section .credit {
  display: flex;
  flex-wrap: wrap;
  -moz-column-gap: 2.6rem;
       column-gap: 2.6rem;
  margin: 0 auto;
  margin-top: 2rem;
}
.section .credit li {
  font-family: "acumin-pro", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.4rem;
  line-height: 1.75;
  letter-spacing: 0.03em;
  text-decoration: none;
  -webkit-text-decoration-skip-ink: none;
          text-decoration-skip-ink: none;
}
.section .credit li a {
  font-family: "acumin-pro", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.4rem;
  line-height: 1.75;
  letter-spacing: 0.03em;
  text-decoration: none;
  -webkit-text-decoration-skip-ink: none;
          text-decoration-skip-ink: none;
}

.section {
  background: #fff;
}
.section.sec01 {
  margin-top: 14rem;
  padding-bottom: 14rem;
}
.section.sec01 .ph01 {
  width: 75rem;
}
.section.sec01 .ph-box01 {
  margin-top: 10rem;
  overflow: clip;
}
.section.sec01 .ph-box01 .loop-txt-area {
  position: absolute;
  bottom: 0;
  right: 5rem;
  z-index: 2;
  pointer-events: none;
  display: flex;
  flex-direction: column;
}
.section.sec01 .ph-box01 .loop-txt-area .loop-txt {
  width: 3.13rem;
  padding-top: 19rem;
}
.section.sec01 .ph-box01 .loop-txt-area .loop-txt.loop-txt01 {
  animation: anim_loopY 40s linear infinite;
}
.section.sec01 .ph-box01 .loop-txt-area .loop-txt.loop-txt02 {
  animation: anim_loopY 40s linear infinite;
}
.section.sec01 .ph-box01 .ph02 {
  width: 63rem;
}
.section.sec01 .ph-box01 .ph03 {
  width: 53rem;
  margin-left: auto;
  margin-top: -14rem;
  position: relative;
  z-index: 1;
}
.section.sec01 .ph-box01 .credit {
  flex-direction: column;
  position: absolute;
  bottom: 1.4rem;
  left: 3rem;
  margin: 0;
  margin-bottom: 1rem;
  z-index: 1;
}
.section.sec01 .ph-box02 {
  margin-top: 14rem;
}
.section.sec01 .ph-box02 .ph04 {
  width: 75rem;
}
.section.sec01 .ph-box02 .credit {
  margin-left: 3rem;
}
.section.sec01 .ph-box03 {
  margin-top: 13.3rem;
}
.section.sec01 .ph-box03 .ph05 {
  width: 55rem;
  margin: 0 auto;
  z-index: 1;
  position: relative;
}
.section.sec01 .ph-box03 .ph-bg {
  width: 55rem;
  position: absolute;
  top: 10rem;
  left: 20rem;
}
.section.sec01 .ph-box04 .ph-bg {
  width: 37rem;
  position: absolute;
  top: 0;
  left: 0;
}
.section.sec01 .ph-box04 .ph06 {
  width: 75rem;
  margin-top: 24rem;
  position: relative;
}
.section.sec01 .ph-box05 {
  margin-top: 10rem;
}
.section.sec01 .ph-box05 .ph07 {
  width: 63rem;
  z-index: 1;
  position: relative;
}
.section.sec01 .ph-box05 .slick-dots {
  right: auto;
  left: 2rem;
}
.section.sec01 .ph-box05 .credit {
  margin: 0;
  flex-direction: column;
  align-items: flex-end;
  position: absolute;
  bottom: 2.4rem;
  right: 3rem;
  z-index: 1;
}
.section.sec01 .ph08 {
  width: 49rem;
  margin-left: auto;
  margin-top: 10rem;
}
.section.sec02 {
  padding-bottom: 13.5rem;
}
.section.sec02 .ph-box01 {
  width: 69rem;
  margin: 0 auto;
}
.section.sec02 .ph-box01.is-show .ph-txt {
  opacity: 1;
}
.section.sec02 .ph-box01 .ph-txt {
  position: absolute;
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}
.section.sec02 .ph-box01 .ph-txt.ph-txt1 {
  width: 9.078rem;
  top: 7.5rem;
  left: 2.6rem;
  transition-delay: 0.3s;
}
.section.sec02 .ph-box01 .ph-txt.ph-txt2 {
  width: 4.843rem;
  top: 20.5rem;
  left: 17rem;
  transition-delay: 0.5s;
}
.section.sec02 .ph-box01 .ph-txt.ph-txt3 {
  width: 9.078rem;
  bottom: 29.8rem;
  right: 14.5rem;
  transition-delay: 0.7s;
}
.section.sec02 .ph-box01 .ph-txt.ph-txt4 {
  width: 10.83rem;
  bottom: 12rem;
  right: 3rem;
  transition-delay: 0.9s;
}
.section.sec02 .ph-box01 .credit {
  flex-direction: column;
  position: absolute;
  bottom: 1.4rem;
  left: 3rem;
  margin: 0;
  margin-bottom: 1rem;
  z-index: 1;
}
.section.sec02 .ph-box02 {
  width: 58rem;
  margin-left: auto;
  margin-top: 18rem;
}
.section.sec02 .ph-box02 .ph10 {
  position: relative;
  z-index: 1;
}
.section.sec02 .ph-box02 .ph-bg {
  width: 58rem;
  position: absolute;
  top: -8rem;
  left: -8rem;
}
.section.sec02 .ph-box03 {
  width: 75rem;
  margin-top: 14rem;
}
.section.sec02 .ph-box03.is-show .ph-txt {
  opacity: 1;
}
.section.sec02 .ph-box03 .ph-txt {
  position: absolute;
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
  z-index: 1;
}
.section.sec02 .ph-box03 .ph-txt.ph-txt1 {
  width: 8.75rem;
  top: -22rem;
  right: 3.8rem;
  transition-delay: 0.3s;
}
.section.sec02 .ph-box03 .ph-txt.ph-txt2 {
  width: 9rem;
  top: -2.6rem;
  right: 15.5rem;
  transition-delay: 0.5s;
}
.section.sec02 .ph-box03 .ph-txt.ph-txt3 {
  width: 10.92rem;
  top: 20.9rem;
  right: 5rem;
  transition-delay: 0.7s;
}
.section.sec02 .ph-box03 .ph-txt.ph-txt4 {
  width: 11.22rem;
  top: 44.8rem;
  right: 12.3rem;
  transition-delay: 0.9s;
}
.section.sec02 .ph-box03 .credit {
  flex-direction: column;
  position: absolute;
  bottom: 1.4rem;
  right: 3rem;
  margin: 0;
  margin-bottom: 1rem;
  z-index: 1;
  align-items: flex-end;
}
.section.sec02 .ph12 {
  width: 61rem;
  margin: 0 auto;
  margin-top: 10rem;
}
.section.sec02 .ph-box04 {
  width: 75rem;
  margin-top: 14rem;
}
.section.sec02 .ph-box04 .ph13 {
  width: 65rem;
  position: absolute;
  top: 5rem;
  left: 0;
  right: 0;
  margin: auto;
}
.section.sec02 .ph-box04 .credit {
  width: 57rem;
  justify-content: flex-end;
  margin-left: auto;
  margin-right: 3rem;
}
.section.sec03 .ph-box01::before {
  content: "";
  display: block;
  width: 75rem;
  height: 287.1rem;
  background: #4f2f21;
  position: absolute;
  top: 68rem;
  left: 0;
}
.section.sec03 .ph-box01 .ph14 {
  width: 65rem;
}
.section.sec03 .ph-box01 .credit {
  width: 62rem;
  margin-left: 3rem;
}
.section.sec03 .ph-box01 .credit li {
  color: #fff;
}
.section.sec03 .ph-box01 .credit li a {
  color: #fff;
}
.section.sec03 .ph15 {
  width: 65rem;
  margin-left: auto;
  margin-top: 9.3rem;
}
.section.sec03 .section-ttl {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 10rem;
  margin-bottom: 10rem;
}
.section.sec03 .section-ttl .section-ttl-txt1 {
  width: 46rem;
}
.section.sec03 .section-ttl .section-ttl-txt2 {
  width: 25.856rem;
  margin-top: 6.4rem;
}
.section.sec03 .section-ttl .section-ttl-txt3 {
  width: 32.32rem;
  margin: 0 auto;
  margin-top: 2.3rem;
  display: flex;
}
.section.sec03 .section-ttl .section-ttl-txt3.is-show .chara {
  opacity: 1;
}
.section.sec03 .section-ttl .section-ttl-txt3 .chara {
  opacity: 0;
  transition: 0.1s ease;
}
.section.sec03 .section-ttl .section-ttl-txt3 .section-ttl-txt3-1 {
  width: 3.9023rem;
}
.section.sec03 .section-ttl .section-ttl-txt3 .section-ttl-txt3-2 {
  width: 2.2675rem;
  margin-top: 1.4rem;
  margin-left: 0.2rem;
  transition-delay: 0.1s;
}
.section.sec03 .section-ttl .section-ttl-txt3 .section-ttl-txt3-3 {
  width: 2.4178rem;
  margin-top: 1.4rem;
  margin-left: 0.2rem;
  transition-delay: 0.2s;
}
.section.sec03 .section-ttl .section-ttl-txt3 .section-ttl-txt3-4 {
  width: 2.5576rem;
  margin-top: 1.4rem;
  transition-delay: 0.3s;
}
.section.sec03 .section-ttl .section-ttl-txt3 .section-ttl-txt3-5 {
  width: 1.9538rem;
  margin-top: 1.3rem;
  margin-left: 0.3rem;
  transition-delay: 0.4s;
}
.section.sec03 .section-ttl .section-ttl-txt3 .section-ttl-txt3-6 {
  width: 2.5708rem;
  margin-left: 1.8rem;
  transition-delay: 0.5s;
}
.section.sec03 .section-ttl .section-ttl-txt3 .section-ttl-txt3-7 {
  width: 1.9538rem;
  margin-top: 1.3rem;
  margin-left: 0.3rem;
  transition-delay: 0.6s;
}
.section.sec03 .section-ttl .section-ttl-txt3 .section-ttl-txt3-8 {
  width: 2.5918rem;
  margin-top: 1.4rem;
  margin-left: 1.5rem;
  transition-delay: 0.7s;
}
.section.sec03 .section-ttl .section-ttl-txt3 .section-ttl-txt3-9 {
  width: 2.2675rem;
  margin-top: 1.3rem;
  margin-left: 0.4rem;
  transition-delay: 0.8s;
}
.section.sec03 .section-ttl .section-ttl-txt3 .section-ttl-txt3-10 {
  width: 1.7929rem;
  margin-top: 1.4rem;
  margin-left: 0.3rem;
  transition-delay: 0.9s;
}
.section.sec03 .section-ttl .section-ttl-txt3 .section-ttl-txt3-11 {
  width: 1.1629rem;
  margin-left: 0.1rem;
  transition-delay: 1s;
}
.section.sec03 .section-ttl .section-ttl-txt3 .section-ttl-txt3-12 {
  width: 1.4027rem;
  margin-top: 1.4rem;
  margin-left: 0.3rem;
  transition-delay: 1.1s;
}
.section.sec03 .ph-box02 {
  margin-top: 10rem;
}
.section.sec03 .ph-box02 .ph16 {
  width: 69rem;
  margin: 0 auto;
}
.section.sec03 .ph-box02 .slick-dots {
  right: auto;
  left: 2rem;
}
.section.sec03 .ph-box02 .credit {
  width: 61rem;
  margin-left: 3rem;
}
.section.sec03 .ph-box02 .credit li {
  color: #fff;
}
.section.sec03 .ph-box02 .credit li a {
  color: #fff;
}
.section.sec03 .ph17 {
  width: 75rem;
  margin-top: 27.4rem;
}
.section.sec03 .ph-box03 {
  margin-top: 10rem;
}
.section.sec03 .ph-box03 .loop-ph-box {
  width: 110rem;
  padding-right: 2rem;
  display: flex;
  justify-content: space-between;
}
.section.sec03 .ph-box03 .loop-ph-box .ph18, .section.sec03 .ph-box03 .loop-ph-box .ph18-1 {
  width: 53rem;
}
.section.sec03 .ph-box03 .loop-ph-box:nth-of-type(1) {
  animation: anim_loopX 20s linear infinite;
}
.section.sec03 .ph-box03 .loop-ph-box:nth-of-type(2) {
  position: absolute;
  top: 0;
  left: 0;
  transform: translateX(100%);
  animation: anim_loopX2 20s linear infinite;
}
.section.sec03 .ph-box03 .credit {
  width: 61rem;
  margin-left: 3rem;
}
.section.sec03 .ph-box04 {
  width: 75rem;
  margin-top: 13.3rem;
}
.section.sec03 .ph-box04 .credit {
  margin-left: 3rem;
}
.section.sec03 .ph-box05 {
  margin-top: 13.2rem;
}
.section.sec03 .ph-box05 .ph20 {
  width: 45rem;
  margin-left: 3rem;
  position: relative;
  z-index: 1;
}
.section.sec03 .ph-box05 .ph21 {
  width: 59rem;
  margin-left: auto;
  margin-top: 3rem;
  position: relative;
  z-index: 1;
}
.section.sec03 .ph-box05 .ph-bg {
  width: 51rem;
  position: absolute;
  top: 15rem;
  right: 0;
}
.section.sec03 .ph-box05 .credit {
  flex-direction: column;
  position: absolute;
  bottom: 2.5rem;
  left: 3rem;
  z-index: 1;
}
.section.sec03 .ph22 {
  width: 69rem;
  margin: 0 auto;
  margin-top: 10rem;
}
.section.sec03 .ph-box06 {
  margin-top: 14rem;
  overflow: clip;
}
.section.sec03 .ph-box06 .loop-txt-area {
  position: absolute;
  bottom: 0;
  right: 4rem;
  z-index: 2;
  pointer-events: none;
  display: flex;
  flex-direction: column;
}
.section.sec03 .ph-box06 .loop-txt-area .loop-txt {
  width: 3.13rem;
  padding-top: 19rem;
}
.section.sec03 .ph-box06 .loop-txt-area .loop-txt.loop-txt01 {
  animation: anim_loopY 40s linear infinite;
}
.section.sec03 .ph-box06 .loop-txt-area .loop-txt.loop-txt02 {
  animation: anim_loopY 40s linear infinite;
}
.section.sec03 .ph-box06 .ph23 {
  width: 65rem;
  position: relative;
  z-index: 1;
}
.section.sec03 .ph-box06 .ph24 {
  width: 59rem;
  margin-left: auto;
  margin-top: 3rem;
  position: relative;
  z-index: 1;
}
.section.sec03 .ph-box06 .credit {
  flex-direction: column;
  position: absolute;
  bottom: 1.4rem;
  left: 3rem;
  margin: 0;
  margin-bottom: 1rem;
  z-index: 1;
}
.section.sec03 .ph-box07 {
  margin-top: 14rem;
}
.section.sec03 .ph-box07 .ph-bg {
  width: 75rem;
  position: absolute;
  top: -119rem;
  left: 0;
}
.section.sec03 .ph-box07 .ph25 {
  width: 75rem;
}
.section.sec03 .ph-box07 .ph-txts {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.section.sec03 .ph-box07 .ph-txts.is-show .ph-txt {
  opacity: 1;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt {
  opacity: 0;
  transition: 0.1s ease;
  position: absolute;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt1 {
  width: 6.50391rem;
  top: 4.8rem;
  left: 1.8rem;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt2 {
  width: 3.7793rem;
  top: 8rem;
  left: 9.8rem;
  transition-delay: 0.3s;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt3 {
  width: 4.0297rem;
  top: 3.1rem;
  left: 16.3rem;
  transition-delay: 0.4s;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt4 {
  width: 4.262rem;
  top: 6.2rem;
  left: 22.6rem;
  transition-delay: 0.5s;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt5 {
  width: 3.2563rem;
  top: 3rem;
  left: 29.3rem;
  transition-delay: 0.6s;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt6 {
  width: 4.2846rem;
  top: 6.7rem;
  left: 38.3rem;
  transition-delay: 0.7s;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt7 {
  width: 3.2563rem;
  top: 6rem;
  left: 45rem;
  transition-delay: 0.8s;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt8 {
  width: 4.702rem;
  bottom: 14.7rem;
  right: 25.4rem;
  transition-delay: 0.9s;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt9 {
  width: 3.7793rem;
  bottom: 13.5rem;
  right: 18rem;
  transition-delay: 1s;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt10 {
  width: 2.988rem;
  bottom: 17.9rem;
  right: 12.4rem;
  transition-delay: 1.1s;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt11 {
  width: 1.937rem;
  bottom: 14.7rem;
  right: 6rem;
  transition-delay: 1.2s;
}
.section.sec03 .ph-box07 .ph-txts .ph-txt12 {
  width: 2.3378rem;
  bottom: 23.5rem;
  right: 2.7rem;
  transition-delay: 1.3s;
}
.section.sec03 .ph-box07 .credit {
  width: 44rem;
  margin-left: 3rem;
}
.section.sec03 .ph-box08 {
  margin-top: 9.3rem;
  padding-bottom: 14rem;
}
.section.sec03 .ph-box08 .ph26 {
  width: 59rem;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  margin-top: 8rem;
}
.section.sec03 .ph-box08 .ph-bg {
  width: 75rem;
}
.section.sec04 .ph27 {
  width: 75rem;
}
.section.sec04 .ph-box01 {
  margin-top: 10rem;
}
.section.sec04 .ph-box01 .ph28 {
  width: 59rem;
  margin-left: auto;
}
.section.sec04 .ph-box01 .credit {
  flex-direction: column;
  position: absolute;
  bottom: 2.5rem;
  left: 3rem;
  margin-top: 0;
}
.section.sec04 .ph-box02 {
  margin-top: 14rem;
}
.section.sec04 .ph-box02 .ph29 {
  width: 69rem;
}
.section.sec04 .ph-box02 .credit {
  margin-left: 3rem;
}
.section.sec04 .ph-box02 .slick-dots {
  right: auto;
  left: 2rem;
}
.section.sec04 .ph-box03 {
  margin-top: 13.4rem;
}
.section.sec04 .ph-box03 .loop-ph-box {
  width: 122rem;
  padding-right: 2rem;
  display: flex;
  justify-content: space-between;
}
.section.sec04 .ph-box03 .loop-ph-box .ph30, .section.sec04 .ph-box03 .loop-ph-box .ph30-1 {
  width: 59rem;
}
.section.sec04 .ph-box03 .loop-ph-box:nth-of-type(1) {
  animation: anim_loopX 20s linear infinite;
}
.section.sec04 .ph-box03 .loop-ph-box:nth-of-type(2) {
  position: absolute;
  top: 0;
  left: 0;
  transform: translateX(100%);
  animation: anim_loopX2 20s linear infinite;
}
.section.sec04 .ph-box03 .credit {
  width: 64rem;
  margin-left: 3rem;
}
.section.sec04 .ph-box04 {
  margin-top: 13.3rem;
}
.section.sec04 .ph-box04 .ph31 {
  width: 61rem;
  margin-left: auto;
}
.section.sec04 .ph-box04 .credit {
  flex-direction: column;
  position: absolute;
  bottom: 2.5rem;
  left: 3rem;
  margin-top: 0;
}
.section.sec04 .ph-box05 {
  margin-top: 14rem;
  overflow: clip;
}
.section.sec04 .ph-box05 .loop-txt-area {
  position: absolute;
  bottom: 0;
  right: 4rem;
  z-index: 2;
  pointer-events: none;
  display: flex;
  flex-direction: column;
}
.section.sec04 .ph-box05 .loop-txt-area .loop-txt {
  width: 3.13rem;
  padding-top: 19rem;
}
.section.sec04 .ph-box05 .loop-txt-area .loop-txt.loop-txt01 {
  animation: anim_loopY 40s linear infinite;
}
.section.sec04 .ph-box05 .loop-txt-area .loop-txt.loop-txt02 {
  animation: anim_loopY 40s linear infinite;
}
.section.sec04 .ph-box05 .ph32 {
  width: 65rem;
}
.section.sec04 .ph-box05 .ph33 {
  width: 75rem;
  margin-top: 10rem;
}
.section.sec04 .ph-box06 {
  padding-bottom: 13.3rem;
}
.section.sec04 .ph-box06 .credit {
  margin-left: 3rem;
  width: 60rem;
}
.section.sec04 .outro {
  position: relative;
  background: #b2c9d8;
  padding-top: 25.5rem;
  padding-bottom: 24.4rem;
}
.section.sec04 .outro .outro-deco {
  width: 75rem;
  position: absolute;
}
.section.sec04 .outro .outro-deco.deco01 {
  top: 0;
  left: 0;
}
.section.sec04 .outro .outro-deco.deco02 {
  bottom: 0;
  left: 0;
}
.section.sec04 .outro .outro-ttl {
  width: 56.8189rem;
  margin: 0 auto;
}
.section.sec04 .outro .outro-all {
  width: 69rem;
  margin: 0 auto;
  margin-top: 10rem;
}
.section.sec04 .outro .category {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 58.2rem;
  margin: 0 auto;
  margin-top: 6rem;
  -moz-column-gap: 7rem;
       column-gap: 7rem;
  row-gap: 2.6rem;
}
.section.sec04 .outro .category .category-item {
  position: relative;
}
.section.sec04 .outro .category .category-item .category-item-link {
  font-family: "acumin-pro", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3rem;
  letter-spacing: 0.03em;
  color: #fff;
  will-change: opacity;
}
.section.sec04 .outro .category .category-item:nth-of-type(1)::before, .section.sec04 .outro .category .category-item:nth-of-type(2)::before, .section.sec04 .outro .category .category-item:nth-of-type(3)::before, .section.sec04 .outro .category .category-item:nth-of-type(5)::before, .section.sec04 .outro .category .category-item:nth-of-type(6)::before {
  content: "";
  display: block;
  background: url(../img/category-pass.svg);
  width: 2.121rem;
  height: 2.121rem;
  position: absolute;
  top: 0.7rem;
  right: -4.2rem;
}
.section.sec04 .outro .staff-credit {
  font-family: "acumin-pro", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.4rem;
  line-height: 1.75;
  letter-spacing: 0.03em;
  color: #fff;
  text-align: center;
  margin-top: 9.4rem;
}

.ph-slider {
  margin-bottom: 0 !important;
}
.ph-slider .slick-dots {
  text-align: right;
  bottom: 2.5rem;
  right: 2rem;
  z-index: 20;
  width: -moz-fit-content;
  width: fit-content;
}
.ph-slider .slick-dots li {
  width: 1.6rem;
  height: 1.6rem;
  margin: 0 1rem;
  padding: 0;
  border-radius: 50%;
  background: #fff;
  opacity: 0.5;
}
.ph-slider .slick-dots li button {
  display: none;
}
.ph-slider .slick-dots .slick-active {
  background: #fff;
  opacity: 1;
}/*# sourceMappingURL=style.css.map */