@import url("https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@300;400;500;700;900&display=swap");
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

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

button,
input,
select,
textarea {
  font: inherit;
  border: none;
  background: none;
  color: inherit;
}

ul,
ol {
  list-style: none;
}

:root {
  --color-text: #231916;
  --color-bg: #fffdf7;
  --color-point_01: #e5003f;
  --color-point_02: #7e87b0;
  --color-point_03: #fa6e7c;
  --color-white: #fff;
  --color-black: #000;
  --size-base: min(32px, 100vw*(32/768));
}

html {
  scroll-behavior: auto;
  font-family: "Zen Maru Gothic", sans-serif;
  color: var(--color-text);
  background: var(--color-bg);
  font-size: var(--size-base);
}

body.fixed {
  overflow: hidden;
}

@media (769px <= width) {
  .dp_sp {
    display: none;
  }
}

@media (width <= 768px) {
  .dp_pc {
    display: none;
  }
}

.header {
  background: url("../../assets/img/header_bg.png") center top/min(113px, 5.8854166667vw);
  position: relative;
  padding: min(65px, 4.3333333333vw) 0 0;
}
.header::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 100%;
  height: min(65px, 5.4166666667vw);
  display: block;
  background: url("../../assets/img/header_line.png") top center/auto min(65px, 4.5833333333vw) repeat-x;
}
.header__inner {
  margin-inline: auto;
  padding: min(60px, 3.125vw) 0 0;
}
.header__inner__head {
  position: relative;
  margin: 0 2%;
}
.header__inner__head__logo {
  position: absolute;
  top: 0;
  left: 0;
  width: min(232px, 15.4666666667vw);
}
.header__inner__head__title {
  width: min(608px, 40.5333333333vw);
  margin-inline: auto;
}
.header__inner__mv {
  padding-top: min(48px, 2.5vw);
  position: relative;
}
.header__inner__mv__parts {
  position: absolute;
  max-width: 1920px;
  width: 100%;
  height: 100%;
  margin-inline: auto;
  left: 50%;
  transform: translateX(-50%);
}
.header__inner__mv__parts__item01 {
  position: absolute;
  top: 16.666%;
  left: 3.437%;
  width: min(612px, 31.875vw);
  aspect-ratio: 612/290;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  pointer-events: none;
}
.header__inner__mv__parts__item01 picture {
  position: relative;
  z-index: 1;
}
.header__inner__mv__parts__item01 .icn {
  position: absolute;
  bottom: 0;
  left: 10%;
  z-index: 0;
  width: 65.032%;
  animation: head_icn_01 3s ease-in-out infinite;
  transform-origin: bottom;
}
.header__inner__mv__parts__item02 {
  position: absolute;
  top: -4.4%;
  left: 63.02%;
  width: min(587px, 30.5729166667vw);
  aspect-ratio: 587/214;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  pointer-events: none;
}
.header__inner__mv__parts__item02 picture {
  position: relative;
  z-index: 10;
}
.header__inner__mv__parts__item02 .icn {
  position: absolute;
  bottom: 0;
  left: 25.553%;
  z-index: 0;
  width: 47.018%;
  transform-origin: bottom;
}
.header__inner__mv__parts__item02 .icn_02 {
  animation: head_icn_02 1.8s ease-in-out infinite;
}
.header__inner__mv__parts__item02 .icn_03 {
  animation: head_icn_02 1.8s ease-in-out infinite;
  animation-delay: 0.2s;
}
.header__inner__mv__parts__item02 .icn_04 {
  animation: head_icn_02 1.8s ease-in-out infinite;
  animation-delay: 0.4s;
}
.header__inner__mv__parts__item03 {
  position: absolute;
  top: 35.5%;
  left: 69.27%;
  width: min(471px, 24.53125vw);
  aspect-ratio: 471/273;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  pointer-events: none;
}
.header__inner__mv__parts__item03 picture {
  position: relative;
  z-index: 1;
}
.header__inner__mv__parts__item03 .icn {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 0;
  width: 48.407%;
}
.header__inner__mv__parts__item03 .icn_02 {
  animation: head_icn_03 1.8s ease-in-out infinite;
}
.header__inner__mv__nyachikawa {
  position: relative;
  aspect-ratio: 720/635;
  width: min(720px, 37.5vw);
  margin-inline: auto;
  overflow: hidden;
  margin-top: 0;
}
.header__inner__mv__nyachikawa__parts01, .header__inner__mv__nyachikawa__parts02, .header__inner__mv__nyachikawa__parts03 {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  pointer-events: none;
  animation: nyachikawa_body 1.78s ease-in-out infinite;
  transform-origin: center bottom;
}
.header__inner__mv__nyachikawa__hand {
  position: absolute;
  top: 42.2%;
  left: 16.2%;
  z-index: 1;
  width: 17.916%;
  transform-origin: center bottom;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  animation: nyachikawa_hand 1.78s ease-in-out infinite;
}
.header__inner__mv__nyachikawa__parts01 {
  z-index: 0;
}
.header__inner__mv__nyachikawa__parts02 {
  z-index: 1;
}
.header__inner__mv__nyachikawa__parts03 {
  z-index: 1;
}
.header__inner__mv::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: min(100px, 5.2083333333vw);
  background: url("../../assets/img/header_bottom.png") center top/auto min(100px, 5.2083333333vw) repeat-x;
  z-index: 0;
}
.header__inner__mv .copy {
  position: absolute;
  top: 80%;
  left: calc(50% + min(430px, 22.3958333333vw));
  transform: translateX(-50%);
  z-index: 100;
  font-size: min(14px, 0.7291666667vw);
}

