@charset "UTF-8";
:root {
  --maincolor: #a1cc58;
  --subcolor: #e5378e;
  --textcolor: #651600;
  --container: 500px;
}

/* ======== ↓ common ↓ ======== */
#contentsWrapper {
  font-size: 15px;
  font-family: "MFW-PShinMGoPr6N-Regular", "Noto Sans JP", sans-serif;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  font-weight: normal;
  line-height: 1.5;
  letter-spacing: 0;
  width: 100%;
  color: var(--textcolor);
  overflow: hidden;
  position: relative;
}

@media screen and (max-width: 498px) {
  #contentsWrapper {
    font-size: max(2.2vw,12px);
  }
}

#contentsWrapper * {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

#contentsWrapper *::-webkit-scrollbar {
  scrollbar-width: thin;
  scrollbar-color: #89a93f rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.3);
  border-radius: 4px;
  width: 4px;
}

#contentsWrapper *::-webkit-scrollbar-thumb {
  background: #89a93f;
  border-radius: 4px;
}

#contentsWrapper a {
  opacity: 1;
  color: inherit;
  background-color: transparent;
  text-decoration: none !important;
  -webkit-transition: all 0.15s ease;
  transition: all 0.15s ease;
}

#contentsWrapper a.hover {
  color: var(--maincolor);
  background-color: transparent;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

#contentsWrapper img {
  max-width: 100%;
  height: auto;
  display: block;
}

#contentsWrapper .cover {
  width: 100%;
  max-width: none;
  height: auto;
}

#contentsWrapper ul, #contentsWrapper ol {
  list-style: none;
}

#contentsWrapper .sectionWrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

#contentsWrapper .widthWrapper {
  position: relative;
  width: 100%;
  max-width: var(--container);
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding-left: 4%;
  padding-right: 4%;
}

#contentsWrapper .insideWrapper {
  position: relative;
  width: 80%;
  max-width: inherit;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

#contentsWrapper :root {
  --c-flex-gap: 2%;
}

#contentsWrapper .c-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

#contentsWrapper .c-flex.gap > * {
  margin-left: var(--c-flex-gap);
}

#contentsWrapper .c-flex.gapLarge > * {
  margin-left: calc(var(--c-flex-gap) * 2);
}

#contentsWrapper .c-flex:not(.c-flex-reverse) > *:first-child {
  margin-left: 0;
}

#contentsWrapper .c-flex--2 > * {
  width: calc(100% / 2);
}

#contentsWrapper .c-flex--2.gap > * {
  width: calc(calc(100% - calc(var(--c-flex-gap) * calc(2 - 1))) / 2);
}

#contentsWrapper .c-flex--2.gap > *:nth-child(2n+1) {
  margin-left: 0;
}

#contentsWrapper .c-flex--3 > * {
  width: calc(100% / 3);
}

#contentsWrapper .c-flex--3.gap > * {
  width: calc(calc(100% - calc(var(--c-flex-gap) * calc(3 - 1))) / 3);
}

#contentsWrapper .c-flex--3.gap > *:nth-child(3n+1) {
  margin-left: 0;
}

#contentsWrapper .c-flex--4 > * {
  width: calc(100% / 4);
}

#contentsWrapper .c-flex--4.gap > * {
  width: calc(calc(100% - calc(var(--c-flex-gap) * calc(4 - 1))) / 4);
}

#contentsWrapper .c-flex--4.gap > *:nth-child(4n+1) {
  margin-left: 0;
}

#contentsWrapper .c-flex--5 > * {
  width: calc(100% / 5);
}

#contentsWrapper .c-flex--5.gap > * {
  width: calc(calc(100% - calc(var(--c-flex-gap) * calc(5 - 1))) / 5);
}

#contentsWrapper .c-flex--5.gap > *:nth-child(5n+1) {
  margin-left: 0;
}

#contentsWrapper .c-flex--6 > * {
  width: calc(100% / 6);
}

#contentsWrapper .c-flex--6.gap > * {
  width: calc(calc(100% - calc(var(--c-flex-gap) * calc(6 - 1))) / 6);
}

#contentsWrapper .c-flex--6.gap > *:nth-child(6n+1) {
  margin-left: 0;
}

#contentsWrapper .c-flex.--end {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

#contentsWrapper .c-flex.--center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#contentsWrapper .c-flex.--between {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

#contentsWrapper .c-flex.--alignEnd {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

#contentsWrapper .c-flex.--alignCenter {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#contentsWrapper .c-flex.--wrap {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

#contentsWrapper .c-flex.--reverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}

#contentsWrapper .c-flex.--column {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

#contentsWrapper .alignCenter {
  text-align: center;
}

#contentsWrapper .alignRight {
  text-align: right;
}

#contentsWrapper .alignLeft {
  text-align: left;
}

#contentsWrapper img.alignCenter {
  margin-left: auto;
  margin-right: auto;
}

#contentsWrapper img.alignLeft {
  margin-left: 0;
  margin-right: auto;
}

#contentsWrapper img.alignRight {
  margin-left: auto;
  margin-right: 0;
}

#contentsWrapper .lh-10 {
  line-height: 1;
}

#contentsWrapper .lh-15 {
  line-height: 1.5;
}

#contentsWrapper .lh-20 {
  line-height: 2;
}

#contentsWrapper .font-10 {
  font-size: 10px !important;
}

#contentsWrapper .font-12 {
  font-size: 12px !important;
}

#contentsWrapper .font-14 {
  font-size: 14px !important;
}

#contentsWrapper .font-16 {
  font-size: 16px !important;
}

#contentsWrapper .font-18 {
  font-size: 18px !important;
}

#contentsWrapper .font-20 {
  font-size: 20px !important;
}

#contentsWrapper .font-22 {
  font-size: 22px !important;
}

#contentsWrapper .font-24 {
  font-size: 24px !important;
}

#contentsWrapper .font-26 {
  font-size: 26px !important;
}

#contentsWrapper .font-28 {
  font-size: 28px !important;
}

#contentsWrapper .font-30 {
  font-size: 30px !important;
}

@media screen and (min-width: 499px) and (max-width: 520px) {
  #contentsWrapper .font-10 {
    font-size: 2vw !important;
  }
  #contentsWrapper .font-12 {
    font-size: 2.4vw !important;
  }
  #contentsWrapper .font-14 {
    font-size: 2.8vw !important;
  }
  #contentsWrapper .font-16 {
    font-size: 3.2vw !important;
  }
  #contentsWrapper .font-18 {
    font-size: 3.6vw !important;
  }
  #contentsWrapper .font-20 {
    font-size: 4vw !important;
  }
  #contentsWrapper .font-22 {
    font-size: 4.4vw !important;
  }
  #contentsWrapper .font-24 {
    font-size: 4.8vw !important;
  }
  #contentsWrapper .font-26 {
    font-size: 5.2vw !important;
  }
  #contentsWrapper .font-28 {
    font-size: 5.6vw !important;
  }
  #contentsWrapper .font-30 {
    font-size: 6vw !important;
  }
}

