@charset "UTF-8";
/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Prevent font size inflation */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Remove default margin in favour of better control in authored CSS */
body, h1, h2, h3, h4, p,
figure, blockquote, dl, dd {
  margin-block-end: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role=list],
ol[role=list] {
  list-style: none;
}

/* Set core body defaults */
body {
  min-height: 100vh;
  line-height: 1.5;
}

/* Set shorter line heights on headings and interactive elements */
h1, h2, h3, h4,
button, input, label {
  line-height: 1.1;
}

/* Balance text wrapping on headings */
h1, h2,
h3, h4 {
  text-wrap: balance;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  text-decoration-skip-ink: auto;
  color: currentColor;
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block;
}

/* Inherit fonts for inputs and buttons */
input, button,
textarea, select {
  font-family: inherit;
  font-size: inherit;
}

/* Make sure textareas without a rows attribute are not tiny */
textarea:not([rows]) {
  min-height: 10em;
}

/* Anything that has been anchored to should have extra scroll margin */
:target {
  scroll-margin-block: 5ex;
}

/* ===============
base settings
================== */
:root {
  --sp-breakpoint: 767px;
}

@media screen and (max-width: 767px) {
  .onlyPC {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  .onlySP {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic", sans-serif;
  color: #333;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-break: strict;
  background-color: #ff0014;
}
body.is-scrollLocked {
  position: fixed;
  left: 0;
  width: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}
body {
  position: relative;
}

.content_section {
  overflow: hidden;
}

img,
picture {
  height: auto;
}

img {
  -webkit-user-drag: none;
  user-drag: none;
}

.bg {
  background: center center no-repeat;
  background-size: 100% auto;
  display: block;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
}

.textHide {
  display: block;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
}

.visuallyHidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* ===============
hero flowers
================== */
@keyframes heroBookGlow {
  0%, 100% {
    filter: brightness(1) contrast(1) saturate(1);
    scale: 1;
  }
  50% {
    filter: brightness(1.45) contrast(1.04) saturate(1.15);
    scale: 1.1;
  }
}
@keyframes heroBookDocs {
  0%, 35%, 100% {
    filter: brightness(1);
    scale: 1;
  }
  50% {
    filter: brightness(1.2);
    scale: 1.05;
  }
}
@keyframes heroBookJitter {
  0%, 100% {
    translate: 2.25px -1.5px;
    rotate: 1.32deg;
  }
  7% {
    translate: -3px 0.75px;
    rotate: -1.87deg;
  }
  13% {
    translate: 1.5px 3px;
    rotate: 0.66deg;
  }
  17% {
    translate: -0.75px -2.25px;
    rotate: 2.31deg;
  }
  26% {
    translate: 3.75px 1.5px;
    rotate: -0.99deg;
  }
  31% {
    translate: -2.25px -3px;
    rotate: 1.98deg;
  }
  34% {
    translate: 0.75px 2.25px;
    rotate: -2.42deg;
  }
  43% {
    translate: -3.75px -0.75px;
    rotate: 1.1deg;
  }
  48% {
    translate: 3px -3px;
    rotate: -1.54deg;
  }
  55% {
    translate: -1.5px 1.5px;
    rotate: 2.53deg;
  }
  59% {
    translate: 2.25px 3px;
    rotate: -0.55deg;
  }
  68% {
    translate: -3px -1.5px;
    rotate: 1.76deg;
  }
  73% {
    translate: 1.5px -3.75px;
    rotate: -2.09deg;
  }
  81% {
    translate: -2.25px 2.25px;
    rotate: 0.88deg;
  }
  86% {
    translate: 3.75px -0.75px;
    rotate: -2.2deg;
  }
  94% {
    translate: -0.75px 3px;
    rotate: 1.43deg;
  }
}
@keyframes heroBookFloat {
  0%, 100% {
    transform: translate3d(0, 0, 0) rotate(0deg);
  }
  50% {
    transform: translate3d(0, -3px, 0) rotate(0.3deg);
  }
}
@keyframes heroFlowerDrift {
  0% {
    transform: translate3d(0, 0, 0) rotate(0deg);
  }
  23% {
    transform: translate3d(calc(var(--driftAmp) * 0.67), calc(var(--driftAmp) * -1), 0) rotate(var(--driftRot));
  }
  47% {
    transform: translate3d(calc(var(--driftAmp) * -0.67), calc(var(--driftAmp) * 0.67), 0) rotate(calc(var(--driftRot) * -0.71));
  }
  71% {
    transform: translate3d(calc(var(--driftAmp) * -1), calc(var(--driftAmp) * -0.33), 0) rotate(calc(var(--driftRot) * 0.57));
  }
  100% {
    transform: translate3d(0, 0, 0) rotate(0deg);
  }
}
@keyframes heroButterflyFlutter {
  0%, 72% {
    transform: rotate(var(--wingAxis, 0deg)) scaleX(1) rotate(calc(-1 * var(--wingAxis, 0deg)));
  }
  78.9% {
    transform: rotate(var(--wingAxis, 0deg)) scaleX(0.82) rotate(calc(-1 * var(--wingAxis, 0deg)));
  }
  85.9% {
    transform: rotate(var(--wingAxis, 0deg)) scaleX(1) rotate(calc(-1 * var(--wingAxis, 0deg)));
  }
  92.9% {
    transform: rotate(var(--wingAxis, 0deg)) scaleX(0.86) rotate(calc(-1 * var(--wingAxis, 0deg)));
  }
  100% {
    transform: rotate(var(--wingAxis, 0deg)) scaleX(1) rotate(calc(-1 * var(--wingAxis, 0deg)));
  }
}
@keyframes heroButterflyPerch {
  0%, 72% {
    transform: rotate(0deg) rotate(var(--wingAxis, 0deg)) scaleY(1) rotate(calc(-1 * var(--wingAxis, 0deg)));
  }
  78.9% {
    transform: rotate(-1.2deg) rotate(var(--wingAxis, 0deg)) scaleY(1.04) rotate(calc(-1 * var(--wingAxis, 0deg)));
  }
  85.9% {
    transform: rotate(0deg) rotate(var(--wingAxis, 0deg)) scaleY(1) rotate(calc(-1 * var(--wingAxis, 0deg)));
  }
  92.9% {
    transform: rotate(-0.8deg) rotate(var(--wingAxis, 0deg)) scaleY(1.03) rotate(calc(-1 * var(--wingAxis, 0deg)));
  }
  100% {
    transform: rotate(0deg) rotate(var(--wingAxis, 0deg)) scaleY(1) rotate(calc(-1 * var(--wingAxis, 0deg)));
  }
}
@keyframes heroPillTurn {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero-flower,
  .hero-flower::before,
  .hero-bookPart {
    animation: none !important;
    translate: none !important;
    scale: none !important;
    filter: none !important;
  }
}
/* ===============
hero
================== */
.content_section-hero {
  position: relative;
}
.content_section-hero .hero-visual {
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-visual {
    aspect-ratio: 750/1460;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-visual {
    aspect-ratio: 1200/1435;
  }
}
.content_section-hero .hero-visual picture,
.content_section-hero .hero-layer picture {
  display: block;
}
.content_section-hero .hero-visualImage {
  display: block;
  width: 100%;
}
.content_section-hero .hero-layer {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  margin: 0;
  pointer-events: none;
  user-select: none;
}
.content_section-hero .hero-layer img {
  display: block;
  width: 100%;
}
.content_section-hero .hero-layer-back {
  top: 0;
}
.content_section-hero .hero-layer-book {
  top: 0;
}
.content_section-hero .hero-bookPart {
  position: absolute;
  display: block;
  padding: 0;
  border: 0;
  appearance: none;
  cursor: pointer;
  pointer-events: all;
  background-color: transparent;
  background-repeat: no-repeat;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-bookPart {
    background-image: url("/img/hero-book-parts-n.png");
    background-image: image-set(url("/img/hero-book-parts-n.webp") type("image/webp"), url("/img/hero-book-parts-n.png") type("image/png"));
    background-size: 28.8vw 171.0666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-bookPart {
    background-image: url("/img/hero-book-parts-w.png");
    background-image: image-set(url("/img/hero-book-parts-w.webp") type("image/webp") 1x, url("/img/hero-book-parts-w-2x.webp") type("image/webp") 2x, url("/img/hero-book-parts-w.png") type("image/png") 1x, url("/img/hero-book-parts-w-2x.png") type("image/png") 2x);
    background-size: 42.6666666667vw 68vw;
  }
}
.content_section-hero .hero-bookPart {
  --glowDur: 2.6s;
  --jitterDur: 1.7s;
  animation: heroBookFloat var(--floatDur) ease-in-out infinite both, heroBookGlow var(--glowDur) ease-in-out infinite both, heroBookJitter var(--jitterDur) steps(1, end) infinite both;
  animation-delay: var(--floatDelay), var(--glowDelay), var(--floatDelay);
  transition: scale 0.25s;
}
@media (hover: hover) and (pointer: fine) {
  .content_section-hero .hero-bookPart:hover {
    scale: 1.04;
    animation-play-state: running, paused, paused;
    filter: brightness(1.4);
  }
}
.content_section-hero .hero-bookPart-docLeft,
.content_section-hero .hero-bookPart-docRight {
  animation: heroBookFloat var(--floatDur) ease-in-out infinite both, heroBookDocs var(--glowDur) ease-in-out infinite both;
  animation-delay: var(--floatDelay), var(--glowDelay);
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-bookPart-silentMajority {
    clip-path: polygon(0.99% 80.66%, 29.06% 0.82%, 98.52% 18.52%, 69.95% 98.77%, 1.97% 82.72%);
    left: 28.5333333333vw;
    top: -1.7333333333vw;
    width: 27.0666666667vw;
    height: 32.4vw;
    background-position: 0 0;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-bookPart-silentMajority {
    clip-path: polygon(0.49% 14.06%, 75.86% 0.4%, 99.01% 85.14%, 24.14% 98.8%);
    left: 25.75vw;
    top: 38.1666666667vw;
    width: 16.9166666667vw;
    height: 20.75vw;
    background-position: -18.4166666667vw -26.1666666667vw;
  }
}
.content_section-hero .hero-bookPart-silentMajority {
  --floatDur: 6.7s;
  --floatDelay: 0s;
  --glowDelay: 0s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-bookPart-docLeft {
    clip-path: polygon(0% 17.85%, 0.93% 13.8%, 4.17% 11.78%, 36.11% 0.67%, 50.93% 2.36%, 62.96% 11.45%, 95.83% 64.31%, 98.61% 73.74%, 97.69% 80.81%, 31.48% 98.99%, 23.15% 89.56%, 0% 56.57%);
    left: -0.1333333333vw;
    top: 36vw;
    width: 28.8vw;
    height: 39.6vw;
    background-position: 0 -32.4vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-bookPart-docLeft {
    clip-path: polygon(0% 22.93%, 17.36% 11.78%, 45.28% 0.32%, 58.11% 2.55%, 68.3% 11.15%, 96.6% 64.33%, 99.25% 74.2%, 98.49% 80.57%, 40.75% 99.36%, 0% 40.45%);
    left: 0.0416666667vw;
    top: 8.875vw;
    width: 22.0833333333vw;
    height: 26.1666666667vw;
    background-position: 0 0;
  }
}
.content_section-hero .hero-bookPart-docLeft {
  --floatDur: 8.3s;
  --floatDelay: -2.9s;
  --glowDelay: -0.12s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-bookPart-docRight {
    clip-path: polygon(0.49% 80.72%, 32.2% 0.8%, 98.05% 18.07%, 65.85% 99.2%);
    left: 71.7333333333vw;
    top: 73.8666666667vw;
    width: 27.3333333333vw;
    height: 33.2vw;
    background-position: 0 -72vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-bookPart-docRight {
    clip-path: polygon(0.41% 71.79%, 45.08% 0.37%, 98.77% 27.11%, 54.51% 98.9%);
    left: 68.4583333333vw;
    top: 35.7916666667vw;
    width: 20.3333333333vw;
    height: 22.75vw;
    background-position: -22.0833333333vw 0;
  }
}
.content_section-hero .hero-bookPart-docRight {
  --floatDur: 9.1s;
  --floatDelay: -5.3s;
  --glowDelay: -0.24s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-bookPart-enclosure {
    clip-path: polygon(0.98% 18.47%, 71.71% 0.8%, 98.54% 73.09%, 99.02% 82.33%, 31.22% 98.8%);
    left: 72.6666666667vw;
    top: 46.8vw;
    width: 27.3333333333vw;
    height: 33.2vw;
    background-position: 0 -105.2vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-bookPart-enclosure {
    clip-path: polygon(0.45% 17.94%, 70.14% 0.38%, 99.1% 81.68%, 30.32% 99.24%);
    left: 71.6666666667vw;
    top: 18.2083333333vw;
    width: 18.4166666667vw;
    height: 21.8333333333vw;
    background-position: 0 -26.1666666667vw;
  }
}
.content_section-hero .hero-bookPart-enclosure {
  --floatDur: 7.3s;
  --floatDelay: -1.7s;
  --glowDelay: -0.36s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-bookPart-nostalgia {
    clip-path: polygon(0.99% 81.22%, 27.59% 0.82%, 98.52% 17.14%, 70.94% 99.18%, 2.46% 84.08%);
    left: 9.6vw;
    top: 71.0666666667vw;
    width: 27.0666666667vw;
    height: 32.6666666667vw;
    background-position: 0 -138.4vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-bookPart-nostalgia {
    clip-path: polygon(0.55% 88.33%, 11.54% 0.83%, 98.9% 7.5%, 86.81% 98.75%, 2.2% 93.33%);
    left: 8.7083333333vw;
    top: 29.2083333333vw;
    width: 15.1666666667vw;
    height: 20vw;
    background-position: 0 -48vw;
  }
}
.content_section-hero .hero-bookPart-nostalgia {
  --floatDur: 10.1s;
  --floatDelay: -4.1s;
  --glowDelay: -0.48s;
}
.content_section-hero .hero-flower {
  position: absolute;
  display: block;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower {
    --driftAmp: 1.0666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower {
    --driftAmp: 0.4583333333vw;
  }
}
.content_section-hero .hero-flower {
  --driftRot: 1.2deg;
  --driftSpeed: 0.85;
  animation-name: heroFlowerDrift;
  animation-duration: calc(var(--driftDur) * var(--driftSpeed));
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-fill-mode: both;
  animation-delay: var(--driftDelay);
}
.content_section-hero .hero-flower::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: var(--sx) var(--sy);
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower::before {
    background-image: url("/img/flowers-n.png");
    background-image: image-set(url("/img/flowers-n.webp") type("image/webp"), url("/img/flowers-n.png") type("image/png"));
    background-size: 68.2666666667vw 61.8666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower::before {
    background-image: url("/img/flowers-w.png");
    background-image: image-set(url("/img/flowers-w.webp") type("image/webp") 1x, url("/img/flowers-w-2x.webp") type("image/webp") 2x, url("/img/flowers-w.png") type("image/png") 1x, url("/img/flowers-w-2x.png") type("image/png") 2x);
    background-size: 42.6666666667vw 37.8333333333vw;
  }
}
.content_section-hero .hero-flower.is-butterfly,
.content_section-hero .hero-flower.is-butterflyPerch {
  --driftAmp: 3px;
  --driftRot: 0.7deg;
  --driftSpeed: 1;
}
.content_section-hero .hero-flower.is-butterfly::before {
  animation: heroButterflyFlutter var(--flutterDur) ease-in-out infinite both;
  animation-delay: var(--flutterDelay);
}
.content_section-hero .hero-flower.is-butterflyPerch::before {
  transform-origin: 22% 78%;
  animation: heroButterflyPerch var(--flutterDur) ease-in-out infinite both;
  animation-delay: var(--flutterDelay);
}
.content_section-hero .hero-flower.is-pill::before {
  animation: heroPillTurn var(--turnDur) ease-in-out infinite both;
  animation-delay: var(--turnDelay);
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-01 {
    left: 18.2666666667vw;
    top: 61.3333333333vw;
    width: 10.8vw;
    height: 10.1333333333vw;
    --sx: -10.8vw;
    --sy: -51.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-01 {
    left: 19.5416666667vw;
    top: 27.625vw;
    width: 7vw;
    height: 6.6666666667vw;
    --sx: -15.75vw;
    --sy: -29.9166666667vw;
  }
}
.content_section-hero .hero-flower-01 {
  --driftDur: 7.3s;
  --driftDelay: 0s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-02 {
    left: -3.7333333333vw;
    top: 55.7333333333vw;
    width: 14.6666666667vw;
    height: 13.8666666667vw;
    --sx: -17.3333333333vw;
    --sy: -24.5333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-02 {
    left: 2.6666666667vw;
    top: 39vw;
    width: 9.5833333333vw;
    height: 9.0833333333vw;
    --sx: -11.3333333333vw;
    --sy: -12vw;
  }
}
.content_section-hero .hero-flower-02 {
  --wingAxis: -9.5deg;
  --driftDur: 9.1s;
  --driftDelay: -1.7s;
  --flutterDur: 15.7s;
  --flutterDelay: -2.1s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-03 {
    left: 5.0666666667vw;
    top: 70.9333333333vw;
    width: 14vw;
    height: 13.4666666667vw;
    --sx: -48.6666666667vw;
    --sy: -24.5333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-03 {
    left: 19.3333333333vw;
    top: 42.1666666667vw;
    width: 9.25vw;
    height: 8.9166666667vw;
    --sx: -20.9166666667vw;
    --sy: -12vw;
  }
}
.content_section-hero .hero-flower-03 {
  --driftDur: 11.7s;
  --driftDelay: -3.1s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-04 {
    left: 20.4vw;
    top: 94.8vw;
    width: 17.3333333333vw;
    height: 14vw;
    --sx: 0;
    --sy: -24.5333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-04 {
    left: 10.7083333333vw;
    top: 52.625vw;
    width: 11.3333333333vw;
    height: 9.1666666667vw;
    --sx: 0;
    --sy: -12vw;
  }
}
.content_section-hero .hero-flower-04 {
  --wingAxis: 13.5deg;
  --driftDur: 8.3s;
  --driftDelay: -0.9s;
  --flutterDur: 17.3s;
  --flutterDelay: -7.6s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-05 {
    left: 15.8666666667vw;
    top: 40vw;
    width: 16.6666666667vw;
    height: 13.6vw;
    --sx: -32vw;
    --sy: -24.5333333333vw;
    --wingAxis: 14deg;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-05 {
    left: 14vw;
    top: 20.8333333333vw;
    width: 11.0833333333vw;
    height: 8.75vw;
    --sx: 0;
    --sy: -21.1666666667vw;
    --wingAxis: 11.5deg;
  }
}
.content_section-hero .hero-flower-05 {
  --driftDur: 12.9s;
  --driftDelay: -4.3s;
  --flutterDur: 19.1s;
  --flutterDelay: -12.4s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-06 {
    left: 4.5333333333vw;
    top: 30.5333333333vw;
    width: 14.4vw;
    height: 14.2666666667vw;
    --sx: -39.7333333333vw;
    --sy: 0;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-06 {
    left: 10.125vw;
    top: 7.6666666667vw;
    width: 8.4166666667vw;
    height: 8.5vw;
    --sx: -20.1666666667vw;
    --sy: -21.1666666667vw;
  }
}
.content_section-hero .hero-flower-06 {
  --driftDur: 10.1s;
  --driftDelay: -2.3s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-07 {
    left: 1.7333333333vw;
    top: 40.2666666667vw;
    width: 9.2vw;
    height: 8.1333333333vw;
    --sx: -29.8666666667vw;
    --sy: -51.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-07 {
    left: 8.5416666667vw;
    top: 12vw;
    width: 6.0833333333vw;
    height: 5.4166666667vw;
    --sx: -28.9166666667vw;
    --sy: -29.9166666667vw;
  }
}
.content_section-hero .hero-flower-07 {
  --driftDur: 13.3s;
  --driftDelay: -5.1s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-08 {
    left: 31.4666666667vw;
    top: 10.9333333333vw;
    width: 3.0666666667vw;
    height: 3.0666666667vw;
    --sx: -49.7333333333vw;
    --sy: -51.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-08 {
    left: 23.75vw;
    top: 53.5vw;
    width: 10.5vw;
    height: 10.4166666667vw;
    --sx: -21.3333333333vw;
    --sy: 0;
  }
}
.content_section-hero .hero-flower-08 {
  --driftDur: 8.9s;
  --driftDelay: -1.3s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-09 {
    left: 27.0666666667vw;
    top: -6vw;
    width: 12.6666666667vw;
    height: 12.8vw;
    --sx: 0;
    --sy: -38.5333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-09 {
    left: 37.625vw;
    top: 42.5416666667vw;
    width: 8.25vw;
    height: 7.9166666667vw;
    --sx: 0;
    --sy: -29.9166666667vw;
  }
}
.content_section-hero .hero-flower-09 {
  --driftDur: 11.3s;
  --driftDelay: -3.7s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-10 {
    left: 45.3333333333vw;
    top: 26.2666666667vw;
    width: 3.2vw;
    height: 4.9333333333vw;
    --sx: -46.5333333333vw;
    --sy: -51.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-10 {
    display: none;
  }
}
.content_section-hero .hero-flower-10 {
  --driftDur: 9.7s;
  --driftDelay: -2.9s;
  --turnDur: 31s;
  --turnDelay: -4s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-11 {
    left: 46.4vw;
    top: 16.4vw;
    width: 16.5333333333vw;
    height: 18.2666666667vw;
    --sx: -23.2vw;
    --sy: 0;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-11 {
    left: 37.1666666667vw;
    top: 6.25vw;
    width: 10.9166666667vw;
    height: 12vw;
    --sx: 0;
    --sy: 0;
  }
}
.content_section-hero .hero-flower-11 {
  --wingAxis: -12.5deg;
  --driftDur: 14.1s;
  --driftDelay: -6.1s;
  --flutterDur: 16.1s;
  --flutterDelay: -4.9s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-12 {
    left: 50.2666666667vw;
    top: 4.8vw;
    width: 10.6666666667vw;
    height: 10.5333333333vw;
    --sx: -51.8666666667vw;
    --sy: -38.5333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-12 {
    display: none;
  }
}
.content_section-hero .hero-flower-12 {
  --driftDur: 10.7s;
  --driftDelay: -4.7s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-13 {
    left: 74.5333333333vw;
    top: 29.0666666667vw;
    width: 23.2vw;
    height: 24.5333333333vw;
    --sx: 0;
    --sy: 0;
    --wingAxis: 13.5deg;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-13 {
    left: 81.25vw;
    top: 14.7916666667vw;
    width: 10.4166666667vw;
    height: 11vw;
    --sx: -10.9166666667vw;
    --sy: 0;
    --wingAxis: 13deg;
  }
}
.content_section-hero .hero-flower-13 {
  --driftDur: 12.1s;
  --driftDelay: -0.3s;
  --flutterDur: 20.3s;
  --flutterDelay: -16.2s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-14 {
    left: 92.6666666667vw;
    top: 59.2vw;
    width: 7.4666666667vw;
    height: 6.2666666667vw;
    --sx: -39.0666666667vw;
    --sy: -51.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-14 {
    left: 85.0416666667vw;
    top: 26vw;
    width: 4.8333333333vw;
    height: 4vw;
    --sx: -35vw;
    --sy: -29.9166666667vw;
  }
}
.content_section-hero .hero-flower-14 {
  --driftDur: 8.1s;
  --driftDelay: -5.9s;
  --turnDur: 37s;
  --turnDelay: -13s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-15 {
    left: 91.8666666667vw;
    top: 67.4666666667vw;
    width: 10.8vw;
    height: 10.5333333333vw;
    --sx: 0;
    --sy: -51.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-15 {
    left: 84.2916666667vw;
    top: 31.25vw;
    width: 9.0833333333vw;
    height: 8.75vw;
    --sx: -11.0833333333vw;
    --sy: -21.1666666667vw;
  }
}
.content_section-hero .hero-flower-15 {
  --driftDur: 13.9s;
  --driftDelay: -2.1s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-16 {
    left: 86.9333333333vw;
    top: 83.4666666667vw;
    width: 16vw;
    height: 12.2666666667vw;
    --sx: -12.6666666667vw;
    --sy: -38.5333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-16 {
    left: 85.0833333333vw;
    top: 42.2916666667vw;
    width: 10.5vw;
    height: 8vw;
    --sx: -28.5833333333vw;
    --sy: -21.1666666667vw;
  }
}
.content_section-hero .hero-flower-16 {
  --wingAxis: -11.5deg;
  --driftDur: 9.3s;
  --driftDelay: -3.3s;
  --flutterDur: 18.7s;
  --flutterDelay: -9.8s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-17 {
    left: 74.4vw;
    top: 77.6vw;
    width: 8.2666666667vw;
    height: 8.2666666667vw;
    --sx: -21.6vw;
    --sy: -51.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-17 {
    left: 0.875vw;
    top: 19.7916666667vw;
    width: 7.5vw;
    height: 7.5vw;
    --sx: -8.25vw;
    --sy: -29.9166666667vw;
  }
}
.content_section-hero .hero-flower-17 {
  --driftDur: 11.9s;
  --driftDelay: -1.1s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-18 {
    left: 58.1333333333vw;
    top: 86.9333333333vw;
    width: 12.1333333333vw;
    height: 11.4666666667vw;
    --sx: -28.6666666667vw;
    --sy: -38.5333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-18 {
    left: 66.375vw;
    top: 38.5416666667vw;
    width: 9.4166666667vw;
    height: 8.9166666667vw;
    --sx: -30.1666666667vw;
    --sy: -12vw;
  }
}
.content_section-hero .hero-flower-18 {
  --driftDur: 10.3s;
  --driftDelay: -4.1s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-flower-19 {
    left: 85.2vw;
    top: 98.4vw;
    width: 11.0666666667vw;
    height: 11.3333333333vw;
    --sx: -40.8vw;
    --sy: -38.5333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-flower-19 {
    left: 76.5vw;
    top: 53.1666666667vw;
    width: 6.1666666667vw;
    height: 6.25vw;
    --sx: -22.75vw;
    --sy: -29.9166666667vw;
  }
}
.content_section-hero .hero-flower-19 {
  --driftDur: 12.7s;
  --driftDelay: -6.7s;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-layer-arrows {
    left: 2.8vw;
    top: 0;
    width: 93.8666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-layer-arrows {
    left: 29.8333333333vw;
    top: 7.5vw;
    width: 50.75vw;
  }
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-layer-lead {
    left: 11.6vw;
    top: 0;
    width: 76.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-layer-lead {
    left: 16.9166666667vw;
    top: 0;
    width: 65.75vw;
  }
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-layer-logo {
    left: 4vw;
    top: 118.8vw;
    width: 92.8vw;
    height: 42.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-layer-logo {
    left: 27.1666666667vw;
    top: 63.5833333333vw;
    width: 45.75vw;
    height: 22.25vw;
  }
}
.content_section-hero .hero-logoShadow {
  position: absolute;
  max-width: none;
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-logoShadow {
    left: -4vw;
    top: -6.5333333333vw;
    width: 100vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-logoShadow {
    left: -5vw;
    top: -4.1666666667vw;
    width: 55.75vw;
  }
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-layer-leadEn {
    left: 8.8vw;
    top: 170.5333333333vw;
    width: 82.9333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-layer-leadEn {
    left: 24.25vw;
    top: 88.5833333333vw;
    width: 52.8333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .content_section-hero .hero-layer-leadEn img {
    aspect-ratio: 622/17;
  }
}
@media screen and (min-width: 768px) {
  .content_section-hero .hero-layer-leadEn img {
    aspect-ratio: 634/13;
  }
}

/* ===============
hero
================== */
.js-heroIntro .content_section-hero .hero-layer-back,
.js-heroIntro .content_section-hero .hero-layer-book,
.js-heroIntro .content_section-hero .hero-layer-arrows,
.js-heroIntro .content_section-hero .hero-layer-leadEn {
  opacity: 0;
  transition: opacity 1500ms cubic-bezier(0.4, 0, 0.2, 1);
}
.js-heroIntro .content_section-hero .hero-layer-lead,
.js-heroIntro .content_section-hero .hero-layer-logo,
.js-heroIntro .content_section-hero .floating-menu {
  opacity: 0;
  transition: opacity 3000ms cubic-bezier(0.4, 0, 0.2, 1);
}
.js-heroIntro .content_section-hero .hero-layer-flowers {
  opacity: 0;
  transition: opacity 1000ms cubic-bezier(0.4, 0, 0.2, 1);
}
.js-heroIntro .content_section-hero .hero-bookPart {
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  .js-heroIntro .content_section-hero .hero-layer-logo {
    translate: 0 -53.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .js-heroIntro .content_section-hero .hero-layer-logo {
    translate: 0 -30vw;
  }
}
.js-heroIntro .content_section-hero .hero-layer-logo {
  transition: opacity 3000ms cubic-bezier(0.4, 0, 0.2, 1), translate 1500ms cubic-bezier(0.83, 0, 0.17, 1);
}
.js-heroIntro .content_section-hero .hero-layer-leadEn {
  transition: opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 1000ms;
}
.js-heroIntro .content_section-hero.is-noLogoSlide .hero-layer-logo {
  translate: 0 0;
  transition: opacity 3000ms cubic-bezier(0.4, 0, 0.2, 1);
}
.js-heroIntro .content_section-hero.is-noLogoSlide .hero-layer-leadEn {
  transition: opacity 3000ms cubic-bezier(0.4, 0, 0.2, 1) 0s;
}
.js-heroIntro .content_section-hero.is-logoSlid .hero-layer-logo {
  translate: 0 0;
}
.js-heroIntro .content_section-hero.is-intro1 .hero-layer-back {
  opacity: 1;
}
.js-heroIntro .content_section-hero.is-intro2 .hero-layer-book {
  opacity: 1;
}
.js-heroIntro .content_section-hero.is-intro2 .hero-bookPart {
  pointer-events: all;
}
.js-heroIntro .content_section-hero.is-intro3 .hero-layer-flowers,
.js-heroIntro .content_section-hero.is-intro3 .hero-layer-arrows {
  opacity: 1;
}
.js-heroIntro .content_section-hero.is-intro4 .hero-layer-lead,
.js-heroIntro .content_section-hero.is-intro4 .floating-menu {
  opacity: 1;
}
.js-heroIntro .content_section-hero.is-intro4 .hero-layer-logo {
  opacity: 1;
}
.js-heroIntro .content_section-hero.is-intro4.is-noLogoSlide .hero-layer-leadEn, .js-heroIntro .content_section-hero.is-intro4.is-logoSlid .hero-layer-leadEn {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .js-heroIntro .content_section-hero .hero-layer-back,
  .js-heroIntro .content_section-hero .hero-layer-book,
  .js-heroIntro .content_section-hero .hero-layer-flowers,
  .js-heroIntro .content_section-hero .hero-layer-arrows,
  .js-heroIntro .content_section-hero .hero-layer-lead,
  .js-heroIntro .content_section-hero .hero-layer-logo,
  .js-heroIntro .content_section-hero .hero-layer-leadEn,
  .js-heroIntro .content_section-hero .floating-menu {
    opacity: 1;
    transition: none;
  }
  .js-heroIntro .content_section-hero .hero-layer-logo {
    translate: none;
  }
  .js-heroIntro .content_section-hero .hero-bookPart {
    pointer-events: all;
  }
}
/* ===============
lazy background
================== */
.js-lazyBg [data-lazy-bg]:not(.is-bgReady) .closing-flower {
  background-image: none;
}

/* ===============
スクロールに合わせフェードイン
================== */
.js-reveal [data-reveal] {
  opacity: 0;
  filter: blur(5px);
  transition: opacity 1800ms cubic-bezier(0.4, 0, 0.2, 1), filter 1800ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-delay: var(--revealDelay, 0s);
}

.js-reveal [data-reveal].is-revealed {
  opacity: 1;
  filter: blur(0);
}

@media (prefers-reduced-motion: reduce) {
  .js-reveal [data-reveal] {
    opacity: 1;
    filter: none;
    transition: none;
  }
}
/* ===============
about
================== */
.content_section-about {
  background-color: #ff0014;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .content_section-about {
    padding: 12.1333333333vw 0 21.8666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-about {
    position: relative;
    overflow: visible;
    padding-bottom: 17.5833333333vw;
  }
}
@media screen and (max-width: 767px) {
  .content_section-about .about-title {
    width: 102.6666666667vw;
    margin: 0 0 0 -0.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-about .about-title {
    position: absolute;
    z-index: 1;
    left: 9.6666666667vw;
    top: -4vw;
    width: 80.3333333333vw;
    margin: 0;
  }
}
.content_section-about .about-titleImage {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .content_section-about .about-titleImage {
    aspect-ratio: 770/214;
  }
}
@media screen and (min-width: 768px) {
  .content_section-about .about-titleImage {
    aspect-ratio: 964/268;
  }
}
.content_section-about .about-body {
  position: relative;
}
@media screen and (max-width: 767px) {
  .content_section-about .about-body {
    margin-top: 6.8vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-about .about-body {
    margin-top: 0.9166666667vw;
  }
}
.content_section-about .about-concept {
  position: relative;
}
@media screen and (min-width: 768px) {
  .content_section-about .about-concept {
    margin-top: -0.8333333333vw;
  }
}
.content_section-about .about-bodyText {
  position: absolute;
}
@media screen and (max-width: 767px) {
  .content_section-about .about-bodyText {
    left: 12.4vw;
    top: 11.4666666667vw;
    width: 74.9333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-about .about-bodyText {
    left: 26.5vw;
    top: 33.1666666667vw;
    width: 46.8333333333vw;
  }
}
.content_section-about .about-bodyPara {
  position: relative;
}
.content_section-about .about-bodyPara::after {
  content: "";
  position: relative;
  z-index: 1;
  display: block;
  height: 100%;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
@media screen and (max-width: 767px) {
  .content_section-about .about-bodyPara::after {
    background-image: url("/img/about-text-upper-n.svg");
  }
}
@media screen and (min-width: 768px) {
  .content_section-about .about-bodyPara::after {
    background-image: url("/img/about-text-upper-w.svg");
  }
}
.content_section-about .about-bodyMarker {
  position: absolute;
  z-index: 0;
  display: block;
  background-color: #42f153;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 1000ms cubic-bezier(0.23, 1, 0.32, 1);
  transition-delay: calc(var(--revealDelay, 0s) + 1400ms);
}
.content_section-about .is-revealed > .about-bodyMarker {
  transform: scaleX(1);
}
@media screen and (max-width: 767px) {
  .content_section-about .about-bodyPara-01 {
    height: 22.6666666667vw;
  }
  .content_section-about .about-bodyPara-01::after {
    background-position: 0 0;
  }
  .content_section-about .about-bodyPara-01 .about-bodyMarker {
    left: 43.3333333333vw;
    top: 13.4666666667vw;
    width: 21.8666666667vw;
    height: 4.8vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-about .about-bodyPara-01 {
    height: 18vw;
  }
  .content_section-about .about-bodyPara-01::after {
    background-position: 0 0;
  }
  .content_section-about .about-bodyPara-01 .about-bodyMarker {
    left: 27.0833333333vw;
    top: 10.9166666667vw;
    width: 13.5833333333vw;
    height: 2.9166666667vw;
  }
}
@media screen and (max-width: 767px) {
  .content_section-about .about-bodyPara-02 {
    height: 49.6vw;
  }
  .content_section-about .about-bodyPara-02::after {
    background-position: 0 -22.6666666667vw;
  }
  .content_section-about .about-bodyPara-02 .about-bodyMarker {
    left: 28.2666666667vw;
    top: 19.0666666667vw;
    width: 33.3333333333vw;
    height: 4.8vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-about .about-bodyPara-02 {
    height: 39.6666666667vw;
  }
  .content_section-about .about-bodyPara-02::after {
    background-position: 0 -18vw;
  }
  .content_section-about .about-bodyPara-02 .about-bodyMarker {
    left: 17.6666666667vw;
    top: 15.5833333333vw;
    width: 20.8333333333vw;
    height: 2.9166666667vw;
  }
}
@media screen and (max-width: 767px) {
  .content_section-about .about-bodyPara-03 {
    height: 51.3333333333vw;
  }
  .content_section-about .about-bodyPara-03::after {
    background-position: 0 -72.2666666667vw;
  }
  .content_section-about .about-bodyPara-03 .about-bodyMarker {
    left: 13.6vw;
    top: 33.0666666667vw;
    width: 43.4666666667vw;
    height: 4.8vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-about .about-bodyPara-03 {
    height: 40.8333333333vw;
  }
  .content_section-about .about-bodyPara-03::after {
    background-position: 0 -57.6666666667vw;
  }
  .content_section-about .about-bodyPara-03 .about-bodyMarker {
    left: 8.75vw;
    top: 26.9166666667vw;
    width: 26.6666666667vw;
    height: 2.9166666667vw;
  }
}
.content_section-about .about-conceptText {
  position: relative;
}
@media screen and (max-width: 767px) {
  .content_section-about .about-conceptText img {
    aspect-ratio: 750/616;
  }
}
@media screen and (min-width: 768px) {
  .content_section-about .about-conceptText img {
    aspect-ratio: 1200/986;
  }
}
.content_section-about .about-conceptFront {
  --revealDelay: 800ms;
}
.content_section-about .about-conceptBack,
.content_section-about .about-conceptFront {
  position: absolute;
  left: 0;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .content_section-about .about-conceptBack,
  .content_section-about .about-conceptFront {
    top: 6.1333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-about .about-conceptBack,
  .content_section-about .about-conceptFront {
    top: 6.5vw;
  }
}
.content_section-about .about-body picture,
.content_section-about .about-concept picture {
  display: block;
}
.content_section-about .about-body img,
.content_section-about .about-concept img {
  display: block;
  width: 100%;
}

/* ===============
works
================== */
@media screen and (min-width: 768px) {
  .content_section-works .section-inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    padding: 0 3.3333333333vw;
    gap: 5.3333333333vw 0;
  }
}
.content_section-works .works-item {
  text-align: center;
}
@media screen and (min-width: 768px) {
  .content_section-works .works-item {
    width: 33.3333333333%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 1.25vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-item:nth-child(3n-2) .works-coverBg {
    margin-left: -3.3333333333vw;
    width: calc(100% + 3.3333333333vw);
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-item:nth-child(3n) .works-coverBg {
    margin-right: -3.3333333333vw;
    width: calc(100% + 3.3333333333vw);
  }
}
@media screen and (max-width: 767px) {
  .content_section-works .works-item + .works-item {
    margin-top: 19.3333333333vw;
  }
}
.content_section-works .works-lead {
  margin: 0;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  color: #fff;
  line-height: 1.5;
  margin-right: -0.431em;
  letter-spacing: 0.431em;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .content_section-works .works-lead {
    font-size: 2vw;
    line-height: 1.6;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-lead {
    font-size: 1.1666666667vw;
    order: 1;
  }
}
.content_section-works .works-leadTitle {
  text-transform: uppercase;
}
.content_section-works .works-visual {
  position: relative;
  margin-top: 3.3333333333vw;
}
@media screen and (min-width: 768px) {
  .content_section-works .works-visual {
    order: 3;
    position: static;
    margin-top: 5.4583333333vw;
  }
}
.content_section-works .works-coverBg {
  position: absolute;
  z-index: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  .content_section-works .works-coverBg {
    top: 34.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-coverBg {
    top: 2.6666666667vw;
    max-width: none;
  }
}
.content_section-works .works-coverBg img {
  display: block;
}
@media screen and (max-width: 767px) {
  .content_section-works .works-coverBg img {
    width: 100%;
    aspect-ratio: 752/333;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-coverBg img {
    width: auto;
    height: 4.1666666667vw;
  }
}
.content_section-works .works-cover {
  position: relative;
  z-index: 1;
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 767px) {
  .content_section-works .works-cover {
    width: 106.6666666667vw;
    margin-top: -28vw;
    margin-bottom: -30.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-cover {
    width: 60vw;
    margin-top: -18.3333333333vw;
    margin-bottom: -17.5vw;
  }
}
.content_section-works .works-coverImage {
  display: block;
  width: 100%;
}
.content_section-works .works-title {
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .content_section-works .works-title {
    width: 80vw;
    margin: 2.8vw auto 0;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-title {
    width: 25vw;
    margin: 1.5vw auto 0;
    order: 2;
  }
}
.content_section-works .works-titleImage {
  display: block;
  width: auto;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .content_section-works .works-titleImage {
    height: 9.0666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-titleImage {
    height: 2.9166666667vw;
  }
}
.content_section-works .works-title picture {
  display: block;
}
.content_section-works .works-spec {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  font-family: "Noto Serif JP", serif;
  font-weight: 200;
  color: #fff;
  text-align: justify;
  margin-top: 0;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .content_section-works .works-spec {
    margin-top: 1.3333333333vw;
    row-gap: 1.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-spec {
    margin-top: 3.3333333333vw;
    order: 5;
    border: 1px solid #fff;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .content_section-works .works-specLabel {
    border-right: 1px solid #fff;
    margin-right: 2.6666666667vw;
    padding-right: 2.6666666667vw;
    font-size: 3.3333333333vw;
    letter-spacing: 0.25em;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-specLabel {
    border: 1px solid #fff;
    font-size: 1.3333333333vw;
    padding: 0.6666666667vw;
    flex: 1;
    text-align: center;
  }
}
@media screen and (max-width: 767px) {
  .content_section-works .works-specLabel:last-of-type {
    border-right: 0;
    margin-right: 0;
    padding-right: 0;
    width: 100%;
    text-align: center;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-specLabel:last-of-type {
    width: 100%;
    text-align: center;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .content_section-works .works-plot {
    width: 78.6666666667vw;
    margin: 6.6666666667vw auto 0;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-plot {
    width: 27.5vw;
    order: 6;
    margin-top: 4.6666666667vw;
    padding-bottom: 3.75vw;
  }
}
.content_section-works .works-plotText {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  color: #fff;
  text-align: justify;
}
@media screen and (max-width: 767px) {
  .content_section-works .works-plotText {
    margin-top: 4.2666666667vw;
    font-size: 3.3333333333vw;
    line-height: 2.12;
    letter-spacing: 0.05em;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-plotText {
    margin-top: 1.5vw;
    font-size: 1.5vw;
    line-height: 1.75;
    letter-spacing: 0;
    text-align: left;
  }
}
.content_section-works .works-plotBody,
.content_section-works .works-plotOutro {
  margin: 0;
}
@media screen and (max-width: 767px) {
  .content_section-works .works-plotOutro {
    letter-spacing: 0.05em;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-plotOutro {
    letter-spacing: 0.1em;
  }
}
.content_section-works .works-plot picture {
  display: block;
}
.content_section-works .works-plotImage {
  display: block;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .content_section-works .works-plotImage {
    aspect-ratio: 590/130;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-plotImage {
    aspect-ratio: 481/150;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-actions,
  .content_section-works .works-comingsoon {
    margin-top: auto;
  }
}
.content_section-works .works-actions {
  display: flex;
  justify-content: space-between;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 767px) {
  .content_section-works .works-actions {
    width: 78.6666666667vw;
    margin-top: 7.6vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-actions {
    width: 100%;
    order: 7;
  }
}
.content_section-works .works-link {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background-repeat: no-repeat;
  background-color: #fff;
  background-origin: border-box;
  color: #ff0014;
  font-family: "Noto Serif JP", serif;
  font-weight: 200;
}
@media (hover: hover) and (pointer: fine) {
  .content_section-works .works-link {
    opacity: 1;
    transition: opacity 0.2s;
  }
  .content_section-works .works-link:hover {
    opacity: 0.5;
    transition: opacity 0.1s;
  }
}
@media screen and (max-width: 767px) {
  .content_section-works .works-link {
    width: 35.7333333333vw;
    height: 9.8666666667vw;
    background-image: url("/img/works-button-n.svg");
    background-size: 1.6vw auto;
    background-position: top 1.3333333333vw right 1.3333333333vw;
    font-size: 3.7333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-link {
    width: 13.3333333333vw;
    height: 3.5833333333vw;
    background-image: url("/img/works-button-w.svg");
    background-size: 0.8333333333vw auto;
    background-position: top 0.4166666667vw right 0.4166666667vw;
    font-size: 1.6666666667vw;
  }
}
.content_section-works .works-comingsoon {
  display: flex;
  align-items: center;
  justify-content: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  border: 1px solid #fff;
  background-origin: border-box;
  color: #fff;
  font-family: "Noto Serif JP", serif;
  font-weight: 200;
}
@media screen and (max-width: 767px) {
  .content_section-works .works-comingsoon {
    width: 78.6666666667vw;
    height: 9.8666666667vw;
    margin: 7.6vw auto 0;
    background-image: url("/img/works-button-n.svg");
    background-position: 0 -0.4vw;
    font-size: 3.7333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-works .works-comingsoon {
    width: 100%;
    height: 3.5833333333vw;
    margin-left: auto;
    margin-right: auto;
    background-image: url("/img/works-button-w.svg");
    background-position: 0 -0.3333333333vw;
    border-width: 2px;
    order: 7;
    font-size: 1.6666666667vw;
  }
}
.content_section-works .works-comingsoonUnreleased {
  border: 0;
  background: none;
  background-color: #000;
}
@media screen and (min-width: 768px) {
  .content_section-works .works-comingsoonUnreleased {
    margin-top: 3.75vw;
  }
}

/* ===============
closing
================== */
.content_section-closing {
  position: relative;
  overflow: visible;
}
@media screen and (max-width: 767px) {
  .content_section-closing {
    margin-top: 18.6666666667vw;
    padding-bottom: 37.0666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-closing {
    margin-top: 15.8333333333vw;
    padding-bottom: 45.0833333333vw;
  }
}
.content_section-closing .closing-visual picture {
  pointer-events: none;
  display: block;
}
.content_section-closing .closing-catch {
  position: absolute;
  margin: 0;
}
@media screen and (max-width: 767px) {
  .content_section-closing .closing-catch {
    left: 27.3333333333vw;
    top: 24.2666666667vw;
    width: 46.8vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-closing .closing-catch {
    left: 35.9166666667vw;
    top: 31.75vw;
    width: 28.0833333333vw;
  }
}
.content_section-closing .closing-catchLine {
  display: block;
  background-repeat: no-repeat;
  background-size: 100% auto;
  transition-duration: 2500ms;
}
@media screen and (max-width: 767px) {
  .content_section-closing .closing-catchLine {
    background-image: url("/img/closing-text-upper-n.svg");
  }
}
@media screen and (min-width: 768px) {
  .content_section-closing .closing-catchLine {
    background-image: url("/img/closing-text-upper-w.svg");
  }
}
.content_section-closing .closing-catchLine-01 {
  --revealDelay: 0s;
}
@media screen and (max-width: 767px) {
  .content_section-closing .closing-catchLine-01 {
    height: 7.3333333333vw;
    background-position: 0 0;
  }
}
@media screen and (min-width: 768px) {
  .content_section-closing .closing-catchLine-01 {
    height: 5.0833333333vw;
    background-position: 0 0;
  }
}
.content_section-closing .closing-catchLine-02 {
  --revealDelay: 900ms;
}
@media screen and (max-width: 767px) {
  .content_section-closing .closing-catchLine-02 {
    height: 11.7333333333vw;
    background-position: 0 -7.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-closing .closing-catchLine-02 {
    height: 8.3333333333vw;
    background-position: 0 -5.0833333333vw;
  }
}
.content_section-closing .closing-catchLine-03 {
  --revealDelay: 1800ms;
}
@media screen and (max-width: 767px) {
  .content_section-closing .closing-catchLine-03 {
    height: 11.7333333333vw;
    background-position: 0 -19.0666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-closing .closing-catchLine-03 {
    height: 8.3333333333vw;
    background-position: 0 -13.4166666667vw;
  }
}
.content_section-closing .closing-catchLine-04 {
  --revealDelay: 2700ms;
}
@media screen and (max-width: 767px) {
  .content_section-closing .closing-catchLine-04 {
    height: 7.4666666667vw;
    background-position: 0 -30.8vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-closing .closing-catchLine-04 {
    height: 5.1666666667vw;
    background-position: 0 -21.75vw;
  }
}
.content_section-closing .closing-title {
  position: absolute;
  margin: 0;
}
@media screen and (max-width: 767px) {
  .content_section-closing .closing-title {
    left: -1.3333333333vw;
    top: 152vw;
    width: 104.2666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-closing .closing-title {
    left: -0.3333333333vw;
    top: 137.6666666667vw;
    width: 103.5833333333vw;
  }
}
@media screen and (max-width: 767px) {
  .content_section-closing .closing-title img {
    aspect-ratio: 782/204;
  }
}
@media screen and (min-width: 768px) {
  .content_section-closing .closing-title img {
    aspect-ratio: 1243/324;
  }
}
.content_section-closing .closing-flower {
  position: absolute;
  display: block;
  background-repeat: no-repeat;
  transition: opacity 600ms cubic-bezier(0.4, 0, 0.2, 1), filter 600ms cubic-bezier(0.4, 0, 0.2, 1), translate 2400ms cubic-bezier(0.33, 1, 0.68, 1), rotate 2400ms cubic-bezier(0.33, 1, 0.68, 1);
  transition-delay: var(--revealDelay, 0s);
}
.content_section-closing .closing-flower.is-revealed {
  translate: 0 0;
  rotate: 0deg;
}
@media screen and (max-width: 767px) {
  .content_section-closing .closing-flower {
    background-image: url("/img/closing-flowers-n.png");
    background-image: image-set(url("/img/closing-flowers-n.webp") type("image/webp"), url("/img/closing-flowers-n.png") type("image/png"));
    background-size: 14.2666666667vw 23.8666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-closing .closing-flower {
    background-image: url("/img/closing-flowers-w.png");
    background-image: image-set(url("/img/closing-flowers-w.webp") type("image/webp") 1x, url("/img/closing-flowers-w-2x.webp") type("image/webp") 2x, url("/img/closing-flowers-w.png") type("image/png") 1x, url("/img/closing-flowers-w-2x.png") type("image/png") 2x);
    background-size: 15.1666666667vw 24.8333333333vw;
  }
}
.content_section-closing .closing-flower-rt {
  background-position: 0 0;
  rotate: -32deg;
}
@media screen and (max-width: 767px) {
  .content_section-closing .closing-flower-rt {
    left: 51.2vw;
    top: 211.8666666667vw;
    width: 14.2666666667vw;
    height: 13.6vw;
    translate: 3.4666666667vw -20vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-closing .closing-flower-rt {
    left: 54.5vw;
    top: 201.9166666667vw;
    width: 15.1666666667vw;
    height: 14.3333333333vw;
    translate: 2.8333333333vw -15.8333333333vw;
  }
}
.content_section-closing .closing-flower-lb {
  --revealDelay: 100ms;
  rotate: 13deg;
}
@media screen and (max-width: 767px) {
  .content_section-closing .closing-flower-lb {
    left: 43.6vw;
    top: 235.2vw;
    width: 10.9333333333vw;
    height: 10.2666666667vw;
    background-position: 0 -13.6vw;
    translate: -2.9333333333vw -17.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section-closing .closing-flower-lb {
    left: 41.5vw;
    top: 227.8333333333vw;
    width: 11.0833333333vw;
    height: 10.5vw;
    background-position: 0 -14.3333333333vw;
    translate: -2.3333333333vw -13.3333333333vw;
  }
}
@media (prefers-reduced-motion: reduce) {
  .content_section-closing .closing-flower {
    translate: none;
    rotate: none;
  }
}
.content_section-closing .closing-title picture {
  display: block;
}
.content_section-closing .closing-title img {
  display: block;
  width: 100%;
}
.content_section-closing .closing-visualImage {
  display: block;
  width: 100%;
}

/* ===============
share
================== */
.share-area {
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .share-area {
    margin-top: 10.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .share-area {
    margin-top: 14.5833333333vw;
  }
}

.share-link {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background-image: url("/img/share-icon-x.svg");
  background-repeat: no-repeat;
  background-color: #000;
  background-origin: border-box;
  color: #fff;
  font-family: "Noto Serif JP", serif;
  font-weight: 200;
  border-radius: 50vw;
}
@media (hover: hover) and (pointer: fine) {
  .share-link {
    opacity: 1;
    transition: opacity 0.2s;
  }
  .share-link:hover {
    opacity: 0.5;
    transition: opacity 0.1s;
  }
}
@media screen and (max-width: 767px) {
  .share-link {
    background-size: 4.6666666667vw auto;
    background-position: center left 6.6666666667vw;
    font-size: 3.2vw;
    padding: 1.6vw 6.6666666667vw 1.6vw 13.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .share-link {
    background-size: 2.9166666667vw auto;
    background-position: center left 4.1666666667vw;
    font-size: 2vw;
    padding: 1vw 4.1666666667vw 1vw 8.3333333333vw;
  }
}

/* ===============
footer
================== */
.content_section.content_section-footer {
  text-align: center;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .content_section.content_section-footer {
    padding: 10.6666666667vw 0 7.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section.content_section-footer {
    padding: 14.5833333333vw 0 12.0833333333vw;
  }
}
@media screen and (max-width: 767px) {
  .content_section.content_section-footer .footer-logo {
    width: 35.2vw;
    margin: 0 auto;
  }
}
@media screen and (min-width: 768px) {
  .content_section.content_section-footer .footer-logo {
    width: 22vw;
    margin: 0 0 0 38.5833333333vw;
  }
}
.content_section.content_section-footer .footer-logoLink {
  display: block;
}
@media (hover: hover) and (pointer: fine) {
  .content_section.content_section-footer .footer-logoLink {
    opacity: 1;
    transition: opacity 0.2s;
  }
  .content_section.content_section-footer .footer-logoLink:hover {
    opacity: 0.5;
    transition: opacity 0.1s;
  }
}
.content_section.content_section-footer .footer-logoImage {
  display: block;
  width: 100%;
  aspect-ratio: 264/63;
}
.content_section.content_section-footer .footer-copyright {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  line-height: 2.2;
  letter-spacing: 0.11em;
}
@media screen and (max-width: 767px) {
  .content_section.content_section-footer .footer-copyright {
    margin-top: 1.0666666667vw;
    font-size: 2.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .content_section.content_section-footer .footer-copyright {
    margin-top: 1vw;
    font-size: 1.6666666667vw;
  }
}

/* ===============
floating menu
================== */
.floating-menu {
  position: fixed;
  z-index: 20;
  right: 0;
}
@media screen and (max-width: 767px) {
  .floating-menu {
    top: 8.9333333333vw;
    width: 8.5333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .floating-menu {
    top: 15.2083333333vw;
    width: 5.6666666667vw;
  }
}

.floating-menuImage {
  display: block;
}
.floating-menuImage img {
  display: block;
  width: 100%;
}

.floating-menuLink {
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
}
.floating-menuLink::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #000;
  opacity: 0;
  transition: opacity 0.2s;
  -webkit-mask-image: url("/img/menu-mask-n.png");
  mask-image: url("/img/menu-mask-n.png");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
@media screen and (max-width: 767px) {
  .floating-menuLink::before {
    -webkit-mask-size: 8.5333333333vw 23.8666666667vw;
    mask-size: 8.5333333333vw 23.8666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .floating-menuLink::before {
    -webkit-mask-size: 5.6666666667vw 15.8333333333vw;
    mask-size: 5.6666666667vw 15.8333333333vw;
  }
}
@media (hover: hover) and (pointer: fine) {
  .floating-menuLink:hover::before {
    opacity: 0.4;
    transition: opacity 0.1s;
  }
}

.floating-menuLink-youtube {
  top: 0;
}
@media screen and (max-width: 767px) {
  .floating-menuLink-youtube {
    height: 11.2vw;
  }
}
@media screen and (min-width: 768px) {
  .floating-menuLink-youtube {
    height: 7.5vw;
  }
}
.floating-menuLink-youtube::before {
  -webkit-mask-position: 0 0;
  mask-position: 0 0;
}

@media screen and (max-width: 767px) {
  .floating-menuLink-x {
    top: 12.1333333333vw;
    height: 11.2vw;
  }
}
@media screen and (min-width: 768px) {
  .floating-menuLink-x {
    top: 8.0416666667vw;
    height: 7.5vw;
  }
}
@media screen and (max-width: 767px) {
  .floating-menuLink-x::before {
    -webkit-mask-position: 0 -12.1333333333vw;
    mask-position: 0 -12.1333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .floating-menuLink-x::before {
    -webkit-mask-position: 0 -8.0416666667vw;
    mask-position: 0 -8.0416666667vw;
  }
}

/* ===============
modal
================== */
.modal {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
  opacity: 0;
  transition: opacity 300ms ease;
}
.modal.is-visible {
  opacity: 1;
}
.modal:not([open]) {
  display: none;
}
.modal::backdrop {
  display: none;
}

.modal-inner {
  position: absolute;
}
@media screen and (max-width: 767px) {
  .modal-inner {
    inset: 2.1333333333vw 2.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .modal-inner {
    inset: 2.5vw;
  }
}
.modal-inner {
  display: flex;
  background-color: rgba(255, 0, 20, 0.9);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.modal-close {
  position: absolute;
  appearance: none;
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .modal-close {
    top: 4vw;
    right: 4.6666666667vw;
    width: 10vw;
    height: 10vw;
  }
}
@media screen and (min-width: 768px) {
  .modal-close {
    top: 2.375vw;
    right: 2.375vw;
    width: 6.8333333333vw;
    height: 6.8333333333vw;
  }
}
.modal-close::before, .modal-close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #42f153;
}
.modal-close::before {
  transform: rotate(45deg);
}
.modal-close::after {
  transform: rotate(-45deg);
}

.modal-content {
  width: 100%;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .modal-content {
    padding-bottom: 34.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .modal-content {
    padding-bottom: 0;
  }
}
.modal-content {
  text-align: center;
}

.modal-image {
  display: block;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .modal-image {
    width: 62.5333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .modal-image {
    width: 30.25vw;
  }
}
.modal-image img {
  display: block;
  width: 100%;
}

.modal-title {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 767px) {
  .modal-title {
    width: 41.3333333333vw;
    margin-top: 6.4vw;
  }
}
@media screen and (min-width: 768px) {
  .modal-title {
    width: 25.8333333333vw;
    margin-top: 2vw;
  }
}

.modal-title picture {
  display: block;
}

.modal-titleImage {
  display: block;
  width: 100%;
  aspect-ratio: 310/37;
}

.modal-action {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
@media (hover: hover) and (pointer: fine) {
  .modal-action {
    opacity: 1;
    transition: opacity 0.2s;
  }
  .modal-action:hover {
    opacity: 0.5;
    transition: opacity 0.1s;
  }
}
@media screen and (max-width: 767px) {
  .modal-action {
    width: 25.0666666667vw;
    margin-top: 4.2666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .modal-action {
    width: 16.3333333333vw;
    margin-top: 2.9166666667vw;
  }
}

.modal-action picture {
  display: block;
}

.modal-actionImage {
  display: block;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .modal-actionImage {
    aspect-ratio: 188/74;
  }
}
@media screen and (min-width: 768px) {
  .modal-actionImage {
    aspect-ratio: 196/66;
  }
}