.about {
  background: var(--color-point_02) url("../../assets/img/about_bottom.png") center calc(100% + 1px)/min(1920px, 100vw) auto repeat-x;
  text-align: center;
  color: var(--color-white);
  font-weight: 500;
  font-feature-settings: "palt";
  line-height: 3.15625;
  transform: translateY(-1px);
}
.about__inner {
  background: url("../../assets/img/about_bg.png") center top/min(1978px, 131.8666666667vw) auto no-repeat;
  padding-bottom: min(200px, 13.3333333333vw);
}
.about__inner h2 {
  text-align: center;
  margin-bottom: min(100px, 6.6666666667vw);
  padding-top: min(40px, 2.6666666667vw);
  width: min(914px, 60.9333333333vw);
  margin-inline: auto;
}
.about__inner p {
  font-size: min(32px, 2.1333333333vw);
}

.profile {
  position: relative;
  padding-bottom: min(200px, 16.6666666667vw);
  overflow: hidden;
}
.profile__inner {
  padding-top: min(120px, 10vw);
}
.profile__inner__frame {
  background: url("../../assets/img/profile_frame_outer_pc.png") top left/cover no-repeat;
  width: min(1431px, 74.53125vw);
  margin-inline: auto;
  aspect-ratio: 1431/683;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.profile__inner__frame__nyachikawa_01 {
  position: absolute;
  top: 9%;
  right: -13.5%;
  width: min(418px, 21.7708333333vw);
  transition: 0.5s;
  transform-origin: center;
  transform: translateX(-100%);
}
.profile__inner__frame__nyachikawa_01.scrollIn {
  animation: nyachikawa_01 0.6s ease-in-out forwards;
}
.profile__inner__frame__nyachikawa_02 {
  position: absolute;
  bottom: 10%;
  left: -15%;
  width: min(334px, 17.3958333333vw);
  transition: 0.5s;
  transform-origin: center;
  transform: translateX(100%);
}
.profile__inner__frame__nyachikawa_02.scrollIn {
  animation: nyachikawa_02 0.5s ease-in-out forwards;
  animation-delay: 0.2s;
}
.profile__inner__frame__block {
  background: url("../../assets/img/profile_frame_inner_pc.png") top left/cover no-repeat;
  width: min(1351px, 70.3645833333vw);
  margin-inline: auto;
  aspect-ratio: 1351/603;
  position: relative;
}
.profile__inner__frame__block h2 {
  width: min(781px, 40.6770833333vw);
  margin-inline: auto;
  margin-top: -6%;
}
.profile__inner__frame__block dl {
  display: flex;
  flex-wrap: wrap;
  width: 85%;
  margin-inline: auto;
  font-weight: 500;
  letter-spacing: min(5px, 0.2604166667vw);
  gap: min(56px, 2.9166666667vw) 0;
  padding-top: min(76px, 3.9583333333vw);
}
.profile__inner__frame__block dl dt {
  width: 30%;
  background: url("../../assets/img/profile_icn.png") left center/min(55px, 2.8645833333vw) auto no-repeat;
  font-size: min(32px, 1.6666666667vw);
  color: var(--color-point_01);
  padding-left: min(80px, 4.1666666667vw);
}
.profile__inner__frame__block dl dd {
  width: 70%;
  font-size: min(32px, 1.6666666667vw);
}
.profile::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: min(80px, 4.1666666667vw);
  background: url("../../assets/img/profile_bottom.png") center top/auto min(80px, 4.1666666667vw) repeat-x;
  z-index: 0;
  transform: translateY(1px);
}