@media screen and (max-width: 498px) {
  #contentsWrapper .font-10 {
    font-size: 2.71429vw !important;
  }
  #contentsWrapper .font-12 {
    font-size: 3.08571vw !important;
  }
  #contentsWrapper .font-14 {
    font-size: 3.4vw !important;
  }
  #contentsWrapper .font-16 {
    font-size: 3.65714vw !important;
  }
  #contentsWrapper .font-18 {
    font-size: 3.85714vw !important;
  }
  #contentsWrapper .font-20 {
    font-size: 4vw !important;
  }
  #contentsWrapper .font-22 {
    font-size: 4.08571vw !important;
  }
  #contentsWrapper .font-24 {
    font-size: 4.11429vw !important;
  }
  #contentsWrapper .font-26 {
    font-size: 4.08571vw !important;
  }
  #contentsWrapper .font-28 {
    font-size: 4vw !important;
  }
  #contentsWrapper .font-30 {
    font-size: 3.85714vw !important;
  }
}

#contentsWrapper .mt-5 {
  margin-top: 0.5em !important;
}

#contentsWrapper .mt-10 {
  margin-top: 1em !important;
}

#contentsWrapper .mt-15 {
  margin-top: 1.5em !important;
}

#contentsWrapper .mt-20 {
  margin-top: 2em !important;
}

#contentsWrapper .mt-25 {
  margin-top: 2.5em !important;
}

#contentsWrapper .mt-30 {
  margin-top: 3em !important;
}

#contentsWrapper .mt-35 {
  margin-top: 3.5em !important;
}

#contentsWrapper .mt-40 {
  margin-top: 4em !important;
}

#contentsWrapper .mt-45 {
  margin-top: 4.5em !important;
}

#contentsWrapper .mt-50 {
  margin-top: 5em !important;
}

#contentsWrapper .font-pufu {
  font-family: "MFW-PPuhuPicnicMin2-H", "Noto Sans JP", sans-serif;
}

#contentsWrapper .u-bold {
  font-weight: bold;
}

#contentsWrapper .u-bg {
  background: #fffc01;
  padding: 0 0.2em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

#contentsWrapper .u-note {
  padding-left: 1em;
  text-indent: -1em;
  display: inline-block;
}

#contentsWrapper .u-marker {
  padding: 0 0.2em;
  margin: 0 0.2em;
  background: var(--maincolor);
  color: #fff;
}

#contentsWrapper .u-maincolor {
  color: var(--maincolor);
}

#contentsWrapper .u-subcolor {
  color: var(--subcolor);
}

#contentsWrapper .u-hidden {
  display: none;
  visibility: hidden;
}

#contentsWrapper .c-blockLink a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

#contentsWrapper [data-ruby] {
  position: relative;
  display: inline-block;
  line-height: 1;
}

#contentsWrapper [data-ruby]:before {
  content: attr(data-ruby);
  position: absolute;
  top: -0.8em;
  left: 50%;
  font-size: max(0.35em,8px);
  line-height: 1;
  text-align: center;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  white-space: nowrap;
}

@media screen and (min-width: 499px) {
  #contentsWrapper .sp {
    display: none !important;
  }
  #contentsWrapper a[href^="tel:"] {
    pointer-events: none;
  }
}

@media screen and (max-width: 498px) {
  #contentsWrapper .pc {
    display: none !important;
  }
}

#includeFooter {
  position: relative;
  z-index: 11;
}

/* ======== ↑ End common ↑ ======== */
/* ======== ↓ main ↓ ======== */
.is-modalOpen {
  -ms-touch-action: none;
      touch-action: none;
  overflow: hidden;
  -ms-scroll-chaining: none;
      overscroll-behavior: none;
}

:root {
  --jaggyX: 50px;
  --jaggyY: 15px;
  --cubeSize1: 300px;
  --cubeSize2: 162.5px;
}

@media screen and (max-width: 498px) {
  :root {
    --jaggyX: 10vw;
    --jaggyY: 3vw;
  }
}

#contentsWrapper {
  position: relative;
  /* modal */
}

#contentsWrapper .mainWrapper {
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
  background: #fff;
  -webkit-box-shadow: 0 0 0 2px #e5378e;
          box-shadow: 0 0 0 2px #e5378e;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

#contentsWrapper .l-content {
  position: relative;
  z-index: 3;
}

#contentsWrapper .parallaxWrapper {
  position: relative;
}

#contentsWrapper .parallax {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-clip-path: inset(0);
          clip-path: inset(0);
}

#contentsWrapper .parallax .bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
}

#contentsWrapper .parallax.--outer .bg {
  background: url(../images/outerBg.png) no-repeat center/cover;
}

#contentsWrapper .parallax.--outer .left {
  position: fixed;
  top: 0;
  left: 0;
  width: calc(50% - 250px);
  height: 100vh;
}

#contentsWrapper .parallax.--outer .left .kv {
  position: absolute;
  top: 35%;
  left: 0;
  right: 0;
  margin: auto;
  width: 437px;
  max-width: 79.46%;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  z-index: 1;
}

#contentsWrapper .parallax.--outer .right {
  position: fixed;
  top: 0;
  right: 0;
  width: calc(50% - 250px);
  height: 100vh;
}

#contentsWrapper .parallax.--outer .right .wrap {
  position: absolute;
  top: 39%;
  left: 11%;
  width: 367px;
  max-width: 66.73%;
}

#contentsWrapper .parallax.--outer .right .logo {
  margin: 0 auto;
  width: 262px;
  max-width: 71.4%;
}

#contentsWrapper .parallax.--outer .right .anniversary {
  margin: 6% auto 0;
  width: 367px;
  max-width: 100%;
}

#contentsWrapper .parallax.--inner {
  pointer-events: none;
  z-index: 1;
}

#contentsWrapper .parallax.--inner > * {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 100%;
  max-width: 500px;
  height: 100%;
}

#contentsWrapper .parallax.--inner .star > * {
  position: absolute;
  width: 35px;
  aspect-ratio: 1 / 1;
  background: #fff;
  -webkit-mask: url(../images/common/star.svg) center/contain no-repeat;
          mask: url(../images/common/star.svg) center/contain no-repeat;
  -webkit-animation: star 2s steps(2, jump-none) 0s infinite normal forwards running;
          animation: star 2s steps(2, jump-none) 0s infinite normal forwards running;
}

#contentsWrapper .parallax.--inner .star > *.yellow {
  background: #fff461;
}

#contentsWrapper .parallax.--inner .star > *.s {
  width: 20px;
}

#contentsWrapper .parallax.--inner .star > *:nth-child(1) {
  top: 1%;
  left: 85%;
}

#contentsWrapper .parallax.--inner .star > *:nth-child(2) {
  top: 8%;
  left: 32%;
}

#contentsWrapper .parallax.--inner .star > *:nth-child(3) {
  top: 80%;
  left: 12%;
  width: 35px;
}

#contentsWrapper .parallax.--inner .star > *:nth-child(4) {
  top: 78%;
  left: 94%;
}

#contentsWrapper .parallax.--inner .star > *:nth-child(5) {
  top: 23%;
  left: 34%;
}

#contentsWrapper .parallax.--inner .star > *:nth-child(6) {
  top: 34%;
  left: 92%;
}

#contentsWrapper .parallax.--inner .star > *:nth-child(7) {
  top: 53%;
  left: 1%;
}

#contentsWrapper .parallax.--inner .star > *:nth-child(8) {
  top: 93%;
  left: 24%;
}

#contentsWrapper .parallax.--inner .confetti > * {
  width: 50px;
  aspect-ratio: 3 / 2;
  position: absolute;
  -webkit-animation: fall 20s cubic-bezier(0.5, 0.25, 0.9, 1) 0s 1 normal forwards running;
          animation: fall 20s cubic-bezier(0.5, 0.25, 0.9, 1) 0s 1 normal forwards running;
}