.cs {
  background: var(--color-point_03);
  position: relative;
  padding: 0 0 min(130px, 8.6666666667vw);
}
.cs::before {
  position: absolute;
  bottom: 0;
  left: 0;
  content: "";
  width: 100%;
  height: min(65px, 4.3333333333vw);
  display: block;
  background: url("../../assets/img/footer_line.png") bottom center/auto min(65px, 3.6666666667vw) repeat-x;
}
.cs__inner h2 {
  text-align: center;
  width: min(578px, 38.5333333333vw);
  padding: min(48px, 3.2vw) 0 min(80px, 5.3333333333vw);
  margin-inline: auto;
}
.cs__inner p {
  font-size: min(32px, 2.1333333333vw);
  color: var(--color-white);
  text-align: center;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: min(3px, 0.2vw);
  padding: 0 0 min(48px, 3.2vw);
}
.cs__inner__img {
  width: min(250px, 16.6666666667vw);
  margin-inline: auto;
  transform-origin: bottom center;
  opacity: 0;
}
.cs__inner__img.scrollIn {
  animation: nyachikawa_cs 0.4s ease forwards;
  animation-delay: 0.1s;
}

.footer {
  background: var(--color-point_01);
  color: var(--color-white);
  font-size: 16px;
  line-height: 1;
  padding-bottom: 16px;
  text-align: center;
}

@media (width <= 767px) {
  .header {
    background: url("../../assets/img/header_bg.png") center top/min(90px, 12vw);
    padding: min(56px, 7.4666666667vw) 0 0;
  }
  .header::before {
    height: min(56px, 7.4666666667vw);
    background: url("../../assets/img/header_line.png") top center/auto min(56px, 7.4666666667vw) repeat-x;
  }
  .header__inner {
    padding: min(56px, 7.4666666667vw) 0 0;
  }
  .header__inner__head__logo {
    position: relative;
    width: min(200px, 26.6666666667vw);
  }
  .header__inner__head__title {
    width: min(608px, 81.0666666667vw);
    margin-top: min(12px, 1.6vw);
  }
  .header__inner__mv {
    padding-top: min(120px, 16vw);
    position: relative;
  }
  .header__inner__mv__parts {
    position: absolute;
    max-width: 1920px;
    width: 100%;
    height: 100%;
    margin-inline: auto;
    left: 50%;
    transform: translateX(-50%);
  }
  .header__inner__mv__parts__item01 {
    top: -6%;
    left: 1%;
    width: min(177px, 23.6vw);
    aspect-ratio: 177/279;
  }
  .header__inner__mv__parts__item01 .icn {
    top: 0;
    left: 0;
    width: 100%;
  }
  .header__inner__mv__parts__item02 {
    top: -13.5%;
    left: 61%;
    width: min(268px, 35.7333333333vw);
    aspect-ratio: 268/153;
  }
  .header__inner__mv__parts__item02 .icn {
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: auto;
    right: 6%;
    width: 69.402%;
  }
  .header__inner__mv__parts__item03 {
    top: 17%;
    left: 74.5%;
    width: min(176px, 23.4666666667vw);
    aspect-ratio: 176/288;
  }
  .header__inner__mv__parts__item03 .icn {
    position: absolute;
    bottom: 21%;
    right: 0;
    z-index: 0;
    width: 82.386%;
  }
  .header__inner__mv__nyachikawa {
    width: min(580px, 77.3333333333vw);
    aspect-ratio: 720/650;
  }
  .header__inner__mv::after {
    height: min(75px, 10vw);
    background: url("../../assets/img/header_bottom.png") center top/auto min(75px, 10vw) repeat-x;
  }
  .header__inner__mv .copy {
    top: 83%;
    left: 10%;
    transform: translateX(0);
    font-size: min(14px, 1.8666666667vw);
  }
  .about {
    background: var(--color-point_02);
    position: relative;
    line-height: 3.625;
    overflow: hidden;
  }
  .about::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    background: var(--color-point_02) url("../../assets/img/about_bottom.png") center calc(100% + 2px)/min(1920px, 200vw) auto repeat-x;
    width: 100%;
    height: 100px;
    display: block;
    z-index: -1;
  }
  .about__inner {
    background: url("../../assets/img/about_bg_sp.png") center bottom/contain no-repeat;
    padding-bottom: min(170px, 22.6666666667vw);
  }
  .about__inner h2 {
    margin-bottom: min(110px, 14.6666666667vw);
    padding-top: min(75px, 10vw);
    width: min(650px, 86.6666666667vw);
  }
  .about__inner p {
    font-size: min(31px, 4.1333333333vw);
    letter-spacing: 0.35vw;
  }
  .profile {
    padding-bottom: min(170px, 22.6666666667vw);
    overflow: hidden;
  }
  .profile__inner {
    padding-top: min(160px, 21.3333333333vw);
  }
  .profile__inner__frame {
    background: url("../../assets/img/profile_frame_outer_sp.png") top left/cover no-repeat;
    width: min(636px, 84.8vw);
    aspect-ratio: 636/904;
  }
  .profile__inner__frame__nyachikawa_01 {
    top: 20%;
    right: -8%;
    width: min(180px, 24vw);
  }
  .profile__inner__frame__nyachikawa_02 {
    bottom: 20%;
    left: -8%;
    width: min(140px, 18.6666666667vw);
  }
  .profile__inner__frame__block {
    background: url("../../assets/img/profile_frame_inner_sp.png") top left/cover no-repeat;
    width: min(534px, 71.2vw);
    aspect-ratio: 534/814;
  }
  .profile__inner__frame__block h2 {
    width: min(460px, 61.3333333333vw);
    margin-top: -14%;
  }
  .profile__inner__frame__block dl {
    display: block;
    width: 100%;
    letter-spacing: min(6px, 0.8vw);
    padding-top: min(50px, 6.6666666667vw);
    text-align: center;
  }
  .profile__inner__frame__block dl dt {
    width: auto;
    display: inline-block;
    background: url("../../assets/img/profile_icn.png") left center/min(50px, 6.6666666667vw) auto no-repeat;
    font-size: min(31px, 4.1333333333vw);
    padding-left: min(70px, 9.3333333333vw);
  }
  .profile__inner__frame__block dl dd {
    width: 100%;
    font-size: min(28px, 3.7333333333vw);
    padding-top: min(15px, 2vw);
    line-height: 1.8;
  }
  .profile__inner__frame__block dl dd + dt {
    margin-top: min(50px, 6.6666666667vw);
  }
  .profile::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: min(60px, 8vw);
    background: url("../../assets/img/profile_bottom.png") center bottom/auto min(60px, 8vw) repeat-x;
    z-index: 0;
  }
  .cs {
    padding: 0 0 min(80px, 10.6666666667vw);
  }
  .cs::before {
    height: min(56px, 7.4666666667vw);
    background: url("../../assets/img/footer_line.png") top center/auto min(56px, 7.4666666667vw) repeat-x;
  }
  .cs__inner h2 {
    width: min(616px, 82.1333333333vw);
    padding: min(80px, 10.6666666667vw) 0 min(120px, 16vw);
  }
  .cs__inner p {
    font-size: min(31px, 4.1333333333vw);
    padding: 0 0 min(48px, 6.4vw);
  }
  .cs__inner__img {
    width: min(210px, 28vw);
    padding: 0 0 min(40px, 5.3333333333vw);
  }
  .footer {
    font-size: 14px;
    padding-bottom: 12px;
  }
}
@keyframes nyachikawa_hand {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-4deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@keyframes nyachikawa_body {
  0% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(0.992);
  }
  100% {
    transform: scaleY(1);
  }
}
@keyframes nyachikawa_01 {
  0% {
    transform: scaleX(1) translateX(-100%) rotate(0deg);
  }
  75% {
    transform: scaleX(0.9) translateX(15%) rotate(10deg);
  }
  100% {
    transform: scaleX(1) translateX(0%) rotate(0deg);
  }
}
@keyframes nyachikawa_02 {
  0% {
    transform: scaleX(1) translateX(100%) rotate(0deg);
  }
  75% {
    transform: scaleX(0.9) translateX(-15%) rotate(-10deg);
  }
  100% {
    transform: scaleX(1) translateX(0%) rotate(0deg);
  }
}
@keyframes nyachikawa_cs {
  0% {
    transform: scaleY(1) scaleX(1) translateY(-10%);
    opacity: 0;
  }
  80% {
    transform: scaleY(0.95) scaleX(1.05) translateY(2%);
    opacity: 1;
  }
  90% {
    transform: scaleY(0.95) scaleX(1.05) translateY(2%);
    opacity: 1;
  }
  100% {
    transform: scaleY(1) scaleX(1) translateY(0%);
    opacity: 1;
  }
}
@keyframes head_icn_01 {
  0% {
    transform: translateY(0);
  }
  10% {
    transform: translateY(-3px) scaleY(0.995);
  }
  20% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes head_icn_02 {
  0% {
    transform: translateY(0px);
  }
  20% {
    transform: translateY(-2px);
  }
  40% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(0px);
  }
}
@keyframes head_icn_03 {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0;
  }
  51% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}