#contentsWrapper .parallax.--inner .confetti > *:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #ccc;
  -webkit-animation: confetti 1s linear 0s infinite normal forwards running;
          animation: confetti 1s linear 0s infinite normal forwards running;
}

#contentsWrapper .parallax.--inner .confetti > *.red:before {
  background: #ee7d75;
}

#contentsWrapper .parallax.--inner .confetti > *.blue:before {
  background: #50bca4;
}

#contentsWrapper .parallax.--inner .confetti > *.pink:before {
  background: #eb6fa7;
}

#contentsWrapper .parallax.--inner .confetti > *.yellow:before {
  background: #fcc800;
}

#contentsWrapper .parallax.--inner .ribbon > * {
  position: absolute;
  top: 0;
  left: 0;
  width: 90px;
  aspect-ratio: 1 / 1;
  -webkit-animation: fuwa 3s ease-in-out 0s infinite alternate forwards running;
          animation: fuwa 3s ease-in-out 0s infinite alternate forwards running;
}

#contentsWrapper .parallax.--inner .ribbon > *:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../images/common/ribbon.svg) no-repeat center/contain;
  display: block;
}

#contentsWrapper .parallax.--inner .ribbon > *.red:before {
  background-image: url(../images/common/ribbon.svg);
}

#contentsWrapper .parallax.--inner .ribbon > *.purple:before {
  background-image: url(../images/common/ribbon_purple.svg);
}

#contentsWrapper .parallax.--inner .ribbon > *.pink:before {
  background-image: url(../images/common/ribbon_pink.svg);
}

#contentsWrapper .parallax.--inner .ribbon > *.yellow:before {
  background-image: url(../images/common/ribbon_yellow.svg);
}

#contentsWrapper .parallax.--inner .ribbon > *.s {
  width: 50px;
}

#contentsWrapper .parallax.--inner .ribbon > *.l {
  width: 130px;
}

#contentsWrapper .parallax.--inner .ribbon > *:nth-child(1) {
  top: 1%;
  left: 67%;
}

#contentsWrapper .parallax.--inner .ribbon > *:nth-child(1):before {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

#contentsWrapper .parallax.--inner .ribbon > *:nth-child(2) {
  top: 23%;
  left: 88%;
}

#contentsWrapper .parallax.--inner .ribbon > *:nth-child(3) {
  top: 68%;
  left: -8%;
}

#contentsWrapper .parallax.--inner .ribbon > *:nth-child(3):before {
  -webkit-transform: rotate(52deg);
          transform: rotate(52deg);
}

#contentsWrapper .parallax.--inner .ribbon > *:nth-child(4) {
  top: 73%;
  left: 81%;
}

#contentsWrapper .parallax.--inner .ribbon > *:nth-child(4):before {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

#contentsWrapper .parallax.--inner .ribbon > *:nth-child(5) {
  top: 90%;
  left: 64%;
}

#contentsWrapper .parallax.--inner .ribbon > *:nth-child(5):before {
  -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
}

#contentsWrapper .parallax.--inner .chocobi > * {
  position: absolute;
  top: 0;
  left: 0;
  width: 100px;
  aspect-ratio: 1 / 1;
  -webkit-animation: fall 20s cubic-bezier(0.5, 0.25, 0.9, 1) 0s 1 normal forwards running;
          animation: fall 20s cubic-bezier(0.5, 0.25, 0.9, 1) 0s 1 normal forwards running;
}

#contentsWrapper .parallax.--inner .chocobi > *:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../images/common/chocobi_snack.png) no-repeat center/contain;
  display: block;
  -webkit-animation: rotate 15s linear 0s infinite normal forwards running;
          animation: rotate 15s linear 0s infinite normal forwards running;
}

#contentsWrapper .parallax.parallax2 .bg {
  background: url(../images/bg002.jpg) repeat-y center/cover;
}

@media screen and (max-width: 498px) {
  #contentsWrapper .parallax {
    background-size: auto 100vh;
  }
}

#contentsWrapper h2.heading {
  font-family: "MFW-PPuhuPicnicMin2-H", "Noto Sans JP", sans-serif;
  font-size: 50px;
  line-height: 1;
  text-align: center;
}

#contentsWrapper [data-edge] {
  position: relative;
}

#contentsWrapper [data-edge]:before, #contentsWrapper [data-edge]:after {
  content: attr(data-edge);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  -webkit-text-stroke: #fff 0.14em;
  z-index: -1;
}

#contentsWrapper [data-edge]:after {
  top: 0.12em;
  -webkit-text-stroke-color: #000;
  z-index: -2;
}

#contentsWrapper .c-btn a {
  font-family: "MFW-PPuhuPicnicMin2-H", "Noto Sans JP", sans-serif;
  font-size: 25px;
  text-align: center;
  line-height: 1.5;
  width: 100%;
  max-width: 8em;
  min-height: 1.8em;
  padding: 0.1em 0.25em;
  color: #fff;
  background: var(--textcolor);
  border: 0.12em solid #fff;
  border-radius: 3em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
  -webkit-transition: 0.15s;
  transition: 0.15s;
}

#contentsWrapper .c-btn a.center {
  margin-left: auto;
  margin-right: auto;
}

#contentsWrapper .c-btn a.fit {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: none;
  padding: 0.1em 0.5em;
}

#contentsWrapper .c-btn a:hover {
  background: var(--subcolor);
  -webkit-transform: scale(0.95);
          transform: scale(0.95);
}

@media screen and (min-width: 499px) and (max-width: 520px) {
  #contentsWrapper .c-btn a {
    font-size: 2.5vw;
  }
}

@media screen and (max-width: 498px) {
  #contentsWrapper .c-btn a {
    font-size: min(6vw,30px);
  }
}

#contentsWrapper .c-boundary {
  margin-top: calc(-1 * var(--jaggyY));
  height: calc(100% + var(--jaggyY));
}

#contentsWrapper .c-boundary_jaggy {
  -webkit-clip-path: polygon(0 var(--jaggyY), 2.5% 0, 5% var(--jaggyY), 7.5% 0, 10% var(--jaggyY), 12.5% 0, 15% var(--jaggyY), 17.5% 0, 20% var(--jaggyY), 22.5% 0, 25% var(--jaggyY), 27.5% 0, 30% var(--jaggyY), 32.5% 0, 35% var(--jaggyY), 37.5% 0, 40% var(--jaggyY), 42.5% 0, 45% var(--jaggyY), 47.5% 0, 50% var(--jaggyY), 52.5% 0, 55% var(--jaggyY), 57.5% 0, 60% var(--jaggyY), 62.5% 0, 65% var(--jaggyY), 67.5% 0, 70% var(--jaggyY), 72.5% 0, 75% var(--jaggyY), 77.5% 0, 80% var(--jaggyY), 82.5% 0, 85% var(--jaggyY), 87.5% 0, 90% var(--jaggyY), 92.5% 0, 95% var(--jaggyY), 97.5% 0, 100% var(--jaggyY), 100.05% 100.1%, 0 100.1%);
          clip-path: polygon(0 var(--jaggyY), 2.5% 0, 5% var(--jaggyY), 7.5% 0, 10% var(--jaggyY), 12.5% 0, 15% var(--jaggyY), 17.5% 0, 20% var(--jaggyY), 22.5% 0, 25% var(--jaggyY), 27.5% 0, 30% var(--jaggyY), 32.5% 0, 35% var(--jaggyY), 37.5% 0, 40% var(--jaggyY), 42.5% 0, 45% var(--jaggyY), 47.5% 0, 50% var(--jaggyY), 52.5% 0, 55% var(--jaggyY), 57.5% 0, 60% var(--jaggyY), 62.5% 0, 65% var(--jaggyY), 67.5% 0, 70% var(--jaggyY), 72.5% 0, 75% var(--jaggyY), 77.5% 0, 80% var(--jaggyY), 82.5% 0, 85% var(--jaggyY), 87.5% 0, 90% var(--jaggyY), 92.5% 0, 95% var(--jaggyY), 97.5% 0, 100% var(--jaggyY), 100.05% 100.1%, 0 100.1%);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

#contentsWrapper .u-bg_green {
  background-color: #a1cc58;
}

#contentsWrapper .u-bg_pink {
  background-color: #e5378e;
}

#contentsWrapper .c-cube {
  -webkit-perspective: calc(var(--cubeSize1) * 10);
          perspective: calc(var(--cubeSize1) * 10);
  -webkit-perspective-origin: center -100%;
          perspective-origin: center -100%;
}

#contentsWrapper .c-cube_body {
  width: var(--cubeSize1);
  aspect-ratio: 1 / 1;
  margin: 0 auto;
  position: relative;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}

#contentsWrapper .c-cube_body.--rotate {
  -webkit-animation: cubeRotate 10s linear 0s infinite normal forwards running;
          animation: cubeRotate 10s linear 0s infinite normal forwards running;
}

#contentsWrapper .c-cube_body .face {
  width: var(--cubeSize1);
  aspect-ratio: 1 / 1;
  background: rgba(153, 153, 153, 0.7);
  border: 1px solid #000;
  position: absolute;
  top: -100%;
  left: -100%;
  right: -100%;
  bottom: -100%;
  margin: auto;
}

#contentsWrapper .c-cube_body.--hexahedron .face.--face1 {
  -webkit-transform: translateZ(calc(var(--cubeSize1) / 2));
          transform: translateZ(calc(var(--cubeSize1) / 2));
}

#contentsWrapper .c-cube_body.--hexahedron .face.--face2 {
  -webkit-transform: rotateY(90deg) translateZ(calc(var(--cubeSize1) / 2));
          transform: rotateY(90deg) translateZ(calc(var(--cubeSize1) / 2));
}

#contentsWrapper .c-cube_body.--hexahedron .face.--face3 {
  -webkit-transform: rotateY(180deg) translateZ(calc(var(--cubeSize1) / 2));
          transform: rotateY(180deg) translateZ(calc(var(--cubeSize1) / 2));
}

#contentsWrapper .c-cube_body.--hexahedron .face.--face4 {
  -webkit-transform: rotateY(270deg) translateZ(calc(var(--cubeSize1) / 2));
          transform: rotateY(270deg) translateZ(calc(var(--cubeSize1) / 2));
}

#contentsWrapper .c-cube_body.--hexahedron .face.--face5 {
  -webkit-transform: rotateX(90deg) translateZ(calc(var(--cubeSize1) / 2));
          transform: rotateX(90deg) translateZ(calc(var(--cubeSize1) / 2));
}

#contentsWrapper .c-cube_body.--hexahedron .face.--face6 {
  -webkit-transform: rotateX(-90deg) translateZ(calc(var(--cubeSize1) / 2));
          transform: rotateX(-90deg) translateZ(calc(var(--cubeSize1) / 2));
}

#contentsWrapper .c-cube_body.--octahedron {
  width: var(--cubeSize2);
  aspect-ratio: 1 / 2.874;
}

#contentsWrapper .c-cube_body.--octahedron .face {
  width: var(--cubeSize2);
  aspect-ratio: 1 / 2.874;
}

#contentsWrapper .c-cube_body.--octahedron .face.--face1 {
  -webkit-transform: translateZ(calc(0.866 * var(--cubeSize2)));
          transform: translateZ(calc(0.866 * var(--cubeSize2)));
}

#contentsWrapper .c-cube_body.--octahedron .face.--face2 {
  -webkit-transform: rotateY(60deg) translateZ(calc(0.866 * var(--cubeSize2)));
          transform: rotateY(60deg) translateZ(calc(0.866 * var(--cubeSize2)));
}

#contentsWrapper .c-cube_body.--octahedron .face.--face3 {
  -webkit-transform: rotateY(120deg) translateZ(calc(0.866 * var(--cubeSize2)));
          transform: rotateY(120deg) translateZ(calc(0.866 * var(--cubeSize2)));
}

#contentsWrapper .c-cube_body.--octahedron .face.--face4 {
  -webkit-transform: rotateY(180deg) translateZ(calc(0.866 * var(--cubeSize2)));
          transform: rotateY(180deg) translateZ(calc(0.866 * var(--cubeSize2)));
}

#contentsWrapper .c-cube_body.--octahedron .face.--face5 {
  -webkit-transform: rotateY(240deg) translateZ(calc(0.866 * var(--cubeSize2)));
          transform: rotateY(240deg) translateZ(calc(0.866 * var(--cubeSize2)));
}

#contentsWrapper .c-cube_body.--octahedron .face.--face6 {
  -webkit-transform: rotateY(300deg) translateZ(calc(0.866 * var(--cubeSize2)));
          transform: rotateY(300deg) translateZ(calc(0.866 * var(--cubeSize2)));
}

#contentsWrapper .c-cube_body.--octahedron .face.--face7 {
  width: calc(var(--cubeSize2) * 2);
  aspect-ratio: 1 / 0.866;
  -webkit-clip-path: polygon(25% 0%, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
          clip-path: polygon(25% 0%, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
  -webkit-transform: rotateX(90deg) translateZ(calc(var(--cubeSize2) * 1.437));
          transform: rotateX(90deg) translateZ(calc(var(--cubeSize2) * 1.437));
}

#contentsWrapper .c-cube_body.--octahedron .face.--face8 {
  width: calc(var(--cubeSize2) * 2);
  aspect-ratio: 1 / 0.866;
  -webkit-clip-path: polygon(25% 0%, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
          clip-path: polygon(25% 0%, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
  -webkit-transform: rotateX(-90deg) translateZ(calc(var(--cubeSize2) * 1.437));
          transform: rotateX(-90deg) translateZ(calc(var(--cubeSize2) * 1.437));
}

#contentsWrapper .c-cube.--drag {
  cursor: -webkit-grab;
  cursor: grab;
}

#contentsWrapper .c-cube.--drag:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

#contentsWrapper .c-select {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 2em;
}

#contentsWrapper .c-select button {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  font-family: "MFW-PPuhuPicnicMin2-H", "Noto Sans JP", sans-serif;
  font-size: 25px;
  text-align: center;
  line-height: 1.5;
  width: 100%;
  max-width: 8em;
  min-height: 1.8em;
  padding: 0.1em 0.25em;
  color: #fff;
  background: var(--textcolor);
  border: 0.12em solid #fff;
  border-radius: 3em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
  -webkit-transition: 0.15s;
  transition: 0.15s;
}

#contentsWrapper .c-select button:hover {
  background: var(--subcolor);
  -webkit-transform: scale(0.95);
          transform: scale(0.95);
}

@media screen and (max-width: 498px) {
  #contentsWrapper .c-select button {
    font-size: 5vw;
  }
}

#contentsWrapper .c-tab_content {
  display: none;
}

#contentsWrapper .c-tab_content.active {
  display: block;
}

#contentsWrapper .c-copyright {
  text-align: center;
  letter-spacing: 0.14em;
}

#contentsWrapper .p-block {
  padding-top: 65px;
  padding-bottom: 50px;
}

@media screen and (max-width: 498px) {
  #contentsWrapper .p-block {
    padding-top: 13%;
    padding-bottom: 10%;
  }
}

#contentsWrapper .p-kv {
  width: 100%;
  aspect-ratio: 1 / 2.03;
  overflow: hidden;
  position: relative;
}

#contentsWrapper .p-kv .inner {
  width: 100%;
  height: 100%;
}

#contentsWrapper .p-kv .inner > * {
  position: absolute;
}

#contentsWrapper .p-kv img {
  width: 100%;
  max-width: none;
}

#contentsWrapper .p-kv .catch {
  top: 10.7%;
  left: 1.5%;
  width: 97%;
}

#contentsWrapper .p-kv .img1 {
  top: 22.9%;
  left: 4%;
  width: 92%;
}

#contentsWrapper .p-kv .logo {
  top: 59.7%;
  left: 22.55%;
  width: 55.1%;
}

#contentsWrapper .p-kv .anniversary {
  top: 77.2%;
  left: 11.4%;
  width: 77.2%;
}

#contentsWrapper .p-kv .movie {
  right: 11.6%;
  bottom: 2.7%;
}

#contentsWrapper .p-kv .movie img {
  position: absolute;
  left: 48%;
  bottom: 12%;
  width: 202.44%;
  border: 4px solid #fff;
  border-radius: 10px;
  -webkit-box-shadow: 4px 4px 0 #89a93f;
          box-shadow: 4px 4px 0 #89a93f;
}

#contentsWrapper .p-kv .movie .play {
  font-size: 62px;
  width: 1em;
  aspect-ratio: 1 / 1;
  background: var(--subcolor);
  -webkit-box-shadow: 0.048em 0.048em 0 #a8125d;
          box-shadow: 0.048em 0.048em 0 #a8125d;
  border-radius: 50%;
  position: relative;
  -webkit-transition: 0.15s cubic-bezier(0.1, 0.66, 0.33, 1.5);
  transition: 0.15s cubic-bezier(0.1, 0.66, 0.33, 1.5);
}

#contentsWrapper .p-kv .movie .play:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0.1em;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 0;
  height: 0;
  border: 0.24em solid transparent;
  border-left: 0.42em solid #fff;
  border-right: 0;
}

#contentsWrapper .p-kv .movie:hover .play {
  background: #c32574;
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-transform: translate(0.048em, 0.048em);
          transform: translate(0.048em, 0.048em);
}

#contentsWrapper .p-kv.js-scroll .catch {
  -webkit-transition: 0.6s ease 0.3s;
  transition: 0.6s ease 0.3s;
  opacity: 0;
  -webkit-transform: translateY(2em);
          transform: translateY(2em);
}

#contentsWrapper .p-kv.js-scroll .img1 {
  -webkit-transition: 1s ease 0.9s;
  transition: 1s ease 0.9s;
  opacity: 0;
  -webkit-transform: scale(0.5) rotateY(360deg);
          transform: scale(0.5) rotateY(360deg);
  -webkit-filter: contrast(0) brightness(2);
          filter: contrast(0) brightness(2);
}

#contentsWrapper .p-kv.js-scroll .logo, #contentsWrapper .p-kv.js-scroll .anniversary {
  -webkit-transition: 0.5s cubic-bezier(0.33, 0, 0.33, 1.5) 1.7s;
  transition: 0.5s cubic-bezier(0.33, 0, 0.33, 1.5) 1.7s;
  opacity: 0;
  -webkit-transform: scale(0);
          transform: scale(0);
}

#contentsWrapper .p-kv.js-scroll .anniversary {
  -webkit-transition-delay: 1.8s;
          transition-delay: 1.8s;
}

#contentsWrapper .p-kv.is-scroll .catch, #contentsWrapper .p-kv.is-scroll .img1, #contentsWrapper .p-kv.is-scroll .logo, #contentsWrapper .p-kv.is-scroll .anniversary {
  opacity: 1;
  -webkit-transform: none;
          transform: none;
  -webkit-filter: none;
          filter: none;
}

@media screen and (max-width: 498px) {
  #contentsWrapper .p-kv .movie .play {
    font-size: 12.4vw;
  }
}

#contentsWrapper .p-campaign {
  padding-top: 30px;
  padding-bottom: 60px;
}

#contentsWrapper .p-campaign .bnr {
  margin-top: 30px;
}

@media screen and (max-width: 498px) {
  #contentsWrapper .p-campaign {
    padding-top: 6%;
    padding-bottom: 12%;
  }
  #contentsWrapper .p-campaign .bnr {
    margin-top: 6%;
  }
}

#contentsWrapper .p-message {
  padding-top: 77px;
  padding-bottom: 95px;
}

#contentsWrapper .p-message .message {
  margin-top: 35px;
  margin-right: -6px;
}

#contentsWrapper .p-message .message > img {
  width: 27.9%;
  margin-top: -2%;
}

#contentsWrapper .p-message .message figcaption.js-scroll {
  -webkit-transition: 0.5s cubic-bezier(0.5, 0, 0.5, 1.5) 0.3s;
  transition: 0.5s cubic-bezier(0.5, 0, 0.5, 1.5) 0.3s;
  opacity: 0;
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
  -webkit-transform: scale(0);
          transform: scale(0);
}

#contentsWrapper .p-message .message figcaption.is-scroll {
  opacity: 1;
  -webkit-transform: none;
          transform: none;
}

@media screen and (max-width: 498px) {
  #contentsWrapper .p-message {
    padding-top: 15%;
    padding-bottom: 19%;
  }
  #contentsWrapper .p-message .message {
    margin-top: 7%;
    margin-right: -1.2vw;
  }
}

#contentsWrapper .p-spotTheDifference {
  padding-top: 35px;
  padding-bottom: 40px;
}

#contentsWrapper .p-spotTheDifference h2.heading {
  width: 105.76%;
  position: relative;
  left: -3.2%;
}

#contentsWrapper .p-spotTheDifference .img {
  margin-top: 25px;
  position: relative;
  left: -3%;
}

#contentsWrapper .p-spotTheDifference .img img {
  width: 75.22%;
}

@media screen and (max-width: 498px) {
  #contentsWrapper .p-spotTheDifference {
    padding-top: 7%;
    padding-bottom: 8%;
  }
  #contentsWrapper .p-spotTheDifference .img {
    margin-top: 5%;
  }
}

#contentsWrapper .p-product {
  padding-top: 30px;
  padding-bottom: 90px;
}

#contentsWrapper .p-product_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 20px;
  margin: 35px -5px 0;
}

#contentsWrapper .p-product_list > li {
  width: calc(calc(100% - 20px) / 2);
}

#contentsWrapper .p-product_list > li > * {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background: var(--maincolor);
  border: 1px solid var(--maincolor);
  border-radius: 10px;
  overflow: hidden;
}

#contentsWrapper .p-product_list > li > a {
  -webkit-transition: 0.2s;
  transition: 0.2s;
}

#contentsWrapper .p-product_list > li > a:hover {
  background: var(--subcolor);
  border-color: var(--subcolor);
  -webkit-filter: drop-shadow(0 0 4px #a8125d);
          filter: drop-shadow(0 0 4px #a8125d);
}

#contentsWrapper .p-product_list > li > a:hover .img img {
  -webkit-transform: scale(1.07);
          transform: scale(1.07);
}

#contentsWrapper .p-product_list .img {
  width: 100%;
  aspect-ratio: 1 / 1;
  background: #fff;
  overflow: hidden;
  position: relative;
}

#contentsWrapper .p-product_list .img > img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}

#contentsWrapper .p-product_list .content {
  text-align: center;
  color: #fff;
  padding: 0.6em;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

#contentsWrapper .p-product_list .content .name {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

#contentsWrapper .p-product_list.js-scroll > li {
  -webkit-transition: 0.5s cubic-bezier(0.5, 0, 0.5, 1.5) 0.3s;
  transition: 0.5s cubic-bezier(0.5, 0, 0.5, 1.5) 0.3s;
  opacity: 0;
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
}

#contentsWrapper .p-product_list.is-scroll > li {
  opacity: 1;
  -webkit-transform: scale(1);
          transform: scale(1);
}

@media screen and (max-width: 498px) {
  #contentsWrapper .p-product {
    padding-top: 6%;
    padding-bottom: 18%;
  }
  #contentsWrapper .p-product_list {
    gap: 4vw;
    margin: 7% -1vw 0;
  }
  #contentsWrapper .p-product_list > li {
    width: calc(calc(100% - 4vw) / 2);
  }
}

#contentsWrapper .p-topics {
  padding-top: 78px;
  padding-bottom: 95px;
}

#contentsWrapper .p-topics_slider {
  margin-top: 47px;
  overflow: visible;
}

#contentsWrapper .p-topics_slider .swiper-wrapper {
  -webkit-transition-timing-function: linear !important;
          transition-timing-function: linear !important;
}

#contentsWrapper .p-topics_slider .swiper-slide {
  padding: 0 7.5%;
}

#contentsWrapper .p-topics_slider .swiper-slide.--slide1 .dec.--dec1 {
  top: 5%;
  left: 4%;
  width: 21.56%;
}

#contentsWrapper .p-topics_slider .swiper-slide.--slide2 .dec.--dec1 {
  top: 5%;
  left: 2%;
  width: 25.5%;
}

#contentsWrapper .p-topics_slider .swiper-slide.--slide2 .dec.--dec2 {
  right: 3%;
  bottom: -11%;
  width: 47.013%;
}

#contentsWrapper .p-topics_slider .swiper-slide.--slide3 .dec.--dec1 {
  top: 5%;
  left: 1%;
  width: 27.4%;
}

#contentsWrapper .p-topics_slider .swiper-slide.--slide3 .dec.--dec2 {
  right: 4%;
  bottom: -11%;
  width: 35.2%;
}

#contentsWrapper .p-topics_slider .swiper-slide.--slide4 .dec.--dec1 {
  top: 5%;
  left: -3%;
  width: 30.7%;
}

#contentsWrapper .p-topics_slider .swiper-slide.--slide4 .dec.--dec2 {
  right: 3%;
  bottom: -7%;
  width: 47.013%;
}

#contentsWrapper .p-topics_slider .swiper-slide.--slide5 .dec.--dec1 {
  top: 5%;
  left: 4%;
  width: 21.2%;
}

#contentsWrapper .p-topics_slider .inner {
  background: #fff;
  -webkit-clip-path: polygon(0 27px, 77px 0, calc(100% - 77px) 0, 100% 27px, 100% calc(100% - 27px), calc(100% - 77px) 100%, 77px 100%, 0 calc(100% - 27px));
          clip-path: polygon(0 27px, 77px 0, calc(100% - 77px) 0, 100% 27px, 100% calc(100% - 27px), calc(100% - 77px) 100%, 77px 100%, 0 calc(100% - 27px));
  padding: 45px 1.5em 45px;
  position: relative;
  z-index: 1;
  isolation: isolate;
}

#contentsWrapper .p-topics_slider .num {
  font-family: "MFW-PPuhuPicnicMin2-H", "Noto Sans JP", sans-serif;
  font-size: 27px;
  line-height: 1.3;
  text-align: center;
  width: 5.58em;
  aspect-ratio: 1 / 0.2724;
  background: url(../images/topics_numDec.png) no-repeat center/contain;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 2;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}

#contentsWrapper .p-topics_slider .img {
  max-width: 210px;
  margin: 0 auto;
}

#contentsWrapper .p-topics_slider .movie {
  max-width: 228px;
  margin: 0 auto;
  display: block;
}

#contentsWrapper .p-topics_slider .title {
  font-family: "MFW-PPuhuPicnicMin2-H", "Noto Sans JP", sans-serif;
  font-size: 25px;
  letter-spacing: -0.067em;
  margin-left: 20%;
  margin-right: -1em;
  min-height: 4em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#contentsWrapper .p-topics_slider .title .marker {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(55%, transparent), color-stop(55%, var(--maincolor)));
  background: linear-gradient(transparent 55%, var(--maincolor) 55%);
}

#contentsWrapper .p-topics_slider .txt {
  margin-top: 0.5em;
  margin-right: -1em;
}

#contentsWrapper .p-topics_slider .dec {
  position: absolute;
  z-index: 2;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}

@media screen and (max-width: 498px) {
  #contentsWrapper .p-topics {
    padding-top: 15%;
    padding-bottom: 19%;
  }
  #contentsWrapper .p-topics_slider {
    margin-top: 9%;
  }
  #contentsWrapper .p-topics_slider .num {
    font-size: 5.4vw;
  }
  #contentsWrapper .p-topics_slider .title {
    font-size: 5vw;
  }
}

#contentsWrapper .p-package {
  padding-top: 35px;
  padding-bottom: 55px;
}

#contentsWrapper .p-package .c-cube {
  padding: 65px 0 80px;
}

#contentsWrapper .p-package .c-cube .face {
  background-size: cover;
  border: 0;
}

#contentsWrapper .p-package .c-cube .face.--face1 {
  background-image: url(../images/package/200712/200712_1.jpg);
}

#contentsWrapper .p-package .c-cube .face.--face2 {
  background-image: url(../images/package/200712/200712_2.jpg);
}

#contentsWrapper .p-package .c-cube .face.--face3 {
  background-image: url(../images/package/200712/200712_3.jpg);
}

#contentsWrapper .p-package .c-cube .face.--face4 {
  background-image: url(../images/package/200712/200712_4.jpg);
}

#contentsWrapper .p-package .c-cube .face.--face5 {
  background-image: url(../images/package/200712/200712_5.jpg);
}

#contentsWrapper .p-package .c-cube .face.--face6 {
  background-image: url(../images/package/200712/200712_6.jpg);
}

#contentsWrapper .p-package .c-cube .face.--face7 {
  background-image: url(../images/package/200712/200712_7.png);
}

#contentsWrapper .p-seal {
  padding-top: 58px;
  padding-bottom: 80px;
}

#contentsWrapper .p-seal .c-head {
  background: url(../images/bg001.jpg);
  border-radius: 10px 10px 0 0;
  max-width: 420px;
  margin: 20px auto 0;
}

#contentsWrapper .p-seal .c-head h3 {
  width: 88.81%;
  margin: 0 auto;
}

#contentsWrapper .p-seal .c-body {
  background: url(../images/seal_bg01.jpg) repeat-x center/auto 100%;
  padding: 15px 0 45px;
}

#contentsWrapper .p-seal_slider {
  overflow: visible;
}

#contentsWrapper .p-seal_slider .swiper-slide {
  padding: 0 1.5%;
}

#contentsWrapper .p-seal_slider .swiper-pagination {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  bottom: auto;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.67em;
}

#contentsWrapper .p-seal_slider .swiper-pagination-bullet {
  font-size: 30px;
  width: 1em;
  height: 0.97em;
  background: url(../images/slider_dot.png) no-repeat center/contain;
  opacity: 1;
  -webkit-transform: scale(0.77);
          transform: scale(0.77);
}

#contentsWrapper .p-seal_slider .swiper-pagination-bullet-active {
  -webkit-transform: scale(1);
          transform: scale(1);
}

#contentsWrapper .p-movie {
  padding-top: 33px;
}

#contentsWrapper .p-movie .movie {
  aspect-ratio: 16 / 9;
  border: 5px solid #fff;
  border-radius: 20px;
  overflow: hidden;
  position: relative;
}

#contentsWrapper .p-movie .movie > img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

#contentsWrapper .p-movie .movie .play {
  font-size: 90px;
  width: 1em;
  aspect-ratio: 1 / 1;
  background: var(--subcolor);
  -webkit-box-shadow: 0.048em 0.048em 0 #a8125d;
          box-shadow: 0.048em 0.048em 0 #a8125d;
  border-radius: 50%;
  position: relative;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  -webkit-transition: 0.15s cubic-bezier(0.1, 0.66, 0.33, 1.5);
  transition: 0.15s cubic-bezier(0.1, 0.66, 0.33, 1.5);
}

#contentsWrapper .p-movie .movie .play:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0.1em;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 0;
  height: 0;
  border: 0.24em solid transparent;
  border-left: 0.42em solid #fff;
  border-right: 0;
}

#contentsWrapper .p-movie .movie:hover .play {
  background: #c32574;
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-transform: translate(0.048em, 0.048em);
          transform: translate(0.048em, 0.048em);
}

#contentsWrapper .p-answer {
  padding-top: 50px;
  padding-bottom: 60px;
}

#contentsWrapper .p-answer h2.heading {
  width: 105.76%;
  position: relative;
  left: -3.2%;
}

#contentsWrapper .p-answer_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 69px 32.5px;
  width: 93%;
  margin: 76px auto 0;
}

#contentsWrapper .p-answer_list > li {
  width: calc(calc(100% - 32.5px) / 2);
}

#contentsWrapper .p-answer_list .img {
  position: relative;
}

#contentsWrapper .p-answer_list .img .num {
  position: absolute;
  top: -13%;
  left: -8%;
  width: 24%;
}

#contentsWrapper .p-answer_list .c-select {
  margin-top: 15px;
}

@media screen and (max-width: 498px) {
  #contentsWrapper .p-answer {
    padding-top: 10%;
    padding-bottom: 12%;
  }
  #contentsWrapper .p-answer_list {
    gap: 13.8vw 6.5vw;
    margin-top: 15.2vw;
  }
  #contentsWrapper .p-answer_list > li {
    width: calc(calc(100% - 6.5vw) / 2);
  }
}

#contentsWrapper .p-answerProduct {
  padding-top: 30px;
  padding-bottom: 65px;
}

#contentsWrapper .p-answerProduct_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 20px;
  margin: 55px -5px 0;
}

#contentsWrapper .p-answerProduct_list > li {
  width: calc(calc(100% - 20px) / 2);
}

#contentsWrapper .p-answerProduct_list > li > * {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background: var(--maincolor);
  border: 1px solid var(--maincolor);
  border-radius: 10px;
  overflow: hidden;
}

#contentsWrapper .p-answerProduct_list > li > a {
  -webkit-transition: 0.2s;
  transition: 0.2s;
}

#contentsWrapper .p-answerProduct_list > li > a:hover {
  background: var(--subcolor);
  border-color: var(--subcolor);
  -webkit-filter: drop-shadow(0 0 4px #a8125d);
          filter: drop-shadow(0 0 4px #a8125d);
}

#contentsWrapper .p-answerProduct_list > li > a:hover .img img {
  -webkit-transform: scale(1.07);
          transform: scale(1.07);
}

#contentsWrapper .p-answerProduct_list .img {
  width: 100%;
  aspect-ratio: 1 / 1;
  background: #fff;
  overflow: hidden;
  position: relative;
}

#contentsWrapper .p-answerProduct_list .img > img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}

#contentsWrapper .p-answerProduct_list .content {
  text-align: center;
  color: #fff;
  padding: 0.6em;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

#contentsWrapper .p-answerProduct_list .content .name {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

#contentsWrapper .p-answerProduct_list.js-scroll > li {
  -webkit-transition: 0.5s cubic-bezier(0.5, 0, 0.5, 1.5) 0.3s;
  transition: 0.5s cubic-bezier(0.5, 0, 0.5, 1.5) 0.3s;
  opacity: 0;
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
}

#contentsWrapper .p-answerProduct_list.is-scroll > li {
  opacity: 1;
  -webkit-transform: scale(1);
          transform: scale(1);
}

@media screen and (max-width: 498px) {
  #contentsWrapper .p-answerProduct {
    padding-top: 6%;
    padding-bottom: 13%;
  }
  #contentsWrapper .p-answerProduct_list {
    gap: 4vw;
    margin: 7% -1vw 0;
  }
  #contentsWrapper .p-answerProduct_list > li {
    width: calc(calc(100% - 4vw) / 2);
  }
}

#contentsWrapper .contentsFooter {
  padding: 35px 0 30px;
  color: #fff;
}

#contentsWrapper .contentsFooter .bnrList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 8px;
  max-width: 400px;
  margin: 0 auto;
}

#contentsWrapper .contentsFooter .bnrList > li {
  width: calc(calc(100% - 16px) / 3);
}

#contentsWrapper .contentsFooter .bnrList a {
  -webkit-transition: 0.2s;
  transition: 0.2s;
  display: block;
}

#contentsWrapper .contentsFooter .bnrList a:hover {
  -webkit-filter: contrast(0.7) brightness(1.3) drop-shadow(0 0 5px rgba(255, 255, 255, 0.7));
          filter: contrast(0.7) brightness(1.3) drop-shadow(0 0 5px rgba(255, 255, 255, 0.7));
}

#contentsWrapper .c-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  background: var(--maincolor);
  border-radius: 10px;
  opacity: 0;
  pointer-events: none;
  z-index: 102;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

#contentsWrapper .c-modalTrigger {
  cursor: pointer;
}

#contentsWrapper .c-modal.is-open {
  opacity: 1;
  pointer-events: auto;
}

#contentsWrapper .c-modal_close {
  position: absolute;
  top: -1em;
  right: -1em;
  width: 3em;
  height: 3em;
  background: var(--textcolor);
  border: 0.25em solid #fff;
  border-radius: 50%;
  cursor: pointer;
  z-index: 503;
}

#contentsWrapper .c-modal_close:before, #contentsWrapper .c-modal_close:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 66%;
  height: 0.4em;
  background: #fff;
}

#contentsWrapper .c-modal_close:before {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

#contentsWrapper .c-modal_close:after {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

#contentsWrapper .c-modal.--movie .inner {
  width: 800px;
  max-width: 92vw;
  max-height: 90dvh;
  margin: 0 auto;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  position: relative;
}

#contentsWrapper .c-modal.--movie .inner.--vertical {
  width: 360px;
  aspect-ratio: 9 / 16;
}

#contentsWrapper .c-modal.--movie .inner > iframe {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

#contentsWrapper .c-modal.--package {
  background: var(--maincolor);
  border-radius: 10px;
  width: 92%;
  max-width: 500px;
}

#contentsWrapper .c-modal.--package .inner {
  padding: 5%;
  max-height: 90dvh;
  overflow: auto;
}

#contentsWrapper .c-modal.--package .inner ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 20px 14px;
  margin-top: 30px;
}

#contentsWrapper .c-modal.--package .inner ul > li {
  width: calc(calc(100% - 28px) / 3);
}

#contentsWrapper .c-modal.--seal {
  background: var(--maincolor);
  border-radius: 10px;
  width: 92%;
  max-width: 500px;
}

#contentsWrapper .c-modal.--seal .inner {
  padding: 5%;
  max-height: 90dvh;
  overflow: auto;
}

#contentsWrapper .c-modal.--seal .inner ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 25px;
  margin-top: 40px;
}

#contentsWrapper .c-modal.--seal .inner ul > li {
  width: calc(calc(100% - 25px) / 2);
  cursor: pointer;
}

#contentsWrapper .c-modal.--seal .inner .txt {
  font-family: "MFW-PPuhuPicnicMin2-H", "Noto Sans JP", sans-serif;
  font-size: 25px;
  text-align: center;
}

#contentsWrapper .c-modal.--seal .inner .seal {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

#contentsWrapper .c-modal.--seal .inner .seal > * {
  width: calc(calc(100% - 16px) / 3);
}

@media screen and (max-width: 498px) {
  #contentsWrapper .c-modal.--seal .inner ul {
    gap: 5vw;
    margin-top: 8%;
  }
  #contentsWrapper .c-modal.--seal .inner ul > li {
    width: calc(calc(100% - 5vw) / 2);
  }
  #contentsWrapper .c-modal.--seal .inner .txt {
    font-size: 5vw;
  }
  #contentsWrapper .c-modal.--seal .inner .seal {
    gap: 1.6vw;
    margin-top: 2%;
  }
  #contentsWrapper .c-modal.--seal .inner .seal > * {
    width: calc(calc(100% - 3.2vw) / 3);
  }
}

#contentsWrapper .c-modal.--friction {
  background: var(--maincolor);
  border-radius: 10px;
  width: 92%;
  max-width: 500px;
}

#contentsWrapper .c-modal.--friction .inner {
  padding: 8% 5%;
  max-height: 90dvh;
  overflow: auto;
}

#contentsWrapper .c-modal.--friction .inner .img {
  aspect-ratio: 1 / 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#contentsWrapper .c-modal.--answer {
  background: var(--maincolor);
  border-radius: 10px;
  width: 92%;
  max-width: 500px;
}

#contentsWrapper .c-modal.--answer .inner {
  padding: 8% 5%;
  max-height: 90dvh;
  overflow: auto;
}

#contentsWrapper .c-modal.--answer .img {
  margin-left: -2.8%;
}

#is-cover {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(255, 255, 255, 0.5);
  z-index: 99;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

/* Animation */
.js-scroll.fadeInUp {
  opacity: 0;
  -webkit-transition: 0.6s ease 0.3s;
  transition: 0.6s ease 0.3s;
  -webkit-transform: translateY(30px);
          transform: translateY(30px);
}

.js-scroll.fadeInLeft {
  opacity: 0;
  -webkit-transition: 0.6s ease 0.3s;
  transition: 0.6s ease 0.3s;
  -webkit-transform: translateX(-30px);
          transform: translateX(-30px);
}

.js-scroll.fadeInRight {
  opacity: 0;
  -webkit-transition: 0.6s ease 0.3s;
  transition: 0.6s ease 0.3s;
  -webkit-transform: translateX(30px);
          transform: translateX(30px);
}

.js-scroll.fadeInZoom {
  opacity: 0;
  -webkit-transition: 0.6s ease 0.3s;
  transition: 0.6s ease 0.3s;
  -webkit-transform: scale(0.9);
          transform: scale(0.9);
}

.js-scroll.fadeInPop {
  -webkit-transition: 0.4s cubic-bezier(0.2, 0, 0.2, 1.6) 0.3s;
  transition: 0.4s cubic-bezier(0.2, 0, 0.2, 1.6) 0.3s;
  opacity: 0;
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
}

.js-scroll.fadeInMask {
  -webkit-transition: 1s ease 0.3s;
  transition: 1s ease 0.3s;
  -webkit-mask-image: linear-gradient(-45deg, transparent 45%, #000 55%);
          mask-image: linear-gradient(-45deg, transparent 45%, #000 55%);
  -webkit-mask-size: 300% 300%;
          mask-size: 300% 300%;
  -webkit-mask-position: 100% 100%;
          mask-position: 100% 100%;
}

.js-scroll.is-scroll.fadeInUp, .js-scroll.is-scroll.fadeInLeft, .js-scroll.is-scroll.fadeInRight, .js-scroll.is-scroll.fadeInZoom, .js-scroll.is-scroll.fadeInPop {
  opacity: 1;
  -webkit-transform: none;
          transform: none;
}

.js-scroll.is-scroll.fadeInMask {
  -webkit-mask-position: 0 0;
          mask-position: 0 0;
}

@-webkit-keyframes fall {
  from {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  to {
    -webkit-transform: translateY(100vh);
            transform: translateY(100vh);
  }
}

@keyframes fall {
  from {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  to {
    -webkit-transform: translateY(100vh);
            transform: translateY(100vh);
  }
}

@-webkit-keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@-webkit-keyframes star {
  0%, 100% {
    -webkit-transform: scale(1) rotate(0);
            transform: scale(1) rotate(0);
  }
  25% {
    -webkit-transform: scale(0.75) rotate(45deg);
            transform: scale(0.75) rotate(45deg);
  }
  50% {
    -webkit-transform: scale(0.9) rotate(0);
            transform: scale(0.9) rotate(0);
  }
  75% {
    -webkit-transform: scale(0.6) rotate(45deg);
            transform: scale(0.6) rotate(45deg);
  }
}

@keyframes star {
  0%, 100% {
    -webkit-transform: scale(1) rotate(0);
            transform: scale(1) rotate(0);
  }
  25% {
    -webkit-transform: scale(0.75) rotate(45deg);
            transform: scale(0.75) rotate(45deg);
  }
  50% {
    -webkit-transform: scale(0.9) rotate(0);
            transform: scale(0.9) rotate(0);
  }
  75% {
    -webkit-transform: scale(0.6) rotate(45deg);
            transform: scale(0.6) rotate(45deg);
  }
}

@-webkit-keyframes confetti {
  0% {
    -webkit-transform: rotate3d(1, 0, 0, 0deg);
            transform: rotate3d(1, 0, 0, 0deg);
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0.5, 360deg);
            transform: rotate3d(1, 1, 0.5, 360deg);
  }
}

@keyframes confetti {
  0% {
    -webkit-transform: rotate3d(1, 0, 0, 0deg);
            transform: rotate3d(1, 0, 0, 0deg);
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0.5, 360deg);
            transform: rotate3d(1, 1, 0.5, 360deg);
  }
}

@-webkit-keyframes fuwa {
  from {
    -webkit-transform: translateY(-5%);
            transform: translateY(-5%);
  }
  to {
    -webkit-transform: translateY(5%);
            transform: translateY(5%);
  }
}

@keyframes fuwa {
  from {
    -webkit-transform: translateY(-5%);
            transform: translateY(-5%);
  }
  to {
    -webkit-transform: translateY(5%);
            transform: translateY(5%);
  }
}

/* ======== ↑ End main ↑ ======== */